@liner-fe/icon 0.0.4 → 0.0.6

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 (187) hide show
  1. package/.gitignore +2 -1
  2. package/CHANGELOG.md +12 -0
  3. package/assets/add-clock/index.tsx +19 -18
  4. package/assets/add-to-folder/index.tsx +15 -14
  5. package/assets/ai/index.tsx +22 -21
  6. package/assets/airplane/index.tsx +11 -10
  7. package/assets/android/index.tsx +11 -10
  8. package/assets/apple/index.tsx +15 -14
  9. package/assets/arrow-back/index.tsx +11 -10
  10. package/assets/arrow-backward/index.tsx +11 -10
  11. package/assets/arrow-down/index.tsx +11 -10
  12. package/assets/arrow-down-left/index.tsx +11 -10
  13. package/assets/arrow-downward/index.tsx +11 -10
  14. package/assets/arrow-drop-right/index.tsx +11 -10
  15. package/assets/arrow-forward/index.tsx +11 -10
  16. package/assets/arrow-left/index.tsx +11 -10
  17. package/assets/arrow-right/index.tsx +11 -10
  18. package/assets/arrow-turn/index.tsx +11 -10
  19. package/assets/arrow-up/index.tsx +11 -10
  20. package/assets/arrow-up-down/index.tsx +15 -14
  21. package/assets/arrow-up-left/index.tsx +11 -10
  22. package/assets/arrow-up-right/index.tsx +11 -10
  23. package/assets/arrow-upward/index.tsx +11 -10
  24. package/assets/balance/index.tsx +19 -18
  25. package/assets/bell/index.tsx +15 -14
  26. package/assets/block/index.tsx +11 -10
  27. package/assets/bolt/index.tsx +11 -10
  28. package/assets/book/index.tsx +12 -11
  29. package/assets/bookmark/index.tsx +11 -10
  30. package/assets/bookmark-cancel/index.tsx +19 -18
  31. package/assets/books/index.tsx +19 -18
  32. package/assets/brain/index.tsx +12 -11
  33. package/assets/bulb/index.tsx +15 -14
  34. package/assets/bulb-exclamtionmark/index.tsx +23 -22
  35. package/assets/camera/index.tsx +14 -13
  36. package/assets/car/index.tsx +11 -10
  37. package/assets/casual-shoe/index.tsx +11 -10
  38. package/assets/chart-bar/index.tsx +20 -19
  39. package/assets/chart-line-uptrend/index.tsx +13 -19
  40. package/assets/check-mark/index.tsx +11 -10
  41. package/assets/check-mark-fill/index.tsx +15 -14
  42. package/assets/chrome/index.tsx +23 -22
  43. package/assets/clock/index.tsx +15 -14
  44. package/assets/close/index.tsx +11 -10
  45. package/assets/close-fill/index.tsx +15 -14
  46. package/assets/color-docx/index.tsx +52 -0
  47. package/assets/color-facebook/index.tsx +32 -0
  48. package/assets/color-fire/index.tsx +36 -0
  49. package/assets/color-google/index.tsx +44 -0
  50. package/assets/color-liner/index.tsx +32 -0
  51. package/assets/color-liner-variation/index.tsx +60 -0
  52. package/assets/color-pdf/index.tsx +48 -0
  53. package/assets/color-txt/index.tsx +48 -0
  54. package/assets/copy/index.tsx +12 -11
  55. package/assets/credit/index.tsx +19 -18
  56. package/assets/creditcard/index.tsx +15 -14
  57. package/assets/dark-mode/index.tsx +11 -10
  58. package/assets/description/index.tsx +20 -19
  59. package/assets/desktop/index.tsx +11 -10
  60. package/assets/desktop-on-cursor/index.tsx +19 -18
  61. package/assets/document/index.tsx +13 -12
  62. package/assets/document-add/index.tsx +17 -16
  63. package/assets/document-check/index.tsx +17 -16
  64. package/assets/document-warning/index.tsx +15 -14
  65. package/assets/double-arrow-backward/index.tsx +15 -14
  66. package/assets/{lds-pri-icon-s-double-arrow-forward → double-arrow-forward}/index.tsx +16 -15
  67. package/assets/download/index.tsx +15 -14
  68. package/assets/drop-down/index.tsx +11 -10
  69. package/assets/drop-up/index.tsx +11 -10
  70. package/assets/email/index.tsx +13 -12
  71. package/assets/end/index.tsx +15 -14
  72. package/assets/essay/index.tsx +17 -16
  73. package/assets/exclamationmark/index.tsx +13 -12
  74. package/assets/exclamationmark-fill/index.tsx +11 -10
  75. package/assets/expand/index.tsx +15 -14
  76. package/assets/expand-close/index.tsx +11 -10
  77. package/assets/extend/index.tsx +11 -10
  78. package/assets/facebook/index.tsx +11 -10
  79. package/assets/feedback/index.tsx +15 -14
  80. package/assets/filter/index.tsx +19 -18
  81. package/assets/fire/index.tsx +14 -13
  82. package/assets/flowchart/index.tsx +11 -10
  83. package/assets/focus/index.tsx +15 -14
  84. package/assets/folder/index.tsx +11 -10
  85. package/assets/folder-add/index.tsx +13 -12
  86. package/assets/folder-open/index.tsx +11 -24
  87. package/assets/folder-open-share/index.tsx +19 -18
  88. package/assets/folder-share/index.tsx +19 -18
  89. package/assets/formal-bag/index.tsx +11 -10
  90. package/assets/globe/index.tsx +11 -10
  91. package/assets/google/index.tsx +11 -10
  92. package/assets/google-export/index.tsx +19 -18
  93. package/assets/graduationcap/index.tsx +12 -11
  94. package/assets/help/index.tsx +15 -14
  95. package/assets/hide-all/index.tsx +23 -102
  96. package/assets/highlight-edit/index.tsx +15 -14
  97. package/assets/highlighter/index.tsx +11 -10
  98. package/assets/history/index.tsx +15 -14
  99. package/assets/home/index.tsx +11 -10
  100. package/assets/info/index.tsx +19 -18
  101. package/assets/light/index.tsx +15 -14
  102. package/assets/light-mode/index.tsx +43 -42
  103. package/assets/liner/index.tsx +15 -14
  104. package/assets/link/index.tsx +15 -14
  105. package/assets/list/index.tsx +31 -30
  106. package/assets/literature-review/index.tsx +27 -26
  107. package/assets/lock/index.tsx +15 -14
  108. package/assets/magic-pencil/index.tsx +27 -26
  109. package/assets/magic-wand/index.tsx +23 -22
  110. package/assets/make-easy/index.tsx +27 -26
  111. package/assets/members/index.tsx +23 -22
  112. package/assets/memo/index.tsx +15 -14
  113. package/assets/menu/index.tsx +19 -18
  114. package/assets/microscope/index.tsx +11 -10
  115. package/assets/mindmap/index.tsx +11 -10
  116. package/assets/minus/index.tsx +11 -18
  117. package/assets/mobile/index.tsx +15 -14
  118. package/assets/more/index.tsx +19 -18
  119. package/assets/move/index.tsx +11 -10
  120. package/assets/move-to-folder/index.tsx +15 -14
  121. package/assets/new-chrome-extension/index.tsx +11 -10
  122. package/assets/new-tab/index.tsx +15 -14
  123. package/assets/new-thread/index.tsx +13 -12
  124. package/assets/new-thread-folder/index.tsx +19 -18
  125. package/assets/palette/index.tsx +27 -26
  126. package/assets/paperclip/index.tsx +11 -17
  127. package/assets/paragraph/index.tsx +23 -22
  128. package/assets/paraphrase/index.tsx +23 -22
  129. package/assets/pencil/index.tsx +12 -11
  130. package/assets/person/index.tsx +15 -14
  131. package/assets/person-add/index.tsx +19 -18
  132. package/assets/person-fill/index.tsx +11 -10
  133. package/assets/photo/index.tsx +14 -13
  134. package/assets/play-button/index.tsx +14 -13
  135. package/assets/plus/index.tsx +11 -10
  136. package/assets/power/index.tsx +15 -14
  137. package/assets/question-box/index.tsx +15 -14
  138. package/assets/question-message/index.tsx +15 -14
  139. package/assets/quote/index.tsx +15 -14
  140. package/assets/redo/index.tsx +11 -10
  141. package/assets/regenerate/index.tsx +15 -14
  142. package/assets/remove-from-folder/index.tsx +15 -14
  143. package/assets/report/index.tsx +15 -14
  144. package/assets/restaurant/index.tsx +19 -18
  145. package/assets/retry/index.tsx +11 -10
  146. package/assets/rocket/index.tsx +15 -14
  147. package/assets/search/index.tsx +11 -10
  148. package/assets/secret-mode/index.tsx +15 -14
  149. package/assets/send/index.tsx +11 -10
  150. package/assets/setting/index.tsx +15 -14
  151. package/assets/share/index.tsx +15 -14
  152. package/assets/sheet-export/index.tsx +15 -14
  153. package/assets/shield/index.tsx +13 -26
  154. package/assets/shield-person/index.tsx +19 -18
  155. package/assets/shield-usage/index.tsx +27 -26
  156. package/assets/shorten/index.tsx +15 -14
  157. package/assets/show-all/index.tsx +23 -22
  158. package/assets/sign-out/index.tsx +15 -14
  159. package/assets/source/index.tsx +23 -22
  160. package/assets/speaker/index.tsx +15 -14
  161. package/assets/spinner/index.tsx +15 -14
  162. package/assets/stack/index.tsx +19 -18
  163. package/assets/start/index.tsx +15 -14
  164. package/assets/step/index.tsx +15 -14
  165. package/assets/stop/index.tsx +15 -14
  166. package/assets/summarize/index.tsx +20 -18
  167. package/assets/target/index.tsx +19 -18
  168. package/assets/teams/index.tsx +18 -17
  169. package/assets/text-select/index.tsx +15 -14
  170. package/assets/thumb-down/index.tsx +13 -12
  171. package/assets/thumb-up/index.tsx +13 -12
  172. package/assets/timer/index.tsx +19 -18
  173. package/assets/translate/index.tsx +15 -14
  174. package/assets/trash/index.tsx +17 -16
  175. package/assets/tune/index.tsx +31 -30
  176. package/assets/twitter/index.tsx +11 -10
  177. package/assets/undo/index.tsx +11 -10
  178. package/assets/verification-badge/index.tsx +11 -10
  179. package/assets/view-list/index.tsx +11 -10
  180. package/assets/visibility/index.tsx +15 -14
  181. package/assets/visibility-off/index.tsx +27 -26
  182. package/assets/volume/index.tsx +11 -10
  183. package/assets/volume-up/index.tsx +19 -18
  184. package/assets/zoom-in/index.tsx +15 -14
  185. package/assets/zoom-out/index.tsx +15 -14
  186. package/index.tsx +44 -26
  187. package/package.json +7 -3
