@react-stately/color 3.5.4-nightly.4552 → 3.5.4-nightly.4558

package/dist/zh-TW.module.js.map

@@ -1 +1 @@
-{"mappings":";AAAA,4BAAiB;IAAG,SAAS,CAAC,KAAK,CAAC;IAClC,QAAQ,CAAC,gBAAE,CAAC;IACZ,cAAc,CAAC,gBAAE,CAAC;IAClB,SAAS,CAAC,gBAAE,CAAC;IACb,OAAO,CAAC,gBAAE,CAAC;IACX,aAAa,CAAC,gBAAE,CAAC;IACjB,OAAO,CAAC,gBAAE,CAAC;IACX,cAAc,CAAC,wBAAG,CAAC;IACnB,aAAa,CAAC,OAAS,CAAC,EAAE,KAAK,YAAY,CAAC,CAAC,EAAE,KAAK,SAAS,CAAC,CAAC,EAAE,KAAK,MAAM,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC;IAC1F,gBAAgB,CAAC,OAAS,CAAC,EAAE,KAAK,OAAO,CAAC,YAAY,CAAC;IACvD,aAAa,CAAC,SAAS,CAAC;IACxB,QAAQ,CAAC,IAAI,CAAC;IACd,SAAS,CAAC,KAAK,CAAC;IAChB,cAAc,CAAC,UAAU,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC;IACd,WAAW,CAAC,OAAO,CAAC;IACpB,WAAW,CAAC,OAAO,CAAC;IACpB,SAAS,CAAC,KAAK,CAAC;IAChB,SAAS,CAAC,KAAK,CAAC;IAChB,QAAQ,CAAC,IAAI,CAAC;IACd,QAAQ,CAAC,IAAI,CAAC;IACd,YAAY,CAAC,QAAQ,CAAC;IACtB,cAAc,CAAC,UAAU,CAAC;IAC1B,SAAS,CAAC,KAAK,CAAC;IAChB,UAAU,CAAC,MAAM,CAAC;IAClB,iBAAiB,CAAC,aAAa,CAAC;IAChC,gBAAgB,CAAC,YAAY,CAAC;IAC9B,UAAU,CAAC,MAAM,CAAC;IAClB,gBAAgB,CAAC,YAAY,CAAC;IAC9B,cAAc,CAAC,UAAU,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC;IACd,aAAa,CAAC,SAAS,CAAC;IACxB,eAAe,CAAC,WAAW,CAAC;IAC5B,UAAU,CAAC,MAAM,CAAC;IAClB,kBAAkB,CAAC,cAAc,CAAC;IAClC,WAAW,CAAC,OAAO,CAAC;IACpB,gBAAgB,CAAC,YAAY,CAAC;AAChC","sources":["packages/@react-stately/color/intl/zh-TW.json"],"sourcesContent":["{\n  \"alpha\": \"Alpha\",\n  \"blue\": \"藍色\",\n  \"brightness\": \"亮度\",\n  \"green\": \"綠色\",\n  \"hue\": \"色相\",\n  \"lightness\": \"明亮\",\n  \"red\": \"紅色\",\n  \"saturation\": \"飽和度\",\n  \"colorName\": \"{transparency} {lightness} {chroma} {hue}\",\n  \"transparency\": \"{percent} transparent\",\n  \"very dark\": \"very dark\",\n  \"dark\": \"dark\",\n  \"light\": \"light\",\n  \"very light\": \"very light\",\n  \"pale\": \"pale\",\n  \"grayish\": \"grayish\",\n  \"vibrant\": \"vibrant\",\n  \"black\": \"black\",\n  \"white\": \"white\",\n  \"gray\": \"gray\",\n  \"pink\": \"pink\",\n  \"pink red\": \"pink red\",\n  \"red orange\": \"red orange\",\n  \"brown\": \"brown\",\n  \"orange\": \"orange\",\n  \"orange yellow\": \"orange yellow\",\n  \"brown yellow\": \"brown yellow\",\n  \"yellow\": \"yellow\",\n  \"yellow green\": \"yellow green\",\n  \"green cyan\": \"green cyan\",\n  \"cyan\": \"cyan\",\n  \"cyan blue\": \"cyan blue\",\n  \"blue purple\": \"blue purple\",\n  \"purple\": \"purple\",\n  \"purple magenta\": \"purple magenta\",\n  \"magenta\": \"magenta\",\n  \"magenta pink\": \"magenta pink\"\n}\n"],"names":[],"version":3,"file":"zh-TW.module.js.map"}
+{"mappings":";AAAA,4BAAiB;IAAG,SAAS,CAAC,KAAK,CAAC;IAClC,QAAQ,CAAC,gBAAE,CAAC;IACZ,cAAc,CAAC,gBAAE,CAAC;IAClB,SAAS,CAAC,gBAAE,CAAC;IACb,OAAO,CAAC,gBAAE,CAAC;IACX,aAAa,CAAC,gBAAE,CAAC;IACjB,OAAO,CAAC,gBAAE,CAAC;IACX,cAAc,CAAC,wBAAG,CAAC;IACnB,aAAa,CAAC,OAAS,CAAC,EAAE,KAAK,SAAS,CAAC,CAAC,EAAE,KAAK,MAAM,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC;IACrE,wBAAwB,CAAC,OAAS,CAAC,EAAE,KAAK,SAAS,CAAC,CAAC,EAAE,KAAK,MAAM,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,EAAE,KAAK,kBAAkB,CAAC,YAAY,CAAC;IACxH,aAAa,CAAC,SAAS,CAAC;IACxB,QAAQ,CAAC,IAAI,CAAC;IACd,SAAS,CAAC,KAAK,CAAC;IAChB,cAAc,CAAC,UAAU,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC;IACd,WAAW,CAAC,OAAO,CAAC;IACpB,WAAW,CAAC,OAAO,CAAC;IACpB,SAAS,CAAC,KAAK,CAAC;IAChB,SAAS,CAAC,KAAK,CAAC;IAChB,QAAQ,CAAC,IAAI,CAAC;IACd,QAAQ,CAAC,IAAI,CAAC;IACd,YAAY,CAAC,QAAQ,CAAC;IACtB,cAAc,CAAC,UAAU,CAAC;IAC1B,SAAS,CAAC,KAAK,CAAC;IAChB,UAAU,CAAC,MAAM,CAAC;IAClB,iBAAiB,CAAC,aAAa,CAAC;IAChC,gBAAgB,CAAC,YAAY,CAAC;IAC9B,UAAU,CAAC,MAAM,CAAC;IAClB,gBAAgB,CAAC,YAAY,CAAC;IAC9B,cAAc,CAAC,UAAU,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC;IACd,aAAa,CAAC,SAAS,CAAC;IACxB,eAAe,CAAC,WAAW,CAAC;IAC5B,UAAU,CAAC,MAAM,CAAC;IAClB,kBAAkB,CAAC,cAAc,CAAC;IAClC,WAAW,CAAC,OAAO,CAAC;IACpB,gBAAgB,CAAC,YAAY,CAAC;AAChC","sources":["packages/@react-stately/color/intl/zh-TW.json"],"sourcesContent":["{\n  \"alpha\": \"Alpha\",\n  \"blue\": \"藍色\",\n  \"brightness\": \"亮度\",\n  \"green\": \"綠色\",\n  \"hue\": \"色相\",\n  \"lightness\": \"明亮\",\n  \"red\": \"紅色\",\n  \"saturation\": \"飽和度\",\n  \"colorName\": \"{lightness} {chroma} {hue}\",\n  \"transparentColorName\": \"{lightness} {chroma} {hue}, {percentTransparent} transparent\",\n  \"very dark\": \"very dark\",\n  \"dark\": \"dark\",\n  \"light\": \"light\",\n  \"very light\": \"very light\",\n  \"pale\": \"pale\",\n  \"grayish\": \"grayish\",\n  \"vibrant\": \"vibrant\",\n  \"black\": \"black\",\n  \"white\": \"white\",\n  \"gray\": \"gray\",\n  \"pink\": \"pink\",\n  \"pink red\": \"pink red\",\n  \"red orange\": \"red orange\",\n  \"brown\": \"brown\",\n  \"orange\": \"orange\",\n  \"orange yellow\": \"orange yellow\",\n  \"brown yellow\": \"brown yellow\",\n  \"yellow\": \"yellow\",\n  \"yellow green\": \"yellow green\",\n  \"green cyan\": \"green cyan\",\n  \"cyan\": \"cyan\",\n  \"cyan blue\": \"cyan blue\",\n  \"blue purple\": \"blue purple\",\n  \"purple\": \"purple\",\n  \"purple magenta\": \"purple magenta\",\n  \"magenta\": \"magenta\",\n  \"magenta pink\": \"magenta pink\"\n}\n"],"names":[],"version":3,"file":"zh-TW.module.js.map"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-stately/color",
-  "version": "3.5.4-nightly.4552+64ed13090",
+  "version": "3.5.4-nightly.4558+c5e4b3701",
   "description": "Spectrum UI components in React",
   "license": "Apache-2.0",
   "main": "dist/main.js",
@@ -22,13 +22,13 @@
     "url": "https://github.com/adobe/react-spectrum"
   },
   "dependencies": {
-    "@internationalized/number": "3.5.2-nightly.4552+64ed13090",
-    "@internationalized/string": "3.2.2-nightly.4552+64ed13090",
-    "@react-aria/i18n": "3.0.0-nightly.2840+64ed13090",
-    "@react-stately/form": "3.0.2-nightly.4552+64ed13090",
-    "@react-stately/slider": "3.5.3-nightly.4552+64ed13090",
-    "@react-stately/utils": "3.0.0-nightly.2840+64ed13090",
-    "@react-types/color": "3.0.0-nightly.4552+64ed13090",
+    "@internationalized/number": "3.5.2-nightly.4558+c5e4b3701",
+    "@internationalized/string": "3.2.2-nightly.4558+c5e4b3701",
+    "@react-aria/i18n": "3.0.0-nightly.2846+c5e4b3701",
+    "@react-stately/form": "3.0.2-nightly.4558+c5e4b3701",
+    "@react-stately/slider": "3.5.3-nightly.4558+c5e4b3701",
+    "@react-stately/utils": "3.0.0-nightly.2846+c5e4b3701",
+    "@react-types/color": "3.0.0-nightly.4558+c5e4b3701",
     "@swc/helpers": "^0.5.0"
   },
   "peerDependencies": {
@@ -37,5 +37,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "64ed13090ce77cc0e4cb4cd5602e75f655bff6bb"
+  "gitHead": "c5e4b3701fdb89eb551f1b3697ac253f06ef68fa"
 }

package/src/Color.ts

@@ -154,18 +154,21 @@ abstract class Color implements IColor {
 
     let alpha = this.getChannelValue('alpha');
     let formatter = new LocalizedStringFormatter(locale, strings);
-    let transparency = '';
     if (alpha < 1) {
-      let percent = new NumberFormatter(locale, {style: 'percent'}).format(1 - alpha);
-      transparency = formatter.format('transparency', {percent});
+      let percentTransparent = new NumberFormatter(locale, {style: 'percent'}).format(1 - alpha);
+      return formatter.format('transparentColorName', {
+        lightness,
+        chroma,
+        hue,
+        percentTransparent
+      }).replace(/\s+/g, ' ').trim();
+    } else {
+      return formatter.format('colorName', {
+        lightness,
+        chroma,
+        hue
+      }).replace(/\s+/g, ' ').trim();
     }
-    
-    return formatter.format('colorName', {
-      lightness,
-      chroma,
-      hue,
-      transparency
-    }).replace(/\s+/g, ' ').trim();
   }
 
   private getOklchHue(l: number, c: number, h: number, locale: string): [string, number] {