@coorpacademy/components 11.30.1 → 11.32.1-alpha.16

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 (227) hide show
  1. package/es/atom/button-link/index.d.ts +1 -0
  2. package/es/atom/button-link/index.d.ts.map +1 -1
  3. package/es/atom/button-link/index.js +21 -12
  4. package/es/atom/button-link/index.js.map +1 -1
  5. package/es/atom/button-link/types.d.ts +11 -1
  6. package/es/atom/button-link/types.d.ts.map +1 -1
  7. package/es/atom/button-link/types.js +1 -0
  8. package/es/atom/button-link/types.js.map +1 -1
  9. package/es/atom/chip/index.d.ts +37 -0
  10. package/es/atom/chip/index.d.ts.map +1 -0
  11. package/es/atom/chip/index.js +85 -0
  12. package/es/atom/chip/index.js.map +1 -0
  13. package/es/atom/chip/style.css +65 -0
  14. package/es/atom/chips/index.d.ts.map +1 -1
  15. package/es/atom/chips/index.js +1 -0
  16. package/es/atom/chips/index.js.map +1 -1
  17. package/es/atom/icon/index.js +2 -2
  18. package/es/atom/icon/index.js.map +1 -1
  19. package/es/molecule/base-modal/index.d.ts +33 -0
  20. package/es/molecule/base-modal/index.d.ts.map +1 -0
  21. package/es/molecule/base-modal/index.js +142 -0
  22. package/es/molecule/base-modal/index.js.map +1 -0
  23. package/es/molecule/base-modal/style.css +125 -0
  24. package/es/molecule/bulk-progress-bar/index.d.ts.map +1 -1
  25. package/es/molecule/bulk-progress-bar/index.js +6 -3
  26. package/es/molecule/bulk-progress-bar/index.js.map +1 -1
  27. package/es/molecule/cm-popin/types.d.ts +2 -0
  28. package/es/molecule/cm-popin/types.d.ts.map +1 -1
  29. package/es/molecule/expandible-actionable-table/index.d.ts +1 -0
  30. package/es/molecule/expandible-actionable-table/index.d.ts.map +1 -1
  31. package/es/molecule/expandible-actionable-table/types.d.ts +1 -0
  32. package/es/molecule/expandible-actionable-table/types.d.ts.map +1 -1
  33. package/es/molecule/learner-skill-card/index.d.ts +23 -0
  34. package/es/molecule/learner-skill-card/index.d.ts.map +1 -0
  35. package/es/molecule/learner-skill-card/index.js +164 -0
  36. package/es/molecule/learner-skill-card/index.js.map +1 -0
  37. package/es/molecule/learner-skill-card/style.css +119 -0
  38. package/es/molecule/learning-profile-radar-chart/index.d.ts +1 -1
  39. package/es/molecule/learning-profile-radar-chart/index.d.ts.map +1 -1
  40. package/es/molecule/learning-profile-radar-chart/index.js +16 -11
  41. package/es/molecule/learning-profile-radar-chart/index.js.map +1 -1
  42. package/es/molecule/learning-profile-radar-chart/types.d.ts +7 -1
  43. package/es/molecule/learning-profile-radar-chart/types.d.ts.map +1 -1
  44. package/es/molecule/learning-profile-radar-chart/types.js.map +1 -1
  45. package/es/molecule/questions/template/index.d.ts +1 -1
  46. package/es/molecule/quick-access-card/index.d.ts.map +1 -1
  47. package/es/molecule/quick-access-card/index.js +5 -1
  48. package/es/molecule/quick-access-card/index.js.map +1 -1
  49. package/es/molecule/skill-picker-modal/index.d.ts +23 -0
  50. package/es/molecule/skill-picker-modal/index.d.ts.map +1 -0
  51. package/es/molecule/skill-picker-modal/index.js +138 -0
  52. package/es/molecule/skill-picker-modal/index.js.map +1 -0
  53. package/es/molecule/skill-picker-modal/style.css +28 -0
  54. package/es/molecule/skills-chart-side-information-item/index.d.ts +1 -1
  55. package/es/molecule/skills-chart-side-information-item/index.js +1 -1
  56. package/es/molecule/skills-chart-side-information-item/index.js.map +1 -1
  57. package/es/molecule/skills-chart-side-information-panel/index.d.ts +1 -1
  58. package/es/organism/list-items/index.d.ts +2 -0
  59. package/es/organism/setup-header/index.d.ts +4 -0
  60. package/es/organism/wizard-contents/index.d.ts +3 -0
  61. package/es/template/app-player/loading/index.d.ts +2 -0
  62. package/es/template/app-player/player/index.d.ts +4 -0
  63. package/es/template/app-player/player/slides/index.d.ts +2 -0
  64. package/es/template/app-player/player/slides/index.d.ts.map +1 -1
  65. package/es/template/app-player/popin-correction/index.d.ts +2 -0
  66. package/es/template/app-player/popin-correction/index.d.ts.map +1 -1
  67. package/es/template/app-player/popin-end/index.d.ts +2 -0
  68. package/es/template/app-review/index.d.ts +2 -0
  69. package/es/template/app-review/index.d.ts.map +1 -1
  70. package/es/template/app-review/player/prop-types.d.ts +2 -0
  71. package/es/template/app-review/player/prop-types.d.ts.map +1 -1
  72. package/es/template/app-review/prop-types.d.ts +2 -0
  73. package/es/template/app-review/prop-types.d.ts.map +1 -1
  74. package/es/template/back-office/brand-create/index.d.ts +4 -0
  75. package/es/template/back-office/brand-create/index.d.ts.map +1 -1
  76. package/es/template/back-office/brand-list/index.d.ts +4 -0
  77. package/es/template/back-office/brand-list/index.d.ts.map +1 -1
  78. package/es/template/back-office/brand-update/index.d.ts +11 -0
  79. package/es/template/back-office/dashboard-preview/index.d.ts +4 -0
  80. package/es/template/back-office/layout/index.d.ts +4 -0
  81. package/es/template/back-office/layout/index.d.ts.map +1 -1
  82. package/es/template/common/dashboard/index.d.ts +4 -0
  83. package/es/template/common/search-page/index.d.ts +2 -0
  84. package/es/template/external-course/index.d.ts +2 -0
  85. package/es/template/mobile-login/welcome/index.native.d.ts.map +1 -1
  86. package/es/template/mobile-login/welcome/index.native.js +5 -1
  87. package/es/template/mobile-login/welcome/index.native.js.map +1 -1
  88. package/es/template/my-learning/index.d.ts +34 -0
  89. package/es/template/my-learning/index.d.ts.map +1 -0
  90. package/es/template/my-learning/index.js +354 -0
  91. package/es/template/my-learning/index.js.map +1 -0
  92. package/es/template/my-learning/style.css +179 -0
  93. package/es/variables/colors.d.ts +7 -7
  94. package/es/variables/colors.d.ts.map +1 -1
  95. package/es/variables/colors.js +2 -1
  96. package/es/variables/colors.js.map +1 -1
  97. package/es/variables/theme.native.d.ts.map +1 -1
  98. package/es/variables/theme.native.js +4 -1
  99. package/es/variables/theme.native.js.map +1 -1
  100. package/lib/atom/button-link/index.d.ts +1 -0
  101. package/lib/atom/button-link/index.d.ts.map +1 -1
  102. package/lib/atom/button-link/index.js +22 -12
  103. package/lib/atom/button-link/index.js.map +1 -1
  104. package/lib/atom/button-link/types.d.ts +11 -1
  105. package/lib/atom/button-link/types.d.ts.map +1 -1
  106. package/lib/atom/button-link/types.js +1 -0
  107. package/lib/atom/button-link/types.js.map +1 -1
  108. package/lib/atom/chip/index.d.ts +37 -0
  109. package/lib/atom/chip/index.d.ts.map +1 -0
  110. package/lib/atom/chip/index.js +109 -0
  111. package/lib/atom/chip/index.js.map +1 -0
  112. package/lib/atom/chip/style.css +65 -0
  113. package/lib/atom/chips/index.d.ts.map +1 -1
  114. package/lib/atom/chips/index.js +1 -0
  115. package/lib/atom/chips/index.js.map +1 -1
  116. package/lib/atom/icon/index.js +2 -2
  117. package/lib/atom/icon/index.js.map +1 -1
  118. package/lib/molecule/base-modal/index.d.ts +33 -0
  119. package/lib/molecule/base-modal/index.d.ts.map +1 -0
  120. package/lib/molecule/base-modal/index.js +158 -0
  121. package/lib/molecule/base-modal/index.js.map +1 -0
  122. package/lib/molecule/base-modal/style.css +125 -0
  123. package/lib/molecule/bulk-progress-bar/index.d.ts.map +1 -1
  124. package/lib/molecule/bulk-progress-bar/index.js +7 -3
  125. package/lib/molecule/bulk-progress-bar/index.js.map +1 -1
  126. package/lib/molecule/cm-popin/types.d.ts +2 -0
  127. package/lib/molecule/cm-popin/types.d.ts.map +1 -1
  128. package/lib/molecule/expandible-actionable-table/index.d.ts +1 -0
  129. package/lib/molecule/expandible-actionable-table/index.d.ts.map +1 -1
  130. package/lib/molecule/expandible-actionable-table/types.d.ts +1 -0
  131. package/lib/molecule/expandible-actionable-table/types.d.ts.map +1 -1
  132. package/lib/molecule/learner-skill-card/index.d.ts +23 -0
  133. package/lib/molecule/learner-skill-card/index.d.ts.map +1 -0
  134. package/lib/molecule/learner-skill-card/index.js +182 -0
  135. package/lib/molecule/learner-skill-card/index.js.map +1 -0
  136. package/lib/molecule/learner-skill-card/style.css +119 -0
  137. package/lib/molecule/learning-profile-radar-chart/index.d.ts +1 -1
  138. package/lib/molecule/learning-profile-radar-chart/index.d.ts.map +1 -1
  139. package/lib/molecule/learning-profile-radar-chart/index.js +16 -11
  140. package/lib/molecule/learning-profile-radar-chart/index.js.map +1 -1
  141. package/lib/molecule/learning-profile-radar-chart/types.d.ts +7 -1
  142. package/lib/molecule/learning-profile-radar-chart/types.d.ts.map +1 -1
  143. package/lib/molecule/learning-profile-radar-chart/types.js.map +1 -1
  144. package/lib/molecule/questions/template/index.d.ts +1 -1
  145. package/lib/molecule/quick-access-card/index.d.ts.map +1 -1
  146. package/lib/molecule/quick-access-card/index.js +7 -1
  147. package/lib/molecule/quick-access-card/index.js.map +1 -1
  148. package/lib/molecule/skill-picker-modal/index.d.ts +23 -0
  149. package/lib/molecule/skill-picker-modal/index.d.ts.map +1 -0
  150. package/lib/molecule/skill-picker-modal/index.js +156 -0
  151. package/lib/molecule/skill-picker-modal/index.js.map +1 -0
  152. package/lib/molecule/skill-picker-modal/style.css +28 -0
  153. package/lib/molecule/skills-chart-side-information-item/index.d.ts +1 -1
  154. package/lib/molecule/skills-chart-side-information-item/index.js +1 -1
  155. package/lib/molecule/skills-chart-side-information-item/index.js.map +1 -1
  156. package/lib/molecule/skills-chart-side-information-panel/index.d.ts +1 -1
  157. package/lib/organism/list-items/index.d.ts +2 -0
  158. package/lib/organism/setup-header/index.d.ts +4 -0
  159. package/lib/organism/wizard-contents/index.d.ts +3 -0
  160. package/lib/template/app-player/loading/index.d.ts +2 -0
  161. package/lib/template/app-player/player/index.d.ts +4 -0
  162. package/lib/template/app-player/player/slides/index.d.ts +2 -0
  163. package/lib/template/app-player/player/slides/index.d.ts.map +1 -1
  164. package/lib/template/app-player/popin-correction/index.d.ts +2 -0
  165. package/lib/template/app-player/popin-correction/index.d.ts.map +1 -1
  166. package/lib/template/app-player/popin-end/index.d.ts +2 -0
  167. package/lib/template/app-review/index.d.ts +2 -0
  168. package/lib/template/app-review/index.d.ts.map +1 -1
  169. package/lib/template/app-review/player/prop-types.d.ts +2 -0
  170. package/lib/template/app-review/player/prop-types.d.ts.map +1 -1
  171. package/lib/template/app-review/prop-types.d.ts +2 -0
  172. package/lib/template/app-review/prop-types.d.ts.map +1 -1
  173. package/lib/template/back-office/brand-create/index.d.ts +4 -0
  174. package/lib/template/back-office/brand-create/index.d.ts.map +1 -1
  175. package/lib/template/back-office/brand-list/index.d.ts +4 -0
  176. package/lib/template/back-office/brand-list/index.d.ts.map +1 -1
  177. package/lib/template/back-office/brand-update/index.d.ts +11 -0
  178. package/lib/template/back-office/dashboard-preview/index.d.ts +4 -0
  179. package/lib/template/back-office/layout/index.d.ts +4 -0
  180. package/lib/template/back-office/layout/index.d.ts.map +1 -1
  181. package/lib/template/common/dashboard/index.d.ts +4 -0
  182. package/lib/template/common/search-page/index.d.ts +2 -0
  183. package/lib/template/external-course/index.d.ts +2 -0
  184. package/lib/template/mobile-login/welcome/index.native.d.ts.map +1 -1
  185. package/lib/template/mobile-login/welcome/index.native.js +7 -1
  186. package/lib/template/mobile-login/welcome/index.native.js.map +1 -1
  187. package/lib/template/my-learning/index.d.ts +34 -0
  188. package/lib/template/my-learning/index.d.ts.map +1 -0
  189. package/lib/template/my-learning/index.js +375 -0
  190. package/lib/template/my-learning/index.js.map +1 -0
  191. package/lib/template/my-learning/style.css +179 -0
  192. package/lib/variables/colors.d.ts +7 -7
  193. package/lib/variables/colors.d.ts.map +1 -1
  194. package/lib/variables/colors.js +2 -1
  195. package/lib/variables/colors.js.map +1 -1
  196. package/lib/variables/theme.native.d.ts.map +1 -1
  197. package/lib/variables/theme.native.js +4 -1
  198. package/lib/variables/theme.native.js.map +1 -1
  199. package/locales/bs/global.json +7 -1
  200. package/locales/cs/global.json +7 -1
  201. package/locales/de/global.json +7 -1
  202. package/locales/en/global.json +31 -0
  203. package/locales/es/global.json +6 -0
  204. package/locales/et/global.json +7 -1
  205. package/locales/fi/global.json +7 -1
  206. package/locales/fr/global.json +6 -0
  207. package/locales/hr/global.json +7 -1
  208. package/locales/hu/global.json +7 -1
  209. package/locales/hy/global.json +7 -1
  210. package/locales/it/global.json +6 -0
  211. package/locales/ja/global.json +7 -1
  212. package/locales/ko/global.json +7 -1
  213. package/locales/nl/global.json +6 -0
  214. package/locales/pl/global.json +7 -1
  215. package/locales/pt/global.json +7 -1
  216. package/locales/ro/global.json +7 -1
  217. package/locales/ru/global.json +7 -1
  218. package/locales/sk/global.json +7 -1
  219. package/locales/sl/global.json +7 -1
  220. package/locales/sv/global.json +7 -1
  221. package/locales/tl/global.json +7 -1
  222. package/locales/tr/global.json +7 -1
  223. package/locales/uk/global.json +7 -1
  224. package/locales/vi/global.json +7 -1
  225. package/locales/zh/global.json +7 -1
  226. package/locales/zh_TW/global.json +7 -1
  227. package/package.json +3 -3