package/assets/arrow-upward/index.tsx CHANGED
@@ -1,31 +1,32 @@
1
- import React from 'react';
1
+ import React from 'react';import { BasicColorType } from '@liner-fe/prism';
2
2
 
3
3
  interface ArrowUpwardProps {
4
4
  fill?: boolean;
5
5
  thick?: boolean;
6
6
  size?: number
7
+ color?: BasicColorType;
7
8
  }
8
9
 
9
- export const ArrowUpward = ({ fill = false, thick = false, size = 24 }: ArrowUpwardProps) => {
10
+ export const ArrowUpward = ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary' }: ArrowUpwardProps) => {
10
11
  if (fill && thick) {
11
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
12
- <path fillRule="evenodd" clipRule="evenodd" d="M37.9391 30.0602L24.3534 16.4746C24.1582 16.2793 23.8416 16.2793 23.6463 16.4746L10.0607 30.0602L7.93936 27.9389L21.525 14.3533C22.8918 12.9864 25.1079 12.9864 26.4748 14.3533L40.0604 27.9389L37.9391 30.0602Z" fill="currentColor"/>
12
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
13
+ <path fillRule="evenodd" clipRule="evenodd" d="M37.9392 30.0602L24.3535 16.4746C24.1583 16.2793 23.8417 16.2793 23.6464 16.4746L10.0608 30.0602L7.93945 27.9389L21.5251 14.3533C22.8919 12.9864 25.108 12.9864 26.4748 14.3533L40.0605 27.9389L37.9392 30.0602Z" style={{ fill: `var(--${color})` }}/>
13
14
  </svg>
14
15
  ;
15
16
  } else if (fill) {
16
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
17
- <path fillRule="evenodd" clipRule="evenodd" d="M37.9391 30.0602L24.3534 16.4746C24.1582 16.2793 23.8416 16.2793 23.6463 16.4746L10.0607 30.0602L7.93936 27.9389L21.525 14.3533C22.8918 12.9864 25.1079 12.9864 26.4748 14.3533L40.0604 27.9389L37.9391 30.0602Z" fill="currentColor"/>
17
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
18
+ <path fillRule="evenodd" clipRule="evenodd" d="M37.9392 30.0602L24.3535 16.4746C24.1583 16.2793 23.8417 16.2793 23.6464 16.4746L10.0608 30.0602L7.93945 27.9389L21.5251 14.3533C22.8919 12.9864 25.108 12.9864 26.4748 14.3533L40.0605 27.9389L37.9392 30.0602Z" style={{ fill: `var(--${color})` }}/>
18
19
  </svg>
19
20
  ;
20
21
  } else if (thick) {
21
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
22
- <path fillRule="evenodd" clipRule="evenodd" d="M37.5855 30.4138L23.9999 16.8281L10.4142 30.4138L7.58582 27.5853L21.1715 13.9997C22.7336 12.4376 25.2662 12.4376 26.8283 13.9997L40.414 27.5853L37.5855 30.4138Z" fill="currentColor"/>
22
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
23
+ <path fillRule="evenodd" clipRule="evenodd" d="M37.5857 30.4138L24 16.8281L10.4144 30.4138L7.58594 27.5853L21.1716 13.9997C22.7337 12.4376 25.2663 12.4376 26.8284 13.9997L40.4141 27.5853L37.5857 30.4138Z" style={{ fill: `var(--${color})` }}/>
23
24
  </svg>
24
25
  ;
25
26
  }
26
27
 
27
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
28
- <path fillRule="evenodd" clipRule="evenodd" d="M37.9391 30.0602L24.3534 16.4746C24.1582 16.2793 23.8416 16.2793 23.6463 16.4746L10.0607 30.0602L7.93936 27.9389L21.525 14.3533C22.8918 12.9864 25.1079 12.9864 26.4748 14.3533L40.0604 27.9389L37.9391 30.0602Z" fill="currentColor"/>
28
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
29
+ <path fillRule="evenodd" clipRule="evenodd" d="M37.9392 30.0602L24.3535 16.4746C24.1583 16.2793 23.8417 16.2793 23.6464 16.4746L10.0608 30.0602L7.93945 27.9389L21.5251 14.3533C22.8919 12.9864 25.108 12.9864 26.4748 14.3533L40.0605 27.9389L37.9392 30.0602Z" style={{ fill: `var(--${color})` }}/>
29
30
  </svg>
30
31
  ;
31
32
  };
package/assets/balance/index.tsx CHANGED
@@ -1,39 +1,40 @@
1
- import React from 'react';
1
+ import React from 'react';import { BasicColorType } from '@liner-fe/prism';
2
2
 
3
3
  interface BalanceProps {
4
4
  fill?: boolean;
5
5
  thick?: boolean;
6
6
  size?: number
7
+ color?: BasicColorType;
7
8
  }
8
9
 
9
- export const Balance = ({ fill = false, thick = false, size = 24 }: BalanceProps) => {
10
+ export const Balance = ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary' }: BalanceProps) => {
10
11
  if (fill && thick) {
11
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
12
- <path d="M25.2842 11.1651L39.312 7.95019L38.4184 4.05127L5.98584 11.4843L6.8794 15.3832L21.2842 12.0818L21.2842 39.0011H11.5469V43.0011H34.8807V39.0011H25.2842L25.2842 11.1651Z" fill="currentColor"/>
13
- <path d="M39.1225 22.3676C39.5542 23.6627 38.5903 25.0001 37.2251 25.0001H30.7748C29.4097 25.0001 28.4458 23.6627 28.8775 22.3676L32.1026 12.6922C32.7104 10.8688 35.2896 10.8688 35.8974 12.6922L39.1225 22.3676Z" fill="currentColor"/>
14
- <path d="M18.1225 27.3676C18.5542 28.6627 17.5903 30.0001 16.2251 30.0001H9.77485C8.40973 30.0001 7.44579 28.6627 7.87748 27.3676L11.1026 17.6922C11.7104 15.8688 14.2896 15.8688 14.8974 17.6922L18.1225 27.3676Z" fill="currentColor"/>
12
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
13
+ <path d="M25.2842 11.1646L39.312 7.9497L38.4184 4.05078L5.98584 11.4838L6.8794 15.3827L21.2842 12.0814L21.2842 39.0006H11.5469V43.0006H34.8807V39.0006H25.2842L25.2842 11.1646Z" style={{ fill: `var(--${color})` }}/>
14
+ <path d="M39.1225 22.3672C39.5542 23.6622 38.5903 24.9996 37.2251 24.9996H30.7748C29.4097 24.9996 28.4458 23.6622 28.8775 22.3672L32.1026 12.6917C32.7104 10.8683 35.2896 10.8683 35.8974 12.6917L39.1225 22.3672Z" style={{ fill: `var(--${color})` }}/>
15
+ <path d="M18.1225 27.3672C18.5542 28.6622 17.5903 29.9996 16.2251 29.9996H9.77485C8.40973 29.9996 7.44579 28.6622 7.87748 27.3672L11.1026 17.6917C11.7104 15.8683 14.2896 15.8683 14.8974 17.6917L18.1225 27.3672Z" style={{ fill: `var(--${color})` }}/>
15
16
  </svg>
16
17
  ;
17
18
  } else if (fill) {
18
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
19
- <path d="M24.7842 10.7662L39.2005 7.46227L38.5303 4.53809L6.09775 11.9711L6.76792 14.8953L21.7842 11.4538L21.7842 39.5009H11.5471V42.5009H34.8809V39.5009H24.7842L24.7842 10.7662Z" fill="currentColor"/>
20
- <path d="M39.1225 22.3673C39.5542 23.6623 38.5903 24.9997 37.2251 24.9997H30.7748C29.4097 24.9997 28.4458 23.6623 28.8775 22.3673L32.1026 12.6918C32.7104 10.8684 35.2896 10.8684 35.8974 12.6918L39.1225 22.3673Z" fill="currentColor"/>
21
- <path d="M18.1225 27.3673C18.5542 28.6623 17.5903 29.9997 16.2251 29.9997H9.77485C8.40973 29.9997 7.44579 28.6623 7.87748 27.3673L11.1026 17.6918C11.7104 15.8684 14.2896 15.8684 14.8974 17.6918L18.1225 27.3673Z" fill="currentColor"/>
19
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
20
+ <path d="M24.7841 10.7672L39.2004 7.46325L38.5302 4.53906L6.09766 11.972L6.76783 14.8962L21.7841 11.4548L21.7841 39.5018H11.547V42.5018H34.8808V39.5018H24.7841L24.7841 10.7672Z" style={{ fill: `var(--${color})` }}/>
21
+ <path d="M39.1224 22.3683C39.5541 23.6633 38.5902 25.0007 37.2251 25.0007H30.7748C29.4096 25.0007 28.4457 23.6633 28.8774 22.3682L32.1025 12.6928C32.7103 10.8694 35.2895 10.8694 35.8973 12.6928L39.1224 22.3683Z" style={{ fill: `var(--${color})` }}/>
22
+ <path d="M18.1224 27.3683C18.5541 28.6633 17.5902 30.0007 16.2251 30.0007H9.77476C8.40964 30.0007 7.4457 28.6633 7.87739 27.3683L11.1025 17.6928C11.7103 15.8694 14.2895 15.8694 14.8973 17.6928L18.1224 27.3683Z" style={{ fill: `var(--${color})` }}/>
22
23
  </svg>
23
24
  ;
24
25
  } else if (thick) {
25
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
26
- <path d="M25.2842 11.1647L39.3122 7.9497L38.4186 4.05078L5.98605 11.4838L6.87962 15.3827L21.2842 12.0814L21.2842 39.0009H11.5471V43.0009H34.8809V39.0009H25.2842L25.2842 11.1647Z" fill="currentColor"/>
27
- <path fillRule="evenodd" clipRule="evenodd" d="M29.7748 27.7405H38.0522C39.4173 27.7405 40.3813 26.4031 39.9496 25.108L35.8109 12.692C35.2031 10.8686 32.624 10.8686 32.0162 12.6919L27.8775 25.108C27.4458 26.4031 28.4097 27.7405 29.7748 27.7405ZM35.2774 23.7405L33.9135 19.649L32.5497 23.7405H35.2774Z" fill="currentColor"/>
28
- <path fillRule="evenodd" clipRule="evenodd" d="M17.0522 32.925H8.77485C7.40973 32.925 6.44579 31.5877 6.87748 30.2926L11.0162 17.8765C11.624 16.0531 14.2031 16.0531 14.8109 17.8765L18.9496 30.2926C19.3813 31.5877 18.4173 32.925 17.0522 32.925ZM12.9135 24.8335L14.2774 28.925H11.5497L12.9135 24.8335Z" fill="currentColor"/>
26
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
27
+ <path d="M25.2842 11.1647L39.3122 7.9497L38.4187 4.05078L5.98608 11.4838L6.87965 15.3827L21.2842 12.0814L21.2842 39.0009H11.5471V43.0009H34.8809V39.0009H25.2842L25.2842 11.1647Z" style={{ fill: `var(--${color})` }}/>
28
+ <path fillRule="evenodd" clipRule="evenodd" d="M29.7749 27.7405H38.0523C39.4174 27.7405 40.3813 26.4031 39.9496 25.108L35.8109 12.692C35.2031 10.8686 32.624 10.8686 32.0162 12.6919L27.8775 25.108C27.4458 26.4031 28.4098 27.7405 29.7749 27.7405ZM35.2774 23.7405L33.9136 19.649L32.5497 23.7405H35.2774Z" style={{ fill: `var(--${color})` }}/>
29
+ <path fillRule="evenodd" clipRule="evenodd" d="M17.0523 32.925H8.77488C7.40976 32.925 6.44583 31.5877 6.87751 30.2926L11.0162 17.8765C11.624 16.0531 14.2031 16.0531 14.8109 17.8765L18.9496 30.2926C19.3813 31.5877 18.4174 32.925 17.0523 32.925ZM12.9136 24.8335L14.2774 28.925H11.5497L12.9136 24.8335Z" style={{ fill: `var(--${color})` }}/>
29
30
  </svg>
30
31
  ;
31
32
  }
32
33
 
33
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
34
- <path d="M24.7842 10.7662L39.2005 7.46227L38.5303 4.53809L6.09775 11.9711L6.76792 14.8953L21.7842 11.4538L21.7842 39.5009H11.5471V42.5009H34.8809V39.5009H24.7842L24.7842 10.7662Z" fill="currentColor"/>
35
- <path fillRule="evenodd" clipRule="evenodd" d="M29.7748 27.7404H38.0522C39.4173 27.7404 40.3813 26.403 39.9496 25.108L35.8109 12.6919C35.2031 10.8685 32.624 10.8685 32.0162 12.6919L27.8775 25.108C27.4458 26.403 28.4097 27.7404 29.7748 27.7404ZM36.6648 24.7404L33.9135 16.4866L31.1623 24.7404H36.6648Z" fill="currentColor"/>
36
- <path fillRule="evenodd" clipRule="evenodd" d="M17.0522 32.925H8.77485C7.40973 32.925 6.44579 31.5876 6.87748 30.2925L11.0162 17.8765C11.624 16.0531 14.2031 16.0531 14.8109 17.8765L18.9496 30.2925C19.3813 31.5876 18.4173 32.925 17.0522 32.925ZM12.9135 21.6712L15.6648 29.925H10.1623L12.9135 21.6712Z" fill="currentColor"/>
34
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
35
+ <path d="M24.7841 10.7672L39.2004 7.46325L38.5302 4.53906L6.09766 11.972L6.76783 14.8962L21.7841 11.4548L21.7841 39.5018H11.547V42.5018H34.8808V39.5018H24.7841L24.7841 10.7672Z" style={{ fill: `var(--${color})` }}/>
36
+ <path fillRule="evenodd" clipRule="evenodd" d="M29.7748 27.7414H38.0521C39.4173 27.7414 40.3812 26.404 39.9495 25.1089L35.8108 12.6929C35.203 10.8695 32.6239 10.8695 32.0161 12.6929L27.8774 25.1089C27.4457 26.404 28.4096 27.7414 29.7748 27.7414ZM36.6647 24.7414L33.9134 16.4876L31.1622 24.7414H36.6647Z" style={{ fill: `var(--${color})` }}/>
37
+ <path fillRule="evenodd" clipRule="evenodd" d="M17.0521 32.926H8.77476C7.40964 32.926 6.4457 31.5886 6.87739 30.2935L11.0161 17.8774C11.6239 16.054 14.203 16.054 14.8108 17.8774L18.9495 30.2935C19.3812 31.5886 18.4173 32.926 17.0521 32.926ZM12.9134 21.6722L15.6647 29.926H10.1622L12.9134 21.6722Z" style={{ fill: `var(--${color})` }}/>
37
38
  </svg>
38
39
  ;
39
40
  };
