@react-aria/color 3.0.0 → 3.0.2

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 (80) hide show
  1. package/LICENSE +201 -0
  2. package/dist/ar-AE.main.js.map +1 -1
  3. package/dist/ar-AE.module.js.map +1 -1
  4. package/dist/bg-BG.main.js.map +1 -1
  5. package/dist/bg-BG.module.js.map +1 -1
  6. package/dist/cs-CZ.main.js.map +1 -1
  7. package/dist/cs-CZ.module.js.map +1 -1
  8. package/dist/da-DK.main.js.map +1 -1
  9. package/dist/da-DK.module.js.map +1 -1
  10. package/dist/de-DE.main.js.map +1 -1
  11. package/dist/de-DE.module.js.map +1 -1
  12. package/dist/el-GR.main.js.map +1 -1
  13. package/dist/el-GR.module.js.map +1 -1
  14. package/dist/en-US.main.js.map +1 -1
  15. package/dist/en-US.module.js.map +1 -1
  16. package/dist/es-ES.main.js.map +1 -1
  17. package/dist/es-ES.module.js.map +1 -1
  18. package/dist/et-EE.main.js.map +1 -1
  19. package/dist/et-EE.module.js.map +1 -1
  20. package/dist/fi-FI.main.js.map +1 -1
  21. package/dist/fi-FI.module.js.map +1 -1
  22. package/dist/fr-FR.main.js.map +1 -1
  23. package/dist/fr-FR.module.js.map +1 -1
  24. package/dist/he-IL.main.js.map +1 -1
  25. package/dist/he-IL.module.js.map +1 -1
  26. package/dist/hr-HR.main.js.map +1 -1
  27. package/dist/hr-HR.module.js.map +1 -1
  28. package/dist/hu-HU.main.js.map +1 -1
  29. package/dist/hu-HU.module.js.map +1 -1
  30. package/dist/it-IT.main.js.map +1 -1
  31. package/dist/it-IT.module.js.map +1 -1
  32. package/dist/ja-JP.main.js.map +1 -1
  33. package/dist/ja-JP.module.js.map +1 -1
  34. package/dist/ko-KR.main.js.map +1 -1
  35. package/dist/ko-KR.module.js.map +1 -1
  36. package/dist/lt-LT.main.js.map +1 -1
  37. package/dist/lt-LT.module.js.map +1 -1
  38. package/dist/lv-LV.main.js.map +1 -1
  39. package/dist/lv-LV.module.js.map +1 -1
  40. package/dist/nb-NO.main.js.map +1 -1
  41. package/dist/nb-NO.module.js.map +1 -1
  42. package/dist/nl-NL.main.js.map +1 -1
  43. package/dist/nl-NL.module.js.map +1 -1
  44. package/dist/pl-PL.main.js.map +1 -1
  45. package/dist/pl-PL.module.js.map +1 -1
  46. package/dist/pt-BR.main.js.map +1 -1
  47. package/dist/pt-BR.module.js.map +1 -1
  48. package/dist/pt-PT.main.js.map +1 -1
  49. package/dist/pt-PT.module.js.map +1 -1
  50. package/dist/ro-RO.main.js.map +1 -1
  51. package/dist/ro-RO.module.js.map +1 -1
  52. package/dist/ru-RU.main.js.map +1 -1
  53. package/dist/ru-RU.module.js.map +1 -1
  54. package/dist/sk-SK.main.js.map +1 -1
  55. package/dist/sk-SK.module.js.map +1 -1
  56. package/dist/sl-SI.main.js.map +1 -1
  57. package/dist/sl-SI.module.js.map +1 -1
  58. package/dist/sr-SP.main.js.map +1 -1
  59. package/dist/sr-SP.module.js.map +1 -1
  60. package/dist/sv-SE.main.js.map +1 -1
  61. package/dist/sv-SE.module.js.map +1 -1
  62. package/dist/tr-TR.main.js.map +1 -1
  63. package/dist/tr-TR.module.js.map +1 -1
  64. package/dist/uk-UA.main.js.map +1 -1
  65. package/dist/uk-UA.module.js.map +1 -1
  66. package/dist/useColorArea.main.js.map +1 -1
  67. package/dist/useColorArea.module.js.map +1 -1
  68. package/dist/useColorAreaGradient.main.js.map +1 -1
  69. package/dist/useColorAreaGradient.module.js.map +1 -1
  70. package/dist/useColorSlider.main.js.map +1 -1
  71. package/dist/useColorSlider.module.js.map +1 -1
  72. package/dist/useColorSwatch.main.js.map +1 -1
  73. package/dist/useColorSwatch.module.js.map +1 -1
  74. package/dist/useColorWheel.main.js.map +1 -1
  75. package/dist/useColorWheel.module.js.map +1 -1
  76. package/dist/zh-CN.main.js.map +1 -1
  77. package/dist/zh-CN.module.js.map +1 -1
  78. package/dist/zh-TW.main.js.map +1 -1
  79. package/dist/zh-TW.module.js.map +1 -1
  80. package/package.json +18 -17
