@zag-js/color-picker 0.14.0 → 0.15.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +0 -2
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +0 -2
- package/dist/index.mjs.map +1 -1
- package/package.json +12 -12
- package/src/color-picker.anatomy.ts +0 -1
- package/src/color-picker.connect.ts +0 -1
package/dist/index.d.mts
CHANGED
|
@@ -5,7 +5,7 @@ export { Color, ColorAxes, ColorChannel, ColorFormat, ColorType } from '@zag-js/
|
|
|
5
5
|
import * as _zag_js_core from '@zag-js/core';
|
|
6
6
|
import { StateMachine } from '@zag-js/core';
|
|
7
7
|
|
|
8
|
-
declare const anatomy: _zag_js_anatomy.Anatomy<"area" | "areaThumb" | "areaGradient" | "channelSliderTrack" | "channelSliderTrackBackground" | "channelSliderThumb" | "channelInput" | "swatch" | "swatchBackground" | "content" | "label" | "
|
|
8
|
+
declare const anatomy: _zag_js_anatomy.Anatomy<"area" | "areaThumb" | "areaGradient" | "channelSliderTrack" | "channelSliderTrackBackground" | "channelSliderThumb" | "channelInput" | "swatch" | "swatchBackground" | "content" | "label" | "eyeDropperTrigger">;
|
|
9
9
|
|
|
10
10
|
type ColorChannelProps = {
|
|
11
11
|
channel: ColorChannel;
|
package/dist/index.d.ts
CHANGED
|
@@ -5,7 +5,7 @@ export { Color, ColorAxes, ColorChannel, ColorFormat, ColorType } from '@zag-js/
|
|
|
5
5
|
import * as _zag_js_core from '@zag-js/core';
|
|
6
6
|
import { StateMachine } from '@zag-js/core';
|
|
7
7
|
|
|
8
|
-
declare const anatomy: _zag_js_anatomy.Anatomy<"area" | "areaThumb" | "areaGradient" | "channelSliderTrack" | "channelSliderTrackBackground" | "channelSliderThumb" | "channelInput" | "swatch" | "swatchBackground" | "content" | "label" | "
|
|
8
|
+
declare const anatomy: _zag_js_anatomy.Anatomy<"area" | "areaThumb" | "areaGradient" | "channelSliderTrack" | "channelSliderTrackBackground" | "channelSliderThumb" | "channelInput" | "swatch" | "swatchBackground" | "content" | "label" | "eyeDropperTrigger">;
|
|
9
9
|
|
|
10
10
|
type ColorChannelProps = {
|
|
11
11
|
channel: ColorChannel;
|
package/dist/index.js
CHANGED
|
@@ -40,7 +40,6 @@ var anatomy = (0, import_anatomy.createAnatomy)("color-picker", [
|
|
|
40
40
|
"swatchBackground",
|
|
41
41
|
"content",
|
|
42
42
|
"label",
|
|
43
|
-
"hiddenInput",
|
|
44
43
|
"eyeDropperTrigger"
|
|
45
44
|
]);
|
|
46
45
|
var parts = anatomy.build();
|
|
@@ -701,7 +700,6 @@ function connect(state, send, normalize) {
|
|
|
701
700
|
});
|
|
702
701
|
},
|
|
703
702
|
hiddenInputProps: normalize.input({
|
|
704
|
-
...parts.hiddenInput.attrs,
|
|
705
703
|
type: "text",
|
|
706
704
|
disabled: isDisabled,
|
|
707
705
|
name: state.context.name,
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/color-picker.anatomy.ts","../src/color-picker.connect.ts","../src/color-picker.dom.ts","../src/utils/get-channel-details.ts","../src/utils/get-channel-display-color.ts","../src/utils/get-channel-input-value.ts","../src/utils/generate-format-background.ts","../src/utils/get-color-area-gradient.ts","../src/utils/get-slider-background.ts","../src/color-picker.machine.ts"],"sourcesContent":["export { anatomy } from \"./color-picker.anatomy\"\nexport { connect } from \"./color-picker.connect\"\nexport { machine } from \"./color-picker.machine\"\nexport type {\n Color,\n ColorAxes,\n ColorFormat,\n ColorAreaProps,\n ColorChannel,\n ColorChannelProps,\n ColorChannelInputProps,\n ColorSwatchProps,\n ColorType,\n UserDefinedContext as Context,\n PublicApi,\n} from \"./color-picker.types\"\n","import { createAnatomy } from \"@zag-js/anatomy\"\n\nexport const anatomy = createAnatomy(\"color-picker\", [\n \"area\",\n \"areaThumb\",\n \"areaGradient\",\n \"channelSliderTrack\",\n \"channelSliderTrackBackground\",\n \"channelSliderThumb\",\n \"channelInput\",\n \"swatch\",\n \"swatchBackground\",\n \"content\",\n \"label\",\n \"hiddenInput\",\n \"eyeDropperTrigger\",\n])\n\nexport const parts = anatomy.build()\n","import { normalizeColor, type Color, type ColorChannel, type ColorFormat } from \"@zag-js/color-utils\"\nimport {\n getEventKey,\n getEventPoint,\n getEventStep,\n getNativeEvent,\n isLeftClick,\n isModifiedEvent,\n type EventKeyMap,\n} from \"@zag-js/dom-event\"\nimport { dataAttr } from \"@zag-js/dom-query\"\nimport type { NormalizeProps, PropTypes } from \"@zag-js/types\"\nimport { visuallyHiddenStyle } from \"@zag-js/visually-hidden\"\nimport { parts } from \"./color-picker.anatomy\"\nimport { dom } from \"./color-picker.dom\"\nimport type {\n ColorAreaProps,\n ColorChannelInputProps,\n ColorChannelProps,\n ColorSwatchProps,\n PublicApi,\n Send,\n State,\n} from \"./color-picker.types\"\nimport { getChannelDetails } from \"./utils/get-channel-details\"\nimport { getChannelDisplayColor } from \"./utils/get-channel-display-color\"\nimport { getChannelInputRange, getChannelInputValue } from \"./utils/get-channel-input-value\"\nimport { getColorAreaGradient } from \"./utils/get-color-area-gradient\"\nimport { getSliderBgImage } from \"./utils/get-slider-background\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): PublicApi<T> {\n const valueAsColor = state.context.valueAsColor\n const value = state.context.value\n const isDisabled = state.context.disabled\n const isInteractive = state.context.isInteractive\n const isDragging = state.matches(\"dragging\")\n\n const channels = valueAsColor.getColorChannels()\n\n return {\n isDragging,\n value,\n valueAsColor,\n alpha: valueAsColor.getChannelValue(\"alpha\"),\n channels,\n\n setColor(value: string | Color) {\n send({ type: \"VALUE.SET\", value: normalizeColor(value), src: \"set-color\" })\n },\n\n setChannelValue(channel: ColorChannel, value: number) {\n const color = valueAsColor.withChannelValue(channel, value)\n send({ type: \"VALUE.SET\", value: color, src: \"set-channel\" })\n },\n\n setFormat(format: ColorFormat) {\n const value = valueAsColor.toFormat(format)\n send({ type: \"VALUE.SET\", value, src: \"set-format\" })\n },\n\n setAlpha(value: number) {\n const color = valueAsColor.withChannelValue(\"alpha\", value)\n send({ type: \"VALUE.SET\", value: color, src: \"set-alpha\" })\n },\n\n contentProps: normalize.element({\n ...parts.content.attrs,\n id: dom.getContentId(state.context),\n }),\n\n getAreaProps(props: ColorAreaProps) {\n const { xChannel, yChannel } = props\n const { areaStyles } = getColorAreaGradient(state.context, xChannel, yChannel)\n\n return normalize.element({\n ...parts.area.attrs,\n id: dom.getAreaId(state.context),\n role: \"group\",\n onPointerDown(event) {\n if (!isInteractive) return\n\n const evt = getNativeEvent(event)\n if (!isLeftClick(evt) || isModifiedEvent(evt)) return\n\n const point = getEventPoint(evt)\n const channel = { xChannel, yChannel }\n\n send({ type: \"AREA.POINTER_DOWN\", point, channel, id: \"area\" })\n },\n style: {\n position: \"relative\",\n touchAction: \"none\",\n forcedColorAdjust: \"none\",\n ...areaStyles,\n },\n })\n },\n\n getAreaGradientProps(props: ColorAreaProps) {\n const { xChannel, yChannel } = props\n const { areaGradientStyles } = getColorAreaGradient(state.context, xChannel, yChannel)\n\n return normalize.element({\n ...parts.areaGradient.attrs,\n id: dom.getAreaGradientId(state.context),\n style: {\n position: \"relative\",\n touchAction: \"none\",\n forcedColorAdjust: \"none\",\n ...areaGradientStyles,\n },\n })\n },\n\n getAreaThumbProps(props: ColorAreaProps) {\n const { xChannel, yChannel } = props\n const { getThumbPosition } = getChannelDetails(valueAsColor, xChannel, yChannel)\n const { x, y } = getThumbPosition()\n\n const channel = { xChannel, yChannel }\n\n return normalize.element({\n ...parts.areaThumb.attrs,\n id: dom.getAreaThumbId(state.context),\n tabIndex: isDisabled ? undefined : 0,\n \"data-disabled\": dataAttr(isDisabled),\n role: \"presentation\",\n style: {\n position: \"absolute\",\n left: `${x * 100}%`,\n top: `${y * 100}%`,\n transform: \"translate(-50%, -50%)\",\n touchAction: \"none\",\n forcedColorAdjust: \"none\",\n background: valueAsColor.withChannelValue(\"alpha\", 1).toString(\"css\"),\n },\n onBlur() {\n send(\"AREA.BLUR\")\n },\n onFocus() {\n send({ type: \"AREA.FOCUS\", id: \"area\" })\n },\n onKeyDown(event) {\n if (!isInteractive) return\n\n const step = getEventStep(event)\n\n const keyMap: EventKeyMap = {\n ArrowUp() {\n send({ type: \"AREA.ARROW_UP\", channel, step })\n },\n ArrowDown() {\n send({ type: \"AREA.ARROW_DOWN\", channel, step })\n },\n ArrowLeft() {\n send({ type: \"AREA.ARROW_LEFT\", channel, step })\n },\n ArrowRight() {\n send({ type: \"AREA.ARROW_RIGHT\", channel, step })\n },\n PageUp() {\n send({ type: \"AREA.PAGE_UP\", channel, step })\n },\n PageDown() {\n send({ type: \"AREA.PAGE_DOWN\", channel, step })\n },\n }\n\n const exec = keyMap[getEventKey(event, state.context)]\n\n if (exec) {\n exec(event)\n event.preventDefault()\n }\n },\n })\n },\n\n getChannelSliderTrackProps(props: ColorChannelProps) {\n const { orientation = \"horizontal\", channel } = props\n\n return normalize.element({\n ...parts.channelSliderTrack.attrs,\n id: dom.getChannelSliderTrackId(state.context, channel),\n role: \"group\",\n \"data-channel\": channel,\n \"data-orientation\": orientation,\n onPointerDown(event) {\n if (!isInteractive) return\n\n const evt = getNativeEvent(event)\n if (!isLeftClick(evt) || isModifiedEvent(evt)) return\n\n const point = getEventPoint(evt)\n send({ type: \"CHANNEL_SLIDER.POINTER_DOWN\", channel, point, id: channel, orientation })\n },\n style: {\n position: \"relative\",\n touchAction: \"none\",\n forcedColorAdjust: \"none\",\n backgroundImage: getSliderBgImage(state.context, { orientation, channel }),\n },\n })\n },\n\n getChannelSliderBackgroundProps(props: ColorChannelProps) {\n const { orientation = \"horizontal\", channel } = props\n return normalize.element({\n ...parts.channelSliderTrackBackground.attrs,\n \"data-orientation\": orientation,\n \"data-channel\": channel,\n style: {\n position: \"absolute\",\n backgroundColor: \"#fff\",\n backgroundImage: [\n \"linear-gradient(-45deg,#0000 75.5%,#bcbcbc 75.5%)\",\n \"linear-gradient(45deg,#0000 75.5%,#bcbcbc 75.5%)\",\n \"linear-gradient(-45deg,#bcbcbc 25.5%,#0000 25.5%)\",\n \"linear-gradient(45deg,#bcbcbc 25.5%,#0000 25.5%)\",\n ].join(\",\"),\n backgroundSize: \"16px 16px\",\n backgroundPosition: \"-2px -2px,-2px 6px,6px -10px,-10px -2px\",\n inset: 0,\n zIndex: -1,\n },\n })\n },\n\n getChannelSliderThumbProps(props: ColorChannelProps) {\n const { orientation = \"horizontal\", channel } = props\n const { minValue, maxValue, step: stepValue } = valueAsColor.getChannelRange(channel)\n const channelValue = valueAsColor.getChannelValue(channel)\n\n const offset = (channelValue - minValue) / (maxValue - minValue)\n\n const placementStyles =\n orientation === \"horizontal\"\n ? { left: `${offset * 100}%`, top: \"50%\" }\n : { top: `${offset * 100}%`, left: \"50%\" }\n\n return normalize.element({\n ...parts.channelSliderThumb.attrs,\n id: dom.getChannelSliderThumbId(state.context, channel),\n role: \"slider\",\n \"aria-label\": channel,\n tabIndex: isDisabled ? undefined : 0,\n \"data-channel\": channel,\n \"data-disabled\": dataAttr(isDisabled),\n \"data-orientation\": orientation,\n \"aria-disabled\": dataAttr(isDisabled),\n \"aria-orientation\": orientation,\n \"aria-valuemax\": maxValue,\n \"aria-valuemin\": minValue,\n \"aria-valuenow\": channelValue,\n style: {\n forcedColorAdjust: \"none\",\n position: \"absolute\",\n background: getChannelDisplayColor(valueAsColor, channel).toString(\"css\"),\n ...placementStyles,\n },\n onFocus() {\n if (!isInteractive) return\n send({ type: \"CHANNEL_SLIDER.FOCUS\", channel })\n },\n onBlur() {\n if (!isInteractive) return\n send({ type: \"CHANNEL_SLIDER.BLUR\", channel })\n },\n onKeyDown(event) {\n if (!isInteractive) return\n const step = getEventStep(event) * stepValue\n\n const keyMap: EventKeyMap = {\n ArrowUp() {\n send({ type: \"CHANNEL_SLIDER.ARROW_UP\", channel, step })\n },\n ArrowDown() {\n send({ type: \"CHANNEL_SLIDER.ARROW_DOWN\", channel, step })\n },\n ArrowLeft() {\n send({ type: \"CHANNEL_SLIDER.ARROW_LEFT\", channel, step })\n },\n ArrowRight() {\n send({ type: \"CHANNEL_SLIDER.ARROW_RIGHT\", channel, step })\n },\n PageUp() {\n send({ type: \"CHANNEL_SLIDER.PAGE_UP\", channel })\n },\n PageDown() {\n send({ type: \"CHANNEL_SLIDER.PAGE_DOWN\", channel })\n },\n Home() {\n send({ type: \"CHANNEL_SLIDER.HOME\", channel })\n },\n End() {\n send({ type: \"CHANNEL_SLIDER.END\", channel })\n },\n }\n\n const exec = keyMap[getEventKey(event, state.context)]\n\n if (exec) {\n exec(event)\n event.preventDefault()\n }\n },\n })\n },\n\n getChannelInputProps(props: ColorChannelInputProps) {\n const { channel } = props\n const isTextField = channel === \"hex\" || channel === \"css\"\n const range = getChannelInputRange(valueAsColor, channel)\n\n return normalize.input({\n ...parts.channelInput.attrs,\n type: isTextField ? \"text\" : \"number\",\n \"data-channel\": channel,\n \"aria-label\": channel,\n disabled: isDisabled,\n \"data-disabled\": dataAttr(isDisabled),\n readOnly: state.context.readOnly,\n id: dom.getChannelInputId(state.context, channel),\n defaultValue: getChannelInputValue(valueAsColor, channel),\n min: range?.minValue,\n max: range?.maxValue,\n step: range?.step,\n onFocus() {\n send({ type: \"CHANNEL_INPUT.FOCUS\", channel })\n },\n onChange(event) {\n if (isTextField) return\n const value = event.currentTarget.value\n send({ type: \"CHANNEL_INPUT.CHANGE\", channel, value, isTextField })\n },\n onBlur(event) {\n const value = event.currentTarget.value\n send({ type: \"CHANNEL_INPUT.BLUR\", channel, value, isTextField })\n },\n onKeyDown(event) {\n if (!isTextField) return\n if (event.key === \"Enter\") {\n const value = event.currentTarget.value\n send({ type: \"CHANNEL_INPUT.CHANGE\", channel, value, isTextField })\n }\n },\n style: {\n appearance: \"none\",\n WebkitAppearance: \"none\",\n MozAppearance: \"textfield\",\n },\n })\n },\n\n hiddenInputProps: normalize.input({\n ...parts.hiddenInput.attrs,\n type: \"text\",\n disabled: isDisabled,\n name: state.context.name,\n id: dom.getHiddenInputId(state.context),\n style: visuallyHiddenStyle,\n defaultValue: value,\n onChange(event) {\n const value = event.currentTarget.value\n send({ type: \"VALUE.SET\", value, src: \"input.change\" })\n },\n }),\n\n eyeDropperTriggerProps: normalize.button({\n ...parts.eyeDropperTrigger.attrs,\n disabled: isDisabled,\n \"data-disabled\": dataAttr(isDisabled),\n \"aria-label\": \"Pick a color from the screen\",\n onClick() {\n if (!isInteractive) return\n send(\"EYEDROPPER.CLICK\")\n },\n }),\n\n getSwatchBackgroundProps(props: ColorSwatchProps) {\n const { value } = props\n const alpha = normalizeColor(value).getChannelValue(\"alpha\")\n return normalize.element({\n ...parts.swatchBackground.attrs,\n \"data-alpha\": alpha,\n style: {\n width: \"100%\",\n height: \"100%\",\n background: \"#fff\",\n backgroundImage: [\n \"linear-gradient(-45deg,#0000 75.5%,#bcbcbc 75.5%)\",\n \"linear-gradient(45deg,#0000 75.5%,#bcbcbc 75.5%)\",\n \"linear-gradient(-45deg,#bcbcbc 25.5%,#0000 25.5%)\",\n \"linear-gradient(45deg,#bcbcbc 25.5%,#0000 25.5%)\",\n ].join(\",\"),\n backgroundPosition: \"-2px -2px,-2px 6px,6px -10px,-10px -2px\",\n backgroundSize: \"16px 16px\",\n position: \"absolute\",\n inset: \"0px\",\n zIndex: -1,\n },\n })\n },\n\n getSwatchProps(props: ColorSwatchProps) {\n const { value, readOnly } = props\n const color = normalizeColor(value).toFormat(valueAsColor.getColorSpace())\n return normalize.element({\n ...parts.swatch.attrs,\n onClick() {\n if (readOnly || !isInteractive) return\n send({ type: \"VALUE.SET\", value: color })\n },\n style: {\n position: \"relative\",\n background: color.toString(\"css\"),\n },\n })\n },\n }\n}\n","import type { ColorChannel } from \"@zag-js/color-utils\"\nimport { getRelativePoint, type Point } from \"@zag-js/dom-event\"\nimport { createScope, queryAll } from \"@zag-js/dom-query\"\nimport type { MachineContext as Ctx } from \"./color-picker.types\"\n\nexport const dom = createScope({\n getContentId: (ctx: Ctx) => ctx.ids?.content ?? `color-picker:${ctx.id}:content`,\n getAreaId: (ctx: Ctx) => ctx.ids?.area ?? `color-picker:${ctx.id}:area`,\n getAreaGradientId: (ctx: Ctx) => ctx.ids?.areaGradient ?? `color-picker:${ctx.id}:area-gradient`,\n getAreaThumbId: (ctx: Ctx) => ctx.ids?.areaThumb ?? `color-picker:${ctx.id}:area-thumb`,\n getChannelSliderTrackId: (ctx: Ctx, channel: ColorChannel) =>\n ctx.ids?.channelSliderTrack?.(channel) ?? `color-picker:${ctx.id}:slider-track:${channel}`,\n getChannelInputId: (ctx: Ctx, channel: string) =>\n ctx.ids?.channelInput?.(channel) ?? `color-picker:${ctx.id}:input:${channel}`,\n getChannelSliderThumbId: (ctx: Ctx, channel: ColorChannel) =>\n ctx.ids?.channelSliderThumb?.(channel) ?? `color-picker:${ctx.id}:slider-thumb:${channel}`,\n getHiddenInputId: (ctx: Ctx) => `color-picker:${ctx.id}:hidden-input`,\n\n getContentEl: (ctx: Ctx) => dom.getById(ctx, dom.getContentId(ctx)),\n getAreaThumbEl: (ctx: Ctx) => dom.getById(ctx, dom.getAreaThumbId(ctx)),\n getChannelSliderThumbEl: (ctx: Ctx, channel: ColorChannel) =>\n dom.getById(ctx, dom.getChannelSliderThumbId(ctx, channel)),\n getChannelInputEl: (ctx: Ctx, channel: string) =>\n dom.getById<HTMLInputElement>(ctx, dom.getChannelInputId(ctx, channel)),\n\n getHiddenInputEl: (ctx: Ctx) => dom.getById<HTMLInputElement>(ctx, dom.getHiddenInputId(ctx)),\n getAreaEl: (ctx: Ctx) => dom.getById(ctx, dom.getAreaId(ctx)),\n getAreaValueFromPoint(ctx: Ctx, point: Point) {\n const areaEl = dom.getAreaEl(ctx)\n if (!areaEl) return\n const { percent } = getRelativePoint(point, areaEl)\n return percent\n },\n\n getChannelSliderTrackEl: (ctx: Ctx, channel: ColorChannel) => {\n return dom.getById(ctx, dom.getChannelSliderTrackId(ctx, channel))\n },\n getChannelSliderValueFromPoint(ctx: Ctx, point: Point, channel: ColorChannel) {\n const trackEl = dom.getChannelSliderTrackEl(ctx, channel)\n if (!trackEl) return\n const { percent } = getRelativePoint(point, trackEl)\n return percent\n },\n getChannelInputEls: (ctx: Ctx) => {\n return queryAll<HTMLInputElement>(dom.getContentEl(ctx), \"input[data-channel]\")\n },\n})\n","import type { Color, ColorChannel } from \"@zag-js/color-utils\"\nimport { getPercentValue, snapValueToStep } from \"@zag-js/numeric-range\"\n\nexport function getChannelDetails(color: Color, xChannel: ColorChannel, yChannel: ColorChannel) {\n const channels = color.getColorSpaceAxes({ xChannel, yChannel })\n\n const xChannelRange = color.getChannelRange(channels.xChannel)\n const yChannelRange = color.getChannelRange(channels.yChannel)\n\n const { minValue: minValueX, maxValue: maxValueX, step: stepX, pageSize: pageSizeX } = xChannelRange\n const { minValue: minValueY, maxValue: maxValueY, step: stepY, pageSize: pageSizeY } = yChannelRange\n\n const xValue = color.getChannelValue(channels.xChannel)\n const yValue = color.getChannelValue(channels.yChannel)\n\n return {\n channels,\n xChannelStep: stepX,\n yChannelStep: stepY,\n xChannelPageStep: pageSizeX,\n yChannelPageStep: pageSizeY,\n xValue,\n yValue,\n getThumbPosition() {\n let x = (xValue - minValueX) / (maxValueX - minValueX)\n let y = 1 - (yValue - minValueY) / (maxValueY - minValueY)\n return { x, y }\n },\n incrementX(stepSize: number) {\n return xValue + stepSize > maxValueX ? maxValueX : snapValueToStep(xValue + stepSize, minValueX, maxValueX, stepX)\n },\n incrementY(stepSize: number) {\n return yValue + stepSize > maxValueY ? maxValueY : snapValueToStep(yValue + stepSize, minValueY, maxValueY, stepY)\n },\n decrementX(stepSize: number) {\n return snapValueToStep(xValue - stepSize, minValueX, maxValueX, stepX)\n },\n decrementY(stepSize: number) {\n return snapValueToStep(yValue - stepSize, minValueY, maxValueY, stepY)\n },\n getColorFromPoint(x: number, y: number) {\n let newXValue = getPercentValue(x, minValueX, maxValueX, stepX)\n let newYValue = getPercentValue(1 - y, minValueY, maxValueY, stepY)\n\n let newColor: Color | undefined\n\n if (newXValue !== xValue) {\n newXValue = snapValueToStep(newXValue, minValueX, maxValueX, stepX)\n newColor = color.withChannelValue(channels.xChannel, newXValue)\n }\n\n if (newYValue !== yValue) {\n newYValue = snapValueToStep(newYValue, minValueY, maxValueY, stepY)\n newColor = (newColor || color).withChannelValue(channels.yChannel, newYValue)\n }\n\n return newColor\n },\n }\n}\n","import { parseColor, type Color, type ColorChannel } from \"@zag-js/color-utils\"\n\nexport function getChannelDisplayColor(color: Color, channel: ColorChannel) {\n switch (channel) {\n case \"hue\":\n return parseColor(`hsl(${color.getChannelValue(\"hue\")}, 100%, 50%)`)\n case \"lightness\":\n case \"brightness\":\n case \"saturation\":\n case \"red\":\n case \"green\":\n case \"blue\":\n return color.withChannelValue(\"alpha\", 1)\n case \"alpha\": {\n return color\n }\n default:\n throw new Error(\"Unknown color channel: \" + channel)\n }\n}\n","import type { Color } from \"@zag-js/color-utils\"\nimport type { ExtendedColorChannel } from \"../color-picker.types\"\n\nexport function getChannelInputValue(color: Color, channel: ExtendedColorChannel) {\n switch (channel) {\n case \"hex\":\n return color.toString(\"hex\")\n case \"css\":\n return color.toString(\"css\")\n default:\n return color.getChannelValue(channel).toString()\n }\n}\n\nexport function getChannelInputRange(color: Color, channel: ExtendedColorChannel) {\n switch (channel) {\n case \"hex\":\n case \"css\":\n return undefined\n default:\n return color.getChannelRange(channel)\n }\n}\n","export const generateRGB_R = (orientation: [string, string], dir: boolean, zValue: number) => {\n const maskImage = `linear-gradient(to ${orientation[Number(!dir)]}, transparent, #000)`\n const result = {\n areaStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(${zValue},0,0),rgb(${zValue},255,0))`,\n },\n areaGradientStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(${zValue},0,255),rgb(${zValue},255,255))`,\n WebkitMaskImage: maskImage,\n maskImage,\n },\n }\n return result\n}\n\nexport const generateRGB_G = (orientation: [string, string], dir: boolean, zValue: number) => {\n const maskImage = `linear-gradient(to ${orientation[Number(!dir)]}, transparent, #000)`\n const result = {\n areaStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(0,${zValue},0),rgb(255,${zValue},0))`,\n },\n areaGradientStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(0,${zValue},255),rgb(255,${zValue},255))`,\n WebkitMaskImage: maskImage,\n maskImage,\n },\n }\n return result\n}\n\nexport const generateRGB_B = (orientation: [string, string], dir: boolean, zValue: number) => {\n const maskImage = `linear-gradient(to ${orientation[Number(!dir)]}, transparent, #000)`\n const result = {\n areaStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(0,0,${zValue}),rgb(255,0,${zValue}))`,\n },\n areaGradientStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(0,255,${zValue}),rgb(255,255,${zValue}))`,\n WebkitMaskImage: maskImage,\n maskImage,\n },\n }\n return result\n}\n\nexport const generateHSL_H = (orientation: [string, string], dir: boolean, zValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${\n orientation[Number(dir)]\n }, hsla(0,0%,0%,1) 0%, hsla(0,0%,0%,0) 50%, hsla(0,0%,100%,0) 50%, hsla(0,0%,100%,1) 100%)`,\n `linear-gradient(to ${orientation[Number(!dir)]},hsl(0,0%,50%),hsla(0,0%,50%,0))`,\n `hsl(${zValue}, 100%, 50%)`,\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSL_S = (orientation: [string, string], dir: boolean, alphaValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${\n orientation[Number(!dir)]\n }, hsla(0,0%,0%,${alphaValue}) 0%, hsla(0,0%,0%,0) 50%, hsla(0,0%,100%,0) 50%, hsla(0,0%,100%,${alphaValue}) 100%)`,\n `linear-gradient(to ${\n orientation[Number(dir)]\n },hsla(0,100%,50%,${alphaValue}),hsla(60,100%,50%,${alphaValue}),hsla(120,100%,50%,${alphaValue}),hsla(180,100%,50%,${alphaValue}),hsla(240,100%,50%,${alphaValue}),hsla(300,100%,50%,${alphaValue}),hsla(359,100%,50%,${alphaValue}))`,\n \"hsl(0, 0%, 50%)\",\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSL_L = (orientation: [string, string], dir: boolean, zValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n backgroundImage: [\n `linear-gradient(to ${orientation[Number(!dir)]},hsl(0,0%,${zValue}%),hsla(0,0%,${zValue}%,0))`,\n `linear-gradient(to ${\n orientation[Number(dir)]\n },hsl(0,100%,${zValue}%),hsl(60,100%,${zValue}%),hsl(120,100%,${zValue}%),hsl(180,100%,${zValue}%),hsl(240,100%,${zValue}%),hsl(300,100%,${zValue}%),hsl(360,100%,${zValue}%))`,\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSB_H = (orientation: [string, string], dir: boolean, zValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${orientation[Number(dir)]},hsl(0,0%,0%),hsla(0,0%,0%,0))`,\n `linear-gradient(to ${orientation[Number(!dir)]},hsl(0,0%,100%),hsla(0,0%,100%,0))`,\n `hsl(${zValue}, 100%, 50%)`,\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSB_S = (orientation: [string, string], dir: boolean, alphaValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${orientation[Number(!dir)]},hsla(0,0%,0%,${alphaValue}),hsla(0,0%,0%,0))`,\n `linear-gradient(to ${\n orientation[Number(dir)]\n },hsla(0,100%,50%,${alphaValue}),hsla(60,100%,50%,${alphaValue}),hsla(120,100%,50%,${alphaValue}),hsla(180,100%,50%,${alphaValue}),hsla(240,100%,50%,${alphaValue}),hsla(300,100%,50%,${alphaValue}),hsla(359,100%,50%,${alphaValue}))`,\n `linear-gradient(to ${orientation[Number(!dir)]},hsl(0,0%,0%),hsl(0,0%,100%))`,\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSB_B = (orientation: [string, string], dir: boolean, alphaValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${orientation[Number(!dir)]},hsla(0,0%,100%,${alphaValue}),hsla(0,0%,100%,0))`,\n `linear-gradient(to ${\n orientation[Number(dir)]\n },hsla(0,100%,50%,${alphaValue}),hsla(60,100%,50%,${alphaValue}),hsla(120,100%,50%,${alphaValue}),hsla(180,100%,50%,${alphaValue}),hsla(240,100%,50%,${alphaValue}),hsla(300,100%,50%,${alphaValue}),hsla(359,100%,50%,${alphaValue}))`,\n \"#000\",\n ].join(\",\"),\n },\n }\n return result\n}\n","import type { ColorChannel } from \"@zag-js/color-utils\"\nimport type { Style } from \"@zag-js/types\"\nimport type { MachineContext } from \"../color-picker.types\"\nimport {\n generateHSB_B,\n generateHSB_H,\n generateHSB_S,\n generateHSL_H,\n generateHSL_L,\n generateHSL_S,\n generateRGB_B,\n generateRGB_G,\n generateRGB_R,\n} from \"./generate-format-background\"\n\nexport function getColorAreaGradient(ctx: MachineContext, xChannel: ColorChannel, yChannel: ColorChannel) {\n const value = ctx.valueAsColor\n\n const { zChannel } = value.getColorSpaceAxes({ xChannel, yChannel })\n const zValue = value.getChannelValue(zChannel)\n\n const { minValue: zMin, maxValue: zMax } = value.getChannelRange(zChannel)\n const orientation: [string, string] = [\"top\", ctx.dir === \"rtl\" ? \"left\" : \"right\"]\n\n let dir = false\n let background = { areaStyles: {} as Style, areaGradientStyles: {} as Style }\n\n let alphaValue = (zValue - zMin) / (zMax - zMin)\n let isHSL = value.getColorSpace() === \"hsl\"\n\n switch (zChannel) {\n case \"red\": {\n dir = xChannel === \"green\"\n background = generateRGB_R(orientation, dir, zValue)\n break\n }\n\n case \"green\": {\n dir = xChannel === \"red\"\n background = generateRGB_G(orientation, dir, zValue)\n break\n }\n\n case \"blue\": {\n dir = xChannel === \"red\"\n background = generateRGB_B(orientation, dir, zValue)\n break\n }\n\n case \"hue\": {\n dir = xChannel !== \"saturation\"\n if (isHSL) {\n background = generateHSL_H(orientation, dir, zValue)\n } else {\n background = generateHSB_H(orientation, dir, zValue)\n }\n break\n }\n\n case \"saturation\": {\n dir = xChannel === \"hue\"\n if (isHSL) {\n background = generateHSL_S(orientation, dir, alphaValue)\n } else {\n background = generateHSB_S(orientation, dir, alphaValue)\n }\n break\n }\n\n case \"brightness\": {\n dir = xChannel === \"hue\"\n background = generateHSB_B(orientation, dir, alphaValue)\n break\n }\n\n case \"lightness\": {\n dir = xChannel === \"hue\"\n background = generateHSL_L(orientation, dir, zValue)\n break\n }\n }\n\n return background\n}\n","import type { ColorChannelProps, MachineContext } from \"../color-picker.types\"\n\nfunction getSliderBgDirection(orientation: \"vertical\" | \"horizontal\", dir: \"ltr\" | \"rtl\") {\n if (orientation === \"vertical\") {\n return \"top\"\n } else if (dir === \"ltr\") {\n return \"right\"\n } else {\n return \"left\"\n }\n}\n\nexport const getSliderBgImage = (ctx: MachineContext, props: Required<ColorChannelProps>) => {\n const { channel } = props\n\n const dir = getSliderBgDirection(props.orientation, ctx.dir!)\n const value = ctx.valueAsColor\n\n const { minValue, maxValue } = ctx.valueAsColor.getChannelRange(channel)\n\n switch (channel) {\n case \"hue\":\n return `linear-gradient(to ${dir}, rgb(255, 0, 0) 0%, rgb(255, 255, 0) 17%, rgb(0, 255, 0) 33%, rgb(0, 255, 255) 50%, rgb(0, 0, 255) 67%, rgb(255, 0, 255) 83%, rgb(255, 0, 0) 100%)`\n case \"lightness\": {\n let start = ctx.valueAsColor.withChannelValue(channel, minValue).toString(\"css\")\n let middle = value.withChannelValue(channel, (maxValue - minValue) / 2).toString(\"css\")\n let end = value.withChannelValue(channel, maxValue).toString(\"css\")\n return `linear-gradient(to ${dir}, ${start}, ${middle}, ${end})`\n }\n case \"saturation\":\n case \"brightness\":\n case \"red\":\n case \"green\":\n case \"blue\":\n case \"alpha\": {\n let start = value.withChannelValue(channel, minValue).toString(\"css\")\n let end = value.withChannelValue(channel, maxValue).toString(\"css\")\n return `linear-gradient(to ${dir}, ${start}, ${end})`\n }\n default:\n throw new Error(\"Unknown color channel: \" + channel)\n }\n}\n","import { parseColor, type Color } from \"@zag-js/color-utils\"\nimport { createMachine } from \"@zag-js/core\"\nimport { trackPointerMove } from \"@zag-js/dom-event\"\nimport { raf } from \"@zag-js/dom-query\"\nimport { trackFormControl } from \"@zag-js/form-utils\"\nimport { clampValue, getPercentValue, snapValueToStep } from \"@zag-js/numeric-range\"\nimport { disableTextSelection } from \"@zag-js/text-selection\"\nimport { compact } from \"@zag-js/utils\"\nimport { dom } from \"./color-picker.dom\"\nimport type { ExtendedColorChannel, MachineContext, MachineState, UserDefinedContext } from \"./color-picker.types\"\nimport { getChannelDetails } from \"./utils/get-channel-details\"\nimport { getChannelInputValue } from \"./utils/get-channel-input-value\"\n\nexport function machine(userContext: UserDefinedContext) {\n const ctx = compact(userContext)\n\n return createMachine<MachineContext, MachineState>(\n {\n id: \"color-picker\",\n initial: \"idle\",\n context: {\n dir: \"ltr\",\n activeId: null,\n activeChannel: null,\n activeOrientation: null,\n value: \"#D9D9D9\",\n ...ctx,\n },\n\n computed: {\n isRtl: (ctx) => ctx.dir === \"rtl\",\n isInteractive: (ctx) => !(ctx.disabled || ctx.readOnly),\n valueAsColor: (ctx) => parseColor(ctx.value),\n },\n\n on: {\n \"VALUE.SET\": {\n actions: [\"setValue\"],\n },\n },\n\n activities: [\"trackFormControl\"],\n\n watch: {\n value: [\"syncInputElements\", \"invokeOnChange\"],\n },\n\n states: {\n idle: {\n on: {\n \"EYEDROPPER.CLICK\": {\n actions: [\"openEyeDropper\"],\n },\n \"AREA.POINTER_DOWN\": {\n target: \"dragging\",\n actions: [\"setActiveChannel\", \"setAreaColorFromPoint\", \"focusAreaThumb\"],\n },\n \"AREA.FOCUS\": {\n target: \"focused\",\n actions: [\"setActiveChannel\"],\n },\n \"CHANNEL_SLIDER.POINTER_DOWN\": {\n target: \"dragging\",\n actions: [\"setActiveChannel\", \"setChannelColorFromPoint\", \"focusChannelThumb\"],\n },\n \"CHANNEL_SLIDER.FOCUS\": {\n target: \"focused\",\n actions: [\"setActiveChannel\"],\n },\n \"CHANNEL_INPUT.FOCUS\": {\n target: \"focused\",\n actions: [\"setActiveChannel\"],\n },\n \"CHANNEL_INPUT.CHANGE\": {\n actions: [\"setChannelColorFromInput\"],\n },\n },\n },\n\n focused: {\n on: {\n \"AREA.POINTER_DOWN\": {\n target: \"dragging\",\n actions: [\"setActiveChannel\", \"setAreaColorFromPoint\", \"focusAreaThumb\"],\n },\n \"CHANNEL_SLIDER.POINTER_DOWN\": {\n target: \"dragging\",\n actions: [\"setActiveChannel\", \"setChannelColorFromPoint\", \"focusChannelThumb\"],\n },\n \"AREA.ARROW_LEFT\": {\n actions: [\"decrementXChannel\"],\n },\n \"AREA.ARROW_RIGHT\": {\n actions: [\"incrementXChannel\"],\n },\n \"AREA.ARROW_UP\": {\n actions: [\"incrementYChannel\"],\n },\n \"AREA.ARROW_DOWN\": {\n actions: [\"decrementYChannel\"],\n },\n \"AREA.PAGE_UP\": {\n actions: [\"incrementXChannel\"],\n },\n \"AREA.PAGE_DOWN\": {\n actions: [\"decrementXChannel\"],\n },\n \"CHANNEL_SLIDER.ARROW_LEFT\": {\n actions: [\"decrementChannel\"],\n },\n \"CHANNEL_SLIDER.ARROW_RIGHT\": {\n actions: [\"incrementChannel\"],\n },\n \"CHANNEL_SLIDER.ARROW_UP\": {\n actions: [\"incrementChannel\"],\n },\n \"CHANNEL_SLIDER.ARROW_DOWN\": {\n actions: [\"decrementChannel\"],\n },\n \"CHANNEL_SLIDER.PAGE_UP\": {\n actions: [\"incrementChannel\"],\n },\n \"CHANNEL_SLIDER.PAGE_DOWN\": {\n actions: [\"decrementChannel\"],\n },\n \"CHANNEL_SLIDER.HOME\": {\n actions: [\"setChannelToMin\"],\n },\n \"CHANNEL_SLIDER.END\": {\n actions: [\"setChannelToMax\"],\n },\n \"CHANNEL_INPUT.FOCUS\": {\n actions: [\"setActiveChannel\"],\n },\n \"CHANNEL_INPUT.CHANGE\": {\n actions: [\"setChannelColorFromInput\"],\n },\n \"CHANNEL_INPUT.BLUR\": [\n {\n guard: \"isTextField\",\n target: \"idle\",\n actions: [\"setChannelColorFromInput\"],\n },\n { target: \"idle\" },\n ],\n \"CHANNEL_SLIDER.BLUR\": {\n target: \"idle\",\n },\n \"AREA.BLUR\": {\n target: \"idle\",\n },\n },\n },\n\n dragging: {\n exit: [\"clearActiveChannel\"],\n activities: [\"trackPointerMove\", \"disableTextSelection\"],\n on: {\n \"AREA.POINTER_MOVE\": {\n actions: [\"setAreaColorFromPoint\"],\n },\n \"AREA.POINTER_UP\": {\n target: \"focused\",\n actions: [\"invokeOnChangeEnd\"],\n },\n \"CHANNEL_SLIDER.POINTER_MOVE\": {\n actions: [\"setChannelColorFromPoint\"],\n },\n \"CHANNEL_SLIDER.POINTER_UP\": {\n target: \"focused\",\n actions: [\"invokeOnChangeEnd\"],\n },\n },\n },\n },\n },\n {\n guards: {\n isTextField: (_ctx, evt) => !!evt.isTextField,\n },\n activities: {\n trackFormControl(ctx, _evt, { send, initialContext }) {\n const inputEl = dom.getHiddenInputEl(ctx)\n return trackFormControl(inputEl, {\n onFieldsetDisabled() {\n ctx.disabled = true\n },\n onFormReset() {\n send({ type: \"VALUE.SET\", value: initialContext.value, src: \"form.reset\" })\n },\n })\n },\n trackPointerMove(ctx, _evt, { send }) {\n return trackPointerMove(dom.getDoc(ctx), {\n onPointerMove({ point }) {\n const type = ctx.activeId === \"area\" ? \"AREA.POINTER_MOVE\" : \"CHANNEL_SLIDER.POINTER_MOVE\"\n send({ type, point })\n },\n onPointerUp() {\n const type = ctx.activeId === \"area\" ? \"AREA.POINTER_UP\" : \"CHANNEL_SLIDER.POINTER_UP\"\n send({ type })\n },\n })\n },\n disableTextSelection(ctx) {\n return disableTextSelection({ doc: dom.getDoc(ctx), target: dom.getContentEl(ctx) })\n },\n },\n actions: {\n openEyeDropper(ctx) {\n const isSupported = \"EyeDropper\" in dom.getWin(ctx)\n if (!isSupported) return\n const win = dom.getWin(ctx) as any\n const picker = new win.EyeDropper()\n picker\n .open()\n .then(({ sRGBHex }: { sRGBHex: string }) => {\n const format = ctx.valueAsColor.getColorSpace()\n const color = parseColor(sRGBHex).toFormat(format)\n setColor(ctx, color)\n ctx.onChangeEnd?.({ value: ctx.value, valueAsColor: color })\n })\n .catch(() => void 0)\n },\n setActiveChannel(ctx, evt) {\n ctx.activeId = evt.id\n if (evt.channel) {\n ctx.activeChannel = evt.channel\n }\n if (evt.orientation) {\n ctx.activeOrientation = evt.orientation\n }\n },\n clearActiveChannel(ctx) {\n ctx.activeChannel = null\n ctx.activeId = null\n ctx.activeOrientation = null\n },\n setAreaColorFromPoint(ctx, evt) {\n const { xChannel, yChannel } = evt.channel || ctx.activeChannel\n\n const percent = dom.getAreaValueFromPoint(ctx, evt.point)\n if (!percent) return\n\n const { getColorFromPoint } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const color = getColorFromPoint(percent.x, percent.y)\n\n if (!color) return\n setColor(ctx, color)\n },\n setChannelColorFromPoint(ctx, evt) {\n const channel = evt.channel || ctx.activeId\n\n const percent = dom.getChannelSliderValueFromPoint(ctx, evt.point, channel)\n if (!percent) return\n\n const { minValue, maxValue, step } = ctx.valueAsColor.getChannelRange(channel)\n const orientation = ctx.activeOrientation || \"horizontal\"\n\n const point = orientation === \"horizontal\" ? percent.x : percent.y\n const channelValue = getPercentValue(point, minValue, maxValue, step)\n\n const value = snapValueToStep(channelValue - step, minValue, maxValue, step)\n const newColor = ctx.valueAsColor.withChannelValue(channel, value)\n\n setColor(ctx, newColor)\n },\n setValue(ctx, evt) {\n setColor(ctx, evt.value)\n },\n syncInputElements(ctx) {\n // sync channel inputs\n const inputs = dom.getChannelInputEls(ctx)\n inputs.forEach((input) => {\n const channel = input.dataset.channel as ExtendedColorChannel | null\n if (!channel) return\n input.value = getChannelInputValue(ctx.valueAsColor, channel)\n })\n\n // sync hidden input\n const hiddenInput = dom.getHiddenInputEl(ctx)\n if (!hiddenInput) return\n hiddenInput.value = ctx.value\n },\n setChannelColorFromInput(ctx, evt) {\n const { channel, isTextField, value } = evt\n try {\n const format = ctx.valueAsColor.getColorSpace()\n\n const newColor = isTextField\n ? parseColor(value).toFormat(format)\n : ctx.valueAsColor.withChannelValue(channel, value)\n\n setColor(ctx, newColor)\n //\n } catch {\n // reset input value\n const input = dom.getChannelInputEl(ctx, channel)\n if (!input) return\n input.value = getChannelInputValue(ctx.valueAsColor, channel)\n }\n },\n\n incrementChannel(ctx, evt) {\n const { minValue, maxValue, step } = ctx.valueAsColor.getChannelRange(evt.channel)\n const channelValue = ctx.valueAsColor.getChannelValue(evt.channel)\n const value = snapValueToStep(channelValue + evt.step, minValue, maxValue, step)\n const newColor = ctx.valueAsColor.withChannelValue(evt.channel, clampValue(value, minValue, maxValue))\n setColor(ctx, newColor)\n },\n decrementChannel(ctx, evt) {\n const { minValue, maxValue, step } = ctx.valueAsColor.getChannelRange(evt.channel)\n const channelValue = ctx.valueAsColor.getChannelValue(evt.channel)\n const value = snapValueToStep(channelValue - evt.step, minValue, maxValue, step)\n const newColor = ctx.valueAsColor.withChannelValue(evt.channel, clampValue(value, minValue, maxValue))\n setColor(ctx, newColor)\n },\n\n incrementXChannel(ctx, evt) {\n const { xChannel, yChannel } = evt.channel\n const { incrementX } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const newColor = ctx.valueAsColor.withChannelValue(xChannel, incrementX(evt.step))\n setColor(ctx, newColor)\n },\n decrementXChannel(ctx, evt) {\n const { xChannel, yChannel } = evt.channel\n const { decrementX } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const newColor = ctx.valueAsColor.withChannelValue(xChannel, decrementX(evt.step))\n setColor(ctx, newColor)\n },\n\n incrementYChannel(ctx, evt) {\n const { xChannel, yChannel } = evt.channel\n const { incrementY } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const newColor = ctx.valueAsColor.withChannelValue(yChannel, incrementY(evt.step))\n setColor(ctx, newColor)\n },\n decrementYChannel(ctx, evt) {\n const { xChannel, yChannel } = evt.channel\n const { decrementY } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const newColor = ctx.valueAsColor.withChannelValue(yChannel, decrementY(evt.step))\n setColor(ctx, newColor)\n },\n\n setChannelToMax(ctx, evt) {\n const { maxValue } = ctx.valueAsColor.getChannelRange(evt.channel)\n const newColor = ctx.valueAsColor.withChannelValue(evt.channel, maxValue)\n setColor(ctx, newColor)\n },\n setChannelToMin(ctx, evt) {\n const { minValue } = ctx.valueAsColor.getChannelRange(evt.channel)\n const newColor = ctx.valueAsColor.withChannelValue(evt.channel, minValue)\n setColor(ctx, newColor)\n },\n\n invokeOnChangeEnd(ctx) {\n ctx.onChangeEnd?.({ value: ctx.value, valueAsColor: ctx.valueAsColor })\n },\n invokeOnChange(ctx) {\n ctx.onChange?.({ value: ctx.value, valueAsColor: ctx.valueAsColor })\n },\n focusAreaThumb(ctx) {\n raf(() => {\n dom.getAreaThumbEl(ctx)?.focus({ preventScroll: true })\n })\n },\n focusChannelThumb(ctx, evt) {\n raf(() => {\n dom.getChannelSliderThumbEl(ctx, evt.channel)?.focus({ preventScroll: true })\n })\n },\n },\n },\n )\n}\n\nconst setColor = (ctx: MachineContext, color: Color) => {\n ctx.value = color.toString(\"css\")\n}\n"],"mappings":"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","names":["import_color_utils","import_dom_event","import_dom_query","value","import_color_utils","import_dom_event","import_dom_query","import_numeric_range","ctx"]}
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/color-picker.anatomy.ts","../src/color-picker.connect.ts","../src/color-picker.dom.ts","../src/utils/get-channel-details.ts","../src/utils/get-channel-display-color.ts","../src/utils/get-channel-input-value.ts","../src/utils/generate-format-background.ts","../src/utils/get-color-area-gradient.ts","../src/utils/get-slider-background.ts","../src/color-picker.machine.ts"],"sourcesContent":["export { anatomy } from \"./color-picker.anatomy\"\nexport { connect } from \"./color-picker.connect\"\nexport { machine } from \"./color-picker.machine\"\nexport type {\n Color,\n ColorAxes,\n ColorFormat,\n ColorAreaProps,\n ColorChannel,\n ColorChannelProps,\n ColorChannelInputProps,\n ColorSwatchProps,\n ColorType,\n UserDefinedContext as Context,\n PublicApi,\n} from \"./color-picker.types\"\n","import { createAnatomy } from \"@zag-js/anatomy\"\n\nexport const anatomy = createAnatomy(\"color-picker\", [\n \"area\",\n \"areaThumb\",\n \"areaGradient\",\n \"channelSliderTrack\",\n \"channelSliderTrackBackground\",\n \"channelSliderThumb\",\n \"channelInput\",\n \"swatch\",\n \"swatchBackground\",\n \"content\",\n \"label\",\n \"eyeDropperTrigger\",\n])\n\nexport const parts = anatomy.build()\n","import { normalizeColor, type Color, type ColorChannel, type ColorFormat } from \"@zag-js/color-utils\"\nimport {\n getEventKey,\n getEventPoint,\n getEventStep,\n getNativeEvent,\n isLeftClick,\n isModifiedEvent,\n type EventKeyMap,\n} from \"@zag-js/dom-event\"\nimport { dataAttr } from \"@zag-js/dom-query\"\nimport type { NormalizeProps, PropTypes } from \"@zag-js/types\"\nimport { visuallyHiddenStyle } from \"@zag-js/visually-hidden\"\nimport { parts } from \"./color-picker.anatomy\"\nimport { dom } from \"./color-picker.dom\"\nimport type {\n ColorAreaProps,\n ColorChannelInputProps,\n ColorChannelProps,\n ColorSwatchProps,\n PublicApi,\n Send,\n State,\n} from \"./color-picker.types\"\nimport { getChannelDetails } from \"./utils/get-channel-details\"\nimport { getChannelDisplayColor } from \"./utils/get-channel-display-color\"\nimport { getChannelInputRange, getChannelInputValue } from \"./utils/get-channel-input-value\"\nimport { getColorAreaGradient } from \"./utils/get-color-area-gradient\"\nimport { getSliderBgImage } from \"./utils/get-slider-background\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): PublicApi<T> {\n const valueAsColor = state.context.valueAsColor\n const value = state.context.value\n const isDisabled = state.context.disabled\n const isInteractive = state.context.isInteractive\n const isDragging = state.matches(\"dragging\")\n\n const channels = valueAsColor.getColorChannels()\n\n return {\n isDragging,\n value,\n valueAsColor,\n alpha: valueAsColor.getChannelValue(\"alpha\"),\n channels,\n\n setColor(value: string | Color) {\n send({ type: \"VALUE.SET\", value: normalizeColor(value), src: \"set-color\" })\n },\n\n setChannelValue(channel: ColorChannel, value: number) {\n const color = valueAsColor.withChannelValue(channel, value)\n send({ type: \"VALUE.SET\", value: color, src: \"set-channel\" })\n },\n\n setFormat(format: ColorFormat) {\n const value = valueAsColor.toFormat(format)\n send({ type: \"VALUE.SET\", value, src: \"set-format\" })\n },\n\n setAlpha(value: number) {\n const color = valueAsColor.withChannelValue(\"alpha\", value)\n send({ type: \"VALUE.SET\", value: color, src: \"set-alpha\" })\n },\n\n contentProps: normalize.element({\n ...parts.content.attrs,\n id: dom.getContentId(state.context),\n }),\n\n getAreaProps(props: ColorAreaProps) {\n const { xChannel, yChannel } = props\n const { areaStyles } = getColorAreaGradient(state.context, xChannel, yChannel)\n\n return normalize.element({\n ...parts.area.attrs,\n id: dom.getAreaId(state.context),\n role: \"group\",\n onPointerDown(event) {\n if (!isInteractive) return\n\n const evt = getNativeEvent(event)\n if (!isLeftClick(evt) || isModifiedEvent(evt)) return\n\n const point = getEventPoint(evt)\n const channel = { xChannel, yChannel }\n\n send({ type: \"AREA.POINTER_DOWN\", point, channel, id: \"area\" })\n },\n style: {\n position: \"relative\",\n touchAction: \"none\",\n forcedColorAdjust: \"none\",\n ...areaStyles,\n },\n })\n },\n\n getAreaGradientProps(props: ColorAreaProps) {\n const { xChannel, yChannel } = props\n const { areaGradientStyles } = getColorAreaGradient(state.context, xChannel, yChannel)\n\n return normalize.element({\n ...parts.areaGradient.attrs,\n id: dom.getAreaGradientId(state.context),\n style: {\n position: \"relative\",\n touchAction: \"none\",\n forcedColorAdjust: \"none\",\n ...areaGradientStyles,\n },\n })\n },\n\n getAreaThumbProps(props: ColorAreaProps) {\n const { xChannel, yChannel } = props\n const { getThumbPosition } = getChannelDetails(valueAsColor, xChannel, yChannel)\n const { x, y } = getThumbPosition()\n\n const channel = { xChannel, yChannel }\n\n return normalize.element({\n ...parts.areaThumb.attrs,\n id: dom.getAreaThumbId(state.context),\n tabIndex: isDisabled ? undefined : 0,\n \"data-disabled\": dataAttr(isDisabled),\n role: \"presentation\",\n style: {\n position: \"absolute\",\n left: `${x * 100}%`,\n top: `${y * 100}%`,\n transform: \"translate(-50%, -50%)\",\n touchAction: \"none\",\n forcedColorAdjust: \"none\",\n background: valueAsColor.withChannelValue(\"alpha\", 1).toString(\"css\"),\n },\n onBlur() {\n send(\"AREA.BLUR\")\n },\n onFocus() {\n send({ type: \"AREA.FOCUS\", id: \"area\" })\n },\n onKeyDown(event) {\n if (!isInteractive) return\n\n const step = getEventStep(event)\n\n const keyMap: EventKeyMap = {\n ArrowUp() {\n send({ type: \"AREA.ARROW_UP\", channel, step })\n },\n ArrowDown() {\n send({ type: \"AREA.ARROW_DOWN\", channel, step })\n },\n ArrowLeft() {\n send({ type: \"AREA.ARROW_LEFT\", channel, step })\n },\n ArrowRight() {\n send({ type: \"AREA.ARROW_RIGHT\", channel, step })\n },\n PageUp() {\n send({ type: \"AREA.PAGE_UP\", channel, step })\n },\n PageDown() {\n send({ type: \"AREA.PAGE_DOWN\", channel, step })\n },\n }\n\n const exec = keyMap[getEventKey(event, state.context)]\n\n if (exec) {\n exec(event)\n event.preventDefault()\n }\n },\n })\n },\n\n getChannelSliderTrackProps(props: ColorChannelProps) {\n const { orientation = \"horizontal\", channel } = props\n\n return normalize.element({\n ...parts.channelSliderTrack.attrs,\n id: dom.getChannelSliderTrackId(state.context, channel),\n role: \"group\",\n \"data-channel\": channel,\n \"data-orientation\": orientation,\n onPointerDown(event) {\n if (!isInteractive) return\n\n const evt = getNativeEvent(event)\n if (!isLeftClick(evt) || isModifiedEvent(evt)) return\n\n const point = getEventPoint(evt)\n send({ type: \"CHANNEL_SLIDER.POINTER_DOWN\", channel, point, id: channel, orientation })\n },\n style: {\n position: \"relative\",\n touchAction: \"none\",\n forcedColorAdjust: \"none\",\n backgroundImage: getSliderBgImage(state.context, { orientation, channel }),\n },\n })\n },\n\n getChannelSliderBackgroundProps(props: ColorChannelProps) {\n const { orientation = \"horizontal\", channel } = props\n return normalize.element({\n ...parts.channelSliderTrackBackground.attrs,\n \"data-orientation\": orientation,\n \"data-channel\": channel,\n style: {\n position: \"absolute\",\n backgroundColor: \"#fff\",\n backgroundImage: [\n \"linear-gradient(-45deg,#0000 75.5%,#bcbcbc 75.5%)\",\n \"linear-gradient(45deg,#0000 75.5%,#bcbcbc 75.5%)\",\n \"linear-gradient(-45deg,#bcbcbc 25.5%,#0000 25.5%)\",\n \"linear-gradient(45deg,#bcbcbc 25.5%,#0000 25.5%)\",\n ].join(\",\"),\n backgroundSize: \"16px 16px\",\n backgroundPosition: \"-2px -2px,-2px 6px,6px -10px,-10px -2px\",\n inset: 0,\n zIndex: -1,\n },\n })\n },\n\n getChannelSliderThumbProps(props: ColorChannelProps) {\n const { orientation = \"horizontal\", channel } = props\n const { minValue, maxValue, step: stepValue } = valueAsColor.getChannelRange(channel)\n const channelValue = valueAsColor.getChannelValue(channel)\n\n const offset = (channelValue - minValue) / (maxValue - minValue)\n\n const placementStyles =\n orientation === \"horizontal\"\n ? { left: `${offset * 100}%`, top: \"50%\" }\n : { top: `${offset * 100}%`, left: \"50%\" }\n\n return normalize.element({\n ...parts.channelSliderThumb.attrs,\n id: dom.getChannelSliderThumbId(state.context, channel),\n role: \"slider\",\n \"aria-label\": channel,\n tabIndex: isDisabled ? undefined : 0,\n \"data-channel\": channel,\n \"data-disabled\": dataAttr(isDisabled),\n \"data-orientation\": orientation,\n \"aria-disabled\": dataAttr(isDisabled),\n \"aria-orientation\": orientation,\n \"aria-valuemax\": maxValue,\n \"aria-valuemin\": minValue,\n \"aria-valuenow\": channelValue,\n style: {\n forcedColorAdjust: \"none\",\n position: \"absolute\",\n background: getChannelDisplayColor(valueAsColor, channel).toString(\"css\"),\n ...placementStyles,\n },\n onFocus() {\n if (!isInteractive) return\n send({ type: \"CHANNEL_SLIDER.FOCUS\", channel })\n },\n onBlur() {\n if (!isInteractive) return\n send({ type: \"CHANNEL_SLIDER.BLUR\", channel })\n },\n onKeyDown(event) {\n if (!isInteractive) return\n const step = getEventStep(event) * stepValue\n\n const keyMap: EventKeyMap = {\n ArrowUp() {\n send({ type: \"CHANNEL_SLIDER.ARROW_UP\", channel, step })\n },\n ArrowDown() {\n send({ type: \"CHANNEL_SLIDER.ARROW_DOWN\", channel, step })\n },\n ArrowLeft() {\n send({ type: \"CHANNEL_SLIDER.ARROW_LEFT\", channel, step })\n },\n ArrowRight() {\n send({ type: \"CHANNEL_SLIDER.ARROW_RIGHT\", channel, step })\n },\n PageUp() {\n send({ type: \"CHANNEL_SLIDER.PAGE_UP\", channel })\n },\n PageDown() {\n send({ type: \"CHANNEL_SLIDER.PAGE_DOWN\", channel })\n },\n Home() {\n send({ type: \"CHANNEL_SLIDER.HOME\", channel })\n },\n End() {\n send({ type: \"CHANNEL_SLIDER.END\", channel })\n },\n }\n\n const exec = keyMap[getEventKey(event, state.context)]\n\n if (exec) {\n exec(event)\n event.preventDefault()\n }\n },\n })\n },\n\n getChannelInputProps(props: ColorChannelInputProps) {\n const { channel } = props\n const isTextField = channel === \"hex\" || channel === \"css\"\n const range = getChannelInputRange(valueAsColor, channel)\n\n return normalize.input({\n ...parts.channelInput.attrs,\n type: isTextField ? \"text\" : \"number\",\n \"data-channel\": channel,\n \"aria-label\": channel,\n disabled: isDisabled,\n \"data-disabled\": dataAttr(isDisabled),\n readOnly: state.context.readOnly,\n id: dom.getChannelInputId(state.context, channel),\n defaultValue: getChannelInputValue(valueAsColor, channel),\n min: range?.minValue,\n max: range?.maxValue,\n step: range?.step,\n onFocus() {\n send({ type: \"CHANNEL_INPUT.FOCUS\", channel })\n },\n onChange(event) {\n if (isTextField) return\n const value = event.currentTarget.value\n send({ type: \"CHANNEL_INPUT.CHANGE\", channel, value, isTextField })\n },\n onBlur(event) {\n const value = event.currentTarget.value\n send({ type: \"CHANNEL_INPUT.BLUR\", channel, value, isTextField })\n },\n onKeyDown(event) {\n if (!isTextField) return\n if (event.key === \"Enter\") {\n const value = event.currentTarget.value\n send({ type: \"CHANNEL_INPUT.CHANGE\", channel, value, isTextField })\n }\n },\n style: {\n appearance: \"none\",\n WebkitAppearance: \"none\",\n MozAppearance: \"textfield\",\n },\n })\n },\n\n hiddenInputProps: normalize.input({\n type: \"text\",\n disabled: isDisabled,\n name: state.context.name,\n id: dom.getHiddenInputId(state.context),\n style: visuallyHiddenStyle,\n defaultValue: value,\n onChange(event) {\n const value = event.currentTarget.value\n send({ type: \"VALUE.SET\", value, src: \"input.change\" })\n },\n }),\n\n eyeDropperTriggerProps: normalize.button({\n ...parts.eyeDropperTrigger.attrs,\n disabled: isDisabled,\n \"data-disabled\": dataAttr(isDisabled),\n \"aria-label\": \"Pick a color from the screen\",\n onClick() {\n if (!isInteractive) return\n send(\"EYEDROPPER.CLICK\")\n },\n }),\n\n getSwatchBackgroundProps(props: ColorSwatchProps) {\n const { value } = props\n const alpha = normalizeColor(value).getChannelValue(\"alpha\")\n return normalize.element({\n ...parts.swatchBackground.attrs,\n \"data-alpha\": alpha,\n style: {\n width: \"100%\",\n height: \"100%\",\n background: \"#fff\",\n backgroundImage: [\n \"linear-gradient(-45deg,#0000 75.5%,#bcbcbc 75.5%)\",\n \"linear-gradient(45deg,#0000 75.5%,#bcbcbc 75.5%)\",\n \"linear-gradient(-45deg,#bcbcbc 25.5%,#0000 25.5%)\",\n \"linear-gradient(45deg,#bcbcbc 25.5%,#0000 25.5%)\",\n ].join(\",\"),\n backgroundPosition: \"-2px -2px,-2px 6px,6px -10px,-10px -2px\",\n backgroundSize: \"16px 16px\",\n position: \"absolute\",\n inset: \"0px\",\n zIndex: -1,\n },\n })\n },\n\n getSwatchProps(props: ColorSwatchProps) {\n const { value, readOnly } = props\n const color = normalizeColor(value).toFormat(valueAsColor.getColorSpace())\n return normalize.element({\n ...parts.swatch.attrs,\n onClick() {\n if (readOnly || !isInteractive) return\n send({ type: \"VALUE.SET\", value: color })\n },\n style: {\n position: \"relative\",\n background: color.toString(\"css\"),\n },\n })\n },\n }\n}\n","import type { ColorChannel } from \"@zag-js/color-utils\"\nimport { getRelativePoint, type Point } from \"@zag-js/dom-event\"\nimport { createScope, queryAll } from \"@zag-js/dom-query\"\nimport type { MachineContext as Ctx } from \"./color-picker.types\"\n\nexport const dom = createScope({\n getContentId: (ctx: Ctx) => ctx.ids?.content ?? `color-picker:${ctx.id}:content`,\n getAreaId: (ctx: Ctx) => ctx.ids?.area ?? `color-picker:${ctx.id}:area`,\n getAreaGradientId: (ctx: Ctx) => ctx.ids?.areaGradient ?? `color-picker:${ctx.id}:area-gradient`,\n getAreaThumbId: (ctx: Ctx) => ctx.ids?.areaThumb ?? `color-picker:${ctx.id}:area-thumb`,\n getChannelSliderTrackId: (ctx: Ctx, channel: ColorChannel) =>\n ctx.ids?.channelSliderTrack?.(channel) ?? `color-picker:${ctx.id}:slider-track:${channel}`,\n getChannelInputId: (ctx: Ctx, channel: string) =>\n ctx.ids?.channelInput?.(channel) ?? `color-picker:${ctx.id}:input:${channel}`,\n getChannelSliderThumbId: (ctx: Ctx, channel: ColorChannel) =>\n ctx.ids?.channelSliderThumb?.(channel) ?? `color-picker:${ctx.id}:slider-thumb:${channel}`,\n getHiddenInputId: (ctx: Ctx) => `color-picker:${ctx.id}:hidden-input`,\n\n getContentEl: (ctx: Ctx) => dom.getById(ctx, dom.getContentId(ctx)),\n getAreaThumbEl: (ctx: Ctx) => dom.getById(ctx, dom.getAreaThumbId(ctx)),\n getChannelSliderThumbEl: (ctx: Ctx, channel: ColorChannel) =>\n dom.getById(ctx, dom.getChannelSliderThumbId(ctx, channel)),\n getChannelInputEl: (ctx: Ctx, channel: string) =>\n dom.getById<HTMLInputElement>(ctx, dom.getChannelInputId(ctx, channel)),\n\n getHiddenInputEl: (ctx: Ctx) => dom.getById<HTMLInputElement>(ctx, dom.getHiddenInputId(ctx)),\n getAreaEl: (ctx: Ctx) => dom.getById(ctx, dom.getAreaId(ctx)),\n getAreaValueFromPoint(ctx: Ctx, point: Point) {\n const areaEl = dom.getAreaEl(ctx)\n if (!areaEl) return\n const { percent } = getRelativePoint(point, areaEl)\n return percent\n },\n\n getChannelSliderTrackEl: (ctx: Ctx, channel: ColorChannel) => {\n return dom.getById(ctx, dom.getChannelSliderTrackId(ctx, channel))\n },\n getChannelSliderValueFromPoint(ctx: Ctx, point: Point, channel: ColorChannel) {\n const trackEl = dom.getChannelSliderTrackEl(ctx, channel)\n if (!trackEl) return\n const { percent } = getRelativePoint(point, trackEl)\n return percent\n },\n getChannelInputEls: (ctx: Ctx) => {\n return queryAll<HTMLInputElement>(dom.getContentEl(ctx), \"input[data-channel]\")\n },\n})\n","import type { Color, ColorChannel } from \"@zag-js/color-utils\"\nimport { getPercentValue, snapValueToStep } from \"@zag-js/numeric-range\"\n\nexport function getChannelDetails(color: Color, xChannel: ColorChannel, yChannel: ColorChannel) {\n const channels = color.getColorSpaceAxes({ xChannel, yChannel })\n\n const xChannelRange = color.getChannelRange(channels.xChannel)\n const yChannelRange = color.getChannelRange(channels.yChannel)\n\n const { minValue: minValueX, maxValue: maxValueX, step: stepX, pageSize: pageSizeX } = xChannelRange\n const { minValue: minValueY, maxValue: maxValueY, step: stepY, pageSize: pageSizeY } = yChannelRange\n\n const xValue = color.getChannelValue(channels.xChannel)\n const yValue = color.getChannelValue(channels.yChannel)\n\n return {\n channels,\n xChannelStep: stepX,\n yChannelStep: stepY,\n xChannelPageStep: pageSizeX,\n yChannelPageStep: pageSizeY,\n xValue,\n yValue,\n getThumbPosition() {\n let x = (xValue - minValueX) / (maxValueX - minValueX)\n let y = 1 - (yValue - minValueY) / (maxValueY - minValueY)\n return { x, y }\n },\n incrementX(stepSize: number) {\n return xValue + stepSize > maxValueX ? maxValueX : snapValueToStep(xValue + stepSize, minValueX, maxValueX, stepX)\n },\n incrementY(stepSize: number) {\n return yValue + stepSize > maxValueY ? maxValueY : snapValueToStep(yValue + stepSize, minValueY, maxValueY, stepY)\n },\n decrementX(stepSize: number) {\n return snapValueToStep(xValue - stepSize, minValueX, maxValueX, stepX)\n },\n decrementY(stepSize: number) {\n return snapValueToStep(yValue - stepSize, minValueY, maxValueY, stepY)\n },\n getColorFromPoint(x: number, y: number) {\n let newXValue = getPercentValue(x, minValueX, maxValueX, stepX)\n let newYValue = getPercentValue(1 - y, minValueY, maxValueY, stepY)\n\n let newColor: Color | undefined\n\n if (newXValue !== xValue) {\n newXValue = snapValueToStep(newXValue, minValueX, maxValueX, stepX)\n newColor = color.withChannelValue(channels.xChannel, newXValue)\n }\n\n if (newYValue !== yValue) {\n newYValue = snapValueToStep(newYValue, minValueY, maxValueY, stepY)\n newColor = (newColor || color).withChannelValue(channels.yChannel, newYValue)\n }\n\n return newColor\n },\n }\n}\n","import { parseColor, type Color, type ColorChannel } from \"@zag-js/color-utils\"\n\nexport function getChannelDisplayColor(color: Color, channel: ColorChannel) {\n switch (channel) {\n case \"hue\":\n return parseColor(`hsl(${color.getChannelValue(\"hue\")}, 100%, 50%)`)\n case \"lightness\":\n case \"brightness\":\n case \"saturation\":\n case \"red\":\n case \"green\":\n case \"blue\":\n return color.withChannelValue(\"alpha\", 1)\n case \"alpha\": {\n return color\n }\n default:\n throw new Error(\"Unknown color channel: \" + channel)\n }\n}\n","import type { Color } from \"@zag-js/color-utils\"\nimport type { ExtendedColorChannel } from \"../color-picker.types\"\n\nexport function getChannelInputValue(color: Color, channel: ExtendedColorChannel) {\n switch (channel) {\n case \"hex\":\n return color.toString(\"hex\")\n case \"css\":\n return color.toString(\"css\")\n default:\n return color.getChannelValue(channel).toString()\n }\n}\n\nexport function getChannelInputRange(color: Color, channel: ExtendedColorChannel) {\n switch (channel) {\n case \"hex\":\n case \"css\":\n return undefined\n default:\n return color.getChannelRange(channel)\n }\n}\n","export const generateRGB_R = (orientation: [string, string], dir: boolean, zValue: number) => {\n const maskImage = `linear-gradient(to ${orientation[Number(!dir)]}, transparent, #000)`\n const result = {\n areaStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(${zValue},0,0),rgb(${zValue},255,0))`,\n },\n areaGradientStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(${zValue},0,255),rgb(${zValue},255,255))`,\n WebkitMaskImage: maskImage,\n maskImage,\n },\n }\n return result\n}\n\nexport const generateRGB_G = (orientation: [string, string], dir: boolean, zValue: number) => {\n const maskImage = `linear-gradient(to ${orientation[Number(!dir)]}, transparent, #000)`\n const result = {\n areaStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(0,${zValue},0),rgb(255,${zValue},0))`,\n },\n areaGradientStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(0,${zValue},255),rgb(255,${zValue},255))`,\n WebkitMaskImage: maskImage,\n maskImage,\n },\n }\n return result\n}\n\nexport const generateRGB_B = (orientation: [string, string], dir: boolean, zValue: number) => {\n const maskImage = `linear-gradient(to ${orientation[Number(!dir)]}, transparent, #000)`\n const result = {\n areaStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(0,0,${zValue}),rgb(255,0,${zValue}))`,\n },\n areaGradientStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(0,255,${zValue}),rgb(255,255,${zValue}))`,\n WebkitMaskImage: maskImage,\n maskImage,\n },\n }\n return result\n}\n\nexport const generateHSL_H = (orientation: [string, string], dir: boolean, zValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${\n orientation[Number(dir)]\n }, hsla(0,0%,0%,1) 0%, hsla(0,0%,0%,0) 50%, hsla(0,0%,100%,0) 50%, hsla(0,0%,100%,1) 100%)`,\n `linear-gradient(to ${orientation[Number(!dir)]},hsl(0,0%,50%),hsla(0,0%,50%,0))`,\n `hsl(${zValue}, 100%, 50%)`,\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSL_S = (orientation: [string, string], dir: boolean, alphaValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${\n orientation[Number(!dir)]\n }, hsla(0,0%,0%,${alphaValue}) 0%, hsla(0,0%,0%,0) 50%, hsla(0,0%,100%,0) 50%, hsla(0,0%,100%,${alphaValue}) 100%)`,\n `linear-gradient(to ${\n orientation[Number(dir)]\n },hsla(0,100%,50%,${alphaValue}),hsla(60,100%,50%,${alphaValue}),hsla(120,100%,50%,${alphaValue}),hsla(180,100%,50%,${alphaValue}),hsla(240,100%,50%,${alphaValue}),hsla(300,100%,50%,${alphaValue}),hsla(359,100%,50%,${alphaValue}))`,\n \"hsl(0, 0%, 50%)\",\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSL_L = (orientation: [string, string], dir: boolean, zValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n backgroundImage: [\n `linear-gradient(to ${orientation[Number(!dir)]},hsl(0,0%,${zValue}%),hsla(0,0%,${zValue}%,0))`,\n `linear-gradient(to ${\n orientation[Number(dir)]\n },hsl(0,100%,${zValue}%),hsl(60,100%,${zValue}%),hsl(120,100%,${zValue}%),hsl(180,100%,${zValue}%),hsl(240,100%,${zValue}%),hsl(300,100%,${zValue}%),hsl(360,100%,${zValue}%))`,\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSB_H = (orientation: [string, string], dir: boolean, zValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${orientation[Number(dir)]},hsl(0,0%,0%),hsla(0,0%,0%,0))`,\n `linear-gradient(to ${orientation[Number(!dir)]},hsl(0,0%,100%),hsla(0,0%,100%,0))`,\n `hsl(${zValue}, 100%, 50%)`,\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSB_S = (orientation: [string, string], dir: boolean, alphaValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${orientation[Number(!dir)]},hsla(0,0%,0%,${alphaValue}),hsla(0,0%,0%,0))`,\n `linear-gradient(to ${\n orientation[Number(dir)]\n },hsla(0,100%,50%,${alphaValue}),hsla(60,100%,50%,${alphaValue}),hsla(120,100%,50%,${alphaValue}),hsla(180,100%,50%,${alphaValue}),hsla(240,100%,50%,${alphaValue}),hsla(300,100%,50%,${alphaValue}),hsla(359,100%,50%,${alphaValue}))`,\n `linear-gradient(to ${orientation[Number(!dir)]},hsl(0,0%,0%),hsl(0,0%,100%))`,\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSB_B = (orientation: [string, string], dir: boolean, alphaValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${orientation[Number(!dir)]},hsla(0,0%,100%,${alphaValue}),hsla(0,0%,100%,0))`,\n `linear-gradient(to ${\n orientation[Number(dir)]\n },hsla(0,100%,50%,${alphaValue}),hsla(60,100%,50%,${alphaValue}),hsla(120,100%,50%,${alphaValue}),hsla(180,100%,50%,${alphaValue}),hsla(240,100%,50%,${alphaValue}),hsla(300,100%,50%,${alphaValue}),hsla(359,100%,50%,${alphaValue}))`,\n \"#000\",\n ].join(\",\"),\n },\n }\n return result\n}\n","import type { ColorChannel } from \"@zag-js/color-utils\"\nimport type { Style } from \"@zag-js/types\"\nimport type { MachineContext } from \"../color-picker.types\"\nimport {\n generateHSB_B,\n generateHSB_H,\n generateHSB_S,\n generateHSL_H,\n generateHSL_L,\n generateHSL_S,\n generateRGB_B,\n generateRGB_G,\n generateRGB_R,\n} from \"./generate-format-background\"\n\nexport function getColorAreaGradient(ctx: MachineContext, xChannel: ColorChannel, yChannel: ColorChannel) {\n const value = ctx.valueAsColor\n\n const { zChannel } = value.getColorSpaceAxes({ xChannel, yChannel })\n const zValue = value.getChannelValue(zChannel)\n\n const { minValue: zMin, maxValue: zMax } = value.getChannelRange(zChannel)\n const orientation: [string, string] = [\"top\", ctx.dir === \"rtl\" ? \"left\" : \"right\"]\n\n let dir = false\n let background = { areaStyles: {} as Style, areaGradientStyles: {} as Style }\n\n let alphaValue = (zValue - zMin) / (zMax - zMin)\n let isHSL = value.getColorSpace() === \"hsl\"\n\n switch (zChannel) {\n case \"red\": {\n dir = xChannel === \"green\"\n background = generateRGB_R(orientation, dir, zValue)\n break\n }\n\n case \"green\": {\n dir = xChannel === \"red\"\n background = generateRGB_G(orientation, dir, zValue)\n break\n }\n\n case \"blue\": {\n dir = xChannel === \"red\"\n background = generateRGB_B(orientation, dir, zValue)\n break\n }\n\n case \"hue\": {\n dir = xChannel !== \"saturation\"\n if (isHSL) {\n background = generateHSL_H(orientation, dir, zValue)\n } else {\n background = generateHSB_H(orientation, dir, zValue)\n }\n break\n }\n\n case \"saturation\": {\n dir = xChannel === \"hue\"\n if (isHSL) {\n background = generateHSL_S(orientation, dir, alphaValue)\n } else {\n background = generateHSB_S(orientation, dir, alphaValue)\n }\n break\n }\n\n case \"brightness\": {\n dir = xChannel === \"hue\"\n background = generateHSB_B(orientation, dir, alphaValue)\n break\n }\n\n case \"lightness\": {\n dir = xChannel === \"hue\"\n background = generateHSL_L(orientation, dir, zValue)\n break\n }\n }\n\n return background\n}\n","import type { ColorChannelProps, MachineContext } from \"../color-picker.types\"\n\nfunction getSliderBgDirection(orientation: \"vertical\" | \"horizontal\", dir: \"ltr\" | \"rtl\") {\n if (orientation === \"vertical\") {\n return \"top\"\n } else if (dir === \"ltr\") {\n return \"right\"\n } else {\n return \"left\"\n }\n}\n\nexport const getSliderBgImage = (ctx: MachineContext, props: Required<ColorChannelProps>) => {\n const { channel } = props\n\n const dir = getSliderBgDirection(props.orientation, ctx.dir!)\n const value = ctx.valueAsColor\n\n const { minValue, maxValue } = ctx.valueAsColor.getChannelRange(channel)\n\n switch (channel) {\n case \"hue\":\n return `linear-gradient(to ${dir}, rgb(255, 0, 0) 0%, rgb(255, 255, 0) 17%, rgb(0, 255, 0) 33%, rgb(0, 255, 255) 50%, rgb(0, 0, 255) 67%, rgb(255, 0, 255) 83%, rgb(255, 0, 0) 100%)`\n case \"lightness\": {\n let start = ctx.valueAsColor.withChannelValue(channel, minValue).toString(\"css\")\n let middle = value.withChannelValue(channel, (maxValue - minValue) / 2).toString(\"css\")\n let end = value.withChannelValue(channel, maxValue).toString(\"css\")\n return `linear-gradient(to ${dir}, ${start}, ${middle}, ${end})`\n }\n case \"saturation\":\n case \"brightness\":\n case \"red\":\n case \"green\":\n case \"blue\":\n case \"alpha\": {\n let start = value.withChannelValue(channel, minValue).toString(\"css\")\n let end = value.withChannelValue(channel, maxValue).toString(\"css\")\n return `linear-gradient(to ${dir}, ${start}, ${end})`\n }\n default:\n throw new Error(\"Unknown color channel: \" + channel)\n }\n}\n","import { parseColor, type Color } from \"@zag-js/color-utils\"\nimport { createMachine } from \"@zag-js/core\"\nimport { trackPointerMove } from \"@zag-js/dom-event\"\nimport { raf } from \"@zag-js/dom-query\"\nimport { trackFormControl } from \"@zag-js/form-utils\"\nimport { clampValue, getPercentValue, snapValueToStep } from \"@zag-js/numeric-range\"\nimport { disableTextSelection } from \"@zag-js/text-selection\"\nimport { compact } from \"@zag-js/utils\"\nimport { dom } from \"./color-picker.dom\"\nimport type { ExtendedColorChannel, MachineContext, MachineState, UserDefinedContext } from \"./color-picker.types\"\nimport { getChannelDetails } from \"./utils/get-channel-details\"\nimport { getChannelInputValue } from \"./utils/get-channel-input-value\"\n\nexport function machine(userContext: UserDefinedContext) {\n const ctx = compact(userContext)\n\n return createMachine<MachineContext, MachineState>(\n {\n id: \"color-picker\",\n initial: \"idle\",\n context: {\n dir: \"ltr\",\n activeId: null,\n activeChannel: null,\n activeOrientation: null,\n value: \"#D9D9D9\",\n ...ctx,\n },\n\n computed: {\n isRtl: (ctx) => ctx.dir === \"rtl\",\n isInteractive: (ctx) => !(ctx.disabled || ctx.readOnly),\n valueAsColor: (ctx) => parseColor(ctx.value),\n },\n\n on: {\n \"VALUE.SET\": {\n actions: [\"setValue\"],\n },\n },\n\n activities: [\"trackFormControl\"],\n\n watch: {\n value: [\"syncInputElements\", \"invokeOnChange\"],\n },\n\n states: {\n idle: {\n on: {\n \"EYEDROPPER.CLICK\": {\n actions: [\"openEyeDropper\"],\n },\n \"AREA.POINTER_DOWN\": {\n target: \"dragging\",\n actions: [\"setActiveChannel\", \"setAreaColorFromPoint\", \"focusAreaThumb\"],\n },\n \"AREA.FOCUS\": {\n target: \"focused\",\n actions: [\"setActiveChannel\"],\n },\n \"CHANNEL_SLIDER.POINTER_DOWN\": {\n target: \"dragging\",\n actions: [\"setActiveChannel\", \"setChannelColorFromPoint\", \"focusChannelThumb\"],\n },\n \"CHANNEL_SLIDER.FOCUS\": {\n target: \"focused\",\n actions: [\"setActiveChannel\"],\n },\n \"CHANNEL_INPUT.FOCUS\": {\n target: \"focused\",\n actions: [\"setActiveChannel\"],\n },\n \"CHANNEL_INPUT.CHANGE\": {\n actions: [\"setChannelColorFromInput\"],\n },\n },\n },\n\n focused: {\n on: {\n \"AREA.POINTER_DOWN\": {\n target: \"dragging\",\n actions: [\"setActiveChannel\", \"setAreaColorFromPoint\", \"focusAreaThumb\"],\n },\n \"CHANNEL_SLIDER.POINTER_DOWN\": {\n target: \"dragging\",\n actions: [\"setActiveChannel\", \"setChannelColorFromPoint\", \"focusChannelThumb\"],\n },\n \"AREA.ARROW_LEFT\": {\n actions: [\"decrementXChannel\"],\n },\n \"AREA.ARROW_RIGHT\": {\n actions: [\"incrementXChannel\"],\n },\n \"AREA.ARROW_UP\": {\n actions: [\"incrementYChannel\"],\n },\n \"AREA.ARROW_DOWN\": {\n actions: [\"decrementYChannel\"],\n },\n \"AREA.PAGE_UP\": {\n actions: [\"incrementXChannel\"],\n },\n \"AREA.PAGE_DOWN\": {\n actions: [\"decrementXChannel\"],\n },\n \"CHANNEL_SLIDER.ARROW_LEFT\": {\n actions: [\"decrementChannel\"],\n },\n \"CHANNEL_SLIDER.ARROW_RIGHT\": {\n actions: [\"incrementChannel\"],\n },\n \"CHANNEL_SLIDER.ARROW_UP\": {\n actions: [\"incrementChannel\"],\n },\n \"CHANNEL_SLIDER.ARROW_DOWN\": {\n actions: [\"decrementChannel\"],\n },\n \"CHANNEL_SLIDER.PAGE_UP\": {\n actions: [\"incrementChannel\"],\n },\n \"CHANNEL_SLIDER.PAGE_DOWN\": {\n actions: [\"decrementChannel\"],\n },\n \"CHANNEL_SLIDER.HOME\": {\n actions: [\"setChannelToMin\"],\n },\n \"CHANNEL_SLIDER.END\": {\n actions: [\"setChannelToMax\"],\n },\n \"CHANNEL_INPUT.FOCUS\": {\n actions: [\"setActiveChannel\"],\n },\n \"CHANNEL_INPUT.CHANGE\": {\n actions: [\"setChannelColorFromInput\"],\n },\n \"CHANNEL_INPUT.BLUR\": [\n {\n guard: \"isTextField\",\n target: \"idle\",\n actions: [\"setChannelColorFromInput\"],\n },\n { target: \"idle\" },\n ],\n \"CHANNEL_SLIDER.BLUR\": {\n target: \"idle\",\n },\n \"AREA.BLUR\": {\n target: \"idle\",\n },\n },\n },\n\n dragging: {\n exit: [\"clearActiveChannel\"],\n activities: [\"trackPointerMove\", \"disableTextSelection\"],\n on: {\n \"AREA.POINTER_MOVE\": {\n actions: [\"setAreaColorFromPoint\"],\n },\n \"AREA.POINTER_UP\": {\n target: \"focused\",\n actions: [\"invokeOnChangeEnd\"],\n },\n \"CHANNEL_SLIDER.POINTER_MOVE\": {\n actions: [\"setChannelColorFromPoint\"],\n },\n \"CHANNEL_SLIDER.POINTER_UP\": {\n target: \"focused\",\n actions: [\"invokeOnChangeEnd\"],\n },\n },\n },\n },\n },\n {\n guards: {\n isTextField: (_ctx, evt) => !!evt.isTextField,\n },\n activities: {\n trackFormControl(ctx, _evt, { send, initialContext }) {\n const inputEl = dom.getHiddenInputEl(ctx)\n return trackFormControl(inputEl, {\n onFieldsetDisabled() {\n ctx.disabled = true\n },\n onFormReset() {\n send({ type: \"VALUE.SET\", value: initialContext.value, src: \"form.reset\" })\n },\n })\n },\n trackPointerMove(ctx, _evt, { send }) {\n return trackPointerMove(dom.getDoc(ctx), {\n onPointerMove({ point }) {\n const type = ctx.activeId === \"area\" ? \"AREA.POINTER_MOVE\" : \"CHANNEL_SLIDER.POINTER_MOVE\"\n send({ type, point })\n },\n onPointerUp() {\n const type = ctx.activeId === \"area\" ? \"AREA.POINTER_UP\" : \"CHANNEL_SLIDER.POINTER_UP\"\n send({ type })\n },\n })\n },\n disableTextSelection(ctx) {\n return disableTextSelection({ doc: dom.getDoc(ctx), target: dom.getContentEl(ctx) })\n },\n },\n actions: {\n openEyeDropper(ctx) {\n const isSupported = \"EyeDropper\" in dom.getWin(ctx)\n if (!isSupported) return\n const win = dom.getWin(ctx) as any\n const picker = new win.EyeDropper()\n picker\n .open()\n .then(({ sRGBHex }: { sRGBHex: string }) => {\n const format = ctx.valueAsColor.getColorSpace()\n const color = parseColor(sRGBHex).toFormat(format)\n setColor(ctx, color)\n ctx.onChangeEnd?.({ value: ctx.value, valueAsColor: color })\n })\n .catch(() => void 0)\n },\n setActiveChannel(ctx, evt) {\n ctx.activeId = evt.id\n if (evt.channel) {\n ctx.activeChannel = evt.channel\n }\n if (evt.orientation) {\n ctx.activeOrientation = evt.orientation\n }\n },\n clearActiveChannel(ctx) {\n ctx.activeChannel = null\n ctx.activeId = null\n ctx.activeOrientation = null\n },\n setAreaColorFromPoint(ctx, evt) {\n const { xChannel, yChannel } = evt.channel || ctx.activeChannel\n\n const percent = dom.getAreaValueFromPoint(ctx, evt.point)\n if (!percent) return\n\n const { getColorFromPoint } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const color = getColorFromPoint(percent.x, percent.y)\n\n if (!color) return\n setColor(ctx, color)\n },\n setChannelColorFromPoint(ctx, evt) {\n const channel = evt.channel || ctx.activeId\n\n const percent = dom.getChannelSliderValueFromPoint(ctx, evt.point, channel)\n if (!percent) return\n\n const { minValue, maxValue, step } = ctx.valueAsColor.getChannelRange(channel)\n const orientation = ctx.activeOrientation || \"horizontal\"\n\n const point = orientation === \"horizontal\" ? percent.x : percent.y\n const channelValue = getPercentValue(point, minValue, maxValue, step)\n\n const value = snapValueToStep(channelValue - step, minValue, maxValue, step)\n const newColor = ctx.valueAsColor.withChannelValue(channel, value)\n\n setColor(ctx, newColor)\n },\n setValue(ctx, evt) {\n setColor(ctx, evt.value)\n },\n syncInputElements(ctx) {\n // sync channel inputs\n const inputs = dom.getChannelInputEls(ctx)\n inputs.forEach((input) => {\n const channel = input.dataset.channel as ExtendedColorChannel | null\n if (!channel) return\n input.value = getChannelInputValue(ctx.valueAsColor, channel)\n })\n\n // sync hidden input\n const hiddenInput = dom.getHiddenInputEl(ctx)\n if (!hiddenInput) return\n hiddenInput.value = ctx.value\n },\n setChannelColorFromInput(ctx, evt) {\n const { channel, isTextField, value } = evt\n try {\n const format = ctx.valueAsColor.getColorSpace()\n\n const newColor = isTextField\n ? parseColor(value).toFormat(format)\n : ctx.valueAsColor.withChannelValue(channel, value)\n\n setColor(ctx, newColor)\n //\n } catch {\n // reset input value\n const input = dom.getChannelInputEl(ctx, channel)\n if (!input) return\n input.value = getChannelInputValue(ctx.valueAsColor, channel)\n }\n },\n\n incrementChannel(ctx, evt) {\n const { minValue, maxValue, step } = ctx.valueAsColor.getChannelRange(evt.channel)\n const channelValue = ctx.valueAsColor.getChannelValue(evt.channel)\n const value = snapValueToStep(channelValue + evt.step, minValue, maxValue, step)\n const newColor = ctx.valueAsColor.withChannelValue(evt.channel, clampValue(value, minValue, maxValue))\n setColor(ctx, newColor)\n },\n decrementChannel(ctx, evt) {\n const { minValue, maxValue, step } = ctx.valueAsColor.getChannelRange(evt.channel)\n const channelValue = ctx.valueAsColor.getChannelValue(evt.channel)\n const value = snapValueToStep(channelValue - evt.step, minValue, maxValue, step)\n const newColor = ctx.valueAsColor.withChannelValue(evt.channel, clampValue(value, minValue, maxValue))\n setColor(ctx, newColor)\n },\n\n incrementXChannel(ctx, evt) {\n const { xChannel, yChannel } = evt.channel\n const { incrementX } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const newColor = ctx.valueAsColor.withChannelValue(xChannel, incrementX(evt.step))\n setColor(ctx, newColor)\n },\n decrementXChannel(ctx, evt) {\n const { xChannel, yChannel } = evt.channel\n const { decrementX } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const newColor = ctx.valueAsColor.withChannelValue(xChannel, decrementX(evt.step))\n setColor(ctx, newColor)\n },\n\n incrementYChannel(ctx, evt) {\n const { xChannel, yChannel } = evt.channel\n const { incrementY } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const newColor = ctx.valueAsColor.withChannelValue(yChannel, incrementY(evt.step))\n setColor(ctx, newColor)\n },\n decrementYChannel(ctx, evt) {\n const { xChannel, yChannel } = evt.channel\n const { decrementY } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const newColor = ctx.valueAsColor.withChannelValue(yChannel, decrementY(evt.step))\n setColor(ctx, newColor)\n },\n\n setChannelToMax(ctx, evt) {\n const { maxValue } = ctx.valueAsColor.getChannelRange(evt.channel)\n const newColor = ctx.valueAsColor.withChannelValue(evt.channel, maxValue)\n setColor(ctx, newColor)\n },\n setChannelToMin(ctx, evt) {\n const { minValue } = ctx.valueAsColor.getChannelRange(evt.channel)\n const newColor = ctx.valueAsColor.withChannelValue(evt.channel, minValue)\n setColor(ctx, newColor)\n },\n\n invokeOnChangeEnd(ctx) {\n ctx.onChangeEnd?.({ value: ctx.value, valueAsColor: ctx.valueAsColor })\n },\n invokeOnChange(ctx) {\n ctx.onChange?.({ value: ctx.value, valueAsColor: ctx.valueAsColor })\n },\n focusAreaThumb(ctx) {\n raf(() => {\n dom.getAreaThumbEl(ctx)?.focus({ preventScroll: true })\n })\n },\n focusChannelThumb(ctx, evt) {\n raf(() => {\n dom.getChannelSliderThumbEl(ctx, evt.channel)?.focus({ preventScroll: true })\n })\n },\n },\n },\n )\n}\n\nconst setColor = (ctx: MachineContext, color: Color) => {\n ctx.value = color.toString(\"css\")\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,qBAA8B;AAEvB,IAAM,cAAU,8BAAc,gBAAgB;AAAA,EACnD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC;AAEM,IAAM,QAAQ,QAAQ,MAAM;;;ACjBnC,IAAAA,sBAAgF;AAChF,IAAAC,oBAQO;AACP,IAAAC,oBAAyB;AAEzB,6BAAoC;;;ACXpC,uBAA6C;AAC7C,uBAAsC;AAG/B,IAAM,UAAM,8BAAY;AAAA,EAC7B,cAAc,CAAC,QAAa,IAAI,KAAK,WAAW,gBAAgB,IAAI,EAAE;AAAA,EACtE,WAAW,CAAC,QAAa,IAAI,KAAK,QAAQ,gBAAgB,IAAI,EAAE;AAAA,EAChE,mBAAmB,CAAC,QAAa,IAAI,KAAK,gBAAgB,gBAAgB,IAAI,EAAE;AAAA,EAChF,gBAAgB,CAAC,QAAa,IAAI,KAAK,aAAa,gBAAgB,IAAI,EAAE;AAAA,EAC1E,yBAAyB,CAAC,KAAU,YAClC,IAAI,KAAK,qBAAqB,OAAO,KAAK,gBAAgB,IAAI,EAAE,iBAAiB,OAAO;AAAA,EAC1F,mBAAmB,CAAC,KAAU,YAC5B,IAAI,KAAK,eAAe,OAAO,KAAK,gBAAgB,IAAI,EAAE,UAAU,OAAO;AAAA,EAC7E,yBAAyB,CAAC,KAAU,YAClC,IAAI,KAAK,qBAAqB,OAAO,KAAK,gBAAgB,IAAI,EAAE,iBAAiB,OAAO;AAAA,EAC1F,kBAAkB,CAAC,QAAa,gBAAgB,IAAI,EAAE;AAAA,EAEtD,cAAc,CAAC,QAAa,IAAI,QAAQ,KAAK,IAAI,aAAa,GAAG,CAAC;AAAA,EAClE,gBAAgB,CAAC,QAAa,IAAI,QAAQ,KAAK,IAAI,eAAe,GAAG,CAAC;AAAA,EACtE,yBAAyB,CAAC,KAAU,YAClC,IAAI,QAAQ,KAAK,IAAI,wBAAwB,KAAK,OAAO,CAAC;AAAA,EAC5D,mBAAmB,CAAC,KAAU,YAC5B,IAAI,QAA0B,KAAK,IAAI,kBAAkB,KAAK,OAAO,CAAC;AAAA,EAExE,kBAAkB,CAAC,QAAa,IAAI,QAA0B,KAAK,IAAI,iBAAiB,GAAG,CAAC;AAAA,EAC5F,WAAW,CAAC,QAAa,IAAI,QAAQ,KAAK,IAAI,UAAU,GAAG,CAAC;AAAA,EAC5D,sBAAsB,KAAU,OAAc;AAC5C,UAAM,SAAS,IAAI,UAAU,GAAG;AAChC,QAAI,CAAC;AAAQ;AACb,UAAM,EAAE,QAAQ,QAAI,mCAAiB,OAAO,MAAM;AAClD,WAAO;AAAA,EACT;AAAA,EAEA,yBAAyB,CAAC,KAAU,YAA0B;AAC5D,WAAO,IAAI,QAAQ,KAAK,IAAI,wBAAwB,KAAK,OAAO,CAAC;AAAA,EACnE;AAAA,EACA,+BAA+B,KAAU,OAAc,SAAuB;AAC5E,UAAM,UAAU,IAAI,wBAAwB,KAAK,OAAO;AACxD,QAAI,CAAC;AAAS;AACd,UAAM,EAAE,QAAQ,QAAI,mCAAiB,OAAO,OAAO;AACnD,WAAO;AAAA,EACT;AAAA,EACA,oBAAoB,CAAC,QAAa;AAChC,eAAO,2BAA2B,IAAI,aAAa,GAAG,GAAG,qBAAqB;AAAA,EAChF;AACF,CAAC;;;AC7CD,2BAAiD;AAE1C,SAAS,kBAAkB,OAAc,UAAwB,UAAwB;AAC9F,QAAM,WAAW,MAAM,kBAAkB,EAAE,UAAU,SAAS,CAAC;AAE/D,QAAM,gBAAgB,MAAM,gBAAgB,SAAS,QAAQ;AAC7D,QAAM,gBAAgB,MAAM,gBAAgB,SAAS,QAAQ;AAE7D,QAAM,EAAE,UAAU,WAAW,UAAU,WAAW,MAAM,OAAO,UAAU,UAAU,IAAI;AACvF,QAAM,EAAE,UAAU,WAAW,UAAU,WAAW,MAAM,OAAO,UAAU,UAAU,IAAI;AAEvF,QAAM,SAAS,MAAM,gBAAgB,SAAS,QAAQ;AACtD,QAAM,SAAS,MAAM,gBAAgB,SAAS,QAAQ;AAEtD,SAAO;AAAA,IACL;AAAA,IACA,cAAc;AAAA,IACd,cAAc;AAAA,IACd,kBAAkB;AAAA,IAClB,kBAAkB;AAAA,IAClB;AAAA,IACA;AAAA,IACA,mBAAmB;AACjB,UAAI,KAAK,SAAS,cAAc,YAAY;AAC5C,UAAI,IAAI,KAAK,SAAS,cAAc,YAAY;AAChD,aAAO,EAAE,GAAG,EAAE;AAAA,IAChB;AAAA,IACA,WAAW,UAAkB;AAC3B,aAAO,SAAS,WAAW,YAAY,gBAAY,sCAAgB,SAAS,UAAU,WAAW,WAAW,KAAK;AAAA,IACnH;AAAA,IACA,WAAW,UAAkB;AAC3B,aAAO,SAAS,WAAW,YAAY,gBAAY,sCAAgB,SAAS,UAAU,WAAW,WAAW,KAAK;AAAA,IACnH;AAAA,IACA,WAAW,UAAkB;AAC3B,iBAAO,sCAAgB,SAAS,UAAU,WAAW,WAAW,KAAK;AAAA,IACvE;AAAA,IACA,WAAW,UAAkB;AAC3B,iBAAO,sCAAgB,SAAS,UAAU,WAAW,WAAW,KAAK;AAAA,IACvE;AAAA,IACA,kBAAkB,GAAW,GAAW;AACtC,UAAI,gBAAY,sCAAgB,GAAG,WAAW,WAAW,KAAK;AAC9D,UAAI,gBAAY,sCAAgB,IAAI,GAAG,WAAW,WAAW,KAAK;AAElE,UAAI;AAEJ,UAAI,cAAc,QAAQ;AACxB,wBAAY,sCAAgB,WAAW,WAAW,WAAW,KAAK;AAClE,mBAAW,MAAM,iBAAiB,SAAS,UAAU,SAAS;AAAA,MAChE;AAEA,UAAI,cAAc,QAAQ;AACxB,wBAAY,sCAAgB,WAAW,WAAW,WAAW,KAAK;AAClE,oBAAY,YAAY,OAAO,iBAAiB,SAAS,UAAU,SAAS;AAAA,MAC9E;AAEA,aAAO;AAAA,IACT;AAAA,EACF;AACF;;;AC3DA,yBAA0D;AAEnD,SAAS,uBAAuB,OAAc,SAAuB;AAC1E,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,iBAAO,+BAAW,OAAO,MAAM,gBAAgB,KAAK,CAAC,cAAc;AAAA,IACrE,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACH,aAAO,MAAM,iBAAiB,SAAS,CAAC;AAAA,IAC1C,KAAK,SAAS;AACZ,aAAO;AAAA,IACT;AAAA,IACA;AACE,YAAM,IAAI,MAAM,4BAA4B,OAAO;AAAA,EACvD;AACF;;;AChBO,SAAS,qBAAqB,OAAc,SAA+B;AAChF,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,aAAO,MAAM,SAAS,KAAK;AAAA,IAC7B,KAAK;AACH,aAAO,MAAM,SAAS,KAAK;AAAA,IAC7B;AACE,aAAO,MAAM,gBAAgB,OAAO,EAAE,SAAS;AAAA,EACnD;AACF;AAEO,SAAS,qBAAqB,OAAc,SAA+B;AAChF,UAAQ,SAAS;AAAA,IACf,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT;AACE,aAAO,MAAM,gBAAgB,OAAO;AAAA,EACxC;AACF;;;ACtBO,IAAM,gBAAgB,CAAC,aAA+B,KAAc,WAAmB;AAC5F,QAAM,YAAY,sBAAsB,YAAY,OAAO,CAAC,GAAG,CAAC,CAAC;AACjE,QAAM,SAAS;AAAA,IACb,YAAY;AAAA,MACV,iBAAiB,sBAAsB,YAAY,OAAO,GAAG,CAAC,CAAC,QAAQ,MAAM,aAAa,MAAM;AAAA,IAClG;AAAA,IACA,oBAAoB;AAAA,MAClB,iBAAiB,sBAAsB,YAAY,OAAO,GAAG,CAAC,CAAC,QAAQ,MAAM,eAAe,MAAM;AAAA,MAClG,iBAAiB;AAAA,MACjB;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT;AAEO,IAAM,gBAAgB,CAAC,aAA+B,KAAc,WAAmB;AAC5F,QAAM,YAAY,sBAAsB,YAAY,OAAO,CAAC,GAAG,CAAC,CAAC;AACjE,QAAM,SAAS;AAAA,IACb,YAAY;AAAA,MACV,iBAAiB,sBAAsB,YAAY,OAAO,GAAG,CAAC,CAAC,UAAU,MAAM,eAAe,MAAM;AAAA,IACtG;AAAA,IACA,oBAAoB;AAAA,MAClB,iBAAiB,sBAAsB,YAAY,OAAO,GAAG,CAAC,CAAC,UAAU,MAAM,iBAAiB,MAAM;AAAA,MACtG,iBAAiB;AAAA,MACjB;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT;AAEO,IAAM,gBAAgB,CAAC,aAA+B,KAAc,WAAmB;AAC5F,QAAM,YAAY,sBAAsB,YAAY,OAAO,CAAC,GAAG,CAAC,CAAC;AACjE,QAAM,SAAS;AAAA,IACb,YAAY;AAAA,MACV,iBAAiB,sBAAsB,YAAY,OAAO,GAAG,CAAC,CAAC,YAAY,MAAM,eAAe,MAAM;AAAA,IACxG;AAAA,IACA,oBAAoB;AAAA,MAClB,iBAAiB,sBAAsB,YAAY,OAAO,GAAG,CAAC,CAAC,cAAc,MAAM,iBAAiB,MAAM;AAAA,MAC1G,iBAAiB;AAAA,MACjB;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT;AAEO,IAAM,gBAAgB,CAAC,aAA+B,KAAc,WAAmB;AAC5F,QAAM,SAAS;AAAA,IACb,YAAY,CAAC;AAAA,IACb,oBAAoB;AAAA,MAClB,YAAY;AAAA,QACV,sBACE,YAAY,OAAO,GAAG,CAAC,CACzB;AAAA,QACA,sBAAsB,YAAY,OAAO,CAAC,GAAG,CAAC,CAAC;AAAA,QAC/C,OAAO,MAAM;AAAA,MACf,EAAE,KAAK,GAAG;AAAA,IACZ;AAAA,EACF;AACA,SAAO;AACT;AAEO,IAAM,gBAAgB,CAAC,aAA+B,KAAc,eAAuB;AAChG,QAAM,SAAS;AAAA,IACb,YAAY,CAAC;AAAA,IACb,oBAAoB;AAAA,MAClB,YAAY;AAAA,QACV,sBACE,YAAY,OAAO,CAAC,GAAG,CAAC,CAC1B,kBAAkB,UAAU,oEAAoE,UAAU;AAAA,QAC1G,sBACE,YAAY,OAAO,GAAG,CAAC,CACzB,oBAAoB,UAAU,sBAAsB,UAAU,uBAAuB,UAAU,uBAAuB,UAAU,uBAAuB,UAAU,uBAAuB,UAAU,uBAAuB,UAAU;AAAA,QACnO;AAAA,MACF,EAAE,KAAK,GAAG;AAAA,IACZ;AAAA,EACF;AACA,SAAO;AACT;AAEO,IAAM,gBAAgB,CAAC,aAA+B,KAAc,WAAmB;AAC5F,QAAM,SAAS;AAAA,IACb,YAAY,CAAC;AAAA,IACb,oBAAoB;AAAA,MAClB,iBAAiB;AAAA,QACf,sBAAsB,YAAY,OAAO,CAAC,GAAG,CAAC,CAAC,aAAa,MAAM,gBAAgB,MAAM;AAAA,QACxF,sBACE,YAAY,OAAO,GAAG,CAAC,CACzB,eAAe,MAAM,kBAAkB,MAAM,mBAAmB,MAAM,mBAAmB,MAAM,mBAAmB,MAAM,mBAAmB,MAAM,mBAAmB,MAAM;AAAA,MAC5K,EAAE,KAAK,GAAG;AAAA,IACZ;AAAA,EACF;AACA,SAAO;AACT;AAEO,IAAM,gBAAgB,CAAC,aAA+B,KAAc,WAAmB;AAC5F,QAAM,SAAS;AAAA,IACb,YAAY,CAAC;AAAA,IACb,oBAAoB;AAAA,MAClB,YAAY;AAAA,QACV,sBAAsB,YAAY,OAAO,GAAG,CAAC,CAAC;AAAA,QAC9C,sBAAsB,YAAY,OAAO,CAAC,GAAG,CAAC,CAAC;AAAA,QAC/C,OAAO,MAAM;AAAA,MACf,EAAE,KAAK,GAAG;AAAA,IACZ;AAAA,EACF;AACA,SAAO;AACT;AAEO,IAAM,gBAAgB,CAAC,aAA+B,KAAc,eAAuB;AAChG,QAAM,SAAS;AAAA,IACb,YAAY,CAAC;AAAA,IACb,oBAAoB;AAAA,MAClB,YAAY;AAAA,QACV,sBAAsB,YAAY,OAAO,CAAC,GAAG,CAAC,CAAC,iBAAiB,UAAU;AAAA,QAC1E,sBACE,YAAY,OAAO,GAAG,CAAC,CACzB,oBAAoB,UAAU,sBAAsB,UAAU,uBAAuB,UAAU,uBAAuB,UAAU,uBAAuB,UAAU,uBAAuB,UAAU,uBAAuB,UAAU;AAAA,QACnO,sBAAsB,YAAY,OAAO,CAAC,GAAG,CAAC,CAAC;AAAA,MACjD,EAAE,KAAK,GAAG;AAAA,IACZ;AAAA,EACF;AACA,SAAO;AACT;AAEO,IAAM,gBAAgB,CAAC,aAA+B,KAAc,eAAuB;AAChG,QAAM,SAAS;AAAA,IACb,YAAY,CAAC;AAAA,IACb,oBAAoB;AAAA,MAClB,YAAY;AAAA,QACV,sBAAsB,YAAY,OAAO,CAAC,GAAG,CAAC,CAAC,mBAAmB,UAAU;AAAA,QAC5E,sBACE,YAAY,OAAO,GAAG,CAAC,CACzB,oBAAoB,UAAU,sBAAsB,UAAU,uBAAuB,UAAU,uBAAuB,UAAU,uBAAuB,UAAU,uBAAuB,UAAU,uBAAuB,UAAU;AAAA,QACnO;AAAA,MACF,EAAE,KAAK,GAAG;AAAA,IACZ;AAAA,EACF;AACA,SAAO;AACT;;;AC3HO,SAAS,qBAAqB,KAAqB,UAAwB,UAAwB;AACxG,QAAM,QAAQ,IAAI;AAElB,QAAM,EAAE,SAAS,IAAI,MAAM,kBAAkB,EAAE,UAAU,SAAS,CAAC;AACnE,QAAM,SAAS,MAAM,gBAAgB,QAAQ;AAE7C,QAAM,EAAE,UAAU,MAAM,UAAU,KAAK,IAAI,MAAM,gBAAgB,QAAQ;AACzE,QAAM,cAAgC,CAAC,OAAO,IAAI,QAAQ,QAAQ,SAAS,OAAO;AAElF,MAAI,MAAM;AACV,MAAI,aAAa,EAAE,YAAY,CAAC,GAAY,oBAAoB,CAAC,EAAW;AAE5E,MAAI,cAAc,SAAS,SAAS,OAAO;AAC3C,MAAI,QAAQ,MAAM,cAAc,MAAM;AAEtC,UAAQ,UAAU;AAAA,IAChB,KAAK,OAAO;AACV,YAAM,aAAa;AACnB,mBAAa,cAAc,aAAa,KAAK,MAAM;AACnD;AAAA,IACF;AAAA,IAEA,KAAK,SAAS;AACZ,YAAM,aAAa;AACnB,mBAAa,cAAc,aAAa,KAAK,MAAM;AACnD;AAAA,IACF;AAAA,IAEA,KAAK,QAAQ;AACX,YAAM,aAAa;AACnB,mBAAa,cAAc,aAAa,KAAK,MAAM;AACnD;AAAA,IACF;AAAA,IAEA,KAAK,OAAO;AACV,YAAM,aAAa;AACnB,UAAI,OAAO;AACT,qBAAa,cAAc,aAAa,KAAK,MAAM;AAAA,MACrD,OAAO;AACL,qBAAa,cAAc,aAAa,KAAK,MAAM;AAAA,MACrD;AACA;AAAA,IACF;AAAA,IAEA,KAAK,cAAc;AACjB,YAAM,aAAa;AACnB,UAAI,OAAO;AACT,qBAAa,cAAc,aAAa,KAAK,UAAU;AAAA,MACzD,OAAO;AACL,qBAAa,cAAc,aAAa,KAAK,UAAU;AAAA,MACzD;AACA;AAAA,IACF;AAAA,IAEA,KAAK,cAAc;AACjB,YAAM,aAAa;AACnB,mBAAa,cAAc,aAAa,KAAK,UAAU;AACvD;AAAA,IACF;AAAA,IAEA,KAAK,aAAa;AAChB,YAAM,aAAa;AACnB,mBAAa,cAAc,aAAa,KAAK,MAAM;AACnD;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AACT;;;ACjFA,SAAS,qBAAqB,aAAwC,KAAoB;AACxF,MAAI,gBAAgB,YAAY;AAC9B,WAAO;AAAA,EACT,WAAW,QAAQ,OAAO;AACxB,WAAO;AAAA,EACT,OAAO;AACL,WAAO;AAAA,EACT;AACF;AAEO,IAAM,mBAAmB,CAAC,KAAqB,UAAuC;AAC3F,QAAM,EAAE,QAAQ,IAAI;AAEpB,QAAM,MAAM,qBAAqB,MAAM,aAAa,IAAI,GAAI;AAC5D,QAAM,QAAQ,IAAI;AAElB,QAAM,EAAE,UAAU,SAAS,IAAI,IAAI,aAAa,gBAAgB,OAAO;AAEvE,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,aAAO,sBAAsB,GAAG;AAAA,IAClC,KAAK,aAAa;AAChB,UAAI,QAAQ,IAAI,aAAa,iBAAiB,SAAS,QAAQ,EAAE,SAAS,KAAK;AAC/E,UAAI,SAAS,MAAM,iBAAiB,UAAU,WAAW,YAAY,CAAC,EAAE,SAAS,KAAK;AACtF,UAAI,MAAM,MAAM,iBAAiB,SAAS,QAAQ,EAAE,SAAS,KAAK;AAClE,aAAO,sBAAsB,GAAG,KAAK,KAAK,KAAK,MAAM,KAAK,GAAG;AAAA,IAC/D;AAAA,IACA,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK,SAAS;AACZ,UAAI,QAAQ,MAAM,iBAAiB,SAAS,QAAQ,EAAE,SAAS,KAAK;AACpE,UAAI,MAAM,MAAM,iBAAiB,SAAS,QAAQ,EAAE,SAAS,KAAK;AAClE,aAAO,sBAAsB,GAAG,KAAK,KAAK,KAAK,GAAG;AAAA,IACpD;AAAA,IACA;AACE,YAAM,IAAI,MAAM,4BAA4B,OAAO;AAAA,EACvD;AACF;;;APZO,SAAS,QAA6B,OAAc,MAAY,WAA4C;AACjH,QAAM,eAAe,MAAM,QAAQ;AACnC,QAAM,QAAQ,MAAM,QAAQ;AAC5B,QAAM,aAAa,MAAM,QAAQ;AACjC,QAAM,gBAAgB,MAAM,QAAQ;AACpC,QAAM,aAAa,MAAM,QAAQ,UAAU;AAE3C,QAAM,WAAW,aAAa,iBAAiB;AAE/C,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,aAAa,gBAAgB,OAAO;AAAA,IAC3C;AAAA,IAEA,SAASC,QAAuB;AAC9B,WAAK,EAAE,MAAM,aAAa,WAAO,oCAAeA,MAAK,GAAG,KAAK,YAAY,CAAC;AAAA,IAC5E;AAAA,IAEA,gBAAgB,SAAuBA,QAAe;AACpD,YAAM,QAAQ,aAAa,iBAAiB,SAASA,MAAK;AAC1D,WAAK,EAAE,MAAM,aAAa,OAAO,OAAO,KAAK,cAAc,CAAC;AAAA,IAC9D;AAAA,IAEA,UAAU,QAAqB;AAC7B,YAAMA,SAAQ,aAAa,SAAS,MAAM;AAC1C,WAAK,EAAE,MAAM,aAAa,OAAAA,QAAO,KAAK,aAAa,CAAC;AAAA,IACtD;AAAA,IAEA,SAASA,QAAe;AACtB,YAAM,QAAQ,aAAa,iBAAiB,SAASA,MAAK;AAC1D,WAAK,EAAE,MAAM,aAAa,OAAO,OAAO,KAAK,YAAY,CAAC;AAAA,IAC5D;AAAA,IAEA,cAAc,UAAU,QAAQ;AAAA,MAC9B,GAAG,MAAM,QAAQ;AAAA,MACjB,IAAI,IAAI,aAAa,MAAM,OAAO;AAAA,IACpC,CAAC;AAAA,IAED,aAAa,OAAuB;AAClC,YAAM,EAAE,UAAU,SAAS,IAAI;AAC/B,YAAM,EAAE,WAAW,IAAI,qBAAqB,MAAM,SAAS,UAAU,QAAQ;AAE7E,aAAO,UAAU,QAAQ;AAAA,QACvB,GAAG,MAAM,KAAK;AAAA,QACd,IAAI,IAAI,UAAU,MAAM,OAAO;AAAA,QAC/B,MAAM;AAAA,QACN,cAAc,OAAO;AACnB,cAAI,CAAC;AAAe;AAEpB,gBAAM,UAAM,kCAAe,KAAK;AAChC,cAAI,KAAC,+BAAY,GAAG,SAAK,mCAAgB,GAAG;AAAG;AAE/C,gBAAM,YAAQ,iCAAc,GAAG;AAC/B,gBAAM,UAAU,EAAE,UAAU,SAAS;AAErC,eAAK,EAAE,MAAM,qBAAqB,OAAO,SAAS,IAAI,OAAO,CAAC;AAAA,QAChE;AAAA,QACA,OAAO;AAAA,UACL,UAAU;AAAA,UACV,aAAa;AAAA,UACb,mBAAmB;AAAA,UACnB,GAAG;AAAA,QACL;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IAEA,qBAAqB,OAAuB;AAC1C,YAAM,EAAE,UAAU,SAAS,IAAI;AAC/B,YAAM,EAAE,mBAAmB,IAAI,qBAAqB,MAAM,SAAS,UAAU,QAAQ;AAErF,aAAO,UAAU,QAAQ;AAAA,QACvB,GAAG,MAAM,aAAa;AAAA,QACtB,IAAI,IAAI,kBAAkB,MAAM,OAAO;AAAA,QACvC,OAAO;AAAA,UACL,UAAU;AAAA,UACV,aAAa;AAAA,UACb,mBAAmB;AAAA,UACnB,GAAG;AAAA,QACL;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IAEA,kBAAkB,OAAuB;AACvC,YAAM,EAAE,UAAU,SAAS,IAAI;AAC/B,YAAM,EAAE,iBAAiB,IAAI,kBAAkB,cAAc,UAAU,QAAQ;AAC/E,YAAM,EAAE,GAAG,EAAE,IAAI,iBAAiB;AAElC,YAAM,UAAU,EAAE,UAAU,SAAS;AAErC,aAAO,UAAU,QAAQ;AAAA,QACvB,GAAG,MAAM,UAAU;AAAA,QACnB,IAAI,IAAI,eAAe,MAAM,OAAO;AAAA,QACpC,UAAU,aAAa,SAAY;AAAA,QACnC,qBAAiB,4BAAS,UAAU;AAAA,QACpC,MAAM;AAAA,QACN,OAAO;AAAA,UACL,UAAU;AAAA,UACV,MAAM,GAAG,IAAI,GAAG;AAAA,UAChB,KAAK,GAAG,IAAI,GAAG;AAAA,UACf,WAAW;AAAA,UACX,aAAa;AAAA,UACb,mBAAmB;AAAA,UACnB,YAAY,aAAa,iBAAiB,SAAS,CAAC,EAAE,SAAS,KAAK;AAAA,QACtE;AAAA,QACA,SAAS;AACP,eAAK,WAAW;AAAA,QAClB;AAAA,QACA,UAAU;AACR,eAAK,EAAE,MAAM,cAAc,IAAI,OAAO,CAAC;AAAA,QACzC;AAAA,QACA,UAAU,OAAO;AACf,cAAI,CAAC;AAAe;AAEpB,gBAAM,WAAO,gCAAa,KAAK;AAE/B,gBAAM,SAAsB;AAAA,YAC1B,UAAU;AACR,mBAAK,EAAE,MAAM,iBAAiB,SAAS,KAAK,CAAC;AAAA,YAC/C;AAAA,YACA,YAAY;AACV,mBAAK,EAAE,MAAM,mBAAmB,SAAS,KAAK,CAAC;AAAA,YACjD;AAAA,YACA,YAAY;AACV,mBAAK,EAAE,MAAM,mBAAmB,SAAS,KAAK,CAAC;AAAA,YACjD;AAAA,YACA,aAAa;AACX,mBAAK,EAAE,MAAM,oBAAoB,SAAS,KAAK,CAAC;AAAA,YAClD;AAAA,YACA,SAAS;AACP,mBAAK,EAAE,MAAM,gBAAgB,SAAS,KAAK,CAAC;AAAA,YAC9C;AAAA,YACA,WAAW;AACT,mBAAK,EAAE,MAAM,kBAAkB,SAAS,KAAK,CAAC;AAAA,YAChD;AAAA,UACF;AAEA,gBAAM,OAAO,WAAO,+BAAY,OAAO,MAAM,OAAO,CAAC;AAErD,cAAI,MAAM;AACR,iBAAK,KAAK;AACV,kBAAM,eAAe;AAAA,UACvB;AAAA,QACF;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IAEA,2BAA2B,OAA0B;AACnD,YAAM,EAAE,cAAc,cAAc,QAAQ,IAAI;AAEhD,aAAO,UAAU,QAAQ;AAAA,QACvB,GAAG,MAAM,mBAAmB;AAAA,QAC5B,IAAI,IAAI,wBAAwB,MAAM,SAAS,OAAO;AAAA,QACtD,MAAM;AAAA,QACN,gBAAgB;AAAA,QAChB,oBAAoB;AAAA,QACpB,cAAc,OAAO;AACnB,cAAI,CAAC;AAAe;AAEpB,gBAAM,UAAM,kCAAe,KAAK;AAChC,cAAI,KAAC,+BAAY,GAAG,SAAK,mCAAgB,GAAG;AAAG;AAE/C,gBAAM,YAAQ,iCAAc,GAAG;AAC/B,eAAK,EAAE,MAAM,+BAA+B,SAAS,OAAO,IAAI,SAAS,YAAY,CAAC;AAAA,QACxF;AAAA,QACA,OAAO;AAAA,UACL,UAAU;AAAA,UACV,aAAa;AAAA,UACb,mBAAmB;AAAA,UACnB,iBAAiB,iBAAiB,MAAM,SAAS,EAAE,aAAa,QAAQ,CAAC;AAAA,QAC3E;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IAEA,gCAAgC,OAA0B;AACxD,YAAM,EAAE,cAAc,cAAc,QAAQ,IAAI;AAChD,aAAO,UAAU,QAAQ;AAAA,QACvB,GAAG,MAAM,6BAA6B;AAAA,QACtC,oBAAoB;AAAA,QACpB,gBAAgB;AAAA,QAChB,OAAO;AAAA,UACL,UAAU;AAAA,UACV,iBAAiB;AAAA,UACjB,iBAAiB;AAAA,YACf;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UACF,EAAE,KAAK,GAAG;AAAA,UACV,gBAAgB;AAAA,UAChB,oBAAoB;AAAA,UACpB,OAAO;AAAA,UACP,QAAQ;AAAA,QACV;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IAEA,2BAA2B,OAA0B;AACnD,YAAM,EAAE,cAAc,cAAc,QAAQ,IAAI;AAChD,YAAM,EAAE,UAAU,UAAU,MAAM,UAAU,IAAI,aAAa,gBAAgB,OAAO;AACpF,YAAM,eAAe,aAAa,gBAAgB,OAAO;AAEzD,YAAM,UAAU,eAAe,aAAa,WAAW;AAEvD,YAAM,kBACJ,gBAAgB,eACZ,EAAE,MAAM,GAAG,SAAS,GAAG,KAAK,KAAK,MAAM,IACvC,EAAE,KAAK,GAAG,SAAS,GAAG,KAAK,MAAM,MAAM;AAE7C,aAAO,UAAU,QAAQ;AAAA,QACvB,GAAG,MAAM,mBAAmB;AAAA,QAC5B,IAAI,IAAI,wBAAwB,MAAM,SAAS,OAAO;AAAA,QACtD,MAAM;AAAA,QACN,cAAc;AAAA,QACd,UAAU,aAAa,SAAY;AAAA,QACnC,gBAAgB;AAAA,QAChB,qBAAiB,4BAAS,UAAU;AAAA,QACpC,oBAAoB;AAAA,QACpB,qBAAiB,4BAAS,UAAU;AAAA,QACpC,oBAAoB;AAAA,QACpB,iBAAiB;AAAA,QACjB,iBAAiB;AAAA,QACjB,iBAAiB;AAAA,QACjB,OAAO;AAAA,UACL,mBAAmB;AAAA,UACnB,UAAU;AAAA,UACV,YAAY,uBAAuB,cAAc,OAAO,EAAE,SAAS,KAAK;AAAA,UACxE,GAAG;AAAA,QACL;AAAA,QACA,UAAU;AACR,cAAI,CAAC;AAAe;AACpB,eAAK,EAAE,MAAM,wBAAwB,QAAQ,CAAC;AAAA,QAChD;AAAA,QACA,SAAS;AACP,cAAI,CAAC;AAAe;AACpB,eAAK,EAAE,MAAM,uBAAuB,QAAQ,CAAC;AAAA,QAC/C;AAAA,QACA,UAAU,OAAO;AACf,cAAI,CAAC;AAAe;AACpB,gBAAM,WAAO,gCAAa,KAAK,IAAI;AAEnC,gBAAM,SAAsB;AAAA,YAC1B,UAAU;AACR,mBAAK,EAAE,MAAM,2BAA2B,SAAS,KAAK,CAAC;AAAA,YACzD;AAAA,YACA,YAAY;AACV,mBAAK,EAAE,MAAM,6BAA6B,SAAS,KAAK,CAAC;AAAA,YAC3D;AAAA,YACA,YAAY;AACV,mBAAK,EAAE,MAAM,6BAA6B,SAAS,KAAK,CAAC;AAAA,YAC3D;AAAA,YACA,aAAa;AACX,mBAAK,EAAE,MAAM,8BAA8B,SAAS,KAAK,CAAC;AAAA,YAC5D;AAAA,YACA,SAAS;AACP,mBAAK,EAAE,MAAM,0BAA0B,QAAQ,CAAC;AAAA,YAClD;AAAA,YACA,WAAW;AACT,mBAAK,EAAE,MAAM,4BAA4B,QAAQ,CAAC;AAAA,YACpD;AAAA,YACA,OAAO;AACL,mBAAK,EAAE,MAAM,uBAAuB,QAAQ,CAAC;AAAA,YAC/C;AAAA,YACA,MAAM;AACJ,mBAAK,EAAE,MAAM,sBAAsB,QAAQ,CAAC;AAAA,YAC9C;AAAA,UACF;AAEA,gBAAM,OAAO,WAAO,+BAAY,OAAO,MAAM,OAAO,CAAC;AAErD,cAAI,MAAM;AACR,iBAAK,KAAK;AACV,kBAAM,eAAe;AAAA,UACvB;AAAA,QACF;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IAEA,qBAAqB,OAA+B;AAClD,YAAM,EAAE,QAAQ,IAAI;AACpB,YAAM,cAAc,YAAY,SAAS,YAAY;AACrD,YAAM,QAAQ,qBAAqB,cAAc,OAAO;AAExD,aAAO,UAAU,MAAM;AAAA,QACrB,GAAG,MAAM,aAAa;AAAA,QACtB,MAAM,cAAc,SAAS;AAAA,QAC7B,gBAAgB;AAAA,QAChB,cAAc;AAAA,QACd,UAAU;AAAA,QACV,qBAAiB,4BAAS,UAAU;AAAA,QACpC,UAAU,MAAM,QAAQ;AAAA,QACxB,IAAI,IAAI,kBAAkB,MAAM,SAAS,OAAO;AAAA,QAChD,cAAc,qBAAqB,cAAc,OAAO;AAAA,QACxD,KAAK,OAAO;AAAA,QACZ,KAAK,OAAO;AAAA,QACZ,MAAM,OAAO;AAAA,QACb,UAAU;AACR,eAAK,EAAE,MAAM,uBAAuB,QAAQ,CAAC;AAAA,QAC/C;AAAA,QACA,SAAS,OAAO;AACd,cAAI;AAAa;AACjB,gBAAMA,SAAQ,MAAM,cAAc;AAClC,eAAK,EAAE,MAAM,wBAAwB,SAAS,OAAAA,QAAO,YAAY,CAAC;AAAA,QACpE;AAAA,QACA,OAAO,OAAO;AACZ,gBAAMA,SAAQ,MAAM,cAAc;AAClC,eAAK,EAAE,MAAM,sBAAsB,SAAS,OAAAA,QAAO,YAAY,CAAC;AAAA,QAClE;AAAA,QACA,UAAU,OAAO;AACf,cAAI,CAAC;AAAa;AAClB,cAAI,MAAM,QAAQ,SAAS;AACzB,kBAAMA,SAAQ,MAAM,cAAc;AAClC,iBAAK,EAAE,MAAM,wBAAwB,SAAS,OAAAA,QAAO,YAAY,CAAC;AAAA,UACpE;AAAA,QACF;AAAA,QACA,OAAO;AAAA,UACL,YAAY;AAAA,UACZ,kBAAkB;AAAA,UAClB,eAAe;AAAA,QACjB;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IAEA,kBAAkB,UAAU,MAAM;AAAA,MAChC,MAAM;AAAA,MACN,UAAU;AAAA,MACV,MAAM,MAAM,QAAQ;AAAA,MACpB,IAAI,IAAI,iBAAiB,MAAM,OAAO;AAAA,MACtC,OAAO;AAAA,MACP,cAAc;AAAA,MACd,SAAS,OAAO;AACd,cAAMA,SAAQ,MAAM,cAAc;AAClC,aAAK,EAAE,MAAM,aAAa,OAAAA,QAAO,KAAK,eAAe,CAAC;AAAA,MACxD;AAAA,IACF,CAAC;AAAA,IAED,wBAAwB,UAAU,OAAO;AAAA,MACvC,GAAG,MAAM,kBAAkB;AAAA,MAC3B,UAAU;AAAA,MACV,qBAAiB,4BAAS,UAAU;AAAA,MACpC,cAAc;AAAA,MACd,UAAU;AACR,YAAI,CAAC;AAAe;AACpB,aAAK,kBAAkB;AAAA,MACzB;AAAA,IACF,CAAC;AAAA,IAED,yBAAyB,OAAyB;AAChD,YAAM,EAAE,OAAAA,OAAM,IAAI;AAClB,YAAM,YAAQ,oCAAeA,MAAK,EAAE,gBAAgB,OAAO;AAC3D,aAAO,UAAU,QAAQ;AAAA,QACvB,GAAG,MAAM,iBAAiB;AAAA,QAC1B,cAAc;AAAA,QACd,OAAO;AAAA,UACL,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,YAAY;AAAA,UACZ,iBAAiB;AAAA,YACf;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UACF,EAAE,KAAK,GAAG;AAAA,UACV,oBAAoB;AAAA,UACpB,gBAAgB;AAAA,UAChB,UAAU;AAAA,UACV,OAAO;AAAA,UACP,QAAQ;AAAA,QACV;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IAEA,eAAe,OAAyB;AACtC,YAAM,EAAE,OAAAA,QAAO,SAAS,IAAI;AAC5B,YAAM,YAAQ,oCAAeA,MAAK,EAAE,SAAS,aAAa,cAAc,CAAC;AACzE,aAAO,UAAU,QAAQ;AAAA,QACvB,GAAG,MAAM,OAAO;AAAA,QAChB,UAAU;AACR,cAAI,YAAY,CAAC;AAAe;AAChC,eAAK,EAAE,MAAM,aAAa,OAAO,MAAM,CAAC;AAAA,QAC1C;AAAA,QACA,OAAO;AAAA,UACL,UAAU;AAAA,UACV,YAAY,MAAM,SAAS,KAAK;AAAA,QAClC;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF;AACF;;;AQnaA,IAAAC,sBAAuC;AACvC,kBAA8B;AAC9B,IAAAC,oBAAiC;AACjC,IAAAC,oBAAoB;AACpB,wBAAiC;AACjC,IAAAC,wBAA6D;AAC7D,4BAAqC;AACrC,mBAAwB;AAMjB,SAAS,QAAQ,aAAiC;AACvD,QAAM,UAAM,sBAAQ,WAAW;AAE/B,aAAO;AAAA,IACL;AAAA,MACE,IAAI;AAAA,MACJ,SAAS;AAAA,MACT,SAAS;AAAA,QACP,KAAK;AAAA,QACL,UAAU;AAAA,QACV,eAAe;AAAA,QACf,mBAAmB;AAAA,QACnB,OAAO;AAAA,QACP,GAAG;AAAA,MACL;AAAA,MAEA,UAAU;AAAA,QACR,OAAO,CAACC,SAAQA,KAAI,QAAQ;AAAA,QAC5B,eAAe,CAACA,SAAQ,EAAEA,KAAI,YAAYA,KAAI;AAAA,QAC9C,cAAc,CAACA,aAAQ,gCAAWA,KAAI,KAAK;AAAA,MAC7C;AAAA,MAEA,IAAI;AAAA,QACF,aAAa;AAAA,UACX,SAAS,CAAC,UAAU;AAAA,QACtB;AAAA,MACF;AAAA,MAEA,YAAY,CAAC,kBAAkB;AAAA,MAE/B,OAAO;AAAA,QACL,OAAO,CAAC,qBAAqB,gBAAgB;AAAA,MAC/C;AAAA,MAEA,QAAQ;AAAA,QACN,MAAM;AAAA,UACJ,IAAI;AAAA,YACF,oBAAoB;AAAA,cAClB,SAAS,CAAC,gBAAgB;AAAA,YAC5B;AAAA,YACA,qBAAqB;AAAA,cACnB,QAAQ;AAAA,cACR,SAAS,CAAC,oBAAoB,yBAAyB,gBAAgB;AAAA,YACzE;AAAA,YACA,cAAc;AAAA,cACZ,QAAQ;AAAA,cACR,SAAS,CAAC,kBAAkB;AAAA,YAC9B;AAAA,YACA,+BAA+B;AAAA,cAC7B,QAAQ;AAAA,cACR,SAAS,CAAC,oBAAoB,4BAA4B,mBAAmB;AAAA,YAC/E;AAAA,YACA,wBAAwB;AAAA,cACtB,QAAQ;AAAA,cACR,SAAS,CAAC,kBAAkB;AAAA,YAC9B;AAAA,YACA,uBAAuB;AAAA,cACrB,QAAQ;AAAA,cACR,SAAS,CAAC,kBAAkB;AAAA,YAC9B;AAAA,YACA,wBAAwB;AAAA,cACtB,SAAS,CAAC,0BAA0B;AAAA,YACtC;AAAA,UACF;AAAA,QACF;AAAA,QAEA,SAAS;AAAA,UACP,IAAI;AAAA,YACF,qBAAqB;AAAA,cACnB,QAAQ;AAAA,cACR,SAAS,CAAC,oBAAoB,yBAAyB,gBAAgB;AAAA,YACzE;AAAA,YACA,+BAA+B;AAAA,cAC7B,QAAQ;AAAA,cACR,SAAS,CAAC,oBAAoB,4BAA4B,mBAAmB;AAAA,YAC/E;AAAA,YACA,mBAAmB;AAAA,cACjB,SAAS,CAAC,mBAAmB;AAAA,YAC/B;AAAA,YACA,oBAAoB;AAAA,cAClB,SAAS,CAAC,mBAAmB;AAAA,YAC/B;AAAA,YACA,iBAAiB;AAAA,cACf,SAAS,CAAC,mBAAmB;AAAA,YAC/B;AAAA,YACA,mBAAmB;AAAA,cACjB,SAAS,CAAC,mBAAmB;AAAA,YAC/B;AAAA,YACA,gBAAgB;AAAA,cACd,SAAS,CAAC,mBAAmB;AAAA,YAC/B;AAAA,YACA,kBAAkB;AAAA,cAChB,SAAS,CAAC,mBAAmB;AAAA,YAC/B;AAAA,YACA,6BAA6B;AAAA,cAC3B,SAAS,CAAC,kBAAkB;AAAA,YAC9B;AAAA,YACA,8BAA8B;AAAA,cAC5B,SAAS,CAAC,kBAAkB;AAAA,YAC9B;AAAA,YACA,2BAA2B;AAAA,cACzB,SAAS,CAAC,kBAAkB;AAAA,YAC9B;AAAA,YACA,6BAA6B;AAAA,cAC3B,SAAS,CAAC,kBAAkB;AAAA,YAC9B;AAAA,YACA,0BAA0B;AAAA,cACxB,SAAS,CAAC,kBAAkB;AAAA,YAC9B;AAAA,YACA,4BAA4B;AAAA,cAC1B,SAAS,CAAC,kBAAkB;AAAA,YAC9B;AAAA,YACA,uBAAuB;AAAA,cACrB,SAAS,CAAC,iBAAiB;AAAA,YAC7B;AAAA,YACA,sBAAsB;AAAA,cACpB,SAAS,CAAC,iBAAiB;AAAA,YAC7B;AAAA,YACA,uBAAuB;AAAA,cACrB,SAAS,CAAC,kBAAkB;AAAA,YAC9B;AAAA,YACA,wBAAwB;AAAA,cACtB,SAAS,CAAC,0BAA0B;AAAA,YACtC;AAAA,YACA,sBAAsB;AAAA,cACpB;AAAA,gBACE,OAAO;AAAA,gBACP,QAAQ;AAAA,gBACR,SAAS,CAAC,0BAA0B;AAAA,cACtC;AAAA,cACA,EAAE,QAAQ,OAAO;AAAA,YACnB;AAAA,YACA,uBAAuB;AAAA,cACrB,QAAQ;AAAA,YACV;AAAA,YACA,aAAa;AAAA,cACX,QAAQ;AAAA,YACV;AAAA,UACF;AAAA,QACF;AAAA,QAEA,UAAU;AAAA,UACR,MAAM,CAAC,oBAAoB;AAAA,UAC3B,YAAY,CAAC,oBAAoB,sBAAsB;AAAA,UACvD,IAAI;AAAA,YACF,qBAAqB;AAAA,cACnB,SAAS,CAAC,uBAAuB;AAAA,YACnC;AAAA,YACA,mBAAmB;AAAA,cACjB,QAAQ;AAAA,cACR,SAAS,CAAC,mBAAmB;AAAA,YAC/B;AAAA,YACA,+BAA+B;AAAA,cAC7B,SAAS,CAAC,0BAA0B;AAAA,YACtC;AAAA,YACA,6BAA6B;AAAA,cAC3B,QAAQ;AAAA,cACR,SAAS,CAAC,mBAAmB;AAAA,YAC/B;AAAA,UACF;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,IACA;AAAA,MACE,QAAQ;AAAA,QACN,aAAa,CAAC,MAAM,QAAQ,CAAC,CAAC,IAAI;AAAA,MACpC;AAAA,MACA,YAAY;AAAA,QACV,iBAAiBA,MAAK,MAAM,EAAE,MAAM,eAAe,GAAG;AACpD,gBAAM,UAAU,IAAI,iBAAiBA,IAAG;AACxC,qBAAO,oCAAiB,SAAS;AAAA,YAC/B,qBAAqB;AACnB,cAAAA,KAAI,WAAW;AAAA,YACjB;AAAA,YACA,cAAc;AACZ,mBAAK,EAAE,MAAM,aAAa,OAAO,eAAe,OAAO,KAAK,aAAa,CAAC;AAAA,YAC5E;AAAA,UACF,CAAC;AAAA,QACH;AAAA,QACA,iBAAiBA,MAAK,MAAM,EAAE,KAAK,GAAG;AACpC,qBAAO,oCAAiB,IAAI,OAAOA,IAAG,GAAG;AAAA,YACvC,cAAc,EAAE,MAAM,GAAG;AACvB,oBAAM,OAAOA,KAAI,aAAa,SAAS,sBAAsB;AAC7D,mBAAK,EAAE,MAAM,MAAM,CAAC;AAAA,YACtB;AAAA,YACA,cAAc;AACZ,oBAAM,OAAOA,KAAI,aAAa,SAAS,oBAAoB;AAC3D,mBAAK,EAAE,KAAK,CAAC;AAAA,YACf;AAAA,UACF,CAAC;AAAA,QACH;AAAA,QACA,qBAAqBA,MAAK;AACxB,qBAAO,4CAAqB,EAAE,KAAK,IAAI,OAAOA,IAAG,GAAG,QAAQ,IAAI,aAAaA,IAAG,EAAE,CAAC;AAAA,QACrF;AAAA,MACF;AAAA,MACA,SAAS;AAAA,QACP,eAAeA,MAAK;AAClB,gBAAM,cAAc,gBAAgB,IAAI,OAAOA,IAAG;AAClD,cAAI,CAAC;AAAa;AAClB,gBAAM,MAAM,IAAI,OAAOA,IAAG;AAC1B,gBAAM,SAAS,IAAI,IAAI,WAAW;AAClC,iBACG,KAAK,EACL,KAAK,CAAC,EAAE,QAAQ,MAA2B;AAC1C,kBAAM,SAASA,KAAI,aAAa,cAAc;AAC9C,kBAAM,YAAQ,gCAAW,OAAO,EAAE,SAAS,MAAM;AACjD,qBAASA,MAAK,KAAK;AACnB,YAAAA,KAAI,cAAc,EAAE,OAAOA,KAAI,OAAO,cAAc,MAAM,CAAC;AAAA,UAC7D,CAAC,EACA,MAAM,MAAM,MAAM;AAAA,QACvB;AAAA,QACA,iBAAiBA,MAAK,KAAK;AACzB,UAAAA,KAAI,WAAW,IAAI;AACnB,cAAI,IAAI,SAAS;AACf,YAAAA,KAAI,gBAAgB,IAAI;AAAA,UAC1B;AACA,cAAI,IAAI,aAAa;AACnB,YAAAA,KAAI,oBAAoB,IAAI;AAAA,UAC9B;AAAA,QACF;AAAA,QACA,mBAAmBA,MAAK;AACtB,UAAAA,KAAI,gBAAgB;AACpB,UAAAA,KAAI,WAAW;AACf,UAAAA,KAAI,oBAAoB;AAAA,QAC1B;AAAA,QACA,sBAAsBA,MAAK,KAAK;AAC9B,gBAAM,EAAE,UAAU,SAAS,IAAI,IAAI,WAAWA,KAAI;AAElD,gBAAM,UAAU,IAAI,sBAAsBA,MAAK,IAAI,KAAK;AACxD,cAAI,CAAC;AAAS;AAEd,gBAAM,EAAE,kBAAkB,IAAI,kBAAkBA,KAAI,cAAc,UAAU,QAAQ;AACpF,gBAAM,QAAQ,kBAAkB,QAAQ,GAAG,QAAQ,CAAC;AAEpD,cAAI,CAAC;AAAO;AACZ,mBAASA,MAAK,KAAK;AAAA,QACrB;AAAA,QACA,yBAAyBA,MAAK,KAAK;AACjC,gBAAM,UAAU,IAAI,WAAWA,KAAI;AAEnC,gBAAM,UAAU,IAAI,+BAA+BA,MAAK,IAAI,OAAO,OAAO;AAC1E,cAAI,CAAC;AAAS;AAEd,gBAAM,EAAE,UAAU,UAAU,KAAK,IAAIA,KAAI,aAAa,gBAAgB,OAAO;AAC7E,gBAAM,cAAcA,KAAI,qBAAqB;AAE7C,gBAAM,QAAQ,gBAAgB,eAAe,QAAQ,IAAI,QAAQ;AACjE,gBAAM,mBAAe,uCAAgB,OAAO,UAAU,UAAU,IAAI;AAEpE,gBAAM,YAAQ,uCAAgB,eAAe,MAAM,UAAU,UAAU,IAAI;AAC3E,gBAAM,WAAWA,KAAI,aAAa,iBAAiB,SAAS,KAAK;AAEjE,mBAASA,MAAK,QAAQ;AAAA,QACxB;AAAA,QACA,SAASA,MAAK,KAAK;AACjB,mBAASA,MAAK,IAAI,KAAK;AAAA,QACzB;AAAA,QACA,kBAAkBA,MAAK;AAErB,gBAAM,SAAS,IAAI,mBAAmBA,IAAG;AACzC,iBAAO,QAAQ,CAAC,UAAU;AACxB,kBAAM,UAAU,MAAM,QAAQ;AAC9B,gBAAI,CAAC;AAAS;AACd,kBAAM,QAAQ,qBAAqBA,KAAI,cAAc,OAAO;AAAA,UAC9D,CAAC;AAGD,gBAAM,cAAc,IAAI,iBAAiBA,IAAG;AAC5C,cAAI,CAAC;AAAa;AAClB,sBAAY,QAAQA,KAAI;AAAA,QAC1B;AAAA,QACA,yBAAyBA,MAAK,KAAK;AACjC,gBAAM,EAAE,SAAS,aAAa,MAAM,IAAI;AACxC,cAAI;AACF,kBAAM,SAASA,KAAI,aAAa,cAAc;AAE9C,kBAAM,WAAW,kBACb,gCAAW,KAAK,EAAE,SAAS,MAAM,IACjCA,KAAI,aAAa,iBAAiB,SAAS,KAAK;AAEpD,qBAASA,MAAK,QAAQ;AAAA,UAExB,QAAQ;AAEN,kBAAM,QAAQ,IAAI,kBAAkBA,MAAK,OAAO;AAChD,gBAAI,CAAC;AAAO;AACZ,kBAAM,QAAQ,qBAAqBA,KAAI,cAAc,OAAO;AAAA,UAC9D;AAAA,QACF;AAAA,QAEA,iBAAiBA,MAAK,KAAK;AACzB,gBAAM,EAAE,UAAU,UAAU,KAAK,IAAIA,KAAI,aAAa,gBAAgB,IAAI,OAAO;AACjF,gBAAM,eAAeA,KAAI,aAAa,gBAAgB,IAAI,OAAO;AACjE,gBAAM,YAAQ,uCAAgB,eAAe,IAAI,MAAM,UAAU,UAAU,IAAI;AAC/E,gBAAM,WAAWA,KAAI,aAAa,iBAAiB,IAAI,aAAS,kCAAW,OAAO,UAAU,QAAQ,CAAC;AACrG,mBAASA,MAAK,QAAQ;AAAA,QACxB;AAAA,QACA,iBAAiBA,MAAK,KAAK;AACzB,gBAAM,EAAE,UAAU,UAAU,KAAK,IAAIA,KAAI,aAAa,gBAAgB,IAAI,OAAO;AACjF,gBAAM,eAAeA,KAAI,aAAa,gBAAgB,IAAI,OAAO;AACjE,gBAAM,YAAQ,uCAAgB,eAAe,IAAI,MAAM,UAAU,UAAU,IAAI;AAC/E,gBAAM,WAAWA,KAAI,aAAa,iBAAiB,IAAI,aAAS,kCAAW,OAAO,UAAU,QAAQ,CAAC;AACrG,mBAASA,MAAK,QAAQ;AAAA,QACxB;AAAA,QAEA,kBAAkBA,MAAK,KAAK;AAC1B,gBAAM,EAAE,UAAU,SAAS,IAAI,IAAI;AACnC,gBAAM,EAAE,WAAW,IAAI,kBAAkBA,KAAI,cAAc,UAAU,QAAQ;AAC7E,gBAAM,WAAWA,KAAI,aAAa,iBAAiB,UAAU,WAAW,IAAI,IAAI,CAAC;AACjF,mBAASA,MAAK,QAAQ;AAAA,QACxB;AAAA,QACA,kBAAkBA,MAAK,KAAK;AAC1B,gBAAM,EAAE,UAAU,SAAS,IAAI,IAAI;AACnC,gBAAM,EAAE,WAAW,IAAI,kBAAkBA,KAAI,cAAc,UAAU,QAAQ;AAC7E,gBAAM,WAAWA,KAAI,aAAa,iBAAiB,UAAU,WAAW,IAAI,IAAI,CAAC;AACjF,mBAASA,MAAK,QAAQ;AAAA,QACxB;AAAA,QAEA,kBAAkBA,MAAK,KAAK;AAC1B,gBAAM,EAAE,UAAU,SAAS,IAAI,IAAI;AACnC,gBAAM,EAAE,WAAW,IAAI,kBAAkBA,KAAI,cAAc,UAAU,QAAQ;AAC7E,gBAAM,WAAWA,KAAI,aAAa,iBAAiB,UAAU,WAAW,IAAI,IAAI,CAAC;AACjF,mBAASA,MAAK,QAAQ;AAAA,QACxB;AAAA,QACA,kBAAkBA,MAAK,KAAK;AAC1B,gBAAM,EAAE,UAAU,SAAS,IAAI,IAAI;AACnC,gBAAM,EAAE,WAAW,IAAI,kBAAkBA,KAAI,cAAc,UAAU,QAAQ;AAC7E,gBAAM,WAAWA,KAAI,aAAa,iBAAiB,UAAU,WAAW,IAAI,IAAI,CAAC;AACjF,mBAASA,MAAK,QAAQ;AAAA,QACxB;AAAA,QAEA,gBAAgBA,MAAK,KAAK;AACxB,gBAAM,EAAE,SAAS,IAAIA,KAAI,aAAa,gBAAgB,IAAI,OAAO;AACjE,gBAAM,WAAWA,KAAI,aAAa,iBAAiB,IAAI,SAAS,QAAQ;AACxE,mBAASA,MAAK,QAAQ;AAAA,QACxB;AAAA,QACA,gBAAgBA,MAAK,KAAK;AACxB,gBAAM,EAAE,SAAS,IAAIA,KAAI,aAAa,gBAAgB,IAAI,OAAO;AACjE,gBAAM,WAAWA,KAAI,aAAa,iBAAiB,IAAI,SAAS,QAAQ;AACxE,mBAASA,MAAK,QAAQ;AAAA,QACxB;AAAA,QAEA,kBAAkBA,MAAK;AACrB,UAAAA,KAAI,cAAc,EAAE,OAAOA,KAAI,OAAO,cAAcA,KAAI,aAAa,CAAC;AAAA,QACxE;AAAA,QACA,eAAeA,MAAK;AAClB,UAAAA,KAAI,WAAW,EAAE,OAAOA,KAAI,OAAO,cAAcA,KAAI,aAAa,CAAC;AAAA,QACrE;AAAA,QACA,eAAeA,MAAK;AAClB,qCAAI,MAAM;AACR,gBAAI,eAAeA,IAAG,GAAG,MAAM,EAAE,eAAe,KAAK,CAAC;AAAA,UACxD,CAAC;AAAA,QACH;AAAA,QACA,kBAAkBA,MAAK,KAAK;AAC1B,qCAAI,MAAM;AACR,gBAAI,wBAAwBA,MAAK,IAAI,OAAO,GAAG,MAAM,EAAE,eAAe,KAAK,CAAC;AAAA,UAC9E,CAAC;AAAA,QACH;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;AAEA,IAAM,WAAW,CAAC,KAAqB,UAAiB;AACtD,MAAI,QAAQ,MAAM,SAAS,KAAK;AAClC;","names":["import_color_utils","import_dom_event","import_dom_query","value","import_color_utils","import_dom_event","import_dom_query","import_numeric_range","ctx"]}
|
package/dist/index.mjs
CHANGED
|
@@ -12,7 +12,6 @@ var anatomy = createAnatomy("color-picker", [
|
|
|
12
12
|
"swatchBackground",
|
|
13
13
|
"content",
|
|
14
14
|
"label",
|
|
15
|
-
"hiddenInput",
|
|
16
15
|
"eyeDropperTrigger"
|
|
17
16
|
]);
|
|
18
17
|
var parts = anatomy.build();
|
|
@@ -680,7 +679,6 @@ function connect(state, send, normalize) {
|
|
|
680
679
|
});
|
|
681
680
|
},
|
|
682
681
|
hiddenInputProps: normalize.input({
|
|
683
|
-
...parts.hiddenInput.attrs,
|
|
684
682
|
type: "text",
|
|
685
683
|
disabled: isDisabled,
|
|
686
684
|
name: state.context.name,
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/color-picker.anatomy.ts","../src/color-picker.connect.ts","../src/color-picker.dom.ts","../src/utils/get-channel-details.ts","../src/utils/get-channel-display-color.ts","../src/utils/get-channel-input-value.ts","../src/utils/generate-format-background.ts","../src/utils/get-color-area-gradient.ts","../src/utils/get-slider-background.ts","../src/color-picker.machine.ts"],"sourcesContent":["import { createAnatomy } from \"@zag-js/anatomy\"\n\nexport const anatomy = createAnatomy(\"color-picker\", [\n \"area\",\n \"areaThumb\",\n \"areaGradient\",\n \"channelSliderTrack\",\n \"channelSliderTrackBackground\",\n \"channelSliderThumb\",\n \"channelInput\",\n \"swatch\",\n \"swatchBackground\",\n \"content\",\n \"label\",\n \"hiddenInput\",\n \"eyeDropperTrigger\",\n])\n\nexport const parts = anatomy.build()\n","import { normalizeColor, type Color, type ColorChannel, type ColorFormat } from \"@zag-js/color-utils\"\nimport {\n getEventKey,\n getEventPoint,\n getEventStep,\n getNativeEvent,\n isLeftClick,\n isModifiedEvent,\n type EventKeyMap,\n} from \"@zag-js/dom-event\"\nimport { dataAttr } from \"@zag-js/dom-query\"\nimport type { NormalizeProps, PropTypes } from \"@zag-js/types\"\nimport { visuallyHiddenStyle } from \"@zag-js/visually-hidden\"\nimport { parts } from \"./color-picker.anatomy\"\nimport { dom } from \"./color-picker.dom\"\nimport type {\n ColorAreaProps,\n ColorChannelInputProps,\n ColorChannelProps,\n ColorSwatchProps,\n PublicApi,\n Send,\n State,\n} from \"./color-picker.types\"\nimport { getChannelDetails } from \"./utils/get-channel-details\"\nimport { getChannelDisplayColor } from \"./utils/get-channel-display-color\"\nimport { getChannelInputRange, getChannelInputValue } from \"./utils/get-channel-input-value\"\nimport { getColorAreaGradient } from \"./utils/get-color-area-gradient\"\nimport { getSliderBgImage } from \"./utils/get-slider-background\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): PublicApi<T> {\n const valueAsColor = state.context.valueAsColor\n const value = state.context.value\n const isDisabled = state.context.disabled\n const isInteractive = state.context.isInteractive\n const isDragging = state.matches(\"dragging\")\n\n const channels = valueAsColor.getColorChannels()\n\n return {\n isDragging,\n value,\n valueAsColor,\n alpha: valueAsColor.getChannelValue(\"alpha\"),\n channels,\n\n setColor(value: string | Color) {\n send({ type: \"VALUE.SET\", value: normalizeColor(value), src: \"set-color\" })\n },\n\n setChannelValue(channel: ColorChannel, value: number) {\n const color = valueAsColor.withChannelValue(channel, value)\n send({ type: \"VALUE.SET\", value: color, src: \"set-channel\" })\n },\n\n setFormat(format: ColorFormat) {\n const value = valueAsColor.toFormat(format)\n send({ type: \"VALUE.SET\", value, src: \"set-format\" })\n },\n\n setAlpha(value: number) {\n const color = valueAsColor.withChannelValue(\"alpha\", value)\n send({ type: \"VALUE.SET\", value: color, src: \"set-alpha\" })\n },\n\n contentProps: normalize.element({\n ...parts.content.attrs,\n id: dom.getContentId(state.context),\n }),\n\n getAreaProps(props: ColorAreaProps) {\n const { xChannel, yChannel } = props\n const { areaStyles } = getColorAreaGradient(state.context, xChannel, yChannel)\n\n return normalize.element({\n ...parts.area.attrs,\n id: dom.getAreaId(state.context),\n role: \"group\",\n onPointerDown(event) {\n if (!isInteractive) return\n\n const evt = getNativeEvent(event)\n if (!isLeftClick(evt) || isModifiedEvent(evt)) return\n\n const point = getEventPoint(evt)\n const channel = { xChannel, yChannel }\n\n send({ type: \"AREA.POINTER_DOWN\", point, channel, id: \"area\" })\n },\n style: {\n position: \"relative\",\n touchAction: \"none\",\n forcedColorAdjust: \"none\",\n ...areaStyles,\n },\n })\n },\n\n getAreaGradientProps(props: ColorAreaProps) {\n const { xChannel, yChannel } = props\n const { areaGradientStyles } = getColorAreaGradient(state.context, xChannel, yChannel)\n\n return normalize.element({\n ...parts.areaGradient.attrs,\n id: dom.getAreaGradientId(state.context),\n style: {\n position: \"relative\",\n touchAction: \"none\",\n forcedColorAdjust: \"none\",\n ...areaGradientStyles,\n },\n })\n },\n\n getAreaThumbProps(props: ColorAreaProps) {\n const { xChannel, yChannel } = props\n const { getThumbPosition } = getChannelDetails(valueAsColor, xChannel, yChannel)\n const { x, y } = getThumbPosition()\n\n const channel = { xChannel, yChannel }\n\n return normalize.element({\n ...parts.areaThumb.attrs,\n id: dom.getAreaThumbId(state.context),\n tabIndex: isDisabled ? undefined : 0,\n \"data-disabled\": dataAttr(isDisabled),\n role: \"presentation\",\n style: {\n position: \"absolute\",\n left: `${x * 100}%`,\n top: `${y * 100}%`,\n transform: \"translate(-50%, -50%)\",\n touchAction: \"none\",\n forcedColorAdjust: \"none\",\n background: valueAsColor.withChannelValue(\"alpha\", 1).toString(\"css\"),\n },\n onBlur() {\n send(\"AREA.BLUR\")\n },\n onFocus() {\n send({ type: \"AREA.FOCUS\", id: \"area\" })\n },\n onKeyDown(event) {\n if (!isInteractive) return\n\n const step = getEventStep(event)\n\n const keyMap: EventKeyMap = {\n ArrowUp() {\n send({ type: \"AREA.ARROW_UP\", channel, step })\n },\n ArrowDown() {\n send({ type: \"AREA.ARROW_DOWN\", channel, step })\n },\n ArrowLeft() {\n send({ type: \"AREA.ARROW_LEFT\", channel, step })\n },\n ArrowRight() {\n send({ type: \"AREA.ARROW_RIGHT\", channel, step })\n },\n PageUp() {\n send({ type: \"AREA.PAGE_UP\", channel, step })\n },\n PageDown() {\n send({ type: \"AREA.PAGE_DOWN\", channel, step })\n },\n }\n\n const exec = keyMap[getEventKey(event, state.context)]\n\n if (exec) {\n exec(event)\n event.preventDefault()\n }\n },\n })\n },\n\n getChannelSliderTrackProps(props: ColorChannelProps) {\n const { orientation = \"horizontal\", channel } = props\n\n return normalize.element({\n ...parts.channelSliderTrack.attrs,\n id: dom.getChannelSliderTrackId(state.context, channel),\n role: \"group\",\n \"data-channel\": channel,\n \"data-orientation\": orientation,\n onPointerDown(event) {\n if (!isInteractive) return\n\n const evt = getNativeEvent(event)\n if (!isLeftClick(evt) || isModifiedEvent(evt)) return\n\n const point = getEventPoint(evt)\n send({ type: \"CHANNEL_SLIDER.POINTER_DOWN\", channel, point, id: channel, orientation })\n },\n style: {\n position: \"relative\",\n touchAction: \"none\",\n forcedColorAdjust: \"none\",\n backgroundImage: getSliderBgImage(state.context, { orientation, channel }),\n },\n })\n },\n\n getChannelSliderBackgroundProps(props: ColorChannelProps) {\n const { orientation = \"horizontal\", channel } = props\n return normalize.element({\n ...parts.channelSliderTrackBackground.attrs,\n \"data-orientation\": orientation,\n \"data-channel\": channel,\n style: {\n position: \"absolute\",\n backgroundColor: \"#fff\",\n backgroundImage: [\n \"linear-gradient(-45deg,#0000 75.5%,#bcbcbc 75.5%)\",\n \"linear-gradient(45deg,#0000 75.5%,#bcbcbc 75.5%)\",\n \"linear-gradient(-45deg,#bcbcbc 25.5%,#0000 25.5%)\",\n \"linear-gradient(45deg,#bcbcbc 25.5%,#0000 25.5%)\",\n ].join(\",\"),\n backgroundSize: \"16px 16px\",\n backgroundPosition: \"-2px -2px,-2px 6px,6px -10px,-10px -2px\",\n inset: 0,\n zIndex: -1,\n },\n })\n },\n\n getChannelSliderThumbProps(props: ColorChannelProps) {\n const { orientation = \"horizontal\", channel } = props\n const { minValue, maxValue, step: stepValue } = valueAsColor.getChannelRange(channel)\n const channelValue = valueAsColor.getChannelValue(channel)\n\n const offset = (channelValue - minValue) / (maxValue - minValue)\n\n const placementStyles =\n orientation === \"horizontal\"\n ? { left: `${offset * 100}%`, top: \"50%\" }\n : { top: `${offset * 100}%`, left: \"50%\" }\n\n return normalize.element({\n ...parts.channelSliderThumb.attrs,\n id: dom.getChannelSliderThumbId(state.context, channel),\n role: \"slider\",\n \"aria-label\": channel,\n tabIndex: isDisabled ? undefined : 0,\n \"data-channel\": channel,\n \"data-disabled\": dataAttr(isDisabled),\n \"data-orientation\": orientation,\n \"aria-disabled\": dataAttr(isDisabled),\n \"aria-orientation\": orientation,\n \"aria-valuemax\": maxValue,\n \"aria-valuemin\": minValue,\n \"aria-valuenow\": channelValue,\n style: {\n forcedColorAdjust: \"none\",\n position: \"absolute\",\n background: getChannelDisplayColor(valueAsColor, channel).toString(\"css\"),\n ...placementStyles,\n },\n onFocus() {\n if (!isInteractive) return\n send({ type: \"CHANNEL_SLIDER.FOCUS\", channel })\n },\n onBlur() {\n if (!isInteractive) return\n send({ type: \"CHANNEL_SLIDER.BLUR\", channel })\n },\n onKeyDown(event) {\n if (!isInteractive) return\n const step = getEventStep(event) * stepValue\n\n const keyMap: EventKeyMap = {\n ArrowUp() {\n send({ type: \"CHANNEL_SLIDER.ARROW_UP\", channel, step })\n },\n ArrowDown() {\n send({ type: \"CHANNEL_SLIDER.ARROW_DOWN\", channel, step })\n },\n ArrowLeft() {\n send({ type: \"CHANNEL_SLIDER.ARROW_LEFT\", channel, step })\n },\n ArrowRight() {\n send({ type: \"CHANNEL_SLIDER.ARROW_RIGHT\", channel, step })\n },\n PageUp() {\n send({ type: \"CHANNEL_SLIDER.PAGE_UP\", channel })\n },\n PageDown() {\n send({ type: \"CHANNEL_SLIDER.PAGE_DOWN\", channel })\n },\n Home() {\n send({ type: \"CHANNEL_SLIDER.HOME\", channel })\n },\n End() {\n send({ type: \"CHANNEL_SLIDER.END\", channel })\n },\n }\n\n const exec = keyMap[getEventKey(event, state.context)]\n\n if (exec) {\n exec(event)\n event.preventDefault()\n }\n },\n })\n },\n\n getChannelInputProps(props: ColorChannelInputProps) {\n const { channel } = props\n const isTextField = channel === \"hex\" || channel === \"css\"\n const range = getChannelInputRange(valueAsColor, channel)\n\n return normalize.input({\n ...parts.channelInput.attrs,\n type: isTextField ? \"text\" : \"number\",\n \"data-channel\": channel,\n \"aria-label\": channel,\n disabled: isDisabled,\n \"data-disabled\": dataAttr(isDisabled),\n readOnly: state.context.readOnly,\n id: dom.getChannelInputId(state.context, channel),\n defaultValue: getChannelInputValue(valueAsColor, channel),\n min: range?.minValue,\n max: range?.maxValue,\n step: range?.step,\n onFocus() {\n send({ type: \"CHANNEL_INPUT.FOCUS\", channel })\n },\n onChange(event) {\n if (isTextField) return\n const value = event.currentTarget.value\n send({ type: \"CHANNEL_INPUT.CHANGE\", channel, value, isTextField })\n },\n onBlur(event) {\n const value = event.currentTarget.value\n send({ type: \"CHANNEL_INPUT.BLUR\", channel, value, isTextField })\n },\n onKeyDown(event) {\n if (!isTextField) return\n if (event.key === \"Enter\") {\n const value = event.currentTarget.value\n send({ type: \"CHANNEL_INPUT.CHANGE\", channel, value, isTextField })\n }\n },\n style: {\n appearance: \"none\",\n WebkitAppearance: \"none\",\n MozAppearance: \"textfield\",\n },\n })\n },\n\n hiddenInputProps: normalize.input({\n ...parts.hiddenInput.attrs,\n type: \"text\",\n disabled: isDisabled,\n name: state.context.name,\n id: dom.getHiddenInputId(state.context),\n style: visuallyHiddenStyle,\n defaultValue: value,\n onChange(event) {\n const value = event.currentTarget.value\n send({ type: \"VALUE.SET\", value, src: \"input.change\" })\n },\n }),\n\n eyeDropperTriggerProps: normalize.button({\n ...parts.eyeDropperTrigger.attrs,\n disabled: isDisabled,\n \"data-disabled\": dataAttr(isDisabled),\n \"aria-label\": \"Pick a color from the screen\",\n onClick() {\n if (!isInteractive) return\n send(\"EYEDROPPER.CLICK\")\n },\n }),\n\n getSwatchBackgroundProps(props: ColorSwatchProps) {\n const { value } = props\n const alpha = normalizeColor(value).getChannelValue(\"alpha\")\n return normalize.element({\n ...parts.swatchBackground.attrs,\n \"data-alpha\": alpha,\n style: {\n width: \"100%\",\n height: \"100%\",\n background: \"#fff\",\n backgroundImage: [\n \"linear-gradient(-45deg,#0000 75.5%,#bcbcbc 75.5%)\",\n \"linear-gradient(45deg,#0000 75.5%,#bcbcbc 75.5%)\",\n \"linear-gradient(-45deg,#bcbcbc 25.5%,#0000 25.5%)\",\n \"linear-gradient(45deg,#bcbcbc 25.5%,#0000 25.5%)\",\n ].join(\",\"),\n backgroundPosition: \"-2px -2px,-2px 6px,6px -10px,-10px -2px\",\n backgroundSize: \"16px 16px\",\n position: \"absolute\",\n inset: \"0px\",\n zIndex: -1,\n },\n })\n },\n\n getSwatchProps(props: ColorSwatchProps) {\n const { value, readOnly } = props\n const color = normalizeColor(value).toFormat(valueAsColor.getColorSpace())\n return normalize.element({\n ...parts.swatch.attrs,\n onClick() {\n if (readOnly || !isInteractive) return\n send({ type: \"VALUE.SET\", value: color })\n },\n style: {\n position: \"relative\",\n background: color.toString(\"css\"),\n },\n })\n },\n }\n}\n","import type { ColorChannel } from \"@zag-js/color-utils\"\nimport { getRelativePoint, type Point } from \"@zag-js/dom-event\"\nimport { createScope, queryAll } from \"@zag-js/dom-query\"\nimport type { MachineContext as Ctx } from \"./color-picker.types\"\n\nexport const dom = createScope({\n getContentId: (ctx: Ctx) => ctx.ids?.content ?? `color-picker:${ctx.id}:content`,\n getAreaId: (ctx: Ctx) => ctx.ids?.area ?? `color-picker:${ctx.id}:area`,\n getAreaGradientId: (ctx: Ctx) => ctx.ids?.areaGradient ?? `color-picker:${ctx.id}:area-gradient`,\n getAreaThumbId: (ctx: Ctx) => ctx.ids?.areaThumb ?? `color-picker:${ctx.id}:area-thumb`,\n getChannelSliderTrackId: (ctx: Ctx, channel: ColorChannel) =>\n ctx.ids?.channelSliderTrack?.(channel) ?? `color-picker:${ctx.id}:slider-track:${channel}`,\n getChannelInputId: (ctx: Ctx, channel: string) =>\n ctx.ids?.channelInput?.(channel) ?? `color-picker:${ctx.id}:input:${channel}`,\n getChannelSliderThumbId: (ctx: Ctx, channel: ColorChannel) =>\n ctx.ids?.channelSliderThumb?.(channel) ?? `color-picker:${ctx.id}:slider-thumb:${channel}`,\n getHiddenInputId: (ctx: Ctx) => `color-picker:${ctx.id}:hidden-input`,\n\n getContentEl: (ctx: Ctx) => dom.getById(ctx, dom.getContentId(ctx)),\n getAreaThumbEl: (ctx: Ctx) => dom.getById(ctx, dom.getAreaThumbId(ctx)),\n getChannelSliderThumbEl: (ctx: Ctx, channel: ColorChannel) =>\n dom.getById(ctx, dom.getChannelSliderThumbId(ctx, channel)),\n getChannelInputEl: (ctx: Ctx, channel: string) =>\n dom.getById<HTMLInputElement>(ctx, dom.getChannelInputId(ctx, channel)),\n\n getHiddenInputEl: (ctx: Ctx) => dom.getById<HTMLInputElement>(ctx, dom.getHiddenInputId(ctx)),\n getAreaEl: (ctx: Ctx) => dom.getById(ctx, dom.getAreaId(ctx)),\n getAreaValueFromPoint(ctx: Ctx, point: Point) {\n const areaEl = dom.getAreaEl(ctx)\n if (!areaEl) return\n const { percent } = getRelativePoint(point, areaEl)\n return percent\n },\n\n getChannelSliderTrackEl: (ctx: Ctx, channel: ColorChannel) => {\n return dom.getById(ctx, dom.getChannelSliderTrackId(ctx, channel))\n },\n getChannelSliderValueFromPoint(ctx: Ctx, point: Point, channel: ColorChannel) {\n const trackEl = dom.getChannelSliderTrackEl(ctx, channel)\n if (!trackEl) return\n const { percent } = getRelativePoint(point, trackEl)\n return percent\n },\n getChannelInputEls: (ctx: Ctx) => {\n return queryAll<HTMLInputElement>(dom.getContentEl(ctx), \"input[data-channel]\")\n },\n})\n","import type { Color, ColorChannel } from \"@zag-js/color-utils\"\nimport { getPercentValue, snapValueToStep } from \"@zag-js/numeric-range\"\n\nexport function getChannelDetails(color: Color, xChannel: ColorChannel, yChannel: ColorChannel) {\n const channels = color.getColorSpaceAxes({ xChannel, yChannel })\n\n const xChannelRange = color.getChannelRange(channels.xChannel)\n const yChannelRange = color.getChannelRange(channels.yChannel)\n\n const { minValue: minValueX, maxValue: maxValueX, step: stepX, pageSize: pageSizeX } = xChannelRange\n const { minValue: minValueY, maxValue: maxValueY, step: stepY, pageSize: pageSizeY } = yChannelRange\n\n const xValue = color.getChannelValue(channels.xChannel)\n const yValue = color.getChannelValue(channels.yChannel)\n\n return {\n channels,\n xChannelStep: stepX,\n yChannelStep: stepY,\n xChannelPageStep: pageSizeX,\n yChannelPageStep: pageSizeY,\n xValue,\n yValue,\n getThumbPosition() {\n let x = (xValue - minValueX) / (maxValueX - minValueX)\n let y = 1 - (yValue - minValueY) / (maxValueY - minValueY)\n return { x, y }\n },\n incrementX(stepSize: number) {\n return xValue + stepSize > maxValueX ? maxValueX : snapValueToStep(xValue + stepSize, minValueX, maxValueX, stepX)\n },\n incrementY(stepSize: number) {\n return yValue + stepSize > maxValueY ? maxValueY : snapValueToStep(yValue + stepSize, minValueY, maxValueY, stepY)\n },\n decrementX(stepSize: number) {\n return snapValueToStep(xValue - stepSize, minValueX, maxValueX, stepX)\n },\n decrementY(stepSize: number) {\n return snapValueToStep(yValue - stepSize, minValueY, maxValueY, stepY)\n },\n getColorFromPoint(x: number, y: number) {\n let newXValue = getPercentValue(x, minValueX, maxValueX, stepX)\n let newYValue = getPercentValue(1 - y, minValueY, maxValueY, stepY)\n\n let newColor: Color | undefined\n\n if (newXValue !== xValue) {\n newXValue = snapValueToStep(newXValue, minValueX, maxValueX, stepX)\n newColor = color.withChannelValue(channels.xChannel, newXValue)\n }\n\n if (newYValue !== yValue) {\n newYValue = snapValueToStep(newYValue, minValueY, maxValueY, stepY)\n newColor = (newColor || color).withChannelValue(channels.yChannel, newYValue)\n }\n\n return newColor\n },\n }\n}\n","import { parseColor, type Color, type ColorChannel } from \"@zag-js/color-utils\"\n\nexport function getChannelDisplayColor(color: Color, channel: ColorChannel) {\n switch (channel) {\n case \"hue\":\n return parseColor(`hsl(${color.getChannelValue(\"hue\")}, 100%, 50%)`)\n case \"lightness\":\n case \"brightness\":\n case \"saturation\":\n case \"red\":\n case \"green\":\n case \"blue\":\n return color.withChannelValue(\"alpha\", 1)\n case \"alpha\": {\n return color\n }\n default:\n throw new Error(\"Unknown color channel: \" + channel)\n }\n}\n","import type { Color } from \"@zag-js/color-utils\"\nimport type { ExtendedColorChannel } from \"../color-picker.types\"\n\nexport function getChannelInputValue(color: Color, channel: ExtendedColorChannel) {\n switch (channel) {\n case \"hex\":\n return color.toString(\"hex\")\n case \"css\":\n return color.toString(\"css\")\n default:\n return color.getChannelValue(channel).toString()\n }\n}\n\nexport function getChannelInputRange(color: Color, channel: ExtendedColorChannel) {\n switch (channel) {\n case \"hex\":\n case \"css\":\n return undefined\n default:\n return color.getChannelRange(channel)\n }\n}\n","export const generateRGB_R = (orientation: [string, string], dir: boolean, zValue: number) => {\n const maskImage = `linear-gradient(to ${orientation[Number(!dir)]}, transparent, #000)`\n const result = {\n areaStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(${zValue},0,0),rgb(${zValue},255,0))`,\n },\n areaGradientStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(${zValue},0,255),rgb(${zValue},255,255))`,\n WebkitMaskImage: maskImage,\n maskImage,\n },\n }\n return result\n}\n\nexport const generateRGB_G = (orientation: [string, string], dir: boolean, zValue: number) => {\n const maskImage = `linear-gradient(to ${orientation[Number(!dir)]}, transparent, #000)`\n const result = {\n areaStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(0,${zValue},0),rgb(255,${zValue},0))`,\n },\n areaGradientStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(0,${zValue},255),rgb(255,${zValue},255))`,\n WebkitMaskImage: maskImage,\n maskImage,\n },\n }\n return result\n}\n\nexport const generateRGB_B = (orientation: [string, string], dir: boolean, zValue: number) => {\n const maskImage = `linear-gradient(to ${orientation[Number(!dir)]}, transparent, #000)`\n const result = {\n areaStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(0,0,${zValue}),rgb(255,0,${zValue}))`,\n },\n areaGradientStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(0,255,${zValue}),rgb(255,255,${zValue}))`,\n WebkitMaskImage: maskImage,\n maskImage,\n },\n }\n return result\n}\n\nexport const generateHSL_H = (orientation: [string, string], dir: boolean, zValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${\n orientation[Number(dir)]\n }, hsla(0,0%,0%,1) 0%, hsla(0,0%,0%,0) 50%, hsla(0,0%,100%,0) 50%, hsla(0,0%,100%,1) 100%)`,\n `linear-gradient(to ${orientation[Number(!dir)]},hsl(0,0%,50%),hsla(0,0%,50%,0))`,\n `hsl(${zValue}, 100%, 50%)`,\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSL_S = (orientation: [string, string], dir: boolean, alphaValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${\n orientation[Number(!dir)]\n }, hsla(0,0%,0%,${alphaValue}) 0%, hsla(0,0%,0%,0) 50%, hsla(0,0%,100%,0) 50%, hsla(0,0%,100%,${alphaValue}) 100%)`,\n `linear-gradient(to ${\n orientation[Number(dir)]\n },hsla(0,100%,50%,${alphaValue}),hsla(60,100%,50%,${alphaValue}),hsla(120,100%,50%,${alphaValue}),hsla(180,100%,50%,${alphaValue}),hsla(240,100%,50%,${alphaValue}),hsla(300,100%,50%,${alphaValue}),hsla(359,100%,50%,${alphaValue}))`,\n \"hsl(0, 0%, 50%)\",\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSL_L = (orientation: [string, string], dir: boolean, zValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n backgroundImage: [\n `linear-gradient(to ${orientation[Number(!dir)]},hsl(0,0%,${zValue}%),hsla(0,0%,${zValue}%,0))`,\n `linear-gradient(to ${\n orientation[Number(dir)]\n },hsl(0,100%,${zValue}%),hsl(60,100%,${zValue}%),hsl(120,100%,${zValue}%),hsl(180,100%,${zValue}%),hsl(240,100%,${zValue}%),hsl(300,100%,${zValue}%),hsl(360,100%,${zValue}%))`,\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSB_H = (orientation: [string, string], dir: boolean, zValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${orientation[Number(dir)]},hsl(0,0%,0%),hsla(0,0%,0%,0))`,\n `linear-gradient(to ${orientation[Number(!dir)]},hsl(0,0%,100%),hsla(0,0%,100%,0))`,\n `hsl(${zValue}, 100%, 50%)`,\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSB_S = (orientation: [string, string], dir: boolean, alphaValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${orientation[Number(!dir)]},hsla(0,0%,0%,${alphaValue}),hsla(0,0%,0%,0))`,\n `linear-gradient(to ${\n orientation[Number(dir)]\n },hsla(0,100%,50%,${alphaValue}),hsla(60,100%,50%,${alphaValue}),hsla(120,100%,50%,${alphaValue}),hsla(180,100%,50%,${alphaValue}),hsla(240,100%,50%,${alphaValue}),hsla(300,100%,50%,${alphaValue}),hsla(359,100%,50%,${alphaValue}))`,\n `linear-gradient(to ${orientation[Number(!dir)]},hsl(0,0%,0%),hsl(0,0%,100%))`,\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSB_B = (orientation: [string, string], dir: boolean, alphaValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${orientation[Number(!dir)]},hsla(0,0%,100%,${alphaValue}),hsla(0,0%,100%,0))`,\n `linear-gradient(to ${\n orientation[Number(dir)]\n },hsla(0,100%,50%,${alphaValue}),hsla(60,100%,50%,${alphaValue}),hsla(120,100%,50%,${alphaValue}),hsla(180,100%,50%,${alphaValue}),hsla(240,100%,50%,${alphaValue}),hsla(300,100%,50%,${alphaValue}),hsla(359,100%,50%,${alphaValue}))`,\n \"#000\",\n ].join(\",\"),\n },\n }\n return result\n}\n","import type { ColorChannel } from \"@zag-js/color-utils\"\nimport type { Style } from \"@zag-js/types\"\nimport type { MachineContext } from \"../color-picker.types\"\nimport {\n generateHSB_B,\n generateHSB_H,\n generateHSB_S,\n generateHSL_H,\n generateHSL_L,\n generateHSL_S,\n generateRGB_B,\n generateRGB_G,\n generateRGB_R,\n} from \"./generate-format-background\"\n\nexport function getColorAreaGradient(ctx: MachineContext, xChannel: ColorChannel, yChannel: ColorChannel) {\n const value = ctx.valueAsColor\n\n const { zChannel } = value.getColorSpaceAxes({ xChannel, yChannel })\n const zValue = value.getChannelValue(zChannel)\n\n const { minValue: zMin, maxValue: zMax } = value.getChannelRange(zChannel)\n const orientation: [string, string] = [\"top\", ctx.dir === \"rtl\" ? \"left\" : \"right\"]\n\n let dir = false\n let background = { areaStyles: {} as Style, areaGradientStyles: {} as Style }\n\n let alphaValue = (zValue - zMin) / (zMax - zMin)\n let isHSL = value.getColorSpace() === \"hsl\"\n\n switch (zChannel) {\n case \"red\": {\n dir = xChannel === \"green\"\n background = generateRGB_R(orientation, dir, zValue)\n break\n }\n\n case \"green\": {\n dir = xChannel === \"red\"\n background = generateRGB_G(orientation, dir, zValue)\n break\n }\n\n case \"blue\": {\n dir = xChannel === \"red\"\n background = generateRGB_B(orientation, dir, zValue)\n break\n }\n\n case \"hue\": {\n dir = xChannel !== \"saturation\"\n if (isHSL) {\n background = generateHSL_H(orientation, dir, zValue)\n } else {\n background = generateHSB_H(orientation, dir, zValue)\n }\n break\n }\n\n case \"saturation\": {\n dir = xChannel === \"hue\"\n if (isHSL) {\n background = generateHSL_S(orientation, dir, alphaValue)\n } else {\n background = generateHSB_S(orientation, dir, alphaValue)\n }\n break\n }\n\n case \"brightness\": {\n dir = xChannel === \"hue\"\n background = generateHSB_B(orientation, dir, alphaValue)\n break\n }\n\n case \"lightness\": {\n dir = xChannel === \"hue\"\n background = generateHSL_L(orientation, dir, zValue)\n break\n }\n }\n\n return background\n}\n","import type { ColorChannelProps, MachineContext } from \"../color-picker.types\"\n\nfunction getSliderBgDirection(orientation: \"vertical\" | \"horizontal\", dir: \"ltr\" | \"rtl\") {\n if (orientation === \"vertical\") {\n return \"top\"\n } else if (dir === \"ltr\") {\n return \"right\"\n } else {\n return \"left\"\n }\n}\n\nexport const getSliderBgImage = (ctx: MachineContext, props: Required<ColorChannelProps>) => {\n const { channel } = props\n\n const dir = getSliderBgDirection(props.orientation, ctx.dir!)\n const value = ctx.valueAsColor\n\n const { minValue, maxValue } = ctx.valueAsColor.getChannelRange(channel)\n\n switch (channel) {\n case \"hue\":\n return `linear-gradient(to ${dir}, rgb(255, 0, 0) 0%, rgb(255, 255, 0) 17%, rgb(0, 255, 0) 33%, rgb(0, 255, 255) 50%, rgb(0, 0, 255) 67%, rgb(255, 0, 255) 83%, rgb(255, 0, 0) 100%)`\n case \"lightness\": {\n let start = ctx.valueAsColor.withChannelValue(channel, minValue).toString(\"css\")\n let middle = value.withChannelValue(channel, (maxValue - minValue) / 2).toString(\"css\")\n let end = value.withChannelValue(channel, maxValue).toString(\"css\")\n return `linear-gradient(to ${dir}, ${start}, ${middle}, ${end})`\n }\n case \"saturation\":\n case \"brightness\":\n case \"red\":\n case \"green\":\n case \"blue\":\n case \"alpha\": {\n let start = value.withChannelValue(channel, minValue).toString(\"css\")\n let end = value.withChannelValue(channel, maxValue).toString(\"css\")\n return `linear-gradient(to ${dir}, ${start}, ${end})`\n }\n default:\n throw new Error(\"Unknown color channel: \" + channel)\n }\n}\n","import { parseColor, type Color } from \"@zag-js/color-utils\"\nimport { createMachine } from \"@zag-js/core\"\nimport { trackPointerMove } from \"@zag-js/dom-event\"\nimport { raf } from \"@zag-js/dom-query\"\nimport { trackFormControl } from \"@zag-js/form-utils\"\nimport { clampValue, getPercentValue, snapValueToStep } from \"@zag-js/numeric-range\"\nimport { disableTextSelection } from \"@zag-js/text-selection\"\nimport { compact } from \"@zag-js/utils\"\nimport { dom } from \"./color-picker.dom\"\nimport type { ExtendedColorChannel, MachineContext, MachineState, UserDefinedContext } from \"./color-picker.types\"\nimport { getChannelDetails } from \"./utils/get-channel-details\"\nimport { getChannelInputValue } from \"./utils/get-channel-input-value\"\n\nexport function machine(userContext: UserDefinedContext) {\n const ctx = compact(userContext)\n\n return createMachine<MachineContext, MachineState>(\n {\n id: \"color-picker\",\n initial: \"idle\",\n context: {\n dir: \"ltr\",\n activeId: null,\n activeChannel: null,\n activeOrientation: null,\n value: \"#D9D9D9\",\n ...ctx,\n },\n\n computed: {\n isRtl: (ctx) => ctx.dir === \"rtl\",\n isInteractive: (ctx) => !(ctx.disabled || ctx.readOnly),\n valueAsColor: (ctx) => parseColor(ctx.value),\n },\n\n on: {\n \"VALUE.SET\": {\n actions: [\"setValue\"],\n },\n },\n\n activities: [\"trackFormControl\"],\n\n watch: {\n value: [\"syncInputElements\", \"invokeOnChange\"],\n },\n\n states: {\n idle: {\n on: {\n \"EYEDROPPER.CLICK\": {\n actions: [\"openEyeDropper\"],\n },\n \"AREA.POINTER_DOWN\": {\n target: \"dragging\",\n actions: [\"setActiveChannel\", \"setAreaColorFromPoint\", \"focusAreaThumb\"],\n },\n \"AREA.FOCUS\": {\n target: \"focused\",\n actions: [\"setActiveChannel\"],\n },\n \"CHANNEL_SLIDER.POINTER_DOWN\": {\n target: \"dragging\",\n actions: [\"setActiveChannel\", \"setChannelColorFromPoint\", \"focusChannelThumb\"],\n },\n \"CHANNEL_SLIDER.FOCUS\": {\n target: \"focused\",\n actions: [\"setActiveChannel\"],\n },\n \"CHANNEL_INPUT.FOCUS\": {\n target: \"focused\",\n actions: [\"setActiveChannel\"],\n },\n \"CHANNEL_INPUT.CHANGE\": {\n actions: [\"setChannelColorFromInput\"],\n },\n },\n },\n\n focused: {\n on: {\n \"AREA.POINTER_DOWN\": {\n target: \"dragging\",\n actions: [\"setActiveChannel\", \"setAreaColorFromPoint\", \"focusAreaThumb\"],\n },\n \"CHANNEL_SLIDER.POINTER_DOWN\": {\n target: \"dragging\",\n actions: [\"setActiveChannel\", \"setChannelColorFromPoint\", \"focusChannelThumb\"],\n },\n \"AREA.ARROW_LEFT\": {\n actions: [\"decrementXChannel\"],\n },\n \"AREA.ARROW_RIGHT\": {\n actions: [\"incrementXChannel\"],\n },\n \"AREA.ARROW_UP\": {\n actions: [\"incrementYChannel\"],\n },\n \"AREA.ARROW_DOWN\": {\n actions: [\"decrementYChannel\"],\n },\n \"AREA.PAGE_UP\": {\n actions: [\"incrementXChannel\"],\n },\n \"AREA.PAGE_DOWN\": {\n actions: [\"decrementXChannel\"],\n },\n \"CHANNEL_SLIDER.ARROW_LEFT\": {\n actions: [\"decrementChannel\"],\n },\n \"CHANNEL_SLIDER.ARROW_RIGHT\": {\n actions: [\"incrementChannel\"],\n },\n \"CHANNEL_SLIDER.ARROW_UP\": {\n actions: [\"incrementChannel\"],\n },\n \"CHANNEL_SLIDER.ARROW_DOWN\": {\n actions: [\"decrementChannel\"],\n },\n \"CHANNEL_SLIDER.PAGE_UP\": {\n actions: [\"incrementChannel\"],\n },\n \"CHANNEL_SLIDER.PAGE_DOWN\": {\n actions: [\"decrementChannel\"],\n },\n \"CHANNEL_SLIDER.HOME\": {\n actions: [\"setChannelToMin\"],\n },\n \"CHANNEL_SLIDER.END\": {\n actions: [\"setChannelToMax\"],\n },\n \"CHANNEL_INPUT.FOCUS\": {\n actions: [\"setActiveChannel\"],\n },\n \"CHANNEL_INPUT.CHANGE\": {\n actions: [\"setChannelColorFromInput\"],\n },\n \"CHANNEL_INPUT.BLUR\": [\n {\n guard: \"isTextField\",\n target: \"idle\",\n actions: [\"setChannelColorFromInput\"],\n },\n { target: \"idle\" },\n ],\n \"CHANNEL_SLIDER.BLUR\": {\n target: \"idle\",\n },\n \"AREA.BLUR\": {\n target: \"idle\",\n },\n },\n },\n\n dragging: {\n exit: [\"clearActiveChannel\"],\n activities: [\"trackPointerMove\", \"disableTextSelection\"],\n on: {\n \"AREA.POINTER_MOVE\": {\n actions: [\"setAreaColorFromPoint\"],\n },\n \"AREA.POINTER_UP\": {\n target: \"focused\",\n actions: [\"invokeOnChangeEnd\"],\n },\n \"CHANNEL_SLIDER.POINTER_MOVE\": {\n actions: [\"setChannelColorFromPoint\"],\n },\n \"CHANNEL_SLIDER.POINTER_UP\": {\n target: \"focused\",\n actions: [\"invokeOnChangeEnd\"],\n },\n },\n },\n },\n },\n {\n guards: {\n isTextField: (_ctx, evt) => !!evt.isTextField,\n },\n activities: {\n trackFormControl(ctx, _evt, { send, initialContext }) {\n const inputEl = dom.getHiddenInputEl(ctx)\n return trackFormControl(inputEl, {\n onFieldsetDisabled() {\n ctx.disabled = true\n },\n onFormReset() {\n send({ type: \"VALUE.SET\", value: initialContext.value, src: \"form.reset\" })\n },\n })\n },\n trackPointerMove(ctx, _evt, { send }) {\n return trackPointerMove(dom.getDoc(ctx), {\n onPointerMove({ point }) {\n const type = ctx.activeId === \"area\" ? \"AREA.POINTER_MOVE\" : \"CHANNEL_SLIDER.POINTER_MOVE\"\n send({ type, point })\n },\n onPointerUp() {\n const type = ctx.activeId === \"area\" ? \"AREA.POINTER_UP\" : \"CHANNEL_SLIDER.POINTER_UP\"\n send({ type })\n },\n })\n },\n disableTextSelection(ctx) {\n return disableTextSelection({ doc: dom.getDoc(ctx), target: dom.getContentEl(ctx) })\n },\n },\n actions: {\n openEyeDropper(ctx) {\n const isSupported = \"EyeDropper\" in dom.getWin(ctx)\n if (!isSupported) return\n const win = dom.getWin(ctx) as any\n const picker = new win.EyeDropper()\n picker\n .open()\n .then(({ sRGBHex }: { sRGBHex: string }) => {\n const format = ctx.valueAsColor.getColorSpace()\n const color = parseColor(sRGBHex).toFormat(format)\n setColor(ctx, color)\n ctx.onChangeEnd?.({ value: ctx.value, valueAsColor: color })\n })\n .catch(() => void 0)\n },\n setActiveChannel(ctx, evt) {\n ctx.activeId = evt.id\n if (evt.channel) {\n ctx.activeChannel = evt.channel\n }\n if (evt.orientation) {\n ctx.activeOrientation = evt.orientation\n }\n },\n clearActiveChannel(ctx) {\n ctx.activeChannel = null\n ctx.activeId = null\n ctx.activeOrientation = null\n },\n setAreaColorFromPoint(ctx, evt) {\n const { xChannel, yChannel } = evt.channel || ctx.activeChannel\n\n const percent = dom.getAreaValueFromPoint(ctx, evt.point)\n if (!percent) return\n\n const { getColorFromPoint } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const color = getColorFromPoint(percent.x, percent.y)\n\n if (!color) return\n setColor(ctx, color)\n },\n setChannelColorFromPoint(ctx, evt) {\n const channel = evt.channel || ctx.activeId\n\n const percent = dom.getChannelSliderValueFromPoint(ctx, evt.point, channel)\n if (!percent) return\n\n const { minValue, maxValue, step } = ctx.valueAsColor.getChannelRange(channel)\n const orientation = ctx.activeOrientation || \"horizontal\"\n\n const point = orientation === \"horizontal\" ? percent.x : percent.y\n const channelValue = getPercentValue(point, minValue, maxValue, step)\n\n const value = snapValueToStep(channelValue - step, minValue, maxValue, step)\n const newColor = ctx.valueAsColor.withChannelValue(channel, value)\n\n setColor(ctx, newColor)\n },\n setValue(ctx, evt) {\n setColor(ctx, evt.value)\n },\n syncInputElements(ctx) {\n // sync channel inputs\n const inputs = dom.getChannelInputEls(ctx)\n inputs.forEach((input) => {\n const channel = input.dataset.channel as ExtendedColorChannel | null\n if (!channel) return\n input.value = getChannelInputValue(ctx.valueAsColor, channel)\n })\n\n // sync hidden input\n const hiddenInput = dom.getHiddenInputEl(ctx)\n if (!hiddenInput) return\n hiddenInput.value = ctx.value\n },\n setChannelColorFromInput(ctx, evt) {\n const { channel, isTextField, value } = evt\n try {\n const format = ctx.valueAsColor.getColorSpace()\n\n const newColor = isTextField\n ? parseColor(value).toFormat(format)\n : ctx.valueAsColor.withChannelValue(channel, value)\n\n setColor(ctx, newColor)\n //\n } catch {\n // reset input value\n const input = dom.getChannelInputEl(ctx, channel)\n if (!input) return\n input.value = getChannelInputValue(ctx.valueAsColor, channel)\n }\n },\n\n incrementChannel(ctx, evt) {\n const { minValue, maxValue, step } = ctx.valueAsColor.getChannelRange(evt.channel)\n const channelValue = ctx.valueAsColor.getChannelValue(evt.channel)\n const value = snapValueToStep(channelValue + evt.step, minValue, maxValue, step)\n const newColor = ctx.valueAsColor.withChannelValue(evt.channel, clampValue(value, minValue, maxValue))\n setColor(ctx, newColor)\n },\n decrementChannel(ctx, evt) {\n const { minValue, maxValue, step } = ctx.valueAsColor.getChannelRange(evt.channel)\n const channelValue = ctx.valueAsColor.getChannelValue(evt.channel)\n const value = snapValueToStep(channelValue - evt.step, minValue, maxValue, step)\n const newColor = ctx.valueAsColor.withChannelValue(evt.channel, clampValue(value, minValue, maxValue))\n setColor(ctx, newColor)\n },\n\n incrementXChannel(ctx, evt) {\n const { xChannel, yChannel } = evt.channel\n const { incrementX } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const newColor = ctx.valueAsColor.withChannelValue(xChannel, incrementX(evt.step))\n setColor(ctx, newColor)\n },\n decrementXChannel(ctx, evt) {\n const { xChannel, yChannel } = evt.channel\n const { decrementX } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const newColor = ctx.valueAsColor.withChannelValue(xChannel, decrementX(evt.step))\n setColor(ctx, newColor)\n },\n\n incrementYChannel(ctx, evt) {\n const { xChannel, yChannel } = evt.channel\n const { incrementY } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const newColor = ctx.valueAsColor.withChannelValue(yChannel, incrementY(evt.step))\n setColor(ctx, newColor)\n },\n decrementYChannel(ctx, evt) {\n const { xChannel, yChannel } = evt.channel\n const { decrementY } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const newColor = ctx.valueAsColor.withChannelValue(yChannel, decrementY(evt.step))\n setColor(ctx, newColor)\n },\n\n setChannelToMax(ctx, evt) {\n const { maxValue } = ctx.valueAsColor.getChannelRange(evt.channel)\n const newColor = ctx.valueAsColor.withChannelValue(evt.channel, maxValue)\n setColor(ctx, newColor)\n },\n setChannelToMin(ctx, evt) {\n const { minValue } = ctx.valueAsColor.getChannelRange(evt.channel)\n const newColor = ctx.valueAsColor.withChannelValue(evt.channel, minValue)\n setColor(ctx, newColor)\n },\n\n invokeOnChangeEnd(ctx) {\n ctx.onChangeEnd?.({ value: ctx.value, valueAsColor: ctx.valueAsColor })\n },\n invokeOnChange(ctx) {\n ctx.onChange?.({ value: ctx.value, valueAsColor: ctx.valueAsColor })\n },\n focusAreaThumb(ctx) {\n raf(() => {\n dom.getAreaThumbEl(ctx)?.focus({ preventScroll: true })\n })\n },\n focusChannelThumb(ctx, evt) {\n raf(() => {\n dom.getChannelSliderThumbEl(ctx, evt.channel)?.focus({ preventScroll: true })\n })\n },\n },\n },\n )\n}\n\nconst setColor = (ctx: MachineContext, color: Color) => {\n ctx.value = color.toString(\"css\")\n}\n"],"mappings":"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","names":["value","parseColor","getPercentValue","snapValueToStep","ctx","parseColor","getPercentValue","snapValueToStep"]}
|
|
1
|
+
{"version":3,"sources":["../src/color-picker.anatomy.ts","../src/color-picker.connect.ts","../src/color-picker.dom.ts","../src/utils/get-channel-details.ts","../src/utils/get-channel-display-color.ts","../src/utils/get-channel-input-value.ts","../src/utils/generate-format-background.ts","../src/utils/get-color-area-gradient.ts","../src/utils/get-slider-background.ts","../src/color-picker.machine.ts"],"sourcesContent":["import { createAnatomy } from \"@zag-js/anatomy\"\n\nexport const anatomy = createAnatomy(\"color-picker\", [\n \"area\",\n \"areaThumb\",\n \"areaGradient\",\n \"channelSliderTrack\",\n \"channelSliderTrackBackground\",\n \"channelSliderThumb\",\n \"channelInput\",\n \"swatch\",\n \"swatchBackground\",\n \"content\",\n \"label\",\n \"eyeDropperTrigger\",\n])\n\nexport const parts = anatomy.build()\n","import { normalizeColor, type Color, type ColorChannel, type ColorFormat } from \"@zag-js/color-utils\"\nimport {\n getEventKey,\n getEventPoint,\n getEventStep,\n getNativeEvent,\n isLeftClick,\n isModifiedEvent,\n type EventKeyMap,\n} from \"@zag-js/dom-event\"\nimport { dataAttr } from \"@zag-js/dom-query\"\nimport type { NormalizeProps, PropTypes } from \"@zag-js/types\"\nimport { visuallyHiddenStyle } from \"@zag-js/visually-hidden\"\nimport { parts } from \"./color-picker.anatomy\"\nimport { dom } from \"./color-picker.dom\"\nimport type {\n ColorAreaProps,\n ColorChannelInputProps,\n ColorChannelProps,\n ColorSwatchProps,\n PublicApi,\n Send,\n State,\n} from \"./color-picker.types\"\nimport { getChannelDetails } from \"./utils/get-channel-details\"\nimport { getChannelDisplayColor } from \"./utils/get-channel-display-color\"\nimport { getChannelInputRange, getChannelInputValue } from \"./utils/get-channel-input-value\"\nimport { getColorAreaGradient } from \"./utils/get-color-area-gradient\"\nimport { getSliderBgImage } from \"./utils/get-slider-background\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): PublicApi<T> {\n const valueAsColor = state.context.valueAsColor\n const value = state.context.value\n const isDisabled = state.context.disabled\n const isInteractive = state.context.isInteractive\n const isDragging = state.matches(\"dragging\")\n\n const channels = valueAsColor.getColorChannels()\n\n return {\n isDragging,\n value,\n valueAsColor,\n alpha: valueAsColor.getChannelValue(\"alpha\"),\n channels,\n\n setColor(value: string | Color) {\n send({ type: \"VALUE.SET\", value: normalizeColor(value), src: \"set-color\" })\n },\n\n setChannelValue(channel: ColorChannel, value: number) {\n const color = valueAsColor.withChannelValue(channel, value)\n send({ type: \"VALUE.SET\", value: color, src: \"set-channel\" })\n },\n\n setFormat(format: ColorFormat) {\n const value = valueAsColor.toFormat(format)\n send({ type: \"VALUE.SET\", value, src: \"set-format\" })\n },\n\n setAlpha(value: number) {\n const color = valueAsColor.withChannelValue(\"alpha\", value)\n send({ type: \"VALUE.SET\", value: color, src: \"set-alpha\" })\n },\n\n contentProps: normalize.element({\n ...parts.content.attrs,\n id: dom.getContentId(state.context),\n }),\n\n getAreaProps(props: ColorAreaProps) {\n const { xChannel, yChannel } = props\n const { areaStyles } = getColorAreaGradient(state.context, xChannel, yChannel)\n\n return normalize.element({\n ...parts.area.attrs,\n id: dom.getAreaId(state.context),\n role: \"group\",\n onPointerDown(event) {\n if (!isInteractive) return\n\n const evt = getNativeEvent(event)\n if (!isLeftClick(evt) || isModifiedEvent(evt)) return\n\n const point = getEventPoint(evt)\n const channel = { xChannel, yChannel }\n\n send({ type: \"AREA.POINTER_DOWN\", point, channel, id: \"area\" })\n },\n style: {\n position: \"relative\",\n touchAction: \"none\",\n forcedColorAdjust: \"none\",\n ...areaStyles,\n },\n })\n },\n\n getAreaGradientProps(props: ColorAreaProps) {\n const { xChannel, yChannel } = props\n const { areaGradientStyles } = getColorAreaGradient(state.context, xChannel, yChannel)\n\n return normalize.element({\n ...parts.areaGradient.attrs,\n id: dom.getAreaGradientId(state.context),\n style: {\n position: \"relative\",\n touchAction: \"none\",\n forcedColorAdjust: \"none\",\n ...areaGradientStyles,\n },\n })\n },\n\n getAreaThumbProps(props: ColorAreaProps) {\n const { xChannel, yChannel } = props\n const { getThumbPosition } = getChannelDetails(valueAsColor, xChannel, yChannel)\n const { x, y } = getThumbPosition()\n\n const channel = { xChannel, yChannel }\n\n return normalize.element({\n ...parts.areaThumb.attrs,\n id: dom.getAreaThumbId(state.context),\n tabIndex: isDisabled ? undefined : 0,\n \"data-disabled\": dataAttr(isDisabled),\n role: \"presentation\",\n style: {\n position: \"absolute\",\n left: `${x * 100}%`,\n top: `${y * 100}%`,\n transform: \"translate(-50%, -50%)\",\n touchAction: \"none\",\n forcedColorAdjust: \"none\",\n background: valueAsColor.withChannelValue(\"alpha\", 1).toString(\"css\"),\n },\n onBlur() {\n send(\"AREA.BLUR\")\n },\n onFocus() {\n send({ type: \"AREA.FOCUS\", id: \"area\" })\n },\n onKeyDown(event) {\n if (!isInteractive) return\n\n const step = getEventStep(event)\n\n const keyMap: EventKeyMap = {\n ArrowUp() {\n send({ type: \"AREA.ARROW_UP\", channel, step })\n },\n ArrowDown() {\n send({ type: \"AREA.ARROW_DOWN\", channel, step })\n },\n ArrowLeft() {\n send({ type: \"AREA.ARROW_LEFT\", channel, step })\n },\n ArrowRight() {\n send({ type: \"AREA.ARROW_RIGHT\", channel, step })\n },\n PageUp() {\n send({ type: \"AREA.PAGE_UP\", channel, step })\n },\n PageDown() {\n send({ type: \"AREA.PAGE_DOWN\", channel, step })\n },\n }\n\n const exec = keyMap[getEventKey(event, state.context)]\n\n if (exec) {\n exec(event)\n event.preventDefault()\n }\n },\n })\n },\n\n getChannelSliderTrackProps(props: ColorChannelProps) {\n const { orientation = \"horizontal\", channel } = props\n\n return normalize.element({\n ...parts.channelSliderTrack.attrs,\n id: dom.getChannelSliderTrackId(state.context, channel),\n role: \"group\",\n \"data-channel\": channel,\n \"data-orientation\": orientation,\n onPointerDown(event) {\n if (!isInteractive) return\n\n const evt = getNativeEvent(event)\n if (!isLeftClick(evt) || isModifiedEvent(evt)) return\n\n const point = getEventPoint(evt)\n send({ type: \"CHANNEL_SLIDER.POINTER_DOWN\", channel, point, id: channel, orientation })\n },\n style: {\n position: \"relative\",\n touchAction: \"none\",\n forcedColorAdjust: \"none\",\n backgroundImage: getSliderBgImage(state.context, { orientation, channel }),\n },\n })\n },\n\n getChannelSliderBackgroundProps(props: ColorChannelProps) {\n const { orientation = \"horizontal\", channel } = props\n return normalize.element({\n ...parts.channelSliderTrackBackground.attrs,\n \"data-orientation\": orientation,\n \"data-channel\": channel,\n style: {\n position: \"absolute\",\n backgroundColor: \"#fff\",\n backgroundImage: [\n \"linear-gradient(-45deg,#0000 75.5%,#bcbcbc 75.5%)\",\n \"linear-gradient(45deg,#0000 75.5%,#bcbcbc 75.5%)\",\n \"linear-gradient(-45deg,#bcbcbc 25.5%,#0000 25.5%)\",\n \"linear-gradient(45deg,#bcbcbc 25.5%,#0000 25.5%)\",\n ].join(\",\"),\n backgroundSize: \"16px 16px\",\n backgroundPosition: \"-2px -2px,-2px 6px,6px -10px,-10px -2px\",\n inset: 0,\n zIndex: -1,\n },\n })\n },\n\n getChannelSliderThumbProps(props: ColorChannelProps) {\n const { orientation = \"horizontal\", channel } = props\n const { minValue, maxValue, step: stepValue } = valueAsColor.getChannelRange(channel)\n const channelValue = valueAsColor.getChannelValue(channel)\n\n const offset = (channelValue - minValue) / (maxValue - minValue)\n\n const placementStyles =\n orientation === \"horizontal\"\n ? { left: `${offset * 100}%`, top: \"50%\" }\n : { top: `${offset * 100}%`, left: \"50%\" }\n\n return normalize.element({\n ...parts.channelSliderThumb.attrs,\n id: dom.getChannelSliderThumbId(state.context, channel),\n role: \"slider\",\n \"aria-label\": channel,\n tabIndex: isDisabled ? undefined : 0,\n \"data-channel\": channel,\n \"data-disabled\": dataAttr(isDisabled),\n \"data-orientation\": orientation,\n \"aria-disabled\": dataAttr(isDisabled),\n \"aria-orientation\": orientation,\n \"aria-valuemax\": maxValue,\n \"aria-valuemin\": minValue,\n \"aria-valuenow\": channelValue,\n style: {\n forcedColorAdjust: \"none\",\n position: \"absolute\",\n background: getChannelDisplayColor(valueAsColor, channel).toString(\"css\"),\n ...placementStyles,\n },\n onFocus() {\n if (!isInteractive) return\n send({ type: \"CHANNEL_SLIDER.FOCUS\", channel })\n },\n onBlur() {\n if (!isInteractive) return\n send({ type: \"CHANNEL_SLIDER.BLUR\", channel })\n },\n onKeyDown(event) {\n if (!isInteractive) return\n const step = getEventStep(event) * stepValue\n\n const keyMap: EventKeyMap = {\n ArrowUp() {\n send({ type: \"CHANNEL_SLIDER.ARROW_UP\", channel, step })\n },\n ArrowDown() {\n send({ type: \"CHANNEL_SLIDER.ARROW_DOWN\", channel, step })\n },\n ArrowLeft() {\n send({ type: \"CHANNEL_SLIDER.ARROW_LEFT\", channel, step })\n },\n ArrowRight() {\n send({ type: \"CHANNEL_SLIDER.ARROW_RIGHT\", channel, step })\n },\n PageUp() {\n send({ type: \"CHANNEL_SLIDER.PAGE_UP\", channel })\n },\n PageDown() {\n send({ type: \"CHANNEL_SLIDER.PAGE_DOWN\", channel })\n },\n Home() {\n send({ type: \"CHANNEL_SLIDER.HOME\", channel })\n },\n End() {\n send({ type: \"CHANNEL_SLIDER.END\", channel })\n },\n }\n\n const exec = keyMap[getEventKey(event, state.context)]\n\n if (exec) {\n exec(event)\n event.preventDefault()\n }\n },\n })\n },\n\n getChannelInputProps(props: ColorChannelInputProps) {\n const { channel } = props\n const isTextField = channel === \"hex\" || channel === \"css\"\n const range = getChannelInputRange(valueAsColor, channel)\n\n return normalize.input({\n ...parts.channelInput.attrs,\n type: isTextField ? \"text\" : \"number\",\n \"data-channel\": channel,\n \"aria-label\": channel,\n disabled: isDisabled,\n \"data-disabled\": dataAttr(isDisabled),\n readOnly: state.context.readOnly,\n id: dom.getChannelInputId(state.context, channel),\n defaultValue: getChannelInputValue(valueAsColor, channel),\n min: range?.minValue,\n max: range?.maxValue,\n step: range?.step,\n onFocus() {\n send({ type: \"CHANNEL_INPUT.FOCUS\", channel })\n },\n onChange(event) {\n if (isTextField) return\n const value = event.currentTarget.value\n send({ type: \"CHANNEL_INPUT.CHANGE\", channel, value, isTextField })\n },\n onBlur(event) {\n const value = event.currentTarget.value\n send({ type: \"CHANNEL_INPUT.BLUR\", channel, value, isTextField })\n },\n onKeyDown(event) {\n if (!isTextField) return\n if (event.key === \"Enter\") {\n const value = event.currentTarget.value\n send({ type: \"CHANNEL_INPUT.CHANGE\", channel, value, isTextField })\n }\n },\n style: {\n appearance: \"none\",\n WebkitAppearance: \"none\",\n MozAppearance: \"textfield\",\n },\n })\n },\n\n hiddenInputProps: normalize.input({\n type: \"text\",\n disabled: isDisabled,\n name: state.context.name,\n id: dom.getHiddenInputId(state.context),\n style: visuallyHiddenStyle,\n defaultValue: value,\n onChange(event) {\n const value = event.currentTarget.value\n send({ type: \"VALUE.SET\", value, src: \"input.change\" })\n },\n }),\n\n eyeDropperTriggerProps: normalize.button({\n ...parts.eyeDropperTrigger.attrs,\n disabled: isDisabled,\n \"data-disabled\": dataAttr(isDisabled),\n \"aria-label\": \"Pick a color from the screen\",\n onClick() {\n if (!isInteractive) return\n send(\"EYEDROPPER.CLICK\")\n },\n }),\n\n getSwatchBackgroundProps(props: ColorSwatchProps) {\n const { value } = props\n const alpha = normalizeColor(value).getChannelValue(\"alpha\")\n return normalize.element({\n ...parts.swatchBackground.attrs,\n \"data-alpha\": alpha,\n style: {\n width: \"100%\",\n height: \"100%\",\n background: \"#fff\",\n backgroundImage: [\n \"linear-gradient(-45deg,#0000 75.5%,#bcbcbc 75.5%)\",\n \"linear-gradient(45deg,#0000 75.5%,#bcbcbc 75.5%)\",\n \"linear-gradient(-45deg,#bcbcbc 25.5%,#0000 25.5%)\",\n \"linear-gradient(45deg,#bcbcbc 25.5%,#0000 25.5%)\",\n ].join(\",\"),\n backgroundPosition: \"-2px -2px,-2px 6px,6px -10px,-10px -2px\",\n backgroundSize: \"16px 16px\",\n position: \"absolute\",\n inset: \"0px\",\n zIndex: -1,\n },\n })\n },\n\n getSwatchProps(props: ColorSwatchProps) {\n const { value, readOnly } = props\n const color = normalizeColor(value).toFormat(valueAsColor.getColorSpace())\n return normalize.element({\n ...parts.swatch.attrs,\n onClick() {\n if (readOnly || !isInteractive) return\n send({ type: \"VALUE.SET\", value: color })\n },\n style: {\n position: \"relative\",\n background: color.toString(\"css\"),\n },\n })\n },\n }\n}\n","import type { ColorChannel } from \"@zag-js/color-utils\"\nimport { getRelativePoint, type Point } from \"@zag-js/dom-event\"\nimport { createScope, queryAll } from \"@zag-js/dom-query\"\nimport type { MachineContext as Ctx } from \"./color-picker.types\"\n\nexport const dom = createScope({\n getContentId: (ctx: Ctx) => ctx.ids?.content ?? `color-picker:${ctx.id}:content`,\n getAreaId: (ctx: Ctx) => ctx.ids?.area ?? `color-picker:${ctx.id}:area`,\n getAreaGradientId: (ctx: Ctx) => ctx.ids?.areaGradient ?? `color-picker:${ctx.id}:area-gradient`,\n getAreaThumbId: (ctx: Ctx) => ctx.ids?.areaThumb ?? `color-picker:${ctx.id}:area-thumb`,\n getChannelSliderTrackId: (ctx: Ctx, channel: ColorChannel) =>\n ctx.ids?.channelSliderTrack?.(channel) ?? `color-picker:${ctx.id}:slider-track:${channel}`,\n getChannelInputId: (ctx: Ctx, channel: string) =>\n ctx.ids?.channelInput?.(channel) ?? `color-picker:${ctx.id}:input:${channel}`,\n getChannelSliderThumbId: (ctx: Ctx, channel: ColorChannel) =>\n ctx.ids?.channelSliderThumb?.(channel) ?? `color-picker:${ctx.id}:slider-thumb:${channel}`,\n getHiddenInputId: (ctx: Ctx) => `color-picker:${ctx.id}:hidden-input`,\n\n getContentEl: (ctx: Ctx) => dom.getById(ctx, dom.getContentId(ctx)),\n getAreaThumbEl: (ctx: Ctx) => dom.getById(ctx, dom.getAreaThumbId(ctx)),\n getChannelSliderThumbEl: (ctx: Ctx, channel: ColorChannel) =>\n dom.getById(ctx, dom.getChannelSliderThumbId(ctx, channel)),\n getChannelInputEl: (ctx: Ctx, channel: string) =>\n dom.getById<HTMLInputElement>(ctx, dom.getChannelInputId(ctx, channel)),\n\n getHiddenInputEl: (ctx: Ctx) => dom.getById<HTMLInputElement>(ctx, dom.getHiddenInputId(ctx)),\n getAreaEl: (ctx: Ctx) => dom.getById(ctx, dom.getAreaId(ctx)),\n getAreaValueFromPoint(ctx: Ctx, point: Point) {\n const areaEl = dom.getAreaEl(ctx)\n if (!areaEl) return\n const { percent } = getRelativePoint(point, areaEl)\n return percent\n },\n\n getChannelSliderTrackEl: (ctx: Ctx, channel: ColorChannel) => {\n return dom.getById(ctx, dom.getChannelSliderTrackId(ctx, channel))\n },\n getChannelSliderValueFromPoint(ctx: Ctx, point: Point, channel: ColorChannel) {\n const trackEl = dom.getChannelSliderTrackEl(ctx, channel)\n if (!trackEl) return\n const { percent } = getRelativePoint(point, trackEl)\n return percent\n },\n getChannelInputEls: (ctx: Ctx) => {\n return queryAll<HTMLInputElement>(dom.getContentEl(ctx), \"input[data-channel]\")\n },\n})\n","import type { Color, ColorChannel } from \"@zag-js/color-utils\"\nimport { getPercentValue, snapValueToStep } from \"@zag-js/numeric-range\"\n\nexport function getChannelDetails(color: Color, xChannel: ColorChannel, yChannel: ColorChannel) {\n const channels = color.getColorSpaceAxes({ xChannel, yChannel })\n\n const xChannelRange = color.getChannelRange(channels.xChannel)\n const yChannelRange = color.getChannelRange(channels.yChannel)\n\n const { minValue: minValueX, maxValue: maxValueX, step: stepX, pageSize: pageSizeX } = xChannelRange\n const { minValue: minValueY, maxValue: maxValueY, step: stepY, pageSize: pageSizeY } = yChannelRange\n\n const xValue = color.getChannelValue(channels.xChannel)\n const yValue = color.getChannelValue(channels.yChannel)\n\n return {\n channels,\n xChannelStep: stepX,\n yChannelStep: stepY,\n xChannelPageStep: pageSizeX,\n yChannelPageStep: pageSizeY,\n xValue,\n yValue,\n getThumbPosition() {\n let x = (xValue - minValueX) / (maxValueX - minValueX)\n let y = 1 - (yValue - minValueY) / (maxValueY - minValueY)\n return { x, y }\n },\n incrementX(stepSize: number) {\n return xValue + stepSize > maxValueX ? maxValueX : snapValueToStep(xValue + stepSize, minValueX, maxValueX, stepX)\n },\n incrementY(stepSize: number) {\n return yValue + stepSize > maxValueY ? maxValueY : snapValueToStep(yValue + stepSize, minValueY, maxValueY, stepY)\n },\n decrementX(stepSize: number) {\n return snapValueToStep(xValue - stepSize, minValueX, maxValueX, stepX)\n },\n decrementY(stepSize: number) {\n return snapValueToStep(yValue - stepSize, minValueY, maxValueY, stepY)\n },\n getColorFromPoint(x: number, y: number) {\n let newXValue = getPercentValue(x, minValueX, maxValueX, stepX)\n let newYValue = getPercentValue(1 - y, minValueY, maxValueY, stepY)\n\n let newColor: Color | undefined\n\n if (newXValue !== xValue) {\n newXValue = snapValueToStep(newXValue, minValueX, maxValueX, stepX)\n newColor = color.withChannelValue(channels.xChannel, newXValue)\n }\n\n if (newYValue !== yValue) {\n newYValue = snapValueToStep(newYValue, minValueY, maxValueY, stepY)\n newColor = (newColor || color).withChannelValue(channels.yChannel, newYValue)\n }\n\n return newColor\n },\n }\n}\n","import { parseColor, type Color, type ColorChannel } from \"@zag-js/color-utils\"\n\nexport function getChannelDisplayColor(color: Color, channel: ColorChannel) {\n switch (channel) {\n case \"hue\":\n return parseColor(`hsl(${color.getChannelValue(\"hue\")}, 100%, 50%)`)\n case \"lightness\":\n case \"brightness\":\n case \"saturation\":\n case \"red\":\n case \"green\":\n case \"blue\":\n return color.withChannelValue(\"alpha\", 1)\n case \"alpha\": {\n return color\n }\n default:\n throw new Error(\"Unknown color channel: \" + channel)\n }\n}\n","import type { Color } from \"@zag-js/color-utils\"\nimport type { ExtendedColorChannel } from \"../color-picker.types\"\n\nexport function getChannelInputValue(color: Color, channel: ExtendedColorChannel) {\n switch (channel) {\n case \"hex\":\n return color.toString(\"hex\")\n case \"css\":\n return color.toString(\"css\")\n default:\n return color.getChannelValue(channel).toString()\n }\n}\n\nexport function getChannelInputRange(color: Color, channel: ExtendedColorChannel) {\n switch (channel) {\n case \"hex\":\n case \"css\":\n return undefined\n default:\n return color.getChannelRange(channel)\n }\n}\n","export const generateRGB_R = (orientation: [string, string], dir: boolean, zValue: number) => {\n const maskImage = `linear-gradient(to ${orientation[Number(!dir)]}, transparent, #000)`\n const result = {\n areaStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(${zValue},0,0),rgb(${zValue},255,0))`,\n },\n areaGradientStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(${zValue},0,255),rgb(${zValue},255,255))`,\n WebkitMaskImage: maskImage,\n maskImage,\n },\n }\n return result\n}\n\nexport const generateRGB_G = (orientation: [string, string], dir: boolean, zValue: number) => {\n const maskImage = `linear-gradient(to ${orientation[Number(!dir)]}, transparent, #000)`\n const result = {\n areaStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(0,${zValue},0),rgb(255,${zValue},0))`,\n },\n areaGradientStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(0,${zValue},255),rgb(255,${zValue},255))`,\n WebkitMaskImage: maskImage,\n maskImage,\n },\n }\n return result\n}\n\nexport const generateRGB_B = (orientation: [string, string], dir: boolean, zValue: number) => {\n const maskImage = `linear-gradient(to ${orientation[Number(!dir)]}, transparent, #000)`\n const result = {\n areaStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(0,0,${zValue}),rgb(255,0,${zValue}))`,\n },\n areaGradientStyles: {\n backgroundImage: `linear-gradient(to ${orientation[Number(dir)]},rgb(0,255,${zValue}),rgb(255,255,${zValue}))`,\n WebkitMaskImage: maskImage,\n maskImage,\n },\n }\n return result\n}\n\nexport const generateHSL_H = (orientation: [string, string], dir: boolean, zValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${\n orientation[Number(dir)]\n }, hsla(0,0%,0%,1) 0%, hsla(0,0%,0%,0) 50%, hsla(0,0%,100%,0) 50%, hsla(0,0%,100%,1) 100%)`,\n `linear-gradient(to ${orientation[Number(!dir)]},hsl(0,0%,50%),hsla(0,0%,50%,0))`,\n `hsl(${zValue}, 100%, 50%)`,\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSL_S = (orientation: [string, string], dir: boolean, alphaValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${\n orientation[Number(!dir)]\n }, hsla(0,0%,0%,${alphaValue}) 0%, hsla(0,0%,0%,0) 50%, hsla(0,0%,100%,0) 50%, hsla(0,0%,100%,${alphaValue}) 100%)`,\n `linear-gradient(to ${\n orientation[Number(dir)]\n },hsla(0,100%,50%,${alphaValue}),hsla(60,100%,50%,${alphaValue}),hsla(120,100%,50%,${alphaValue}),hsla(180,100%,50%,${alphaValue}),hsla(240,100%,50%,${alphaValue}),hsla(300,100%,50%,${alphaValue}),hsla(359,100%,50%,${alphaValue}))`,\n \"hsl(0, 0%, 50%)\",\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSL_L = (orientation: [string, string], dir: boolean, zValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n backgroundImage: [\n `linear-gradient(to ${orientation[Number(!dir)]},hsl(0,0%,${zValue}%),hsla(0,0%,${zValue}%,0))`,\n `linear-gradient(to ${\n orientation[Number(dir)]\n },hsl(0,100%,${zValue}%),hsl(60,100%,${zValue}%),hsl(120,100%,${zValue}%),hsl(180,100%,${zValue}%),hsl(240,100%,${zValue}%),hsl(300,100%,${zValue}%),hsl(360,100%,${zValue}%))`,\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSB_H = (orientation: [string, string], dir: boolean, zValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${orientation[Number(dir)]},hsl(0,0%,0%),hsla(0,0%,0%,0))`,\n `linear-gradient(to ${orientation[Number(!dir)]},hsl(0,0%,100%),hsla(0,0%,100%,0))`,\n `hsl(${zValue}, 100%, 50%)`,\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSB_S = (orientation: [string, string], dir: boolean, alphaValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${orientation[Number(!dir)]},hsla(0,0%,0%,${alphaValue}),hsla(0,0%,0%,0))`,\n `linear-gradient(to ${\n orientation[Number(dir)]\n },hsla(0,100%,50%,${alphaValue}),hsla(60,100%,50%,${alphaValue}),hsla(120,100%,50%,${alphaValue}),hsla(180,100%,50%,${alphaValue}),hsla(240,100%,50%,${alphaValue}),hsla(300,100%,50%,${alphaValue}),hsla(359,100%,50%,${alphaValue}))`,\n `linear-gradient(to ${orientation[Number(!dir)]},hsl(0,0%,0%),hsl(0,0%,100%))`,\n ].join(\",\"),\n },\n }\n return result\n}\n\nexport const generateHSB_B = (orientation: [string, string], dir: boolean, alphaValue: number) => {\n const result = {\n areaStyles: {},\n areaGradientStyles: {\n background: [\n `linear-gradient(to ${orientation[Number(!dir)]},hsla(0,0%,100%,${alphaValue}),hsla(0,0%,100%,0))`,\n `linear-gradient(to ${\n orientation[Number(dir)]\n },hsla(0,100%,50%,${alphaValue}),hsla(60,100%,50%,${alphaValue}),hsla(120,100%,50%,${alphaValue}),hsla(180,100%,50%,${alphaValue}),hsla(240,100%,50%,${alphaValue}),hsla(300,100%,50%,${alphaValue}),hsla(359,100%,50%,${alphaValue}))`,\n \"#000\",\n ].join(\",\"),\n },\n }\n return result\n}\n","import type { ColorChannel } from \"@zag-js/color-utils\"\nimport type { Style } from \"@zag-js/types\"\nimport type { MachineContext } from \"../color-picker.types\"\nimport {\n generateHSB_B,\n generateHSB_H,\n generateHSB_S,\n generateHSL_H,\n generateHSL_L,\n generateHSL_S,\n generateRGB_B,\n generateRGB_G,\n generateRGB_R,\n} from \"./generate-format-background\"\n\nexport function getColorAreaGradient(ctx: MachineContext, xChannel: ColorChannel, yChannel: ColorChannel) {\n const value = ctx.valueAsColor\n\n const { zChannel } = value.getColorSpaceAxes({ xChannel, yChannel })\n const zValue = value.getChannelValue(zChannel)\n\n const { minValue: zMin, maxValue: zMax } = value.getChannelRange(zChannel)\n const orientation: [string, string] = [\"top\", ctx.dir === \"rtl\" ? \"left\" : \"right\"]\n\n let dir = false\n let background = { areaStyles: {} as Style, areaGradientStyles: {} as Style }\n\n let alphaValue = (zValue - zMin) / (zMax - zMin)\n let isHSL = value.getColorSpace() === \"hsl\"\n\n switch (zChannel) {\n case \"red\": {\n dir = xChannel === \"green\"\n background = generateRGB_R(orientation, dir, zValue)\n break\n }\n\n case \"green\": {\n dir = xChannel === \"red\"\n background = generateRGB_G(orientation, dir, zValue)\n break\n }\n\n case \"blue\": {\n dir = xChannel === \"red\"\n background = generateRGB_B(orientation, dir, zValue)\n break\n }\n\n case \"hue\": {\n dir = xChannel !== \"saturation\"\n if (isHSL) {\n background = generateHSL_H(orientation, dir, zValue)\n } else {\n background = generateHSB_H(orientation, dir, zValue)\n }\n break\n }\n\n case \"saturation\": {\n dir = xChannel === \"hue\"\n if (isHSL) {\n background = generateHSL_S(orientation, dir, alphaValue)\n } else {\n background = generateHSB_S(orientation, dir, alphaValue)\n }\n break\n }\n\n case \"brightness\": {\n dir = xChannel === \"hue\"\n background = generateHSB_B(orientation, dir, alphaValue)\n break\n }\n\n case \"lightness\": {\n dir = xChannel === \"hue\"\n background = generateHSL_L(orientation, dir, zValue)\n break\n }\n }\n\n return background\n}\n","import type { ColorChannelProps, MachineContext } from \"../color-picker.types\"\n\nfunction getSliderBgDirection(orientation: \"vertical\" | \"horizontal\", dir: \"ltr\" | \"rtl\") {\n if (orientation === \"vertical\") {\n return \"top\"\n } else if (dir === \"ltr\") {\n return \"right\"\n } else {\n return \"left\"\n }\n}\n\nexport const getSliderBgImage = (ctx: MachineContext, props: Required<ColorChannelProps>) => {\n const { channel } = props\n\n const dir = getSliderBgDirection(props.orientation, ctx.dir!)\n const value = ctx.valueAsColor\n\n const { minValue, maxValue } = ctx.valueAsColor.getChannelRange(channel)\n\n switch (channel) {\n case \"hue\":\n return `linear-gradient(to ${dir}, rgb(255, 0, 0) 0%, rgb(255, 255, 0) 17%, rgb(0, 255, 0) 33%, rgb(0, 255, 255) 50%, rgb(0, 0, 255) 67%, rgb(255, 0, 255) 83%, rgb(255, 0, 0) 100%)`\n case \"lightness\": {\n let start = ctx.valueAsColor.withChannelValue(channel, minValue).toString(\"css\")\n let middle = value.withChannelValue(channel, (maxValue - minValue) / 2).toString(\"css\")\n let end = value.withChannelValue(channel, maxValue).toString(\"css\")\n return `linear-gradient(to ${dir}, ${start}, ${middle}, ${end})`\n }\n case \"saturation\":\n case \"brightness\":\n case \"red\":\n case \"green\":\n case \"blue\":\n case \"alpha\": {\n let start = value.withChannelValue(channel, minValue).toString(\"css\")\n let end = value.withChannelValue(channel, maxValue).toString(\"css\")\n return `linear-gradient(to ${dir}, ${start}, ${end})`\n }\n default:\n throw new Error(\"Unknown color channel: \" + channel)\n }\n}\n","import { parseColor, type Color } from \"@zag-js/color-utils\"\nimport { createMachine } from \"@zag-js/core\"\nimport { trackPointerMove } from \"@zag-js/dom-event\"\nimport { raf } from \"@zag-js/dom-query\"\nimport { trackFormControl } from \"@zag-js/form-utils\"\nimport { clampValue, getPercentValue, snapValueToStep } from \"@zag-js/numeric-range\"\nimport { disableTextSelection } from \"@zag-js/text-selection\"\nimport { compact } from \"@zag-js/utils\"\nimport { dom } from \"./color-picker.dom\"\nimport type { ExtendedColorChannel, MachineContext, MachineState, UserDefinedContext } from \"./color-picker.types\"\nimport { getChannelDetails } from \"./utils/get-channel-details\"\nimport { getChannelInputValue } from \"./utils/get-channel-input-value\"\n\nexport function machine(userContext: UserDefinedContext) {\n const ctx = compact(userContext)\n\n return createMachine<MachineContext, MachineState>(\n {\n id: \"color-picker\",\n initial: \"idle\",\n context: {\n dir: \"ltr\",\n activeId: null,\n activeChannel: null,\n activeOrientation: null,\n value: \"#D9D9D9\",\n ...ctx,\n },\n\n computed: {\n isRtl: (ctx) => ctx.dir === \"rtl\",\n isInteractive: (ctx) => !(ctx.disabled || ctx.readOnly),\n valueAsColor: (ctx) => parseColor(ctx.value),\n },\n\n on: {\n \"VALUE.SET\": {\n actions: [\"setValue\"],\n },\n },\n\n activities: [\"trackFormControl\"],\n\n watch: {\n value: [\"syncInputElements\", \"invokeOnChange\"],\n },\n\n states: {\n idle: {\n on: {\n \"EYEDROPPER.CLICK\": {\n actions: [\"openEyeDropper\"],\n },\n \"AREA.POINTER_DOWN\": {\n target: \"dragging\",\n actions: [\"setActiveChannel\", \"setAreaColorFromPoint\", \"focusAreaThumb\"],\n },\n \"AREA.FOCUS\": {\n target: \"focused\",\n actions: [\"setActiveChannel\"],\n },\n \"CHANNEL_SLIDER.POINTER_DOWN\": {\n target: \"dragging\",\n actions: [\"setActiveChannel\", \"setChannelColorFromPoint\", \"focusChannelThumb\"],\n },\n \"CHANNEL_SLIDER.FOCUS\": {\n target: \"focused\",\n actions: [\"setActiveChannel\"],\n },\n \"CHANNEL_INPUT.FOCUS\": {\n target: \"focused\",\n actions: [\"setActiveChannel\"],\n },\n \"CHANNEL_INPUT.CHANGE\": {\n actions: [\"setChannelColorFromInput\"],\n },\n },\n },\n\n focused: {\n on: {\n \"AREA.POINTER_DOWN\": {\n target: \"dragging\",\n actions: [\"setActiveChannel\", \"setAreaColorFromPoint\", \"focusAreaThumb\"],\n },\n \"CHANNEL_SLIDER.POINTER_DOWN\": {\n target: \"dragging\",\n actions: [\"setActiveChannel\", \"setChannelColorFromPoint\", \"focusChannelThumb\"],\n },\n \"AREA.ARROW_LEFT\": {\n actions: [\"decrementXChannel\"],\n },\n \"AREA.ARROW_RIGHT\": {\n actions: [\"incrementXChannel\"],\n },\n \"AREA.ARROW_UP\": {\n actions: [\"incrementYChannel\"],\n },\n \"AREA.ARROW_DOWN\": {\n actions: [\"decrementYChannel\"],\n },\n \"AREA.PAGE_UP\": {\n actions: [\"incrementXChannel\"],\n },\n \"AREA.PAGE_DOWN\": {\n actions: [\"decrementXChannel\"],\n },\n \"CHANNEL_SLIDER.ARROW_LEFT\": {\n actions: [\"decrementChannel\"],\n },\n \"CHANNEL_SLIDER.ARROW_RIGHT\": {\n actions: [\"incrementChannel\"],\n },\n \"CHANNEL_SLIDER.ARROW_UP\": {\n actions: [\"incrementChannel\"],\n },\n \"CHANNEL_SLIDER.ARROW_DOWN\": {\n actions: [\"decrementChannel\"],\n },\n \"CHANNEL_SLIDER.PAGE_UP\": {\n actions: [\"incrementChannel\"],\n },\n \"CHANNEL_SLIDER.PAGE_DOWN\": {\n actions: [\"decrementChannel\"],\n },\n \"CHANNEL_SLIDER.HOME\": {\n actions: [\"setChannelToMin\"],\n },\n \"CHANNEL_SLIDER.END\": {\n actions: [\"setChannelToMax\"],\n },\n \"CHANNEL_INPUT.FOCUS\": {\n actions: [\"setActiveChannel\"],\n },\n \"CHANNEL_INPUT.CHANGE\": {\n actions: [\"setChannelColorFromInput\"],\n },\n \"CHANNEL_INPUT.BLUR\": [\n {\n guard: \"isTextField\",\n target: \"idle\",\n actions: [\"setChannelColorFromInput\"],\n },\n { target: \"idle\" },\n ],\n \"CHANNEL_SLIDER.BLUR\": {\n target: \"idle\",\n },\n \"AREA.BLUR\": {\n target: \"idle\",\n },\n },\n },\n\n dragging: {\n exit: [\"clearActiveChannel\"],\n activities: [\"trackPointerMove\", \"disableTextSelection\"],\n on: {\n \"AREA.POINTER_MOVE\": {\n actions: [\"setAreaColorFromPoint\"],\n },\n \"AREA.POINTER_UP\": {\n target: \"focused\",\n actions: [\"invokeOnChangeEnd\"],\n },\n \"CHANNEL_SLIDER.POINTER_MOVE\": {\n actions: [\"setChannelColorFromPoint\"],\n },\n \"CHANNEL_SLIDER.POINTER_UP\": {\n target: \"focused\",\n actions: [\"invokeOnChangeEnd\"],\n },\n },\n },\n },\n },\n {\n guards: {\n isTextField: (_ctx, evt) => !!evt.isTextField,\n },\n activities: {\n trackFormControl(ctx, _evt, { send, initialContext }) {\n const inputEl = dom.getHiddenInputEl(ctx)\n return trackFormControl(inputEl, {\n onFieldsetDisabled() {\n ctx.disabled = true\n },\n onFormReset() {\n send({ type: \"VALUE.SET\", value: initialContext.value, src: \"form.reset\" })\n },\n })\n },\n trackPointerMove(ctx, _evt, { send }) {\n return trackPointerMove(dom.getDoc(ctx), {\n onPointerMove({ point }) {\n const type = ctx.activeId === \"area\" ? \"AREA.POINTER_MOVE\" : \"CHANNEL_SLIDER.POINTER_MOVE\"\n send({ type, point })\n },\n onPointerUp() {\n const type = ctx.activeId === \"area\" ? \"AREA.POINTER_UP\" : \"CHANNEL_SLIDER.POINTER_UP\"\n send({ type })\n },\n })\n },\n disableTextSelection(ctx) {\n return disableTextSelection({ doc: dom.getDoc(ctx), target: dom.getContentEl(ctx) })\n },\n },\n actions: {\n openEyeDropper(ctx) {\n const isSupported = \"EyeDropper\" in dom.getWin(ctx)\n if (!isSupported) return\n const win = dom.getWin(ctx) as any\n const picker = new win.EyeDropper()\n picker\n .open()\n .then(({ sRGBHex }: { sRGBHex: string }) => {\n const format = ctx.valueAsColor.getColorSpace()\n const color = parseColor(sRGBHex).toFormat(format)\n setColor(ctx, color)\n ctx.onChangeEnd?.({ value: ctx.value, valueAsColor: color })\n })\n .catch(() => void 0)\n },\n setActiveChannel(ctx, evt) {\n ctx.activeId = evt.id\n if (evt.channel) {\n ctx.activeChannel = evt.channel\n }\n if (evt.orientation) {\n ctx.activeOrientation = evt.orientation\n }\n },\n clearActiveChannel(ctx) {\n ctx.activeChannel = null\n ctx.activeId = null\n ctx.activeOrientation = null\n },\n setAreaColorFromPoint(ctx, evt) {\n const { xChannel, yChannel } = evt.channel || ctx.activeChannel\n\n const percent = dom.getAreaValueFromPoint(ctx, evt.point)\n if (!percent) return\n\n const { getColorFromPoint } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const color = getColorFromPoint(percent.x, percent.y)\n\n if (!color) return\n setColor(ctx, color)\n },\n setChannelColorFromPoint(ctx, evt) {\n const channel = evt.channel || ctx.activeId\n\n const percent = dom.getChannelSliderValueFromPoint(ctx, evt.point, channel)\n if (!percent) return\n\n const { minValue, maxValue, step } = ctx.valueAsColor.getChannelRange(channel)\n const orientation = ctx.activeOrientation || \"horizontal\"\n\n const point = orientation === \"horizontal\" ? percent.x : percent.y\n const channelValue = getPercentValue(point, minValue, maxValue, step)\n\n const value = snapValueToStep(channelValue - step, minValue, maxValue, step)\n const newColor = ctx.valueAsColor.withChannelValue(channel, value)\n\n setColor(ctx, newColor)\n },\n setValue(ctx, evt) {\n setColor(ctx, evt.value)\n },\n syncInputElements(ctx) {\n // sync channel inputs\n const inputs = dom.getChannelInputEls(ctx)\n inputs.forEach((input) => {\n const channel = input.dataset.channel as ExtendedColorChannel | null\n if (!channel) return\n input.value = getChannelInputValue(ctx.valueAsColor, channel)\n })\n\n // sync hidden input\n const hiddenInput = dom.getHiddenInputEl(ctx)\n if (!hiddenInput) return\n hiddenInput.value = ctx.value\n },\n setChannelColorFromInput(ctx, evt) {\n const { channel, isTextField, value } = evt\n try {\n const format = ctx.valueAsColor.getColorSpace()\n\n const newColor = isTextField\n ? parseColor(value).toFormat(format)\n : ctx.valueAsColor.withChannelValue(channel, value)\n\n setColor(ctx, newColor)\n //\n } catch {\n // reset input value\n const input = dom.getChannelInputEl(ctx, channel)\n if (!input) return\n input.value = getChannelInputValue(ctx.valueAsColor, channel)\n }\n },\n\n incrementChannel(ctx, evt) {\n const { minValue, maxValue, step } = ctx.valueAsColor.getChannelRange(evt.channel)\n const channelValue = ctx.valueAsColor.getChannelValue(evt.channel)\n const value = snapValueToStep(channelValue + evt.step, minValue, maxValue, step)\n const newColor = ctx.valueAsColor.withChannelValue(evt.channel, clampValue(value, minValue, maxValue))\n setColor(ctx, newColor)\n },\n decrementChannel(ctx, evt) {\n const { minValue, maxValue, step } = ctx.valueAsColor.getChannelRange(evt.channel)\n const channelValue = ctx.valueAsColor.getChannelValue(evt.channel)\n const value = snapValueToStep(channelValue - evt.step, minValue, maxValue, step)\n const newColor = ctx.valueAsColor.withChannelValue(evt.channel, clampValue(value, minValue, maxValue))\n setColor(ctx, newColor)\n },\n\n incrementXChannel(ctx, evt) {\n const { xChannel, yChannel } = evt.channel\n const { incrementX } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const newColor = ctx.valueAsColor.withChannelValue(xChannel, incrementX(evt.step))\n setColor(ctx, newColor)\n },\n decrementXChannel(ctx, evt) {\n const { xChannel, yChannel } = evt.channel\n const { decrementX } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const newColor = ctx.valueAsColor.withChannelValue(xChannel, decrementX(evt.step))\n setColor(ctx, newColor)\n },\n\n incrementYChannel(ctx, evt) {\n const { xChannel, yChannel } = evt.channel\n const { incrementY } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const newColor = ctx.valueAsColor.withChannelValue(yChannel, incrementY(evt.step))\n setColor(ctx, newColor)\n },\n decrementYChannel(ctx, evt) {\n const { xChannel, yChannel } = evt.channel\n const { decrementY } = getChannelDetails(ctx.valueAsColor, xChannel, yChannel)\n const newColor = ctx.valueAsColor.withChannelValue(yChannel, decrementY(evt.step))\n setColor(ctx, newColor)\n },\n\n setChannelToMax(ctx, evt) {\n const { maxValue } = ctx.valueAsColor.getChannelRange(evt.channel)\n const newColor = ctx.valueAsColor.withChannelValue(evt.channel, maxValue)\n setColor(ctx, newColor)\n },\n setChannelToMin(ctx, evt) {\n const { minValue } = ctx.valueAsColor.getChannelRange(evt.channel)\n const newColor = ctx.valueAsColor.withChannelValue(evt.channel, minValue)\n setColor(ctx, newColor)\n },\n\n invokeOnChangeEnd(ctx) {\n ctx.onChangeEnd?.({ value: ctx.value, valueAsColor: ctx.valueAsColor })\n },\n invokeOnChange(ctx) {\n ctx.onChange?.({ value: ctx.value, valueAsColor: ctx.valueAsColor })\n },\n focusAreaThumb(ctx) {\n raf(() => {\n dom.getAreaThumbEl(ctx)?.focus({ preventScroll: true })\n })\n },\n focusChannelThumb(ctx, evt) {\n raf(() => {\n dom.getChannelSliderThumbEl(ctx, evt.channel)?.focus({ preventScroll: true })\n })\n },\n },\n },\n )\n}\n\nconst setColor = (ctx: MachineContext, color: Color) => {\n ctx.value = color.toString(\"css\")\n}\n"],"mappings":"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","names":["value","parseColor","getPercentValue","snapValueToStep","ctx","parseColor","getPercentValue","snapValueToStep"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zag-js/color-picker",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.15.0",
|
|
4
4
|
"description": "Core logic for the color-picker widget implemented as a state machine",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"js",
|
|
@@ -28,17 +28,17 @@
|
|
|
28
28
|
"url": "https://github.com/chakra-ui/zag/issues"
|
|
29
29
|
},
|
|
30
30
|
"dependencies": {
|
|
31
|
-
"@zag-js/core": "0.
|
|
32
|
-
"@zag-js/anatomy": "0.
|
|
33
|
-
"@zag-js/dom-query": "0.
|
|
34
|
-
"@zag-js/dom-event": "0.
|
|
35
|
-
"@zag-js/utils": "0.
|
|
36
|
-
"@zag-js/form-utils": "0.
|
|
37
|
-
"@zag-js/color-utils": "0.
|
|
38
|
-
"@zag-js/visually-hidden": "0.
|
|
39
|
-
"@zag-js/
|
|
40
|
-
"@zag-js/
|
|
41
|
-
"@zag-js/types": "0.
|
|
31
|
+
"@zag-js/core": "0.15.0",
|
|
32
|
+
"@zag-js/anatomy": "0.15.0",
|
|
33
|
+
"@zag-js/dom-query": "0.15.0",
|
|
34
|
+
"@zag-js/dom-event": "0.15.0",
|
|
35
|
+
"@zag-js/utils": "0.15.0",
|
|
36
|
+
"@zag-js/form-utils": "0.15.0",
|
|
37
|
+
"@zag-js/color-utils": "0.15.0",
|
|
38
|
+
"@zag-js/visually-hidden": "0.15.0",
|
|
39
|
+
"@zag-js/numeric-range": "0.15.0",
|
|
40
|
+
"@zag-js/text-selection": "0.15.0",
|
|
41
|
+
"@zag-js/types": "0.15.0"
|
|
42
42
|
},
|
|
43
43
|
"devDependencies": {
|
|
44
44
|
"clean-package": "2.2.0"
|