package/assets/bell/index.tsx CHANGED
@@ -1,35 +1,36 @@
1
- import React from 'react';
1
+ import React from 'react';import { BasicColorType } from '@liner-fe/prism';
2
2
 
3
3
  interface BellProps {
4
4
  fill?: boolean;
5
5
  thick?: boolean;
6
6
  size?: number
7
+ color?: BasicColorType;
7
8
  }
8
9
 
9
- export const Bell = ({ fill = false, thick = false, size = 24 }: BellProps) => {
10
+ export const Bell = ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary' }: BellProps) => {
10
11
  if (fill && thick) {
11
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
12
- <path fillRule="evenodd" clipRule="evenodd" d="M27 7C27 5.34315 25.6569 4 24 4C22.3431 4 21 5.34315 21 7V7.35005C15.2666 8.71286 11 13.8957 11 20.0813V30L7.82996 34.6984C6.71794 35.9958 7.63976 38 9.34847 38H38.6516C40.3603 38 41.2821 35.9958 40.1701 34.6984L37 30V20.0813C37 13.8957 32.7334 8.71282 27 7.35003V7ZM34 20.0813V30.9174L36.7546 35H11.2455L14 30.9174V20.0813C14 14.4959 18.4948 10 24 10C29.5053 10 34 14.4959 34 20.0813Z" fill="currentColor"/>
13
- <path d="M28 40H20C20 42.2091 21.7909 44 24 44C26.2091 44 28 42.2091 28 40Z" fill="currentColor"/>
12
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
13
+ <path fillRule="evenodd" clipRule="evenodd" d="M27.0001 7C27.0001 5.34315 25.657 4 24.0001 4C22.3433 4 21.0001 5.34315 21.0001 7V7.35005C15.2667 8.71286 11.0001 13.8957 11.0001 20.0813V30L7.83008 34.6984C6.71807 35.9958 7.63988 38 9.34859 38H38.6517C40.3604 38 41.2822 35.9958 40.1702 34.6984L37.0001 30V20.0813C37.0001 13.8957 32.7335 8.71282 27.0001 7.35003V7ZM34.0001 20.0813V30.9174L36.7547 35H11.2456L14.0001 30.9174V20.0813C14.0001 14.4959 18.4949 10 24.0001 10C29.5054 10 34.0001 14.4959 34.0001 20.0813Z" style={{ fill: `var(--${color})` }}/>
14
+ <path d="M28.0001 40H20.0001C20.0001 42.2091 21.791 44 24.0001 44C26.2093 44 28.0001 42.2091 28.0001 40Z" style={{ fill: `var(--${color})` }}/>
14
15
  </svg>
15
16
  ;
16
17
  } else if (fill) {
17
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
18
- <path d="M27 7C27 5.34315 25.6569 4 24 4C22.3431 4 21 5.34315 21 7V7.35005C15.2666 8.71286 11 13.8957 11 20.0813V30L7.82996 34.6984C6.71794 35.9958 7.63976 38 9.34847 38H38.6516C40.3603 38 41.2821 35.9958 40.1701 34.6984L37 30V20.0813C37 13.8957 32.7334 8.71282 27 7.35003V7Z" fill="currentColor"/>
19
- <path d="M28 40H20C20 42.2091 21.7909 44 24 44C26.2091 44 28 42.2091 28 40Z" fill="currentColor"/>
18
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
19
+ <path d="M27.0001 7C27.0001 5.34315 25.657 4 24.0001 4C22.3433 4 21.0001 5.34315 21.0001 7V7.35005C15.2667 8.71286 11.0001 13.8957 11.0001 20.0813V30L7.83008 34.6984C6.71807 35.9958 7.63988 38 9.34859 38H38.6517C40.3604 38 41.2822 35.9958 40.1702 34.6984L37.0001 30V20.0813C37.0001 13.8957 32.7335 8.71282 27.0001 7.35003V7Z" style={{ fill: `var(--${color})` }}/>
20
+ <path d="M28.0001 40H20.0001C20.0001 42.2091 21.791 44 24.0001 44C26.2093 44 28.0001 42.2091 28.0001 40Z" style={{ fill: `var(--${color})` }}/>
20
21
  </svg>
21
22
  ;
22
23
  } else if (thick) {
23
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
24
- <path fillRule="evenodd" clipRule="evenodd" d="M27 7C27 5.34315 25.6569 4 24 4C22.3431 4 21 5.34315 21 7V7.35005C15.2666 8.71286 11 13.8957 11 20.0813V30L7.82996 34.6984C6.71794 35.9958 7.63976 38 9.34847 38H38.6516C40.3603 38 41.2821 35.9958 40.1701 34.6984L37 30V20.0813C37 13.8957 32.7334 8.71282 27 7.35003V7ZM15 20.0813C15 15.0423 19.0529 11 24 11C28.9471 11 33 15.0423 33 20.0813V31.2232L34.8735 34H13.1265L15 31.2232V20.0813Z" fill="currentColor"/>
25
- <path d="M28 40H20C20 42.2091 21.7909 44 24 44C26.2091 44 28 42.2091 28 40Z" fill="currentColor"/>
24
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
25
+ <path fillRule="evenodd" clipRule="evenodd" d="M27.0001 7C27.0001 5.34315 25.657 4 24.0001 4C22.3433 4 21.0001 5.34315 21.0001 7V7.35005C15.2667 8.71286 11.0001 13.8957 11.0001 20.0813V30L7.83008 34.6984C6.71807 35.9958 7.63988 38 9.34859 38H38.6517C40.3604 38 41.2822 35.9958 40.1702 34.6984L37.0001 30V20.0813C37.0001 13.8957 32.7335 8.71282 27.0001 7.35003V7ZM15.0001 20.0813C15.0001 15.0423 19.0531 11 24.0001 11C28.9472 11 33.0001 15.0423 33.0001 20.0813V31.2232L34.8737 34H13.1266L15.0001 31.2232V20.0813Z" style={{ fill: `var(--${color})` }}/>
26
+ <path d="M28.0001 40H20.0001C20.0001 42.2091 21.791 44 24.0001 44C26.2093 44 28.0001 42.2091 28.0001 40Z" style={{ fill: `var(--${color})` }}/>
26
27
  </svg>
27
28
  ;
28
29
  }
29
30
 
30
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
31
- <path fillRule="evenodd" clipRule="evenodd" d="M27 7C27 5.34315 25.6569 4 24 4C22.3431 4 21 5.34315 21 7V7.35005C15.2666 8.71286 11 13.8957 11 20.0813V30L7.82996 34.6984C6.71794 35.9958 7.63976 38 9.34847 38H38.6516C40.3603 38 41.2821 35.9958 40.1701 34.6984L37 30V20.0813C37 13.8957 32.7334 8.71282 27 7.35003V7ZM34 20.0813V30.9174L36.7546 35H11.2455L14 30.9174V20.0813C14 14.4959 18.4948 10 24 10C29.5053 10 34 14.4959 34 20.0813Z" fill="currentColor"/>
32
- <path d="M28 40H20C20 42.2091 21.7909 44 24 44C26.2091 44 28 42.2091 28 40Z" fill="currentColor"/>
31
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
32
+ <path fillRule="evenodd" clipRule="evenodd" d="M27.0001 7C27.0001 5.34315 25.657 4 24.0001 4C22.3433 4 21.0001 5.34315 21.0001 7V7.35005C15.2667 8.71286 11.0001 13.8957 11.0001 20.0813V30L7.83008 34.6984C6.71807 35.9958 7.63988 38 9.34859 38H38.6517C40.3604 38 41.2822 35.9958 40.1702 34.6984L37.0001 30V20.0813C37.0001 13.8957 32.7335 8.71282 27.0001 7.35003V7ZM34.0001 20.0813V30.9174L36.7547 35H11.2456L14.0001 30.9174V20.0813C14.0001 14.4959 18.4949 10 24.0001 10C29.5054 10 34.0001 14.4959 34.0001 20.0813Z" style={{ fill: `var(--${color})` }}/>
33
+ <path d="M28.0001 40H20.0001C20.0001 42.2091 21.791 44 24.0001 44C26.2093 44 28.0001 42.2091 28.0001 40Z" style={{ fill: `var(--${color})` }}/>
33
34
  </svg>
34
35
  ;
35
36
  };