@@ -1 +1 @@
1
- {"mappings":";AAAA,4BAAiB;IAAG,mBAAmB,CAAC,OAAS,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,CAAC,CAAC;IACpF,qBAAqB,CAAC,OAAS,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,CAAC,CAAC;IAC5D,eAAe,CAAC,gBAAgB,CAAC;IACjC,eAAe,CAAC,cAAc,CAAC;IAC/B,eAAe,CAAC,YAAY,CAAC;IAC7B,wBAAwB,CAAC,sBAAsB,CAAC;AAClD","sources":["packages/@react-aria/color/intl/pt-PT.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Seletor de cores\",\n \"colorSwatch\": \"amostra de cor\",\n \"transparent\": \"transparente\",\n \"twoDimensionalSlider\": \"Controle deslizante 2D\"\n}\n"],"names":[],"version":3,"file":"pt-PT.module.js.map"}
1
+ {"mappings":";AAAA,4BAAiB;IAAG,mBAAmB,CAAC,OAAS,GAAG,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,EAAE;IACpF,qBAAqB,CAAC,OAAS,GAAG,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,EAAE;IAC5D,eAAe,CAAC,gBAAgB,CAAC;IACjC,eAAe,CAAC,cAAc,CAAC;IAC/B,eAAe,CAAC,YAAY,CAAC;IAC7B,wBAAwB,CAAC,sBAAsB,CAAC;AAClD","sources":["packages/@react-aria/color/intl/pt-PT.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Seletor de cores\",\n \"colorSwatch\": \"amostra de cor\",\n \"transparent\": \"transparente\",\n \"twoDimensionalSlider\": \"Controle deslizante 2D\"\n}\n"],"names":[],"version":3,"file":"pt-PT.module.js.map"}
@@ -1 +1 @@
1
- {"mappings":"AAAA,iBAAiB;IAAG,mBAAmB,CAAC,OAAS,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,CAAC,CAAC;IACpF,qBAAqB,CAAC,OAAS,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,CAAC,CAAC;IAC5D,eAAe,CAAC,kBAAkB,CAAC;IACnC,eAAe,CAAC,mBAAmB,CAAC;IACpC,eAAe,CAAC,WAAW,CAAC;IAC5B,wBAAwB,CAAC,SAAS,CAAC;AACrC","sources":["packages/@react-aria/color/intl/ro-RO.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Selector de culori\",\n \"colorSwatch\": \"specimen de culoare\",\n \"transparent\": \"transparent\",\n \"twoDimensionalSlider\": \"Glisor 2D\"\n}\n"],"names":[],"version":3,"file":"ro-RO.main.js.map"}
1
+ {"mappings":"AAAA,iBAAiB;IAAG,mBAAmB,CAAC,OAAS,GAAG,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,EAAE;IACpF,qBAAqB,CAAC,OAAS,GAAG,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,EAAE;IAC5D,eAAe,CAAC,kBAAkB,CAAC;IACnC,eAAe,CAAC,mBAAmB,CAAC;IACpC,eAAe,CAAC,WAAW,CAAC;IAC5B,wBAAwB,CAAC,SAAS,CAAC;AACrC","sources":["packages/@react-aria/color/intl/ro-RO.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Selector de culori\",\n \"colorSwatch\": \"specimen de culoare\",\n \"transparent\": \"transparent\",\n \"twoDimensionalSlider\": \"Glisor 2D\"\n}\n"],"names":[],"version":3,"file":"ro-RO.main.js.map"}
@@ -1 +1 @@
1
- {"mappings":";AAAA,4BAAiB;IAAG,mBAAmB,CAAC,OAAS,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,CAAC,CAAC;IACpF,qBAAqB,CAAC,OAAS,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,CAAC,CAAC;IAC5D,eAAe,CAAC,kBAAkB,CAAC;IACnC,eAAe,CAAC,mBAAmB,CAAC;IACpC,eAAe,CAAC,WAAW,CAAC;IAC5B,wBAAwB,CAAC,SAAS,CAAC;AACrC","sources":["packages/@react-aria/color/intl/ro-RO.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Selector de culori\",\n \"colorSwatch\": \"specimen de culoare\",\n \"transparent\": \"transparent\",\n \"twoDimensionalSlider\": \"Glisor 2D\"\n}\n"],"names":[],"version":3,"file":"ro-RO.module.js.map"}
1
+ {"mappings":";AAAA,4BAAiB;IAAG,mBAAmB,CAAC,OAAS,GAAG,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,EAAE;IACpF,qBAAqB,CAAC,OAAS,GAAG,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,EAAE;IAC5D,eAAe,CAAC,kBAAkB,CAAC;IACnC,eAAe,CAAC,mBAAmB,CAAC;IACpC,eAAe,CAAC,WAAW,CAAC;IAC5B,wBAAwB,CAAC,SAAS,CAAC;AACrC","sources":["packages/@react-aria/color/intl/ro-RO.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Selector de culori\",\n \"colorSwatch\": \"specimen de culoare\",\n \"transparent\": \"transparent\",\n \"twoDimensionalSlider\": \"Glisor 2D\"\n}\n"],"names":[],"version":3,"file":"ro-RO.module.js.map"}
@@ -1 +1 @@
1
- {"mappings":"AAAA,iBAAiB;IAAG,mBAAmB,CAAC,OAAS,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,CAAC,CAAC;IACpF,qBAAqB,CAAC,OAAS,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,CAAC,CAAC;IAC5D,eAAe,CAAC,4FAAc,CAAC;IAC/B,eAAe,CAAC,0GAAgB,CAAC;IACjC,eAAe,CAAC,sEAAU,CAAC;IAC3B,wBAAwB,CAAC,2DAAW,CAAC;AACvC","sources":["packages/@react-aria/color/intl/ru-RU.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Палитра цветов\",\n \"colorSwatch\": \"цветовой образец\",\n \"transparent\": \"прозрачный\",\n \"twoDimensionalSlider\": \"Ползунок 2D\"\n}\n"],"names":[],"version":3,"file":"ru-RU.main.js.map"}
1
+ {"mappings":"AAAA,iBAAiB;IAAG,mBAAmB,CAAC,OAAS,GAAG,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,EAAE;IACpF,qBAAqB,CAAC,OAAS,GAAG,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,EAAE;IAC5D,eAAe,CAAC,4FAAc,CAAC;IAC/B,eAAe,CAAC,0GAAgB,CAAC;IACjC,eAAe,CAAC,sEAAU,CAAC;IAC3B,wBAAwB,CAAC,2DAAW,CAAC;AACvC","sources":["packages/@react-aria/color/intl/ru-RU.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Палитра цветов\",\n \"colorSwatch\": \"цветовой образец\",\n \"transparent\": \"прозрачный\",\n \"twoDimensionalSlider\": \"Ползунок 2D\"\n}\n"],"names":[],"version":3,"file":"ru-RU.main.js.map"}
@@ -1 +1 @@
1
- {"mappings":";AAAA,4BAAiB;IAAG,mBAAmB,CAAC,OAAS,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,CAAC,CAAC;IACpF,qBAAqB,CAAC,OAAS,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,CAAC,CAAC;IAC5D,eAAe,CAAC,4FAAc,CAAC;IAC/B,eAAe,CAAC,0GAAgB,CAAC;IACjC,eAAe,CAAC,sEAAU,CAAC;IAC3B,wBAAwB,CAAC,2DAAW,CAAC;AACvC","sources":["packages/@react-aria/color/intl/ru-RU.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Палитра цветов\",\n \"colorSwatch\": \"цветовой образец\",\n \"transparent\": \"прозрачный\",\n \"twoDimensionalSlider\": \"Ползунок 2D\"\n}\n"],"names":[],"version":3,"file":"ru-RU.module.js.map"}
1
+ {"mappings":";AAAA,4BAAiB;IAAG,mBAAmB,CAAC,OAAS,GAAG,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,EAAE;IACpF,qBAAqB,CAAC,OAAS,GAAG,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,EAAE;IAC5D,eAAe,CAAC,4FAAc,CAAC;IAC/B,eAAe,CAAC,0GAAgB,CAAC;IACjC,eAAe,CAAC,sEAAU,CAAC;IAC3B,wBAAwB,CAAC,2DAAW,CAAC;AACvC","sources":["packages/@react-aria/color/intl/ru-RU.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Палитра цветов\",\n \"colorSwatch\": \"цветовой образец\",\n \"transparent\": \"прозрачный\",\n \"twoDimensionalSlider\": \"Ползунок 2D\"\n}\n"],"names":[],"version":3,"file":"ru-RU.module.js.map"}
@@ -1 +1 @@
1
- {"mappings":"AAAA,iBAAiB;IAAG,mBAAmB,CAAC,OAAS,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,CAAC,CAAC;IACpF,qBAAqB,CAAC,OAAS,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,CAAC,CAAC;IAC5D,eAAe,CAAC,eAAY,CAAC;IAC7B,eAAe,CAAC,oBAAiB,CAAC;IAClC,eAAe,CAAC,gBAAa,CAAC;IAC9B,wBAAwB,CAAC,SAAS,CAAC;AACrC","sources":["packages/@react-aria/color/intl/sk-SK.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Výber farieb\",\n \"colorSwatch\": \"vzorkovník farieb\",\n \"transparent\": \"transparentný\",\n \"twoDimensionalSlider\": \"2D jazdec\"\n}\n"],"names":[],"version":3,"file":"sk-SK.main.js.map"}
1
+ {"mappings":"AAAA,iBAAiB;IAAG,mBAAmB,CAAC,OAAS,GAAG,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,EAAE;IACpF,qBAAqB,CAAC,OAAS,GAAG,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,EAAE;IAC5D,eAAe,CAAC,eAAY,CAAC;IAC7B,eAAe,CAAC,oBAAiB,CAAC;IAClC,eAAe,CAAC,gBAAa,CAAC;IAC9B,wBAAwB,CAAC,SAAS,CAAC;AACrC","sources":["packages/@react-aria/color/intl/sk-SK.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Výber farieb\",\n \"colorSwatch\": \"vzorkovník farieb\",\n \"transparent\": \"transparentný\",\n \"twoDimensionalSlider\": \"2D jazdec\"\n}\n"],"names":[],"version":3,"file":"sk-SK.main.js.map"}
@@ -1 +1 @@
1
- {"mappings":";AAAA,4BAAiB;IAAG,mBAAmB,CAAC,OAAS,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,CAAC,CAAC;IACpF,qBAAqB,CAAC,OAAS,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,CAAC,CAAC;IAC5D,eAAe,CAAC,eAAY,CAAC;IAC7B,eAAe,CAAC,oBAAiB,CAAC;IAClC,eAAe,CAAC,gBAAa,CAAC;IAC9B,wBAAwB,CAAC,SAAS,CAAC;AACrC","sources":["packages/@react-aria/color/intl/sk-SK.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Výber farieb\",\n \"colorSwatch\": \"vzorkovník farieb\",\n \"transparent\": \"transparentný\",\n \"twoDimensionalSlider\": \"2D jazdec\"\n}\n"],"names":[],"version":3,"file":"sk-SK.module.js.map"}
1
+ {"mappings":";AAAA,4BAAiB;IAAG,mBAAmB,CAAC,OAAS,GAAG,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,EAAE;IACpF,qBAAqB,CAAC,OAAS,GAAG,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,EAAE;IAC5D,eAAe,CAAC,eAAY,CAAC;IAC7B,eAAe,CAAC,oBAAiB,CAAC;IAClC,eAAe,CAAC,gBAAa,CAAC;IAC9B,wBAAwB,CAAC,SAAS,CAAC;AACrC","sources":["packages/@react-aria/color/intl/sk-SK.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Výber farieb\",\n \"colorSwatch\": \"vzorkovník farieb\",\n \"transparent\": \"transparentný\",\n \"twoDimensionalSlider\": \"2D jazdec\"\n}\n"],"names":[],"version":3,"file":"sk-SK.module.js.map"}
@@ -1 +1 @@
1
- {"mappings":"AAAA,iBAAiB;IAAG,mBAAmB,CAAC,OAAS,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,CAAC,CAAC;IACpF,qBAAqB,CAAC,OAAS,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,CAAC,CAAC;IAC5D,eAAe,CAAC,aAAa,CAAC;IAC9B,eAAe,CAAC,aAAa,CAAC;IAC9B,eAAe,CAAC,QAAQ,CAAC;IACzB,wBAAwB,CAAC,SAAS,CAAC;AACrC","sources":["packages/@react-aria/color/intl/sl-SI.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Izbirnik barv\",\n \"colorSwatch\": \"barvna paleta\",\n \"transparent\": \"prozorno\",\n \"twoDimensionalSlider\": \"2D drsnik\"\n}\n"],"names":[],"version":3,"file":"sl-SI.main.js.map"}
1
+ {"mappings":"AAAA,iBAAiB;IAAG,mBAAmB,CAAC,OAAS,GAAG,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,EAAE;IACpF,qBAAqB,CAAC,OAAS,GAAG,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,EAAE;IAC5D,eAAe,CAAC,aAAa,CAAC;IAC9B,eAAe,CAAC,aAAa,CAAC;IAC9B,eAAe,CAAC,QAAQ,CAAC;IACzB,wBAAwB,CAAC,SAAS,CAAC;AACrC","sources":["packages/@react-aria/color/intl/sl-SI.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Izbirnik barv\",\n \"colorSwatch\": \"barvna paleta\",\n \"transparent\": \"prozorno\",\n \"twoDimensionalSlider\": \"2D drsnik\"\n}\n"],"names":[],"version":3,"file":"sl-SI.main.js.map"}
@@ -1 +1 @@
1
- {"mappings":";AAAA,4BAAiB;IAAG,mBAAmB,CAAC,OAAS,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,CAAC,CAAC;IACpF,qBAAqB,CAAC,OAAS,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,CAAC,CAAC;IAC5D,eAAe,CAAC,aAAa,CAAC;IAC9B,eAAe,CAAC,aAAa,CAAC;IAC9B,eAAe,CAAC,QAAQ,CAAC;IACzB,wBAAwB,CAAC,SAAS,CAAC;AACrC","sources":["packages/@react-aria/color/intl/sl-SI.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Izbirnik barv\",\n \"colorSwatch\": \"barvna paleta\",\n \"transparent\": \"prozorno\",\n \"twoDimensionalSlider\": \"2D drsnik\"\n}\n"],"names":[],"version":3,"file":"sl-SI.module.js.map"}
1
+ {"mappings":";AAAA,4BAAiB;IAAG,mBAAmB,CAAC,OAAS,GAAG,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,EAAE;IACpF,qBAAqB,CAAC,OAAS,GAAG,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,EAAE;IAC5D,eAAe,CAAC,aAAa,CAAC;IAC9B,eAAe,CAAC,aAAa,CAAC;IAC9B,eAAe,CAAC,QAAQ,CAAC;IACzB,wBAAwB,CAAC,SAAS,CAAC;AACrC","sources":["packages/@react-aria/color/intl/sl-SI.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Izbirnik barv\",\n \"colorSwatch\": \"barvna paleta\",\n \"transparent\": \"prozorno\",\n \"twoDimensionalSlider\": \"2D drsnik\"\n}\n"],"names":[],"version":3,"file":"sl-SI.module.js.map"}
@@ -1 +1 @@
1
- {"mappings":"AAAA,iBAAiB;IAAG,mBAAmB,CAAC,OAAS,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,CAAC,CAAC;IACpF,qBAAqB,CAAC,OAAS,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,CAAC,CAAC;IAC5D,eAAe,CAAC,gBAAU,CAAC;IAC3B,eAAe,CAAC,WAAW,CAAC;IAC5B,eAAe,CAAC,QAAQ,CAAC;IACzB,wBAAwB,CAAC,eAAS,CAAC;AACrC","sources":["packages/@react-aria/color/intl/sr-SP.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Birač boja\",\n \"colorSwatch\": \"Uzorak boje\",\n \"transparent\": \"providno\",\n \"twoDimensionalSlider\": \"2D klizač\"\n}\n"],"names":[],"version":3,"file":"sr-SP.main.js.map"}
1
+ {"mappings":"AAAA,iBAAiB;IAAG,mBAAmB,CAAC,OAAS,GAAG,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,EAAE;IACpF,qBAAqB,CAAC,OAAS,GAAG,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,EAAE;IAC5D,eAAe,CAAC,gBAAU,CAAC;IAC3B,eAAe,CAAC,WAAW,CAAC;IAC5B,eAAe,CAAC,QAAQ,CAAC;IACzB,wBAAwB,CAAC,eAAS,CAAC;AACrC","sources":["packages/@react-aria/color/intl/sr-SP.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Birač boja\",\n \"colorSwatch\": \"Uzorak boje\",\n \"transparent\": \"providno\",\n \"twoDimensionalSlider\": \"2D klizač\"\n}\n"],"names":[],"version":3,"file":"sr-SP.main.js.map"}
@@ -1 +1 @@
1
- {"mappings":";AAAA,4BAAiB;IAAG,mBAAmB,CAAC,OAAS,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,CAAC,CAAC;IACpF,qBAAqB,CAAC,OAAS,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,CAAC,CAAC;IAC5D,eAAe,CAAC,gBAAU,CAAC;IAC3B,eAAe,CAAC,WAAW,CAAC;IAC5B,eAAe,CAAC,QAAQ,CAAC;IACzB,wBAAwB,CAAC,eAAS,CAAC;AACrC","sources":["packages/@react-aria/color/intl/sr-SP.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Birač boja\",\n \"colorSwatch\": \"Uzorak boje\",\n \"transparent\": \"providno\",\n \"twoDimensionalSlider\": \"2D klizač\"\n}\n"],"names":[],"version":3,"file":"sr-SP.module.js.map"}
1
+ {"mappings":";AAAA,4BAAiB;IAAG,mBAAmB,CAAC,OAAS,GAAG,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,EAAE;IACpF,qBAAqB,CAAC,OAAS,GAAG,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,EAAE;IAC5D,eAAe,CAAC,gBAAU,CAAC;IAC3B,eAAe,CAAC,WAAW,CAAC;IAC5B,eAAe,CAAC,QAAQ,CAAC;IACzB,wBAAwB,CAAC,eAAS,CAAC;AACrC","sources":["packages/@react-aria/color/intl/sr-SP.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Birač boja\",\n \"colorSwatch\": \"Uzorak boje\",\n \"transparent\": \"providno\",\n \"twoDimensionalSlider\": \"2D klizač\"\n}\n"],"names":[],"version":3,"file":"sr-SP.module.js.map"}
@@ -1 +1 @@
1
- {"mappings":"AAAA,iBAAiB;IAAG,mBAAmB,CAAC,OAAS,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,CAAC,CAAC;IACpF,qBAAqB,CAAC,OAAS,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,CAAC,CAAC;IAC5D,eAAe,CAAC,kBAAY,CAAC;IAC7B,eAAe,CAAC,WAAQ,CAAC;IACzB,eAAe,CAAC,YAAY,CAAC;IAC7B,wBAAwB,CAAC,UAAU,CAAC;AACtC","sources":["packages/@react-aria/color/intl/sv-SE.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Färgväljaren\",\n \"colorSwatch\": \"färgruta\",\n \"transparent\": \"genomskinlig\",\n \"twoDimensionalSlider\": \"2D-reglage\"\n}\n"],"names":[],"version":3,"file":"sv-SE.main.js.map"}
1
+ {"mappings":"AAAA,iBAAiB;IAAG,mBAAmB,CAAC,OAAS,GAAG,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,EAAE;IACpF,qBAAqB,CAAC,OAAS,GAAG,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,EAAE;IAC5D,eAAe,CAAC,kBAAY,CAAC;IAC7B,eAAe,CAAC,WAAQ,CAAC;IACzB,eAAe,CAAC,YAAY,CAAC;IAC7B,wBAAwB,CAAC,UAAU,CAAC;AACtC","sources":["packages/@react-aria/color/intl/sv-SE.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Färgväljaren\",\n \"colorSwatch\": \"färgruta\",\n \"transparent\": \"genomskinlig\",\n \"twoDimensionalSlider\": \"2D-reglage\"\n}\n"],"names":[],"version":3,"file":"sv-SE.main.js.map"}
@@ -1 +1 @@
1
- {"mappings":";AAAA,4BAAiB;IAAG,mBAAmB,CAAC,OAAS,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,CAAC,CAAC;IACpF,qBAAqB,CAAC,OAAS,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,CAAC,CAAC;IAC5D,eAAe,CAAC,kBAAY,CAAC;IAC7B,eAAe,CAAC,WAAQ,CAAC;IACzB,eAAe,CAAC,YAAY,CAAC;IAC7B,wBAAwB,CAAC,UAAU,CAAC;AACtC","sources":["packages/@react-aria/color/intl/sv-SE.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Färgväljaren\",\n \"colorSwatch\": \"färgruta\",\n \"transparent\": \"genomskinlig\",\n \"twoDimensionalSlider\": \"2D-reglage\"\n}\n"],"names":[],"version":3,"file":"sv-SE.module.js.map"}
1
+ {"mappings":";AAAA,4BAAiB;IAAG,mBAAmB,CAAC,OAAS,GAAG,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,EAAE;IACpF,qBAAqB,CAAC,OAAS,GAAG,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,EAAE;IAC5D,eAAe,CAAC,kBAAY,CAAC;IAC7B,eAAe,CAAC,WAAQ,CAAC;IACzB,eAAe,CAAC,YAAY,CAAC;IAC7B,wBAAwB,CAAC,UAAU,CAAC;AACtC","sources":["packages/@react-aria/color/intl/sv-SE.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Färgväljaren\",\n \"colorSwatch\": \"färgruta\",\n \"transparent\": \"genomskinlig\",\n \"twoDimensionalSlider\": \"2D-reglage\"\n}\n"],"names":[],"version":3,"file":"sv-SE.module.js.map"}
@@ -1 +1 @@
1
- {"mappings":"AAAA,iBAAiB;IAAG,mBAAmB,CAAC,OAAS,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,CAAC,CAAC;IACpF,qBAAqB,CAAC,OAAS,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,CAAC,CAAC;IAC5D,eAAe,CAAC,cAAW,CAAC;IAC5B,eAAe,CAAC,oBAAW,CAAC;IAC5B,eAAe,CAAC,MAAM,CAAC;IACvB,wBAAwB,CAAC,cAAQ,CAAC;AACpC","sources":["packages/@react-aria/color/intl/tr-TR.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Renk Seçici\",\n \"colorSwatch\": \"renk örneği\",\n \"transparent\": \"saydam\",\n \"twoDimensionalSlider\": \"2D sürgü\"\n}\n"],"names":[],"version":3,"file":"tr-TR.main.js.map"}
1
+ {"mappings":"AAAA,iBAAiB;IAAG,mBAAmB,CAAC,OAAS,GAAG,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,EAAE;IACpF,qBAAqB,CAAC,OAAS,GAAG,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,EAAE;IAC5D,eAAe,CAAC,cAAW,CAAC;IAC5B,eAAe,CAAC,oBAAW,CAAC;IAC5B,eAAe,CAAC,MAAM,CAAC;IACvB,wBAAwB,CAAC,cAAQ,CAAC;AACpC","sources":["packages/@react-aria/color/intl/tr-TR.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Renk Seçici\",\n \"colorSwatch\": \"renk örneği\",\n \"transparent\": \"saydam\",\n \"twoDimensionalSlider\": \"2D sürgü\"\n}\n"],"names":[],"version":3,"file":"tr-TR.main.js.map"}
@@ -1 +1 @@
1
- {"mappings":";AAAA,4BAAiB;IAAG,mBAAmB,CAAC,OAAS,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,CAAC,CAAC;IACpF,qBAAqB,CAAC,OAAS,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,CAAC,CAAC;IAC5D,eAAe,CAAC,cAAW,CAAC;IAC5B,eAAe,CAAC,oBAAW,CAAC;IAC5B,eAAe,CAAC,MAAM,CAAC;IACvB,wBAAwB,CAAC,cAAQ,CAAC;AACpC","sources":["packages/@react-aria/color/intl/tr-TR.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Renk Seçici\",\n \"colorSwatch\": \"renk örneği\",\n \"transparent\": \"saydam\",\n \"twoDimensionalSlider\": \"2D sürgü\"\n}\n"],"names":[],"version":3,"file":"tr-TR.module.js.map"}
1
+ {"mappings":";AAAA,4BAAiB;IAAG,mBAAmB,CAAC,OAAS,GAAG,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,EAAE;IACpF,qBAAqB,CAAC,OAAS,GAAG,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,EAAE;IAC5D,eAAe,CAAC,cAAW,CAAC;IAC5B,eAAe,CAAC,oBAAW,CAAC;IAC5B,eAAe,CAAC,MAAM,CAAC;IACvB,wBAAwB,CAAC,cAAQ,CAAC;AACpC","sources":["packages/@react-aria/color/intl/tr-TR.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Renk Seçici\",\n \"colorSwatch\": \"renk örneği\",\n \"transparent\": \"saydam\",\n \"twoDimensionalSlider\": \"2D sürgü\"\n}\n"],"names":[],"version":3,"file":"tr-TR.module.js.map"}
@@ -1 +1 @@
1
- {"mappings":"AAAA,iBAAiB;IAAG,mBAAmB,CAAC,OAAS,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,CAAC,CAAC;IACpF,qBAAqB,CAAC,OAAS,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,CAAC,CAAC;IAC5D,eAAe,CAAC,0GAAgB,CAAC;IACjC,eAAe,CAAC,4FAAc,CAAC;IAC/B,eAAe,CAAC,wDAAQ,CAAC;IACzB,wBAAwB,CAAC,2DAAW,CAAC;AACvC","sources":["packages/@react-aria/color/intl/uk-UA.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Палітра кольорів\",\n \"colorSwatch\": \"зразок кольору\",\n \"transparent\": \"прозорий\",\n \"twoDimensionalSlider\": \"Повзунок 2D\"\n}\n"],"names":[],"version":3,"file":"uk-UA.main.js.map"}
1
+ {"mappings":"AAAA,iBAAiB;IAAG,mBAAmB,CAAC,OAAS,GAAG,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,EAAE;IACpF,qBAAqB,CAAC,OAAS,GAAG,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,EAAE;IAC5D,eAAe,CAAC,0GAAgB,CAAC;IACjC,eAAe,CAAC,4FAAc,CAAC;IAC/B,eAAe,CAAC,wDAAQ,CAAC;IACzB,wBAAwB,CAAC,2DAAW,CAAC;AACvC","sources":["packages/@react-aria/color/intl/uk-UA.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Палітра кольорів\",\n \"colorSwatch\": \"зразок кольору\",\n \"transparent\": \"прозорий\",\n \"twoDimensionalSlider\": \"Повзунок 2D\"\n}\n"],"names":[],"version":3,"file":"uk-UA.main.js.map"}
@@ -1 +1 @@
1
- {"mappings":";AAAA,4BAAiB;IAAG,mBAAmB,CAAC,OAAS,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,CAAC,CAAC;IACpF,qBAAqB,CAAC,OAAS,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,CAAC,CAAC;IAC5D,eAAe,CAAC,0GAAgB,CAAC;IACjC,eAAe,CAAC,4FAAc,CAAC;IAC/B,eAAe,CAAC,wDAAQ,CAAC;IACzB,wBAAwB,CAAC,2DAAW,CAAC;AACvC","sources":["packages/@react-aria/color/intl/uk-UA.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Палітра кольорів\",\n \"colorSwatch\": \"зразок кольору\",\n \"transparent\": \"прозорий\",\n \"twoDimensionalSlider\": \"Повзунок 2D\"\n}\n"],"names":[],"version":3,"file":"uk-UA.module.js.map"}
1
+ {"mappings":";AAAA,4BAAiB;IAAG,mBAAmB,CAAC,OAAS,GAAG,KAAK,KAAK,CAAC,EAAE,EAAE,KAAK,YAAY,EAAE;IACpF,qBAAqB,CAAC,OAAS,GAAG,KAAK,IAAI,CAAC,EAAE,EAAE,KAAK,KAAK,EAAE;IAC5D,eAAe,CAAC,0GAAgB,CAAC;IACjC,eAAe,CAAC,4FAAc,CAAC;IAC/B,eAAe,CAAC,wDAAQ,CAAC;IACzB,wBAAwB,CAAC,2DAAW,CAAC;AACvC","sources":["packages/@react-aria/color/intl/uk-UA.json"],"sourcesContent":["{\n \"colorInputLabel\": \"{label}, {channelLabel}\",\n \"colorNameAndValue\": \"{name}: {value}\",\n \"colorPicker\": \"Палітра кольорів\",\n \"colorSwatch\": \"зразок кольору\",\n \"transparent\": \"прозорий\",\n \"twoDimensionalSlider\": \"Повзунок 2D\"\n}\n"],"names":[],"version":3,"file":"uk-UA.module.js.map"}
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-aria/color/src/useColorArea.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorAreaProps, ColorChannel} from '@react-types/color';\nimport {ColorAreaState} from '@react-stately/color';\nimport {DOMAttributes, RefObject} from '@react-types/shared';\nimport {focusWithoutScrolling, isAndroid, isIOS, mergeProps, useFormReset, useGlobalListeners, useLabels} from '@react-aria/utils';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport React, {ChangeEvent, InputHTMLAttributes, useCallback, useRef, useState} from 'react';\nimport {useColorAreaGradient} from './useColorAreaGradient';\nimport {useFocus, useFocusWithin, useKeyboard, useMove} from '@react-aria/interactions';\nimport {useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\nexport interface ColorAreaAria {\n /** Props for the color area container element. */\n colorAreaProps: DOMAttributes,\n /** Props for the thumb element. */\n thumbProps: DOMAttributes,\n /** Props for the visually hidden horizontal range input element. */\n xInputProps: InputHTMLAttributes<HTMLInputElement>,\n /** Props for the visually hidden vertical range input element. */\n yInputProps: InputHTMLAttributes<HTMLInputElement>\n}\n\nexport interface AriaColorAreaOptions extends AriaColorAreaProps {\n /** A ref to the input that represents the x axis of the color area. */\n inputXRef: RefObject<HTMLInputElement | null>,\n /** A ref to the input that represents the y axis of the color area. */\n inputYRef: RefObject<HTMLInputElement | null>,\n /** A ref to the color area containing element. */\n containerRef: RefObject<Element | null>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a color area component.\n * Color area allows users to adjust two channels of an RGB, HSL or HSB color value against a two-dimensional gradient background.\n */\nexport function useColorArea(props: AriaColorAreaOptions, state: ColorAreaState): ColorAreaAria {\n let {\n isDisabled,\n inputXRef,\n inputYRef,\n containerRef,\n 'aria-label': ariaLabel,\n xName,\n yName\n } = props;\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/color');\n\n let {addGlobalListener, removeGlobalListener} = useGlobalListeners();\n\n let {direction, locale} = useLocale();\n\n let [focusedInput, setFocusedInput] = useState<'x' | 'y' | null>(null);\n let focusInput = useCallback((inputRef:RefObject<HTMLInputElement | null> = inputXRef) => {\n if (inputRef.current) {\n focusWithoutScrolling(inputRef.current);\n }\n }, [inputXRef]);\n\n useFormReset(inputXRef, [state.xValue, state.yValue], ([x, y]) => {\n let newColor = state.value\n .withChannelValue(state.channels.xChannel, x)\n .withChannelValue(state.channels.yChannel, y);\n state.setValue(newColor);\n });\n\n let [valueChangedViaKeyboard, setValueChangedViaKeyboard] = useState(false);\n let [valueChangedViaInputChangeEvent, setValueChangedViaInputChangeEvent] = useState(false);\n let {xChannel, yChannel, zChannel} = state.channels;\n let xChannelStep = state.xChannelStep;\n let yChannelStep = state.yChannelStep;\n\n let currentPosition = useRef<{x: number, y: number} | null>(null);\n\n let {keyboardProps} = useKeyboard({\n onKeyDown(e) {\n // these are the cases that useMove doesn't handle\n if (!/^(PageUp|PageDown|Home|End)$/.test(e.key)) {\n e.continuePropagation();\n return;\n }\n // same handling as useMove, don't need to stop propagation, useKeyboard will do that for us\n e.preventDefault();\n // remember to set this and unset it so that onChangeEnd is fired\n state.setDragging(true);\n setValueChangedViaKeyboard(true);\n let dir;\n switch (e.key) {\n case 'PageUp':\n state.incrementY(state.yChannelPageStep);\n dir = 'y';\n break;\n case 'PageDown':\n state.decrementY(state.yChannelPageStep);\n dir = 'y';\n break;\n case 'Home':\n direction === 'rtl' ? state.incrementX(state.xChannelPageStep) : state.decrementX(state.xChannelPageStep);\n dir = 'x';\n break;\n case 'End':\n direction === 'rtl' ? state.decrementX(state.xChannelPageStep) : state.incrementX(state.xChannelPageStep);\n dir = 'x';\n break;\n }\n state.setDragging(false);\n if (dir) {\n let input = dir === 'x' ? inputXRef : inputYRef;\n focusInput(input);\n setFocusedInput(dir);\n }\n }\n });\n\n let moveHandler = {\n onMoveStart() {\n currentPosition.current = null;\n state.setDragging(true);\n },\n onMove({deltaX, deltaY, pointerType, shiftKey}) {\n let {\n incrementX,\n decrementX,\n incrementY,\n decrementY,\n xChannelPageStep,\n xChannelStep,\n yChannelPageStep,\n yChannelStep,\n getThumbPosition,\n setColorFromPoint\n } = state;\n if (currentPosition.current == null) {\n currentPosition.current = getThumbPosition();\n }\n let {width, height} = containerRef.current?.getBoundingClientRect() || {width: 0, height: 0};\n let valueChanged = deltaX !== 0 || deltaY !== 0;\n if (pointerType === 'keyboard') {\n let deltaXValue = shiftKey && xChannelPageStep > xChannelStep ? xChannelPageStep : xChannelStep;\n let deltaYValue = shiftKey && yChannelPageStep > yChannelStep ? yChannelPageStep : yChannelStep;\n if ((deltaX > 0 && direction === 'ltr') || (deltaX < 0 && direction === 'rtl')) {\n incrementX(deltaXValue);\n } else if ((deltaX < 0 && direction === 'ltr') || (deltaX > 0 && direction === 'rtl')) {\n decrementX(deltaXValue);\n } else if (deltaY > 0) {\n decrementY(deltaYValue);\n } else if (deltaY < 0) {\n incrementY(deltaYValue);\n }\n setValueChangedViaKeyboard(valueChanged);\n // set the focused input based on which axis has the greater delta\n focusedInput = valueChanged && Math.abs(deltaY) > Math.abs(deltaX) ? 'y' : 'x';\n setFocusedInput(focusedInput);\n } else {\n currentPosition.current.x += (direction === 'rtl' ? -1 : 1) * deltaX / width ;\n currentPosition.current.y += deltaY / height;\n setColorFromPoint(currentPosition.current.x, currentPosition.current.y);\n }\n },\n onMoveEnd() {\n isOnColorArea.current = false;\n state.setDragging(false);\n let input = focusedInput === 'x' ? inputXRef : inputYRef;\n focusInput(input);\n }\n };\n let {moveProps: movePropsThumb} = useMove(moveHandler);\n\n let {focusWithinProps} = useFocusWithin({\n onFocusWithinChange: (focusWithin:boolean) => {\n if (!focusWithin) {\n setValueChangedViaKeyboard(false);\n setValueChangedViaInputChangeEvent(false);\n }\n }\n });\n\n let currentPointer = useRef<number | null | undefined>(undefined);\n let isOnColorArea = useRef<boolean>(false);\n let {moveProps: movePropsContainer} = useMove({\n onMoveStart() {\n if (isOnColorArea.current) {\n moveHandler.onMoveStart();\n }\n },\n onMove(e) {\n if (isOnColorArea.current) {\n moveHandler.onMove(e);\n }\n },\n onMoveEnd() {\n if (isOnColorArea.current) {\n moveHandler.onMoveEnd();\n }\n }\n });\n\n let onThumbDown = (id: number | null | undefined) => {\n if (!state.isDragging) {\n currentPointer.current = id;\n setValueChangedViaKeyboard(false);\n focusInput();\n state.setDragging(true);\n if (typeof PointerEvent !== 'undefined') {\n addGlobalListener(window, 'pointerup', onThumbUp, false);\n } else {\n addGlobalListener(window, 'mouseup', onThumbUp, false);\n addGlobalListener(window, 'touchend', onThumbUp, false);\n }\n }\n };\n\n let onThumbUp = (e) => {\n let id = e.pointerId ?? e.changedTouches?.[0].identifier;\n if (id === currentPointer.current) {\n setValueChangedViaKeyboard(false);\n focusInput();\n state.setDragging(false);\n currentPointer.current = undefined;\n isOnColorArea.current = false;\n\n if (typeof PointerEvent !== 'undefined') {\n removeGlobalListener(window, 'pointerup', onThumbUp, false);\n } else {\n removeGlobalListener(window, 'mouseup', onThumbUp, false);\n removeGlobalListener(window, 'touchend', onThumbUp, false);\n }\n }\n };\n\n let onColorAreaDown = (colorArea: Element, id: number | null | undefined, clientX: number, clientY: number) => {\n let rect = colorArea.getBoundingClientRect();\n let {width, height} = rect;\n let x = (clientX - rect.x) / width;\n let y = (clientY - rect.y) / height;\n if (direction === 'rtl') {\n x = 1 - x;\n }\n if (x >= 0 && x <= 1 && y >= 0 && y <= 1 && !state.isDragging && currentPointer.current === undefined) {\n isOnColorArea.current = true;\n setValueChangedViaKeyboard(false);\n currentPointer.current = id;\n state.setColorFromPoint(x, y);\n\n focusInput();\n state.setDragging(true);\n\n if (typeof PointerEvent !== 'undefined') {\n addGlobalListener(window, 'pointerup', onColorAreaUp, false);\n } else {\n addGlobalListener(window, 'mouseup', onColorAreaUp, false);\n addGlobalListener(window, 'touchend', onColorAreaUp, false);\n }\n }\n };\n\n let onColorAreaUp = (e) => {\n let id = e.pointerId ?? e.changedTouches?.[0].identifier;\n if (isOnColorArea.current && id === currentPointer.current) {\n isOnColorArea.current = false;\n setValueChangedViaKeyboard(false);\n currentPointer.current = undefined;\n state.setDragging(false);\n focusInput();\n\n if (typeof PointerEvent !== 'undefined') {\n removeGlobalListener(window, 'pointerup', onColorAreaUp, false);\n } else {\n removeGlobalListener(window, 'mouseup', onColorAreaUp, false);\n removeGlobalListener(window, 'touchend', onColorAreaUp, false);\n }\n }\n };\n\n let colorAreaInteractions = isDisabled ? {} : mergeProps({\n ...(typeof PointerEvent !== 'undefined' ? {\n onPointerDown: (e: React.PointerEvent) => {\n if (e.pointerType === 'mouse' && (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey)) {\n return;\n }\n onColorAreaDown(e.currentTarget, e.pointerId, e.clientX, e.clientY);\n }} : {\n onMouseDown: (e: React.MouseEvent) => {\n if (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey) {\n return;\n }\n onColorAreaDown(e.currentTarget, undefined, e.clientX, e.clientY);\n },\n onTouchStart: (e: React.TouchEvent) => {\n onColorAreaDown(e.currentTarget, e.changedTouches[0].identifier, e.changedTouches[0].clientX, e.changedTouches[0].clientY);\n }\n })\n }, movePropsContainer);\n\n let thumbInteractions = isDisabled ? {} : mergeProps({\n ...(typeof PointerEvent !== 'undefined' ? {\n onPointerDown: (e: React.PointerEvent) => {\n if (e.pointerType === 'mouse' && (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey)) {\n return;\n }\n onThumbDown(e.pointerId);\n }} : {\n onMouseDown: (e: React.MouseEvent) => {\n if (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey) {\n return;\n }\n onThumbDown(undefined);\n },\n onTouchStart: (e: React.TouchEvent) => {\n onThumbDown(e.changedTouches[0].identifier);\n }\n })\n }, focusWithinProps, keyboardProps, movePropsThumb);\n\n let {focusProps: xInputFocusProps} = useFocus({\n onFocus: () => {\n setFocusedInput('x');\n }\n });\n\n let {focusProps: yInputFocusProps} = useFocus({\n onFocus: () => {\n setFocusedInput('y');\n }\n });\n\n const onChange = (e: ChangeEvent<HTMLInputElement>) => {\n const {target} = e;\n setValueChangedViaInputChangeEvent(true);\n if (target === inputXRef.current) {\n state.setXValue(parseFloat(target.value));\n } else if (target === inputYRef.current) {\n state.setYValue(parseFloat(target.value));\n }\n };\n\n let isMobile = isIOS() || isAndroid();\n\n let value = state.getDisplayColor();\n const getAriaValueTextForChannel = useCallback((channel:ColorChannel) => {\n const isAfterInput = valueChangedViaInputChangeEvent || valueChangedViaKeyboard;\n return `${\n isAfterInput ?\n stringFormatter.format('colorNameAndValue', {name: value.getChannelName(channel, locale), value: value.formatChannelValue(channel, locale)})\n :\n [\n stringFormatter.format('colorNameAndValue', {name: value.getChannelName(channel, locale), value: value.formatChannelValue(channel, locale)}),\n stringFormatter.format('colorNameAndValue', {name: value.getChannelName(channel === yChannel ? xChannel : yChannel, locale), value: value.formatChannelValue(channel === yChannel ? xChannel : yChannel, locale)}),\n stringFormatter.format('colorNameAndValue', {name: value.getChannelName(zChannel, locale), value: value.formatChannelValue(zChannel, locale)})\n ].join(', ')\n }, ${value.getColorName(locale)}`;\n }, [locale, value, stringFormatter, valueChangedViaInputChangeEvent, valueChangedViaKeyboard, xChannel, yChannel, zChannel]);\n\n let colorPickerLabel = stringFormatter.format('colorPicker');\n\n let xInputLabellingProps = useLabels({\n ...props,\n 'aria-label': ariaLabel ? stringFormatter.format('colorInputLabel', {label: ariaLabel, channelLabel: colorPickerLabel}) : colorPickerLabel\n });\n\n let yInputLabellingProps = useLabels({\n ...props,\n 'aria-label': ariaLabel ? stringFormatter.format('colorInputLabel', {label: ariaLabel, channelLabel: colorPickerLabel}) : colorPickerLabel\n });\n\n let colorAreaLabellingProps = useLabels(\n {\n ...props,\n 'aria-label': ariaLabel ? `${ariaLabel}, ${colorPickerLabel}` : undefined\n },\n isMobile ? colorPickerLabel : undefined\n );\n\n let ariaRoleDescription = stringFormatter.format('twoDimensionalSlider');\n\n let {visuallyHiddenProps} = useVisuallyHidden({style: {\n opacity: '0.0001',\n width: '100%',\n height: '100%',\n pointerEvents: 'none'\n }});\n\n let {\n colorAreaStyleProps,\n thumbStyleProps\n } = useColorAreaGradient({\n direction,\n state,\n xChannel,\n yChannel,\n zChannel\n });\n\n return {\n colorAreaProps: {\n ...colorAreaLabellingProps,\n ...colorAreaInteractions,\n ...colorAreaStyleProps,\n role: 'group'\n },\n thumbProps: {\n ...thumbInteractions,\n ...thumbStyleProps,\n role: 'presentation'\n },\n xInputProps: {\n ...xInputLabellingProps,\n ...visuallyHiddenProps,\n ...xInputFocusProps,\n type: 'range',\n min: state.value.getChannelRange(xChannel).minValue,\n max: state.value.getChannelRange(xChannel).maxValue,\n step: xChannelStep,\n 'aria-roledescription': ariaRoleDescription,\n 'aria-valuetext': getAriaValueTextForChannel(xChannel),\n 'aria-orientation': 'horizontal',\n 'aria-describedby': props['aria-describedby'],\n 'aria-details': props['aria-details'],\n disabled: isDisabled,\n value: state.value.getChannelValue(xChannel),\n name: xName,\n tabIndex: (isMobile || !focusedInput || focusedInput === 'x' ? undefined : -1),\n /*\n So that only a single \"2d slider\" control shows up when listing form elements for screen readers,\n add aria-hidden=\"true\" to the unfocused control when the value has not changed via the keyboard,\n but remove aria-hidden to reveal the input for each channel when the value has changed with the keyboard.\n */\n 'aria-hidden': (isMobile || !focusedInput || focusedInput === 'x' || valueChangedViaKeyboard ? undefined : 'true'),\n onChange\n },\n yInputProps: {\n ...yInputLabellingProps,\n ...visuallyHiddenProps,\n ...yInputFocusProps,\n type: 'range',\n min: state.value.getChannelRange(yChannel).minValue,\n max: state.value.getChannelRange(yChannel).maxValue,\n step: yChannelStep,\n 'aria-roledescription': ariaRoleDescription,\n 'aria-valuetext': getAriaValueTextForChannel(yChannel),\n 'aria-orientation': 'vertical',\n 'aria-describedby': props['aria-describedby'],\n 'aria-details': props['aria-details'],\n disabled: isDisabled,\n value: state.value.getChannelValue(yChannel),\n name: yName,\n tabIndex: (isMobile || focusedInput === 'y' ? undefined : -1),\n /*\n So that only a single \"2d slider\" control shows up when listing form elements for screen readers,\n add aria-hidden=\"true\" to the unfocused input when the value has not changed via the keyboard,\n but remove aria-hidden to reveal the input for each channel when the value has changed with the keyboard.\n */\n 'aria-hidden': (isMobile || focusedInput === 'y' || valueChangedViaKeyboard ? undefined : 'true'),\n onChange\n }\n };\n}\n"],"names":[],"version":3,"file":"useColorArea.main.js.map"}
1
+ {"mappings":"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","sources":["packages/@react-aria/color/src/useColorArea.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorAreaProps, ColorChannel} from '@react-types/color';\nimport {ColorAreaState} from '@react-stately/color';\nimport {DOMAttributes, RefObject} from '@react-types/shared';\nimport {focusWithoutScrolling, isAndroid, isIOS, mergeProps, useFormReset, useGlobalListeners, useLabels} from '@react-aria/utils';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport React, {ChangeEvent, InputHTMLAttributes, useCallback, useRef, useState} from 'react';\nimport {useColorAreaGradient} from './useColorAreaGradient';\nimport {useFocus, useFocusWithin, useKeyboard, useMove} from '@react-aria/interactions';\nimport {useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\nexport interface ColorAreaAria {\n /** Props for the color area container element. */\n colorAreaProps: DOMAttributes,\n /** Props for the thumb element. */\n thumbProps: DOMAttributes,\n /** Props for the visually hidden horizontal range input element. */\n xInputProps: InputHTMLAttributes<HTMLInputElement>,\n /** Props for the visually hidden vertical range input element. */\n yInputProps: InputHTMLAttributes<HTMLInputElement>\n}\n\nexport interface AriaColorAreaOptions extends AriaColorAreaProps {\n /** A ref to the input that represents the x axis of the color area. */\n inputXRef: RefObject<HTMLInputElement | null>,\n /** A ref to the input that represents the y axis of the color area. */\n inputYRef: RefObject<HTMLInputElement | null>,\n /** A ref to the color area containing element. */\n containerRef: RefObject<Element | null>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a color area component.\n * Color area allows users to adjust two channels of an RGB, HSL or HSB color value against a two-dimensional gradient background.\n */\nexport function useColorArea(props: AriaColorAreaOptions, state: ColorAreaState): ColorAreaAria {\n let {\n isDisabled,\n inputXRef,\n inputYRef,\n containerRef,\n 'aria-label': ariaLabel,\n xName,\n yName\n } = props;\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/color');\n\n let {addGlobalListener, removeGlobalListener} = useGlobalListeners();\n\n let {direction, locale} = useLocale();\n\n let [focusedInput, setFocusedInput] = useState<'x' | 'y' | null>(null);\n let focusInput = useCallback((inputRef:RefObject<HTMLInputElement | null> = inputXRef) => {\n if (inputRef.current) {\n focusWithoutScrolling(inputRef.current);\n }\n }, [inputXRef]);\n\n useFormReset(inputXRef, [state.xValue, state.yValue], ([x, y]) => {\n let newColor = state.value\n .withChannelValue(state.channels.xChannel, x)\n .withChannelValue(state.channels.yChannel, y);\n state.setValue(newColor);\n });\n\n let [valueChangedViaKeyboard, setValueChangedViaKeyboard] = useState(false);\n let [valueChangedViaInputChangeEvent, setValueChangedViaInputChangeEvent] = useState(false);\n let {xChannel, yChannel, zChannel} = state.channels;\n let xChannelStep = state.xChannelStep;\n let yChannelStep = state.yChannelStep;\n\n let currentPosition = useRef<{x: number, y: number} | null>(null);\n\n let {keyboardProps} = useKeyboard({\n onKeyDown(e) {\n // these are the cases that useMove doesn't handle\n if (!/^(PageUp|PageDown|Home|End)$/.test(e.key)) {\n e.continuePropagation();\n return;\n }\n // same handling as useMove, don't need to stop propagation, useKeyboard will do that for us\n e.preventDefault();\n // remember to set this and unset it so that onChangeEnd is fired\n state.setDragging(true);\n setValueChangedViaKeyboard(true);\n let dir;\n switch (e.key) {\n case 'PageUp':\n state.incrementY(state.yChannelPageStep);\n dir = 'y';\n break;\n case 'PageDown':\n state.decrementY(state.yChannelPageStep);\n dir = 'y';\n break;\n case 'Home':\n direction === 'rtl' ? state.incrementX(state.xChannelPageStep) : state.decrementX(state.xChannelPageStep);\n dir = 'x';\n break;\n case 'End':\n direction === 'rtl' ? state.decrementX(state.xChannelPageStep) : state.incrementX(state.xChannelPageStep);\n dir = 'x';\n break;\n }\n state.setDragging(false);\n if (dir) {\n let input = dir === 'x' ? inputXRef : inputYRef;\n focusInput(input);\n setFocusedInput(dir);\n }\n }\n });\n\n let moveHandler = {\n onMoveStart() {\n currentPosition.current = null;\n state.setDragging(true);\n },\n onMove({deltaX, deltaY, pointerType, shiftKey}) {\n let {\n incrementX,\n decrementX,\n incrementY,\n decrementY,\n xChannelPageStep,\n xChannelStep,\n yChannelPageStep,\n yChannelStep,\n getThumbPosition,\n setColorFromPoint\n } = state;\n if (currentPosition.current == null) {\n currentPosition.current = getThumbPosition();\n }\n let {width, height} = containerRef.current?.getBoundingClientRect() || {width: 0, height: 0};\n let valueChanged = deltaX !== 0 || deltaY !== 0;\n if (pointerType === 'keyboard') {\n let deltaXValue = shiftKey && xChannelPageStep > xChannelStep ? xChannelPageStep : xChannelStep;\n let deltaYValue = shiftKey && yChannelPageStep > yChannelStep ? yChannelPageStep : yChannelStep;\n if ((deltaX > 0 && direction === 'ltr') || (deltaX < 0 && direction === 'rtl')) {\n incrementX(deltaXValue);\n } else if ((deltaX < 0 && direction === 'ltr') || (deltaX > 0 && direction === 'rtl')) {\n decrementX(deltaXValue);\n } else if (deltaY > 0) {\n decrementY(deltaYValue);\n } else if (deltaY < 0) {\n incrementY(deltaYValue);\n }\n setValueChangedViaKeyboard(valueChanged);\n // set the focused input based on which axis has the greater delta\n focusedInput = valueChanged && Math.abs(deltaY) > Math.abs(deltaX) ? 'y' : 'x';\n setFocusedInput(focusedInput);\n } else {\n currentPosition.current.x += (direction === 'rtl' ? -1 : 1) * deltaX / width ;\n currentPosition.current.y += deltaY / height;\n setColorFromPoint(currentPosition.current.x, currentPosition.current.y);\n }\n },\n onMoveEnd() {\n isOnColorArea.current = false;\n state.setDragging(false);\n let input = focusedInput === 'x' ? inputXRef : inputYRef;\n focusInput(input);\n }\n };\n let {moveProps: movePropsThumb} = useMove(moveHandler);\n\n let {focusWithinProps} = useFocusWithin({\n onFocusWithinChange: (focusWithin:boolean) => {\n if (!focusWithin) {\n setValueChangedViaKeyboard(false);\n setValueChangedViaInputChangeEvent(false);\n }\n }\n });\n\n let currentPointer = useRef<number | null | undefined>(undefined);\n let isOnColorArea = useRef<boolean>(false);\n let {moveProps: movePropsContainer} = useMove({\n onMoveStart() {\n if (isOnColorArea.current) {\n moveHandler.onMoveStart();\n }\n },\n onMove(e) {\n if (isOnColorArea.current) {\n moveHandler.onMove(e);\n }\n },\n onMoveEnd() {\n if (isOnColorArea.current) {\n moveHandler.onMoveEnd();\n }\n }\n });\n\n let onThumbDown = (id: number | null | undefined) => {\n if (!state.isDragging) {\n currentPointer.current = id;\n setValueChangedViaKeyboard(false);\n focusInput();\n state.setDragging(true);\n if (typeof PointerEvent !== 'undefined') {\n addGlobalListener(window, 'pointerup', onThumbUp, false);\n } else {\n addGlobalListener(window, 'mouseup', onThumbUp, false);\n addGlobalListener(window, 'touchend', onThumbUp, false);\n }\n }\n };\n\n let onThumbUp = (e) => {\n let id = e.pointerId ?? e.changedTouches?.[0].identifier;\n if (id === currentPointer.current) {\n setValueChangedViaKeyboard(false);\n focusInput();\n state.setDragging(false);\n currentPointer.current = undefined;\n isOnColorArea.current = false;\n\n if (typeof PointerEvent !== 'undefined') {\n removeGlobalListener(window, 'pointerup', onThumbUp, false);\n } else {\n removeGlobalListener(window, 'mouseup', onThumbUp, false);\n removeGlobalListener(window, 'touchend', onThumbUp, false);\n }\n }\n };\n\n let onColorAreaDown = (colorArea: Element, id: number | null | undefined, clientX: number, clientY: number) => {\n let rect = colorArea.getBoundingClientRect();\n let {width, height} = rect;\n let x = (clientX - rect.x) / width;\n let y = (clientY - rect.y) / height;\n if (direction === 'rtl') {\n x = 1 - x;\n }\n if (x >= 0 && x <= 1 && y >= 0 && y <= 1 && !state.isDragging && currentPointer.current === undefined) {\n isOnColorArea.current = true;\n setValueChangedViaKeyboard(false);\n currentPointer.current = id;\n state.setColorFromPoint(x, y);\n\n focusInput();\n state.setDragging(true);\n\n if (typeof PointerEvent !== 'undefined') {\n addGlobalListener(window, 'pointerup', onColorAreaUp, false);\n } else {\n addGlobalListener(window, 'mouseup', onColorAreaUp, false);\n addGlobalListener(window, 'touchend', onColorAreaUp, false);\n }\n }\n };\n\n let onColorAreaUp = (e) => {\n let id = e.pointerId ?? e.changedTouches?.[0].identifier;\n if (isOnColorArea.current && id === currentPointer.current) {\n isOnColorArea.current = false;\n setValueChangedViaKeyboard(false);\n currentPointer.current = undefined;\n state.setDragging(false);\n focusInput();\n\n if (typeof PointerEvent !== 'undefined') {\n removeGlobalListener(window, 'pointerup', onColorAreaUp, false);\n } else {\n removeGlobalListener(window, 'mouseup', onColorAreaUp, false);\n removeGlobalListener(window, 'touchend', onColorAreaUp, false);\n }\n }\n };\n\n let colorAreaInteractions = isDisabled ? {} : mergeProps({\n ...(typeof PointerEvent !== 'undefined' ? {\n onPointerDown: (e: React.PointerEvent) => {\n if (e.pointerType === 'mouse' && (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey)) {\n return;\n }\n onColorAreaDown(e.currentTarget, e.pointerId, e.clientX, e.clientY);\n }} : {\n onMouseDown: (e: React.MouseEvent) => {\n if (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey) {\n return;\n }\n onColorAreaDown(e.currentTarget, undefined, e.clientX, e.clientY);\n },\n onTouchStart: (e: React.TouchEvent) => {\n onColorAreaDown(e.currentTarget, e.changedTouches[0].identifier, e.changedTouches[0].clientX, e.changedTouches[0].clientY);\n }\n })\n }, movePropsContainer);\n\n let thumbInteractions = isDisabled ? {} : mergeProps({\n ...(typeof PointerEvent !== 'undefined' ? {\n onPointerDown: (e: React.PointerEvent) => {\n if (e.pointerType === 'mouse' && (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey)) {\n return;\n }\n onThumbDown(e.pointerId);\n }} : {\n onMouseDown: (e: React.MouseEvent) => {\n if (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey) {\n return;\n }\n onThumbDown(undefined);\n },\n onTouchStart: (e: React.TouchEvent) => {\n onThumbDown(e.changedTouches[0].identifier);\n }\n })\n }, focusWithinProps, keyboardProps, movePropsThumb);\n\n let {focusProps: xInputFocusProps} = useFocus({\n onFocus: () => {\n setFocusedInput('x');\n }\n });\n\n let {focusProps: yInputFocusProps} = useFocus({\n onFocus: () => {\n setFocusedInput('y');\n }\n });\n\n const onChange = (e: ChangeEvent<HTMLInputElement>) => {\n const {target} = e;\n setValueChangedViaInputChangeEvent(true);\n if (target === inputXRef.current) {\n state.setXValue(parseFloat(target.value));\n } else if (target === inputYRef.current) {\n state.setYValue(parseFloat(target.value));\n }\n };\n\n let isMobile = isIOS() || isAndroid();\n\n let value = state.getDisplayColor();\n const getAriaValueTextForChannel = useCallback((channel:ColorChannel) => {\n const isAfterInput = valueChangedViaInputChangeEvent || valueChangedViaKeyboard;\n return `${\n isAfterInput ?\n stringFormatter.format('colorNameAndValue', {name: value.getChannelName(channel, locale), value: value.formatChannelValue(channel, locale)})\n :\n [\n stringFormatter.format('colorNameAndValue', {name: value.getChannelName(channel, locale), value: value.formatChannelValue(channel, locale)}),\n stringFormatter.format('colorNameAndValue', {name: value.getChannelName(channel === yChannel ? xChannel : yChannel, locale), value: value.formatChannelValue(channel === yChannel ? xChannel : yChannel, locale)}),\n stringFormatter.format('colorNameAndValue', {name: value.getChannelName(zChannel, locale), value: value.formatChannelValue(zChannel, locale)})\n ].join(', ')\n }, ${value.getColorName(locale)}`;\n }, [locale, value, stringFormatter, valueChangedViaInputChangeEvent, valueChangedViaKeyboard, xChannel, yChannel, zChannel]);\n\n let colorPickerLabel = stringFormatter.format('colorPicker');\n\n let xInputLabellingProps = useLabels({\n ...props,\n 'aria-label': ariaLabel ? stringFormatter.format('colorInputLabel', {label: ariaLabel, channelLabel: colorPickerLabel}) : colorPickerLabel\n });\n\n let yInputLabellingProps = useLabels({\n ...props,\n 'aria-label': ariaLabel ? stringFormatter.format('colorInputLabel', {label: ariaLabel, channelLabel: colorPickerLabel}) : colorPickerLabel\n });\n\n let colorAreaLabellingProps = useLabels(\n {\n ...props,\n 'aria-label': ariaLabel ? `${ariaLabel}, ${colorPickerLabel}` : undefined\n },\n isMobile ? colorPickerLabel : undefined\n );\n\n let ariaRoleDescription = stringFormatter.format('twoDimensionalSlider');\n\n let {visuallyHiddenProps} = useVisuallyHidden({style: {\n opacity: '0.0001',\n width: '100%',\n height: '100%',\n pointerEvents: 'none'\n }});\n\n let {\n colorAreaStyleProps,\n thumbStyleProps\n } = useColorAreaGradient({\n direction,\n state,\n xChannel,\n yChannel,\n zChannel\n });\n\n return {\n colorAreaProps: {\n ...colorAreaLabellingProps,\n ...colorAreaInteractions,\n ...colorAreaStyleProps,\n role: 'group'\n },\n thumbProps: {\n ...thumbInteractions,\n ...thumbStyleProps,\n role: 'presentation'\n },\n xInputProps: {\n ...xInputLabellingProps,\n ...visuallyHiddenProps,\n ...xInputFocusProps,\n type: 'range',\n min: state.value.getChannelRange(xChannel).minValue,\n max: state.value.getChannelRange(xChannel).maxValue,\n step: xChannelStep,\n 'aria-roledescription': ariaRoleDescription,\n 'aria-valuetext': getAriaValueTextForChannel(xChannel),\n 'aria-orientation': 'horizontal',\n 'aria-describedby': props['aria-describedby'],\n 'aria-details': props['aria-details'],\n disabled: isDisabled,\n value: state.value.getChannelValue(xChannel),\n name: xName,\n tabIndex: (isMobile || !focusedInput || focusedInput === 'x' ? undefined : -1),\n /*\n So that only a single \"2d slider\" control shows up when listing form elements for screen readers,\n add aria-hidden=\"true\" to the unfocused control when the value has not changed via the keyboard,\n but remove aria-hidden to reveal the input for each channel when the value has changed with the keyboard.\n */\n 'aria-hidden': (isMobile || !focusedInput || focusedInput === 'x' || valueChangedViaKeyboard ? undefined : 'true'),\n onChange\n },\n yInputProps: {\n ...yInputLabellingProps,\n ...visuallyHiddenProps,\n ...yInputFocusProps,\n type: 'range',\n min: state.value.getChannelRange(yChannel).minValue,\n max: state.value.getChannelRange(yChannel).maxValue,\n step: yChannelStep,\n 'aria-roledescription': ariaRoleDescription,\n 'aria-valuetext': getAriaValueTextForChannel(yChannel),\n 'aria-orientation': 'vertical',\n 'aria-describedby': props['aria-describedby'],\n 'aria-details': props['aria-details'],\n disabled: isDisabled,\n value: state.value.getChannelValue(yChannel),\n name: yName,\n tabIndex: (isMobile || focusedInput === 'y' ? undefined : -1),\n /*\n So that only a single \"2d slider\" control shows up when listing form elements for screen readers,\n add aria-hidden=\"true\" to the unfocused input when the value has not changed via the keyboard,\n but remove aria-hidden to reveal the input for each channel when the value has changed with the keyboard.\n */\n 'aria-hidden': (isMobile || focusedInput === 'y' || valueChangedViaKeyboard ? undefined : 'true'),\n onChange\n }\n };\n}\n"],"names":[],"version":3,"file":"useColorArea.main.js.map"}
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-aria/color/src/useColorArea.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorAreaProps, ColorChannel} from '@react-types/color';\nimport {ColorAreaState} from '@react-stately/color';\nimport {DOMAttributes, RefObject} from '@react-types/shared';\nimport {focusWithoutScrolling, isAndroid, isIOS, mergeProps, useFormReset, useGlobalListeners, useLabels} from '@react-aria/utils';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport React, {ChangeEvent, InputHTMLAttributes, useCallback, useRef, useState} from 'react';\nimport {useColorAreaGradient} from './useColorAreaGradient';\nimport {useFocus, useFocusWithin, useKeyboard, useMove} from '@react-aria/interactions';\nimport {useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\nexport interface ColorAreaAria {\n /** Props for the color area container element. */\n colorAreaProps: DOMAttributes,\n /** Props for the thumb element. */\n thumbProps: DOMAttributes,\n /** Props for the visually hidden horizontal range input element. */\n xInputProps: InputHTMLAttributes<HTMLInputElement>,\n /** Props for the visually hidden vertical range input element. */\n yInputProps: InputHTMLAttributes<HTMLInputElement>\n}\n\nexport interface AriaColorAreaOptions extends AriaColorAreaProps {\n /** A ref to the input that represents the x axis of the color area. */\n inputXRef: RefObject<HTMLInputElement | null>,\n /** A ref to the input that represents the y axis of the color area. */\n inputYRef: RefObject<HTMLInputElement | null>,\n /** A ref to the color area containing element. */\n containerRef: RefObject<Element | null>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a color area component.\n * Color area allows users to adjust two channels of an RGB, HSL or HSB color value against a two-dimensional gradient background.\n */\nexport function useColorArea(props: AriaColorAreaOptions, state: ColorAreaState): ColorAreaAria {\n let {\n isDisabled,\n inputXRef,\n inputYRef,\n containerRef,\n 'aria-label': ariaLabel,\n xName,\n yName\n } = props;\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/color');\n\n let {addGlobalListener, removeGlobalListener} = useGlobalListeners();\n\n let {direction, locale} = useLocale();\n\n let [focusedInput, setFocusedInput] = useState<'x' | 'y' | null>(null);\n let focusInput = useCallback((inputRef:RefObject<HTMLInputElement | null> = inputXRef) => {\n if (inputRef.current) {\n focusWithoutScrolling(inputRef.current);\n }\n }, [inputXRef]);\n\n useFormReset(inputXRef, [state.xValue, state.yValue], ([x, y]) => {\n let newColor = state.value\n .withChannelValue(state.channels.xChannel, x)\n .withChannelValue(state.channels.yChannel, y);\n state.setValue(newColor);\n });\n\n let [valueChangedViaKeyboard, setValueChangedViaKeyboard] = useState(false);\n let [valueChangedViaInputChangeEvent, setValueChangedViaInputChangeEvent] = useState(false);\n let {xChannel, yChannel, zChannel} = state.channels;\n let xChannelStep = state.xChannelStep;\n let yChannelStep = state.yChannelStep;\n\n let currentPosition = useRef<{x: number, y: number} | null>(null);\n\n let {keyboardProps} = useKeyboard({\n onKeyDown(e) {\n // these are the cases that useMove doesn't handle\n if (!/^(PageUp|PageDown|Home|End)$/.test(e.key)) {\n e.continuePropagation();\n return;\n }\n // same handling as useMove, don't need to stop propagation, useKeyboard will do that for us\n e.preventDefault();\n // remember to set this and unset it so that onChangeEnd is fired\n state.setDragging(true);\n setValueChangedViaKeyboard(true);\n let dir;\n switch (e.key) {\n case 'PageUp':\n state.incrementY(state.yChannelPageStep);\n dir = 'y';\n break;\n case 'PageDown':\n state.decrementY(state.yChannelPageStep);\n dir = 'y';\n break;\n case 'Home':\n direction === 'rtl' ? state.incrementX(state.xChannelPageStep) : state.decrementX(state.xChannelPageStep);\n dir = 'x';\n break;\n case 'End':\n direction === 'rtl' ? state.decrementX(state.xChannelPageStep) : state.incrementX(state.xChannelPageStep);\n dir = 'x';\n break;\n }\n state.setDragging(false);\n if (dir) {\n let input = dir === 'x' ? inputXRef : inputYRef;\n focusInput(input);\n setFocusedInput(dir);\n }\n }\n });\n\n let moveHandler = {\n onMoveStart() {\n currentPosition.current = null;\n state.setDragging(true);\n },\n onMove({deltaX, deltaY, pointerType, shiftKey}) {\n let {\n incrementX,\n decrementX,\n incrementY,\n decrementY,\n xChannelPageStep,\n xChannelStep,\n yChannelPageStep,\n yChannelStep,\n getThumbPosition,\n setColorFromPoint\n } = state;\n if (currentPosition.current == null) {\n currentPosition.current = getThumbPosition();\n }\n let {width, height} = containerRef.current?.getBoundingClientRect() || {width: 0, height: 0};\n let valueChanged = deltaX !== 0 || deltaY !== 0;\n if (pointerType === 'keyboard') {\n let deltaXValue = shiftKey && xChannelPageStep > xChannelStep ? xChannelPageStep : xChannelStep;\n let deltaYValue = shiftKey && yChannelPageStep > yChannelStep ? yChannelPageStep : yChannelStep;\n if ((deltaX > 0 && direction === 'ltr') || (deltaX < 0 && direction === 'rtl')) {\n incrementX(deltaXValue);\n } else if ((deltaX < 0 && direction === 'ltr') || (deltaX > 0 && direction === 'rtl')) {\n decrementX(deltaXValue);\n } else if (deltaY > 0) {\n decrementY(deltaYValue);\n } else if (deltaY < 0) {\n incrementY(deltaYValue);\n }\n setValueChangedViaKeyboard(valueChanged);\n // set the focused input based on which axis has the greater delta\n focusedInput = valueChanged && Math.abs(deltaY) > Math.abs(deltaX) ? 'y' : 'x';\n setFocusedInput(focusedInput);\n } else {\n currentPosition.current.x += (direction === 'rtl' ? -1 : 1) * deltaX / width ;\n currentPosition.current.y += deltaY / height;\n setColorFromPoint(currentPosition.current.x, currentPosition.current.y);\n }\n },\n onMoveEnd() {\n isOnColorArea.current = false;\n state.setDragging(false);\n let input = focusedInput === 'x' ? inputXRef : inputYRef;\n focusInput(input);\n }\n };\n let {moveProps: movePropsThumb} = useMove(moveHandler);\n\n let {focusWithinProps} = useFocusWithin({\n onFocusWithinChange: (focusWithin:boolean) => {\n if (!focusWithin) {\n setValueChangedViaKeyboard(false);\n setValueChangedViaInputChangeEvent(false);\n }\n }\n });\n\n let currentPointer = useRef<number | null | undefined>(undefined);\n let isOnColorArea = useRef<boolean>(false);\n let {moveProps: movePropsContainer} = useMove({\n onMoveStart() {\n if (isOnColorArea.current) {\n moveHandler.onMoveStart();\n }\n },\n onMove(e) {\n if (isOnColorArea.current) {\n moveHandler.onMove(e);\n }\n },\n onMoveEnd() {\n if (isOnColorArea.current) {\n moveHandler.onMoveEnd();\n }\n }\n });\n\n let onThumbDown = (id: number | null | undefined) => {\n if (!state.isDragging) {\n currentPointer.current = id;\n setValueChangedViaKeyboard(false);\n focusInput();\n state.setDragging(true);\n if (typeof PointerEvent !== 'undefined') {\n addGlobalListener(window, 'pointerup', onThumbUp, false);\n } else {\n addGlobalListener(window, 'mouseup', onThumbUp, false);\n addGlobalListener(window, 'touchend', onThumbUp, false);\n }\n }\n };\n\n let onThumbUp = (e) => {\n let id = e.pointerId ?? e.changedTouches?.[0].identifier;\n if (id === currentPointer.current) {\n setValueChangedViaKeyboard(false);\n focusInput();\n state.setDragging(false);\n currentPointer.current = undefined;\n isOnColorArea.current = false;\n\n if (typeof PointerEvent !== 'undefined') {\n removeGlobalListener(window, 'pointerup', onThumbUp, false);\n } else {\n removeGlobalListener(window, 'mouseup', onThumbUp, false);\n removeGlobalListener(window, 'touchend', onThumbUp, false);\n }\n }\n };\n\n let onColorAreaDown = (colorArea: Element, id: number | null | undefined, clientX: number, clientY: number) => {\n let rect = colorArea.getBoundingClientRect();\n let {width, height} = rect;\n let x = (clientX - rect.x) / width;\n let y = (clientY - rect.y) / height;\n if (direction === 'rtl') {\n x = 1 - x;\n }\n if (x >= 0 && x <= 1 && y >= 0 && y <= 1 && !state.isDragging && currentPointer.current === undefined) {\n isOnColorArea.current = true;\n setValueChangedViaKeyboard(false);\n currentPointer.current = id;\n state.setColorFromPoint(x, y);\n\n focusInput();\n state.setDragging(true);\n\n if (typeof PointerEvent !== 'undefined') {\n addGlobalListener(window, 'pointerup', onColorAreaUp, false);\n } else {\n addGlobalListener(window, 'mouseup', onColorAreaUp, false);\n addGlobalListener(window, 'touchend', onColorAreaUp, false);\n }\n }\n };\n\n let onColorAreaUp = (e) => {\n let id = e.pointerId ?? e.changedTouches?.[0].identifier;\n if (isOnColorArea.current && id === currentPointer.current) {\n isOnColorArea.current = false;\n setValueChangedViaKeyboard(false);\n currentPointer.current = undefined;\n state.setDragging(false);\n focusInput();\n\n if (typeof PointerEvent !== 'undefined') {\n removeGlobalListener(window, 'pointerup', onColorAreaUp, false);\n } else {\n removeGlobalListener(window, 'mouseup', onColorAreaUp, false);\n removeGlobalListener(window, 'touchend', onColorAreaUp, false);\n }\n }\n };\n\n let colorAreaInteractions = isDisabled ? {} : mergeProps({\n ...(typeof PointerEvent !== 'undefined' ? {\n onPointerDown: (e: React.PointerEvent) => {\n if (e.pointerType === 'mouse' && (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey)) {\n return;\n }\n onColorAreaDown(e.currentTarget, e.pointerId, e.clientX, e.clientY);\n }} : {\n onMouseDown: (e: React.MouseEvent) => {\n if (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey) {\n return;\n }\n onColorAreaDown(e.currentTarget, undefined, e.clientX, e.clientY);\n },\n onTouchStart: (e: React.TouchEvent) => {\n onColorAreaDown(e.currentTarget, e.changedTouches[0].identifier, e.changedTouches[0].clientX, e.changedTouches[0].clientY);\n }\n })\n }, movePropsContainer);\n\n let thumbInteractions = isDisabled ? {} : mergeProps({\n ...(typeof PointerEvent !== 'undefined' ? {\n onPointerDown: (e: React.PointerEvent) => {\n if (e.pointerType === 'mouse' && (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey)) {\n return;\n }\n onThumbDown(e.pointerId);\n }} : {\n onMouseDown: (e: React.MouseEvent) => {\n if (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey) {\n return;\n }\n onThumbDown(undefined);\n },\n onTouchStart: (e: React.TouchEvent) => {\n onThumbDown(e.changedTouches[0].identifier);\n }\n })\n }, focusWithinProps, keyboardProps, movePropsThumb);\n\n let {focusProps: xInputFocusProps} = useFocus({\n onFocus: () => {\n setFocusedInput('x');\n }\n });\n\n let {focusProps: yInputFocusProps} = useFocus({\n onFocus: () => {\n setFocusedInput('y');\n }\n });\n\n const onChange = (e: ChangeEvent<HTMLInputElement>) => {\n const {target} = e;\n setValueChangedViaInputChangeEvent(true);\n if (target === inputXRef.current) {\n state.setXValue(parseFloat(target.value));\n } else if (target === inputYRef.current) {\n state.setYValue(parseFloat(target.value));\n }\n };\n\n let isMobile = isIOS() || isAndroid();\n\n let value = state.getDisplayColor();\n const getAriaValueTextForChannel = useCallback((channel:ColorChannel) => {\n const isAfterInput = valueChangedViaInputChangeEvent || valueChangedViaKeyboard;\n return `${\n isAfterInput ?\n stringFormatter.format('colorNameAndValue', {name: value.getChannelName(channel, locale), value: value.formatChannelValue(channel, locale)})\n :\n [\n stringFormatter.format('colorNameAndValue', {name: value.getChannelName(channel, locale), value: value.formatChannelValue(channel, locale)}),\n stringFormatter.format('colorNameAndValue', {name: value.getChannelName(channel === yChannel ? xChannel : yChannel, locale), value: value.formatChannelValue(channel === yChannel ? xChannel : yChannel, locale)}),\n stringFormatter.format('colorNameAndValue', {name: value.getChannelName(zChannel, locale), value: value.formatChannelValue(zChannel, locale)})\n ].join(', ')\n }, ${value.getColorName(locale)}`;\n }, [locale, value, stringFormatter, valueChangedViaInputChangeEvent, valueChangedViaKeyboard, xChannel, yChannel, zChannel]);\n\n let colorPickerLabel = stringFormatter.format('colorPicker');\n\n let xInputLabellingProps = useLabels({\n ...props,\n 'aria-label': ariaLabel ? stringFormatter.format('colorInputLabel', {label: ariaLabel, channelLabel: colorPickerLabel}) : colorPickerLabel\n });\n\n let yInputLabellingProps = useLabels({\n ...props,\n 'aria-label': ariaLabel ? stringFormatter.format('colorInputLabel', {label: ariaLabel, channelLabel: colorPickerLabel}) : colorPickerLabel\n });\n\n let colorAreaLabellingProps = useLabels(\n {\n ...props,\n 'aria-label': ariaLabel ? `${ariaLabel}, ${colorPickerLabel}` : undefined\n },\n isMobile ? colorPickerLabel : undefined\n );\n\n let ariaRoleDescription = stringFormatter.format('twoDimensionalSlider');\n\n let {visuallyHiddenProps} = useVisuallyHidden({style: {\n opacity: '0.0001',\n width: '100%',\n height: '100%',\n pointerEvents: 'none'\n }});\n\n let {\n colorAreaStyleProps,\n thumbStyleProps\n } = useColorAreaGradient({\n direction,\n state,\n xChannel,\n yChannel,\n zChannel\n });\n\n return {\n colorAreaProps: {\n ...colorAreaLabellingProps,\n ...colorAreaInteractions,\n ...colorAreaStyleProps,\n role: 'group'\n },\n thumbProps: {\n ...thumbInteractions,\n ...thumbStyleProps,\n role: 'presentation'\n },\n xInputProps: {\n ...xInputLabellingProps,\n ...visuallyHiddenProps,\n ...xInputFocusProps,\n type: 'range',\n min: state.value.getChannelRange(xChannel).minValue,\n max: state.value.getChannelRange(xChannel).maxValue,\n step: xChannelStep,\n 'aria-roledescription': ariaRoleDescription,\n 'aria-valuetext': getAriaValueTextForChannel(xChannel),\n 'aria-orientation': 'horizontal',\n 'aria-describedby': props['aria-describedby'],\n 'aria-details': props['aria-details'],\n disabled: isDisabled,\n value: state.value.getChannelValue(xChannel),\n name: xName,\n tabIndex: (isMobile || !focusedInput || focusedInput === 'x' ? undefined : -1),\n /*\n So that only a single \"2d slider\" control shows up when listing form elements for screen readers,\n add aria-hidden=\"true\" to the unfocused control when the value has not changed via the keyboard,\n but remove aria-hidden to reveal the input for each channel when the value has changed with the keyboard.\n */\n 'aria-hidden': (isMobile || !focusedInput || focusedInput === 'x' || valueChangedViaKeyboard ? undefined : 'true'),\n onChange\n },\n yInputProps: {\n ...yInputLabellingProps,\n ...visuallyHiddenProps,\n ...yInputFocusProps,\n type: 'range',\n min: state.value.getChannelRange(yChannel).minValue,\n max: state.value.getChannelRange(yChannel).maxValue,\n step: yChannelStep,\n 'aria-roledescription': ariaRoleDescription,\n 'aria-valuetext': getAriaValueTextForChannel(yChannel),\n 'aria-orientation': 'vertical',\n 'aria-describedby': props['aria-describedby'],\n 'aria-details': props['aria-details'],\n disabled: isDisabled,\n value: state.value.getChannelValue(yChannel),\n name: yName,\n tabIndex: (isMobile || focusedInput === 'y' ? undefined : -1),\n /*\n So that only a single \"2d slider\" control shows up when listing form elements for screen readers,\n add aria-hidden=\"true\" to the unfocused input when the value has not changed via the keyboard,\n but remove aria-hidden to reveal the input for each channel when the value has changed with the keyboard.\n */\n 'aria-hidden': (isMobile || focusedInput === 'y' || valueChangedViaKeyboard ? undefined : 'true'),\n onChange\n }\n };\n}\n"],"names":[],"version":3,"file":"useColorArea.module.js.map"}
1
+ {"mappings":"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","sources":["packages/@react-aria/color/src/useColorArea.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorAreaProps, ColorChannel} from '@react-types/color';\nimport {ColorAreaState} from '@react-stately/color';\nimport {DOMAttributes, RefObject} from '@react-types/shared';\nimport {focusWithoutScrolling, isAndroid, isIOS, mergeProps, useFormReset, useGlobalListeners, useLabels} from '@react-aria/utils';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport React, {ChangeEvent, InputHTMLAttributes, useCallback, useRef, useState} from 'react';\nimport {useColorAreaGradient} from './useColorAreaGradient';\nimport {useFocus, useFocusWithin, useKeyboard, useMove} from '@react-aria/interactions';\nimport {useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\nexport interface ColorAreaAria {\n /** Props for the color area container element. */\n colorAreaProps: DOMAttributes,\n /** Props for the thumb element. */\n thumbProps: DOMAttributes,\n /** Props for the visually hidden horizontal range input element. */\n xInputProps: InputHTMLAttributes<HTMLInputElement>,\n /** Props for the visually hidden vertical range input element. */\n yInputProps: InputHTMLAttributes<HTMLInputElement>\n}\n\nexport interface AriaColorAreaOptions extends AriaColorAreaProps {\n /** A ref to the input that represents the x axis of the color area. */\n inputXRef: RefObject<HTMLInputElement | null>,\n /** A ref to the input that represents the y axis of the color area. */\n inputYRef: RefObject<HTMLInputElement | null>,\n /** A ref to the color area containing element. */\n containerRef: RefObject<Element | null>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a color area component.\n * Color area allows users to adjust two channels of an RGB, HSL or HSB color value against a two-dimensional gradient background.\n */\nexport function useColorArea(props: AriaColorAreaOptions, state: ColorAreaState): ColorAreaAria {\n let {\n isDisabled,\n inputXRef,\n inputYRef,\n containerRef,\n 'aria-label': ariaLabel,\n xName,\n yName\n } = props;\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/color');\n\n let {addGlobalListener, removeGlobalListener} = useGlobalListeners();\n\n let {direction, locale} = useLocale();\n\n let [focusedInput, setFocusedInput] = useState<'x' | 'y' | null>(null);\n let focusInput = useCallback((inputRef:RefObject<HTMLInputElement | null> = inputXRef) => {\n if (inputRef.current) {\n focusWithoutScrolling(inputRef.current);\n }\n }, [inputXRef]);\n\n useFormReset(inputXRef, [state.xValue, state.yValue], ([x, y]) => {\n let newColor = state.value\n .withChannelValue(state.channels.xChannel, x)\n .withChannelValue(state.channels.yChannel, y);\n state.setValue(newColor);\n });\n\n let [valueChangedViaKeyboard, setValueChangedViaKeyboard] = useState(false);\n let [valueChangedViaInputChangeEvent, setValueChangedViaInputChangeEvent] = useState(false);\n let {xChannel, yChannel, zChannel} = state.channels;\n let xChannelStep = state.xChannelStep;\n let yChannelStep = state.yChannelStep;\n\n let currentPosition = useRef<{x: number, y: number} | null>(null);\n\n let {keyboardProps} = useKeyboard({\n onKeyDown(e) {\n // these are the cases that useMove doesn't handle\n if (!/^(PageUp|PageDown|Home|End)$/.test(e.key)) {\n e.continuePropagation();\n return;\n }\n // same handling as useMove, don't need to stop propagation, useKeyboard will do that for us\n e.preventDefault();\n // remember to set this and unset it so that onChangeEnd is fired\n state.setDragging(true);\n setValueChangedViaKeyboard(true);\n let dir;\n switch (e.key) {\n case 'PageUp':\n state.incrementY(state.yChannelPageStep);\n dir = 'y';\n break;\n case 'PageDown':\n state.decrementY(state.yChannelPageStep);\n dir = 'y';\n break;\n case 'Home':\n direction === 'rtl' ? state.incrementX(state.xChannelPageStep) : state.decrementX(state.xChannelPageStep);\n dir = 'x';\n break;\n case 'End':\n direction === 'rtl' ? state.decrementX(state.xChannelPageStep) : state.incrementX(state.xChannelPageStep);\n dir = 'x';\n break;\n }\n state.setDragging(false);\n if (dir) {\n let input = dir === 'x' ? inputXRef : inputYRef;\n focusInput(input);\n setFocusedInput(dir);\n }\n }\n });\n\n let moveHandler = {\n onMoveStart() {\n currentPosition.current = null;\n state.setDragging(true);\n },\n onMove({deltaX, deltaY, pointerType, shiftKey}) {\n let {\n incrementX,\n decrementX,\n incrementY,\n decrementY,\n xChannelPageStep,\n xChannelStep,\n yChannelPageStep,\n yChannelStep,\n getThumbPosition,\n setColorFromPoint\n } = state;\n if (currentPosition.current == null) {\n currentPosition.current = getThumbPosition();\n }\n let {width, height} = containerRef.current?.getBoundingClientRect() || {width: 0, height: 0};\n let valueChanged = deltaX !== 0 || deltaY !== 0;\n if (pointerType === 'keyboard') {\n let deltaXValue = shiftKey && xChannelPageStep > xChannelStep ? xChannelPageStep : xChannelStep;\n let deltaYValue = shiftKey && yChannelPageStep > yChannelStep ? yChannelPageStep : yChannelStep;\n if ((deltaX > 0 && direction === 'ltr') || (deltaX < 0 && direction === 'rtl')) {\n incrementX(deltaXValue);\n } else if ((deltaX < 0 && direction === 'ltr') || (deltaX > 0 && direction === 'rtl')) {\n decrementX(deltaXValue);\n } else if (deltaY > 0) {\n decrementY(deltaYValue);\n } else if (deltaY < 0) {\n incrementY(deltaYValue);\n }\n setValueChangedViaKeyboard(valueChanged);\n // set the focused input based on which axis has the greater delta\n focusedInput = valueChanged && Math.abs(deltaY) > Math.abs(deltaX) ? 'y' : 'x';\n setFocusedInput(focusedInput);\n } else {\n currentPosition.current.x += (direction === 'rtl' ? -1 : 1) * deltaX / width ;\n currentPosition.current.y += deltaY / height;\n setColorFromPoint(currentPosition.current.x, currentPosition.current.y);\n }\n },\n onMoveEnd() {\n isOnColorArea.current = false;\n state.setDragging(false);\n let input = focusedInput === 'x' ? inputXRef : inputYRef;\n focusInput(input);\n }\n };\n let {moveProps: movePropsThumb} = useMove(moveHandler);\n\n let {focusWithinProps} = useFocusWithin({\n onFocusWithinChange: (focusWithin:boolean) => {\n if (!focusWithin) {\n setValueChangedViaKeyboard(false);\n setValueChangedViaInputChangeEvent(false);\n }\n }\n });\n\n let currentPointer = useRef<number | null | undefined>(undefined);\n let isOnColorArea = useRef<boolean>(false);\n let {moveProps: movePropsContainer} = useMove({\n onMoveStart() {\n if (isOnColorArea.current) {\n moveHandler.onMoveStart();\n }\n },\n onMove(e) {\n if (isOnColorArea.current) {\n moveHandler.onMove(e);\n }\n },\n onMoveEnd() {\n if (isOnColorArea.current) {\n moveHandler.onMoveEnd();\n }\n }\n });\n\n let onThumbDown = (id: number | null | undefined) => {\n if (!state.isDragging) {\n currentPointer.current = id;\n setValueChangedViaKeyboard(false);\n focusInput();\n state.setDragging(true);\n if (typeof PointerEvent !== 'undefined') {\n addGlobalListener(window, 'pointerup', onThumbUp, false);\n } else {\n addGlobalListener(window, 'mouseup', onThumbUp, false);\n addGlobalListener(window, 'touchend', onThumbUp, false);\n }\n }\n };\n\n let onThumbUp = (e) => {\n let id = e.pointerId ?? e.changedTouches?.[0].identifier;\n if (id === currentPointer.current) {\n setValueChangedViaKeyboard(false);\n focusInput();\n state.setDragging(false);\n currentPointer.current = undefined;\n isOnColorArea.current = false;\n\n if (typeof PointerEvent !== 'undefined') {\n removeGlobalListener(window, 'pointerup', onThumbUp, false);\n } else {\n removeGlobalListener(window, 'mouseup', onThumbUp, false);\n removeGlobalListener(window, 'touchend', onThumbUp, false);\n }\n }\n };\n\n let onColorAreaDown = (colorArea: Element, id: number | null | undefined, clientX: number, clientY: number) => {\n let rect = colorArea.getBoundingClientRect();\n let {width, height} = rect;\n let x = (clientX - rect.x) / width;\n let y = (clientY - rect.y) / height;\n if (direction === 'rtl') {\n x = 1 - x;\n }\n if (x >= 0 && x <= 1 && y >= 0 && y <= 1 && !state.isDragging && currentPointer.current === undefined) {\n isOnColorArea.current = true;\n setValueChangedViaKeyboard(false);\n currentPointer.current = id;\n state.setColorFromPoint(x, y);\n\n focusInput();\n state.setDragging(true);\n\n if (typeof PointerEvent !== 'undefined') {\n addGlobalListener(window, 'pointerup', onColorAreaUp, false);\n } else {\n addGlobalListener(window, 'mouseup', onColorAreaUp, false);\n addGlobalListener(window, 'touchend', onColorAreaUp, false);\n }\n }\n };\n\n let onColorAreaUp = (e) => {\n let id = e.pointerId ?? e.changedTouches?.[0].identifier;\n if (isOnColorArea.current && id === currentPointer.current) {\n isOnColorArea.current = false;\n setValueChangedViaKeyboard(false);\n currentPointer.current = undefined;\n state.setDragging(false);\n focusInput();\n\n if (typeof PointerEvent !== 'undefined') {\n removeGlobalListener(window, 'pointerup', onColorAreaUp, false);\n } else {\n removeGlobalListener(window, 'mouseup', onColorAreaUp, false);\n removeGlobalListener(window, 'touchend', onColorAreaUp, false);\n }\n }\n };\n\n let colorAreaInteractions = isDisabled ? {} : mergeProps({\n ...(typeof PointerEvent !== 'undefined' ? {\n onPointerDown: (e: React.PointerEvent) => {\n if (e.pointerType === 'mouse' && (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey)) {\n return;\n }\n onColorAreaDown(e.currentTarget, e.pointerId, e.clientX, e.clientY);\n }} : {\n onMouseDown: (e: React.MouseEvent) => {\n if (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey) {\n return;\n }\n onColorAreaDown(e.currentTarget, undefined, e.clientX, e.clientY);\n },\n onTouchStart: (e: React.TouchEvent) => {\n onColorAreaDown(e.currentTarget, e.changedTouches[0].identifier, e.changedTouches[0].clientX, e.changedTouches[0].clientY);\n }\n })\n }, movePropsContainer);\n\n let thumbInteractions = isDisabled ? {} : mergeProps({\n ...(typeof PointerEvent !== 'undefined' ? {\n onPointerDown: (e: React.PointerEvent) => {\n if (e.pointerType === 'mouse' && (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey)) {\n return;\n }\n onThumbDown(e.pointerId);\n }} : {\n onMouseDown: (e: React.MouseEvent) => {\n if (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey) {\n return;\n }\n onThumbDown(undefined);\n },\n onTouchStart: (e: React.TouchEvent) => {\n onThumbDown(e.changedTouches[0].identifier);\n }\n })\n }, focusWithinProps, keyboardProps, movePropsThumb);\n\n let {focusProps: xInputFocusProps} = useFocus({\n onFocus: () => {\n setFocusedInput('x');\n }\n });\n\n let {focusProps: yInputFocusProps} = useFocus({\n onFocus: () => {\n setFocusedInput('y');\n }\n });\n\n const onChange = (e: ChangeEvent<HTMLInputElement>) => {\n const {target} = e;\n setValueChangedViaInputChangeEvent(true);\n if (target === inputXRef.current) {\n state.setXValue(parseFloat(target.value));\n } else if (target === inputYRef.current) {\n state.setYValue(parseFloat(target.value));\n }\n };\n\n let isMobile = isIOS() || isAndroid();\n\n let value = state.getDisplayColor();\n const getAriaValueTextForChannel = useCallback((channel:ColorChannel) => {\n const isAfterInput = valueChangedViaInputChangeEvent || valueChangedViaKeyboard;\n return `${\n isAfterInput ?\n stringFormatter.format('colorNameAndValue', {name: value.getChannelName(channel, locale), value: value.formatChannelValue(channel, locale)})\n :\n [\n stringFormatter.format('colorNameAndValue', {name: value.getChannelName(channel, locale), value: value.formatChannelValue(channel, locale)}),\n stringFormatter.format('colorNameAndValue', {name: value.getChannelName(channel === yChannel ? xChannel : yChannel, locale), value: value.formatChannelValue(channel === yChannel ? xChannel : yChannel, locale)}),\n stringFormatter.format('colorNameAndValue', {name: value.getChannelName(zChannel, locale), value: value.formatChannelValue(zChannel, locale)})\n ].join(', ')\n }, ${value.getColorName(locale)}`;\n }, [locale, value, stringFormatter, valueChangedViaInputChangeEvent, valueChangedViaKeyboard, xChannel, yChannel, zChannel]);\n\n let colorPickerLabel = stringFormatter.format('colorPicker');\n\n let xInputLabellingProps = useLabels({\n ...props,\n 'aria-label': ariaLabel ? stringFormatter.format('colorInputLabel', {label: ariaLabel, channelLabel: colorPickerLabel}) : colorPickerLabel\n });\n\n let yInputLabellingProps = useLabels({\n ...props,\n 'aria-label': ariaLabel ? stringFormatter.format('colorInputLabel', {label: ariaLabel, channelLabel: colorPickerLabel}) : colorPickerLabel\n });\n\n let colorAreaLabellingProps = useLabels(\n {\n ...props,\n 'aria-label': ariaLabel ? `${ariaLabel}, ${colorPickerLabel}` : undefined\n },\n isMobile ? colorPickerLabel : undefined\n );\n\n let ariaRoleDescription = stringFormatter.format('twoDimensionalSlider');\n\n let {visuallyHiddenProps} = useVisuallyHidden({style: {\n opacity: '0.0001',\n width: '100%',\n height: '100%',\n pointerEvents: 'none'\n }});\n\n let {\n colorAreaStyleProps,\n thumbStyleProps\n } = useColorAreaGradient({\n direction,\n state,\n xChannel,\n yChannel,\n zChannel\n });\n\n return {\n colorAreaProps: {\n ...colorAreaLabellingProps,\n ...colorAreaInteractions,\n ...colorAreaStyleProps,\n role: 'group'\n },\n thumbProps: {\n ...thumbInteractions,\n ...thumbStyleProps,\n role: 'presentation'\n },\n xInputProps: {\n ...xInputLabellingProps,\n ...visuallyHiddenProps,\n ...xInputFocusProps,\n type: 'range',\n min: state.value.getChannelRange(xChannel).minValue,\n max: state.value.getChannelRange(xChannel).maxValue,\n step: xChannelStep,\n 'aria-roledescription': ariaRoleDescription,\n 'aria-valuetext': getAriaValueTextForChannel(xChannel),\n 'aria-orientation': 'horizontal',\n 'aria-describedby': props['aria-describedby'],\n 'aria-details': props['aria-details'],\n disabled: isDisabled,\n value: state.value.getChannelValue(xChannel),\n name: xName,\n tabIndex: (isMobile || !focusedInput || focusedInput === 'x' ? undefined : -1),\n /*\n So that only a single \"2d slider\" control shows up when listing form elements for screen readers,\n add aria-hidden=\"true\" to the unfocused control when the value has not changed via the keyboard,\n but remove aria-hidden to reveal the input for each channel when the value has changed with the keyboard.\n */\n 'aria-hidden': (isMobile || !focusedInput || focusedInput === 'x' || valueChangedViaKeyboard ? undefined : 'true'),\n onChange\n },\n yInputProps: {\n ...yInputLabellingProps,\n ...visuallyHiddenProps,\n ...yInputFocusProps,\n type: 'range',\n min: state.value.getChannelRange(yChannel).minValue,\n max: state.value.getChannelRange(yChannel).maxValue,\n step: yChannelStep,\n 'aria-roledescription': ariaRoleDescription,\n 'aria-valuetext': getAriaValueTextForChannel(yChannel),\n 'aria-orientation': 'vertical',\n 'aria-describedby': props['aria-describedby'],\n 'aria-details': props['aria-details'],\n disabled: isDisabled,\n value: state.value.getChannelValue(yChannel),\n name: yName,\n tabIndex: (isMobile || focusedInput === 'y' ? undefined : -1),\n /*\n So that only a single \"2d slider\" control shows up when listing form elements for screen readers,\n add aria-hidden=\"true\" to the unfocused input when the value has not changed via the keyboard,\n but remove aria-hidden to reveal the input for each channel when the value has changed with the keyboard.\n */\n 'aria-hidden': (isMobile || focusedInput === 'y' || valueChangedViaKeyboard ? undefined : 'true'),\n onChange\n }\n };\n}\n"],"names":[],"version":3,"file":"useColorArea.module.js.map"}
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-aria/color/src/useColorAreaGradient.ts"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n*/\n\nimport {Color} from '@react-types/color';\nimport {CSSProperties, useMemo} from 'react';\nimport {parseColor} from '@react-stately/color';\n\nconst hue = (color: Color) => [0, 60, 120, 180, 240, 300, 360].map(hue => color.withChannelValue('hue', hue).toString('css')).join(', ');\nconst saturation = (color: Color) => `${color.withChannelValue('saturation', 0)}, transparent`;\n\nconst hslChannels = {\n hue,\n saturation,\n lightness: () => 'black, transparent, white'\n};\n\nconst hsbChannels = {\n hue,\n saturation,\n brightness: () => 'black, transparent'\n};\n\ninterface Gradients {\n colorAreaStyleProps: {\n style: CSSProperties\n },\n thumbStyleProps: {\n style: CSSProperties\n }\n}\n\nexport function useColorAreaGradient({direction, state, zChannel, xChannel, yChannel}): Gradients {\n let returnVal = useMemo<Gradients>(() => {\n let end = direction === 'rtl' ? 'left' : 'right';\n let colorAreaStyles = {};\n let zValue = state.value.getChannelValue(zChannel);\n\n switch (state.value.getColorSpace()) {\n case 'rgb': {\n let rgb = parseColor('rgb(0, 0, 0)');\n colorAreaStyles = {\n background: [\n // The screen blend mode multiplies the inverse of each channel, e.g. 1 - (1 - a) * (1 - b).\n // Create a layer for each channel, with the other channels as 0. After blending, this should\n // result in the gradients being combined channel by channel.\n `linear-gradient(to ${end}, ${rgb.withChannelValue(xChannel, 0)}, ${rgb.withChannelValue(xChannel, 255)})`,\n `linear-gradient(to top, ${rgb.withChannelValue(yChannel, 0)}, ${rgb.withChannelValue(yChannel, 255)})`,\n rgb.withChannelValue(zChannel, zValue)\n ].join(','),\n backgroundBlendMode: 'screen'\n };\n break;\n }\n case 'hsl': {\n let channels = state.value.getColorChannels();\n let value = parseColor('hsl(0, 100%, 50%)').withChannelValue(zChannel, zValue);\n\n let bg = channels\n .filter(c => c !== zChannel)\n .map(c => `linear-gradient(to ${c === xChannel ? end : 'top'}, ${hslChannels[c](value)})`)\n .reverse();\n if (zChannel === 'hue') {\n bg.push(value.toString('css'));\n }\n \n colorAreaStyles = {\n background: bg.join(', ')\n };\n break;\n }\n case 'hsb': {\n let channels = state.value.getColorChannels();\n let value = parseColor('hsb(0, 100%, 100%)').withChannelValue(zChannel, zValue);\n\n let bg = channels\n .filter(c => c !== zChannel)\n .map(c => `linear-gradient(to ${c === xChannel ? end : 'top'}, ${hsbChannels[c](value)})`)\n .reverse();\n if (zChannel === 'hue') {\n bg.push(value.toString('css'));\n }\n \n colorAreaStyles = {\n background: bg.join(', ')\n };\n break;\n }\n }\n\n let {x, y} = state.getThumbPosition();\n\n if (direction === 'rtl') {\n x = 1 - x;\n }\n\n let forcedColorAdjustNoneStyle = {forcedColorAdjust: 'none'};\n\n return {\n colorAreaStyleProps: {\n style: {\n position: 'relative',\n touchAction: 'none',\n ...forcedColorAdjustNoneStyle,\n ...colorAreaStyles\n }\n },\n thumbStyleProps: {\n style: {\n position: 'absolute',\n left: `${x * 100}%`,\n top: `${y * 100}%`,\n transform: 'translate(-50%, -50%)',\n touchAction: 'none',\n ...forcedColorAdjustNoneStyle\n }\n }\n };\n }, [direction, state, zChannel, xChannel, yChannel]);\n\n return returnVal;\n}\n\n"],"names":[],"version":3,"file":"useColorAreaGradient.main.js.map"}
1
+ {"mappings":"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","sources":["packages/@react-aria/color/src/useColorAreaGradient.ts"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n*/\n\nimport {Color} from '@react-types/color';\nimport {CSSProperties, useMemo} from 'react';\nimport {parseColor} from '@react-stately/color';\n\nconst hue = (color: Color) => [0, 60, 120, 180, 240, 300, 360].map(hue => color.withChannelValue('hue', hue).toString('css')).join(', ');\nconst saturation = (color: Color) => `${color.withChannelValue('saturation', 0)}, transparent`;\n\nconst hslChannels = {\n hue,\n saturation,\n lightness: () => 'black, transparent, white'\n};\n\nconst hsbChannels = {\n hue,\n saturation,\n brightness: () => 'black, transparent'\n};\n\ninterface Gradients {\n colorAreaStyleProps: {\n style: CSSProperties\n },\n thumbStyleProps: {\n style: CSSProperties\n }\n}\n\nexport function useColorAreaGradient({direction, state, zChannel, xChannel, yChannel}): Gradients {\n let returnVal = useMemo<Gradients>(() => {\n let end = direction === 'rtl' ? 'left' : 'right';\n let colorAreaStyles = {};\n let zValue = state.value.getChannelValue(zChannel);\n\n switch (state.value.getColorSpace()) {\n case 'rgb': {\n let rgb = parseColor('rgb(0, 0, 0)');\n colorAreaStyles = {\n background: [\n // The screen blend mode multiplies the inverse of each channel, e.g. 1 - (1 - a) * (1 - b).\n // Create a layer for each channel, with the other channels as 0. After blending, this should\n // result in the gradients being combined channel by channel.\n `linear-gradient(to ${end}, ${rgb.withChannelValue(xChannel, 0)}, ${rgb.withChannelValue(xChannel, 255)})`,\n `linear-gradient(to top, ${rgb.withChannelValue(yChannel, 0)}, ${rgb.withChannelValue(yChannel, 255)})`,\n rgb.withChannelValue(zChannel, zValue)\n ].join(','),\n backgroundBlendMode: 'screen'\n };\n break;\n }\n case 'hsl': {\n let channels = state.value.getColorChannels();\n let value = parseColor('hsl(0, 100%, 50%)').withChannelValue(zChannel, zValue);\n\n let bg = channels\n .filter(c => c !== zChannel)\n .map(c => `linear-gradient(to ${c === xChannel ? end : 'top'}, ${hslChannels[c](value)})`)\n .reverse();\n if (zChannel === 'hue') {\n bg.push(value.toString('css'));\n }\n \n colorAreaStyles = {\n background: bg.join(', ')\n };\n break;\n }\n case 'hsb': {\n let channels = state.value.getColorChannels();\n let value = parseColor('hsb(0, 100%, 100%)').withChannelValue(zChannel, zValue);\n\n let bg = channels\n .filter(c => c !== zChannel)\n .map(c => `linear-gradient(to ${c === xChannel ? end : 'top'}, ${hsbChannels[c](value)})`)\n .reverse();\n if (zChannel === 'hue') {\n bg.push(value.toString('css'));\n }\n \n colorAreaStyles = {\n background: bg.join(', ')\n };\n break;\n }\n }\n\n let {x, y} = state.getThumbPosition();\n\n if (direction === 'rtl') {\n x = 1 - x;\n }\n\n let forcedColorAdjustNoneStyle = {forcedColorAdjust: 'none'};\n\n return {\n colorAreaStyleProps: {\n style: {\n position: 'relative',\n touchAction: 'none',\n ...forcedColorAdjustNoneStyle,\n ...colorAreaStyles\n }\n },\n thumbStyleProps: {\n style: {\n position: 'absolute',\n left: `${x * 100}%`,\n top: `${y * 100}%`,\n transform: 'translate(-50%, -50%)',\n touchAction: 'none',\n ...forcedColorAdjustNoneStyle\n }\n }\n };\n }, [direction, state, zChannel, xChannel, yChannel]);\n\n return returnVal;\n}\n\n"],"names":[],"version":3,"file":"useColorAreaGradient.main.js.map"}
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-aria/color/src/useColorAreaGradient.ts"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n*/\n\nimport {Color} from '@react-types/color';\nimport {CSSProperties, useMemo} from 'react';\nimport {parseColor} from '@react-stately/color';\n\nconst hue = (color: Color) => [0, 60, 120, 180, 240, 300, 360].map(hue => color.withChannelValue('hue', hue).toString('css')).join(', ');\nconst saturation = (color: Color) => `${color.withChannelValue('saturation', 0)}, transparent`;\n\nconst hslChannels = {\n hue,\n saturation,\n lightness: () => 'black, transparent, white'\n};\n\nconst hsbChannels = {\n hue,\n saturation,\n brightness: () => 'black, transparent'\n};\n\ninterface Gradients {\n colorAreaStyleProps: {\n style: CSSProperties\n },\n thumbStyleProps: {\n style: CSSProperties\n }\n}\n\nexport function useColorAreaGradient({direction, state, zChannel, xChannel, yChannel}): Gradients {\n let returnVal = useMemo<Gradients>(() => {\n let end = direction === 'rtl' ? 'left' : 'right';\n let colorAreaStyles = {};\n let zValue = state.value.getChannelValue(zChannel);\n\n switch (state.value.getColorSpace()) {\n case 'rgb': {\n let rgb = parseColor('rgb(0, 0, 0)');\n colorAreaStyles = {\n background: [\n // The screen blend mode multiplies the inverse of each channel, e.g. 1 - (1 - a) * (1 - b).\n // Create a layer for each channel, with the other channels as 0. After blending, this should\n // result in the gradients being combined channel by channel.\n `linear-gradient(to ${end}, ${rgb.withChannelValue(xChannel, 0)}, ${rgb.withChannelValue(xChannel, 255)})`,\n `linear-gradient(to top, ${rgb.withChannelValue(yChannel, 0)}, ${rgb.withChannelValue(yChannel, 255)})`,\n rgb.withChannelValue(zChannel, zValue)\n ].join(','),\n backgroundBlendMode: 'screen'\n };\n break;\n }\n case 'hsl': {\n let channels = state.value.getColorChannels();\n let value = parseColor('hsl(0, 100%, 50%)').withChannelValue(zChannel, zValue);\n\n let bg = channels\n .filter(c => c !== zChannel)\n .map(c => `linear-gradient(to ${c === xChannel ? end : 'top'}, ${hslChannels[c](value)})`)\n .reverse();\n if (zChannel === 'hue') {\n bg.push(value.toString('css'));\n }\n \n colorAreaStyles = {\n background: bg.join(', ')\n };\n break;\n }\n case 'hsb': {\n let channels = state.value.getColorChannels();\n let value = parseColor('hsb(0, 100%, 100%)').withChannelValue(zChannel, zValue);\n\n let bg = channels\n .filter(c => c !== zChannel)\n .map(c => `linear-gradient(to ${c === xChannel ? end : 'top'}, ${hsbChannels[c](value)})`)\n .reverse();\n if (zChannel === 'hue') {\n bg.push(value.toString('css'));\n }\n \n colorAreaStyles = {\n background: bg.join(', ')\n };\n break;\n }\n }\n\n let {x, y} = state.getThumbPosition();\n\n if (direction === 'rtl') {\n x = 1 - x;\n }\n\n let forcedColorAdjustNoneStyle = {forcedColorAdjust: 'none'};\n\n return {\n colorAreaStyleProps: {\n style: {\n position: 'relative',\n touchAction: 'none',\n ...forcedColorAdjustNoneStyle,\n ...colorAreaStyles\n }\n },\n thumbStyleProps: {\n style: {\n position: 'absolute',\n left: `${x * 100}%`,\n top: `${y * 100}%`,\n transform: 'translate(-50%, -50%)',\n touchAction: 'none',\n ...forcedColorAdjustNoneStyle\n }\n }\n };\n }, [direction, state, zChannel, xChannel, yChannel]);\n\n return returnVal;\n}\n\n"],"names":[],"version":3,"file":"useColorAreaGradient.module.js.map"}
1
+ {"mappings":"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","sources":["packages/@react-aria/color/src/useColorAreaGradient.ts"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n*/\n\nimport {Color} from '@react-types/color';\nimport {CSSProperties, useMemo} from 'react';\nimport {parseColor} from '@react-stately/color';\n\nconst hue = (color: Color) => [0, 60, 120, 180, 240, 300, 360].map(hue => color.withChannelValue('hue', hue).toString('css')).join(', ');\nconst saturation = (color: Color) => `${color.withChannelValue('saturation', 0)}, transparent`;\n\nconst hslChannels = {\n hue,\n saturation,\n lightness: () => 'black, transparent, white'\n};\n\nconst hsbChannels = {\n hue,\n saturation,\n brightness: () => 'black, transparent'\n};\n\ninterface Gradients {\n colorAreaStyleProps: {\n style: CSSProperties\n },\n thumbStyleProps: {\n style: CSSProperties\n }\n}\n\nexport function useColorAreaGradient({direction, state, zChannel, xChannel, yChannel}): Gradients {\n let returnVal = useMemo<Gradients>(() => {\n let end = direction === 'rtl' ? 'left' : 'right';\n let colorAreaStyles = {};\n let zValue = state.value.getChannelValue(zChannel);\n\n switch (state.value.getColorSpace()) {\n case 'rgb': {\n let rgb = parseColor('rgb(0, 0, 0)');\n colorAreaStyles = {\n background: [\n // The screen blend mode multiplies the inverse of each channel, e.g. 1 - (1 - a) * (1 - b).\n // Create a layer for each channel, with the other channels as 0. After blending, this should\n // result in the gradients being combined channel by channel.\n `linear-gradient(to ${end}, ${rgb.withChannelValue(xChannel, 0)}, ${rgb.withChannelValue(xChannel, 255)})`,\n `linear-gradient(to top, ${rgb.withChannelValue(yChannel, 0)}, ${rgb.withChannelValue(yChannel, 255)})`,\n rgb.withChannelValue(zChannel, zValue)\n ].join(','),\n backgroundBlendMode: 'screen'\n };\n break;\n }\n case 'hsl': {\n let channels = state.value.getColorChannels();\n let value = parseColor('hsl(0, 100%, 50%)').withChannelValue(zChannel, zValue);\n\n let bg = channels\n .filter(c => c !== zChannel)\n .map(c => `linear-gradient(to ${c === xChannel ? end : 'top'}, ${hslChannels[c](value)})`)\n .reverse();\n if (zChannel === 'hue') {\n bg.push(value.toString('css'));\n }\n \n colorAreaStyles = {\n background: bg.join(', ')\n };\n break;\n }\n case 'hsb': {\n let channels = state.value.getColorChannels();\n let value = parseColor('hsb(0, 100%, 100%)').withChannelValue(zChannel, zValue);\n\n let bg = channels\n .filter(c => c !== zChannel)\n .map(c => `linear-gradient(to ${c === xChannel ? end : 'top'}, ${hsbChannels[c](value)})`)\n .reverse();\n if (zChannel === 'hue') {\n bg.push(value.toString('css'));\n }\n \n colorAreaStyles = {\n background: bg.join(', ')\n };\n break;\n }\n }\n\n let {x, y} = state.getThumbPosition();\n\n if (direction === 'rtl') {\n x = 1 - x;\n }\n\n let forcedColorAdjustNoneStyle = {forcedColorAdjust: 'none'};\n\n return {\n colorAreaStyleProps: {\n style: {\n position: 'relative',\n touchAction: 'none',\n ...forcedColorAdjustNoneStyle,\n ...colorAreaStyles\n }\n },\n thumbStyleProps: {\n style: {\n position: 'absolute',\n left: `${x * 100}%`,\n top: `${y * 100}%`,\n transform: 'translate(-50%, -50%)',\n touchAction: 'none',\n ...forcedColorAdjustNoneStyle\n }\n }\n };\n }, [direction, state, zChannel, xChannel, yChannel]);\n\n return returnVal;\n}\n\n"],"names":[],"version":3,"file":"useColorAreaGradient.module.js.map"}
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-aria/color/src/useColorSlider.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorSliderProps} from '@react-types/color';\nimport {ColorSliderState} from '@react-stately/color';\nimport {DOMAttributes, RefObject} from '@react-types/shared';\nimport {InputHTMLAttributes} from 'react';\nimport {mergeProps} from '@react-aria/utils';\nimport {useLocale} from '@react-aria/i18n';\nimport {useSlider, useSliderThumb} from '@react-aria/slider';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\nexport interface AriaColorSliderOptions extends AriaColorSliderProps {\n /** A ref for the track element. */\n trackRef: RefObject<Element | null>,\n /** A ref for the input element. */\n inputRef: RefObject<HTMLInputElement | null>\n}\n\nexport interface ColorSliderAria {\n /** Props for the label element. */\n labelProps: DOMAttributes,\n /** Props for the track element. */\n trackProps: DOMAttributes,\n /** Props for the thumb element. */\n thumbProps: DOMAttributes,\n /** Props for the visually hidden range input element. */\n inputProps: InputHTMLAttributes<HTMLInputElement>,\n /** Props for the output element, displaying the value of the color slider. */\n outputProps: DOMAttributes\n}\n\n/**\n * Provides the behavior and accessibility implementation for a color slider component.\n * Color sliders allow users to adjust an individual channel of a color value.\n */\nexport function useColorSlider(props: AriaColorSliderOptions, state: ColorSliderState): ColorSliderAria {\n let {trackRef, inputRef, orientation, channel, 'aria-label': ariaLabel, name} = props;\n\n let {locale, direction} = useLocale();\n\n // Provide a default aria-label if there is no other label provided.\n if (!props.label && !ariaLabel && !props['aria-labelledby']) {\n ariaLabel = state.value.getChannelName(channel, locale);\n }\n\n // @ts-ignore - ignore unused incompatible props\n let {groupProps, trackProps, labelProps, outputProps} = useSlider({...props, 'aria-label': ariaLabel}, state, trackRef);\n let {inputProps, thumbProps} = useSliderThumb({\n index: 0,\n orientation,\n isDisabled: props.isDisabled,\n name,\n trackRef,\n inputRef\n }, state);\n\n let value = state.getDisplayColor();\n let generateBackground = () => {\n let to: string;\n if (orientation === 'vertical') {\n to = 'top';\n } else if (direction === 'ltr') {\n to = 'right';\n } else {\n to = 'left';\n }\n switch (channel) {\n case 'hue': {\n let stops = [0, 60, 120, 180, 240, 300, 360].map(hue => value.withChannelValue('hue', hue).toString('css')).join(', ');\n return `linear-gradient(to ${to}, ${stops})`;\n }\n case 'lightness': {\n // We have to add an extra color stop in the middle so that the hue shows up at all.\n // Otherwise it will always just be black to white.\n let min = state.getThumbMinValue(0);\n let max = state.getThumbMaxValue(0);\n let start = value.withChannelValue(channel, min).toString('css');\n let middle = value.withChannelValue(channel, (max - min) / 2).toString('css');\n let end = value.withChannelValue(channel, max).toString('css');\n return `linear-gradient(to ${to}, ${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, state.getThumbMinValue(0)).toString('css');\n let end = value.withChannelValue(channel, state.getThumbMaxValue(0)).toString('css');\n return `linear-gradient(to ${to}, ${start}, ${end})`;\n }\n default:\n throw new Error('Unknown color channel: ' + channel);\n }\n };\n\n let forcedColorAdjustNoneStyle = {forcedColorAdjust: 'none'};\n\n if (channel === 'hue') {\n inputProps['aria-valuetext'] += `, ${value.getHueName(locale)}`;\n } else if (channel !== 'alpha') {\n inputProps['aria-valuetext'] += `, ${value.getColorName(locale)}`;\n }\n\n let {visuallyHiddenProps} = useVisuallyHidden({\n style: {\n opacity: '0.0001',\n width: '100%',\n height: '100%',\n pointerEvents: 'none'\n }\n });\n\n return {\n trackProps: {\n ...mergeProps(groupProps, trackProps),\n style: {\n ...trackProps.style,\n ...forcedColorAdjustNoneStyle,\n background: generateBackground()\n }\n },\n inputProps: {\n ...inputProps,\n style: {\n ...inputProps.style,\n ...visuallyHiddenProps.style\n }\n },\n thumbProps: {\n ...thumbProps,\n style: {\n ...thumbProps.style,\n ...forcedColorAdjustNoneStyle\n }\n },\n labelProps,\n outputProps\n };\n}\n"],"names":[],"version":3,"file":"useColorSlider.main.js.map"}
1
+ {"mappings":"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","sources":["packages/@react-aria/color/src/useColorSlider.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorSliderProps} from '@react-types/color';\nimport {ColorSliderState} from '@react-stately/color';\nimport {DOMAttributes, RefObject} from '@react-types/shared';\nimport {InputHTMLAttributes} from 'react';\nimport {mergeProps} from '@react-aria/utils';\nimport {useLocale} from '@react-aria/i18n';\nimport {useSlider, useSliderThumb} from '@react-aria/slider';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\nexport interface AriaColorSliderOptions extends AriaColorSliderProps {\n /** A ref for the track element. */\n trackRef: RefObject<Element | null>,\n /** A ref for the input element. */\n inputRef: RefObject<HTMLInputElement | null>\n}\n\nexport interface ColorSliderAria {\n /** Props for the label element. */\n labelProps: DOMAttributes,\n /** Props for the track element. */\n trackProps: DOMAttributes,\n /** Props for the thumb element. */\n thumbProps: DOMAttributes,\n /** Props for the visually hidden range input element. */\n inputProps: InputHTMLAttributes<HTMLInputElement>,\n /** Props for the output element, displaying the value of the color slider. */\n outputProps: DOMAttributes\n}\n\n/**\n * Provides the behavior and accessibility implementation for a color slider component.\n * Color sliders allow users to adjust an individual channel of a color value.\n */\nexport function useColorSlider(props: AriaColorSliderOptions, state: ColorSliderState): ColorSliderAria {\n let {trackRef, inputRef, orientation, channel, 'aria-label': ariaLabel, name} = props;\n\n let {locale, direction} = useLocale();\n\n // Provide a default aria-label if there is no other label provided.\n if (!props.label && !ariaLabel && !props['aria-labelledby']) {\n ariaLabel = state.value.getChannelName(channel, locale);\n }\n\n // @ts-ignore - ignore unused incompatible props\n let {groupProps, trackProps, labelProps, outputProps} = useSlider({...props, 'aria-label': ariaLabel}, state, trackRef);\n let {inputProps, thumbProps} = useSliderThumb({\n index: 0,\n orientation,\n isDisabled: props.isDisabled,\n name,\n trackRef,\n inputRef\n }, state);\n\n let value = state.getDisplayColor();\n let generateBackground = () => {\n let to: string;\n if (orientation === 'vertical') {\n to = 'top';\n } else if (direction === 'ltr') {\n to = 'right';\n } else {\n to = 'left';\n }\n switch (channel) {\n case 'hue': {\n let stops = [0, 60, 120, 180, 240, 300, 360].map(hue => value.withChannelValue('hue', hue).toString('css')).join(', ');\n return `linear-gradient(to ${to}, ${stops})`;\n }\n case 'lightness': {\n // We have to add an extra color stop in the middle so that the hue shows up at all.\n // Otherwise it will always just be black to white.\n let min = state.getThumbMinValue(0);\n let max = state.getThumbMaxValue(0);\n let start = value.withChannelValue(channel, min).toString('css');\n let middle = value.withChannelValue(channel, (max - min) / 2).toString('css');\n let end = value.withChannelValue(channel, max).toString('css');\n return `linear-gradient(to ${to}, ${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, state.getThumbMinValue(0)).toString('css');\n let end = value.withChannelValue(channel, state.getThumbMaxValue(0)).toString('css');\n return `linear-gradient(to ${to}, ${start}, ${end})`;\n }\n default:\n throw new Error('Unknown color channel: ' + channel);\n }\n };\n\n let forcedColorAdjustNoneStyle = {forcedColorAdjust: 'none'};\n\n if (channel === 'hue') {\n inputProps['aria-valuetext'] += `, ${value.getHueName(locale)}`;\n } else if (channel !== 'alpha') {\n inputProps['aria-valuetext'] += `, ${value.getColorName(locale)}`;\n }\n\n let {visuallyHiddenProps} = useVisuallyHidden({\n style: {\n opacity: '0.0001',\n width: '100%',\n height: '100%',\n pointerEvents: 'none'\n }\n });\n\n return {\n trackProps: {\n ...mergeProps(groupProps, trackProps),\n style: {\n ...trackProps.style,\n ...forcedColorAdjustNoneStyle,\n background: generateBackground()\n }\n },\n inputProps: {\n ...inputProps,\n style: {\n ...inputProps.style,\n ...visuallyHiddenProps.style\n }\n },\n thumbProps: {\n ...thumbProps,\n style: {\n ...thumbProps.style,\n ...forcedColorAdjustNoneStyle\n }\n },\n labelProps,\n outputProps\n };\n}\n"],"names":[],"version":3,"file":"useColorSlider.main.js.map"}
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-aria/color/src/useColorSlider.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorSliderProps} from '@react-types/color';\nimport {ColorSliderState} from '@react-stately/color';\nimport {DOMAttributes, RefObject} from '@react-types/shared';\nimport {InputHTMLAttributes} from 'react';\nimport {mergeProps} from '@react-aria/utils';\nimport {useLocale} from '@react-aria/i18n';\nimport {useSlider, useSliderThumb} from '@react-aria/slider';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\nexport interface AriaColorSliderOptions extends AriaColorSliderProps {\n /** A ref for the track element. */\n trackRef: RefObject<Element | null>,\n /** A ref for the input element. */\n inputRef: RefObject<HTMLInputElement | null>\n}\n\nexport interface ColorSliderAria {\n /** Props for the label element. */\n labelProps: DOMAttributes,\n /** Props for the track element. */\n trackProps: DOMAttributes,\n /** Props for the thumb element. */\n thumbProps: DOMAttributes,\n /** Props for the visually hidden range input element. */\n inputProps: InputHTMLAttributes<HTMLInputElement>,\n /** Props for the output element, displaying the value of the color slider. */\n outputProps: DOMAttributes\n}\n\n/**\n * Provides the behavior and accessibility implementation for a color slider component.\n * Color sliders allow users to adjust an individual channel of a color value.\n */\nexport function useColorSlider(props: AriaColorSliderOptions, state: ColorSliderState): ColorSliderAria {\n let {trackRef, inputRef, orientation, channel, 'aria-label': ariaLabel, name} = props;\n\n let {locale, direction} = useLocale();\n\n // Provide a default aria-label if there is no other label provided.\n if (!props.label && !ariaLabel && !props['aria-labelledby']) {\n ariaLabel = state.value.getChannelName(channel, locale);\n }\n\n // @ts-ignore - ignore unused incompatible props\n let {groupProps, trackProps, labelProps, outputProps} = useSlider({...props, 'aria-label': ariaLabel}, state, trackRef);\n let {inputProps, thumbProps} = useSliderThumb({\n index: 0,\n orientation,\n isDisabled: props.isDisabled,\n name,\n trackRef,\n inputRef\n }, state);\n\n let value = state.getDisplayColor();\n let generateBackground = () => {\n let to: string;\n if (orientation === 'vertical') {\n to = 'top';\n } else if (direction === 'ltr') {\n to = 'right';\n } else {\n to = 'left';\n }\n switch (channel) {\n case 'hue': {\n let stops = [0, 60, 120, 180, 240, 300, 360].map(hue => value.withChannelValue('hue', hue).toString('css')).join(', ');\n return `linear-gradient(to ${to}, ${stops})`;\n }\n case 'lightness': {\n // We have to add an extra color stop in the middle so that the hue shows up at all.\n // Otherwise it will always just be black to white.\n let min = state.getThumbMinValue(0);\n let max = state.getThumbMaxValue(0);\n let start = value.withChannelValue(channel, min).toString('css');\n let middle = value.withChannelValue(channel, (max - min) / 2).toString('css');\n let end = value.withChannelValue(channel, max).toString('css');\n return `linear-gradient(to ${to}, ${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, state.getThumbMinValue(0)).toString('css');\n let end = value.withChannelValue(channel, state.getThumbMaxValue(0)).toString('css');\n return `linear-gradient(to ${to}, ${start}, ${end})`;\n }\n default:\n throw new Error('Unknown color channel: ' + channel);\n }\n };\n\n let forcedColorAdjustNoneStyle = {forcedColorAdjust: 'none'};\n\n if (channel === 'hue') {\n inputProps['aria-valuetext'] += `, ${value.getHueName(locale)}`;\n } else if (channel !== 'alpha') {\n inputProps['aria-valuetext'] += `, ${value.getColorName(locale)}`;\n }\n\n let {visuallyHiddenProps} = useVisuallyHidden({\n style: {\n opacity: '0.0001',\n width: '100%',\n height: '100%',\n pointerEvents: 'none'\n }\n });\n\n return {\n trackProps: {\n ...mergeProps(groupProps, trackProps),\n style: {\n ...trackProps.style,\n ...forcedColorAdjustNoneStyle,\n background: generateBackground()\n }\n },\n inputProps: {\n ...inputProps,\n style: {\n ...inputProps.style,\n ...visuallyHiddenProps.style\n }\n },\n thumbProps: {\n ...thumbProps,\n style: {\n ...thumbProps.style,\n ...forcedColorAdjustNoneStyle\n }\n },\n labelProps,\n outputProps\n };\n}\n"],"names":[],"version":3,"file":"useColorSlider.module.js.map"}
1
+ {"mappings":"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","sources":["packages/@react-aria/color/src/useColorSlider.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaColorSliderProps} from '@react-types/color';\nimport {ColorSliderState} from '@react-stately/color';\nimport {DOMAttributes, RefObject} from '@react-types/shared';\nimport {InputHTMLAttributes} from 'react';\nimport {mergeProps} from '@react-aria/utils';\nimport {useLocale} from '@react-aria/i18n';\nimport {useSlider, useSliderThumb} from '@react-aria/slider';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\nexport interface AriaColorSliderOptions extends AriaColorSliderProps {\n /** A ref for the track element. */\n trackRef: RefObject<Element | null>,\n /** A ref for the input element. */\n inputRef: RefObject<HTMLInputElement | null>\n}\n\nexport interface ColorSliderAria {\n /** Props for the label element. */\n labelProps: DOMAttributes,\n /** Props for the track element. */\n trackProps: DOMAttributes,\n /** Props for the thumb element. */\n thumbProps: DOMAttributes,\n /** Props for the visually hidden range input element. */\n inputProps: InputHTMLAttributes<HTMLInputElement>,\n /** Props for the output element, displaying the value of the color slider. */\n outputProps: DOMAttributes\n}\n\n/**\n * Provides the behavior and accessibility implementation for a color slider component.\n * Color sliders allow users to adjust an individual channel of a color value.\n */\nexport function useColorSlider(props: AriaColorSliderOptions, state: ColorSliderState): ColorSliderAria {\n let {trackRef, inputRef, orientation, channel, 'aria-label': ariaLabel, name} = props;\n\n let {locale, direction} = useLocale();\n\n // Provide a default aria-label if there is no other label provided.\n if (!props.label && !ariaLabel && !props['aria-labelledby']) {\n ariaLabel = state.value.getChannelName(channel, locale);\n }\n\n // @ts-ignore - ignore unused incompatible props\n let {groupProps, trackProps, labelProps, outputProps} = useSlider({...props, 'aria-label': ariaLabel}, state, trackRef);\n let {inputProps, thumbProps} = useSliderThumb({\n index: 0,\n orientation,\n isDisabled: props.isDisabled,\n name,\n trackRef,\n inputRef\n }, state);\n\n let value = state.getDisplayColor();\n let generateBackground = () => {\n let to: string;\n if (orientation === 'vertical') {\n to = 'top';\n } else if (direction === 'ltr') {\n to = 'right';\n } else {\n to = 'left';\n }\n switch (channel) {\n case 'hue': {\n let stops = [0, 60, 120, 180, 240, 300, 360].map(hue => value.withChannelValue('hue', hue).toString('css')).join(', ');\n return `linear-gradient(to ${to}, ${stops})`;\n }\n case 'lightness': {\n // We have to add an extra color stop in the middle so that the hue shows up at all.\n // Otherwise it will always just be black to white.\n let min = state.getThumbMinValue(0);\n let max = state.getThumbMaxValue(0);\n let start = value.withChannelValue(channel, min).toString('css');\n let middle = value.withChannelValue(channel, (max - min) / 2).toString('css');\n let end = value.withChannelValue(channel, max).toString('css');\n return `linear-gradient(to ${to}, ${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, state.getThumbMinValue(0)).toString('css');\n let end = value.withChannelValue(channel, state.getThumbMaxValue(0)).toString('css');\n return `linear-gradient(to ${to}, ${start}, ${end})`;\n }\n default:\n throw new Error('Unknown color channel: ' + channel);\n }\n };\n\n let forcedColorAdjustNoneStyle = {forcedColorAdjust: 'none'};\n\n if (channel === 'hue') {\n inputProps['aria-valuetext'] += `, ${value.getHueName(locale)}`;\n } else if (channel !== 'alpha') {\n inputProps['aria-valuetext'] += `, ${value.getColorName(locale)}`;\n }\n\n let {visuallyHiddenProps} = useVisuallyHidden({\n style: {\n opacity: '0.0001',\n width: '100%',\n height: '100%',\n pointerEvents: 'none'\n }\n });\n\n return {\n trackProps: {\n ...mergeProps(groupProps, trackProps),\n style: {\n ...trackProps.style,\n ...forcedColorAdjustNoneStyle,\n background: generateBackground()\n }\n },\n inputProps: {\n ...inputProps,\n style: {\n ...inputProps.style,\n ...visuallyHiddenProps.style\n }\n },\n thumbProps: {\n ...thumbProps,\n style: {\n ...thumbProps.style,\n ...forcedColorAdjustNoneStyle\n }\n },\n labelProps,\n outputProps\n };\n}\n"],"names":[],"version":3,"file":"useColorSlider.module.js.map"}