@atlaskit/tokens 13.0.4 → 13.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (343) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/codemods/css-to-design-tokens/lib/colors.tsx +3 -8
  3. package/codemods/css-to-design-tokens/lib/declaration.tsx +3 -13
  4. package/codemods/css-to-design-tokens/lib/extract-between-parentheses.tsx +4 -0
  5. package/codemods/css-to-design-tokens/lib/extract-less-var-name.tsx +3 -0
  6. package/codemods/css-to-design-tokens/lib/get-css-var-meta.tsx +13 -0
  7. package/codemods/css-to-design-tokens/lib/get-named-color-meta.tsx +5 -0
  8. package/codemods/css-to-design-tokens/lib/get-raw-color-meta.tsx +11 -0
  9. package/codemods/css-to-design-tokens/lib/is-css-declaration.tsx +3 -0
  10. package/codemods/css-to-design-tokens/lib/is-known-css-variable.tsx +5 -0
  11. package/codemods/css-to-design-tokens/lib/known-named-colors.tsx +150 -0
  12. package/codemods/css-to-design-tokens/lib/known-raw-colors.tsx +17 -0
  13. package/codemods/css-to-design-tokens/lib/known-variables.tsx +167 -0
  14. package/codemods/css-to-design-tokens/lib/legacy-colors.tsx +3 -335
  15. package/codemods/css-to-design-tokens/lib/meta.tsx +3 -28
  16. package/codemods/css-to-design-tokens/lib/split-css-value.tsx +4 -0
  17. package/codemods/css-to-design-tokens/lib/value.tsx +6 -9
  18. package/codemods/css-to-design-tokens/transform.tsx +3 -1
  19. package/dist/cjs/artifacts/palettes-raw/palette.js +35 -1
  20. package/dist/cjs/artifacts/themes/atlassian-dark-increased-contrast.js +2 -2
  21. package/dist/cjs/artifacts/themes/atlassian-dark.js +2 -2
  22. package/dist/cjs/artifacts/themes/atlassian-light-increased-contrast.js +2 -2
  23. package/dist/cjs/artifacts/themes/atlassian-light.js +2 -2
  24. package/dist/cjs/artifacts/token-default-values.js +2 -2
  25. package/dist/cjs/artifacts/tokens-raw/atlassian-dark-increased-contrast.js +3 -3
  26. package/dist/cjs/artifacts/tokens-raw/atlassian-dark.js +3 -3
  27. package/dist/cjs/artifacts/tokens-raw/atlassian-light-increased-contrast.js +3 -3
  28. package/dist/cjs/artifacts/tokens-raw/atlassian-light.js +3 -3
  29. package/dist/cjs/constants.js +1 -0
  30. package/dist/cjs/entry-points/theme-state-transformer.js +4 -3
  31. package/dist/cjs/entry-points/token-metadata.codegen.js +2 -2
  32. package/dist/cjs/get-custom-theme-styles.js +7 -6
  33. package/dist/cjs/get-global-theme.js +2 -2
  34. package/dist/cjs/get-theme-html-attrs.js +2 -2
  35. package/dist/cjs/get-theme-styles.js +27 -27
  36. package/dist/cjs/index.js +4 -3
  37. package/dist/cjs/is-color-mode.js +9 -0
  38. package/dist/cjs/is-theme-ids.js +12 -0
  39. package/dist/cjs/is-theme-kind.js +12 -0
  40. package/dist/cjs/set-global-theme.js +32 -31
  41. package/dist/cjs/theme-config.js +9 -43
  42. package/dist/cjs/theme-object-to-string.js +42 -0
  43. package/dist/cjs/theme-options-schema.js +1 -0
  44. package/dist/cjs/theme-state-defaults.js +39 -0
  45. package/dist/cjs/theme-state.js +5 -0
  46. package/dist/cjs/theme-string-to-object.js +51 -0
  47. package/dist/cjs/utils/additional-contrast-checker.js +43 -0
  48. package/dist/cjs/utils/custom-theme-loading-utils.js +0 -20
  49. package/dist/cjs/utils/custom-theme-token-contrast-check.js +2 -38
  50. package/dist/cjs/utils/delta-e.js +26 -0
  51. package/dist/cjs/utils/generate-colors.js +47 -0
  52. package/dist/cjs/utils/generate-token-map-with-contrast-check.js +32 -0
  53. package/dist/cjs/utils/{generate-custom-color-ramp.js → generate-token-map.js} +6 -71
  54. package/dist/cjs/utils/get-closest-color-index.js +3 -2
  55. package/dist/cjs/utils/get-contrast-ratio.js +22 -0
  56. package/dist/cjs/utils/hct-color-utils/alpha-from-argb.js +12 -0
  57. package/dist/cjs/utils/hct-color-utils/argb-from-linrgb.js +17 -0
  58. package/dist/cjs/utils/hct-color-utils/argb-from-lstar.js +21 -0
  59. package/dist/cjs/utils/hct-color-utils/argb-from-rgba.js +24 -0
  60. package/dist/cjs/utils/hct-color-utils/argb-from-xyz.js +29 -0
  61. package/dist/cjs/utils/hct-color-utils/blue-from-argb.js +12 -0
  62. package/dist/cjs/utils/hct-color-utils/clamp-component.js +15 -0
  63. package/dist/cjs/utils/hct-color-utils/contrast.js +10 -11
  64. package/dist/cjs/utils/hct-color-utils/green-from-argb.js +12 -0
  65. package/dist/cjs/utils/hct-color-utils/hct.js +18 -12
  66. package/dist/cjs/utils/hct-color-utils/index.js +4 -3
  67. package/dist/cjs/utils/hct-color-utils/lab-f.js +15 -0
  68. package/dist/cjs/utils/hct-color-utils/lab-invf.js +16 -0
  69. package/dist/cjs/utils/hct-color-utils/lstar-from-argb.js +34 -0
  70. package/dist/cjs/utils/hct-color-utils/lstar-from-y.js +21 -0
  71. package/dist/cjs/utils/hct-color-utils/red-from-argb.js +12 -0
  72. package/dist/cjs/utils/hct-color-utils/rgba-from-argb.js +28 -0
  73. package/dist/cjs/utils/hct-color-utils/rgba.js +1 -0
  74. package/dist/cjs/utils/hct-color-utils/viewing-conditions.js +5 -4
  75. package/dist/cjs/utils/hct-color-utils/white-point-d65.js +14 -0
  76. package/dist/cjs/utils/hct-color-utils/y-from-lstar.js +21 -0
  77. package/dist/cjs/utils/hex-to-hsl.js +52 -0
  78. package/dist/cjs/utils/hex-to-rgb-a.js +20 -0
  79. package/dist/cjs/utils/hex-to-rgb.js +19 -0
  80. package/dist/cjs/utils/is-valid-hex.js +10 -0
  81. package/dist/cjs/utils/load-theme-css.js +4 -4
  82. package/dist/cjs/utils/reduce-token-map.js +18 -0
  83. package/dist/cjs/utils/rgb-to-lab.js +24 -0
  84. package/dist/cjs/utils/theme-loading.js +8 -8
  85. package/dist/es2019/artifacts/palettes-raw/palette.js +35 -1
  86. package/dist/es2019/artifacts/themes/atlassian-dark-increased-contrast.js +2 -2
  87. package/dist/es2019/artifacts/themes/atlassian-dark.js +2 -2
  88. package/dist/es2019/artifacts/themes/atlassian-light-increased-contrast.js +2 -2
  89. package/dist/es2019/artifacts/themes/atlassian-light.js +2 -2
  90. package/dist/es2019/artifacts/token-default-values.js +2 -2
  91. package/dist/es2019/artifacts/tokens-raw/atlassian-dark-increased-contrast.js +3 -3
  92. package/dist/es2019/artifacts/tokens-raw/atlassian-dark.js +3 -3
  93. package/dist/es2019/artifacts/tokens-raw/atlassian-light-increased-contrast.js +3 -3
  94. package/dist/es2019/artifacts/tokens-raw/atlassian-light.js +3 -3
  95. package/dist/es2019/constants.js +1 -0
  96. package/dist/es2019/entry-points/theme-state-transformer.js +2 -1
  97. package/dist/es2019/entry-points/token-metadata.codegen.js +2 -2
  98. package/dist/es2019/get-custom-theme-styles.js +3 -2
  99. package/dist/es2019/get-global-theme.js +1 -1
  100. package/dist/es2019/get-theme-html-attrs.js +1 -1
  101. package/dist/es2019/index.js +2 -1
  102. package/dist/es2019/is-color-mode.js +3 -0
  103. package/dist/es2019/is-theme-ids.js +4 -0
  104. package/dist/es2019/is-theme-kind.js +4 -0
  105. package/dist/es2019/theme-config.js +5 -44
  106. package/dist/es2019/theme-object-to-string.js +28 -0
  107. package/dist/es2019/theme-options-schema.js +0 -0
  108. package/dist/es2019/theme-state-defaults.js +34 -0
  109. package/dist/es2019/theme-state.js +1 -0
  110. package/dist/es2019/theme-string-to-object.js +38 -0
  111. package/dist/es2019/utils/additional-contrast-checker.js +39 -0
  112. package/dist/es2019/utils/custom-theme-loading-utils.js +1 -9
  113. package/dist/es2019/utils/custom-theme-token-contrast-check.js +1 -39
  114. package/dist/es2019/utils/delta-e.js +20 -0
  115. package/dist/es2019/utils/generate-colors.js +39 -0
  116. package/dist/es2019/utils/generate-token-map-with-contrast-check.js +21 -0
  117. package/dist/es2019/utils/{generate-custom-color-ramp.js → generate-token-map.js} +3 -59
  118. package/dist/es2019/utils/get-closest-color-index.js +2 -1
  119. package/dist/es2019/utils/get-contrast-ratio.js +16 -0
  120. package/dist/es2019/utils/hct-color-utils/alpha-from-argb.js +6 -0
  121. package/dist/es2019/utils/hct-color-utils/argb-from-linrgb.js +12 -0
  122. package/dist/es2019/utils/hct-color-utils/argb-from-lstar.js +16 -0
  123. package/dist/es2019/utils/hct-color-utils/argb-from-rgba.js +19 -0
  124. package/dist/es2019/utils/hct-color-utils/argb-from-xyz.js +24 -0
  125. package/dist/es2019/utils/hct-color-utils/blue-from-argb.js +6 -0
  126. package/dist/es2019/utils/hct-color-utils/clamp-component.js +9 -0
  127. package/dist/es2019/utils/hct-color-utils/contrast.js +10 -10
  128. package/dist/es2019/utils/hct-color-utils/green-from-argb.js +6 -0
  129. package/dist/es2019/utils/hct-color-utils/hct.js +19 -12
  130. package/dist/es2019/utils/hct-color-utils/index.js +2 -1
  131. package/dist/es2019/utils/hct-color-utils/lab-f.js +9 -0
  132. package/dist/es2019/utils/hct-color-utils/lab-invf.js +10 -0
  133. package/dist/es2019/utils/hct-color-utils/lstar-from-argb.js +28 -0
  134. package/dist/es2019/utils/hct-color-utils/lstar-from-y.js +16 -0
  135. package/dist/es2019/utils/hct-color-utils/red-from-argb.js +6 -0
  136. package/dist/es2019/utils/hct-color-utils/rgba-from-argb.js +22 -0
  137. package/dist/es2019/utils/hct-color-utils/rgba.js +0 -0
  138. package/dist/es2019/utils/hct-color-utils/viewing-conditions.js +4 -3
  139. package/dist/es2019/utils/hct-color-utils/white-point-d65.js +8 -0
  140. package/dist/es2019/utils/hct-color-utils/y-from-lstar.js +16 -0
  141. package/dist/es2019/utils/hex-to-hsl.js +46 -0
  142. package/dist/es2019/utils/hex-to-rgb-a.js +14 -0
  143. package/dist/es2019/utils/hex-to-rgb.js +13 -0
  144. package/dist/es2019/utils/is-valid-hex.js +2 -0
  145. package/dist/es2019/utils/reduce-token-map.js +7 -0
  146. package/dist/es2019/utils/rgb-to-lab.js +18 -0
  147. package/dist/esm/artifacts/palettes-raw/palette.js +35 -1
  148. package/dist/esm/artifacts/themes/atlassian-dark-increased-contrast.js +2 -2
  149. package/dist/esm/artifacts/themes/atlassian-dark.js +2 -2
  150. package/dist/esm/artifacts/themes/atlassian-light-increased-contrast.js +2 -2
  151. package/dist/esm/artifacts/themes/atlassian-light.js +2 -2
  152. package/dist/esm/artifacts/token-default-values.js +2 -2
  153. package/dist/esm/artifacts/tokens-raw/atlassian-dark-increased-contrast.js +3 -3
  154. package/dist/esm/artifacts/tokens-raw/atlassian-dark.js +3 -3
  155. package/dist/esm/artifacts/tokens-raw/atlassian-light-increased-contrast.js +3 -3
  156. package/dist/esm/artifacts/tokens-raw/atlassian-light.js +3 -3
  157. package/dist/esm/constants.js +1 -0
  158. package/dist/esm/entry-points/theme-state-transformer.js +2 -1
  159. package/dist/esm/entry-points/token-metadata.codegen.js +2 -2
  160. package/dist/esm/get-custom-theme-styles.js +3 -2
  161. package/dist/esm/get-global-theme.js +1 -1
  162. package/dist/esm/get-theme-html-attrs.js +1 -1
  163. package/dist/esm/get-theme-styles.js +26 -26
  164. package/dist/esm/index.js +2 -1
  165. package/dist/esm/is-color-mode.js +3 -0
  166. package/dist/esm/is-theme-ids.js +6 -0
  167. package/dist/esm/is-theme-kind.js +6 -0
  168. package/dist/esm/set-global-theme.js +31 -30
  169. package/dist/esm/theme-config.js +5 -44
  170. package/dist/esm/theme-object-to-string.js +35 -0
  171. package/dist/esm/theme-options-schema.js +0 -0
  172. package/dist/esm/theme-state-defaults.js +34 -0
  173. package/dist/esm/theme-state.js +1 -0
  174. package/dist/esm/theme-string-to-object.js +44 -0
  175. package/dist/esm/utils/additional-contrast-checker.js +36 -0
  176. package/dist/esm/utils/custom-theme-loading-utils.js +1 -13
  177. package/dist/esm/utils/custom-theme-token-contrast-check.js +1 -36
  178. package/dist/esm/utils/delta-e.js +20 -0
  179. package/dist/esm/utils/generate-colors.js +40 -0
  180. package/dist/esm/utils/generate-token-map-with-contrast-check.js +25 -0
  181. package/dist/esm/utils/{generate-custom-color-ramp.js → generate-token-map.js} +3 -63
  182. package/dist/esm/utils/get-closest-color-index.js +2 -1
  183. package/dist/esm/utils/get-contrast-ratio.js +16 -0
  184. package/dist/esm/utils/hct-color-utils/alpha-from-argb.js +6 -0
  185. package/dist/esm/utils/hct-color-utils/argb-from-linrgb.js +12 -0
  186. package/dist/esm/utils/hct-color-utils/argb-from-lstar.js +16 -0
  187. package/dist/esm/utils/hct-color-utils/argb-from-rgba.js +18 -0
  188. package/dist/esm/utils/hct-color-utils/argb-from-xyz.js +24 -0
  189. package/dist/esm/utils/hct-color-utils/blue-from-argb.js +6 -0
  190. package/dist/esm/utils/hct-color-utils/clamp-component.js +9 -0
  191. package/dist/esm/utils/hct-color-utils/contrast.js +10 -10
  192. package/dist/esm/utils/hct-color-utils/green-from-argb.js +6 -0
  193. package/dist/esm/utils/hct-color-utils/hct.js +19 -12
  194. package/dist/esm/utils/hct-color-utils/index.js +2 -1
  195. package/dist/esm/utils/hct-color-utils/lab-f.js +9 -0
  196. package/dist/esm/utils/hct-color-utils/lab-invf.js +10 -0
  197. package/dist/esm/utils/hct-color-utils/lstar-from-argb.js +28 -0
  198. package/dist/esm/utils/hct-color-utils/lstar-from-y.js +16 -0
  199. package/dist/esm/utils/hct-color-utils/red-from-argb.js +6 -0
  200. package/dist/esm/utils/hct-color-utils/rgba-from-argb.js +22 -0
  201. package/dist/esm/utils/hct-color-utils/rgba.js +0 -0
  202. package/dist/esm/utils/hct-color-utils/viewing-conditions.js +5 -4
  203. package/dist/esm/utils/hct-color-utils/white-point-d65.js +8 -0
  204. package/dist/esm/utils/hct-color-utils/y-from-lstar.js +16 -0
  205. package/dist/esm/utils/hex-to-hsl.js +46 -0
  206. package/dist/esm/utils/hex-to-rgb-a.js +14 -0
  207. package/dist/esm/utils/hex-to-rgb.js +13 -0
  208. package/dist/esm/utils/is-valid-hex.js +4 -0
  209. package/dist/esm/utils/load-theme-css.js +4 -4
  210. package/dist/esm/utils/reduce-token-map.js +11 -0
  211. package/dist/esm/utils/rgb-to-lab.js +18 -0
  212. package/dist/esm/utils/theme-loading.js +8 -8
  213. package/dist/types/artifacts/palettes-raw/palette.d.ts +1 -1
  214. package/dist/types/artifacts/themes/atlassian-dark-increased-contrast.d.ts +2 -2
  215. package/dist/types/artifacts/themes/atlassian-dark.d.ts +2 -2
  216. package/dist/types/artifacts/themes/atlassian-light-increased-contrast.d.ts +2 -2
  217. package/dist/types/artifacts/themes/atlassian-light.d.ts +2 -2
  218. package/dist/types/artifacts/token-default-values.d.ts +2 -2
  219. package/dist/types/artifacts/tokens-raw/atlassian-dark-increased-contrast.d.ts +1 -1
  220. package/dist/types/artifacts/tokens-raw/atlassian-dark.d.ts +1 -1
  221. package/dist/types/artifacts/tokens-raw/atlassian-light-increased-contrast.d.ts +1 -1
  222. package/dist/types/artifacts/tokens-raw/atlassian-light.d.ts +1 -1
  223. package/dist/types/entry-points/theme-state-transformer.d.ts +2 -1
  224. package/dist/types/entry-points/token-metadata.codegen.d.ts +1 -1
  225. package/dist/types/index.d.ts +2 -1
  226. package/dist/types/is-color-mode.d.ts +2 -0
  227. package/dist/types/is-theme-ids.d.ts +2 -0
  228. package/dist/types/is-theme-kind.d.ts +4 -0
  229. package/dist/types/theme-color-modes.d.ts +1 -0
  230. package/dist/types/theme-config.d.ts +8 -40
  231. package/dist/types/theme-ids.d.ts +1 -0
  232. package/dist/types/theme-object-to-string.d.ts +13 -0
  233. package/dist/types/theme-options-schema.d.ts +7 -0
  234. package/dist/types/theme-state-defaults.d.ts +14 -0
  235. package/dist/types/theme-state.d.ts +17 -0
  236. package/dist/types/{theme-state-transformer.d.ts → theme-string-to-object.d.ts} +0 -12
  237. package/dist/types/utils/additional-contrast-checker.d.ts +9 -0
  238. package/dist/types/utils/custom-theme-loading-utils.d.ts +1 -6
  239. package/dist/types/utils/custom-theme-token-contrast-check.d.ts +0 -9
  240. package/dist/types/utils/delta-e.d.ts +1 -0
  241. package/dist/types/utils/generate-colors.d.ts +5 -0
  242. package/dist/types/utils/{generate-custom-color-ramp.d.ts → generate-token-map-with-contrast-check.d.ts} +1 -6
  243. package/dist/types/utils/generate-token-map.d.ts +9 -0
  244. package/dist/types/utils/get-contrast-ratio.d.ts +1 -0
  245. package/dist/types/utils/hct-color-utils/alpha-from-argb.d.ts +4 -0
  246. package/dist/types/utils/hct-color-utils/argb-from-linrgb.d.ts +4 -0
  247. package/dist/types/utils/hct-color-utils/argb-from-lstar.d.ts +8 -0
  248. package/dist/types/utils/hct-color-utils/argb-from-rgba.d.ts +8 -0
  249. package/dist/types/utils/hct-color-utils/argb-from-xyz.d.ts +4 -0
  250. package/dist/types/utils/hct-color-utils/blue-from-argb.d.ts +4 -0
  251. package/dist/types/utils/hct-color-utils/clamp-component.d.ts +1 -0
  252. package/dist/types/utils/hct-color-utils/green-from-argb.d.ts +4 -0
  253. package/dist/types/utils/hct-color-utils/index.d.ts +2 -1
  254. package/dist/types/utils/hct-color-utils/lab-f.d.ts +1 -0
  255. package/dist/types/utils/hct-color-utils/lab-invf.d.ts +1 -0
  256. package/dist/types/utils/hct-color-utils/lstar-from-argb.d.ts +7 -0
  257. package/dist/types/utils/hct-color-utils/lstar-from-y.d.ts +12 -0
  258. package/dist/types/utils/hct-color-utils/red-from-argb.d.ts +4 -0
  259. package/dist/types/utils/hct-color-utils/rgba-from-argb.d.ts +8 -0
  260. package/dist/types/utils/hct-color-utils/rgba.d.ts +14 -0
  261. package/dist/types/utils/hct-color-utils/white-point-d65.d.ts +6 -0
  262. package/dist/types/utils/hct-color-utils/y-from-lstar.d.ts +12 -0
  263. package/dist/types/utils/hex-to-hsl.d.ts +1 -0
  264. package/dist/types/utils/hex-to-rgb-a.d.ts +1 -0
  265. package/dist/types/utils/hex-to-rgb.d.ts +1 -0
  266. package/dist/types/utils/is-valid-hex.d.ts +1 -0
  267. package/dist/types/utils/reduce-token-map.d.ts +6 -0
  268. package/dist/types/utils/rgb-to-lab.d.ts +1 -0
  269. package/dist/types-ts4.5/artifacts/palettes-raw/palette.d.ts +1 -1
  270. package/dist/types-ts4.5/artifacts/themes/atlassian-dark-increased-contrast.d.ts +2 -2
  271. package/dist/types-ts4.5/artifacts/themes/atlassian-dark.d.ts +2 -2
  272. package/dist/types-ts4.5/artifacts/themes/atlassian-light-increased-contrast.d.ts +2 -2
  273. package/dist/types-ts4.5/artifacts/themes/atlassian-light.d.ts +2 -2
  274. package/dist/types-ts4.5/artifacts/token-default-values.d.ts +2 -2
  275. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-dark-increased-contrast.d.ts +1 -1
  276. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-dark.d.ts +1 -1
  277. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-light-increased-contrast.d.ts +1 -1
  278. package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-light.d.ts +1 -1
  279. package/dist/types-ts4.5/entry-points/theme-state-transformer.d.ts +2 -1
  280. package/dist/types-ts4.5/entry-points/token-metadata.codegen.d.ts +1 -1
  281. package/dist/types-ts4.5/index.d.ts +2 -1
  282. package/dist/types-ts4.5/is-color-mode.d.ts +2 -0
  283. package/dist/types-ts4.5/is-theme-ids.d.ts +2 -0
  284. package/dist/types-ts4.5/is-theme-kind.d.ts +11 -0
  285. package/dist/types-ts4.5/theme-color-modes.d.ts +1 -0
  286. package/dist/types-ts4.5/theme-config.d.ts +8 -40
  287. package/dist/types-ts4.5/theme-ids.d.ts +1 -0
  288. package/dist/types-ts4.5/theme-object-to-string.d.ts +13 -0
  289. package/dist/types-ts4.5/theme-options-schema.d.ts +7 -0
  290. package/dist/types-ts4.5/theme-state-defaults.d.ts +14 -0
  291. package/dist/types-ts4.5/theme-state.d.ts +17 -0
  292. package/dist/types-ts4.5/{theme-state-transformer.d.ts → theme-string-to-object.d.ts} +0 -12
  293. package/dist/types-ts4.5/utils/additional-contrast-checker.d.ts +9 -0
  294. package/dist/types-ts4.5/utils/custom-theme-loading-utils.d.ts +1 -6
  295. package/dist/types-ts4.5/utils/custom-theme-token-contrast-check.d.ts +0 -9
  296. package/dist/types-ts4.5/utils/delta-e.d.ts +1 -0
  297. package/dist/types-ts4.5/utils/generate-colors.d.ts +5 -0
  298. package/dist/types-ts4.5/utils/{generate-custom-color-ramp.d.ts → generate-token-map-with-contrast-check.d.ts} +1 -8
  299. package/dist/types-ts4.5/utils/generate-token-map.d.ts +11 -0
  300. package/dist/types-ts4.5/utils/get-contrast-ratio.d.ts +1 -0
  301. package/dist/types-ts4.5/utils/hct-color-utils/alpha-from-argb.d.ts +4 -0
  302. package/dist/types-ts4.5/utils/hct-color-utils/argb-from-linrgb.d.ts +4 -0
  303. package/dist/types-ts4.5/utils/hct-color-utils/argb-from-lstar.d.ts +8 -0
  304. package/dist/types-ts4.5/utils/hct-color-utils/argb-from-rgba.d.ts +8 -0
  305. package/dist/types-ts4.5/utils/hct-color-utils/argb-from-xyz.d.ts +4 -0
  306. package/dist/types-ts4.5/utils/hct-color-utils/blue-from-argb.d.ts +4 -0
  307. package/dist/types-ts4.5/utils/hct-color-utils/clamp-component.d.ts +1 -0
  308. package/dist/types-ts4.5/utils/hct-color-utils/green-from-argb.d.ts +4 -0
  309. package/dist/types-ts4.5/utils/hct-color-utils/index.d.ts +2 -1
  310. package/dist/types-ts4.5/utils/hct-color-utils/lab-f.d.ts +1 -0
  311. package/dist/types-ts4.5/utils/hct-color-utils/lab-invf.d.ts +1 -0
  312. package/dist/types-ts4.5/utils/hct-color-utils/lstar-from-argb.d.ts +7 -0
  313. package/dist/types-ts4.5/utils/hct-color-utils/lstar-from-y.d.ts +12 -0
  314. package/dist/types-ts4.5/utils/hct-color-utils/red-from-argb.d.ts +4 -0
  315. package/dist/types-ts4.5/utils/hct-color-utils/rgba-from-argb.d.ts +8 -0
  316. package/dist/types-ts4.5/utils/hct-color-utils/rgba.d.ts +14 -0
  317. package/dist/types-ts4.5/utils/hct-color-utils/white-point-d65.d.ts +6 -0
  318. package/dist/types-ts4.5/utils/hct-color-utils/y-from-lstar.d.ts +12 -0
  319. package/dist/types-ts4.5/utils/hex-to-hsl.d.ts +5 -0
  320. package/dist/types-ts4.5/utils/hex-to-rgb-a.d.ts +6 -0
  321. package/dist/types-ts4.5/utils/hex-to-rgb.d.ts +5 -0
  322. package/dist/types-ts4.5/utils/is-valid-hex.d.ts +1 -0
  323. package/dist/types-ts4.5/utils/reduce-token-map.d.ts +6 -0
  324. package/dist/types-ts4.5/utils/rgb-to-lab.d.ts +5 -0
  325. package/figma/atlassian-dark-increased-contrast.json +1 -1
  326. package/figma/atlassian-dark.json +1 -1
  327. package/figma/atlassian-light-increased-contrast.json +1 -1
  328. package/figma/atlassian-light.json +1 -1
  329. package/package.json +12 -12
  330. package/tokens.docs.tsx +48 -46
  331. package/dist/cjs/theme-state-transformer.js +0 -92
  332. package/dist/cjs/utils/color-utils.js +0 -168
  333. package/dist/cjs/utils/hct-color-utils/color-utils.js +0 -271
  334. package/dist/es2019/theme-state-transformer.js +0 -69
  335. package/dist/es2019/utils/color-utils.js +0 -128
  336. package/dist/es2019/utils/hct-color-utils/color-utils.js +0 -241
  337. package/dist/esm/theme-state-transformer.js +0 -85
  338. package/dist/esm/utils/color-utils.js +0 -130
  339. package/dist/esm/utils/hct-color-utils/color-utils.js +0 -240
  340. package/dist/types/utils/color-utils.d.ts +0 -10
  341. package/dist/types/utils/hct-color-utils/color-utils.d.ts +0 -88
  342. package/dist/types-ts4.5/utils/color-utils.d.ts +0 -23
  343. package/dist/types-ts4.5/utils/hct-color-utils/color-utils.d.ts +0 -88