package/assets/block/index.tsx CHANGED
@@ -1,31 +1,32 @@
1
- import React from 'react';
1
+ import React from 'react';import { BasicColorType } from '@liner-fe/prism';
2
2
 
3
3
  interface BlockProps {
4
4
  fill?: boolean;
5
5
  thick?: boolean;
6
6
  size?: number
7
+ color?: BasicColorType;
7
8
  }
8
9
 
9
- export const Block = ({ fill = false, thick = false, size = 24 }: BlockProps) => {
10
+ export const Block = ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary' }: BlockProps) => {
10
11
  if (fill && thick) {
11
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
12
- <path fillRule="evenodd" clipRule="evenodd" d="M44 24C44 35.0457 35.0457 44 24 44C12.9543 44 4 35.0457 4 24C4 12.9543 12.9543 4 24 4C35.0457 4 44 12.9543 44 24ZM41 24C41 33.3888 33.3888 41 24 41C19.8459 41 16.0397 39.51 13.0869 37.0353L37.0353 13.0869C39.51 16.0397 41 19.8459 41 24ZM10.9655 34.914L34.914 10.9655C31.961 8.49031 28.1546 7 24 7C14.6112 7 7 14.6112 7 24C7 28.1546 8.49031 31.961 10.9655 34.914Z" fill="currentColor"/>
12
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
13
+ <path fillRule="evenodd" clipRule="evenodd" d="M44 24C44 35.0457 35.0457 44 24 44C12.9543 44 4 35.0457 4 24C4 12.9543 12.9543 4 24 4C35.0457 4 44 12.9543 44 24ZM41 24C41 33.3888 33.3888 41 24 41C19.8459 41 16.0397 39.51 13.0869 37.0353L37.0353 13.0869C39.51 16.0397 41 19.8459 41 24ZM10.9655 34.914L34.914 10.9655C31.961 8.49031 28.1546 7 24 7C14.6112 7 7 14.6112 7 24C7 28.1546 8.49031 31.961 10.9655 34.914Z" style={{ fill: `var(--${color})` }}/>
13
14
  </svg>
14
15
  ;
15
16
  } else if (fill) {
16
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
17
- <path fillRule="evenodd" clipRule="evenodd" d="M44 24C44 35.0457 35.0457 44 24 44C12.9543 44 4 35.0457 4 24C4 12.9543 12.9543 4 24 4C35.0457 4 44 12.9543 44 24ZM41 24C41 33.3888 33.3888 41 24 41C19.8459 41 16.0397 39.51 13.0869 37.0353L37.0353 13.0869C39.51 16.0397 41 19.8459 41 24ZM10.9655 34.914L34.914 10.9655C31.961 8.49031 28.1546 7 24 7C14.6112 7 7 14.6112 7 24C7 28.1546 8.49031 31.961 10.9655 34.914Z" fill="currentColor"/>
17
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
18
+ <path fillRule="evenodd" clipRule="evenodd" d="M44 24C44 35.0457 35.0457 44 24 44C12.9543 44 4 35.0457 4 24C4 12.9543 12.9543 4 24 4C35.0457 4 44 12.9543 44 24ZM41 24C41 33.3888 33.3888 41 24 41C19.8459 41 16.0397 39.51 13.0869 37.0353L37.0353 13.0869C39.51 16.0397 41 19.8459 41 24ZM10.9655 34.914L34.914 10.9655C31.961 8.49031 28.1546 7 24 7C14.6112 7 7 14.6112 7 24C7 28.1546 8.49031 31.961 10.9655 34.914Z" style={{ fill: `var(--${color})` }}/>
18
19
  </svg>
19
20
  ;
20
21
  } else if (thick) {
21
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
22
- <path fillRule="evenodd" clipRule="evenodd" d="M44 24C44 35.0457 35.0457 44 24 44C12.9543 44 4 35.0457 4 24C4 12.9543 12.9543 4 24 4C35.0457 4 44 12.9543 44 24ZM40 24C40 32.8366 32.8366 40 24 40C20.3028 40 16.8985 38.746 14.1892 36.6401L36.6401 14.1892C38.746 16.8985 40 20.3028 40 24ZM11.3607 33.8118L33.8118 11.3607C31.1024 9.25432 27.6977 8 24 8C15.1634 8 8 15.1634 8 24C8 27.6977 9.25432 31.1024 11.3607 33.8118Z" fill="currentColor"/>
22
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
23
+ <path fillRule="evenodd" clipRule="evenodd" d="M44 24C44 35.0457 35.0457 44 24 44C12.9543 44 4 35.0457 4 24C4 12.9543 12.9543 4 24 4C35.0457 4 44 12.9543 44 24ZM40 24C40 32.8366 32.8366 40 24 40C20.3028 40 16.8985 38.746 14.1892 36.6401L36.6401 14.1892C38.746 16.8985 40 20.3028 40 24ZM11.3607 33.8118L33.8118 11.3607C31.1024 9.25432 27.6977 8 24 8C15.1634 8 8 15.1634 8 24C8 27.6977 9.25432 31.1024 11.3607 33.8118Z" style={{ fill: `var(--${color})` }}/>
23
24
  </svg>
24
25
  ;
25
26
  }
26
27
 
27
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
28
- <path fillRule="evenodd" clipRule="evenodd" d="M44 24C44 35.0457 35.0457 44 24 44C12.9543 44 4 35.0457 4 24C4 12.9543 12.9543 4 24 4C35.0457 4 44 12.9543 44 24ZM41 24C41 33.3888 33.3888 41 24 41C19.8459 41 16.0397 39.51 13.0869 37.0353L37.0353 13.0869C39.51 16.0397 41 19.8459 41 24ZM10.9655 34.914L34.914 10.9655C31.961 8.49031 28.1546 7 24 7C14.6112 7 7 14.6112 7 24C7 28.1546 8.49031 31.961 10.9655 34.914Z" fill="currentColor"/>
28
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
29
+ <path fillRule="evenodd" clipRule="evenodd" d="M44 24C44 35.0457 35.0457 44 24 44C12.9543 44 4 35.0457 4 24C4 12.9543 12.9543 4 24 4C35.0457 4 44 12.9543 44 24ZM41 24C41 33.3888 33.3888 41 24 41C19.8459 41 16.0397 39.51 13.0869 37.0353L37.0353 13.0869C39.51 16.0397 41 19.8459 41 24ZM10.9655 34.914L34.914 10.9655C31.961 8.49031 28.1546 7 24 7C14.6112 7 7 14.6112 7 24C7 28.1546 8.49031 31.961 10.9655 34.914Z" style={{ fill: `var(--${color})` }}/>
29
30
  </svg>
30
31
  ;
31
32
  };
package/assets/bolt/index.tsx CHANGED
@@ -1,31 +1,32 @@
1
- import React from 'react';
1
+ import React from 'react';import { BasicColorType } from '@liner-fe/prism';
2
2
 
3
3
  interface BoltProps {
4
4
  fill?: boolean;
5
5
  thick?: boolean;
6
6
  size?: number
7
+ color?: BasicColorType;
7
8
  }
8
9
 
