react-fontpicker-ts 0.1.0 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (250) hide show
  1. package/README.md +4 -109
  2. package/dist/index.css +3277 -3788
  3. package/dist/index.css.map +1 -1
  4. package/dist/index.d.ts.map +1 -1
  5. package/dist/index.js +836 -674
  6. package/dist/index.js.map +1 -1
  7. package/dist/index.mjs +838 -671
  8. package/dist/index.mjs.map +1 -1
  9. package/dist/sprite.1.1.5x-IEN72JY6.png +0 -0
  10. package/dist/sprite.1.1x-TBCR3GHG.png +0 -0
  11. package/dist/sprite.1.2x-7DLPF4QI.png +0 -0
  12. package/dist/sprite.2.1.5x-BTV2IYQE.png +0 -0
  13. package/dist/sprite.2.1x-LMLU3WAY.png +0 -0
  14. package/dist/sprite.2.2x-GLHW3CGI.png +0 -0
  15. package/dist/sprite.3.1.5x-APCYMH2U.png +0 -0
  16. package/dist/sprite.3.1x-4P6LGCUY.png +0 -0
  17. package/dist/sprite.3.2x-TXTVEISQ.png +0 -0
  18. package/dist/sprite.4.1.5x-QHIEK3EL.png +0 -0
  19. package/dist/sprite.4.1x-CKFO5N5Y.png +0 -0
  20. package/dist/sprite.4.2x-M7QAUGJM.png +0 -0
  21. package/dist/sprite.5.1.5x-FGGQRINX.png +0 -0
  22. package/dist/sprite.5.1x-7BMSHF5E.png +0 -0
  23. package/dist/sprite.5.2x-6GGR2CKH.png +0 -0
  24. package/dist/sprite.6.1.5x-RDOEAOLD.png +0 -0
  25. package/dist/sprite.6.1x-GJO4G432.png +0 -0
  26. package/dist/sprite.6.2x-P5P3ZGLE.png +0 -0
  27. package/dist/sprite.7.1.5x-NOP4JY5I.png +0 -0
  28. package/dist/sprite.7.1x-27V2WF2K.png +0 -0
  29. package/dist/sprite.7.2x-ZHKWVQ4L.png +0 -0
  30. package/dist/sprite.8.1.5x-J3A7XQVH.png +0 -0
  31. package/dist/sprite.8.1x-ZTY27DI3.png +0 -0
  32. package/dist/sprite.8.2x-PK3I6JFC.png +0 -0
  33. package/dist/src/components/FontPicker.d.ts +4 -3
  34. package/dist/src/components/FontPicker.d.ts.map +1 -1
  35. package/dist/src/components/FontPreviews.d.ts +7 -0
  36. package/dist/src/components/FontPreviews.d.ts.map +1 -0
  37. package/package.json +42 -22
  38. package/dist/sprite.1.1.5x-XMWDUN3B.png +0 -0
  39. package/dist/sprite.1.1x-HDD5SCOX.png +0 -0
  40. package/dist/sprite.1.2x-R5OZY447.png +0 -0
  41. package/dist/sprite.10.1.5x-NKFUPOTH.png +0 -0
  42. package/dist/sprite.10.1x-N74JTAKW.png +0 -0
  43. package/dist/sprite.10.2x-XVSCEJWZ.png +0 -0
  44. package/dist/sprite.11.1.5x-R3M3D3TB.png +0 -0
  45. package/dist/sprite.11.1x-7SYW6ANG.png +0 -0
  46. package/dist/sprite.11.2x-OXV2QAU2.png +0 -0
  47. package/dist/sprite.12.1.5x-RK5K5CBC.png +0 -0
  48. package/dist/sprite.12.1x-2UXSH2BC.png +0 -0
  49. package/dist/sprite.12.2x-ILRYIKLL.png +0 -0
  50. package/dist/sprite.13.1.5x-ZVKWAYBW.png +0 -0
  51. package/dist/sprite.13.1x-W35QRJN6.png +0 -0
  52. package/dist/sprite.13.2x-6QDJKTFQ.png +0 -0
  53. package/dist/sprite.14.1.5x-YQ5TVP4X.png +0 -0
  54. package/dist/sprite.14.1x-P62F5ZHB.png +0 -0
  55. package/dist/sprite.14.2x-FJMFBXNN.png +0 -0
  56. package/dist/sprite.15.1.5x-RSJTKGXJ.png +0 -0
  57. package/dist/sprite.15.1x-VT6OXOD4.png +0 -0
  58. package/dist/sprite.15.2x-O6JPUDO5.png +0 -0
  59. package/dist/sprite.16.1.5x-IF5CXL2K.png +0 -0
  60. package/dist/sprite.16.1x-BH3FBEAS.png +0 -0
  61. package/dist/sprite.16.2x-GWMKGITZ.png +0 -0
  62. package/dist/sprite.17.1.5x-VZ4PAF6Q.png +0 -0
  63. package/dist/sprite.17.1x-NZ7X6YT5.png +0 -0
  64. package/dist/sprite.17.2x-6XQTSIXG.png +0 -0
  65. package/dist/sprite.18.1.5x-SWHUCEVQ.png +0 -0
  66. package/dist/sprite.18.1x-57L6JD6F.png +0 -0
  67. package/dist/sprite.18.2x-WWYT5NSE.png +0 -0
  68. package/dist/sprite.19.1.5x-3RQQUIO3.png +0 -0
  69. package/dist/sprite.19.1x-3LJ7M6AR.png +0 -0
  70. package/dist/sprite.19.2x-IK6T6HLQ.png +0 -0
  71. package/dist/sprite.2.1.5x-K5NNDIW3.png +0 -0
  72. package/dist/sprite.2.1x-6JLC6P3G.png +0 -0
  73. package/dist/sprite.2.2x-265H7CFZ.png +0 -0
  74. package/dist/sprite.20.1.5x-JXDIFNZH.png +0 -0
  75. package/dist/sprite.20.1x-XNU2TJ6Q.png +0 -0
  76. package/dist/sprite.20.2x-XOZTSZTY.png +0 -0
  77. package/dist/sprite.21.1.5x-NPYIH4LB.png +0 -0
  78. package/dist/sprite.21.1x-SFNMHFDI.png +0 -0
  79. package/dist/sprite.21.2x-ZLQ2B6IK.png +0 -0
  80. package/dist/sprite.22.1.5x-BEHLPSYK.png +0 -0
  81. package/dist/sprite.22.1x-PGMCTRGT.png +0 -0
  82. package/dist/sprite.22.2x-2X3QIOVQ.png +0 -0
  83. package/dist/sprite.23.1.5x-XQITU43V.png +0 -0
  84. package/dist/sprite.23.1x-C765STXM.png +0 -0
  85. package/dist/sprite.23.2x-RFIXCUQ5.png +0 -0
  86. package/dist/sprite.24.1.5x-AWFULXDG.png +0 -0
  87. package/dist/sprite.24.1x-X3VC4KER.png +0 -0
  88. package/dist/sprite.24.2x-VKZEB2CH.png +0 -0
  89. package/dist/sprite.25.1.5x-J2DDFQLL.png +0 -0
  90. package/dist/sprite.25.1x-XQF4XMN7.png +0 -0
  91. package/dist/sprite.25.2x-QTVFDGUX.png +0 -0
  92. package/dist/sprite.26.1.5x-OJL22L3R.png +0 -0
  93. package/dist/sprite.26.1x-CGQ7DGJJ.png +0 -0
  94. package/dist/sprite.26.2x-H3G2GZUW.png +0 -0
  95. package/dist/sprite.27.1.5x-GAOIHSTF.png +0 -0
  96. package/dist/sprite.27.1x-SOKO7GY2.png +0 -0
  97. package/dist/sprite.27.2x-ITHLNV7Y.png +0 -0
  98. package/dist/sprite.28.1.5x-L6PPUSPI.png +0 -0
  99. package/dist/sprite.28.1x-A7MKNFXG.png +0 -0
  100. package/dist/sprite.28.2x-K77CZFAS.png +0 -0
  101. package/dist/sprite.29.1.5x-NKWAULUW.png +0 -0
  102. package/dist/sprite.29.1x-CDNA2EMC.png +0 -0
  103. package/dist/sprite.29.2x-O3XIGYZ7.png +0 -0
  104. package/dist/sprite.3.1.5x-IJHYR3HX.png +0 -0
  105. package/dist/sprite.3.1x-7WCEQE3K.png +0 -0
  106. package/dist/sprite.3.2x-5BRAAPEV.png +0 -0
  107. package/dist/sprite.30.1.5x-5J52YR4L.png +0 -0
  108. package/dist/sprite.30.1x-O2IEWRXU.png +0 -0
  109. package/dist/sprite.30.2x-HPGJXVZN.png +0 -0
  110. package/dist/sprite.31.1.5x-UJPCJFMG.png +0 -0
  111. package/dist/sprite.31.1x-U2J2WYAY.png +0 -0
  112. package/dist/sprite.31.2x-HKQONG4Z.png +0 -0
  113. package/dist/sprite.32.1.5x-MZ6JDYEM.png +0 -0
  114. package/dist/sprite.32.1x-TP2UTYLR.png +0 -0
  115. package/dist/sprite.32.2x-RZPSV5UX.png +0 -0
  116. package/dist/sprite.33.1.5x-TCAZHHP2.png +0 -0
  117. package/dist/sprite.33.1x-7S6OSG77.png +0 -0
  118. package/dist/sprite.33.2x-TICPWNE4.png +0 -0
  119. package/dist/sprite.34.1.5x-2NTL4MDB.png +0 -0
  120. package/dist/sprite.34.1x-IXYJYOUK.png +0 -0
  121. package/dist/sprite.34.2x-5GUPUSQT.png +0 -0
  122. package/dist/sprite.35.1.5x-7H3ORIFA.png +0 -0
  123. package/dist/sprite.35.1x-EPNBZ6SY.png +0 -0
  124. package/dist/sprite.35.2x-TXYDDKLH.png +0 -0
  125. package/dist/sprite.36.1.5x-JZYN2W6L.png +0 -0
  126. package/dist/sprite.36.1x-IZPAQFY7.png +0 -0
  127. package/dist/sprite.36.2x-QLFTLI4X.png +0 -0
  128. package/dist/sprite.37.1.5x-4JR4JB6C.png +0 -0
  129. package/dist/sprite.37.1x-6HIYOKB6.png +0 -0
  130. package/dist/sprite.37.2x-BJDJQKMI.png +0 -0
  131. package/dist/sprite.38.1.5x-A4MINTST.png +0 -0
  132. package/dist/sprite.38.1x-2ZSFTMRI.png +0 -0
  133. package/dist/sprite.38.2x-QH4TU7B7.png +0 -0
  134. package/dist/sprite.39.1.5x-GLTUGRUY.png +0 -0
  135. package/dist/sprite.39.1x-J3WKKDRT.png +0 -0
  136. package/dist/sprite.39.2x-IGNBAI52.png +0 -0
  137. package/dist/sprite.4.1.5x-MZSU4BIU.png +0 -0
  138. package/dist/sprite.4.1x-K2ZKVXBW.png +0 -0
  139. package/dist/sprite.4.2x-36JMJ5TY.png +0 -0
  140. package/dist/sprite.40.1.5x-KQ4UMFBJ.png +0 -0
  141. package/dist/sprite.40.1x-UAV75KRX.png +0 -0
  142. package/dist/sprite.40.2x-E6HWOLRK.png +0 -0
  143. package/dist/sprite.41.1.5x-2V2IOC5B.png +0 -0
  144. package/dist/sprite.41.1x-S454BCDL.png +0 -0
  145. package/dist/sprite.41.2x-O35F2TH5.png +0 -0
  146. package/dist/sprite.42.1.5x-55VRTVTZ.png +0 -0
  147. package/dist/sprite.42.1x-N5BTF34E.png +0 -0
  148. package/dist/sprite.42.2x-C7GLPHJL.png +0 -0
  149. package/dist/sprite.43.1.5x-7FOQHJZD.png +0 -0
  150. package/dist/sprite.43.1x-SVQ2YYRE.png +0 -0
  151. package/dist/sprite.43.2x-T4LGXBHT.png +0 -0
  152. package/dist/sprite.44.1.5x-ORB33HMT.png +0 -0
  153. package/dist/sprite.44.1x-26CE7BIA.png +0 -0
  154. package/dist/sprite.44.2x-WBXV5LJE.png +0 -0
  155. package/dist/sprite.45.1.5x-CM766AXL.png +0 -0
  156. package/dist/sprite.45.1x-I6HKG3TH.png +0 -0
  157. package/dist/sprite.45.2x-HTJBMJNX.png +0 -0
  158. package/dist/sprite.46.1.5x-FD6HAIAD.png +0 -0
  159. package/dist/sprite.46.1x-7CZZNAHY.png +0 -0
  160. package/dist/sprite.46.2x-RCELUTX4.png +0 -0
  161. package/dist/sprite.47.1.5x-UQEQZOLH.png +0 -0
  162. package/dist/sprite.47.1x-LZIROWHW.png +0 -0
  163. package/dist/sprite.47.2x-JHNRBS6B.png +0 -0
  164. package/dist/sprite.48.1.5x-CF4VLDQ3.png +0 -0
  165. package/dist/sprite.48.1x-37URWHJI.png +0 -0
  166. package/dist/sprite.48.2x-EO5K3WR3.png +0 -0
  167. package/dist/sprite.49.1.5x-ER2M27VD.png +0 -0
  168. package/dist/sprite.49.1x-QL2VV3AJ.png +0 -0
  169. package/dist/sprite.49.2x-U5RDSY6J.png +0 -0
  170. package/dist/sprite.5.1.5x-ME4GYDCA.png +0 -0
  171. package/dist/sprite.5.1x-W2IWAFNP.png +0 -0
  172. package/dist/sprite.5.2x-NCLJRA2R.png +0 -0
  173. package/dist/sprite.50.1.5x-S4Y55SM6.png +0 -0
  174. package/dist/sprite.50.1x-DORVBMXE.png +0 -0
  175. package/dist/sprite.50.2x-QW6UCBLZ.png +0 -0
  176. package/dist/sprite.51.1.5x-GX652CJX.png +0 -0
  177. package/dist/sprite.51.1x-7NDXNDRS.png +0 -0
  178. package/dist/sprite.51.2x-4VRCJBYW.png +0 -0
  179. package/dist/sprite.52.1.5x-ZCK4ZIRH.png +0 -0
  180. package/dist/sprite.52.1x-GHOWEHH7.png +0 -0
  181. package/dist/sprite.52.2x-6BUOP2DB.png +0 -0
  182. package/dist/sprite.53.1.5x-QYANAO2M.png +0 -0
  183. package/dist/sprite.53.1x-S5U5ZDQ2.png +0 -0
  184. package/dist/sprite.53.2x-J4WSXJEA.png +0 -0
  185. package/dist/sprite.54.1.5x-O4DSMMTX.png +0 -0
  186. package/dist/sprite.54.1x-3CA3HGGE.png +0 -0
  187. package/dist/sprite.54.2x-P7BQZS3S.png +0 -0
  188. package/dist/sprite.55.1.5x-HMGBFTI6.png +0 -0
  189. package/dist/sprite.55.1x-CT2NOYGV.png +0 -0
  190. package/dist/sprite.55.2x-GATJVZRT.png +0 -0
  191. package/dist/sprite.56.1.5x-XTQAT7P6.png +0 -0
  192. package/dist/sprite.56.1x-YBQIZY6U.png +0 -0
  193. package/dist/sprite.56.2x-7Y3HHBFF.png +0 -0
  194. package/dist/sprite.57.1.5x-EL7DF7DQ.png +0 -0
  195. package/dist/sprite.57.1x-ISDAJNBK.png +0 -0
  196. package/dist/sprite.57.2x-B3T3RWBJ.png +0 -0
  197. package/dist/sprite.58.1.5x-AB7E3NK7.png +0 -0
  198. package/dist/sprite.58.1x-5STNT7PP.png +0 -0
  199. package/dist/sprite.58.2x-3SUOF7OU.png +0 -0
  200. package/dist/sprite.59.1.5x-Q3QOSJF4.png +0 -0
  201. package/dist/sprite.59.1x-SJEVMFTL.png +0 -0
  202. package/dist/sprite.59.2x-CA2OYCYC.png +0 -0
  203. package/dist/sprite.6.1.5x-J2HZX7WZ.png +0 -0
  204. package/dist/sprite.6.1x-66ABRCF2.png +0 -0
  205. package/dist/sprite.6.2x-UELS3N4N.png +0 -0
  206. package/dist/sprite.60.1.5x-KUQO36F5.png +0 -0
  207. package/dist/sprite.60.1x-QFJ2HYZK.png +0 -0
  208. package/dist/sprite.60.2x-LZKO5ZIT.png +0 -0
  209. package/dist/sprite.61.1.5x-LN6RYWZK.png +0 -0
  210. package/dist/sprite.61.1x-EPK4BOK3.png +0 -0
  211. package/dist/sprite.61.2x-7JBPKG7R.png +0 -0
  212. package/dist/sprite.62.1.5x-7DSQK4RF.png +0 -0
  213. package/dist/sprite.62.1x-CSP67HCY.png +0 -0
  214. package/dist/sprite.62.2x-I5UD5YZC.png +0 -0
  215. package/dist/sprite.63.1.5x-5ZNCAXSC.png +0 -0
  216. package/dist/sprite.63.1x-7F4VERUU.png +0 -0
  217. package/dist/sprite.63.2x-LSCUFJAM.png +0 -0
  218. package/dist/sprite.64.1.5x-ATA5Q6LX.png +0 -0
  219. package/dist/sprite.64.1x-R2VDRSFT.png +0 -0
  220. package/dist/sprite.64.2x-YD5YI2DI.png +0 -0
  221. package/dist/sprite.65.1.5x-5O7TEWNR.png +0 -0
  222. package/dist/sprite.65.1x-V2BPH7ZR.png +0 -0
  223. package/dist/sprite.65.2x-ST7CS564.png +0 -0
  224. package/dist/sprite.66.1.5x-3KT73X5J.png +0 -0
  225. package/dist/sprite.66.1x-TK25CYYS.png +0 -0
  226. package/dist/sprite.66.2x-Q5Y23QE2.png +0 -0
  227. package/dist/sprite.67.1.5x-4CB2ACPO.png +0 -0
  228. package/dist/sprite.67.1x-AP27GV7V.png +0 -0
  229. package/dist/sprite.67.2x-OLVC2C4A.png +0 -0
  230. package/dist/sprite.68.1.5x-DRIVGXLF.png +0 -0
  231. package/dist/sprite.68.1x-YUI77IJP.png +0 -0
  232. package/dist/sprite.68.2x-QKQ6YI3Y.png +0 -0
  233. package/dist/sprite.69.1.5x-RITPHCT7.png +0 -0
  234. package/dist/sprite.69.1x-PYKOSVZM.png +0 -0
  235. package/dist/sprite.69.2x-6Y7W52SL.png +0 -0
  236. package/dist/sprite.7.1.5x-EGXDBUOU.png +0 -0
  237. package/dist/sprite.7.1x-LUXIWLZC.png +0 -0
  238. package/dist/sprite.7.2x-QXDRQFQV.png +0 -0
  239. package/dist/sprite.70.1.5x-PQQ25DCD.png +0 -0
  240. package/dist/sprite.70.1x-IMJFP6HN.png +0 -0
  241. package/dist/sprite.70.2x-UNFPYHDK.png +0 -0
  242. package/dist/sprite.71.1.5x-NEV4VFNG.png +0 -0
  243. package/dist/sprite.71.1x-QJZ3CDII.png +0 -0
  244. package/dist/sprite.71.2x-RACGFWVF.png +0 -0
  245. package/dist/sprite.8.1.5x-HNTPXNGH.png +0 -0
  246. package/dist/sprite.8.1x-X4QYD7LC.png +0 -0
  247. package/dist/sprite.8.2x-T3RXA3ZV.png +0 -0
  248. package/dist/sprite.9.1.5x-RREHIND2.png +0 -0
  249. package/dist/sprite.9.1x-7PBKZIKE.png +0 -0
  250. package/dist/sprite.9.2x-I4TPORKV.png +0 -0