@@ -0,0 +1,18 @@
1
+ import { clampComponent } from './clamp-component';
2
+ /**
3
+ * Return int32 color from a given RGBA component
4
+ *
5
+ * @param rgba RGBA representation of a int32 color.
6
+ * @returns ARGB representation of a int32 color.
7
+ */
8
+ export function argbFromRgba(_ref) {
9
+ var r = _ref.r,
10
+ g = _ref.g,
11
+ b = _ref.b,
12
+ a = _ref.a;
13
+ var rValue = clampComponent(r);
14
+ var gValue = clampComponent(g);
15
+ var bValue = clampComponent(b);
16
+ var aValue = clampComponent(a);
17
+ return aValue << 24 | rValue << 16 | gValue << 8 | bValue;
18
+ }
@@ -0,0 +1,24 @@
1
+ import { argbFromRgb } from './argb-from-rgb';
2
+ import { delinearized } from './delinearized';
3
+
4
+ /**
5
+ * Color science utilities.
6
+ *
7
+ * Utility methods for color science constants and color space
8
+ * conversions that aren't HCT or CAM16.
9
+ */
10
+ var XYZ_TO_SRGB = [[3.2413774792388685, -1.5376652402851851, -0.49885366846268053], [-0.9691452513005321, 1.8758853451067872, 0.04156585616912061], [0.05562093689691305, -0.20395524564742123, 1.0571799111220335]];
11
+
12
+ /**
13
+ * Converts a color from ARGB to XYZ.
14
+ */
15
+ export function argbFromXyz(x, y, z) {
16
+ var matrix = XYZ_TO_SRGB;
17
+ var linearR = matrix[0][0] * x + matrix[0][1] * y + matrix[0][2] * z;
18
+ var linearG = matrix[1][0] * x + matrix[1][1] * y + matrix[1][2] * z;
19
+ var linearB = matrix[2][0] * x + matrix[2][1] * y + matrix[2][2] * z;
20
+ var r = delinearized(linearR);
21
+ var g = delinearized(linearG);
22
+ var b = delinearized(linearB);
23
+ return argbFromRgb(r, g, b);
24
+ }
@@ -0,0 +1,6 @@
1
+ /**
2
+ * Returns the blue component of a color in ARGB format.
3
+ */
4
+ export function blueFromArgb(argb) {
5
+ return argb & 255;
6
+ }
@@ -0,0 +1,9 @@
1
+ export function clampComponent(value) {
2
+ if (value < 0) {
3
+ return 0;
4
+ }
5
+ if (value > 255) {
6
+ return 255;
7
+ }
8
+ return value;
9
+ }
@@ -28,9 +28,9 @@ import _createClass from "@babel/runtime/helpers/createClass";
28
28
  //