9
- export const Bolt = ({ fill = false, thick = false, size = 24 }: BoltProps) => {
10
+ export const Bolt = ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary' }: BoltProps) => {
10
11
  if (fill && thick) {
11
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
12
- <path fillRule="evenodd" clipRule="evenodd" d="M23.3575 26.5L21.8951 38.4838L36.4033 21.5L24.9545 21.5L26.4166 9.5162L11.9088 26.5H23.3575ZM28.4452 2.52257C29.0887 1.7693 30.3182 2.3098 30.1982 3.2932L28.3427 18.5L40.7421 18.5C41.5957 18.5 42.0569 19.5005 41.5025 20.1495L19.8664 45.4774C19.2229 46.2307 17.9934 45.6902 18.1134 44.7068L19.9692 29.5H7.56999C6.71643 29.5 6.25523 28.4995 6.80963 27.8505L28.4452 2.52257Z" fill="currentColor"/>
12
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
13
+ <path fillRule="evenodd" clipRule="evenodd" d="M23.3576 26.4991L21.8952 38.4829L36.4033 21.4991L24.9545 21.4991L26.4167 9.51529L11.9088 26.4991H23.3576ZM28.4453 2.52166C29.0887 1.76838 30.3182 2.30889 30.1983 3.29229L28.3428 18.4991L40.7422 18.4991C41.5957 18.4991 42.0569 19.4996 41.5025 20.1486L19.8665 45.4765C19.223 46.2298 17.9935 45.6893 18.1135 44.7059L19.9692 29.4991H7.57005C6.71649 29.4991 6.2553 28.4986 6.80969 27.8496L28.4453 2.52166Z" style={{ fill: `var(--${color})` }}/>
13
14
  </svg>
14
15
  ;
15
16
  } else if (fill) {
16
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
17
- <path d="M30.1982 3.2932C30.3182 2.3098 29.0887 1.7693 28.4452 2.52257L6.80963 27.8505C6.25523 28.4995 6.71643 29.5 7.56999 29.5H19.9692L18.1134 44.7068C17.9934 45.6902 19.2229 46.2307 19.8664 45.4774L41.5025 20.1495C42.0569 19.5005 41.5957 18.5 40.7421 18.5L28.3427 18.5L30.1982 3.2932Z" fill="currentColor"/>
17
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
18
+ <path d="M30.1982 3.29229C30.3182 2.30889 29.0887 1.76838 28.4453 2.52166L6.80969 27.8496C6.2553 28.4986 6.71649 29.4991 7.57005 29.4991H19.9692L18.1135 44.7059C17.9935 45.6893 19.223 46.2298 19.8665 45.4765L41.5025 20.1486C42.0569 19.4996 41.5957 18.4991 40.7422 18.4991L28.3428 18.4991L30.1982 3.29229Z" style={{ fill: `var(--${color})` }}/>
18
19
  </svg>
19
20
  ;
20
21
  } else if (thick) {
21
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
22
- <path fillRule="evenodd" clipRule="evenodd" d="M24.487 25.5L23.2896 35.3117L34.2338 22.5H23.825L25.0222 12.6883L14.0782 25.5H24.487ZM28.4452 2.52257C29.0887 1.7693 30.3182 2.3098 30.1982 3.2932L28.3427 18.5L40.7421 18.5C41.5957 18.5 42.0569 19.5005 41.5025 20.1495L19.8664 45.4774C19.2229 46.2307 17.9934 45.6902 18.1134 44.7068L19.9692 29.5H7.56999C6.71643 29.5 6.25523 28.4995 6.80963 27.8505L28.4452 2.52257Z" fill="currentColor"/>
22
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
23
+ <path fillRule="evenodd" clipRule="evenodd" d="M24.487 25.4991L23.2897 35.3108L34.2339 22.4991H23.8251L25.0223 12.6873L14.0782 25.4991H24.487ZM28.4453 2.52166C29.0887 1.76838 30.3182 2.30889 30.1983 3.29229L28.3428 18.4991L40.7422 18.4991C41.5957 18.4991 42.0569 19.4996 41.5025 20.1486L19.8665 45.4765C19.223 46.2298 17.9935 45.6893 18.1135 44.7059L19.9692 29.4991H7.57005C6.71649 29.4991 6.2553 28.4986 6.80969 27.8496L28.4453 2.52166Z" style={{ fill: `var(--${color})` }}/>
23
24
  </svg>
24
25
  ;
25
26
  }
26
27
 
27
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
28
- <path fillRule="evenodd" clipRule="evenodd" d="M23.3575 26.5L21.8951 38.4838L36.4033 21.5L24.9545 21.5L26.4166 9.5162L11.9088 26.5H23.3575ZM28.4452 2.52257C29.0887 1.7693 30.3182 2.3098 30.1982 3.2932L28.3427 18.5L40.7421 18.5C41.5957 18.5 42.0569 19.5005 41.5025 20.1495L19.8664 45.4774C19.2229 46.2307 17.9934 45.6902 18.1134 44.7068L19.9692 29.5H7.56999C6.71643 29.5 6.25523 28.4995 6.80963 27.8505L28.4452 2.52257Z" fill="currentColor"/>
28
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
29
+ <path fillRule="evenodd" clipRule="evenodd" d="M23.3576 26.4991L21.8952 38.4829L36.4033 21.4991L24.9545 21.4991L26.4167 9.51529L11.9088 26.4991H23.3576ZM28.4453 2.52166C29.0887 1.76838 30.3182 2.30889 30.1983 3.29229L28.3428 18.4991L40.7422 18.4991C41.5957 18.4991 42.0569 19.4996 41.5025 20.1486L19.8665 45.4765C19.223 46.2298 17.9935 45.6893 18.1135 44.7059L19.9692 29.4991H7.57005C6.71649 29.4991 6.2553 28.4986 6.80969 27.8496L28.4453 2.52166Z" style={{ fill: `var(--${color})` }}/>
29
30
  </svg>
30
31
  ;
31
32
  };
package/assets/book/index.tsx CHANGED
@@ -1,32 +1,33 @@
1
- import React from 'react';
1
+ import React from 'react';import { BasicColorType } from '@liner-fe/prism';
2
2
 
3
3
  interface BookProps {
4
4
  fill?: boolean;
5
5
  thick?: boolean;
6
6
  size?: number
7
+ color?: BasicColorType;
7
8
  }
8
9
 