package/README.md CHANGED
@@ -11,113 +11,8 @@ Forked from https://github.com/Mikk3lRo/vue-fontpicker/
11
11
 
12
12
  # Documentation
13
13
 
14
- Documentation and live demo is available at:
15
- https://ae9is.github.io/react-fontpicker/
16
-
17
- # Installing
18
-
19
- ```bash
20
- # npm
21
- npm i react-fontpicker-ts
22
- # yarn
23
- yarn add react-fontpicker-ts
24
- ```
25
-
26
- Then, import the component and stylesheet:
27
-
28
- ```js
29
- import FontPicker from 'react-fontpicker-ts'
30
- import 'react-fontpicker-ts/dist/index.css'
31
- ```
32
-
33
- # Styling
34
-
35
- See css classnames in: [src/components/FontPicker.css](https://github.com/ae9is/react-fontpicker/tree/main/src/components/FontPicker.css)
36
-
37
- # Project structure
38
-
39
- The live demo is a Vite app you can run yourself via `npm run dev` and which builds to `/docs`. Uses `tsconfig.json`.
40
-
41
- The font picker component itself builds via `tsup` (i.e. `esbuild`) to `/dist` with type definitions generated via `tsc` according to `tsconfig.types.json`.
42
-
43
- The font preview generation PHP script downloads font files to `/font-cache` and builds font image previews to `/font-preview`.
44
-
45
- # Performance
46
-
47
- The font picker previews work by loading font preview image files in CSS. The fonts are split across many image files for faster initial preview.
48
-
49
- Once the dropdown select is opened, all the preview image files are retrieved enabling smooth scrolling and searching.
50
-
51
- No requests are made to the Google fonts API unless the font picker is set to autoload, in which case the currently selected font is appended to the page header. (The previously selected font link is _not_ removed.)
52
-
53
- For example:
54
-
55
- ```html
56
- <head>
57
- ...
58
- <link
59
- rel="stylesheet"
60
- id="google-font-rock_salt-all"
61
- href="https://fonts.googleapis.com/css2?family=Rock Salt:ital,wght@0,400&amp;display=swap"
62
- />
63
- </head>
64
- ```
65
-
66
- The big trade-off of this approach is that the component's bundle is quite large due to all the font image previews (~14 MB). Only a subset of this is served depending on the client's device pixel ratio:
67
-
68
- - 2x &rarr; 6.2 MB
69
- - 1.5x &rarr; 4.4 MB
70
- - 1x &rarr; 2.7 MB
71
-
72
- For a different font picker following an on demand approach, check out: [https://github.com/samuelmeuli/font-picker-react](https://github.com/samuelmeuli/font-picker-react)
14
+ Source and documentation:
15
+ https://github.com/ae9is/react-fontpicker
73
16
 
74
- `font-picker-react` requires a Google API key, and works best at the default font limit of 50 (fonts to choose from).
75
-
76
- # Building font previews
77
-
78
- _Note: most users shouldn't need to rebuild the font previews, but this section is included for convenience if you need to grab the latest fonts or edit the previews._
79
-
80
- ### 1\. Setup PHP
81
-
82
- Setup a PHP installation with the GD image processing library. The `php-cli` package lets you run PHP scripts without needing a server.
83
-
84
- ```bash
85
- # Ubuntu 22.04
86
- apt install php-cli php-gd
87
- ```
88
-
89
- ### 2\. Google API key
90
-
91
- Get a Google API key here [https://developers.google.com/fonts/docs/developer_api#APIKey](https://developers.google.com/fonts/docs/developer_api#APIKey) and create a new file called `GOOGLE_API_KEY` in the same directory as the `build-font-previews.php` script.
92
-
93
- ### 3\. Font preview script
94
-
95
- ### All Google fonts
96
-
97
- To generate font previews for all currently available Google fonts (latin font families only, minus `Kumar One`).
98
-
99
- ```bash
100
- php ./build-font-previews.php
101
- # or npm alias:
102
- npm run build-font-previews
103
- ```
104
-
105
- _Note: For 1410 fonts, budget 20-30 minutes and 700 MB to download all the fonts. Compiling the image previews themselves should be less than a minute. When re-running, the script only retrieves new font info if it's older than 1 day and skips downloading cached fonts._
106
-
107
- ### Custom fonts
108
-
109
- To generate font previews for custom fonts you'll need some info about the fonts and paths to the font file downloaded in TTF format.
110
-
111
- ```bash
112
- php build-font-previews.php "font-name|font-category|font-variants-info|font-file" "font-name-2..."
113
- ```
114
-
115
- Where font-variants-info is an array of values like 0,400 and 1,700 joined by +.
116
- The first value denotes a normal (0) or italic (1) font.
117
- The second value is the font weight (i.e. 100 = thin, 400 = normal, 700 = bold, 900 = heavy).
118
-
119
- For example:
120
-
121
- ```bash
122
- php build-font-previews.php "FontName|sans-serif|0,400+0,700+1,400+1,700|/path/to/font.ttf" "Font2|serif|0,400|/path/to/font2.ttf"
123
- ```
17
+ Live demo including usage:
18
+ https://ae9is.github.io/react-fontpicker/