@zag-js/color-picker 0.76.0 → 0.77.1

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.
Files changed (3) hide show
  1. package/dist/index.js +7 -1
  2. package/dist/index.mjs +7 -1
  3. package/package.json +12 -12
package/dist/index.js CHANGED
@@ -732,6 +732,7 @@ function connect(state, send, normalize) {
732
732
  send({ type: "SWATCH_TRIGGER.CLICK", value: swatchState.value });
733
733
  },
734
734
  style: {
735
+ "--color": swatchState.valueAsString,
735
736
  position: "relative"
736
737
  }
737
738
  });
@@ -747,14 +748,16 @@ function connect(state, send, normalize) {
747
748
  getSwatchProps(props) {
748
749
  const { respectAlpha = true } = props;
749
750
  const swatchState = getSwatchTriggerState(props);
751
+ const color = swatchState.value.toString(respectAlpha ? "css" : "hex");
750
752
  return normalize.element({
751
753
  ...parts.swatch.attrs,
752
754
  dir: state.context.dir,
753
755
  "data-state": swatchState.checked ? "checked" : "unchecked",
754
756
  "data-value": swatchState.valueAsString,
755
757
  style: {
758
+ "--color": color,
756
759
  position: "relative",
757
- background: swatchState.value.toString(respectAlpha ? "css" : "hex")
760
+ background: color
758
761
  }
759
762
  });
760
763
  },
@@ -853,6 +856,9 @@ function machine(userContext) {
853
856
  },
854
857
  "EYEDROPPER.CLICK": {
855
858
  actions: ["openEyeDropper"]
859
+ },
860
+ "SWATCH_TRIGGER.CLICK": {
861
+ actions: ["setValue"]
856
862
  }
857
863
  },
858
864
  states: {
package/dist/index.mjs CHANGED
@@ -730,6 +730,7 @@ function connect(state, send, normalize) {
730
730
  send({ type: "SWATCH_TRIGGER.CLICK", value: swatchState.value });
731
731
  },
732
732
  style: {
733
+ "--color": swatchState.valueAsString,
733
734
  position: "relative"
734
735
  }
735
736
  });
@@ -745,14 +746,16 @@ function connect(state, send, normalize) {
745
746
  getSwatchProps(props) {
746
747
  const { respectAlpha = true } = props;
747
748
  const swatchState = getSwatchTriggerState(props);
749
+ const color = swatchState.value.toString(respectAlpha ? "css" : "hex");
748
750
  return normalize.element({
749
751
  ...parts.swatch.attrs,
750
752
  dir: state.context.dir,
751
753
  "data-state": swatchState.checked ? "checked" : "unchecked",
752
754
  "data-value": swatchState.valueAsString,
753
755
  style: {
756
+ "--color": color,
754
757
  position: "relative",
755
- background: swatchState.value.toString(respectAlpha ? "css" : "hex")
758
+ background: color
756
759
  }
757
760
  });
758
761
  },
@@ -851,6 +854,9 @@ function machine(userContext) {
851
854
  },
852
855
  "EYEDROPPER.CLICK": {
853
856
  actions: ["openEyeDropper"]
857
+ },
858
+ "SWATCH_TRIGGER.CLICK": {
859
+ actions: ["setValue"]
854
860
  }
855
861
  },
856
862
  states: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zag-js/color-picker",
3
- "version": "0.76.0",
3
+ "version": "0.77.1",
4
4
  "description": "Core logic for the color-picker widget implemented as a state machine",
5
5
  "keywords": [
6
6
  "js",
@@ -27,17 +27,17 @@
27
27
  "url": "https://github.com/chakra-ui/zag/issues"
28
28
  },
29
29
  "dependencies": {
30
- "@zag-js/core": "0.76.0",
31
- "@zag-js/anatomy": "0.76.0",
32
- "@zag-js/dom-query": "0.76.0",
33
- "@zag-js/dismissable": "0.76.0",
34
- "@zag-js/dom-event": "0.76.0",
35
- "@zag-js/utils": "0.76.0",
36
- "@zag-js/form-utils": "0.76.0",
37
- "@zag-js/color-utils": "0.76.0",
38
- "@zag-js/popper": "0.76.0",
39
- "@zag-js/text-selection": "0.76.0",
40
- "@zag-js/types": "0.76.0"
30
+ "@zag-js/core": "0.77.1",
31
+ "@zag-js/anatomy": "0.77.1",
32
+ "@zag-js/dom-query": "0.77.1",
33
+ "@zag-js/dismissable": "0.77.1",
34
+ "@zag-js/dom-event": "0.77.1",
35
+ "@zag-js/utils": "0.77.1",
36
+ "@zag-js/form-utils": "0.77.1",
37
+ "@zag-js/color-utils": "0.77.1",
38
+ "@zag-js/popper": "0.77.1",
39
+ "@zag-js/text-selection": "0.77.1",
40
+ "@zag-js/types": "0.77.1"
41
41
  },
42
42
  "devDependencies": {
43
43
  "clean-package": "2.2.0"