29
29
  // tslint:disable:class-as-namespace
30
30
 
31
- import * as utils from './color-utils';
32
- import * as math from './math-utils';
33
-
31
+ import { clampDouble } from './clamp-double';
32
+ import { lstarFromY } from './lstar-from-y';
33
+ import { yFromLstar } from './y-from-lstar';
34
34
  /**
35
35
  * Utility methods for calculating contrast given two colors, or calculating a
36
36
  * color given one color and a contrast ratio.
@@ -57,9 +57,9 @@ export var Contrast = /*#__PURE__*/function () {
57
57
  * @param toneB Tone between 0 and 100. Values outside will be clamped.
58
58
  */
59
59
  function ratioOfTones(toneA, toneB) {
60
- toneA = math.clampDouble(0.0, 100.0, toneA);
61
- toneB = math.clampDouble(0.0, 100.0, toneB);
62
- return Contrast.ratioOfYs(utils.yFromLstar(toneA), utils.yFromLstar(toneB));
60
+ toneA = clampDouble(0.0, 100.0, toneA);
61
+ toneB = clampDouble(0.0, 100.0, toneB);
62
+ return Contrast.ratioOfYs(yFromLstar(toneA), yFromLstar(toneB));
63
63
  }
64
64
  }, {
65
65
  key: "ratioOfYs",
@@ -85,7 +85,7 @@ export var Contrast = /*#__PURE__*/function () {
85
85
  if (tone < 0.0 || tone > 100.0) {
86
86
  return -1.0;
87
87
  }
88
- var darkY = utils.yFromLstar(tone);
88
+ var darkY = yFromLstar(tone);
89
89
  var lightY = ratio * (darkY + 5.0) - 5.0;
90
90
  var realContrast = Contrast.ratioOfYs(lightY, darkY);
91
91
  var delta = Math.abs(realContrast - ratio);
@@ -95,7 +95,7 @@ export var Contrast = /*#__PURE__*/function () {
95
95
 
96
96
  // Ensure gamut mapping, which requires a 'range' on tone, will still result
97
97
  // the correct ratio by darkening slightly.
98
- var returnValue = utils.lstarFromY(lightY) + 0.4;
98
+ var returnValue = lstarFromY(lightY) + 0.4;
99
99
  if (returnValue < 0 || returnValue > 100) {
100
100
  return -1;
101
101
  }
@@ -118,7 +118,7 @@ export var Contrast = /*#__PURE__*/function () {
118
118
  if (tone < 0.0 || tone > 100.0) {
119
119
  return -1.0;
120
120
  }
121
- var lightY = utils.yFromLstar(tone);
121
+ var lightY = yFromLstar(tone);
122
122
  var darkY = (lightY + 5.0) / ratio - 5.0;
123
123
  var realContrast = Contrast.ratioOfYs(lightY, darkY);
124
124
  var delta = Math.abs(realContrast - ratio);
@@ -128,7 +128,7 @@ export var Contrast = /*#__PURE__*/function () {
128
128
 
129
129
  // Ensure gamut mapping, which requires a 'range' on tone, will still result
130
130
  // the correct ratio by darkening slightly.
131
- var returnValue = utils.lstarFromY(darkY) - 0.4;
131
+ var returnValue = lstarFromY(darkY) - 0.4;
132
132
  if (returnValue < 0 || returnValue > 100) {
133
133
  return -1;
134
134
  }
@@ -0,0 +1,6 @@
1
+ /**
2
+ * Returns the green component of a color in ARGB format.
3
+ */
4
+ export function greenFromArgb(argb) {
5
+ return argb >> 8 & 255;
6
+ }
@@ -23,9 +23,16 @@ import _createClass from "@babel/runtime/helpers/createClass";
23
23
  * limitations under the License.
24
24
  */
25
25
 
26
- import * as utils from './color-utils';
26
+ import { argbFromLinrgb } from './argb-from-linrgb';
27
+ import { argbFromLstar } from './argb-from-lstar';
28
+ import { argbFromXyz } from './argb-from-xyz';
29
+ import { linearized } from './linearized';
30
+ import { lstarFromArgb } from './lstar-from-argb';
31
+ import { lstarFromY } from './lstar-from-y';
27
32
  import * as math from './math-utils';
28
33
  import { ViewingConditions } from './viewing-conditions';
34
+ import { yFromLstar } from './y-from-lstar';
35
+
29
36
  /**
30
37
  * A color system built using CAM16 hue and chroma, and L* from
31
38
  * L*a*b*.
@@ -54,7 +61,7 @@ export var Hct = /*#__PURE__*/function () {
54
61
  var cam = Cam16.fromInt(argb);
55
62
  this.internalHue = cam.hue;
56
63
  this.internalChroma = cam.chroma;
57
- this.internalTone = utils.lstarFromArgb(argb);
64
+ this.internalTone = lstarFromArgb(argb);
58
65
  }
59
66
  return _createClass(Hct, [{
60
67
  key: "toInt",
@@ -118,7 +125,7 @@ export var Hct = /*#__PURE__*/function () {
118
125
  var cam = Cam16.fromInt(argb);
119
126
  this.internalHue = cam.hue;
120
127
  this.internalChroma = cam.chroma;
121
- this.internalTone = utils.lstarFromArgb(argb);
128
+ this.internalTone = lstarFromArgb(argb);
122
129
  this.argb = argb;
123
130
  }
124
131
 
@@ -149,7 +156,7 @@ export var Hct = /*#__PURE__*/function () {
149
156
  // 3. Create HCT from:
150
157
  // - CAM16 using default VC with XYZ coordinates in specified VC.
151
158
  // - L* converted from Y in XYZ coordinates in specified VC.
152
- var recastHct = Hct.from(recastInVc.hue, recastInVc.chroma, utils.lstarFromY(viewedInVc[1]));
159
+ var recastHct = Hct.from(recastInVc.hue, recastInVc.chroma, lstarFromY(viewedInVc[1]));
153
160
  return recastHct;
154
161
  }
155
162
  }], [{
@@ -300,7 +307,7 @@ var Cam16 = /*#__PURE__*/function () {
300
307
  var x = 1.86206786 * rF - 1.01125463 * gF + 0.14918677 * bF;
301
308
  var y = 0.38752654 * rF + 0.62144744 * gF - 0.00897398 * bF;
302
309
  var z = -0.0158415 * rF - 0.03412294 * gF + 1.04996444 * bF;
303
- var argb = utils.argbFromXyz(x, y, z);
310
+ var argb = argbFromXyz(x, y, z);
304
311
  return argb;
305
312
  }
306
313
 
@@ -358,9 +365,9 @@ var Cam16 = /*#__PURE__*/function () {
358
365
  var red = (argb & 0x00ff0000) >> 16;
359
366
  var green = (argb & 0x0000ff00) >> 8;
360
367
  var blue = argb & 0x000000ff;
361
- var redL = utils.linearized(red);
362
- var greenL = utils.linearized(green);
363
- var blueL = utils.linearized(blue);
368
+ var redL = linearized(red);
369
+ var greenL = linearized(green);
370
+ var blueL = linearized(blue);
364
371
  var x = 0.41233895 * redL + 0.35762064 * greenL + 0.18051042 * blueL;
365
372
  var y = 0.2126 * redL + 0.7152 * greenL + 0.0722 * blueL;
366
373
  var z = 0.01932141 * redL + 0.11916382 * greenL + 0.95034478 * blueL;
@@ -881,7 +888,7 @@ var HctSolver = /*#__PURE__*/function () {
881
888
  if (linrgb[0] > 100.01 || linrgb[1] > 100.01 || linrgb[2] > 100.01) {
882
889
  return 0;
883
890
  }
884
- return utils.argbFromLinrgb(linrgb);
891
+ return argbFromLinrgb(linrgb);
885
892
  }
886
893
  // Iterates with Newton method,
887
894
  // Using 2 * fn(j) / j as the approximation of fn'(j)
@@ -906,17 +913,17 @@ var HctSolver = /*#__PURE__*/function () {
906
913
  key: "solveToInt",
907
914
  value: function solveToInt(hueDegrees, chroma, lstar) {
908
915
  if (chroma < 0.0001 || lstar < 0.0001 || lstar > 99.9999) {
909
- return utils.argbFromLstar(lstar);
916
+ return argbFromLstar(lstar);
910
917
  }
911
918
  hueDegrees = math.sanitizeDegreesDouble(hueDegrees);
912
919
  var hueRadians = hueDegrees / 180 * Math.PI;
913
- var y = utils.yFromLstar(lstar);
920
+ var y = yFromLstar(lstar);
914
921
  var exactAnswer = HctSolver.findResultByJ(hueRadians, chroma, y);
915
922
  if (exactAnswer !== 0) {
916
923
  return exactAnswer;
917
924
  }
918
925
  var linrgb = HctSolver.bisectToLimit(y, hueRadians);
919
- return utils.argbFromLinrgb(linrgb);
926
+ return argbFromLinrgb(linrgb);
920
927
  }
921
928
 
922
929
  /**
@@ -1,3 +1,4 @@
1
1
  export { Hct } from './hct';
2
2
  export { Contrast } from './contrast';
3
- export { argbFromRgba, rgbaFromArgb } from './color-utils';
3
+ export { argbFromRgba } from './argb-from-rgba';
4
+ export { rgbaFromArgb } from './rgba-from-argb';
@@ -0,0 +1,9 @@
1
+ export function labF(t) {
2
+ var e = 216.0 / 24389.0;
3
+ var kappa = 24389.0 / 27.0;
4
+ if (t > e) {
5
+ return Math.pow(t, 1.0 / 3.0);
6
+ } else {
7
+ return (kappa * t + 16) / 116;
8
+ }
9
+ }
@@ -0,0 +1,10 @@
1
+ export function labInvf(ft) {
2
+ var e = 216.0 / 24389.0;
3
+ var kappa = 24389.0 / 27.0;
4
+ var ft3 = ft * ft * ft;
5
+ if (ft3 > e) {
6
+ return ft3;
7
+ } else {
8
+ return (116 * ft - 16) / kappa;
9
+ }
10
+ }
@@ -0,0 +1,28 @@
1
+ import { blueFromArgb } from './blue-from-argb';
2
+ import { greenFromArgb } from './green-from-argb';
3
+ import { labF } from './lab-f';
4
+ import { linearized } from './linearized';
5
+ import { matrixMultiply } from './matrix-multiply';
6
+ import { redFromArgb } from './red-from-argb';
7
+ var SRGB_TO_XYZ = [[0.41233895, 0.35762064, 0.18051042], [0.2126, 0.7152, 0.0722], [0.01932141, 0.11916382, 0.95034478]];
8
+
9
+ /**
10
+ * Converts a color from XYZ to ARGB.
11
+ */
12
+ function xyzFromArgb(argb) {
13
+ var r = linearized(redFromArgb(argb));
14
+ var g = linearized(greenFromArgb(argb));
15
+ var b = linearized(blueFromArgb(argb));
16
+ return matrixMultiply([r, g, b], SRGB_TO_XYZ);
17
+ }
18
+
19
+ /**
20
+ * Computes the L* value of a color in ARGB representation.
21
+ *
22
+ * @param argb ARGB representation of a color
23
+ * @return L*, from L*a*b*, coordinate of the color
24
+ */
25
+ export function lstarFromArgb(argb) {
26
+ var y = xyzFromArgb(argb)[1];
27
+ return 116.0 * labF(y / 100.0) - 16.0;
28
+ }
@@ -0,0 +1,16 @@
1
+ import { labF } from './lab-f';
2
+
3
+ /**
4
+ * Converts a Y value to an L* value.
5
+ *
6
+ * L* in L*a*b* and Y in XYZ measure the same quantity, luminance.
7
+ *
8
+ * L* measures perceptual luminance, a linear scale. Y in XYZ
9
+ * measures relative luminance, a logarithmic scale.
10
+ *
11
+ * @param y Y in XYZ
12
+ * @return L* in L*a*b*
13
+ */
14
+ export function lstarFromY(y) {
15
+ return labF(y / 100.0) * 116.0 - 16.0;
16
+ }
@@ -0,0 +1,6 @@
1
+ /**
2
+ * Returns the red component of a color in ARGB format.
3
+ */
4
+ export function redFromArgb(argb) {
5
+ return argb >> 16 & 255;
6
+ }
@@ -0,0 +1,22 @@
1
+ import { alphaFromArgb } from './alpha-from-argb';
2
+ import { blueFromArgb } from './blue-from-argb';
3
+ import { greenFromArgb } from './green-from-argb';
4
+ import { redFromArgb } from './red-from-argb';
5
+ /**
6
+ * Return RGBA from a given int32 color
7
+ *
8
+ * @param argb ARGB representation of a int32 color.
9
+ * @return RGBA representation of a int32 color.
10
+ */
11
+ export function rgbaFromArgb(argb) {
12
+ var r = redFromArgb(argb);
13
+ var g = greenFromArgb(argb);
14
+ var b = blueFromArgb(argb);
15
+ var a = alphaFromArgb(argb);
16
+ return {
17
+ r: r,
18
+ g: g,
19
+ b: b,
20
+ a: a
21
+ };
22
+ }
File without changes
@@ -2,8 +2,9 @@ import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
2
2
  import _createClass from "@babel/runtime/helpers/createClass";
3
3
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
4
4
  var _ViewingConditions;
5
- import * as utils from './color-utils';
6
5
  import * as math from './math-utils';
6
+ import { whitePointD65 } from './white-point-d65';
7
+ import { yFromLstar } from './y-from-lstar';
7
8
  export var ViewingConditions = /*#__PURE__*/function () {
8
9
  function ViewingConditions(n, aw, nbb, ncb, c, nc, rgbD, fl, fLRoot, z) {
9
10
  _classCallCheck(this, ViewingConditions);
@@ -44,8 +45,8 @@ export var ViewingConditions = /*#__PURE__*/function () {
44
45
  * self-luminous objects like displays.
45
46
  */
46
47
  function make() {
47
- var whitePoint = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : utils.whitePointD65();
48
- var adaptingLuminance = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 200.0 / Math.PI * utils.yFromLstar(50.0) / 100.0;
48
+ var whitePoint = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : whitePointD65();
49
+ var adaptingLuminance = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 200.0 / Math.PI * yFromLstar(50.0) / 100.0;
49
50
  var backgroundLstar = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 50.0;
50
51
  var surround = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 2.0;
51
52
  var discountingIlluminant = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
@@ -63,7 +64,7 @@ export var ViewingConditions = /*#__PURE__*/function () {
63
64
  var k4 = k * k * k * k;
64
65
  var k4F = 1.0 - k4;
65
66
  var fl = k4 * adaptingLuminance + 0.1 * k4F * k4F * Math.cbrt(5.0 * adaptingLuminance);
66
- var n = utils.yFromLstar(backgroundLstar) / whitePoint[1];
67
+ var n = yFromLstar(backgroundLstar) / whitePoint[1];
67
68
  var z = 1.48 + Math.sqrt(n);
68
69
  var nbb = 0.725 / Math.pow(n, 0.2);
69
70
  var ncb = nbb;
@@ -0,0 +1,8 @@
1
+ /**
2
+ * Returns the standard white point; white on a sunny day.
3
+ *
4
+ * @return The white point
5
+ */
6
+ export function whitePointD65() {
7
+ return [95.047, 100.0, 108.883];
8
+ }
@@ -0,0 +1,16 @@
1
+ import { labInvf } from './lab-invf';
2
+
3
+ /**
4
+ * Converts an L* value to a Y value.
5
+ *
6
+ * L* in L*a*b* and Y in XYZ measure the same quantity, luminance.
7
+ *
8
+ * L* measures perceptual luminance, a linear scale. Y in XYZ
9
+ * measures relative luminance, a logarithmic scale.
10
+ *
11
+ * @param lstar L* in L*a*b*
12
+ * @return Y in XYZ
13
+ */
14
+ export function yFromLstar(lstar) {
15
+ return 100.0 * labInvf((lstar + 16.0) / 116.0);
16
+ }
@@ -0,0 +1,46 @@
1
+ import { isValidHex } from './is-valid-hex';
2
+ export function hexToHSL(hex) {
3
+ if (!isValidHex(hex)) {
4
+ throw new Error('Invalid HEX');
5
+ }
6
+ var r = 0,
7
+ g = 0,
8
+ b = 0;
9
+ if (hex.length === 4) {
10
+ r = '0x' + hex[1] + hex[1];
11
+ g = '0x' + hex[2] + hex[2];
12
+ b = '0x' + hex[3] + hex[3];
13
+ } else if (hex.length === 7) {
14
+ r = '0x' + hex[1] + hex[2];
15
+ g = '0x' + hex[3] + hex[4];
16
+ b = '0x' + hex[5] + hex[6];
17
+ }
18
+ // Then to HSL
19
+ r /= 255;
20
+ g /= 255;
21
+ b /= 255;
22
+ var cmin = Math.min(r, g, b),
23
+ cmax = Math.max(r, g, b),
24
+ delta = cmax - cmin,
25
+ h = 0,
26
+ s = 0,
27
+ l = 0;
28
+ if (delta === 0) {
29
+ h = 0;
30
+ } else if (cmax === r) {
31
+ h = (g - b) / delta % 6;
32
+ } else if (cmax === g) {
33
+ h = (b - r) / delta + 2;
34
+ } else {
35
+ h = (r - g) / delta + 4;
36
+ }
37
+ h = Math.round(h * 60);
38
+ if (h < 0) {
39
+ h += 360;
40
+ }
41
+ l = (cmax + cmin) / 2;
42
+ s = delta === 0 ? 0 : delta / (1 - Math.abs(2 * l - 1));
43
+ s = +(s * 100).toFixed(1);
44
+ l = +(l * 100).toFixed(1);
45
+ return [h, s, l];
46
+ }
@@ -0,0 +1,14 @@
1
+ import { getAlpha } from './get-alpha';
2
+ import { isValidHex } from './is-valid-hex';
3
+ export function hexToRgbA(hex) {
4
+ if (!isValidHex(hex)) {
5
+ throw new Error('Invalid HEX');
6
+ }
7
+ var c;
8
+ c = hex.substring(1).split('');
9
+ if (c.length === 3) {
10
+ c = [c[0], c[0], c[1], c[1], c[2], c[2]];
11
+ }
12
+ c = '0x' + c.join('');
13
+ return [c >> 16 & 255, c >> 8 & 255, c & 255, getAlpha(hex)];
14
+ }
@@ -0,0 +1,13 @@
1
+ import { isValidHex } from './is-valid-hex';
2
+ export function hexToRgb(hex) {
3
+ if (!isValidHex(hex)) {
4
+ throw new Error('Invalid HEX');
5
+ }
6
+ var c;
7
+ c = hex.substring(1).split('');
8
+ if (c.length === 3) {
9
+ c = [c[0], c[0], c[1], c[1], c[2], c[2]];
10
+ }
11
+ c = '0x' + c.join('');
12
+ return [c >> 16 & 255, c >> 8 & 255, c & 255];
13
+ }
@@ -0,0 +1,4 @@
1
+ // valid hex color with 4, 6 or 8 digits
2
+ export var isValidHex = function isValidHex(hex) {
3
+ return /^#([A-Fa-f0-9]{3,4}){1,2}$/.test(hex);
4
+ };
@@ -4,16 +4,16 @@ import themeImportMap from '../artifacts/theme-import-map';
4
4
  export var loadThemeCss = /*#__PURE__*/function () {
5
5
  var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(themeId) {
6
6
  var _yield$themeImportMap, themeCss;
7
- return _regeneratorRuntime.wrap(function _callee$(_context) {
7
+ return _regeneratorRuntime.wrap(function (_context) {
8
8
  while (1) switch (_context.prev = _context.next) {
9
9
  case 0:
10
- _context.next = 2;
10
+ _context.next = 1;
11
11
  return themeImportMap[themeId]();
12
- case 2:
12
+ case 1:
13
13
  _yield$themeImportMap = _context.sent;
14
14
  themeCss = _yield$themeImportMap.default;
15
15
  return _context.abrupt("return", themeCss);
16
- case 5:
16
+ case 2:
17
17
  case "end":
18
18
  return _context.stop();
19
19
  }
@@ -0,0 +1,11 @@
1
+ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
+ import tokens from '../artifacts/token-names';
3
+ export function reduceTokenMap(tokenMap, themeRamp) {
4
+ return Object.entries(tokenMap).reduce(function (acc, _ref) {
5
+ var _ref2 = _slicedToArray(_ref, 2),
6
+ key = _ref2[0],
7
+ value = _ref2[1];
8
+ var cssVar = tokens[key];
9
+ return cssVar ? "".concat(acc, "\n ").concat(cssVar, ": ").concat(typeof value === 'string' ? value : themeRamp[value], ";") : acc;
10
+ }, '');
11
+ }
@@ -0,0 +1,18 @@
1
+ export function rgbToLab(rgb) {
2
+ var r = rgb[0] / 255,
3
+ g = rgb[1] / 255,
4
+ b = rgb[2] / 255,
5
+ x,
6
+ y,
7
+ z;
8
+ r = r > 0.04045 ? Math.pow((r + 0.055) / 1.055, 2.4) : r / 12.92;
9
+ g = g > 0.04045 ? Math.pow((g + 0.055) / 1.055, 2.4) : g / 12.92;
10
+ b = b > 0.04045 ? Math.pow((b + 0.055) / 1.055, 2.4) : b / 12.92;
11
+ x = (r * 0.4124 + g * 0.3576 + b * 0.1805) / 0.95047;
12
+ y = (r * 0.2126 + g * 0.7152 + b * 0.0722) / 1.0;
13
+ z = (r * 0.0193 + g * 0.1192 + b * 0.9505) / 1.08883;
14
+ x = x > 0.008856 ? Math.pow(x, 1 / 3) : 7.787 * x + 16 / 116;
15
+ y = y > 0.008856 ? Math.pow(y, 1 / 3) : 7.787 * y + 16 / 116;
16
+ z = z > 0.008856 ? Math.pow(z, 1 / 3) : 7.787 * z + 16 / 116;
17
+ return [116 * y - 16, 500 * (x - y), 200 * (y - z)];
18
+ }
@@ -5,30 +5,30 @@ import { loadThemeCss } from './load-theme-css';
5
5
  export var loadAndAppendThemeCss = /*#__PURE__*/function () {
6
6
  var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(themeId) {
7
7
  var themeCss, style;
8
- return _regeneratorRuntime.wrap(function _callee$(_context) {
8
+ return _regeneratorRuntime.wrap(function (_context) {
9
9
  while (1) switch (_context.prev = _context.next) {
10
10
  case 0:
11
11
  if (!document.head.querySelector("style[".concat(THEME_DATA_ATTRIBUTE, "=\"").concat(themeId, "\"]:not([").concat(CUSTOM_THEME_ATTRIBUTE, "])"))) {
12
- _context.next = 2;
12
+ _context.next = 1;
13
13
  break;
14
14
  }
15
15
  return _context.abrupt("return");
16
- case 2:
16
+ case 1:
17
17
  if (themeId) {
18
- _context.next = 4;
18
+ _context.next = 2;
19
19
  break;
20
20
  }
21
21
  return _context.abrupt("return");
22
- case 4:
23
- _context.next = 6;
22
+ case 2:
23
+ _context.next = 3;
24
24
  return loadThemeCss(themeId);
25
- case 6:
25
+ case 3:
26
26
  themeCss = _context.sent;
27
27
  style = document.createElement('style');
28
28
  style.textContent = themeCss;
29
29
  style.dataset.theme = themeId;
30
30
  document.head.appendChild(style);
31
- case 11:
31
+ case 4:
32
32
  case "end":
33
33
  return _context.stop();
34
34
  }
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
3
- * @codegen <<SignedSource::3ab6d06ceee07a33f01831ba39d1781a>>
3
+ * @codegen <<SignedSource::53794f446833e9543b9fc09809fc6844>>
4
4
  * @codegenCommand yarn build tokens
5
5
  */
6
6
  type TokenValue = string | number;