@@ -1 +1 @@
1
- {"version":3,"file":"theme.native.js","names":["COLORS","HTML_ANCHOR_TEXT_COLOR","defaultTheme","colors","border","gray","extra","lighter","light","lightMedium","medium","dark","extraDark","text","primary","secondary","cta","negative","positive","white","black","battle","notification","salmon","podcast","background","cm_grey_800","spacing","micro","tiny","small","base","large","xlarge","radius","common","card","regular","search","button","thumbnail","fontWeight","semiBold","bold","extraBold","fontSize","extraSmall","xxlarge","xxxlarge","letterSpacing","header"],"sources":["../../src/variables/theme.native.ts"],"sourcesContent":["import {TextStyle} from 'react-native';\nimport {COLORS} from './colors';\n\nexport type SpaceType = 'micro' | 'tiny' | 'small' | 'base' | 'medium' | 'large' | 'xlarge';\n\nexport const HTML_ANCHOR_TEXT_COLOR = '#002BDB';\n\nexport type Colors = {\n border: string;\n gray: {\n extra: string;\n light: string;\n lighter: string;\n lightMedium: string;\n medium: string;\n dark: string;\n extraDark: string;\n };\n podcast: {\n background: string;\n primary: string;\n };\n text: {\n primary: string;\n secondary: string;\n };\n cta: string;\n negative: string;\n positive: string;\n white: string;\n black: string;\n battle: string;\n notification: string;\n salmon: string;\n};\n\nexport type Theme = {\n colors: Colors;\n spacing: {\n micro: number;\n tiny: number;\n small: number;\n base: number;\n medium: number;\n large: number;\n xlarge: number;\n };\n radius: {\n button: number;\n common: number;\n card: number;\n medium: number;\n regular: number;\n search: number;\n thumbnail: number;\n };\n fontWeight: {\n regular: TextStyle['fontWeight'];\n semiBold: TextStyle['fontWeight'];\n bold: TextStyle['fontWeight'];\n extraBold: TextStyle['fontWeight'];\n };\n fontSize: {\n extraSmall: TextStyle['fontSize'];\n small: TextStyle['fontSize'];\n medium: TextStyle['fontSize'];\n regular: TextStyle['fontSize'];\n large: TextStyle['fontSize'];\n xlarge: TextStyle['fontSize'];\n xxlarge: TextStyle['fontSize'];\n xxxlarge: TextStyle['fontSize'];\n };\n letterSpacing: {\n header: number;\n };\n};\n\nconst defaultTheme: Theme = {\n colors: {\n border: 'rgba(0, 0, 0, 0.1)',\n gray: {\n extra: '#FAFAFA',\n lighter: '#F4F4F5',\n light: '#ededed',\n lightMedium: '#CFD8DC',\n medium: '#90A4AE',\n dark: '#546E7A',\n extraDark: '#323232'\n },\n text: {\n primary: '#06265B',\n secondary: '#FFFFFF'\n },\n cta: '#0061FF',\n negative: COLORS.negative,\n positive: COLORS.positive,\n white: '#FFFFFF',\n black: '#14171A',\n battle: '#FFDE03',\n notification: '#FF7043',\n salmon: '#FDE2E5',\n podcast: {\n background: COLORS.cm_grey_800,\n primary: '#FF541F'\n }\n },\n spacing: {\n micro: 4,\n tiny: 8,\n small: 16,\n base: 24,\n medium: 32,\n large: 48,\n xlarge: 64\n },\n radius: {\n common: 3,\n card: 5,\n regular: 8,\n medium: 12,\n search: 24,\n button: 32,\n thumbnail: 1000\n },\n fontWeight: {\n regular: '400',\n semiBold: '500',\n bold: '700',\n extraBold: '900'\n },\n fontSize: {\n extraSmall: 10,\n small: 12,\n medium: 13,\n regular: 15,\n large: 17,\n xlarge: 22,\n xxlarge: 28,\n xxxlarge: 40\n },\n letterSpacing: {\n header: 5\n }\n};\n\nexport default defaultTheme;\n"],"mappings":"AACA,SAAQA,MAAR,QAAqB,UAArB;AAIA,OAAO,MAAMC,sBAAsB,GAAG,SAA/B;AAwEP,MAAMC,YAAmB,GAAG;EAC1BC,MAAM,EAAE;IACNC,MAAM,EAAE,oBADF;IAENC,IAAI,EAAE;MACJC,KAAK,EAAE,SADH;MAEJC,OAAO,EAAE,SAFL;MAGJC,KAAK,EAAE,SAHH;MAIJC,WAAW,EAAE,SAJT;MAKJC,MAAM,EAAE,SALJ;MAMJC,IAAI,EAAE,SANF;MAOJC,SAAS,EAAE;IAPP,CAFA;IAWNC,IAAI,EAAE;MACJC,OAAO,EAAE,SADL;MAEJC,SAAS,EAAE;IAFP,CAXA;IAeNC,GAAG,EAAE,SAfC;IAgBNC,QAAQ,EAAEjB,MAAM,CAACiB,QAhBX;IAiBNC,QAAQ,EAAElB,MAAM,CAACkB,QAjBX;IAkBNC,KAAK,EAAE,SAlBD;IAmBNC,KAAK,EAAE,SAnBD;IAoBNC,MAAM,EAAE,SApBF;IAqBNC,YAAY,EAAE,SArBR;IAsBNC,MAAM,EAAE,SAtBF;IAuBNC,OAAO,EAAE;MACPC,UAAU,EAAEzB,MAAM,CAAC0B,WADZ;MAEPZ,OAAO,EAAE;IAFF;EAvBH,CADkB;EA6B1Ba,OAAO,EAAE;IACPC,KAAK,EAAE,CADA;IAEPC,IAAI,EAAE,CAFC;IAGPC,KAAK,EAAE,EAHA;IAIPC,IAAI,EAAE,EAJC;IAKPrB,MAAM,EAAE,EALD;IAMPsB,KAAK,EAAE,EANA;IAOPC,MAAM,EAAE;EAPD,CA7BiB;EAsC1BC,MAAM,EAAE;IACNC,MAAM,EAAE,CADF;IAENC,IAAI,EAAE,CAFA;IAGNC,OAAO,EAAE,CAHH;IAIN3B,MAAM,EAAE,EAJF;IAKN4B,MAAM,EAAE,EALF;IAMNC,MAAM,EAAE,EANF;IAONC,SAAS,EAAE;EAPL,CAtCkB;EA+C1BC,UAAU,EAAE;IACVJ,OAAO,EAAE,KADC;IAEVK,QAAQ,EAAE,KAFA;IAGVC,IAAI,EAAE,KAHI;IAIVC,SAAS,EAAE;EAJD,CA/Cc;EAqD1BC,QAAQ,EAAE;IACRC,UAAU,EAAE,EADJ;IAERhB,KAAK,EAAE,EAFC;IAGRpB,MAAM,EAAE,EAHA;IAIR2B,OAAO,EAAE,EAJD;IAKRL,KAAK,EAAE,EALC;IAMRC,MAAM,EAAE,EANA;IAORc,OAAO,EAAE,EAPD;IAQRC,QAAQ,EAAE;EARF,CArDgB;EA+D1BC,aAAa,EAAE;IACbC,MAAM,EAAE;EADK;AA/DW,CAA5B;AAoEA,eAAehD,YAAf"}
1
+ {"version":3,"file":"theme.native.js","names":["COLORS","HTML_ANCHOR_TEXT_COLOR","cm_primary_blue","defaultTheme","colors","border","gray","extra","lighter","light","lightMedium","medium","dark","extraDark","text","primary","secondary","cta","negative","positive","white","black","battle","notification","salmon","podcast","background","cm_grey_800","spacing","micro","tiny","small","base","large","xlarge","radius","common","card","regular","search","button","thumbnail","fontWeight","semiBold","bold","extraBold","fontSize","extraSmall","xxlarge","xxxlarge","letterSpacing","header"],"sources":["../../src/variables/theme.native.ts"],"sourcesContent":["import {TextStyle} from 'react-native';\nimport {COLORS} from './colors';\n\nexport type SpaceType = 'micro' | 'tiny' | 'small' | 'base' | 'medium' | 'large' | 'xlarge';\n\nexport const HTML_ANCHOR_TEXT_COLOR = '#002BDB';\n\nconst {cm_primary_blue} = COLORS;\n\nexport type Colors = {\n border: string;\n gray: {\n extra: string;\n light: string;\n lighter: string;\n lightMedium: string;\n medium: string;\n dark: string;\n extraDark: string;\n };\n podcast: {\n background: string;\n primary: string;\n };\n text: {\n primary: string;\n secondary: string;\n };\n cta: string;\n negative: string;\n positive: string;\n white: string;\n black: string;\n battle: string;\n notification: string;\n salmon: string;\n};\n\nexport type Theme = {\n colors: Colors;\n spacing: {\n micro: number;\n tiny: number;\n small: number;\n base: number;\n medium: number;\n large: number;\n xlarge: number;\n };\n radius: {\n button: number;\n common: number;\n card: number;\n medium: number;\n regular: number;\n search: number;\n thumbnail: number;\n };\n fontWeight: {\n regular: TextStyle['fontWeight'];\n semiBold: TextStyle['fontWeight'];\n bold: TextStyle['fontWeight'];\n extraBold: TextStyle['fontWeight'];\n };\n fontSize: {\n extraSmall: TextStyle['fontSize'];\n small: TextStyle['fontSize'];\n medium: TextStyle['fontSize'];\n regular: TextStyle['fontSize'];\n large: TextStyle['fontSize'];\n xlarge: TextStyle['fontSize'];\n xxlarge: TextStyle['fontSize'];\n xxxlarge: TextStyle['fontSize'];\n };\n letterSpacing: {\n header: number;\n };\n};\n\nconst defaultTheme: Theme = {\n colors: {\n border: 'rgba(0, 0, 0, 0.1)',\n gray: {\n extra: '#FAFAFA',\n lighter: '#F4F4F5',\n light: '#ededed',\n lightMedium: '#CFD8DC',\n medium: '#90A4AE',\n dark: '#546E7A',\n extraDark: '#323232'\n },\n text: {\n primary: '#06265B',\n secondary: '#FFFFFF'\n },\n cta: cm_primary_blue,\n negative: COLORS.negative,\n positive: COLORS.positive,\n white: '#FFFFFF',\n black: '#14171A',\n battle: '#FFDE03',\n notification: '#FF7043',\n salmon: '#FDE2E5',\n podcast: {\n background: COLORS.cm_grey_800,\n primary: '#FF541F'\n }\n },\n spacing: {\n micro: 4,\n tiny: 8,\n small: 16,\n base: 24,\n medium: 32,\n large: 48,\n xlarge: 64\n },\n radius: {\n common: 3,\n card: 5,\n regular: 8,\n medium: 12,\n search: 24,\n button: 32,\n thumbnail: 1000\n },\n fontWeight: {\n regular: '400',\n semiBold: '500',\n bold: '700',\n extraBold: '900'\n },\n fontSize: {\n extraSmall: 10,\n small: 12,\n medium: 13,\n regular: 15,\n large: 17,\n xlarge: 22,\n xxlarge: 28,\n xxxlarge: 40\n },\n letterSpacing: {\n header: 5\n }\n};\n\nexport default defaultTheme;\n"],"mappings":"AACA,SAAQA,MAAR,QAAqB,UAArB;AAIA,OAAO,MAAMC,sBAAsB,GAAG,SAA/B;AAEP,MAAM;EAACC;AAAD,IAAoBF,MAA1B;AAwEA,MAAMG,YAAmB,GAAG;EAC1BC,MAAM,EAAE;IACNC,MAAM,EAAE,oBADF;IAENC,IAAI,EAAE;MACJC,KAAK,EAAE,SADH;MAEJC,OAAO,EAAE,SAFL;MAGJC,KAAK,EAAE,SAHH;MAIJC,WAAW,EAAE,SAJT;MAKJC,MAAM,EAAE,SALJ;MAMJC,IAAI,EAAE,SANF;MAOJC,SAAS,EAAE;IAPP,CAFA;IAWNC,IAAI,EAAE;MACJC,OAAO,EAAE,SADL;MAEJC,SAAS,EAAE;IAFP,CAXA;IAeNC,GAAG,EAAEf,eAfC;IAgBNgB,QAAQ,EAAElB,MAAM,CAACkB,QAhBX;IAiBNC,QAAQ,EAAEnB,MAAM,CAACmB,QAjBX;IAkBNC,KAAK,EAAE,SAlBD;IAmBNC,KAAK,EAAE,SAnBD;IAoBNC,MAAM,EAAE,SApBF;IAqBNC,YAAY,EAAE,SArBR;IAsBNC,MAAM,EAAE,SAtBF;IAuBNC,OAAO,EAAE;MACPC,UAAU,EAAE1B,MAAM,CAAC2B,WADZ;MAEPZ,OAAO,EAAE;IAFF;EAvBH,CADkB;EA6B1Ba,OAAO,EAAE;IACPC,KAAK,EAAE,CADA;IAEPC,IAAI,EAAE,CAFC;IAGPC,KAAK,EAAE,EAHA;IAIPC,IAAI,EAAE,EAJC;IAKPrB,MAAM,EAAE,EALD;IAMPsB,KAAK,EAAE,EANA;IAOPC,MAAM,EAAE;EAPD,CA7BiB;EAsC1BC,MAAM,EAAE;IACNC,MAAM,EAAE,CADF;IAENC,IAAI,EAAE,CAFA;IAGNC,OAAO,EAAE,CAHH;IAIN3B,MAAM,EAAE,EAJF;IAKN4B,MAAM,EAAE,EALF;IAMNC,MAAM,EAAE,EANF;IAONC,SAAS,EAAE;EAPL,CAtCkB;EA+C1BC,UAAU,EAAE;IACVJ,OAAO,EAAE,KADC;IAEVK,QAAQ,EAAE,KAFA;IAGVC,IAAI,EAAE,KAHI;IAIVC,SAAS,EAAE;EAJD,CA/Cc;EAqD1BC,QAAQ,EAAE;IACRC,UAAU,EAAE,EADJ;IAERhB,KAAK,EAAE,EAFC;IAGRpB,MAAM,EAAE,EAHA;IAIR2B,OAAO,EAAE,EAJD;IAKRL,KAAK,EAAE,EALC;IAMRC,MAAM,EAAE,EANA;IAORc,OAAO,EAAE,EAPD;IAQRC,QAAQ,EAAE;EARF,CArDgB;EA+D1BC,aAAa,EAAE;IACbC,MAAM,EAAE;EADK;AA/DW,CAA5B;AAoEA,eAAehD,YAAf"}
@@ -5,6 +5,7 @@ declare const ButtonLink: {
5
5
  propTypes: {
6
6
  type: import("prop-types").Requireable<string>;
7
7
  label: import("prop-types").Requireable<string>;
8
+ content: import("prop-types").Requireable<import("prop-types").ReactNodeLike>;
8
9
  'aria-label': import("prop-types").Requireable<string>;
9
10
  'data-name': import("prop-types").Requireable<string>;
10
11
  'data-testid': import("prop-types").Requireable<string>;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/button-link/index.tsx"],"names":[],"mappings":";AAKA,OAAkB,EAAC,eAAe,EAAW,MAAM,SAAS,CAAC;AAwB7D,QAAA,MAAM,UAAU;YAAW,eAAe;;;;;;;;;;;;;;;;;;;;;CAqEzC,CAAC;AAIF,eAAe,UAAU,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/button-link/index.tsx"],"names":[],"mappings":";AAMA,OAAkB,EAAC,eAAe,EAAW,MAAM,SAAS,CAAC;AAwC7D,QAAA,MAAM,UAAU;YAAW,eAAe;;;;;;;;;;;;;;;;;;;;;;CAsEzC,CAAC;AAIF,eAAe,UAAU,CAAC"}
@@ -11,6 +11,8 @@ var _classnames = _interopRequireDefault(require("classnames"));
11
11
 
12
12
  var _link = _interopRequireDefault(require("../link"));
13
13
 
14
+ var _icon = _interopRequireDefault(require("../icon"));
15
+
14
16
  var _buttonIcons = require("../../util/button-icons");
15
17
 
16
18
  var _types = _interopRequireDefault(require("./types"));
@@ -25,9 +27,10 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
25
27
 
26
28
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
27
29
 
28
- const getButtonContent = (icon, label) => {
30
+ const getButtonContent = (icon, content) => {
29
31
  const {
30
32
  type,
33
+ faIcon,
31
34
  position
32
35
  } = icon || {
33
36
  type: '',
@@ -35,31 +38,38 @@ const getButtonContent = (icon, label) => {
35
38
  };
36
39
  const Icon = type && _buttonIcons.ICONS[type];
37
40
 
38
- if (!Icon) {
41
+ if (!Icon && !faIcon) {
39
42
  return /*#__PURE__*/_react.default.createElement("div", {
40
43
  className: _style.default.buttonContent
41
44
  }, /*#__PURE__*/_react.default.createElement("span", {
42
45
  className: _style.default.label
43
- }, label));
46
+ }, content));
44
47
  }
45
48
 
46
- return /*#__PURE__*/_react.default.createElement("div", {
47
- className: _style.default.buttonContent
48
- }, position === 'left' ? /*#__PURE__*/_react.default.createElement(Icon, {
49
+ const iconComponent = faIcon ? /*#__PURE__*/_react.default.createElement(_icon.default, {
50
+ iconName: faIcon.name,
51
+ iconColor: faIcon.color,
52
+ backgroundColor: faIcon.backgroundColor,
53
+ size: {
54
+ faSize: faIcon.size,
55
+ wrapperSize: faIcon.size
56
+ }
57
+ }) : /*#__PURE__*/_react.default.createElement(Icon, {
49
58
  className: _style.default.icon,
50
59
  theme: "coorpmanager"
51
- }) : null, label ? /*#__PURE__*/_react.default.createElement("span", {
60
+ });
61
+ return /*#__PURE__*/_react.default.createElement("div", {
62
+ className: _style.default.buttonContent
63
+ }, position === 'left' ? iconComponent : null, content ? /*#__PURE__*/_react.default.createElement("span", {
52
64
  className: _style.default.label
53
- }, label) : null, position === 'right' ? /*#__PURE__*/_react.default.createElement(Icon, {
54
- className: _style.default.icon,
55
- theme: "coorpmanager"
56
- }) : null);
65
+ }, content) : null, position === 'right' ? iconComponent : null);
57
66
  };
58
67
 
59
68
  const ButtonLink = props => {
60
69
  const {
61
70
  type,
62
71
  label,
72
+ content,
63
73
  disabled,
64
74
  icon,
65
75
  'data-name': dataName,
@@ -72,7 +82,7 @@ const ButtonLink = props => {
72
82
  customStyle,
73
83
  useTitle = true
74
84
  } = props;
75
- const contentView = getButtonContent(icon, label);
85
+ const contentView = getButtonContent(icon, content ?? label);
76
86
  const styleButton = (0, _classnames.default)(className, _style.default.button, type === 'primary' && _style.default.primary, type === 'secondary' && _style.default.secondary, type === 'tertiary' && _style.default.tertiary, type === 'text' && _style.default.text, type === 'dangerous' && _style.default.dangerous, link && _style.default.link, disabled && _style.default.disabled);
77
87
  const handleOnClick = (0, _react.useCallback)(() => onClick(), [onClick]);
78
88
  const handleOnKeyDown = (0, _react.useCallback)(event => onKeyDown(event), [onKeyDown]);
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["getButtonContent","icon","label","type","position","Icon","ICONS","style","buttonContent","ButtonLink","props","disabled","dataName","dataTestId","ariaLabel","link","onClick","onKeyDown","className","customStyle","useTitle","contentView","styleButton","classnames","button","primary","secondary","tertiary","text","dangerous","handleOnClick","useCallback","handleOnKeyDown","event","title","propTypes"],"sources":["../../../src/atom/button-link/index.tsx"],"sourcesContent":["import React, {useCallback} from 'react';\nimport {noop} from 'lodash/fp';\nimport classnames from 'classnames';\nimport Link from '../link';\nimport {ICONS} from '../../util/button-icons';\nimport propTypes, {ButtonLinkProps, IconType} from './types';\nimport style from './style.css';\n\nconst getButtonContent = (icon?: IconType, label?: string) => {\n const {type, position} = icon || {type: '', position: ''};\n const Icon = type && ICONS[type];\n\n if (!Icon) {\n return (\n <div className={style.buttonContent}>\n <span className={style.label}>{label}</span>\n </div>\n );\n }\n\n return (\n <div className={style.buttonContent}>\n {position === 'left' ? <Icon className={style.icon} theme=\"coorpmanager\" /> : null}\n {label ? <span className={style.label}>{label}</span> : null}\n {position === 'right' ? <Icon className={style.icon} theme=\"coorpmanager\" /> : null}\n </div>\n );\n};\n\nconst ButtonLink = (props: ButtonLinkProps) => {\n const {\n type,\n label,\n disabled,\n icon,\n 'data-name': dataName,\n 'data-testid': dataTestId = 'button-link',\n 'aria-label': ariaLabel,\n link,\n onClick = noop,\n onKeyDown = noop,\n className,\n customStyle,\n useTitle = true\n } = props;\n const contentView = getButtonContent(icon, label);\n const styleButton = classnames(\n className,\n style.button,\n type === 'primary' && style.primary,\n type === 'secondary' && style.secondary,\n type === 'tertiary' && style.tertiary,\n type === 'text' && style.text,\n type === 'dangerous' && style.dangerous,\n link && style.link,\n disabled && style.disabled\n );\n\n const handleOnClick = useCallback(() => onClick(), [onClick]);\n\n const handleOnKeyDown = useCallback(event => onKeyDown(event), [onKeyDown]);\n\n if (link) {\n return (\n <Link\n {...link}\n {...(useTitle && {\n title: ariaLabel || label\n })}\n style={customStyle}\n className={styleButton}\n data-name={dataName}\n data-testid={dataTestId}\n aria-label={ariaLabel || label}\n >\n {contentView}\n </Link>\n );\n }\n\n return (\n <button\n {...(useTitle && {\n title: ariaLabel || label\n })}\n type=\"button\"\n aria-label={ariaLabel || label}\n data-name={dataName}\n data-testid={dataTestId}\n style={customStyle}\n className={styleButton}\n onClick={handleOnClick}\n onKeyDown={handleOnKeyDown}\n tabIndex={0}\n >\n {contentView}\n </button>\n );\n};\n\nButtonLink.propTypes = propTypes;\n\nexport default ButtonLink;\n"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","names":["getButtonContent","icon","content","type","faIcon","position","Icon","ICONS","style","buttonContent","label","iconComponent","iconName","name","iconColor","color","backgroundColor","size","faSize","wrapperSize","ButtonLink","props","disabled","dataName","dataTestId","ariaLabel","link","onClick","onKeyDown","className","customStyle","useTitle","contentView","styleButton","classnames","button","primary","secondary","tertiary","text","dangerous","handleOnClick","useCallback","handleOnKeyDown","event","title","propTypes"],"sources":["../../../src/atom/button-link/index.tsx"],"sourcesContent":["import React, {useCallback} from 'react';\nimport {noop} from 'lodash/fp';\nimport classnames from 'classnames';\nimport Link from '../link';\nimport FaIcon from '../icon';\nimport {ICONS} from '../../util/button-icons';\nimport propTypes, {ButtonLinkProps, IconType} from './types';\nimport style from './style.css';\n\nconst getButtonContent = (icon?: IconType, content?: string | React.ReactNode) => {\n const {type, faIcon, position} = icon || {type: '', position: ''};\n const Icon = type && ICONS[type];\n\n if (!Icon && !faIcon) {\n return (\n <div className={style.buttonContent}>\n <span className={style.label}>{content}</span>\n </div>\n );\n }\n\n const iconComponent = faIcon ? (\n <FaIcon\n {...{\n iconName: faIcon.name,\n iconColor: faIcon.color,\n backgroundColor: faIcon.backgroundColor,\n size: {\n faSize: faIcon.size,\n wrapperSize: faIcon.size\n }\n }}\n />\n ) : (\n <Icon className={style.icon} theme=\"coorpmanager\" />\n );\n\n return (\n <div className={style.buttonContent}>\n {position === 'left' ? iconComponent : null}\n {content ? <span className={style.label}>{content}</span> : null}\n {position === 'right' ? iconComponent : null}\n </div>\n );\n};\n\nconst ButtonLink = (props: ButtonLinkProps) => {\n const {\n type,\n label,\n content,\n disabled,\n icon,\n 'data-name': dataName,\n 'data-testid': dataTestId = 'button-link',\n 'aria-label': ariaLabel,\n link,\n onClick = noop,\n onKeyDown = noop,\n className,\n customStyle,\n useTitle = true\n } = props;\n const contentView = getButtonContent(icon, content ?? label);\n const styleButton = classnames(\n className,\n style.button,\n type === 'primary' && style.primary,\n type === 'secondary' && style.secondary,\n type === 'tertiary' && style.tertiary,\n type === 'text' && style.text,\n type === 'dangerous' && style.dangerous,\n link && style.link,\n disabled && style.disabled\n );\n\n const handleOnClick = useCallback(() => onClick(), [onClick]);\n\n const handleOnKeyDown = useCallback(event => onKeyDown(event), [onKeyDown]);\n\n if (link) {\n return (\n <Link\n {...link}\n {...(useTitle && {\n title: ariaLabel || label\n })}\n style={customStyle}\n className={styleButton}\n data-name={dataName}\n data-testid={dataTestId}\n aria-label={ariaLabel || label}\n >\n {contentView}\n </Link>\n );\n }\n\n return (\n <button\n {...(useTitle && {\n title: ariaLabel || label\n })}\n type=\"button\"\n aria-label={ariaLabel || label}\n data-name={dataName}\n data-testid={dataTestId}\n style={customStyle}\n className={styleButton}\n onClick={handleOnClick}\n onKeyDown={handleOnKeyDown}\n tabIndex={0}\n >\n {contentView}\n </button>\n );\n};\n\nButtonLink.propTypes = propTypes;\n\nexport default ButtonLink;\n"],"mappings":"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"}
@@ -1,8 +1,10 @@
1
+ /// <reference types="react" />
1
2
  import PropTypes from 'prop-types';
2
3
  import { ICONS } from '../../util/button-icons';
3
4
  declare const propTypes: {
4
5
  type: PropTypes.Requireable<string>;
5
6
  label: PropTypes.Requireable<string>;
7
+ content: PropTypes.Requireable<PropTypes.ReactNodeLike>;
6
8
  'aria-label': PropTypes.Requireable<string>;
7
9
  'data-name': PropTypes.Requireable<string>;
8
10
  'data-testid': PropTypes.Requireable<string>;
@@ -20,13 +22,21 @@ declare const propTypes: {
20
22
  className: PropTypes.Requireable<string>;
21
23
  customStyle: PropTypes.Requireable<PropTypes.InferProps<{}>>;
22
24
  };
25
+ export declare type FaIcontype = {
26
+ name: string;
27
+ color?: string;
28
+ backgroundColor?: string;
29
+ size?: number;
30
+ };
23
31
  export declare type IconType = {
24
32
  position: 'right' | 'left';
25
- type: keyof typeof ICONS;
33
+ type?: keyof typeof ICONS;
34
+ faIcon?: FaIcontype;
26
35
  };
27
36
  export declare type ButtonLinkProps = {
28
37
  type?: 'primary' | 'secondary' | 'tertiary' | 'text' | 'dangerous';
29
38
  label?: string;
39
+ content?: React.ReactNode;
30
40
  'aria-label'?: string;
31
41
  'data-name'?: string;
32
42
  'data-testid'?: string;
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/atom/button-link/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAC,KAAK,EAAC,MAAM,yBAAyB,CAAC;AAE9C,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;CAmBd,CAAC;AAEF,oBAAY,QAAQ,GAAG;IACrB,QAAQ,EAAE,OAAO,GAAG,MAAM,CAAC;IAC3B,IAAI,EAAE,MAAM,OAAO,KAAK,CAAC;CAC1B,CAAC;AACF,oBAAY,eAAe,GAAG;IAC5B,IAAI,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,GAAG,WAAW,CAAC;IACnE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,IAAI,CAAC,EAAE;QACL,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAC;KAClD,CAAC;IACF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,oBAAY,OAAO,GAAG;IAAC,KAAK,EAAE,eAAe,CAAA;CAAC,CAAC;AAE/C,eAAe,SAAS,CAAC"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/atom/button-link/types.ts"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAC,KAAK,EAAC,MAAM,yBAAyB,CAAC;AAE9C,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;CAoBd,CAAC;AAEF,oBAAY,UAAU,GAAG;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,oBAAY,QAAQ,GAAG;IACrB,QAAQ,EAAE,OAAO,GAAG,MAAM,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,OAAO,KAAK,CAAC;IAC1B,MAAM,CAAC,EAAE,UAAU,CAAC;CACrB,CAAC;AACF,oBAAY,eAAe,GAAG;IAC5B,IAAI,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,GAAG,WAAW,CAAC;IACnE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,IAAI,CAAC,EAAE;QACL,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAC;KAClD,CAAC;IACF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,oBAAY,OAAO,GAAG;IAAC,KAAK,EAAE,eAAe,CAAA;CAAC,CAAC;AAE/C,eAAe,SAAS,CAAC"}
@@ -14,6 +14,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
14
14
  const propTypes = {
15
15
  type: _propTypes.default.oneOf(['primary', 'secondary', 'tertiary', 'text', 'dangerous']),
16
16
  label: _propTypes.default.string,
17
+ content: _propTypes.default.node,
17
18
  'aria-label': _propTypes.default.string,
18
19
  'data-name': _propTypes.default.string,
19
20
  'data-testid': _propTypes.default.string,
@@ -1 +1 @@
1
- {"version":3,"file":"types.js","names":["propTypes","type","PropTypes","oneOf","label","string","icon","shape","position","ICONS","onClick","func","link","href","download","bool","target","disabled","className","customStyle"],"sources":["../../../src/atom/button-link/types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\nimport {keys} from 'lodash/fp';\nimport {ICONS} from '../../util/button-icons';\n\nconst propTypes = {\n type: PropTypes.oneOf(['primary', 'secondary', 'tertiary', 'text', 'dangerous']),\n label: PropTypes.string,\n 'aria-label': PropTypes.string,\n 'data-name': PropTypes.string,\n 'data-testid': PropTypes.string,\n icon: PropTypes.shape({\n position: PropTypes.oneOf(['right', 'left']),\n type: PropTypes.oneOf(keys(ICONS))\n }),\n onClick: PropTypes.func,\n link: PropTypes.shape({\n href: PropTypes.string,\n download: PropTypes.bool,\n target: PropTypes.oneOf(['_self', '_blank', '_parent', '_top'])\n }),\n disabled: PropTypes.bool,\n className: PropTypes.string,\n customStyle: PropTypes.shape({})\n};\n\nexport type IconType = {\n position: 'right' | 'left';\n type: keyof typeof ICONS;\n};\nexport type ButtonLinkProps = {\n type?: 'primary' | 'secondary' | 'tertiary' | 'text' | 'dangerous';\n label?: string;\n 'aria-label'?: string;\n 'data-name'?: string;\n 'data-testid'?: string;\n icon?: IconType;\n onClick?: () => void;\n onKeyDown?: () => void;\n link?: {\n href?: string;\n download?: boolean;\n target?: '_self' | '_blank' | '_parent' | '_top';\n };\n disabled?: boolean;\n className?: string;\n customStyle?: Record<string, unknown>;\n useTitle?: boolean;\n};\n\nexport type Fixture = {props: ButtonLinkProps};\n\nexport default propTypes;\n"],"mappings":";;;;;;;AAAA;;AAEA;;;;AAEA,MAAMA,SAAS,GAAG;EAChBC,IAAI,EAAEC,kBAAA,CAAUC,KAAV,CAAgB,CAAC,SAAD,EAAY,WAAZ,EAAyB,UAAzB,EAAqC,MAArC,EAA6C,WAA7C,CAAhB,CADU;EAEhBC,KAAK,EAAEF,kBAAA,CAAUG,MAFD;EAGhB,cAAcH,kBAAA,CAAUG,MAHR;EAIhB,aAAaH,kBAAA,CAAUG,MAJP;EAKhB,eAAeH,kBAAA,CAAUG,MALT;EAMhBC,IAAI,EAAEJ,kBAAA,CAAUK,KAAV,CAAgB;IACpBC,QAAQ,EAAEN,kBAAA,CAAUC,KAAV,CAAgB,CAAC,OAAD,EAAU,MAAV,CAAhB,CADU;IAEpBF,IAAI,EAAEC,kBAAA,CAAUC,KAAV,CAAgB,oBAAKM,kBAAL,CAAhB;EAFc,CAAhB,CANU;EAUhBC,OAAO,EAAER,kBAAA,CAAUS,IAVH;EAWhBC,IAAI,EAAEV,kBAAA,CAAUK,KAAV,CAAgB;IACpBM,IAAI,EAAEX,kBAAA,CAAUG,MADI;IAEpBS,QAAQ,EAAEZ,kBAAA,CAAUa,IAFA;IAGpBC,MAAM,EAAEd,kBAAA,CAAUC,KAAV,CAAgB,CAAC,OAAD,EAAU,QAAV,EAAoB,SAApB,EAA+B,MAA/B,CAAhB;EAHY,CAAhB,CAXU;EAgBhBc,QAAQ,EAAEf,kBAAA,CAAUa,IAhBJ;EAiBhBG,SAAS,EAAEhB,kBAAA,CAAUG,MAjBL;EAkBhBc,WAAW,EAAEjB,kBAAA,CAAUK,KAAV,CAAgB,EAAhB;AAlBG,CAAlB;eA+CeP,S"}
1
+ {"version":3,"file":"types.js","names":["propTypes","type","PropTypes","oneOf","label","string","content","node","icon","shape","position","ICONS","onClick","func","link","href","download","bool","target","disabled","className","customStyle"],"sources":["../../../src/atom/button-link/types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\nimport {keys} from 'lodash/fp';\nimport {ICONS} from '../../util/button-icons';\n\nconst propTypes = {\n type: PropTypes.oneOf(['primary', 'secondary', 'tertiary', 'text', 'dangerous']),\n label: PropTypes.string,\n content: PropTypes.node,\n 'aria-label': PropTypes.string,\n 'data-name': PropTypes.string,\n 'data-testid': PropTypes.string,\n icon: PropTypes.shape({\n position: PropTypes.oneOf(['right', 'left']),\n type: PropTypes.oneOf(keys(ICONS))\n }),\n onClick: PropTypes.func,\n link: PropTypes.shape({\n href: PropTypes.string,\n download: PropTypes.bool,\n target: PropTypes.oneOf(['_self', '_blank', '_parent', '_top'])\n }),\n disabled: PropTypes.bool,\n className: PropTypes.string,\n customStyle: PropTypes.shape({})\n};\n\nexport type FaIcontype = {\n name: string;\n color?: string;\n backgroundColor?: string;\n size?: number;\n};\n\nexport type IconType = {\n position: 'right' | 'left';\n type?: keyof typeof ICONS;\n faIcon?: FaIcontype;\n};\nexport type ButtonLinkProps = {\n type?: 'primary' | 'secondary' | 'tertiary' | 'text' | 'dangerous';\n label?: string;\n content?: React.ReactNode;\n 'aria-label'?: string;\n 'data-name'?: string;\n 'data-testid'?: string;\n icon?: IconType;\n onClick?: () => void;\n onKeyDown?: () => void;\n link?: {\n href?: string;\n download?: boolean;\n target?: '_self' | '_blank' | '_parent' | '_top';\n };\n disabled?: boolean;\n className?: string;\n customStyle?: Record<string, unknown>;\n useTitle?: boolean;\n};\n\nexport type Fixture = {props: ButtonLinkProps};\n\nexport default propTypes;\n"],"mappings":";;;;;;;AAAA;;AAEA;;;;AAEA,MAAMA,SAAS,GAAG;EAChBC,IAAI,EAAEC,kBAAA,CAAUC,KAAV,CAAgB,CAAC,SAAD,EAAY,WAAZ,EAAyB,UAAzB,EAAqC,MAArC,EAA6C,WAA7C,CAAhB,CADU;EAEhBC,KAAK,EAAEF,kBAAA,CAAUG,MAFD;EAGhBC,OAAO,EAAEJ,kBAAA,CAAUK,IAHH;EAIhB,cAAcL,kBAAA,CAAUG,MAJR;EAKhB,aAAaH,kBAAA,CAAUG,MALP;EAMhB,eAAeH,kBAAA,CAAUG,MANT;EAOhBG,IAAI,EAAEN,kBAAA,CAAUO,KAAV,CAAgB;IACpBC,QAAQ,EAAER,kBAAA,CAAUC,KAAV,CAAgB,CAAC,OAAD,EAAU,MAAV,CAAhB,CADU;IAEpBF,IAAI,EAAEC,kBAAA,CAAUC,KAAV,CAAgB,oBAAKQ,kBAAL,CAAhB;EAFc,CAAhB,CAPU;EAWhBC,OAAO,EAAEV,kBAAA,CAAUW,IAXH;EAYhBC,IAAI,EAAEZ,kBAAA,CAAUO,KAAV,CAAgB;IACpBM,IAAI,EAAEb,kBAAA,CAAUG,MADI;IAEpBW,QAAQ,EAAEd,kBAAA,CAAUe,IAFA;IAGpBC,MAAM,EAAEhB,kBAAA,CAAUC,KAAV,CAAgB,CAAC,OAAD,EAAU,QAAV,EAAoB,SAApB,EAA+B,MAA/B,CAAhB;EAHY,CAAhB,CAZU;EAiBhBgB,QAAQ,EAAEjB,kBAAA,CAAUe,IAjBJ;EAkBhBG,SAAS,EAAElB,kBAAA,CAAUG,MAlBL;EAmBhBgB,WAAW,EAAEnB,kBAAA,CAAUO,KAAV,CAAgB,EAAhB;AAnBG,CAAlB;eAyDeT,S"}
@@ -0,0 +1,37 @@
1
+ export function calculateHoveredSelectedBgColor(selectedBgColor: any, luminosityDelta?: number): string;
2
+ export default Chip;
3
+ declare function Chip(props: any, context: any): JSX.Element;
4
+ declare namespace Chip {
5
+ namespace contextTypes {
6
+ const skin: PropTypes.Requireable<PropTypes.InferProps<{
7
+ common: PropTypes.Requireable<{
8
+ [x: string]: any;
9
+ }>;
10
+ images: PropTypes.Requireable<PropTypes.InferProps<{
11
+ 'logo-mobile': PropTypes.Requireable<any>;
12
+ logo: PropTypes.Requireable<any>;
13
+ 'logo-email': PropTypes.Requireable<any>;
14
+ login: PropTypes.Requireable<any>;
15
+ }>>;
16
+ icons: PropTypes.Requireable<{
17
+ [x: string]: any;
18
+ }>;
19
+ mod: PropTypes.Requireable<{
20
+ [x: string]: any;
21
+ }>;
22
+ courses: PropTypes.Requireable<any[]>;
23
+ texts: PropTypes.Requireable<{
24
+ [x: string]: any;
25
+ }>;
26
+ }>>;
27
+ }
28
+ namespace propTypes {
29
+ const text: PropTypes.Requireable<string>;
30
+ const selected: PropTypes.Requireable<boolean>;
31
+ const customIcon: PropTypes.Requireable<string>;
32
+ const backgroundColor: PropTypes.Requireable<string>;
33
+ const onClick: PropTypes.Requireable<(...args: any[]) => any>;
34
+ }
35
+ }
36
+ import PropTypes from "prop-types";
37
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/chip/index.js"],"names":[],"mappings":"AAeO,wGAQN;;AAED,6DAsDC"}
@@ -0,0 +1,109 @@
1
+ "use strict";
2
+
3
+ exports.__esModule = true;
4
+ exports.default = exports.calculateHoveredSelectedBgColor = void 0;
5
+
6
+ var _react = _interopRequireWildcard(require("react"));
7
+
8
+ var _propTypes = _interopRequireDefault(require("prop-types"));
9
+
10
+ var _classnames = _interopRequireDefault(require("classnames"));
11
+
12
+ var _get = _interopRequireDefault(require("lodash/fp/get"));
13
+
14
+ var _colorjs = _interopRequireDefault(require("colorjs.io"));
15
+
16
+ var _reactFontawesome = require("@fortawesome/react-fontawesome");
17
+
18
+ var _provider = _interopRequireDefault(require("../provider"));
19
+
20
+ var _colors = require("../../variables/colors");
21
+
22
+ var _style = _interopRequireDefault(require("./style.css"));
23
+
24
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
25
+
26
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
27
+
28
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
29
+
30
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
31
+
32
+ const LUMINOSITY_DELTA = 0.08;
33
+ const {
34
+ cm_primary_blue: DEFAULT_BACKGROUND_COLOR
35
+ } = _colors.COLORS;
36
+ const ICON_SIZE = '12px';
37
+
38
+ const calculateHoveredSelectedBgColor = (selectedBgColor, luminosityDelta = LUMINOSITY_DELTA) => {
39
+ return new _colorjs.default(selectedBgColor).to('hsl').set({
40
+ l: l => l * (1 - luminosityDelta)
41
+ }).toString();
42
+ };
43
+
44
+ exports.calculateHoveredSelectedBgColor = calculateHoveredSelectedBgColor;
45
+
46
+ const Chip = (props, context) => {
47
+ const {
48
+ text,
49
+ selected = false,
50
+ customIcon,
51
+ onClick,
52
+ backgroundColor = DEFAULT_BACKGROUND_COLOR
53
+ } = props;
54
+ const {
55
+ skin
56
+ } = context;
57
+ const skinColor = (0, _get.default)('common.primary', skin);
58
+ const selectedBgColor = backgroundColor === 'skin' && skinColor ? skinColor : backgroundColor;
59
+ const hoveredSelectedBgColor = calculateHoveredSelectedBgColor(selectedBgColor);
60
+ const [isHovered, setIsHovered] = (0, _react.useState)(false);
61
+ const handleClick = (0, _react.useMemo)(() => onClick, [onClick]);
62
+ const handleMouseEnter = (0, _react.useCallback)(() => {
63
+ setIsHovered(true);
64
+ }, []);
65
+ const handleMouseLeave = (0, _react.useCallback)(() => {
66
+ setIsHovered(false);
67
+ }, []);
68
+ const hoverStyle = isHovered ? {
69
+ backgroundColor: hoveredSelectedBgColor
70
+ } : {};
71
+ const defaultIcon = selected ? 'fa-check' : 'fa-plus';
72
+ return /*#__PURE__*/_react.default.createElement("div", {
73
+ className: (0, _classnames.default)(_style.default.container, !selected && _style.default.unselected),
74
+ style: _extends({}, selected && selectedBgColor ? {
75
+ backgroundColor: selectedBgColor
76
+ } : {}, selected && hoverStyle),
77
+ onClick: handleClick,
78
+ onMouseEnter: handleMouseEnter,
79
+ onMouseLeave: handleMouseLeave,
80
+ "aria-label": text,
81
+ "data-name": text
82
+ }, /*#__PURE__*/_react.default.createElement("div", {
83
+ className: _style.default.textZone,
84
+ title: text
85
+ }, /*#__PURE__*/_react.default.createElement("span", {
86
+ className: _style.default.text,
87
+ style: selected ? {
88
+ color: 'white'
89
+ } : {}
90
+ }, text)), /*#__PURE__*/_react.default.createElement(_reactFontawesome.FontAwesomeIcon, {
91
+ className: selected ? _style.default.selectedIconWrapper : _style.default.unselectedIconWrapper,
92
+ icon: customIcon ? `fa-${customIcon}` : defaultIcon,
93
+ fontSize: ICON_SIZE
94
+ }));
95
+ };
96
+
97
+ Chip.contextTypes = {
98
+ skin: _provider.default.childContextTypes.skin
99
+ };
100
+ Chip.propTypes = process.env.NODE_ENV !== "production" ? {
101
+ text: _propTypes.default.string,
102
+ selected: _propTypes.default.bool,
103
+ customIcon: _propTypes.default.string,
104
+ backgroundColor: _propTypes.default.string,
105
+ onClick: _propTypes.default.func
106
+ } : {};
107
+ var _default = Chip;
108
+ exports.default = _default;
109
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","names":["LUMINOSITY_DELTA","cm_primary_blue","DEFAULT_BACKGROUND_COLOR","COLORS","ICON_SIZE","calculateHoveredSelectedBgColor","selectedBgColor","luminosityDelta","Color","to","set","l","toString","Chip","props","context","text","selected","customIcon","onClick","backgroundColor","skin","skinColor","get","hoveredSelectedBgColor","isHovered","setIsHovered","useState","handleClick","useMemo","handleMouseEnter","useCallback","handleMouseLeave","hoverStyle","defaultIcon","classnames","style","container","unselected","textZone","color","selectedIconWrapper","unselectedIconWrapper","contextTypes","Provider","childContextTypes","propTypes","PropTypes","string","bool","func"],"sources":["../../../src/atom/chip/index.js"],"sourcesContent":["import React, {useMemo, useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\n\nimport get from 'lodash/fp/get';\nimport Color from 'colorjs.io';\nimport {FontAwesomeIcon} from '@fortawesome/react-fontawesome';\nimport Provider from '../provider';\nimport {COLORS} from '../../variables/colors';\nimport style from './style.css';\n\nconst LUMINOSITY_DELTA = 0.08;\nconst {cm_primary_blue: DEFAULT_BACKGROUND_COLOR} = COLORS;\nconst ICON_SIZE = '12px';\n\nexport const calculateHoveredSelectedBgColor = (\n selectedBgColor,\n luminosityDelta = LUMINOSITY_DELTA\n) => {\n return new Color(selectedBgColor)\n .to('hsl')\n .set({l: l => l * (1 - luminosityDelta)})\n .toString();\n};\n\nconst Chip = (props, context) => {\n const {\n text,\n selected = false,\n customIcon,\n onClick,\n backgroundColor = DEFAULT_BACKGROUND_COLOR\n } = props;\n const {skin} = context;\n const skinColor = get('common.primary', skin);\n const selectedBgColor = backgroundColor === 'skin' && skinColor ? skinColor : backgroundColor;\n const hoveredSelectedBgColor = calculateHoveredSelectedBgColor(selectedBgColor);\n\n const [isHovered, setIsHovered] = useState(false);\n\n const handleClick = useMemo(() => onClick, [onClick]);\n\n const handleMouseEnter = useCallback(() => {\n setIsHovered(true);\n }, []);\n\n const handleMouseLeave = useCallback(() => {\n setIsHovered(false);\n }, []);\n\n const hoverStyle = isHovered ? {backgroundColor: hoveredSelectedBgColor} : {};\n\n const defaultIcon = selected ? 'fa-check' : 'fa-plus';\n\n return (\n <div\n className={classnames(style.container, !selected && style.unselected)}\n style={{\n ...(selected && selectedBgColor ? {backgroundColor: selectedBgColor} : {}),\n ...(selected && hoverStyle)\n }}\n onClick={handleClick}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n aria-label={text}\n data-name={text}\n >\n <div className={style.textZone} title={text}>\n <span className={style.text} style={selected ? {color: 'white'} : {}}>\n {text}\n </span>\n </div>\n <FontAwesomeIcon\n className={selected ? style.selectedIconWrapper : style.unselectedIconWrapper}\n icon={customIcon ? `fa-${customIcon}` : defaultIcon}\n fontSize={ICON_SIZE}\n />\n </div>\n );\n};\n\nChip.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nChip.propTypes = {\n text: PropTypes.string,\n selected: PropTypes.bool,\n customIcon: PropTypes.string,\n backgroundColor: PropTypes.string,\n onClick: PropTypes.func\n};\n\nexport default Chip;\n"],"mappings":"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"}
@@ -0,0 +1,65 @@
1
+ @value colors: "../../variables/colors.css";
2
+ @value cm_grey_100 from colors;
3
+ @value cm_grey_200 from colors;
4
+ @value cm_grey_400 from colors;
5
+ @value cm_grey_700 from colors;
6
+ @value cm_positive_100 from colors;
7
+ @value white from colors;
8
+
9
+ .container {
10
+ width: fit-content;
11
+ height: 44px;
12
+ border-radius: 10px;
13
+ padding: 10px 16px;
14
+ position: relative;
15
+ display: flex;
16
+ align-items: center;
17
+ box-sizing: border-box;
18
+ cursor: pointer;
19
+ }
20
+
21
+ .unselected {
22
+ background-color: cm_grey_100;
23
+ color: cm_grey_400;
24
+ }
25
+
26
+ .unselected:hover {
27
+ background-color: cm_grey_200;
28
+ color: cm_grey_700;
29
+ }
30
+
31
+ .unselected:hover .unselectedIconWrapper {
32
+ color: cm_grey_700;
33
+ }
34
+
35
+ .textZone {
36
+ flex: 1 1 100%;
37
+ padding-right: 32px;
38
+ width: calc(100% - 32px);
39
+ }
40
+
41
+ .text {
42
+ font-family: 'Gilroy';
43
+ font-style: normal;
44
+ font-weight: 600;
45
+ font-size: 14px;
46
+ text-overflow: ellipsis;
47
+ white-space: nowrap;
48
+ overflow: hidden;
49
+ display: block;
50
+ }
51
+
52
+ .icon{
53
+ position: absolute;
54
+ right: 18px;
55
+ }
56
+
57
+ .selectedIconWrapper {
58
+ composes: icon;
59
+ color: white;
60
+ }
61
+
62
+ .unselectedIconWrapper {
63
+ composes: icon;
64
+ color: cm_grey_400;
65
+ }
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/chips/index.js"],"names":[],"mappings":";AASA,gDAuBC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/chips/index.js"],"names":[],"mappings":";AAWA,gDAuBC"}
@@ -19,6 +19,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
19
19
 
20
20
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
21
21
 
22
+ // This component is a simpler version of the generic Chip component, in use in CoorpManager.
22
23
  const Chips = props => {
23
24
  const {
24
25
  text,
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["Chips","props","text","information","selected","onClick","handleClick","useMemo","classnames","style","container","unselected","textZone","selectedIconWrapper","unselectedIconWrapper","propTypes","PropTypes","string","bool","func"],"sources":["../../../src/atom/chips/index.js"],"sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {\n NovaSolidRemoveAddAddCircle1 as AddIcon,\n NovaSolidStatusCheckCircle2 as SelectedIcon\n} from '@coorpacademy/nova-icons';\nimport style from './style.css';\n\nconst Chips = props => {\n const {text, information, selected = false, onClick} = props;\n\n const handleClick = useMemo(() => () => onClick(), [onClick]);\n\n return (\n <div\n className={classnames(style.container, selected ? style.selected : style.unselected)}\n onClick={handleClick}\n aria-label={`${text} ${information}`}\n data-name={text}\n >\n <div className={style.textZone} title={text}>\n <span className={style.text}>{text}</span>\n <span className={style.information}>{information}</span>\n </div>\n {selected ? (\n <SelectedIcon className={style.selectedIconWrapper} />\n ) : (\n <AddIcon className={style.unselectedIconWrapper} />\n )}\n </div>\n );\n};\n\nChips.propTypes = {\n text: PropTypes.string,\n information: PropTypes.string,\n selected: PropTypes.bool,\n onClick: PropTypes.func\n};\n\nexport default Chips;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AAIA;;;;;;;;AAEA,MAAMA,KAAK,GAAGC,KAAK,IAAI;EACrB,MAAM;IAACC,IAAD;IAAOC,WAAP;IAAoBC,QAAQ,GAAG,KAA/B;IAAsCC;EAAtC,IAAiDJ,KAAvD;EAEA,MAAMK,WAAW,GAAG,IAAAC,cAAA,EAAQ,MAAM,MAAMF,OAAO,EAA3B,EAA+B,CAACA,OAAD,CAA/B,CAApB;EAEA,oBACE;IACE,SAAS,EAAE,IAAAG,mBAAA,EAAWC,cAAA,CAAMC,SAAjB,EAA4BN,QAAQ,GAAGK,cAAA,CAAML,QAAT,GAAoBK,cAAA,CAAME,UAA9D,CADb;IAEE,OAAO,EAAEL,WAFX;IAGE,cAAa,GAAEJ,IAAK,IAAGC,WAAY,EAHrC;IAIE,aAAWD;EAJb,gBAME;IAAK,SAAS,EAAEO,cAAA,CAAMG,QAAtB;IAAgC,KAAK,EAAEV;EAAvC,gBACE;IAAM,SAAS,EAAEO,cAAA,CAAMP;EAAvB,GAA8BA,IAA9B,CADF,eAEE;IAAM,SAAS,EAAEO,cAAA,CAAMN;EAAvB,GAAqCA,WAArC,CAFF,CANF,EAUGC,QAAQ,gBACP,6BAAC,sCAAD;IAAc,SAAS,EAAEK,cAAA,CAAMI;EAA/B,EADO,gBAGP,6BAAC,uCAAD;IAAS,SAAS,EAAEJ,cAAA,CAAMK;EAA1B,EAbJ,CADF;AAkBD,CAvBD;;AAyBAd,KAAK,CAACe,SAAN,2CAAkB;EAChBb,IAAI,EAAEc,kBAAA,CAAUC,MADA;EAEhBd,WAAW,EAAEa,kBAAA,CAAUC,MAFP;EAGhBb,QAAQ,EAAEY,kBAAA,CAAUE,IAHJ;EAIhBb,OAAO,EAAEW,kBAAA,CAAUG;AAJH,CAAlB;eAOenB,K"}
1
+ {"version":3,"file":"index.js","names":["Chips","props","text","information","selected","onClick","handleClick","useMemo","classnames","style","container","unselected","textZone","selectedIconWrapper","unselectedIconWrapper","propTypes","PropTypes","string","bool","func"],"sources":["../../../src/atom/chips/index.js"],"sourcesContent":["// This component is a simpler version of the generic Chip component, in use in CoorpManager.\n\nimport React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {\n NovaSolidRemoveAddAddCircle1 as AddIcon,\n NovaSolidStatusCheckCircle2 as SelectedIcon\n} from '@coorpacademy/nova-icons';\nimport style from './style.css';\n\nconst Chips = props => {\n const {text, information, selected = false, onClick} = props;\n\n const handleClick = useMemo(() => () => onClick(), [onClick]);\n\n return (\n <div\n className={classnames(style.container, selected ? style.selected : style.unselected)}\n onClick={handleClick}\n aria-label={`${text} ${information}`}\n data-name={text}\n >\n <div className={style.textZone} title={text}>\n <span className={style.text}>{text}</span>\n <span className={style.information}>{information}</span>\n </div>\n {selected ? (\n <SelectedIcon className={style.selectedIconWrapper} />\n ) : (\n <AddIcon className={style.unselectedIconWrapper} />\n )}\n </div>\n );\n};\n\nChips.propTypes = {\n text: PropTypes.string,\n information: PropTypes.string,\n selected: PropTypes.bool,\n onClick: PropTypes.func\n};\n\nexport default Chips;\n"],"mappings":";;;;;AAEA;;AACA;;AACA;;AACA;;AAIA;;;;;;;;AATA;AAWA,MAAMA,KAAK,GAAGC,KAAK,IAAI;EACrB,MAAM;IAACC,IAAD;IAAOC,WAAP;IAAoBC,QAAQ,GAAG,KAA/B;IAAsCC;EAAtC,IAAiDJ,KAAvD;EAEA,MAAMK,WAAW,GAAG,IAAAC,cAAA,EAAQ,MAAM,MAAMF,OAAO,EAA3B,EAA+B,CAACA,OAAD,CAA/B,CAApB;EAEA,oBACE;IACE,SAAS,EAAE,IAAAG,mBAAA,EAAWC,cAAA,CAAMC,SAAjB,EAA4BN,QAAQ,GAAGK,cAAA,CAAML,QAAT,GAAoBK,cAAA,CAAME,UAA9D,CADb;IAEE,OAAO,EAAEL,WAFX;IAGE,cAAa,GAAEJ,IAAK,IAAGC,WAAY,EAHrC;IAIE,aAAWD;EAJb,gBAME;IAAK,SAAS,EAAEO,cAAA,CAAMG,QAAtB;IAAgC,KAAK,EAAEV;EAAvC,gBACE;IAAM,SAAS,EAAEO,cAAA,CAAMP;EAAvB,GAA8BA,IAA9B,CADF,eAEE;IAAM,SAAS,EAAEO,cAAA,CAAMN;EAAvB,GAAqCA,WAArC,CAFF,CANF,EAUGC,QAAQ,gBACP,6BAAC,sCAAD;IAAc,SAAS,EAAEK,cAAA,CAAMI;EAA/B,EADO,gBAGP,6BAAC,uCAAD;IAAS,SAAS,EAAEJ,cAAA,CAAMK;EAA1B,EAbJ,CADF;AAkBD,CAvBD;;AAyBAd,KAAK,CAACe,SAAN,2CAAkB;EAChBb,IAAI,EAAEc,kBAAA,CAAUC,MADA;EAEhBd,WAAW,EAAEa,kBAAA,CAAUC,MAFP;EAGhBb,QAAQ,EAAEY,kBAAA,CAAUE,IAHJ;EAIhBb,OAAO,EAAEW,kBAAA,CAAUG;AAJH,CAAlB;eAOenB,K"}
@@ -65,7 +65,7 @@ const Icon = /*#__PURE__*/_react.default.memo(function Icon({
65
65
  preset = DEFAULT_PRESET,
66
66
  size
67
67
  }) {
68
- const effectiveIconColor = iconColor || backgroundColor ? getForegroundColor(backgroundColor) : DEFAULT_ICON_COLOR;
68
+ const effectiveIconColor = iconColor || (backgroundColor ? getForegroundColor(backgroundColor) : DEFAULT_ICON_COLOR);
69
69
  const effectiveSize = size ? (0, _merge.default)(SIZE_CONFIGS[DEFAULT_PRESET], size) : (0, _getOr.default)(SIZE_CONFIGS[DEFAULT_PRESET], (0, _toLower.default)(preset), SIZE_CONFIGS);
70
70
  const wrapperSize = effectiveSize.wrapperSize - ICON_PADDING * 2;
71
71
  const iconWrapperStyle = {
@@ -80,7 +80,7 @@ const Icon = /*#__PURE__*/_react.default.memo(function Icon({
80
80
  }, /*#__PURE__*/_react.default.createElement(_reactFontawesome.FontAwesomeIcon, {
81
81
  icon: `fa-${iconName}`,
82
82
  color: effectiveIconColor,
83
- "font-size": effectiveSize.faSize
83
+ fontSize: effectiveSize.faSize
84
84
  }));
85
85
  });
86
86
 
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["library","add","fas","DEFAULT_PRESET","ICON_LUMINOSITY","DEFAULT_WRAPPER_SIZE","ICON_PADDING","DEFAULT_ICON_COLOR","SIZE_CONFIGS","s","faSize","wrapperSize","m","xl","getForegroundColor","backgroundColor","Color","to","set","l","toString","Icon","React","memo","iconName","iconColor","preset","size","effectiveIconColor","effectiveSize","merge","getOr","toLower","iconWrapperStyle","width","height","padding","style","iconWrapper","propTypes","PropTypes","string","isRequired","oneOf","shape","number"],"sources":["../../../src/atom/icon/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes, {number} from 'prop-types';\nimport {FontAwesomeIcon} from '@fortawesome/react-fontawesome';\nimport {fas} from '@fortawesome/pro-solid-svg-icons';\nimport {library} from '@fortawesome/fontawesome-svg-core';\nimport toLower from 'lodash/fp/toLower';\nimport merge from 'lodash/fp/merge';\nimport getOr from 'lodash/fp/getOr';\nimport Color from 'colorjs.io';\nimport style from './style.css';\n\nlibrary.add(fas);\n\nconst DEFAULT_PRESET = 'm';\nconst ICON_LUMINOSITY = 32;\nconst DEFAULT_WRAPPER_SIZE = 40;\nconst ICON_PADDING = 8;\nexport const DEFAULT_ICON_COLOR = 'hsl(0, 0%, 32%)';\n\nconst SIZE_CONFIGS = {\n s: {\n faSize: 12,\n wrapperSize: 32\n },\n m: {\n faSize: 16,\n wrapperSize: DEFAULT_WRAPPER_SIZE\n },\n xl: {\n faSize: 20,\n wrapperSize: 48\n }\n};\n\nexport const getForegroundColor = backgroundColor =>\n new Color(backgroundColor).to('hsl').set({l: ICON_LUMINOSITY}).toString();\n\nconst Icon = React.memo(function Icon({\n iconName,\n iconColor,\n backgroundColor,\n preset = DEFAULT_PRESET,\n size\n}) {\n const effectiveIconColor =\n iconColor || backgroundColor ? getForegroundColor(backgroundColor) : DEFAULT_ICON_COLOR;\n\n const effectiveSize = size\n ? merge(SIZE_CONFIGS[DEFAULT_PRESET], size)\n : getOr(SIZE_CONFIGS[DEFAULT_PRESET], toLower(preset), SIZE_CONFIGS);\n\n const wrapperSize = effectiveSize.wrapperSize - ICON_PADDING * 2;\n\n const iconWrapperStyle = {\n backgroundColor,\n width: wrapperSize,\n height: wrapperSize,\n padding: ICON_PADDING\n };\n\n return (\n <div className={style.iconWrapper} style={iconWrapperStyle}>\n <FontAwesomeIcon\n icon={`fa-${iconName}`}\n color={effectiveIconColor}\n font-size={effectiveSize.faSize}\n />\n </div>\n );\n});\n\nIcon.propTypes = {\n iconName: PropTypes.string.isRequired,\n iconColor: PropTypes.string,\n backgroundColor: PropTypes.string,\n preset: PropTypes.oneOf(['s', 'm', 'xl']),\n size: PropTypes.shape({\n faSize: number,\n wrapperSize: PropTypes.number\n })\n};\n\nexport default Icon;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAEAA,2BAAA,CAAQC,GAAR,CAAYC,qBAAZ;;AAEA,MAAMC,cAAc,GAAG,GAAvB;AACA,MAAMC,eAAe,GAAG,EAAxB;AACA,MAAMC,oBAAoB,GAAG,EAA7B;AACA,MAAMC,YAAY,GAAG,CAArB;AACO,MAAMC,kBAAkB,GAAG,iBAA3B;;AAEP,MAAMC,YAAY,GAAG;EACnBC,CAAC,EAAE;IACDC,MAAM,EAAE,EADP;IAEDC,WAAW,EAAE;EAFZ,CADgB;EAKnBC,CAAC,EAAE;IACDF,MAAM,EAAE,EADP;IAEDC,WAAW,EAAEN;EAFZ,CALgB;EASnBQ,EAAE,EAAE;IACFH,MAAM,EAAE,EADN;IAEFC,WAAW,EAAE;EAFX;AATe,CAArB;;AAeO,MAAMG,kBAAkB,GAAGC,eAAe,IAC/C,IAAIC,gBAAJ,CAAUD,eAAV,EAA2BE,EAA3B,CAA8B,KAA9B,EAAqCC,GAArC,CAAyC;EAACC,CAAC,EAAEf;AAAJ,CAAzC,EAA+DgB,QAA/D,EADK;;;;AAGP,MAAMC,IAAI,gBAAGC,cAAA,CAAMC,IAAN,CAAW,SAASF,IAAT,CAAc;EACpCG,QADoC;EAEpCC,SAFoC;EAGpCV,eAHoC;EAIpCW,MAAM,GAAGvB,cAJ2B;EAKpCwB;AALoC,CAAd,EAMrB;EACD,MAAMC,kBAAkB,GACtBH,SAAS,IAAIV,eAAb,GAA+BD,kBAAkB,CAACC,eAAD,CAAjD,GAAqER,kBADvE;EAGA,MAAMsB,aAAa,GAAGF,IAAI,GACtB,IAAAG,cAAA,EAAMtB,YAAY,CAACL,cAAD,CAAlB,EAAoCwB,IAApC,CADsB,GAEtB,IAAAI,cAAA,EAAMvB,YAAY,CAACL,cAAD,CAAlB,EAAoC,IAAA6B,gBAAA,EAAQN,MAAR,CAApC,EAAqDlB,YAArD,CAFJ;EAIA,MAAMG,WAAW,GAAGkB,aAAa,CAAClB,WAAd,GAA4BL,YAAY,GAAG,CAA/D;EAEA,MAAM2B,gBAAgB,GAAG;IACvBlB,eADuB;IAEvBmB,KAAK,EAAEvB,WAFgB;IAGvBwB,MAAM,EAAExB,WAHe;IAIvByB,OAAO,EAAE9B;EAJc,CAAzB;EAOA,oBACE;IAAK,SAAS,EAAE+B,cAAA,CAAMC,WAAtB;IAAmC,KAAK,EAAEL;EAA1C,gBACE,6BAAC,iCAAD;IACE,IAAI,EAAG,MAAKT,QAAS,EADvB;IAEE,KAAK,EAAEI,kBAFT;IAGE,aAAWC,aAAa,CAACnB;EAH3B,EADF,CADF;AASD,CAhCY,CAAb;;AAkCAW,IAAI,CAACkB,SAAL,2CAAiB;EACff,QAAQ,EAAEgB,kBAAA,CAAUC,MAAV,CAAiBC,UADZ;EAEfjB,SAAS,EAAEe,kBAAA,CAAUC,MAFN;EAGf1B,eAAe,EAAEyB,kBAAA,CAAUC,MAHZ;EAIff,MAAM,EAAEc,kBAAA,CAAUG,KAAV,CAAgB,CAAC,GAAD,EAAM,GAAN,EAAW,IAAX,CAAhB,CAJO;EAKfhB,IAAI,EAAEa,kBAAA,CAAUI,KAAV,CAAgB;IACpBlC,MAAM,EAAEmC,iBADY;IAEpBlC,WAAW,EAAE6B,kBAAA,CAAUK;EAFH,CAAhB;AALS,CAAjB;eAWexB,I"}
1
+ {"version":3,"file":"index.js","names":["library","add","fas","DEFAULT_PRESET","ICON_LUMINOSITY","DEFAULT_WRAPPER_SIZE","ICON_PADDING","DEFAULT_ICON_COLOR","SIZE_CONFIGS","s","faSize","wrapperSize","m","xl","getForegroundColor","backgroundColor","Color","to","set","l","toString","Icon","React","memo","iconName","iconColor","preset","size","effectiveIconColor","effectiveSize","merge","getOr","toLower","iconWrapperStyle","width","height","padding","style","iconWrapper","propTypes","PropTypes","string","isRequired","oneOf","shape","number"],"sources":["../../../src/atom/icon/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes, {number} from 'prop-types';\nimport {FontAwesomeIcon} from '@fortawesome/react-fontawesome';\nimport {fas} from '@fortawesome/pro-solid-svg-icons';\nimport {library} from '@fortawesome/fontawesome-svg-core';\nimport toLower from 'lodash/fp/toLower';\nimport merge from 'lodash/fp/merge';\nimport getOr from 'lodash/fp/getOr';\nimport Color from 'colorjs.io';\nimport style from './style.css';\n\nlibrary.add(fas);\n\nconst DEFAULT_PRESET = 'm';\nconst ICON_LUMINOSITY = 32;\nconst DEFAULT_WRAPPER_SIZE = 40;\nconst ICON_PADDING = 8;\nexport const DEFAULT_ICON_COLOR = 'hsl(0, 0%, 32%)';\n\nconst SIZE_CONFIGS = {\n s: {\n faSize: 12,\n wrapperSize: 32\n },\n m: {\n faSize: 16,\n wrapperSize: DEFAULT_WRAPPER_SIZE\n },\n xl: {\n faSize: 20,\n wrapperSize: 48\n }\n};\n\nexport const getForegroundColor = backgroundColor =>\n new Color(backgroundColor).to('hsl').set({l: ICON_LUMINOSITY}).toString();\n\nconst Icon = React.memo(function Icon({\n iconName,\n iconColor,\n backgroundColor,\n preset = DEFAULT_PRESET,\n size\n}) {\n const effectiveIconColor =\n iconColor || (backgroundColor ? getForegroundColor(backgroundColor) : DEFAULT_ICON_COLOR);\n\n const effectiveSize = size\n ? merge(SIZE_CONFIGS[DEFAULT_PRESET], size)\n : getOr(SIZE_CONFIGS[DEFAULT_PRESET], toLower(preset), SIZE_CONFIGS);\n\n const wrapperSize = effectiveSize.wrapperSize - ICON_PADDING * 2;\n\n const iconWrapperStyle = {\n backgroundColor,\n width: wrapperSize,\n height: wrapperSize,\n padding: ICON_PADDING\n };\n\n return (\n <div className={style.iconWrapper} style={iconWrapperStyle}>\n <FontAwesomeIcon\n icon={`fa-${iconName}`}\n color={effectiveIconColor}\n fontSize={effectiveSize.faSize}\n />\n </div>\n );\n});\n\nIcon.propTypes = {\n iconName: PropTypes.string.isRequired,\n iconColor: PropTypes.string,\n backgroundColor: PropTypes.string,\n preset: PropTypes.oneOf(['s', 'm', 'xl']),\n size: PropTypes.shape({\n faSize: number,\n wrapperSize: PropTypes.number\n })\n};\n\nexport default Icon;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAEAA,2BAAA,CAAQC,GAAR,CAAYC,qBAAZ;;AAEA,MAAMC,cAAc,GAAG,GAAvB;AACA,MAAMC,eAAe,GAAG,EAAxB;AACA,MAAMC,oBAAoB,GAAG,EAA7B;AACA,MAAMC,YAAY,GAAG,CAArB;AACO,MAAMC,kBAAkB,GAAG,iBAA3B;;AAEP,MAAMC,YAAY,GAAG;EACnBC,CAAC,EAAE;IACDC,MAAM,EAAE,EADP;IAEDC,WAAW,EAAE;EAFZ,CADgB;EAKnBC,CAAC,EAAE;IACDF,MAAM,EAAE,EADP;IAEDC,WAAW,EAAEN;EAFZ,CALgB;EASnBQ,EAAE,EAAE;IACFH,MAAM,EAAE,EADN;IAEFC,WAAW,EAAE;EAFX;AATe,CAArB;;AAeO,MAAMG,kBAAkB,GAAGC,eAAe,IAC/C,IAAIC,gBAAJ,CAAUD,eAAV,EAA2BE,EAA3B,CAA8B,KAA9B,EAAqCC,GAArC,CAAyC;EAACC,CAAC,EAAEf;AAAJ,CAAzC,EAA+DgB,QAA/D,EADK;;;;AAGP,MAAMC,IAAI,gBAAGC,cAAA,CAAMC,IAAN,CAAW,SAASF,IAAT,CAAc;EACpCG,QADoC;EAEpCC,SAFoC;EAGpCV,eAHoC;EAIpCW,MAAM,GAAGvB,cAJ2B;EAKpCwB;AALoC,CAAd,EAMrB;EACD,MAAMC,kBAAkB,GACtBH,SAAS,KAAKV,eAAe,GAAGD,kBAAkB,CAACC,eAAD,CAArB,GAAyCR,kBAA7D,CADX;EAGA,MAAMsB,aAAa,GAAGF,IAAI,GACtB,IAAAG,cAAA,EAAMtB,YAAY,CAACL,cAAD,CAAlB,EAAoCwB,IAApC,CADsB,GAEtB,IAAAI,cAAA,EAAMvB,YAAY,CAACL,cAAD,CAAlB,EAAoC,IAAA6B,gBAAA,EAAQN,MAAR,CAApC,EAAqDlB,YAArD,CAFJ;EAIA,MAAMG,WAAW,GAAGkB,aAAa,CAAClB,WAAd,GAA4BL,YAAY,GAAG,CAA/D;EAEA,MAAM2B,gBAAgB,GAAG;IACvBlB,eADuB;IAEvBmB,KAAK,EAAEvB,WAFgB;IAGvBwB,MAAM,EAAExB,WAHe;IAIvByB,OAAO,EAAE9B;EAJc,CAAzB;EAOA,oBACE;IAAK,SAAS,EAAE+B,cAAA,CAAMC,WAAtB;IAAmC,KAAK,EAAEL;EAA1C,gBACE,6BAAC,iCAAD;IACE,IAAI,EAAG,MAAKT,QAAS,EADvB;IAEE,KAAK,EAAEI,kBAFT;IAGE,QAAQ,EAAEC,aAAa,CAACnB;EAH1B,EADF,CADF;AASD,CAhCY,CAAb;;AAkCAW,IAAI,CAACkB,SAAL,2CAAiB;EACff,QAAQ,EAAEgB,kBAAA,CAAUC,MAAV,CAAiBC,UADZ;EAEfjB,SAAS,EAAEe,kBAAA,CAAUC,MAFN;EAGf1B,eAAe,EAAEyB,kBAAA,CAAUC,MAHZ;EAIff,MAAM,EAAEc,kBAAA,CAAUG,KAAV,CAAgB,CAAC,GAAD,EAAM,GAAN,EAAW,IAAX,CAAhB,CAJO;EAKfhB,IAAI,EAAEa,kBAAA,CAAUI,KAAV,CAAgB;IACpBlC,MAAM,EAAEmC,iBADY;IAEpBlC,WAAW,EAAE6B,kBAAA,CAAUK;EAFH,CAAhB;AALS,CAAjB;eAWexB,I"}
@@ -0,0 +1,33 @@
1
+ export default BaseModal;
2
+ declare function BaseModal(props: any): JSX.Element | null;
3
+ declare namespace BaseModal {
4
+ namespace propTypes {
5
+ const title: PropTypes.Requireable<string>;
6
+ const headerIcon: PropTypes.Requireable<PropTypes.InferProps<{
7
+ name: PropTypes.Requireable<string>;
8
+ color: PropTypes.Requireable<string>;
9
+ backgroundColor: PropTypes.Requireable<string>;
10
+ }>>;
11
+ const description: PropTypes.Requireable<string>;
12
+ const children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
13
+ const isOpen: PropTypes.Requireable<boolean>;
14
+ const footer: PropTypes.Requireable<NonNullable<((...args: any[]) => any) | PropTypes.InferProps<{
15
+ text: PropTypes.Requireable<string>;
16
+ isError: any;
17
+ cancelButton: PropTypes.Requireable<PropTypes.InferProps<{
18
+ label: PropTypes.Requireable<string>;
19
+ onCancel: PropTypes.Requireable<(...args: any[]) => any>;
20
+ disabled: PropTypes.Requireable<boolean>;
21
+ }>>;
22
+ confirmButton: PropTypes.Requireable<PropTypes.InferProps<{
23
+ label: PropTypes.Requireable<string>;
24
+ onConfirm: PropTypes.Requireable<(...args: any[]) => any>;
25
+ iconName: PropTypes.Requireable<string>;
26
+ disabled: PropTypes.Requireable<boolean>;
27
+ }>>;
28
+ }> | null | undefined>>;
29
+ const onClose: PropTypes.Requireable<(...args: any[]) => any>;
30
+ }
31
+ }
32
+ import PropTypes from "prop-types";
33
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/base-modal/index.js"],"names":[],"mappings":";AAOA,2DAmGC"}