9
- export const Book = ({ fill = false, thick = false, size = 24 }: BookProps) => {
10
+ export const Book = ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary' }: BookProps) => {
10
11
  if (fill && thick) {
11
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
12
- <path fillRule="evenodd" clipRule="evenodd" d="M25.5814 39.0531C27.4473 38.0387 29.9235 37.2286 32.7442 37.2286C35.7959 37.2286 38.4167 38.0225 40.3597 38.8818C41.9032 39.5645 44 38.4644 44 36.7767V13.5247C44 12.4072 43.531 11.3345 42.5861 10.7379C40.8175 9.62124 37.4408 7.9997 32.7442 8C28.4002 8.00027 25.5573 9.73415 23.9926 11.0988C22.416 9.73415 19.5603 8.00027 15.2273 8C10.1925 7.99968 6.67825 9.87271 5.04178 10.9789C4.34848 11.4476 4 12.2473 4 13.0842V36.7699C4 38.4588 6.1001 39.5594 7.64452 38.8759C9.5812 38.0189 12.1904 37.2286 15.2273 37.2286C18.0995 37.2286 20.5891 38.1122 22.4891 39.1143C22.4926 39.1162 22.4962 39.118 22.4998 39.1199C22.8743 39.3281 23.4487 39.6493 23.9951 39.9548C24.5188 39.6611 25.049 39.3425 25.5814 39.0531ZM7 35.8896C9.15192 35.0053 11.9669 34.2286 15.2273 34.2286C18.0296 34.2286 20.4976 34.9198 22.4998 35.7925V13.8067C21.5194 12.812 19.2032 11.0003 15.2271 11C11.2402 10.9997 8.41494 12.3833 7 13.2821V35.8896ZM25.5008 35.7554C25.4702 28.4724 25.5 21.1887 25.5 13.9057C25.5 13.8569 25.5034 13.8182 25.5075 13.7898C26.4753 12.8026 28.7627 11.0003 32.7444 11C36.7004 10.9998 39.5151 12.353 40.9527 13.2546C40.9701 13.2918 41 13.3822 41 13.5247V35.8939C38.842 35.0078 36.017 34.2286 32.7442 34.2286C29.9962 34.2286 27.5289 34.8663 25.5008 35.7554Z" fill="currentColor"/>
12
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
13
+ <path fillRule="evenodd" clipRule="evenodd" d="M25.5814 39.0531C27.4473 38.0387 29.9235 37.2286 32.7442 37.2286C35.7959 37.2286 38.4167 38.0225 40.3597 38.8818C41.9032 39.5645 44 38.4644 44 36.7767V13.5247C44 12.4072 43.531 11.3345 42.5861 10.7379C40.8175 9.62124 37.4408 7.9997 32.7442 8C28.4002 8.00027 25.5573 9.73415 23.9926 11.0988C22.416 9.73415 19.5603 8.00027 15.2273 8C10.1925 7.99968 6.67825 9.87271 5.04178 10.9789C4.34848 11.4476 4 12.2473 4 13.0842V36.7699C4 38.4588 6.1001 39.5594 7.64452 38.8759C9.5812 38.0189 12.1904 37.2286 15.2273 37.2286C18.0995 37.2286 20.5891 38.1122 22.4891 39.1143C22.4926 39.1162 22.4962 39.118 22.4998 39.1199C22.8743 39.3281 23.4487 39.6493 23.9951 39.9548C24.5188 39.6611 25.049 39.3425 25.5814 39.0531ZM7 35.8896C9.15192 35.0053 11.9669 34.2286 15.2273 34.2286C18.0296 34.2286 20.4976 34.9198 22.4998 35.7925V13.8067C21.5194 12.812 19.2032 11.0003 15.2271 11C11.2402 10.9997 8.41494 12.3833 7 13.2821V35.8896ZM25.5008 35.7554C25.4702 28.4724 25.5 21.1887 25.5 13.9057C25.5 13.8569 25.5034 13.8182 25.5075 13.7898C26.4753 12.8026 28.7627 11.0003 32.7444 11C36.7004 10.9998 39.5151 12.353 40.9527 13.2546C40.9701 13.2918 41 13.3822 41 13.5247V35.8939C38.842 35.0078 36.017 34.2286 32.7442 34.2286C29.9962 34.2286 27.5289 34.8663 25.5008 35.7554Z" style={{ fill: `var(--${color})` }}/>
13
14
  </svg>
14
15
  ;
15
16
  } else if (fill) {
16
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
17
- <path d="M4 13.066C4 12.2398 4.33953 11.449 5.01952 10.9797C6.62236 9.87361 10.0659 7.99968 15 8C18.1293 8.0002 20.6591 8.94238 22.5 9.98428V39.2278C22.3308 39.1998 22.1971 39.1587 22.1147 39.1143C20.2532 38.1122 17.8141 37.2286 15 37.2286C12.081 37.2286 9.56539 37.9891 7.67948 38.8272C6.12751 39.5168 4 38.4126 4 36.7143V13.066Z" fill="currentColor"/>
18
- <path d="M25.5 39.2504C25.6749 39.2025 25.843 39.1361 26 39.0531C27.8465 38.0765 30.2434 37.2286 33 37.2286C35.919 37.2286 38.4346 37.9891 40.3205 38.8272C41.8725 39.5168 44 38.4126 44 36.7143V13.4975C44 12.3959 43.5446 11.3365 42.6194 10.7386C40.8913 9.62196 37.5908 7.9997 33 8C29.8707 8.0002 27.3409 8.94238 25.5 9.98429V39.2504Z" fill="currentColor"/>
17
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
18
+ <path d="M4 13.066C4 12.2398 4.33953 11.449 5.01952 10.9797C6.62236 9.87361 10.0659 7.99968 15 8C18.1293 8.0002 20.6591 8.94238 22.5 9.98428V39.2278C22.3308 39.1998 22.1971 39.1587 22.1147 39.1143C20.2532 38.1122 17.8141 37.2286 15 37.2286C12.081 37.2286 9.56539 37.9891 7.67948 38.8272C6.12751 39.5168 4 38.4126 4 36.7143V13.066Z" style={{ fill: `var(--${color})` }}/>
19
+ <path d="M25.5 39.2504C25.6749 39.2025 25.843 39.1361 26 39.0531C27.8465 38.0765 30.2434 37.2286 33 37.2286C35.919 37.2286 38.4346 37.9891 40.3205 38.8272C41.8725 39.5168 44 38.4126 44 36.7143V13.4975C44 12.3959 43.5446 11.3365 42.6194 10.7386C40.8913 9.62196 37.5908 7.9997 33 8C29.8707 8.0002 27.3409 8.94238 25.5 9.98429V39.2504Z" style={{ fill: `var(--${color})` }}/>
19
20
  </svg>
20
21
  ;
21
22
  } else if (thick) {
22
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
23
- <path fillRule="evenodd" clipRule="evenodd" d="M25.9081 39.0992C25.9391 39.0844 25.9698 39.0691 26 39.0531C27.8465 38.0765 30.2434 37.2286 33 37.2286C35.919 37.2286 38.4346 37.9891 40.3205 38.8272C41.8725 39.5168 44 38.4126 44 36.7143V13.4975C44 12.3959 43.5446 11.3365 42.6194 10.7386C40.8913 9.62196 37.5908 7.9997 33 8C28.9085 8.00026 25.842 9.61078 24 10.9491C22.158 9.61078 19.0915 8.00026 15 8C10.0659 7.99968 6.62236 9.87361 5.01952 10.9797C4.33953 11.449 4 12.2398 4 13.066V36.7143C4 38.4126 6.12751 39.5168 7.67948 38.8272C9.56539 37.9891 12.081 37.2286 15 37.2286C17.8141 37.2286 20.2532 38.1122 22.1147 39.1143C22.13 39.1225 22.1471 39.1306 22.1658 39.1386C22.8631 39.5126 23.4781 39.9023 24 40.2671C24.5403 39.8894 25.1803 39.4851 25.9081 39.0992ZM8 34.4096C9.96647 33.7392 12.3367 33.2286 15 33.2286C17.6678 33.2286 20.0359 33.8388 22 34.6418V14.4503C20.6965 13.4225 18.2911 12.0002 14.9997 12C11.7633 11.9998 9.37645 13.0204 8 13.8229V34.4096ZM26 14.4506V34.6418C27.9635 33.839 30.3318 33.2286 33 33.2286C35.6633 33.2286 38.0335 33.7392 40 34.4096V13.8231C38.6206 13.0189 36.2357 11.9998 33.0003 12C29.7155 12.0002 27.3139 13.4148 26 14.4506Z" fill="currentColor"/>
23
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
24
+ <path fillRule="evenodd" clipRule="evenodd" d="M25.9081 39.0992C25.9391 39.0844 25.9698 39.0691 26 39.0531C27.8465 38.0765 30.2434 37.2286 33 37.2286C35.919 37.2286 38.4346 37.9891 40.3205 38.8272C41.8725 39.5168 44 38.4126 44 36.7143V13.4975C44 12.3959 43.5446 11.3365 42.6194 10.7386C40.8913 9.62196 37.5908 7.9997 33 8C28.9085 8.00026 25.842 9.61078 24 10.9491C22.158 9.61078 19.0915 8.00026 15 8C10.0659 7.99968 6.62236 9.87361 5.01952 10.9797C4.33953 11.449 4 12.2398 4 13.066V36.7143C4 38.4126 6.12751 39.5168 7.67948 38.8272C9.56539 37.9891 12.081 37.2286 15 37.2286C17.8141 37.2286 20.2532 38.1122 22.1147 39.1143C22.13 39.1225 22.1471 39.1306 22.1658 39.1386C22.8631 39.5126 23.4781 39.9023 24 40.2671C24.5403 39.8894 25.1803 39.4851 25.9081 39.0992ZM8 34.4096C9.96647 33.7392 12.3367 33.2286 15 33.2286C17.6678 33.2286 20.0359 33.8388 22 34.6418V14.4503C20.6965 13.4225 18.2911 12.0002 14.9997 12C11.7633 11.9998 9.37645 13.0204 8 13.8229V34.4096ZM26 14.4506V34.6418C27.9635 33.839 30.3318 33.2286 33 33.2286C35.6633 33.2286 38.0335 33.7392 40 34.4096V13.8231C38.6206 13.0189 36.2357 11.9998 33.0003 12C29.7155 12.0002 27.3139 13.4148 26 14.4506Z" style={{ fill: `var(--${color})` }}/>
24
25
  </svg>
25
26
  ;
26
27
  }
27
28
 
28
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
29
- <path fillRule="evenodd" clipRule="evenodd" d="M25.5814 39.0531C27.4473 38.0387 29.9235 37.2286 32.7442 37.2286C35.7959 37.2286 38.4167 38.0225 40.3597 38.8818C41.9032 39.5645 44 38.4644 44 36.7767V13.5247C44 12.4072 43.531 11.3345 42.5861 10.7379C40.8175 9.62124 37.4408 7.9997 32.7442 8C28.4002 8.00027 25.5573 9.73415 23.9926 11.0988C22.416 9.73415 19.5603 8.00027 15.2273 8C10.1925 7.99968 6.67825 9.87271 5.04178 10.9789C4.34848 11.4476 4 12.2473 4 13.0842V36.7699C4 38.4588 6.1001 39.5594 7.64452 38.8759C9.5812 38.0189 12.1904 37.2286 15.2273 37.2286C18.0995 37.2286 20.5891 38.1122 22.4891 39.1143C22.4926 39.1162 22.4962 39.118 22.4998 39.1199C22.8743 39.3281 23.4487 39.6493 23.9951 39.9548C24.5188 39.6611 25.049 39.3425 25.5814 39.0531ZM7 35.8896C9.15192 35.0053 11.9669 34.2286 15.2273 34.2286C18.0296 34.2286 20.4976 34.9198 22.4998 35.7925V13.8067C21.5194 12.812 19.2032 11.0003 15.2271 11C11.2402 10.9997 8.41494 12.3833 7 13.2821V35.8896ZM25.5008 35.7554C25.4702 28.4724 25.5 21.1887 25.5 13.9057C25.5 13.8569 25.5034 13.8182 25.5075 13.7898C26.4753 12.8026 28.7627 11.0003 32.7444 11C36.7004 10.9998 39.5151 12.353 40.9527 13.2546C40.9701 13.2918 41 13.3822 41 13.5247V35.8939C38.842 35.0078 36.017 34.2286 32.7442 34.2286C29.9962 34.2286 27.5289 34.8663 25.5008 35.7554Z" fill="currentColor"/>
29
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
30
+ <path fillRule="evenodd" clipRule="evenodd" d="M25.5814 39.0531C27.4473 38.0387 29.9235 37.2286 32.7442 37.2286C35.7959 37.2286 38.4167 38.0225 40.3597 38.8818C41.9032 39.5645 44 38.4644 44 36.7767V13.5247C44 12.4072 43.531 11.3345 42.5861 10.7379C40.8175 9.62124 37.4408 7.9997 32.7442 8C28.4002 8.00027 25.5573 9.73415 23.9926 11.0988C22.416 9.73415 19.5603 8.00027 15.2273 8C10.1925 7.99968 6.67825 9.87271 5.04178 10.9789C4.34848 11.4476 4 12.2473 4 13.0842V36.7699C4 38.4588 6.1001 39.5594 7.64452 38.8759C9.5812 38.0189 12.1904 37.2286 15.2273 37.2286C18.0995 37.2286 20.5891 38.1122 22.4891 39.1143C22.4926 39.1162 22.4962 39.118 22.4998 39.1199C22.8743 39.3281 23.4487 39.6493 23.9951 39.9548C24.5188 39.6611 25.049 39.3425 25.5814 39.0531ZM7 35.8896C9.15192 35.0053 11.9669 34.2286 15.2273 34.2286C18.0296 34.2286 20.4976 34.9198 22.4998 35.7925V13.8067C21.5194 12.812 19.2032 11.0003 15.2271 11C11.2402 10.9997 8.41494 12.3833 7 13.2821V35.8896ZM25.5008 35.7554C25.4702 28.4724 25.5 21.1887 25.5 13.9057C25.5 13.8569 25.5034 13.8182 25.5075 13.7898C26.4753 12.8026 28.7627 11.0003 32.7444 11C36.7004 10.9998 39.5151 12.353 40.9527 13.2546C40.9701 13.2918 41 13.3822 41 13.5247V35.8939C38.842 35.0078 36.017 34.2286 32.7442 34.2286C29.9962 34.2286 27.5289 34.8663 25.5008 35.7554Z" style={{ fill: `var(--${color})` }}/>
30
31
  </svg>
31
32
  ;
32
33
  };
package/assets/bookmark/index.tsx CHANGED
@@ -1,31 +1,32 @@
1
- import React from 'react';
1
+ import React from 'react';import { BasicColorType } from '@liner-fe/prism';
2
2
 
3
3
  interface BookmarkProps {
4
4
  fill?: boolean;
5
5
  thick?: boolean;
6
6
  size?: number
7
+ color?: BasicColorType;
7
8
  }
8
9
 
9
- export const Bookmark = ({ fill = false, thick = false, size = 24 }: BookmarkProps) => {
10
+ export const Bookmark = ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary' }: BookmarkProps) => {
10
11
  if (fill && thick) {
11
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
12
- <path fillRule="evenodd" clipRule="evenodd" d="M24 28.6309L38 39.0334V8H10V39.0334L24 28.6309ZM24 32.3684L37.8072 42.6276C39.1267 43.6081 41 42.6662 41 41.0223V7C41 5.89543 40.1046 5 39 5H9C7.89543 5 7 5.89543 7 7V41.0223C7 42.6662 8.87326 43.6081 10.1928 42.6276L24 32.3684Z" fill="currentColor"/>
12
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
13
+ <path fillRule="evenodd" clipRule="evenodd" d="M24 28.6309L38 39.0334V8H10V39.0334L24 28.6309ZM24 32.3684L37.8072 42.6276C39.1267 43.6081 41 42.6662 41 41.0223V7C41 5.89543 40.1046 5 39 5H9C7.89543 5 7 5.89543 7 7V41.0223C7 42.6662 8.87326 43.6081 10.1928 42.6276L24 32.3684Z" style={{ fill: `var(--${color})` }}/>
13
14
  </svg>
14
15
  ;
15
16
  } else if (fill) {
16
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
17
- <path d="M7 7C7 5.89543 7.89543 5 9 5H39C40.1046 5 41 5.89543 41 7V41.0223C41 42.6662 39.1267 43.6081 37.8072 42.6276L24 32.3684L10.1928 42.6276C8.87326 43.6081 7 42.6662 7 41.0223L7 7Z" fill="currentColor"/>
17
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
18
+ <path d="M7 7C7 5.89543 7.89543 5 9 5H39C40.1046 5 41 5.89543 41 7V41.0223C41 42.6662 39.1267 43.6081 37.8072 42.6276L24 32.3684L10.1928 42.6276C8.87326 43.6081 7 42.6662 7 41.0223L7 7Z" style={{ fill: `var(--${color})` }}/>
18
19
  </svg>
19
20
  ;
20
21
  } else if (thick) {
21
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
22
- <path fillRule="evenodd" clipRule="evenodd" d="M24 27.3851L37 37.0445V9H11V37.0445L24 27.3851ZM24 32.3684L37.8072 42.6276C39.1267 43.6081 41 42.6662 41 41.0223V7C41 5.89543 40.1046 5 39 5H9C7.89543 5 7 5.89543 7 7V41.0223C7 42.6662 8.87326 43.6081 10.1928 42.6276L24 32.3684Z" fill="currentColor"/>
22
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
23
+ <path fillRule="evenodd" clipRule="evenodd" d="M24 27.3851L37 37.0445V9H11V37.0445L24 27.3851ZM24 32.3684L37.8072 42.6276C39.1267 43.6081 41 42.6662 41 41.0223V7C41 5.89543 40.1046 5 39 5H9C7.89543 5 7 5.89543 7 7V41.0223C7 42.6662 8.87326 43.6081 10.1928 42.6276L24 32.3684Z" style={{ fill: `var(--${color})` }}/>
23
24
  </svg>
24
25
  ;
25
26
  }
26
27
 
27
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
28
- <path fillRule="evenodd" clipRule="evenodd" d="M24 28.6309L38 39.0334V8H10V39.0334L24 28.6309ZM24 32.3684L37.8072 42.6276C39.1267 43.6081 41 42.6662 41 41.0223V7C41 5.89543 40.1046 5 39 5H9C7.89543 5 7 5.89543 7 7V41.0223C7 42.6662 8.87326 43.6081 10.1928 42.6276L24 32.3684Z" fill="currentColor"/>
28
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
29
+ <path fillRule="evenodd" clipRule="evenodd" d="M24 28.6309L38 39.0334V8H10V39.0334L24 28.6309ZM24 32.3684L37.8072 42.6276C39.1267 43.6081 41 42.6662 41 41.0223V7C41 5.89543 40.1046 5 39 5H9C7.89543 5 7 5.89543 7 7V41.0223C7 42.6662 8.87326 43.6081 10.1928 42.6276L24 32.3684Z" style={{ fill: `var(--${color})` }}/>
29
30
  </svg>
30
31
  ;
31
32
  };
package/assets/bookmark-cancel/index.tsx CHANGED
@@ -1,39 +1,40 @@
1
- import React from 'react';
1
+ import React from 'react';import { BasicColorType } from '@liner-fe/prism';
2
2
 
3
3
  interface BookmarkCancelProps {
4
4
  fill?: boolean;
5
5
  thick?: boolean;
6
6
  size?: number
7
+ color?: BasicColorType;
7
8
  }
8
9
 
9
- export const BookmarkCancel = ({ fill = false, thick = false, size = 24 }: BookmarkCancelProps) => {
10
+ export const BookmarkCancel = ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary' }: BookmarkCancelProps) => {
10
11
  if (fill && thick) {
11
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
12
- <path d="M3.67651 6.50421L6.50494 3.67578L44.3233 41.4941L41.4949 44.3226L3.67651 6.50421Z" fill="currentColor"/>
13
- <path d="M12.0713 5L41.0001 33.9287V7C41.0001 5.89543 40.1046 5 39.0001 5H12.0713Z" fill="currentColor"/>
14
- <path d="M22.9333 30.004L7.00006 14.0708V40.3711C7.00006 42.1239 9.09444 43.0288 10.3708 41.8275L22.9333 30.004Z" fill="currentColor"/>
12
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
13
+ <path d="M3.67651 6.50421L6.50494 3.67578L44.3233 41.4941L41.4949 44.3226L3.67651 6.50421Z" style={{ fill: `var(--${color})` }}/>
14
+ <path d="M12.0713 5L41.0001 33.9287V7C41.0001 5.89543 40.1046 5 39.0001 5H12.0713Z" style={{ fill: `var(--${color})` }}/>
15
+ <path d="M22.9333 30.004L7.00006 14.0708V40.3711C7.00006 42.1239 9.09444 43.0288 10.3708 41.8275L22.9333 30.004Z" style={{ fill: `var(--${color})` }}/>
15
16
  </svg>
16
17
  ;
17
18
  } else if (fill) {
18
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
19
- <path d="M41.9395 44.0608L44.0608 41.9395L6.06077 3.93945L3.93945 6.06077L41.9395 44.0608Z" fill="currentColor"/>
20
- <path d="M39 5.00023C40.1046 5.00023 41 5.89566 41 7.00023V34.6361L11.3642 5.00023H39Z" fill="currentColor"/>
21
- <path d="M10.3707 41.8278C9.09438 43.029 7 42.1241 7 40.3714V13.364L23.2975 29.6614L10.3707 41.8278Z" fill="currentColor"/>
19
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
20
+ <path d="M41.9395 44.0608L44.0608 41.9395L6.06077 3.93945L3.93945 6.06077L41.9395 44.0608Z" style={{ fill: `var(--${color})` }}/>
21
+ <path d="M39 5.00023C40.1046 5.00023 41 5.89566 41 7.00023V34.6361L11.3642 5.00023H39Z" style={{ fill: `var(--${color})` }}/>
22
+ <path d="M10.3707 41.8278C9.09438 43.029 7 42.1241 7 40.3714V13.364L23.2975 29.6614L10.3707 41.8278Z" style={{ fill: `var(--${color})` }}/>
22
23
  </svg>
23
24
  ;
24
25
  } else if (thick) {
25
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
26
- <path d="M3.67645 6.50421L6.50488 3.67578L44.3232 41.4941L41.4948 44.3226L39.4846 42.3124C39.4845 42.3124 39.4847 42.3123 39.4846 42.3124L3.67645 6.50421Z" fill="currentColor"/>
27
- <path d="M41 7V33.9287L37 29.9287V9H16.0713L12.0713 5H39C40.1046 5 41 5.89543 41 7Z" fill="currentColor"/>
28
- <path d="M7 14.0708L11 18.0708V35.7423L20.1035 27.1743L22.9332 30.004L10.3707 41.8275C9.09438 43.0288 7 42.1239 7 40.3711V14.0708Z" fill="currentColor"/>
26
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
27
+ <path d="M3.67651 6.50421L6.50494 3.67578L44.3233 41.4941L41.4949 44.3226L39.4847 42.3124C39.4848 42.3123 39.4846 42.3124 39.4847 42.3124L3.67651 6.50421Z" style={{ fill: `var(--${color})` }}/>
28
+ <path d="M41.0001 7V33.9287L37.0001 29.9287V9H16.0713L12.0713 5H39.0001C40.1046 5 41.0001 5.89543 41.0001 7Z" style={{ fill: `var(--${color})` }}/>
29
+ <path d="M7.00006 14.0708L11.0001 18.0708V35.7423L20.1035 27.1743L22.9333 30.004L10.3708 41.8275C9.09444 43.0288 7.00006 42.1239 7.00006 40.3711V14.0708Z" style={{ fill: `var(--${color})` }}/>
29
30
  </svg>
30
31
  ;
31
32
  }
32
33
 
33
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
34
- <path d="M41.9393 44.0608L44.0606 41.9395L6.06065 3.93945L3.93933 6.06077L41.9393 44.0608Z" fill="currentColor"/>
35
- <path d="M38 8.00023V31.6362L41 34.6362V7.00023C41 5.89566 40.1046 5.00023 39 5.00023H11.364L14.364 8.00023H38Z" fill="currentColor"/>
36
- <path d="M7 40.3714V13.3641L10 16.3641V38.0569L21.1751 27.5392L23.2974 29.6615L10.3707 41.8278C9.09438 43.029 7 42.1241 7 40.3714Z" fill="currentColor"/>
34
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
35
+ <path d="M41.9395 44.0608L44.0608 41.9395L6.06077 3.93945L3.93945 6.06077L41.9395 44.0608Z" style={{ fill: `var(--${color})` }}/>
36
+ <path d="M38.0001 8.00023V31.6362L41.0001 34.6362V7.00023C41.0001 5.89566 40.1047 5.00023 39.0001 5.00023H11.3642L14.3642 8.00023H38.0001Z" style={{ fill: `var(--${color})` }}/>
37
+ <path d="M7.00012 40.3714V13.3641L10.0001 16.3641V38.0569L21.1752 27.5392L23.2975 29.6615L10.3709 41.8278C9.0945 43.029 7.00012 42.1241 7.00012 40.3714Z" style={{ fill: `var(--${color})` }}/>
37
38
  </svg>
38
39
  ;
39
40
  };
package/assets/books/index.tsx CHANGED
@@ -1,39 +1,40 @@
1
- import React from 'react';
1
+ import React from 'react';import { BasicColorType } from '@liner-fe/prism';
2
2
 
3
3
  interface BooksProps {
4
4
  fill?: boolean;
5
5
  thick?: boolean;
6
6
  size?: number
7
+ color?: BasicColorType;
7
8
  }
8
9
 
9
- export const Books = ({ fill = false, thick = false, size = 24 }: BooksProps) => {
10
+ export const Books = ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary' }: BooksProps) => {
10
11
  if (fill && thick) {
11
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
12
- <path fillRule="evenodd" clipRule="evenodd" d="M24.6061 8.10455L33.3875 5.52565C33.9192 5.36953 34.4764 5.6754 34.6301 6.20772L43.828 38.063C43.9807 38.5919 43.6772 39.1447 43.149 39.2998L34.3676 41.8787C33.836 42.0349 33.2787 41.729 33.125 41.1967L23.9271 9.34143C23.7744 8.81253 24.0779 8.25967 24.6061 8.10455Z" fill="currentColor"/>
13
- <path fillRule="evenodd" clipRule="evenodd" d="M5.42578 10.284H13.0001C13.5523 10.284 14 10.7317 14 11.284V40.9546C14 41.5069 13.5523 41.9546 13 41.9546H5.42578C4.8735 41.9546 4.42578 41.5069 4.42578 40.9546V11.284C4.42578 10.7317 4.8735 10.284 5.42578 10.284Z" fill="currentColor"/>
14
- <path fillRule="evenodd" clipRule="evenodd" d="M16.0001 18.7022H24.6265C25.1788 18.7022 25.6265 19.1499 25.6265 19.7022V40.9551C25.6265 41.5074 25.1788 41.9551 24.6265 41.9551H16.0001C15.4478 41.9551 15.0001 41.5074 15.0001 40.9551V19.7022C15.0001 19.1499 15.4478 18.7022 16.0001 18.7022ZM17.9991 23.292H22.339V26.292H17.9991V23.292ZM22.339 34.0899H17.9991V37.0899H22.339V34.0899Z" fill="currentColor"/>
12
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
13
+ <path fillRule="evenodd" clipRule="evenodd" d="M24.6061 8.10406L33.3875 5.52516C33.9192 5.36904 34.4764 5.67491 34.6301 6.20723L43.828 38.0625C43.9807 38.5914 43.6772 39.1442 43.149 39.2994L34.3676 41.8783C33.836 42.0344 33.2787 41.7285 33.125 41.1962L23.9271 9.34095C23.7744 8.81204 24.0779 8.25918 24.6061 8.10406Z" style={{ fill: `var(--${color})` }}/>
14
+ <path fillRule="evenodd" clipRule="evenodd" d="M5.42578 10.2835H13.0001C13.5523 10.2835 14 10.7312 14 11.2835V40.9541C14 41.5064 13.5523 41.9541 13 41.9541H5.42578C4.8735 41.9541 4.42578 41.5064 4.42578 40.9541V11.2835C4.42578 10.7312 4.8735 10.2835 5.42578 10.2835Z" style={{ fill: `var(--${color})` }}/>
15
+ <path fillRule="evenodd" clipRule="evenodd" d="M16.0001 18.7017H24.6265C25.1788 18.7017 25.6265 19.1494 25.6265 19.7017V40.9546C25.6265 41.5069 25.1788 41.9546 24.6265 41.9546H16.0001C15.4478 41.9546 15.0001 41.5069 15.0001 40.9546V19.7017C15.0001 19.1494 15.4478 18.7017 16.0001 18.7017ZM17.9991 23.2915H22.339V26.2915H17.9991V23.2915ZM22.339 34.0894H17.9991V37.0894H22.339V34.0894Z" style={{ fill: `var(--${color})` }}/>
15
16
  </svg>
16
17
  ;
17
18
  } else if (fill) {
18
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
19
- <path d="M33.3875 5.52565L24.6061 8.10455C24.0779 8.25967 23.7744 8.81253 23.9271 9.34143L33.125 41.1967C33.2787 41.729 33.8359 42.0349 34.3675 41.8787L43.149 39.2998C43.6772 39.1447 43.9807 38.5919 43.8279 38.063L34.63 6.20772C34.4763 5.6754 33.9191 5.36953 33.3875 5.52565Z" fill="currentColor"/>
20
- <path d="M13 10.2847H5.42569C4.8734 10.2847 4.42569 10.7324 4.42569 11.2847V40.9553C4.42569 41.5076 4.8734 41.9553 5.42569 41.9553H13C13.5522 41.9553 14 41.5076 14 40.9553V11.2847C14 10.7324 13.5522 10.2847 13 10.2847Z" fill="currentColor"/>
21
- <path fillRule="evenodd" clipRule="evenodd" d="M16 18.7022H24.6265C25.1788 18.7022 25.6265 19.1499 25.6265 19.7022V40.9551C25.6265 41.5074 25.1788 41.9551 24.6265 41.9551H16C15.4477 41.9551 15 41.5074 15 40.9551V19.7022C15 19.1499 15.4477 18.7022 16 18.7022ZM18.2256 23.5186H22.1124V26.0654H18.2256V23.5186ZM22.1124 34.3165H18.2256V36.8633H22.1124V34.3165Z" fill="currentColor"/>
19
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
20
+ <path d="M33.3876 5.52516L24.6062 8.10406C24.078 8.25918 23.7745 8.81204 23.9272 9.34095L33.1251 41.1962C33.2788 41.7285 33.836 42.0344 34.3676 41.8783L43.1491 39.2994C43.6773 39.1442 43.9807 38.5914 43.828 38.0625L34.6301 6.20723C34.4764 5.67491 33.9192 5.36904 33.3876 5.52516Z" style={{ fill: `var(--${color})` }}/>
21
+ <path d="M13.0001 10.2842H5.42578C4.8735 10.2842 4.42578 10.7319 4.42578 11.2842V40.9548C4.42578 41.5071 4.8735 41.9548 5.42578 41.9548H13C13.5523 41.9548 14 41.5071 14 40.9548V11.2842C14 10.7319 13.5523 10.2842 13.0001 10.2842Z" style={{ fill: `var(--${color})` }}/>
22
+ <path fillRule="evenodd" clipRule="evenodd" d="M16.0001 18.7017H24.6266C25.1789 18.7017 25.6266 19.1494 25.6266 19.7017V40.9546C25.6266 41.5069 25.1788 41.9546 24.6266 41.9546H16.0001C15.4478 41.9546 15.0001 41.5069 15.0001 40.9546V19.7017C15.0001 19.1494 15.4478 18.7017 16.0001 18.7017ZM18.2257 23.5181H22.1125V26.065H18.2257V23.5181ZM22.1125 34.316H18.2257V36.8628H22.1125V34.316Z" style={{ fill: `var(--${color})` }}/>
22
23
  </svg>
23
24
  ;
24
25
  } else if (thick) {
25
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
26
- <path d="M20.3906 24H17.6406V26H20.3906V24Z" fill="currentColor"/>
27
- <path d="M20.3906 34H17.6406V36H20.3906V34Z" fill="currentColor"/>
28
- <path fillRule="evenodd" clipRule="evenodd" d="M23.0523 10.4128C22.7469 9.35497 23.3538 8.24923 24.4103 7.93899L32.5655 5.54397C33.6288 5.23173 34.7432 5.84348 35.0506 6.90812L43.7371 36.9921C44.0425 38.0499 43.4355 39.1557 42.3791 39.4659L34.2238 41.861C33.1606 42.1732 32.0462 41.5614 31.7388 40.4968L26.0001 20.6218V40.0004C26.0001 41.105 25.1046 42.0004 24 42.0004L13.9998 42.0001L13.9887 42.0001H6C4.89543 42.0001 4 41.1047 4 40.0001V12C4 10.8954 4.89543 9.99998 6 9.99998H14C15.1046 9.99998 16 10.8954 16 12V17.9999L24.0001 18.0001C24.5509 18.0001 25.0497 18.2228 25.4114 18.583L23.0523 10.4128ZM35.0244 37.4569L27.4476 11.2159L31.7649 9.94802L39.3418 36.189L35.0244 37.4569ZM8 38.0001H11.9998V19.9998L12 19.9748V14H8V38.0001ZM22.0001 38.0003L16 38.0002V21.9999L22.0001 22V38.0003Z" fill="currentColor"/>
26
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
27
+ <path d="M20.3906 24.0005H17.6406V26.0005H20.3906V24.0005Z" style={{ fill: `var(--${color})` }}/>
28
+ <path d="M20.3906 34.0005H17.6406V36.0005H20.3906V34.0005Z" style={{ fill: `var(--${color})` }}/>
29
+ <path fillRule="evenodd" clipRule="evenodd" d="M23.0523 10.4133C22.7469 9.35546 23.3538 8.24972 24.4103 7.93948L32.5655 5.54446C33.6288 5.23222 34.7432 5.84397 35.0506 6.90861L43.7371 36.9926C44.0425 38.0504 43.4355 39.1562 42.3791 39.4664L34.2238 41.8614C33.1606 42.1737 32.0462 41.5619 31.7388 40.4973L26.0001 20.6223V40.0009C26.0001 41.1055 25.1046 42.0009 24 42.0009L13.9998 42.0006L13.9887 42.0006H6C4.89543 42.0006 4 41.1051 4 40.0006V12.0005C4 10.8959 4.89543 10.0005 6 10.0005H14C15.1046 10.0005 16 10.8959 16 12.0005V18.0003L24.0001 18.0006C24.5509 18.0006 25.0497 18.2233 25.4114 18.5835L23.0523 10.4133ZM35.0244 37.4574L27.4476 11.2164L31.7649 9.94851L39.3418 36.1895L35.0244 37.4574ZM8 38.0006H11.9998V20.0003L12 19.9753V14.0005H8V38.0006ZM22.0001 38.0008L16 38.0006V22.0004L22.0001 22.0005V38.0008Z" style={{ fill: `var(--${color})` }}/>
29
30
  </svg>
30
31
  ;
31
32
  }
32
33
 
33
- return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
34
- <path d="M17.4532 23.4648H21.2734V26.0117H17.4532V23.4648Z" fill="currentColor"/>
35
- <path d="M21.2734 33.7266H17.4532V36.2734H21.2734V33.7266Z" fill="currentColor"/>
36
- <path fillRule="evenodd" clipRule="evenodd" d="M24.4103 7.93899C23.3538 8.24923 22.7469 9.35497 23.0523 10.4128L25.4114 18.5832C25.0497 18.2229 24.5509 18.0002 24 18.0002H16V12C16 10.8954 15.1046 9.99998 14 9.99998H6C4.89543 9.99998 4 10.8954 4 12V40.0001C4 41.1047 4.89543 42.0001 6 42.0001H14C14.1724 42.0001 14.3398 41.9783 14.4994 41.9372C14.6594 41.9785 14.8272 42.0004 15 42.0004H24C25.1046 42.0004 26 41.105 26 40.0004V20.6217L31.7388 40.4968C32.0462 41.5614 33.1606 42.1732 34.2238 41.861L42.3791 39.4659C43.4355 39.1557 44.0425 38.0499 43.7371 36.9921L35.0506 6.90812C34.7432 5.84348 33.6288 5.23173 32.5655 5.54397L24.4103 7.93899ZM26.2107 10.5369L34.3424 38.6994L40.5787 36.868L32.447 8.70548L26.2107 10.5369ZM7 13V39.0001H13V13H7ZM16 39.0004V21.0002H23V39.0004H16Z" fill="currentColor"/>
34
+ return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
35
+ <path d="M17.4532 23.4653H21.2734V26.0122H17.4532V23.4653Z" style={{ fill: `var(--${color})` }}/>
36
+ <path d="M21.2734 33.7271H17.4532V36.2739H21.2734V33.7271Z" style={{ fill: `var(--${color})` }}/>
37
+ <path fillRule="evenodd" clipRule="evenodd" d="M24.4103 7.93948C23.3538 8.24972 22.7469 9.35546 23.0523 10.4133L25.4114 18.5836C25.0497 18.2234 24.5509 18.0007 24 18.0007H16V12.0005C16 10.8959 15.1046 10.0005 14 10.0005H6C4.89543 10.0005 4 10.8959 4 12.0005V40.0006C4 41.1051 4.89543 42.0006 6 42.0006H14C14.1724 42.0006 14.3398 41.9787 14.4994 41.9377C14.6594 41.979 14.8272 42.0009 15 42.0009H24C25.1046 42.0009 26 41.1054 26 40.0009V20.6222L31.7388 40.4973C32.0462 41.5619 33.1606 42.1737 34.2238 41.8614L42.3791 39.4664C43.4355 39.1562 44.0425 38.0504 43.7371 36.9926L35.0506 6.90861C34.7432 5.84397 33.6288 5.23222 32.5655 5.54446L24.4103 7.93948ZM26.2107 10.5374L34.3424 38.6999L40.5787 36.8685L32.447 8.70596L26.2107 10.5374ZM7 13.0005V39.0006H13V13.0005H7ZM16 39.0009V21.0007H23V39.0009H16Z" style={{ fill: `var(--${color})` }}/>
37
38
  </svg>
38
39
  ;
39
40
  };