@remember-web/primitive 0.0.0-alpha.1 → 0.0.0-alpha.10

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 (405) hide show
  1. package/dist/primitive/src/Avatars/Avatar/index.cjs +3 -3
  2. package/dist/primitive/src/Avatars/Avatar/index.cjs.map +1 -1
  3. package/dist/primitive/src/Avatars/Avatar/index.d.ts +1 -1
  4. package/dist/primitive/src/Avatars/Avatar/index.d.ts.map +1 -1
  5. package/dist/primitive/src/Avatars/Avatar/{index.js → index.mjs} +4 -4
  6. package/dist/primitive/src/Avatars/Avatar/index.mjs.map +1 -0
  7. package/dist/primitive/src/Avatars/Avatar/styles.cjs +4 -1
  8. package/dist/primitive/src/Avatars/Avatar/styles.cjs.map +1 -1
  9. package/dist/primitive/src/Avatars/Avatar/{styles.js → styles.mjs} +5 -2
  10. package/dist/primitive/src/Avatars/Avatar/styles.mjs.map +1 -0
  11. package/dist/primitive/src/Badge/{Badge.js → Badge.mjs} +3 -3
  12. package/dist/primitive/src/Badge/Badge.mjs.map +1 -0
  13. package/dist/primitive/src/Badge/style.cjs +6 -7
  14. package/dist/primitive/src/Badge/style.cjs.map +1 -1
  15. package/dist/primitive/src/Badge/style.mjs +29 -0
  16. package/dist/primitive/src/Badge/style.mjs.map +1 -0
  17. package/dist/primitive/src/Badge/{utils.js → utils.mjs} +2 -2
  18. package/dist/primitive/src/Badge/utils.mjs.map +1 -0
  19. package/dist/primitive/src/Buttons/Button/Button.stories.d.ts +1 -1
  20. package/dist/primitive/src/Buttons/Button/{const.js → const.mjs} +1 -1
  21. package/dist/primitive/src/Buttons/Button/const.mjs.map +1 -0
  22. package/dist/primitive/src/Buttons/Button/{index.js → index.mjs} +8 -8
  23. package/dist/primitive/src/Buttons/Button/index.mjs.map +1 -0
  24. package/dist/primitive/src/Buttons/Button/styles.cjs +7 -7
  25. package/dist/primitive/src/Buttons/Button/styles.cjs.map +1 -1
  26. package/dist/primitive/src/Buttons/Button/styles.mjs +26 -0
  27. package/dist/primitive/src/Buttons/Button/styles.mjs.map +1 -0
  28. package/dist/primitive/src/Common/Divider/index.cjs +4 -4
  29. package/dist/primitive/src/Common/Divider/index.cjs.map +1 -1
  30. package/dist/primitive/src/Common/Divider/{index.js → index.mjs} +5 -4
  31. package/dist/primitive/src/Common/Divider/index.mjs.map +1 -0
  32. package/dist/primitive/src/Common/Flex/index.cjs +5 -5
  33. package/dist/primitive/src/Common/Flex/index.cjs.map +1 -1
  34. package/dist/primitive/src/Common/Flex/{index.js → index.mjs} +6 -5
  35. package/dist/primitive/src/Common/Flex/index.mjs.map +1 -0
  36. package/dist/primitive/src/Common/Grid/index.cjs +4 -4
  37. package/dist/primitive/src/Common/Grid/index.cjs.map +1 -1
  38. package/dist/primitive/src/Common/Grid/{index.js → index.mjs} +5 -4
  39. package/dist/primitive/src/Common/Grid/index.mjs.map +1 -0
  40. package/dist/primitive/src/Common/Spinner/{index.js → index.mjs} +2 -2
  41. package/dist/primitive/src/Common/Spinner/index.mjs.map +1 -0
  42. package/dist/primitive/src/Common/Spinner/styles.cjs +6 -6
  43. package/dist/primitive/src/Common/Spinner/styles.cjs.map +1 -1
  44. package/dist/primitive/src/Common/Spinner/styles.mjs +15 -0
  45. package/dist/primitive/src/Common/Spinner/styles.mjs.map +1 -0
  46. package/dist/primitive/src/Common/Typography/{index.js → index.mjs} +2 -2
  47. package/dist/primitive/src/Common/Typography/index.mjs.map +1 -0
  48. package/dist/primitive/src/Common/Typography/styles.cjs +4 -4
  49. package/dist/primitive/src/Common/Typography/styles.cjs.map +1 -1
  50. package/dist/primitive/src/Common/Typography/{styles.js → styles.mjs} +5 -4
  51. package/dist/primitive/src/Common/Typography/styles.mjs.map +1 -0
  52. package/dist/primitive/src/Control/BaseToggle/ToggleIcon/{index.js → index.mjs} +1 -1
  53. package/dist/primitive/src/Control/BaseToggle/ToggleIcon/index.mjs.map +1 -0
  54. package/dist/primitive/src/Control/BaseToggle/{index.js → index.mjs} +8 -8
  55. package/dist/primitive/src/Control/BaseToggle/index.mjs.map +1 -0
  56. package/dist/primitive/src/Control/BaseToggle/styles.cjs +8 -5
  57. package/dist/primitive/src/Control/BaseToggle/styles.cjs.map +1 -1
  58. package/dist/primitive/src/Control/BaseToggle/styles.mjs +18 -0
  59. package/dist/primitive/src/Control/BaseToggle/styles.mjs.map +1 -0
  60. package/dist/primitive/src/Control/{Checkbox.js → Checkbox.mjs} +2 -2
  61. package/dist/primitive/src/Control/Checkbox.mjs.map +1 -0
  62. package/dist/primitive/src/Control/{Radio.js → Radio.mjs} +2 -2
  63. package/dist/primitive/src/Control/Radio.mjs.map +1 -0
  64. package/dist/primitive/src/Control/Switch/{index.js → index.mjs} +2 -2
  65. package/dist/primitive/src/Control/Switch/index.mjs.map +1 -0
  66. package/dist/primitive/src/Control/Switch/styles.cjs +14 -8
  67. package/dist/primitive/src/Control/Switch/styles.cjs.map +1 -1
  68. package/dist/primitive/src/Control/Switch/styles.mjs +26 -0
  69. package/dist/primitive/src/Control/Switch/styles.mjs.map +1 -0
  70. package/dist/primitive/src/Control/Toggle.cjs +4 -4
  71. package/dist/primitive/src/Control/Toggle.cjs.map +1 -1
  72. package/dist/primitive/src/Control/{Toggle.js → Toggle.mjs} +6 -5
  73. package/dist/primitive/src/Control/Toggle.mjs.map +1 -0
  74. package/dist/primitive/src/Floating/DropdownMenu/{DropdownMenuSection.js → DropdownMenuSection.mjs} +2 -2
  75. package/dist/primitive/src/Floating/DropdownMenu/DropdownMenuSection.mjs.map +1 -0
  76. package/dist/primitive/src/Floating/DropdownMenu/{index.js → index.mjs} +4 -4
  77. package/dist/primitive/src/Floating/DropdownMenu/index.mjs.map +1 -0
  78. package/dist/primitive/src/Floating/DropdownMenu/styles.cjs +19 -10
  79. package/dist/primitive/src/Floating/DropdownMenu/styles.cjs.map +1 -1
  80. package/dist/primitive/src/Floating/DropdownMenu/{styles.js → styles.mjs} +21 -11
  81. package/dist/primitive/src/Floating/DropdownMenu/styles.mjs.map +1 -0
  82. package/dist/primitive/src/Floating/Popover/{index.js → index.mjs} +2 -2
  83. package/dist/primitive/src/Floating/Popover/index.mjs.map +1 -0
  84. package/dist/primitive/src/Floating/Popover/styles.cjs +6 -6
  85. package/dist/primitive/src/Floating/Popover/styles.cjs.map +1 -1
  86. package/dist/primitive/src/Floating/Popover/styles.mjs +19 -0
  87. package/dist/primitive/src/Floating/Popover/styles.mjs.map +1 -0
  88. package/dist/primitive/src/Floating/Tooltip/{index.js → index.mjs} +4 -4
  89. package/dist/primitive/src/Floating/Tooltip/index.mjs.map +1 -0
  90. package/dist/primitive/src/Floating/Tooltip/styles.cjs +14 -8
  91. package/dist/primitive/src/Floating/Tooltip/styles.cjs.map +1 -1
  92. package/dist/primitive/src/Floating/Tooltip/styles.mjs +39 -0
  93. package/dist/primitive/src/Floating/Tooltip/styles.mjs.map +1 -0
  94. package/dist/primitive/src/Floating/Tooltip/{types.js → types.mjs} +1 -1
  95. package/dist/primitive/src/Floating/Tooltip/types.mjs.map +1 -0
  96. package/dist/primitive/src/Inputs/Select/DesignedSelect/{const.js → const.mjs} +1 -1
  97. package/dist/primitive/src/Inputs/Select/DesignedSelect/const.mjs.map +1 -0
  98. package/dist/primitive/src/Inputs/Select/DesignedSelect/{index.js → index.mjs} +7 -7
  99. package/dist/primitive/src/Inputs/Select/DesignedSelect/index.mjs.map +1 -0
  100. package/dist/primitive/src/Inputs/Select/DesignedSelect/styles.cjs +24 -15
  101. package/dist/primitive/src/Inputs/Select/DesignedSelect/styles.cjs.map +1 -1
  102. package/dist/primitive/src/Inputs/Select/DesignedSelect/styles.mjs +49 -0
  103. package/dist/primitive/src/Inputs/Select/DesignedSelect/styles.mjs.map +1 -0
  104. package/dist/primitive/src/Inputs/Select/NativeSelect/Option/{index.js → index.mjs} +1 -1
  105. package/dist/primitive/src/Inputs/Select/NativeSelect/Option/index.mjs.map +1 -0
  106. package/dist/primitive/src/Inputs/Select/NativeSelect/{index.js → index.mjs} +3 -3
  107. package/dist/primitive/src/Inputs/Select/NativeSelect/index.mjs.map +1 -0
  108. package/dist/primitive/src/Inputs/Select/NativeSelect/styles.cjs +9 -6
  109. package/dist/primitive/src/Inputs/Select/NativeSelect/styles.cjs.map +1 -1
  110. package/dist/primitive/src/Inputs/Select/NativeSelect/styles.mjs +27 -0
  111. package/dist/primitive/src/Inputs/Select/NativeSelect/styles.mjs.map +1 -0
  112. package/dist/primitive/src/Inputs/Select/Option/{index.js → index.mjs} +1 -1
  113. package/dist/primitive/src/Inputs/Select/Option/index.mjs.map +1 -0
  114. package/dist/primitive/src/Inputs/Select/{index.js → index.mjs} +6 -6
  115. package/dist/primitive/src/Inputs/Select/index.mjs.map +1 -0
  116. package/dist/primitive/src/Inputs/Select/styles.cjs +8 -5
  117. package/dist/primitive/src/Inputs/Select/styles.cjs.map +1 -1
  118. package/dist/primitive/src/Inputs/Select/styles.mjs +24 -0
  119. package/dist/primitive/src/Inputs/Select/styles.mjs.map +1 -0
  120. package/dist/primitive/src/Inputs/Select/{utils.js → utils.mjs} +1 -1
  121. package/dist/primitive/src/Inputs/Select/utils.mjs.map +1 -0
  122. package/dist/primitive/src/Inputs/TextInput/TextInput.stories.d.ts +1 -1
  123. package/dist/primitive/src/Inputs/TextInput/{index.js → index.mjs} +2 -2
  124. package/dist/primitive/src/Inputs/TextInput/index.mjs.map +1 -0
  125. package/dist/primitive/src/Inputs/TextInput/styles.cjs +34 -13
  126. package/dist/primitive/src/Inputs/TextInput/styles.cjs.map +1 -1
  127. package/dist/primitive/src/Inputs/TextInput/styles.mjs +50 -0
  128. package/dist/primitive/src/Inputs/TextInput/styles.mjs.map +1 -0
  129. package/dist/primitive/src/Logos/EnvLabel/{index.js → index.mjs} +1 -1
  130. package/dist/primitive/src/Logos/EnvLabel/index.mjs.map +1 -0
  131. package/dist/primitive/src/Logos/RememberLogo/{index.js → index.mjs} +2 -2
  132. package/dist/primitive/src/Logos/RememberLogo/index.mjs.map +1 -0
  133. package/dist/primitive/src/Logos/RememberMobileLogo/{index.js → index.mjs} +1 -1
  134. package/dist/primitive/src/Logos/RememberMobileLogo/index.mjs.map +1 -0
  135. package/dist/primitive/src/Logos/RememberServiceLogo/{index.js → index.mjs} +8 -8
  136. package/dist/primitive/src/Logos/RememberServiceLogo/index.mjs.map +1 -0
  137. package/dist/primitive/src/Logos/RememberServiceLogo/style.cjs +4 -4
  138. package/dist/primitive/src/Logos/RememberServiceLogo/style.cjs.map +1 -1
  139. package/dist/primitive/src/Logos/RememberServiceLogo/style.mjs +10 -0
  140. package/dist/primitive/src/Logos/RememberServiceLogo/style.mjs.map +1 -0
  141. package/dist/primitive/src/Logos/RememberSquareLogo/{index.js → index.mjs} +1 -1
  142. package/dist/primitive/src/Logos/RememberSquareLogo/index.mjs.map +1 -0
  143. package/dist/primitive/src/Modals/Dialog/{index.js → index.mjs} +3 -3
  144. package/dist/primitive/src/Modals/Dialog/index.mjs.map +1 -0
  145. package/dist/primitive/src/Modals/Dialog/styles.cjs +26 -11
  146. package/dist/primitive/src/Modals/Dialog/styles.cjs.map +1 -1
  147. package/dist/primitive/src/Modals/Dialog/styles.mjs +34 -0
  148. package/dist/primitive/src/Modals/Dialog/styles.mjs.map +1 -0
  149. package/dist/primitive/src/Paginations/CompactPagination/{index.js → index.mjs} +4 -4
  150. package/dist/primitive/src/Paginations/CompactPagination/index.mjs.map +1 -0
  151. package/dist/primitive/src/Paginations/Pagination/{index.js → index.mjs} +4 -4
  152. package/dist/primitive/src/Paginations/Pagination/index.mjs.map +1 -0
  153. package/dist/primitive/src/Paginations/styles.cjs +37 -13
  154. package/dist/primitive/src/Paginations/styles.cjs.map +1 -1
  155. package/dist/primitive/src/Paginations/styles.mjs +48 -0
  156. package/dist/primitive/src/Paginations/styles.mjs.map +1 -0
  157. package/dist/primitive/src/Paginations/{usePagination.js → usePagination.mjs} +1 -1
  158. package/dist/primitive/src/Paginations/usePagination.mjs.map +1 -0
  159. package/dist/primitive/src/hooks/{useMouseEventAway.js → useMouseEventAway.mjs} +1 -1
  160. package/dist/primitive/src/hooks/useMouseEventAway.mjs.map +1 -0
  161. package/dist/primitive/src/index.cjs +0 -18
  162. package/dist/primitive/src/index.cjs.map +1 -1
  163. package/dist/primitive/src/index.d.ts +0 -1
  164. package/dist/primitive/src/index.d.ts.map +1 -1
  165. package/dist/primitive/src/index.mjs +26 -0
  166. package/dist/primitive/src/index.mjs.map +1 -0
  167. package/dist/shared/utils/{common.js → common.mjs} +1 -1
  168. package/dist/shared/utils/common.mjs.map +1 -0
  169. package/dist/shared/utils/{style.js → style.mjs} +1 -1
  170. package/dist/shared/utils/style.mjs.map +1 -0
  171. package/package.json +8 -7
  172. package/src/Avatars/Avatar/index.tsx +2 -2
  173. package/src/index.ts +0 -1
  174. package/dist/primitive/src/Avatars/Avatar/index.js.map +0 -1
  175. package/dist/primitive/src/Avatars/Avatar/styles.js.map +0 -1
  176. package/dist/primitive/src/Badge/Badge.js.map +0 -1
  177. package/dist/primitive/src/Badge/style.js +0 -29
  178. package/dist/primitive/src/Badge/style.js.map +0 -1
  179. package/dist/primitive/src/Badge/utils.js.map +0 -1
  180. package/dist/primitive/src/Buttons/Button/const.js.map +0 -1
  181. package/dist/primitive/src/Buttons/Button/index.js.map +0 -1
  182. package/dist/primitive/src/Buttons/Button/styles.js +0 -25
  183. package/dist/primitive/src/Buttons/Button/styles.js.map +0 -1
  184. package/dist/primitive/src/Common/Divider/index.js.map +0 -1
  185. package/dist/primitive/src/Common/Flex/index.js.map +0 -1
  186. package/dist/primitive/src/Common/Grid/index.js.map +0 -1
  187. package/dist/primitive/src/Common/Spinner/index.js.map +0 -1
  188. package/dist/primitive/src/Common/Spinner/styles.js +0 -14
  189. package/dist/primitive/src/Common/Spinner/styles.js.map +0 -1
  190. package/dist/primitive/src/Common/Typography/index.js.map +0 -1
  191. package/dist/primitive/src/Common/Typography/styles.js.map +0 -1
  192. package/dist/primitive/src/Control/BaseToggle/ToggleIcon/index.js.map +0 -1
  193. package/dist/primitive/src/Control/BaseToggle/index.js.map +0 -1
  194. package/dist/primitive/src/Control/BaseToggle/styles.js +0 -14
  195. package/dist/primitive/src/Control/BaseToggle/styles.js.map +0 -1
  196. package/dist/primitive/src/Control/Checkbox.js.map +0 -1
  197. package/dist/primitive/src/Control/Radio.js.map +0 -1
  198. package/dist/primitive/src/Control/Switch/index.js.map +0 -1
  199. package/dist/primitive/src/Control/Switch/styles.js +0 -19
  200. package/dist/primitive/src/Control/Switch/styles.js.map +0 -1
  201. package/dist/primitive/src/Control/Toggle.js.map +0 -1
  202. package/dist/primitive/src/Floating/DropdownMenu/DropdownMenuSection.js.map +0 -1
  203. package/dist/primitive/src/Floating/DropdownMenu/index.js.map +0 -1
  204. package/dist/primitive/src/Floating/DropdownMenu/styles.js.map +0 -1
  205. package/dist/primitive/src/Floating/Popover/index.js.map +0 -1
  206. package/dist/primitive/src/Floating/Popover/styles.js +0 -18
  207. package/dist/primitive/src/Floating/Popover/styles.js.map +0 -1
  208. package/dist/primitive/src/Floating/Tooltip/index.js.map +0 -1
  209. package/dist/primitive/src/Floating/Tooltip/styles.js +0 -32
  210. package/dist/primitive/src/Floating/Tooltip/styles.js.map +0 -1
  211. package/dist/primitive/src/Floating/Tooltip/types.js.map +0 -1
  212. package/dist/primitive/src/Gnb/GnbComplete.stories.d.ts +0 -47
  213. package/dist/primitive/src/Gnb/GnbComplete.stories.d.ts.map +0 -1
  214. package/dist/primitive/src/Gnb/const.cjs +0 -23
  215. package/dist/primitive/src/Gnb/const.cjs.map +0 -1
  216. package/dist/primitive/src/Gnb/const.d.ts +0 -13
  217. package/dist/primitive/src/Gnb/const.d.ts.map +0 -1
  218. package/dist/primitive/src/Gnb/const.js +0 -21
  219. package/dist/primitive/src/Gnb/const.js.map +0 -1
  220. package/dist/primitive/src/Gnb/css.cjs +0 -24
  221. package/dist/primitive/src/Gnb/css.cjs.map +0 -1
  222. package/dist/primitive/src/Gnb/css.d.ts +0 -7
  223. package/dist/primitive/src/Gnb/css.d.ts.map +0 -1
  224. package/dist/primitive/src/Gnb/css.js +0 -14
  225. package/dist/primitive/src/Gnb/css.js.map +0 -1
  226. package/dist/primitive/src/Gnb/index.cjs +0 -63
  227. package/dist/primitive/src/Gnb/index.cjs.map +0 -1
  228. package/dist/primitive/src/Gnb/index.d.ts +0 -24
  229. package/dist/primitive/src/Gnb/index.d.ts.map +0 -1
  230. package/dist/primitive/src/Gnb/index.js +0 -47
  231. package/dist/primitive/src/Gnb/index.js.map +0 -1
  232. package/dist/primitive/src/Gnb/parts/GnbDropdownLinkItem/index.cjs +0 -41
  233. package/dist/primitive/src/Gnb/parts/GnbDropdownLinkItem/index.cjs.map +0 -1
  234. package/dist/primitive/src/Gnb/parts/GnbDropdownLinkItem/index.d.ts +0 -8
  235. package/dist/primitive/src/Gnb/parts/GnbDropdownLinkItem/index.d.ts.map +0 -1
  236. package/dist/primitive/src/Gnb/parts/GnbDropdownLinkItem/index.js +0 -31
  237. package/dist/primitive/src/Gnb/parts/GnbDropdownLinkItem/index.js.map +0 -1
  238. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/GnbHamburger.stories.d.ts +0 -12
  239. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/GnbHamburger.stories.d.ts.map +0 -1
  240. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/index.cjs +0 -48
  241. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/index.cjs.map +0 -1
  242. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/index.d.ts +0 -34
  243. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/index.d.ts.map +0 -1
  244. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/index.js +0 -41
  245. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/index.js.map +0 -1
  246. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/parts/GnbHamburgerAccordion.cjs +0 -30
  247. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/parts/GnbHamburgerAccordion.cjs.map +0 -1
  248. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/parts/GnbHamburgerAccordion.d.ts +0 -7
  249. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/parts/GnbHamburgerAccordion.d.ts.map +0 -1
  250. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/parts/GnbHamburgerAccordion.js +0 -23
  251. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/parts/GnbHamburgerAccordion.js.map +0 -1
  252. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/style.cjs +0 -27
  253. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/style.cjs.map +0 -1
  254. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/style.d.ts +0 -18
  255. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/style.d.ts.map +0 -1
  256. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/style.js +0 -17
  257. package/dist/primitive/src/Gnb/parts/GnbHamburgerMenu/style.js.map +0 -1
  258. package/dist/primitive/src/Gnb/parts/GnbHoverSubNavi/GnbHoverSubNavi.stories.d.ts +0 -12
  259. package/dist/primitive/src/Gnb/parts/GnbHoverSubNavi/GnbHoverSubNavi.stories.d.ts.map +0 -1
  260. package/dist/primitive/src/Gnb/parts/GnbHoverSubNavi/index.cjs +0 -44
  261. package/dist/primitive/src/Gnb/parts/GnbHoverSubNavi/index.cjs.map +0 -1
  262. package/dist/primitive/src/Gnb/parts/GnbHoverSubNavi/index.d.ts +0 -23
  263. package/dist/primitive/src/Gnb/parts/GnbHoverSubNavi/index.d.ts.map +0 -1
  264. package/dist/primitive/src/Gnb/parts/GnbHoverSubNavi/index.js +0 -37
  265. package/dist/primitive/src/Gnb/parts/GnbHoverSubNavi/index.js.map +0 -1
  266. package/dist/primitive/src/Gnb/parts/GnbHoverSubNavi/style.cjs +0 -28
  267. package/dist/primitive/src/Gnb/parts/GnbHoverSubNavi/style.cjs.map +0 -1
  268. package/dist/primitive/src/Gnb/parts/GnbHoverSubNavi/style.d.ts +0 -9
  269. package/dist/primitive/src/Gnb/parts/GnbHoverSubNavi/style.d.ts.map +0 -1
  270. package/dist/primitive/src/Gnb/parts/GnbHoverSubNavi/style.js +0 -19
  271. package/dist/primitive/src/Gnb/parts/GnbHoverSubNavi/style.js.map +0 -1
  272. package/dist/primitive/src/Gnb/parts/GnbNotification/GnbNotification.stories.d.ts +0 -14
  273. package/dist/primitive/src/Gnb/parts/GnbNotification/GnbNotification.stories.d.ts.map +0 -1
  274. package/dist/primitive/src/Gnb/parts/GnbNotification/index.cjs +0 -57
  275. package/dist/primitive/src/Gnb/parts/GnbNotification/index.cjs.map +0 -1
  276. package/dist/primitive/src/Gnb/parts/GnbNotification/index.d.ts +0 -26
  277. package/dist/primitive/src/Gnb/parts/GnbNotification/index.d.ts.map +0 -1
  278. package/dist/primitive/src/Gnb/parts/GnbNotification/index.js +0 -50
  279. package/dist/primitive/src/Gnb/parts/GnbNotification/index.js.map +0 -1
  280. package/dist/primitive/src/Gnb/parts/GnbNotification/parts/NotificationItem.cjs +0 -51
  281. package/dist/primitive/src/Gnb/parts/GnbNotification/parts/NotificationItem.cjs.map +0 -1
  282. package/dist/primitive/src/Gnb/parts/GnbNotification/parts/NotificationItem.d.ts +0 -14
  283. package/dist/primitive/src/Gnb/parts/GnbNotification/parts/NotificationItem.d.ts.map +0 -1
  284. package/dist/primitive/src/Gnb/parts/GnbNotification/parts/NotificationItem.js +0 -44
  285. package/dist/primitive/src/Gnb/parts/GnbNotification/parts/NotificationItem.js.map +0 -1
  286. package/dist/primitive/src/Gnb/parts/GnbNotification/style.cjs +0 -49
  287. package/dist/primitive/src/Gnb/parts/GnbNotification/style.cjs.map +0 -1
  288. package/dist/primitive/src/Gnb/parts/GnbNotification/style.d.ts +0 -20
  289. package/dist/primitive/src/Gnb/parts/GnbNotification/style.d.ts.map +0 -1
  290. package/dist/primitive/src/Gnb/parts/GnbNotification/style.js +0 -32
  291. package/dist/primitive/src/Gnb/parts/GnbNotification/style.js.map +0 -1
  292. package/dist/primitive/src/Gnb/parts/GnbProfile/GnbProfile.stories.d.ts +0 -31
  293. package/dist/primitive/src/Gnb/parts/GnbProfile/GnbProfile.stories.d.ts.map +0 -1
  294. package/dist/primitive/src/Gnb/parts/GnbProfile/index.cjs +0 -64
  295. package/dist/primitive/src/Gnb/parts/GnbProfile/index.cjs.map +0 -1
  296. package/dist/primitive/src/Gnb/parts/GnbProfile/index.d.ts +0 -25
  297. package/dist/primitive/src/Gnb/parts/GnbProfile/index.d.ts.map +0 -1
  298. package/dist/primitive/src/Gnb/parts/GnbProfile/index.js +0 -55
  299. package/dist/primitive/src/Gnb/parts/GnbProfile/index.js.map +0 -1
  300. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/BusinessUserShortInfo.cjs +0 -33
  301. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/BusinessUserShortInfo.cjs.map +0 -1
  302. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/BusinessUserShortInfo.d.ts +0 -4
  303. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/BusinessUserShortInfo.d.ts.map +0 -1
  304. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/BusinessUserShortInfo.js +0 -27
  305. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/BusinessUserShortInfo.js.map +0 -1
  306. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/MyInfo.cjs +0 -31
  307. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/MyInfo.cjs.map +0 -1
  308. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/MyInfo.d.ts +0 -10
  309. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/MyInfo.d.ts.map +0 -1
  310. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/MyInfo.js +0 -25
  311. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/MyInfo.js.map +0 -1
  312. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/MyPasses.cjs +0 -33
  313. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/MyPasses.cjs.map +0 -1
  314. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/MyPasses.d.ts +0 -8
  315. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/MyPasses.d.ts.map +0 -1
  316. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/MyPasses.js +0 -27
  317. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/MyPasses.js.map +0 -1
  318. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/MyPassesDetail.cjs +0 -32
  319. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/MyPassesDetail.cjs.map +0 -1
  320. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/MyPassesDetail.d.ts +0 -9
  321. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/MyPassesDetail.d.ts.map +0 -1
  322. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/MyPassesDetail.js +0 -25
  323. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/MyPassesDetail.js.map +0 -1
  324. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/UserShortInfo.cjs +0 -52
  325. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/UserShortInfo.cjs.map +0 -1
  326. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/UserShortInfo.d.ts +0 -7
  327. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/UserShortInfo.d.ts.map +0 -1
  328. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/UserShortInfo.js +0 -50
  329. package/dist/primitive/src/Gnb/parts/GnbProfile/parts/UserShortInfo.js.map +0 -1
  330. package/dist/primitive/src/Gnb/parts/GnbProfile/style.cjs +0 -43
  331. package/dist/primitive/src/Gnb/parts/GnbProfile/style.cjs.map +0 -1
  332. package/dist/primitive/src/Gnb/parts/GnbProfile/style.d.ts +0 -17
  333. package/dist/primitive/src/Gnb/parts/GnbProfile/style.d.ts.map +0 -1
  334. package/dist/primitive/src/Gnb/parts/GnbProfile/style.js +0 -26
  335. package/dist/primitive/src/Gnb/parts/GnbProfile/style.js.map +0 -1
  336. package/dist/primitive/src/Gnb/parts/GnbProfile/types.d.ts +0 -11
  337. package/dist/primitive/src/Gnb/parts/GnbProfile/types.d.ts.map +0 -1
  338. package/dist/primitive/src/Gnb/style.cjs +0 -44
  339. package/dist/primitive/src/Gnb/style.cjs.map +0 -1
  340. package/dist/primitive/src/Gnb/style.d.ts +0 -15
  341. package/dist/primitive/src/Gnb/style.d.ts.map +0 -1
  342. package/dist/primitive/src/Gnb/style.js +0 -26
  343. package/dist/primitive/src/Gnb/style.js.map +0 -1
  344. package/dist/primitive/src/Inputs/Select/DesignedSelect/const.js.map +0 -1
  345. package/dist/primitive/src/Inputs/Select/DesignedSelect/index.js.map +0 -1
  346. package/dist/primitive/src/Inputs/Select/DesignedSelect/styles.js +0 -39
  347. package/dist/primitive/src/Inputs/Select/DesignedSelect/styles.js.map +0 -1
  348. package/dist/primitive/src/Inputs/Select/NativeSelect/Option/index.js.map +0 -1
  349. package/dist/primitive/src/Inputs/Select/NativeSelect/index.js.map +0 -1
  350. package/dist/primitive/src/Inputs/Select/NativeSelect/styles.js +0 -23
  351. package/dist/primitive/src/Inputs/Select/NativeSelect/styles.js.map +0 -1
  352. package/dist/primitive/src/Inputs/Select/Option/index.js.map +0 -1
  353. package/dist/primitive/src/Inputs/Select/index.js.map +0 -1
  354. package/dist/primitive/src/Inputs/Select/styles.js +0 -20
  355. package/dist/primitive/src/Inputs/Select/styles.js.map +0 -1
  356. package/dist/primitive/src/Inputs/Select/utils.js.map +0 -1
  357. package/dist/primitive/src/Inputs/TextInput/index.js.map +0 -1
  358. package/dist/primitive/src/Inputs/TextInput/styles.js +0 -28
  359. package/dist/primitive/src/Inputs/TextInput/styles.js.map +0 -1
  360. package/dist/primitive/src/Logos/EnvLabel/index.js.map +0 -1
  361. package/dist/primitive/src/Logos/RememberLogo/index.js.map +0 -1
  362. package/dist/primitive/src/Logos/RememberMobileLogo/index.js.map +0 -1
  363. package/dist/primitive/src/Logos/RememberServiceLogo/index.js.map +0 -1
  364. package/dist/primitive/src/Logos/RememberServiceLogo/style.js +0 -9
  365. package/dist/primitive/src/Logos/RememberServiceLogo/style.js.map +0 -1
  366. package/dist/primitive/src/Logos/RememberSquareLogo/index.js.map +0 -1
  367. package/dist/primitive/src/Modals/Dialog/index.js.map +0 -1
  368. package/dist/primitive/src/Modals/Dialog/styles.js +0 -18
  369. package/dist/primitive/src/Modals/Dialog/styles.js.map +0 -1
  370. package/dist/primitive/src/Paginations/CompactPagination/index.js.map +0 -1
  371. package/dist/primitive/src/Paginations/Pagination/index.js.map +0 -1
  372. package/dist/primitive/src/Paginations/styles.js +0 -23
  373. package/dist/primitive/src/Paginations/styles.js.map +0 -1
  374. package/dist/primitive/src/Paginations/usePagination.js.map +0 -1
  375. package/dist/primitive/src/hooks/useMouseEventAway.js.map +0 -1
  376. package/dist/primitive/src/index.js +0 -33
  377. package/dist/primitive/src/index.js.map +0 -1
  378. package/dist/shared/utils/common.js.map +0 -1
  379. package/dist/shared/utils/style.js.map +0 -1
  380. package/src/Gnb/GnbComplete.stories.tsx +0 -758
  381. package/src/Gnb/const.ts +0 -22
  382. package/src/Gnb/css.tsx +0 -94
  383. package/src/Gnb/index.tsx +0 -70
  384. package/src/Gnb/parts/GnbDropdownLinkItem/index.tsx +0 -37
  385. package/src/Gnb/parts/GnbHamburgerMenu/GnbHamburger.stories.tsx +0 -90
  386. package/src/Gnb/parts/GnbHamburgerMenu/index.tsx +0 -48
  387. package/src/Gnb/parts/GnbHamburgerMenu/parts/GnbHamburgerAccordion.tsx +0 -20
  388. package/src/Gnb/parts/GnbHamburgerMenu/style.tsx +0 -99
  389. package/src/Gnb/parts/GnbHoverSubNavi/GnbHoverSubNavi.stories.tsx +0 -47
  390. package/src/Gnb/parts/GnbHoverSubNavi/index.tsx +0 -45
  391. package/src/Gnb/parts/GnbHoverSubNavi/style.tsx +0 -42
  392. package/src/Gnb/parts/GnbNotification/GnbNotification.stories.tsx +0 -234
  393. package/src/Gnb/parts/GnbNotification/index.tsx +0 -60
  394. package/src/Gnb/parts/GnbNotification/parts/NotificationItem.tsx +0 -63
  395. package/src/Gnb/parts/GnbNotification/style.tsx +0 -149
  396. package/src/Gnb/parts/GnbProfile/GnbProfile.stories.tsx +0 -156
  397. package/src/Gnb/parts/GnbProfile/index.tsx +0 -65
  398. package/src/Gnb/parts/GnbProfile/parts/BusinessUserShortInfo.tsx +0 -20
  399. package/src/Gnb/parts/GnbProfile/parts/MyInfo.tsx +0 -25
  400. package/src/Gnb/parts/GnbProfile/parts/MyPasses.tsx +0 -25
  401. package/src/Gnb/parts/GnbProfile/parts/MyPassesDetail.tsx +0 -26
  402. package/src/Gnb/parts/GnbProfile/parts/UserShortInfo.tsx +0 -45
  403. package/src/Gnb/parts/GnbProfile/style.ts +0 -117
  404. package/src/Gnb/parts/GnbProfile/types.ts +0 -12
  405. package/src/Gnb/style.tsx +0 -316
@@ -1,43 +0,0 @@
1
- 'use strict';
2
-
3
- var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
4
- var styled = require('styled-components');
5
- var css = require('../../css.cjs');
6
- var styles = require('../../../Common/Typography/styles.cjs');
7
- var mixin = require('@remember-web/mixin');
8
- var styles$1 = require('../../../Avatars/Avatar/styles.cjs');
9
- var icon = require('@remember-web/icon');
10
- var index = require('../../../Floating/DropdownMenu/index.cjs');
11
- require('../../../Floating/Tooltip/index.cjs');
12
- require('../../../Floating/Popover/index.cjs');
13
-
14
- function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
15
-
16
- var _taggedTemplateLiteral__default = /*#__PURE__*/_interopDefault(_taggedTemplateLiteral);
17
- var styled__default = /*#__PURE__*/_interopDefault(styled);
18
-
19
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
20
- var StyledGnpProfileIconArrow2DownS = styled__default.default(icon.IconArrow2DownS)(_templateObject || (_templateObject = _taggedTemplateLiteral__default.default(["\n transition: transform 0.2s ease-out;\n will-change: transform;\n"])));
21
- var StyledGnbProfileButton = styled__default.default.button(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral__default.default(["\n ", ";\n\n grid-auto-flow: column;\n grid-auto-columns: 1fr min-content;\n gap: 4px;\n min-height: 24px;\n height: 100%;\n\n ", " {\n width: 100%;\n overflow: hidden;\n ", ";\n }\n\n // radix\uC5D0\uC11C \uBD80\uC5EC\uB428\n &[data-state='open'] ", " {\n transform: rotateZ(-180deg);\n }\n"])), css.defaultGridButtonCss, styles.StyledTypography, mixin.textEllipsis, StyledGnpProfileIconArrow2DownS);
22
- var StyledGnbProfileContent = styled__default.default(index.Content)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral__default.default(["\n ", ";\n min-width: 225px;\n"])), css.fullPopoverContentCss);
23
- var StyledGnbMyTitle = styled__default.default.b(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral__default.default(["\n display: block;\n max-width: 140px;\n ", ";\n ", ";\n font-weight: 600;\n"])), mixin.textEllipsis, mixin.getTypographyStyles('Title1'));
24
- var StyledGnbProfileCompany = styled__default.default.span(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral__default.default(["\n ", ";\n ", ";\n color: ", ";\n max-width: 140px;\n"])), mixin.getTypographyStyles('Body1'), mixin.textEllipsis, mixin.contents100);
25
- var StyledGnbMyAnchor = styled__default.default.a(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral__default.default(["\n display: flex;\n align-items: center;\n font-weight: 500;\n color: ", ";\n text-decoration: underline;\n text-underline-offset: 2px;\n ", ";\n"])), mixin.contents200, mixin.getTypographyStyles('Body1'));
26
- var StyledGnbMyInfo = styled__default.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral__default.default(["\n display: grid;\n grid-template-areas:\n 'avatar name'\n 'avatar go-profile';\n grid-template-columns: max-content 1fr;\n column-gap: 8px;\n place-items: center start;\n box-sizing: border-box;\n padding: 10px 12px;\n\n ", " {\n grid-area: avatar;\n }\n\n ", " {\n grid-area: name;\n }\n\n ", " {\n text-decoration: none;\n grid-area: go-profile;\n }\n"])), styles$1.StyledAvatar, StyledGnbMyTitle, StyledGnbMyAnchor);
27
- var StyledGnbMyPasses = styled__default.default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral__default.default(["\n padding: 4px 12px 12px;\n"])));
28
- var StyledGnbMyPassesContentWrapper = styled__default.default.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral__default.default(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n box-sizing: border-box;\n padding: 8px;\n"])));
29
- var StyledGnbMyPassesInfoWrapper = styled__default.default(StyledGnbMyPassesContentWrapper)(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral__default.default(["\n background-color: ", ";\n border-radius: 4px;\n"])), mixin.bg200);
30
- var StyledGnbMyPassesStatus = styled__default.default.span(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral__default.default(["\n ", ";\n font-weight: 500;\n color: ", ";\n"])), mixin.getTypographyStyles('Subtitle2'), mixin.roleGreen);
31
-
32
- exports.StyledGnbMyAnchor = StyledGnbMyAnchor;
33
- exports.StyledGnbMyInfo = StyledGnbMyInfo;
34
- exports.StyledGnbMyPasses = StyledGnbMyPasses;
35
- exports.StyledGnbMyPassesContentWrapper = StyledGnbMyPassesContentWrapper;
36
- exports.StyledGnbMyPassesInfoWrapper = StyledGnbMyPassesInfoWrapper;
37
- exports.StyledGnbMyPassesStatus = StyledGnbMyPassesStatus;
38
- exports.StyledGnbMyTitle = StyledGnbMyTitle;
39
- exports.StyledGnbProfileButton = StyledGnbProfileButton;
40
- exports.StyledGnbProfileCompany = StyledGnbProfileCompany;
41
- exports.StyledGnbProfileContent = StyledGnbProfileContent;
42
- exports.StyledGnpProfileIconArrow2DownS = StyledGnpProfileIconArrow2DownS;
43
- //# sourceMappingURL=style.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"style.cjs","sources":["../../../../../../src/Gnb/parts/GnbProfile/style.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport { defaultGridButtonCss, fullPopoverContentCss } from '@/Gnb/css';\nimport { StyledTypography } from '@/Common/Typography/styles';\nimport {\n bg200,\n contents100,\n contents200,\n getTypographyStyles,\n roleGreen,\n textEllipsis,\n} from '@remember-web/mixin';\nimport { StyledAvatar } from '@/Avatars/Avatar/styles';\nimport { IconArrow2DownS } from '@remember-web/icon';\nimport { DropdownMenu } from '@';\n\nexport const StyledGnpProfileIconArrow2DownS = styled(IconArrow2DownS)`\n transition: transform 0.2s ease-out;\n will-change: transform;\n`;\nexport const StyledGnbProfileButton = styled.button`\n ${defaultGridButtonCss};\n\n grid-auto-flow: column;\n grid-auto-columns: 1fr min-content;\n gap: 4px;\n min-height: 24px;\n height: 100%;\n\n ${StyledTypography} {\n width: 100%;\n overflow: hidden;\n ${textEllipsis};\n }\n\n // radix에서 부여됨\n &[data-state='open'] ${StyledGnpProfileIconArrow2DownS} {\n transform: rotateZ(-180deg);\n }\n`;\n\nexport const StyledGnbProfileContent = styled(DropdownMenu.Content)`\n ${fullPopoverContentCss};\n min-width: 225px;\n`;\n\nexport const StyledGnbMyTitle = styled.b`\n display: block;\n max-width: 140px;\n ${textEllipsis};\n ${getTypographyStyles('Title1')};\n font-weight: 600;\n`;\n\nexport const StyledGnbProfileCompany = styled.span`\n ${getTypographyStyles('Body1')};\n ${textEllipsis};\n color: ${contents100};\n max-width: 140px;\n`;\nexport const StyledGnbMyAnchor = styled.a`\n display: flex;\n align-items: center;\n font-weight: 500;\n color: ${contents200};\n text-decoration: underline;\n text-underline-offset: 2px;\n ${getTypographyStyles('Body1')};\n`;\nexport const StyledGnbMyInfo = styled.div`\n display: grid;\n grid-template-areas:\n 'avatar name'\n 'avatar go-profile';\n grid-template-columns: max-content 1fr;\n column-gap: 8px;\n place-items: center start;\n box-sizing: border-box;\n padding: 10px 12px;\n\n ${StyledAvatar} {\n grid-area: avatar;\n }\n\n ${StyledGnbMyTitle} {\n grid-area: name;\n }\n\n ${StyledGnbMyAnchor} {\n text-decoration: none;\n grid-area: go-profile;\n }\n`;\n\nexport const StyledGnbMyPasses = styled.div`\n padding: 4px 12px 12px;\n`;\n\nexport const StyledGnbMyPassesContentWrapper = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n box-sizing: border-box;\n padding: 8px;\n`;\nexport const StyledGnbMyPassesInfoWrapper = styled(\n StyledGnbMyPassesContentWrapper\n)`\n background-color: ${bg200};\n border-radius: 4px;\n`;\n\nexport const StyledGnbMyPassesStatus = styled.span`\n ${getTypographyStyles('Subtitle2')};\n font-weight: 500;\n color: ${roleGreen};\n`;\n"],"names":["StyledGnpProfileIconArrow2DownS","styled","IconArrow2DownS","_templateObject","_taggedTemplateLiteral","StyledGnbProfileButton","button","_templateObject2","defaultGridButtonCss","StyledTypography","textEllipsis","StyledGnbProfileContent","DropdownMenu","Content","_templateObject3","fullPopoverContentCss","StyledGnbMyTitle","b","_templateObject4","getTypographyStyles","StyledGnbProfileCompany","span","_templateObject5","contents100","StyledGnbMyAnchor","a","_templateObject6","contents200","StyledGnbMyInfo","div","_templateObject7","StyledAvatar","StyledGnbMyPasses","_templateObject8","StyledGnbMyPassesContentWrapper","_templateObject9","StyledGnbMyPassesInfoWrapper","_templateObject10","bg200","StyledGnbMyPassesStatus","_templateObject11","roleGreen"],"mappings":";;;;;;;;;;;;;;;;;;;AAgBaA,IAAAA,+BAA+B,GAAGC,uBAAM,CAACC,oBAAe,CAAC,CAAAC,eAAA,KAAAA,eAAA,GAAAC,uCAAA,CAGrE,CAAA,uEAAA,CAAA,CAAA,CAAA,EAAA;AACM,IAAMC,sBAAsB,GAAGJ,uBAAM,CAACK,MAAM,CAAAC,gBAAA,KAAAA,gBAAA,GAAAH,uCAAA,CAAA,CAAA,MAAA,EAAA,gIAAA,EAAA,mDAAA,EAAA,8EAAA,EAAA,6CAAA,CAAA,CAAA,CAAA,EAC/CI,wBAAoB,EAQpBC,uBAAgB,EAGdC,kBAAY,EAIOV,+BAA+B,EAGvD;IAEYW,uBAAuB,GAAGV,uBAAM,CAACW,KAAY,CAACC,OAAO,CAAC,CAAAC,gBAAA,KAAAA,gBAAA,GAAAV,uCAAA,CAAA,CAAA,MAAA,EAAA,0BAAA,CAAA,CAAA,CAAA,EAC/DW,yBAAqB,EAExB;IAEYC,gBAAgB,GAAGf,uBAAM,CAACgB,CAAC,CAAAC,gBAAA,KAAAA,gBAAA,GAAAd,uCAAA,0FAGpCM,kBAAY,EACZS,yBAAmB,CAAC,QAAQ,CAAC,EAEhC;AAEM,IAAMC,uBAAuB,GAAGnB,uBAAM,CAACoB,IAAI,CAAAC,gBAAA,KAAAA,gBAAA,GAAAlB,uCAAA,CAAA,CAAA,MAAA,EAAA,OAAA,EAAA,cAAA,EAAA,0BAAA,CAAA,CAAA,CAAA,EAC9Ce,yBAAmB,CAAC,OAAO,CAAC,EAC5BT,kBAAY,EACLa,iBAAW,EAErB;IACYC,iBAAiB,GAAGvB,uBAAM,CAACwB,CAAC,CAAAC,gBAAA,KAAAA,gBAAA,GAAAtB,uCAAA,iKAI9BuB,iBAAW,EAGlBR,yBAAmB,CAAC,OAAO,CAAC,EAC/B;IACYS,eAAe,GAAG3B,uBAAM,CAAC4B,GAAG,CAAAC,gBAAA,KAAAA,gBAAA,GAAA1B,uCAAA,CAWrC2B,CAAAA,8OAAAA,EAAAA,uCAAAA,EAAAA,qCAAAA,EAAAA,mEAAAA,CAAAA,CAAAA,CAAAA,EAAAA,qBAAY,EAIZf,gBAAgB,EAIhBQ,iBAAiB,EAIpB;AAEYQ,IAAAA,iBAAiB,GAAG/B,uBAAM,CAAC4B,GAAG,CAAAI,gBAAA,KAAAA,gBAAA,GAAA7B,uCAAA,CAE1C,CAAA,+BAAA,CAAA,CAAA,CAAA,EAAA;AAEY8B,IAAAA,+BAA+B,GAAGjC,uBAAM,CAAC4B,GAAG,CAAAM,gBAAA,KAAAA,gBAAA,GAAA/B,uCAAA,CAMxD,CAAA,6HAAA,CAAA,CAAA,CAAA,EAAA;AACYgC,IAAAA,4BAA4B,GAAGnC,uBAAM,CAChDiC,+BACF,CAAC,CAAAG,iBAAA,KAAAA,iBAAA,GAAAjC,uCAAA,CAAA,CAAA,wBAAA,EAAA,4BAAA,CAAA,CAAA,CAAA,EACqBkC,WAAK,EAE1B;IAEYC,uBAAuB,GAAGtC,uBAAM,CAACoB,IAAI,CAAAmB,iBAAA,KAAAA,iBAAA,GAAApC,uCAAA,yDAC9Ce,yBAAmB,CAAC,WAAW,CAAC,EAEzBsB,eAAS;;;;;;;;;;;;;;"}
@@ -1,17 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const StyledGnpProfileIconArrow2DownS: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & {
3
- ref?: ((instance: SVGSVGElement | null) => void) | import("react").RefObject<SVGSVGElement> | null | undefined;
4
- }, never>> & Omit<import("react").FC<import("react").SVGProps<SVGSVGElement>>, keyof import("react").Component<any, {}, any>>;
5
- export declare const StyledGnbProfileButton: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>>;
6
- export declare const StyledGnbProfileContent: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("@/Floating/DropdownMenu").DropdownContentProps, never>> & Omit<({ isInsideCloseable, ...props }: import("@/Floating/DropdownMenu").DropdownContentProps) => import("react/jsx-runtime").JSX.Element, keyof import("react").Component<any, {}, any>>;
7
- export declare const StyledGnbMyTitle: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, never>>;
8
- export declare const StyledGnbProfileCompany: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>;
9
- export declare const StyledGnbMyAnchor: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, never>>;
10
- export declare const StyledGnbMyInfo: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
11
- export declare const StyledGnbMyPasses: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
12
- export declare const StyledGnbMyPassesContentWrapper: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
13
- export declare const StyledGnbMyPassesInfoWrapper: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<Omit<import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>, "ref"> & {
14
- ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
15
- }, never>> & Omit<import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>, keyof import("react").Component<any, {}, any>>;
16
- export declare const StyledGnbMyPassesStatus: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>;
17
- //# sourceMappingURL=style.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"style.d.ts","sourceRoot":"","sources":["../../../../../../src/Gnb/parts/GnbProfile/style.ts"],"names":[],"mappings":";AAgBA,eAAO,MAAM,+BAA+B;;6HAG3C,CAAC;AACF,eAAO,MAAM,sBAAsB,4NAmBlC,CAAC;AAEF,eAAO,MAAM,uBAAuB,iWAGnC,CAAC;AAEF,eAAO,MAAM,gBAAgB,0MAM5B,CAAC;AAEF,eAAO,MAAM,uBAAuB,kNAKnC,CAAC;AACF,eAAO,MAAM,iBAAiB,4NAQ7B,CAAC;AACF,eAAO,MAAM,eAAe,gNAuB3B,CAAC;AAEF,eAAO,MAAM,iBAAiB,gNAE7B,CAAC;AAEF,eAAO,MAAM,+BAA+B,gNAM3C,CAAC;AACF,eAAO,MAAM,4BAA4B;;gRAKxC,CAAC;AAEF,eAAO,MAAM,uBAAuB,kNAInC,CAAC"}
@@ -1,26 +0,0 @@
1
- import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
2
- import styled from 'styled-components';
3
- import { defaultGridButtonCss, fullPopoverContentCss } from '../../css.js';
4
- import { StyledTypography } from '../../../Common/Typography/styles.js';
5
- import { textEllipsis, getTypographyStyles, contents100, contents200, bg200, roleGreen } from '@remember-web/mixin';
6
- import { StyledAvatar } from '../../../Avatars/Avatar/styles.js';
7
- import { IconArrow2DownS } from '@remember-web/icon';
8
- import DropdownMenu from '../../../Floating/DropdownMenu/index.js';
9
- import '../../../Floating/Tooltip/index.js';
10
- import '../../../Floating/Popover/index.js';
11
-
12
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
13
- var StyledGnpProfileIconArrow2DownS = styled(IconArrow2DownS)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n transition: transform 0.2s ease-out;\n will-change: transform;\n"])));
14
- var StyledGnbProfileButton = styled.button(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n ", ";\n\n grid-auto-flow: column;\n grid-auto-columns: 1fr min-content;\n gap: 4px;\n min-height: 24px;\n height: 100%;\n\n ", " {\n width: 100%;\n overflow: hidden;\n ", ";\n }\n\n // radix\uC5D0\uC11C \uBD80\uC5EC\uB428\n &[data-state='open'] ", " {\n transform: rotateZ(-180deg);\n }\n"])), defaultGridButtonCss, StyledTypography, textEllipsis, StyledGnpProfileIconArrow2DownS);
15
- var StyledGnbProfileContent = styled(DropdownMenu.Content)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n ", ";\n min-width: 225px;\n"])), fullPopoverContentCss);
16
- var StyledGnbMyTitle = styled.b(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n display: block;\n max-width: 140px;\n ", ";\n ", ";\n font-weight: 600;\n"])), textEllipsis, getTypographyStyles('Title1'));
17
- var StyledGnbProfileCompany = styled.span(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n ", ";\n ", ";\n color: ", ";\n max-width: 140px;\n"])), getTypographyStyles('Body1'), textEllipsis, contents100);
18
- var StyledGnbMyAnchor = styled.a(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n font-weight: 500;\n color: ", ";\n text-decoration: underline;\n text-underline-offset: 2px;\n ", ";\n"])), contents200, getTypographyStyles('Body1'));
19
- var StyledGnbMyInfo = styled.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n display: grid;\n grid-template-areas:\n 'avatar name'\n 'avatar go-profile';\n grid-template-columns: max-content 1fr;\n column-gap: 8px;\n place-items: center start;\n box-sizing: border-box;\n padding: 10px 12px;\n\n ", " {\n grid-area: avatar;\n }\n\n ", " {\n grid-area: name;\n }\n\n ", " {\n text-decoration: none;\n grid-area: go-profile;\n }\n"])), StyledAvatar, StyledGnbMyTitle, StyledGnbMyAnchor);
20
- var StyledGnbMyPasses = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n padding: 4px 12px 12px;\n"])));
21
- var StyledGnbMyPassesContentWrapper = styled.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n box-sizing: border-box;\n padding: 8px;\n"])));
22
- var StyledGnbMyPassesInfoWrapper = styled(StyledGnbMyPassesContentWrapper)(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n background-color: ", ";\n border-radius: 4px;\n"])), bg200);
23
- var StyledGnbMyPassesStatus = styled.span(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n ", ";\n font-weight: 500;\n color: ", ";\n"])), getTypographyStyles('Subtitle2'), roleGreen);
24
-
25
- export { StyledGnbMyAnchor, StyledGnbMyInfo, StyledGnbMyPasses, StyledGnbMyPassesContentWrapper, StyledGnbMyPassesInfoWrapper, StyledGnbMyPassesStatus, StyledGnbMyTitle, StyledGnbProfileButton, StyledGnbProfileCompany, StyledGnbProfileContent, StyledGnpProfileIconArrow2DownS };
26
- //# sourceMappingURL=style.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"style.js","sources":["../../../../../../src/Gnb/parts/GnbProfile/style.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport { defaultGridButtonCss, fullPopoverContentCss } from '@/Gnb/css';\nimport { StyledTypography } from '@/Common/Typography/styles';\nimport {\n bg200,\n contents100,\n contents200,\n getTypographyStyles,\n roleGreen,\n textEllipsis,\n} from '@remember-web/mixin';\nimport { StyledAvatar } from '@/Avatars/Avatar/styles';\nimport { IconArrow2DownS } from '@remember-web/icon';\nimport { DropdownMenu } from '@';\n\nexport const StyledGnpProfileIconArrow2DownS = styled(IconArrow2DownS)`\n transition: transform 0.2s ease-out;\n will-change: transform;\n`;\nexport const StyledGnbProfileButton = styled.button`\n ${defaultGridButtonCss};\n\n grid-auto-flow: column;\n grid-auto-columns: 1fr min-content;\n gap: 4px;\n min-height: 24px;\n height: 100%;\n\n ${StyledTypography} {\n width: 100%;\n overflow: hidden;\n ${textEllipsis};\n }\n\n // radix에서 부여됨\n &[data-state='open'] ${StyledGnpProfileIconArrow2DownS} {\n transform: rotateZ(-180deg);\n }\n`;\n\nexport const StyledGnbProfileContent = styled(DropdownMenu.Content)`\n ${fullPopoverContentCss};\n min-width: 225px;\n`;\n\nexport const StyledGnbMyTitle = styled.b`\n display: block;\n max-width: 140px;\n ${textEllipsis};\n ${getTypographyStyles('Title1')};\n font-weight: 600;\n`;\n\nexport const StyledGnbProfileCompany = styled.span`\n ${getTypographyStyles('Body1')};\n ${textEllipsis};\n color: ${contents100};\n max-width: 140px;\n`;\nexport const StyledGnbMyAnchor = styled.a`\n display: flex;\n align-items: center;\n font-weight: 500;\n color: ${contents200};\n text-decoration: underline;\n text-underline-offset: 2px;\n ${getTypographyStyles('Body1')};\n`;\nexport const StyledGnbMyInfo = styled.div`\n display: grid;\n grid-template-areas:\n 'avatar name'\n 'avatar go-profile';\n grid-template-columns: max-content 1fr;\n column-gap: 8px;\n place-items: center start;\n box-sizing: border-box;\n padding: 10px 12px;\n\n ${StyledAvatar} {\n grid-area: avatar;\n }\n\n ${StyledGnbMyTitle} {\n grid-area: name;\n }\n\n ${StyledGnbMyAnchor} {\n text-decoration: none;\n grid-area: go-profile;\n }\n`;\n\nexport const StyledGnbMyPasses = styled.div`\n padding: 4px 12px 12px;\n`;\n\nexport const StyledGnbMyPassesContentWrapper = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n box-sizing: border-box;\n padding: 8px;\n`;\nexport const StyledGnbMyPassesInfoWrapper = styled(\n StyledGnbMyPassesContentWrapper\n)`\n background-color: ${bg200};\n border-radius: 4px;\n`;\n\nexport const StyledGnbMyPassesStatus = styled.span`\n ${getTypographyStyles('Subtitle2')};\n font-weight: 500;\n color: ${roleGreen};\n`;\n"],"names":["StyledGnpProfileIconArrow2DownS","styled","IconArrow2DownS","_templateObject","_taggedTemplateLiteral","StyledGnbProfileButton","button","_templateObject2","defaultGridButtonCss","StyledTypography","textEllipsis","StyledGnbProfileContent","DropdownMenu","Content","_templateObject3","fullPopoverContentCss","StyledGnbMyTitle","b","_templateObject4","getTypographyStyles","StyledGnbProfileCompany","span","_templateObject5","contents100","StyledGnbMyAnchor","a","_templateObject6","contents200","StyledGnbMyInfo","div","_templateObject7","StyledAvatar","StyledGnbMyPasses","_templateObject8","StyledGnbMyPassesContentWrapper","_templateObject9","StyledGnbMyPassesInfoWrapper","_templateObject10","bg200","StyledGnbMyPassesStatus","_templateObject11","roleGreen"],"mappings":";;;;;;;;;;;;AAgBaA,IAAAA,+BAA+B,GAAGC,MAAM,CAACC,eAAe,CAAC,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,CAGrE,CAAA,uEAAA,CAAA,CAAA,CAAA,EAAA;AACM,IAAMC,sBAAsB,GAAGJ,MAAM,CAACK,MAAM,CAAAC,gBAAA,KAAAA,gBAAA,GAAAH,sBAAA,CAAA,CAAA,MAAA,EAAA,gIAAA,EAAA,mDAAA,EAAA,8EAAA,EAAA,6CAAA,CAAA,CAAA,CAAA,EAC/CI,oBAAoB,EAQpBC,gBAAgB,EAGdC,YAAY,EAIOV,+BAA+B,EAGvD;IAEYW,uBAAuB,GAAGV,MAAM,CAACW,YAAY,CAACC,OAAO,CAAC,CAAAC,gBAAA,KAAAA,gBAAA,GAAAV,sBAAA,CAAA,CAAA,MAAA,EAAA,0BAAA,CAAA,CAAA,CAAA,EAC/DW,qBAAqB,EAExB;IAEYC,gBAAgB,GAAGf,MAAM,CAACgB,CAAC,CAAAC,gBAAA,KAAAA,gBAAA,GAAAd,sBAAA,0FAGpCM,YAAY,EACZS,mBAAmB,CAAC,QAAQ,CAAC,EAEhC;AAEM,IAAMC,uBAAuB,GAAGnB,MAAM,CAACoB,IAAI,CAAAC,gBAAA,KAAAA,gBAAA,GAAAlB,sBAAA,CAAA,CAAA,MAAA,EAAA,OAAA,EAAA,cAAA,EAAA,0BAAA,CAAA,CAAA,CAAA,EAC9Ce,mBAAmB,CAAC,OAAO,CAAC,EAC5BT,YAAY,EACLa,WAAW,EAErB;IACYC,iBAAiB,GAAGvB,MAAM,CAACwB,CAAC,CAAAC,gBAAA,KAAAA,gBAAA,GAAAtB,sBAAA,iKAI9BuB,WAAW,EAGlBR,mBAAmB,CAAC,OAAO,CAAC,EAC/B;IACYS,eAAe,GAAG3B,MAAM,CAAC4B,GAAG,CAAAC,gBAAA,KAAAA,gBAAA,GAAA1B,sBAAA,CAWrC2B,CAAAA,8OAAAA,EAAAA,uCAAAA,EAAAA,qCAAAA,EAAAA,mEAAAA,CAAAA,CAAAA,CAAAA,EAAAA,YAAY,EAIZf,gBAAgB,EAIhBQ,iBAAiB,EAIpB;AAEYQ,IAAAA,iBAAiB,GAAG/B,MAAM,CAAC4B,GAAG,CAAAI,gBAAA,KAAAA,gBAAA,GAAA7B,sBAAA,CAE1C,CAAA,+BAAA,CAAA,CAAA,CAAA,EAAA;AAEY8B,IAAAA,+BAA+B,GAAGjC,MAAM,CAAC4B,GAAG,CAAAM,gBAAA,KAAAA,gBAAA,GAAA/B,sBAAA,CAMxD,CAAA,6HAAA,CAAA,CAAA,CAAA,EAAA;AACYgC,IAAAA,4BAA4B,GAAGnC,MAAM,CAChDiC,+BACF,CAAC,CAAAG,iBAAA,KAAAA,iBAAA,GAAAjC,sBAAA,CAAA,CAAA,wBAAA,EAAA,4BAAA,CAAA,CAAA,CAAA,EACqBkC,KAAK,EAE1B;IAEYC,uBAAuB,GAAGtC,MAAM,CAACoB,IAAI,CAAAmB,iBAAA,KAAAA,iBAAA,GAAApC,sBAAA,yDAC9Ce,mBAAmB,CAAC,WAAW,CAAC,EAEzBsB,SAAS;;;;"}
@@ -1,11 +0,0 @@
1
- export interface ProfileInfo {
2
- name: string;
3
- avatarImageUrl?: string;
4
- }
5
- export type EmptyProfileInfo = {
6
- email?: string;
7
- };
8
- export interface BusinessProfile extends ProfileInfo {
9
- companyName: string;
10
- }
11
- //# sourceMappingURL=types.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../src/Gnb/parts/GnbProfile/types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,WAAW,eAAgB,SAAQ,WAAW;IAClD,WAAW,EAAE,MAAM,CAAC;CACrB"}
@@ -1,44 +0,0 @@
1
- 'use strict';
2
-
3
- var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
4
- var styled = require('styled-components');
5
- var _const = require('./const.cjs');
6
- var mixin = require('@remember-web/mixin');
7
- var style$2 = require('./parts/GnbHamburgerMenu/style.cjs');
8
- var styles = require('../Common/Typography/styles.cjs');
9
- var style$1 = require('./parts/GnbNotification/style.cjs');
10
- var style = require('./parts/GnbProfile/style.cjs');
11
- var css = require('./css.cjs');
12
- var styles$1 = require('../Floating/DropdownMenu/styles.cjs');
13
- var index = require('./parts/GnbDropdownLinkItem/index.cjs');
14
-
15
- function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
16
-
17
- var _taggedTemplateLiteral__default = /*#__PURE__*/_interopDefault(_taggedTemplateLiteral);
18
- var styled__default = /*#__PURE__*/_interopDefault(styled);
19
-
20
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
21
- var StyledGnbContent = styled__default.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral__default.default(["\n position: relative;\n\n display: grid;\n grid-auto-flow: column;\n justify-content: space-between;\n align-items: center;\n height: 100%;\n max-width: ", ";\n\n margin: 0 auto;\n padding: 0;\n gap: 8px;\n\n ", "\n"])), _const.GNB_VARS.MAX_CONTENT_WIDTH, mixin.mobileOnly(styled.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral__default.default(["\n padding: 0 12px;\n "])))));
22
- var StyledGnbAccountActionContainer = styled__default.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral__default.default(["\n display: flex;\n align-items: center;\n gap: 12px;\n\n white-space: nowrap;\n"])));
23
- var GnbNaviLink = styled__default.default.a(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral__default.default(["\n ", ";\n position: relative;\n display: flex;\n align-items: center;\n height: 100%;\n padding: 4px 8px 0;\n\n color: ", ";\n\n &[data-state='open'] {\n color: ", ";\n }\n &[data-active='true']::after {\n content: '';\n position: absolute;\n display: block;\n bottom: -1px;\n left: 0;\n right: 0;\n height: 2px;\n\n background-color: ", ";\n }\n"])), css.naviLinkCss, mixin.contents000, mixin.contents150, mixin.secondary100);
24
- var StyledGnbLoginButton = styled__default.default.button(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral__default.default(["\n ", ";\n ", "\n font-weight: 500;\n\n height: 32px;\n"])), css.defaultGridButtonCss, mixin.getTypographyStyles('Body2'));
25
- var StyledGnbContentLeft = styled__default.default.nav(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral__default.default(["\n display: flex;\n align-items: center;\n height: 100%;\n min-width: max-content;\n gap: clamp(8px, 3vw, 40px);\n"])));
26
- var StyledGnbContentRight = styled__default.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral__default.default(["\n display: grid;\n box-sizing: border-box;\n grid-auto-flow: column;\n grid-auto-columns: min(100px, 1fr) auto;\n height: 100%;\n max-width: 340px;\n padding-left: 4px;\n gap: 12px;\n"])));
27
- var StyledDefaultIconButton = styled__default.default.button(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral__default.default(["\n ", ";\n\n min-width: 24px;\n min-height: 24px;\n"])), css.defaultGridButtonCss);
28
-
29
- // 예외적 디자인 요구사항 - GNB 우선적으로 font-weight 500 전체 적용
30
- var StyledGnbRoot = styled__default.default.header(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral__default.default(["\n position: sticky;\n top: 0;\n left: 0;\n box-sizing: border-box;\n align-items: center;\n min-height: ", ";\n height: ", ";\n z-index: ", ";\n font-weight: 500;\n background: ", ";\n\n font-size: 16px;\n\n & + .gnb-spacer {\n display: none;\n min-height: ", ";\n height: ", ";\n box-sizing: border-box;\n }\n\n ", " {\n font-weight: 500;\n }\n\n ", ", ", ", ", " {\n font-weight: 500;\n }\n\n // \uB370\uC2A4\uD06C\uD1B1 \uC0AC\uC774\uC988\uC5D0\uC11C \uD574\uB2F9 \uC5D8\uB9AC\uBA3C\uD2B8\uC758 > pseudo element\uB97C \uC228\uAE40\n ", ", ", " {\n ::after {\n display: none;\n }\n }\n\n ", ";\n\n ", " {\n svg {\n display: none;\n }\n }\n\n ", " {\n max-width: 375px;\n }\n\n // \uBAA8\uBC14\uC77C \uBC18\uC751\uD615 \uC2A4\uD0C0\uC77C\n ", ";\n"])), _const.GNB_VARS.HEIGHT, _const.GNB_VARS.HEIGHT, _const.GNB_VARS.Z_INDEX, mixin.contents999, _const.GNB_VARS.HEIGHT, _const.GNB_VARS.HEIGHT, styles.StyledTypography, style.StyledGnbMyAnchor, index.StyledGnbDropdownLinkItem, styles$1.StyledDropdownMenuSectionTitle, style.StyledGnbMyAnchor, index.StyledGnbDropdownLinkItem, css.dataResponsiveCss, index.StyledGnbDropdownLinkItem, style$1.StyledNotificationContent, mixin.mobileOnly(styled.css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral__default.default(["\n ", " {\n max-width: 100vw;\n }\n &[data-popover-opened='true'] + .gnb-spacer {\n display: block;\n }\n /** \uC804\uCCB4 popover, dropdown **/\n // \uC804\uCCB4 \uCC44\uC6B0\uB294 \uC2A4\uD0C0\uC77C\uB85C \uBCC0\uACBD - wrapper\n &[data-popover-opened='true'] {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n }\n [data-radix-popper-content-wrapper] {\n transform: unset !important;\n inset: 0;\n top: 60px !important;\n }\n\n // \uC804\uCCB4 \uCC44\uC6B0\uB294 \uC2A4\uD0C0\uC77C\uB85C \uBCC0\uACBD - \uB0B4\uBD80 \uCEE8\uD150\uCE20\n [data-mobile-fullover='true'] {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n overflow: hidden scroll;\n\n border-radius: 0;\n box-shadow: none;\n overscroll-behavior-x: contain;\n -webkit-overflow-scrolling: touch;\n }\n\n ", " {\n padding-top: 12px;\n }\n\n ", " {\n gap: 20px;\n }\n\n // \uC139\uC158 \uB0B4 \uD328\uB529 \uC81C\uAC70\n ", " > * {\n padding: 0;\n }\n\n // \uBAA8\uBC14\uC77C\uC5D0\uC11C\uB294 > \uC5D0 \uD574\uB2F9\uD558\uB294 pseudo element\uB97C \uBCF4\uC5EC\uC90C\n ", ", ", " {\n ::after {\n display: inline-block;\n }\n }\n\n // \uBAA8\uBC14\uC77C\uC5D0\uC11C\uB294 Dropdown Section\uC758 border-bottom\uC744 \uC81C\uAC70, \uD328\uB529 \uC870\uC815\n ", " {\n border-bottom: none;\n padding: 0 20px;\n\n ", " {\n padding: 0;\n }\n }\n\n // popover\uAC00 open\uB418\uC5B4 \uC788\uC9C0 \uC54A\uB294 \uACBD\uC6B0 Close \uBC84\uD2BC \uC228\uAE40\n &:not([data-popover-opened='true']) {\n [data-mobile-popover-close-button='true'] {\n display: none;\n }\n }\n\n // \uBAA8\uBC14\uC77C\uC5D0\uC11C \uC804\uCCB4 popover open\uB418\uC5B4 \uC788\uB294 \uACBD\uC6B0\n &[data-popover-opened='true'] {\n ", " {\n grid-auto-columns: auto;\n }\n [data-is-mobile-popover-hidden='true'] {\n display: none;\n }\n [data-mobile-popover-close-button='true'] {\n display: grid;\n }\n }\n\n ", " {\n grid-auto-columns: unset;\n }\n\n // \uBAA8\uBC14\uC77C \uB9C1\uD06C\uB4E4\uC5D0 \uC0C1\uC18D\uB41C bg-color \uC81C\uAC70, \uD328\uB529 \uC138\uD305\n ", ", ", " {\n padding: 12px 0;\n\n &:hover,\n &:focus-visible {\n background-color: inherit;\n font-weight: 600;\n }\n\n svg {\n display: inline-block;\n }\n }\n\n // gnb \uAE30\uBCF8 link \uD638\uBC84 \uC2A4\uD0C0\uC77C \uBCC0\uACBD\n ", " {\n position: relative;\n\n &::before {\n content: '';\n display: block;\n position: absolute;\n bottom: 0;\n width: 100%;\n height: 1px;\n background-color: ", ";\n }\n }\n\n /** Notification **/\n // \uC804\uCCB4 \uC0AC\uC774\uC988 \uD5C8\uC6A9\n ", " {\n max-height: 100%;\n }\n\n /** Profile **/\n // \uC544\uB798 \uC5EC\uBC31 \uCD94\uAC00 \uD480over\n ", ", ", " {\n padding-bottom: 24px;\n }\n\n // \uADF8\uB9AC\uB4DC \uBCC0\uACBD(B2C)\n ", " {\n grid-template-areas: 'avatar name go-profile';\n grid-template-columns: max-content 1fr max-content;\n }\n\n ", " + ", " {\n margin-top: 16px;\n }\n "])), style$1.StyledNotificationContent, style.StyledGnbProfileContent, StyledGnbContentRight, styles$1.StyledDropdownMenuSection, style.StyledGnbMyAnchor, index.StyledGnbDropdownLinkItem, styles$1.StyledDropdownMenuSection, styles$1.StyledDropdownMenuSectionTitle, StyledGnbContentRight, StyledGnbContentRight, index.StyledGnbDropdownLinkItem, style$2.StyledGnbDropdownSpecialLinkItem, index.StyledGnbDropdownLinkItem, mixin.divider, style$1.StyledNotificationContent, style.StyledGnbProfileContent, style$2.StyledHamburgerMenuContent, style.StyledGnbMyInfo, styles$1.StyledDropdownMenuSection, styles$1.StyledDropdownMenuSection)));
31
-
32
- Object.defineProperty(exports, "GNB_VARS", {
33
- enumerable: true,
34
- get: function () { return _const.GNB_VARS; }
35
- });
36
- exports.GnbNaviLink = GnbNaviLink;
37
- exports.StyledDefaultIconButton = StyledDefaultIconButton;
38
- exports.StyledGnbAccountActionContainer = StyledGnbAccountActionContainer;
39
- exports.StyledGnbContent = StyledGnbContent;
40
- exports.StyledGnbContentLeft = StyledGnbContentLeft;
41
- exports.StyledGnbContentRight = StyledGnbContentRight;
42
- exports.StyledGnbLoginButton = StyledGnbLoginButton;
43
- exports.StyledGnbRoot = StyledGnbRoot;
44
- //# sourceMappingURL=style.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"style.cjs","sources":["../../../../src/Gnb/style.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { GNB_VARS } from '@/Gnb/const';\nimport {\n contents000,\n contents150,\n contents999,\n divider,\n getTypographyStyles,\n mobileOnly,\n secondary100,\n} from '@remember-web/mixin';\nimport {\n StyledGnbDropdownSpecialLinkItem,\n StyledHamburgerMenuContent,\n} from '@/Gnb/parts/GnbHamburgerMenu/style';\nimport { StyledTypography } from '@/Common/Typography/styles';\nimport { StyledNotificationContent } from '@/Gnb/parts/GnbNotification/style';\n\nimport {\n StyledGnbMyAnchor,\n StyledGnbMyInfo,\n StyledGnbProfileContent,\n} from './parts/GnbProfile/style';\nimport { dataResponsiveCss, defaultGridButtonCss, naviLinkCss } from './css';\nimport {\n StyledDropdownMenuSection,\n StyledDropdownMenuSectionTitle,\n} from '../Floating/DropdownMenu/styles';\nimport { StyledGnbDropdownLinkItem } from './parts/GnbDropdownLinkItem';\n\nexport { GNB_VARS } from '@/Gnb/const';\n\nexport const StyledGnbContent = styled.div`\n position: relative;\n\n display: grid;\n grid-auto-flow: column;\n justify-content: space-between;\n align-items: center;\n height: 100%;\n max-width: ${GNB_VARS.MAX_CONTENT_WIDTH};\n\n margin: 0 auto;\n padding: 0;\n gap: 8px;\n\n ${mobileOnly(css`\n padding: 0 12px;\n `)}\n`;\n\nexport const StyledGnbAccountActionContainer = styled.div`\n display: flex;\n align-items: center;\n gap: 12px;\n\n white-space: nowrap;\n`;\n\nexport const GnbNaviLink = styled.a<{\n 'data-active'?: boolean;\n}>`\n ${naviLinkCss};\n position: relative;\n display: flex;\n align-items: center;\n height: 100%;\n padding: 4px 8px 0;\n\n color: ${contents000};\n\n &[data-state='open'] {\n color: ${contents150};\n }\n &[data-active='true']::after {\n content: '';\n position: absolute;\n display: block;\n bottom: -1px;\n left: 0;\n right: 0;\n height: 2px;\n\n background-color: ${secondary100};\n }\n`;\n\nexport const StyledGnbLoginButton = styled.button`\n ${defaultGridButtonCss};\n ${getTypographyStyles('Body2')}\n font-weight: 500;\n\n height: 32px;\n`;\n\nexport const StyledGnbContentLeft = styled.nav`\n display: flex;\n align-items: center;\n height: 100%;\n min-width: max-content;\n gap: clamp(8px, 3vw, 40px);\n`;\n\nexport const StyledGnbContentRight = styled.div`\n display: grid;\n box-sizing: border-box;\n grid-auto-flow: column;\n grid-auto-columns: min(100px, 1fr) auto;\n height: 100%;\n max-width: 340px;\n padding-left: 4px;\n gap: 12px;\n`;\n\nexport const StyledDefaultIconButton = styled.button`\n ${defaultGridButtonCss};\n\n min-width: 24px;\n min-height: 24px;\n`;\n\n// 예외적 디자인 요구사항 - GNB 우선적으로 font-weight 500 전체 적용\nexport const StyledGnbRoot = styled.header<{ 'data-popover-opened': boolean }>`\n position: sticky;\n top: 0;\n left: 0;\n box-sizing: border-box;\n align-items: center;\n min-height: ${GNB_VARS.HEIGHT};\n height: ${GNB_VARS.HEIGHT};\n z-index: ${GNB_VARS.Z_INDEX};\n font-weight: 500;\n background: ${contents999};\n\n font-size: 16px;\n\n & + .gnb-spacer {\n display: none;\n min-height: ${GNB_VARS.HEIGHT};\n height: ${GNB_VARS.HEIGHT};\n box-sizing: border-box;\n }\n\n ${StyledTypography} {\n font-weight: 500;\n }\n\n ${StyledGnbMyAnchor}, ${StyledGnbDropdownLinkItem}, ${StyledDropdownMenuSectionTitle} {\n font-weight: 500;\n }\n\n // 데스크톱 사이즈에서 해당 엘리먼트의 > pseudo element를 숨김\n ${StyledGnbMyAnchor}, ${StyledGnbDropdownLinkItem} {\n ::after {\n display: none;\n }\n }\n\n ${dataResponsiveCss};\n\n ${StyledGnbDropdownLinkItem} {\n svg {\n display: none;\n }\n }\n\n ${StyledNotificationContent} {\n max-width: 375px;\n }\n\n // 모바일 반응형 스타일\n ${mobileOnly(css`\n ${StyledNotificationContent} {\n max-width: 100vw;\n }\n &[data-popover-opened='true'] + .gnb-spacer {\n display: block;\n }\n /** 전체 popover, dropdown **/\n // 전체 채우는 스타일로 변경 - wrapper\n &[data-popover-opened='true'] {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n }\n [data-radix-popper-content-wrapper] {\n transform: unset !important;\n inset: 0;\n top: 60px !important;\n }\n\n // 전체 채우는 스타일로 변경 - 내부 컨텐츠\n [data-mobile-fullover='true'] {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n overflow: hidden scroll;\n\n border-radius: 0;\n box-shadow: none;\n overscroll-behavior-x: contain;\n -webkit-overflow-scrolling: touch;\n }\n\n ${StyledGnbProfileContent} {\n padding-top: 12px;\n }\n\n ${StyledGnbContentRight} {\n gap: 20px;\n }\n\n // 섹션 내 패딩 제거\n ${StyledDropdownMenuSection} > * {\n padding: 0;\n }\n\n // 모바일에서는 > 에 해당하는 pseudo element를 보여줌\n ${StyledGnbMyAnchor}, ${StyledGnbDropdownLinkItem} {\n ::after {\n display: inline-block;\n }\n }\n\n // 모바일에서는 Dropdown Section의 border-bottom을 제거, 패딩 조정\n ${StyledDropdownMenuSection} {\n border-bottom: none;\n padding: 0 20px;\n\n ${StyledDropdownMenuSectionTitle} {\n padding: 0;\n }\n }\n\n // popover가 open되어 있지 않는 경우 Close 버튼 숨김\n &:not([data-popover-opened='true']) {\n [data-mobile-popover-close-button='true'] {\n display: none;\n }\n }\n\n // 모바일에서 전체 popover open되어 있는 경우\n &[data-popover-opened='true'] {\n ${StyledGnbContentRight} {\n grid-auto-columns: auto;\n }\n [data-is-mobile-popover-hidden='true'] {\n display: none;\n }\n [data-mobile-popover-close-button='true'] {\n display: grid;\n }\n }\n\n ${StyledGnbContentRight} {\n grid-auto-columns: unset;\n }\n\n // 모바일 링크들에 상속된 bg-color 제거, 패딩 세팅\n ${StyledGnbDropdownLinkItem}, ${StyledGnbDropdownSpecialLinkItem} {\n padding: 12px 0;\n\n &:hover,\n &:focus-visible {\n background-color: inherit;\n font-weight: 600;\n }\n\n svg {\n display: inline-block;\n }\n }\n\n // gnb 기본 link 호버 스타일 변경\n ${StyledGnbDropdownLinkItem} {\n position: relative;\n\n &::before {\n content: '';\n display: block;\n position: absolute;\n bottom: 0;\n width: 100%;\n height: 1px;\n background-color: ${divider};\n }\n }\n\n /** Notification **/\n // 전체 사이즈 허용\n ${StyledNotificationContent} {\n max-height: 100%;\n }\n\n /** Profile **/\n // 아래 여백 추가 풀over\n ${StyledGnbProfileContent}, ${StyledHamburgerMenuContent} {\n padding-bottom: 24px;\n }\n\n // 그리드 변경(B2C)\n ${StyledGnbMyInfo} {\n grid-template-areas: 'avatar name go-profile';\n grid-template-columns: max-content 1fr max-content;\n }\n\n ${StyledDropdownMenuSection} + ${StyledDropdownMenuSection} {\n margin-top: 16px;\n }\n `)};\n`;\n"],"names":["StyledGnbContent","styled","div","_templateObject","_taggedTemplateLiteral","GNB_VARS","MAX_CONTENT_WIDTH","mobileOnly","css","_templateObject2","StyledGnbAccountActionContainer","_templateObject3","GnbNaviLink","a","_templateObject4","naviLinkCss","contents000","contents150","secondary100","StyledGnbLoginButton","button","_templateObject5","defaultGridButtonCss","getTypographyStyles","StyledGnbContentLeft","nav","_templateObject6","StyledGnbContentRight","_templateObject7","StyledDefaultIconButton","_templateObject8","StyledGnbRoot","header","_templateObject9","HEIGHT","Z_INDEX","contents999","StyledTypography","StyledGnbMyAnchor","StyledGnbDropdownLinkItem","StyledDropdownMenuSectionTitle","dataResponsiveCss","StyledNotificationContent","_templateObject10","StyledGnbProfileContent","StyledDropdownMenuSection","StyledGnbDropdownSpecialLinkItem","divider","StyledHamburgerMenuContent","StyledGnbMyInfo"],"mappings":";;;;;;;;;;;;;;;;;;;;AAiCaA,IAAAA,gBAAgB,GAAGC,uBAAM,CAACC,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,uCAAA,CAQ3BC,CAAAA,mKAAAA,EAAAA,0DAAAA,EAAAA,IAAAA,CAAAA,CAAAA,CAAAA,EAAAA,eAAQ,CAACC,iBAAiB,EAMrCC,gBAAU,CAACC,UAAG,CAAAC,gBAAA,KAAAA,gBAAA,GAAAL,uCAAA,CAEf,CAAA,4BAAA,CAAA,CAAA,CAAA,CAAA,CAAC,EACH;AAEYM,IAAAA,+BAA+B,GAAGT,uBAAM,CAACC,GAAG,CAAAS,gBAAA,KAAAA,gBAAA,GAAAP,uCAAA,CAMxD,CAAA,sFAAA,CAAA,CAAA,CAAA,EAAA;AAEM,IAAMQ,WAAW,GAAGX,uBAAM,CAACY,CAAC,CAAAC,gBAAA,KAAAA,gBAAA,GAAAV,uCAAA,CAAA,CAAA,MAAA,EAAA,yHAAA,EAAA,4CAAA,EAAA,sMAAA,EAAA,UAAA,CAAA,CAAA,CAAA,EAG/BW,eAAW,EAOJC,iBAAW,EAGTC,iBAAW,EAWAC,kBAAY,EAEnC;IAEYC,oBAAoB,GAAGlB,uBAAM,CAACmB,MAAM,CAAAC,gBAAA,KAAAA,gBAAA,GAAAjB,uCAAA,oEAC7CkB,wBAAoB,EACpBC,yBAAmB,CAAC,OAAO,CAAC,EAI/B;AAEYC,IAAAA,oBAAoB,GAAGvB,uBAAM,CAACwB,GAAG,CAAAC,gBAAA,KAAAA,gBAAA,GAAAtB,uCAAA,CAM7C,CAAA,yHAAA,CAAA,CAAA,CAAA,EAAA;AAEYuB,IAAAA,qBAAqB,GAAG1B,uBAAM,CAACC,GAAG,CAAA0B,gBAAA,KAAAA,gBAAA,GAAAxB,uCAAA,CAS9C,CAAA,kMAAA,CAAA,CAAA,CAAA,EAAA;AAEYyB,IAAAA,uBAAuB,GAAG5B,uBAAM,CAACmB,MAAM,CAAAU,gBAAA,KAAAA,gBAAA,GAAA1B,uCAAA,CAAA,CAAA,MAAA,EAAA,gDAAA,CAAA,CAAA,CAAA,EAChDkB,wBAAoB,EAIvB;;AAED;AACO,IAAMS,aAAa,GAAG9B,uBAAM,CAAC+B,MAAM,CAAAC,gBAAA,KAAAA,gBAAA,GAAA7B,uCAAA,CAM1BC,CAAAA,iHAAAA,EAAAA,eAAAA,EAAAA,gBAAAA,EAAAA,wCAAAA,EAAAA,sFAAAA,EAAAA,iBAAAA,EAAAA,2CAAAA,EAAAA,sCAAAA,EAAAA,IAAAA,EAAAA,IAAAA,EAAAA,oLAAAA,EAAAA,IAAAA,EAAAA,2DAAAA,EAAAA,SAAAA,EAAAA,uDAAAA,EAAAA,qGAAAA,EAAAA,KAAAA,CAAAA,CAAAA,CAAAA,EAAAA,eAAQ,CAAC6B,MAAM,EACnB7B,eAAQ,CAAC6B,MAAM,EACd7B,eAAQ,CAAC8B,OAAO,EAEbC,iBAAW,EAMT/B,eAAQ,CAAC6B,MAAM,EACnB7B,eAAQ,CAAC6B,MAAM,EAIzBG,uBAAgB,EAIhBC,uBAAiB,EAAKC,+BAAyB,EAAKC,uCAA8B,EAKlFF,uBAAiB,EAAKC,+BAAyB,EAM/CE,qBAAiB,EAEjBF,+BAAyB,EAMzBG,iCAAyB,EAKzBnC,gBAAU,CAACC,UAAG,CAAAmC,iBAAA,KAAAA,iBAAA,GAAAvC,uCAAA,CAAA,CAAA,QAAA,EAAA,87BAAA,EAAA,6CAAA,EAAA,2FAAA,EAAA,iKAAA,EAAA,IAAA,EAAA,6MAAA,EAAA,kEAAA,EAAA,qbAAA,EAAA,mOAAA,EAAA,4KAAA,EAAA,IAAA,EAAA,iSAAA,EAAA,4NAAA,EAAA,0GAAA,EAAA,2HAAA,EAAA,IAAA,EAAA,6FAAA,EAAA,oIAAA,EAAA,KAAA,EAAA,wCAAA,CAAA,CAAA,CAAA,EACZsC,iCAAyB,EAoCzBE,6BAAuB,EAIvBjB,qBAAqB,EAKrBkB,kCAAyB,EAKzBP,uBAAiB,EAAKC,+BAAyB,EAO/CM,kCAAyB,EAIvBL,uCAA8B,EAc9Bb,qBAAqB,EAWvBA,qBAAqB,EAKrBY,+BAAyB,EAAKO,wCAAgC,EAe9DP,+BAAyB,EAUHQ,aAAO,EAM7BL,iCAAyB,EAMzBE,6BAAuB,EAAKI,kCAA0B,EAKtDC,qBAAe,EAKfJ,kCAAyB,EAAMA,kCAAyB,CAG3D,CAAC;;;;;;;;;;;;;;;"}
@@ -1,15 +0,0 @@
1
- /// <reference types="react" />
2
- export { GNB_VARS } from '@/Gnb/const';
3
- export declare const StyledGnbContent: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
4
- export declare const StyledGnbAccountActionContainer: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
5
- export declare const GnbNaviLink: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, {
6
- 'data-active'?: boolean | undefined;
7
- }>>;
8
- export declare const StyledGnbLoginButton: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>>;
9
- export declare const StyledGnbContentLeft: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, never>>;
10
- export declare const StyledGnbContentRight: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
11
- export declare const StyledDefaultIconButton: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>>;
12
- export declare const StyledGnbRoot: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {
13
- 'data-popover-opened': boolean;
14
- }>>;
15
- //# sourceMappingURL=style.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"style.d.ts","sourceRoot":"","sources":["../../../../src/Gnb/style.tsx"],"names":[],"mappings":";AA+BA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,eAAO,MAAM,gBAAgB,gNAiB5B,CAAC;AAEF,eAAO,MAAM,+BAA+B,gNAM3C,CAAC;AAEF,eAAO,MAAM,WAAW;;GA0BvB,CAAC;AAEF,eAAO,MAAM,oBAAoB,4NAMhC,CAAC;AAEF,eAAO,MAAM,oBAAoB,0MAMhC,CAAC;AAEF,eAAO,MAAM,qBAAqB,gNASjC,CAAC;AAEF,eAAO,MAAM,uBAAuB,4NAKnC,CAAC;AAGF,eAAO,MAAM,aAAa;2BAA0C,OAAO;GAgM1E,CAAC"}
@@ -1,26 +0,0 @@
1
- import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
2
- import styled, { css } from 'styled-components';
3
- import { GNB_VARS } from './const.js';
4
- import { mobileOnly, contents000, contents150, secondary100, getTypographyStyles, contents999, divider } from '@remember-web/mixin';
5
- import { StyledGnbDropdownSpecialLinkItem, StyledHamburgerMenuContent } from './parts/GnbHamburgerMenu/style.js';
6
- import { StyledTypography } from '../Common/Typography/styles.js';
7
- import { StyledNotificationContent } from './parts/GnbNotification/style.js';
8
- import { StyledGnbMyAnchor, StyledGnbProfileContent, StyledGnbMyInfo } from './parts/GnbProfile/style.js';
9
- import { naviLinkCss, defaultGridButtonCss, dataResponsiveCss } from './css.js';
10
- import { StyledDropdownMenuSectionTitle, StyledDropdownMenuSection } from '../Floating/DropdownMenu/styles.js';
11
- import { StyledGnbDropdownLinkItem } from './parts/GnbDropdownLinkItem/index.js';
12
-
13
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
14
- var StyledGnbContent = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n position: relative;\n\n display: grid;\n grid-auto-flow: column;\n justify-content: space-between;\n align-items: center;\n height: 100%;\n max-width: ", ";\n\n margin: 0 auto;\n padding: 0;\n gap: 8px;\n\n ", "\n"])), GNB_VARS.MAX_CONTENT_WIDTH, mobileOnly(css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n padding: 0 12px;\n "])))));
15
- var StyledGnbAccountActionContainer = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n gap: 12px;\n\n white-space: nowrap;\n"])));
16
- var GnbNaviLink = styled.a(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n ", ";\n position: relative;\n display: flex;\n align-items: center;\n height: 100%;\n padding: 4px 8px 0;\n\n color: ", ";\n\n &[data-state='open'] {\n color: ", ";\n }\n &[data-active='true']::after {\n content: '';\n position: absolute;\n display: block;\n bottom: -1px;\n left: 0;\n right: 0;\n height: 2px;\n\n background-color: ", ";\n }\n"])), naviLinkCss, contents000, contents150, secondary100);
17
- var StyledGnbLoginButton = styled.button(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n ", ";\n ", "\n font-weight: 500;\n\n height: 32px;\n"])), defaultGridButtonCss, getTypographyStyles('Body2'));
18
- var StyledGnbContentLeft = styled.nav(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n height: 100%;\n min-width: max-content;\n gap: clamp(8px, 3vw, 40px);\n"])));
19
- var StyledGnbContentRight = styled.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n display: grid;\n box-sizing: border-box;\n grid-auto-flow: column;\n grid-auto-columns: min(100px, 1fr) auto;\n height: 100%;\n max-width: 340px;\n padding-left: 4px;\n gap: 12px;\n"])));
20
- var StyledDefaultIconButton = styled.button(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n ", ";\n\n min-width: 24px;\n min-height: 24px;\n"])), defaultGridButtonCss);
21
-
22
- // 예외적 디자인 요구사항 - GNB 우선적으로 font-weight 500 전체 적용
23
- var StyledGnbRoot = styled.header(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n position: sticky;\n top: 0;\n left: 0;\n box-sizing: border-box;\n align-items: center;\n min-height: ", ";\n height: ", ";\n z-index: ", ";\n font-weight: 500;\n background: ", ";\n\n font-size: 16px;\n\n & + .gnb-spacer {\n display: none;\n min-height: ", ";\n height: ", ";\n box-sizing: border-box;\n }\n\n ", " {\n font-weight: 500;\n }\n\n ", ", ", ", ", " {\n font-weight: 500;\n }\n\n // \uB370\uC2A4\uD06C\uD1B1 \uC0AC\uC774\uC988\uC5D0\uC11C \uD574\uB2F9 \uC5D8\uB9AC\uBA3C\uD2B8\uC758 > pseudo element\uB97C \uC228\uAE40\n ", ", ", " {\n ::after {\n display: none;\n }\n }\n\n ", ";\n\n ", " {\n svg {\n display: none;\n }\n }\n\n ", " {\n max-width: 375px;\n }\n\n // \uBAA8\uBC14\uC77C \uBC18\uC751\uD615 \uC2A4\uD0C0\uC77C\n ", ";\n"])), GNB_VARS.HEIGHT, GNB_VARS.HEIGHT, GNB_VARS.Z_INDEX, contents999, GNB_VARS.HEIGHT, GNB_VARS.HEIGHT, StyledTypography, StyledGnbMyAnchor, StyledGnbDropdownLinkItem, StyledDropdownMenuSectionTitle, StyledGnbMyAnchor, StyledGnbDropdownLinkItem, dataResponsiveCss, StyledGnbDropdownLinkItem, StyledNotificationContent, mobileOnly(css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n ", " {\n max-width: 100vw;\n }\n &[data-popover-opened='true'] + .gnb-spacer {\n display: block;\n }\n /** \uC804\uCCB4 popover, dropdown **/\n // \uC804\uCCB4 \uCC44\uC6B0\uB294 \uC2A4\uD0C0\uC77C\uB85C \uBCC0\uACBD - wrapper\n &[data-popover-opened='true'] {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n }\n [data-radix-popper-content-wrapper] {\n transform: unset !important;\n inset: 0;\n top: 60px !important;\n }\n\n // \uC804\uCCB4 \uCC44\uC6B0\uB294 \uC2A4\uD0C0\uC77C\uB85C \uBCC0\uACBD - \uB0B4\uBD80 \uCEE8\uD150\uCE20\n [data-mobile-fullover='true'] {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n overflow: hidden scroll;\n\n border-radius: 0;\n box-shadow: none;\n overscroll-behavior-x: contain;\n -webkit-overflow-scrolling: touch;\n }\n\n ", " {\n padding-top: 12px;\n }\n\n ", " {\n gap: 20px;\n }\n\n // \uC139\uC158 \uB0B4 \uD328\uB529 \uC81C\uAC70\n ", " > * {\n padding: 0;\n }\n\n // \uBAA8\uBC14\uC77C\uC5D0\uC11C\uB294 > \uC5D0 \uD574\uB2F9\uD558\uB294 pseudo element\uB97C \uBCF4\uC5EC\uC90C\n ", ", ", " {\n ::after {\n display: inline-block;\n }\n }\n\n // \uBAA8\uBC14\uC77C\uC5D0\uC11C\uB294 Dropdown Section\uC758 border-bottom\uC744 \uC81C\uAC70, \uD328\uB529 \uC870\uC815\n ", " {\n border-bottom: none;\n padding: 0 20px;\n\n ", " {\n padding: 0;\n }\n }\n\n // popover\uAC00 open\uB418\uC5B4 \uC788\uC9C0 \uC54A\uB294 \uACBD\uC6B0 Close \uBC84\uD2BC \uC228\uAE40\n &:not([data-popover-opened='true']) {\n [data-mobile-popover-close-button='true'] {\n display: none;\n }\n }\n\n // \uBAA8\uBC14\uC77C\uC5D0\uC11C \uC804\uCCB4 popover open\uB418\uC5B4 \uC788\uB294 \uACBD\uC6B0\n &[data-popover-opened='true'] {\n ", " {\n grid-auto-columns: auto;\n }\n [data-is-mobile-popover-hidden='true'] {\n display: none;\n }\n [data-mobile-popover-close-button='true'] {\n display: grid;\n }\n }\n\n ", " {\n grid-auto-columns: unset;\n }\n\n // \uBAA8\uBC14\uC77C \uB9C1\uD06C\uB4E4\uC5D0 \uC0C1\uC18D\uB41C bg-color \uC81C\uAC70, \uD328\uB529 \uC138\uD305\n ", ", ", " {\n padding: 12px 0;\n\n &:hover,\n &:focus-visible {\n background-color: inherit;\n font-weight: 600;\n }\n\n svg {\n display: inline-block;\n }\n }\n\n // gnb \uAE30\uBCF8 link \uD638\uBC84 \uC2A4\uD0C0\uC77C \uBCC0\uACBD\n ", " {\n position: relative;\n\n &::before {\n content: '';\n display: block;\n position: absolute;\n bottom: 0;\n width: 100%;\n height: 1px;\n background-color: ", ";\n }\n }\n\n /** Notification **/\n // \uC804\uCCB4 \uC0AC\uC774\uC988 \uD5C8\uC6A9\n ", " {\n max-height: 100%;\n }\n\n /** Profile **/\n // \uC544\uB798 \uC5EC\uBC31 \uCD94\uAC00 \uD480over\n ", ", ", " {\n padding-bottom: 24px;\n }\n\n // \uADF8\uB9AC\uB4DC \uBCC0\uACBD(B2C)\n ", " {\n grid-template-areas: 'avatar name go-profile';\n grid-template-columns: max-content 1fr max-content;\n }\n\n ", " + ", " {\n margin-top: 16px;\n }\n "])), StyledNotificationContent, StyledGnbProfileContent, StyledGnbContentRight, StyledDropdownMenuSection, StyledGnbMyAnchor, StyledGnbDropdownLinkItem, StyledDropdownMenuSection, StyledDropdownMenuSectionTitle, StyledGnbContentRight, StyledGnbContentRight, StyledGnbDropdownLinkItem, StyledGnbDropdownSpecialLinkItem, StyledGnbDropdownLinkItem, divider, StyledNotificationContent, StyledGnbProfileContent, StyledHamburgerMenuContent, StyledGnbMyInfo, StyledDropdownMenuSection, StyledDropdownMenuSection)));
24
-
25
- export { GNB_VARS, GnbNaviLink, StyledDefaultIconButton, StyledGnbAccountActionContainer, StyledGnbContent, StyledGnbContentLeft, StyledGnbContentRight, StyledGnbLoginButton, StyledGnbRoot };
26
- //# sourceMappingURL=style.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"style.js","sources":["../../../../src/Gnb/style.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { GNB_VARS } from '@/Gnb/const';\nimport {\n contents000,\n contents150,\n contents999,\n divider,\n getTypographyStyles,\n mobileOnly,\n secondary100,\n} from '@remember-web/mixin';\nimport {\n StyledGnbDropdownSpecialLinkItem,\n StyledHamburgerMenuContent,\n} from '@/Gnb/parts/GnbHamburgerMenu/style';\nimport { StyledTypography } from '@/Common/Typography/styles';\nimport { StyledNotificationContent } from '@/Gnb/parts/GnbNotification/style';\n\nimport {\n StyledGnbMyAnchor,\n StyledGnbMyInfo,\n StyledGnbProfileContent,\n} from './parts/GnbProfile/style';\nimport { dataResponsiveCss, defaultGridButtonCss, naviLinkCss } from './css';\nimport {\n StyledDropdownMenuSection,\n StyledDropdownMenuSectionTitle,\n} from '../Floating/DropdownMenu/styles';\nimport { StyledGnbDropdownLinkItem } from './parts/GnbDropdownLinkItem';\n\nexport { GNB_VARS } from '@/Gnb/const';\n\nexport const StyledGnbContent = styled.div`\n position: relative;\n\n display: grid;\n grid-auto-flow: column;\n justify-content: space-between;\n align-items: center;\n height: 100%;\n max-width: ${GNB_VARS.MAX_CONTENT_WIDTH};\n\n margin: 0 auto;\n padding: 0;\n gap: 8px;\n\n ${mobileOnly(css`\n padding: 0 12px;\n `)}\n`;\n\nexport const StyledGnbAccountActionContainer = styled.div`\n display: flex;\n align-items: center;\n gap: 12px;\n\n white-space: nowrap;\n`;\n\nexport const GnbNaviLink = styled.a<{\n 'data-active'?: boolean;\n}>`\n ${naviLinkCss};\n position: relative;\n display: flex;\n align-items: center;\n height: 100%;\n padding: 4px 8px 0;\n\n color: ${contents000};\n\n &[data-state='open'] {\n color: ${contents150};\n }\n &[data-active='true']::after {\n content: '';\n position: absolute;\n display: block;\n bottom: -1px;\n left: 0;\n right: 0;\n height: 2px;\n\n background-color: ${secondary100};\n }\n`;\n\nexport const StyledGnbLoginButton = styled.button`\n ${defaultGridButtonCss};\n ${getTypographyStyles('Body2')}\n font-weight: 500;\n\n height: 32px;\n`;\n\nexport const StyledGnbContentLeft = styled.nav`\n display: flex;\n align-items: center;\n height: 100%;\n min-width: max-content;\n gap: clamp(8px, 3vw, 40px);\n`;\n\nexport const StyledGnbContentRight = styled.div`\n display: grid;\n box-sizing: border-box;\n grid-auto-flow: column;\n grid-auto-columns: min(100px, 1fr) auto;\n height: 100%;\n max-width: 340px;\n padding-left: 4px;\n gap: 12px;\n`;\n\nexport const StyledDefaultIconButton = styled.button`\n ${defaultGridButtonCss};\n\n min-width: 24px;\n min-height: 24px;\n`;\n\n// 예외적 디자인 요구사항 - GNB 우선적으로 font-weight 500 전체 적용\nexport const StyledGnbRoot = styled.header<{ 'data-popover-opened': boolean }>`\n position: sticky;\n top: 0;\n left: 0;\n box-sizing: border-box;\n align-items: center;\n min-height: ${GNB_VARS.HEIGHT};\n height: ${GNB_VARS.HEIGHT};\n z-index: ${GNB_VARS.Z_INDEX};\n font-weight: 500;\n background: ${contents999};\n\n font-size: 16px;\n\n & + .gnb-spacer {\n display: none;\n min-height: ${GNB_VARS.HEIGHT};\n height: ${GNB_VARS.HEIGHT};\n box-sizing: border-box;\n }\n\n ${StyledTypography} {\n font-weight: 500;\n }\n\n ${StyledGnbMyAnchor}, ${StyledGnbDropdownLinkItem}, ${StyledDropdownMenuSectionTitle} {\n font-weight: 500;\n }\n\n // 데스크톱 사이즈에서 해당 엘리먼트의 > pseudo element를 숨김\n ${StyledGnbMyAnchor}, ${StyledGnbDropdownLinkItem} {\n ::after {\n display: none;\n }\n }\n\n ${dataResponsiveCss};\n\n ${StyledGnbDropdownLinkItem} {\n svg {\n display: none;\n }\n }\n\n ${StyledNotificationContent} {\n max-width: 375px;\n }\n\n // 모바일 반응형 스타일\n ${mobileOnly(css`\n ${StyledNotificationContent} {\n max-width: 100vw;\n }\n &[data-popover-opened='true'] + .gnb-spacer {\n display: block;\n }\n /** 전체 popover, dropdown **/\n // 전체 채우는 스타일로 변경 - wrapper\n &[data-popover-opened='true'] {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n }\n [data-radix-popper-content-wrapper] {\n transform: unset !important;\n inset: 0;\n top: 60px !important;\n }\n\n // 전체 채우는 스타일로 변경 - 내부 컨텐츠\n [data-mobile-fullover='true'] {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n overflow: hidden scroll;\n\n border-radius: 0;\n box-shadow: none;\n overscroll-behavior-x: contain;\n -webkit-overflow-scrolling: touch;\n }\n\n ${StyledGnbProfileContent} {\n padding-top: 12px;\n }\n\n ${StyledGnbContentRight} {\n gap: 20px;\n }\n\n // 섹션 내 패딩 제거\n ${StyledDropdownMenuSection} > * {\n padding: 0;\n }\n\n // 모바일에서는 > 에 해당하는 pseudo element를 보여줌\n ${StyledGnbMyAnchor}, ${StyledGnbDropdownLinkItem} {\n ::after {\n display: inline-block;\n }\n }\n\n // 모바일에서는 Dropdown Section의 border-bottom을 제거, 패딩 조정\n ${StyledDropdownMenuSection} {\n border-bottom: none;\n padding: 0 20px;\n\n ${StyledDropdownMenuSectionTitle} {\n padding: 0;\n }\n }\n\n // popover가 open되어 있지 않는 경우 Close 버튼 숨김\n &:not([data-popover-opened='true']) {\n [data-mobile-popover-close-button='true'] {\n display: none;\n }\n }\n\n // 모바일에서 전체 popover open되어 있는 경우\n &[data-popover-opened='true'] {\n ${StyledGnbContentRight} {\n grid-auto-columns: auto;\n }\n [data-is-mobile-popover-hidden='true'] {\n display: none;\n }\n [data-mobile-popover-close-button='true'] {\n display: grid;\n }\n }\n\n ${StyledGnbContentRight} {\n grid-auto-columns: unset;\n }\n\n // 모바일 링크들에 상속된 bg-color 제거, 패딩 세팅\n ${StyledGnbDropdownLinkItem}, ${StyledGnbDropdownSpecialLinkItem} {\n padding: 12px 0;\n\n &:hover,\n &:focus-visible {\n background-color: inherit;\n font-weight: 600;\n }\n\n svg {\n display: inline-block;\n }\n }\n\n // gnb 기본 link 호버 스타일 변경\n ${StyledGnbDropdownLinkItem} {\n position: relative;\n\n &::before {\n content: '';\n display: block;\n position: absolute;\n bottom: 0;\n width: 100%;\n height: 1px;\n background-color: ${divider};\n }\n }\n\n /** Notification **/\n // 전체 사이즈 허용\n ${StyledNotificationContent} {\n max-height: 100%;\n }\n\n /** Profile **/\n // 아래 여백 추가 풀over\n ${StyledGnbProfileContent}, ${StyledHamburgerMenuContent} {\n padding-bottom: 24px;\n }\n\n // 그리드 변경(B2C)\n ${StyledGnbMyInfo} {\n grid-template-areas: 'avatar name go-profile';\n grid-template-columns: max-content 1fr max-content;\n }\n\n ${StyledDropdownMenuSection} + ${StyledDropdownMenuSection} {\n margin-top: 16px;\n }\n `)};\n`;\n"],"names":["StyledGnbContent","styled","div","_templateObject","_taggedTemplateLiteral","GNB_VARS","MAX_CONTENT_WIDTH","mobileOnly","css","_templateObject2","StyledGnbAccountActionContainer","_templateObject3","GnbNaviLink","a","_templateObject4","naviLinkCss","contents000","contents150","secondary100","StyledGnbLoginButton","button","_templateObject5","defaultGridButtonCss","getTypographyStyles","StyledGnbContentLeft","nav","_templateObject6","StyledGnbContentRight","_templateObject7","StyledDefaultIconButton","_templateObject8","StyledGnbRoot","header","_templateObject9","HEIGHT","Z_INDEX","contents999","StyledTypography","StyledGnbMyAnchor","StyledGnbDropdownLinkItem","StyledDropdownMenuSectionTitle","dataResponsiveCss","StyledNotificationContent","_templateObject10","StyledGnbProfileContent","StyledDropdownMenuSection","StyledGnbDropdownSpecialLinkItem","divider","StyledHamburgerMenuContent","StyledGnbMyInfo"],"mappings":";;;;;;;;;;;;;AAiCaA,IAAAA,gBAAgB,GAAGC,MAAM,CAACC,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,CAQ3BC,CAAAA,mKAAAA,EAAAA,0DAAAA,EAAAA,IAAAA,CAAAA,CAAAA,CAAAA,EAAAA,QAAQ,CAACC,iBAAiB,EAMrCC,UAAU,CAACC,GAAG,CAAAC,gBAAA,KAAAA,gBAAA,GAAAL,sBAAA,CAEf,CAAA,4BAAA,CAAA,CAAA,CAAA,CAAA,CAAC,EACH;AAEYM,IAAAA,+BAA+B,GAAGT,MAAM,CAACC,GAAG,CAAAS,gBAAA,KAAAA,gBAAA,GAAAP,sBAAA,CAMxD,CAAA,sFAAA,CAAA,CAAA,CAAA,EAAA;AAEM,IAAMQ,WAAW,GAAGX,MAAM,CAACY,CAAC,CAAAC,gBAAA,KAAAA,gBAAA,GAAAV,sBAAA,CAAA,CAAA,MAAA,EAAA,yHAAA,EAAA,4CAAA,EAAA,sMAAA,EAAA,UAAA,CAAA,CAAA,CAAA,EAG/BW,WAAW,EAOJC,WAAW,EAGTC,WAAW,EAWAC,YAAY,EAEnC;IAEYC,oBAAoB,GAAGlB,MAAM,CAACmB,MAAM,CAAAC,gBAAA,KAAAA,gBAAA,GAAAjB,sBAAA,oEAC7CkB,oBAAoB,EACpBC,mBAAmB,CAAC,OAAO,CAAC,EAI/B;AAEYC,IAAAA,oBAAoB,GAAGvB,MAAM,CAACwB,GAAG,CAAAC,gBAAA,KAAAA,gBAAA,GAAAtB,sBAAA,CAM7C,CAAA,yHAAA,CAAA,CAAA,CAAA,EAAA;AAEYuB,IAAAA,qBAAqB,GAAG1B,MAAM,CAACC,GAAG,CAAA0B,gBAAA,KAAAA,gBAAA,GAAAxB,sBAAA,CAS9C,CAAA,kMAAA,CAAA,CAAA,CAAA,EAAA;AAEYyB,IAAAA,uBAAuB,GAAG5B,MAAM,CAACmB,MAAM,CAAAU,gBAAA,KAAAA,gBAAA,GAAA1B,sBAAA,CAAA,CAAA,MAAA,EAAA,gDAAA,CAAA,CAAA,CAAA,EAChDkB,oBAAoB,EAIvB;;AAED;AACO,IAAMS,aAAa,GAAG9B,MAAM,CAAC+B,MAAM,CAAAC,gBAAA,KAAAA,gBAAA,GAAA7B,sBAAA,CAM1BC,CAAAA,iHAAAA,EAAAA,eAAAA,EAAAA,gBAAAA,EAAAA,wCAAAA,EAAAA,sFAAAA,EAAAA,iBAAAA,EAAAA,2CAAAA,EAAAA,sCAAAA,EAAAA,IAAAA,EAAAA,IAAAA,EAAAA,oLAAAA,EAAAA,IAAAA,EAAAA,2DAAAA,EAAAA,SAAAA,EAAAA,uDAAAA,EAAAA,qGAAAA,EAAAA,KAAAA,CAAAA,CAAAA,CAAAA,EAAAA,QAAQ,CAAC6B,MAAM,EACnB7B,QAAQ,CAAC6B,MAAM,EACd7B,QAAQ,CAAC8B,OAAO,EAEbC,WAAW,EAMT/B,QAAQ,CAAC6B,MAAM,EACnB7B,QAAQ,CAAC6B,MAAM,EAIzBG,gBAAgB,EAIhBC,iBAAiB,EAAKC,yBAAyB,EAAKC,8BAA8B,EAKlFF,iBAAiB,EAAKC,yBAAyB,EAM/CE,iBAAiB,EAEjBF,yBAAyB,EAMzBG,yBAAyB,EAKzBnC,UAAU,CAACC,GAAG,CAAAmC,iBAAA,KAAAA,iBAAA,GAAAvC,sBAAA,CAAA,CAAA,QAAA,EAAA,87BAAA,EAAA,6CAAA,EAAA,2FAAA,EAAA,iKAAA,EAAA,IAAA,EAAA,6MAAA,EAAA,kEAAA,EAAA,qbAAA,EAAA,mOAAA,EAAA,4KAAA,EAAA,IAAA,EAAA,iSAAA,EAAA,4NAAA,EAAA,0GAAA,EAAA,2HAAA,EAAA,IAAA,EAAA,6FAAA,EAAA,oIAAA,EAAA,KAAA,EAAA,wCAAA,CAAA,CAAA,CAAA,EACZsC,yBAAyB,EAoCzBE,uBAAuB,EAIvBjB,qBAAqB,EAKrBkB,yBAAyB,EAKzBP,iBAAiB,EAAKC,yBAAyB,EAO/CM,yBAAyB,EAIvBL,8BAA8B,EAc9Bb,qBAAqB,EAWvBA,qBAAqB,EAKrBY,yBAAyB,EAAKO,gCAAgC,EAe9DP,yBAAyB,EAUHQ,OAAO,EAM7BL,yBAAyB,EAMzBE,uBAAuB,EAAKI,0BAA0B,EAKtDC,eAAe,EAKfJ,yBAAyB,EAAMA,yBAAyB,CAG3D,CAAC;;;;"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"const.js","sources":["../../../../../../src/Inputs/Select/DesignedSelect/const.ts"],"sourcesContent":["export const OPTION_ITEM_HEIGHT_PX = 44;\nexport const DEFAULT_MAX_HEIGHT_PX = OPTION_ITEM_HEIGHT_PX * 4;\n"],"names":["OPTION_ITEM_HEIGHT_PX","DEFAULT_MAX_HEIGHT_PX"],"mappings":"AAAO,IAAMA,qBAAqB,GAAG,GAAE;AAC1BC,IAAAA,qBAAqB,GAAGD,qBAAqB,GAAG;;;;"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sources":["../../../../../../src/Inputs/Select/DesignedSelect/index.tsx"],"sourcesContent":["'use client';\n\nimport type { KeyboardEvent, ReactNode, Ref, RefCallback } from 'react';\nimport {\n Children,\n forwardRef,\n isValidElement,\n useCallback,\n useRef,\n useState,\n useId,\n} from 'react';\n\nimport { focusSibling } from '../utils';\nimport useMouseEventAway from '@/hooks/useMouseEventAway';\nimport { IconArrow2Down, IconArrow2Up } from '@remember-web/icon';\n\nimport { OptionHolder } from '../Option';\nimport { SelectContainer } from '../styles';\nimport type { OptionElementType, SelectValue } from '../types';\nimport { DEFAULT_MAX_HEIGHT_PX, OPTION_ITEM_HEIGHT_PX } from './const';\nimport {\n SelectDownIcon,\n SelectOption,\n SelectOptionWrapper,\n StyledSelect,\n} from './styles';\nimport type { DesignedSelectInternalProps, ExpandedType } from './types';\n\nconst DesignedSelect = <Value extends SelectValue>(\n {\n children,\n value,\n maxHeight = DEFAULT_MAX_HEIGHT_PX,\n placeholder,\n onChange,\n width,\n extendDirection,\n disabled,\n ...props\n }: DesignedSelectInternalProps<Value>,\n ref?: Ref<HTMLDivElement>\n) => {\n const id = useId();\n const [expandedDirection, _setExpandedDirection] =\n useState<ExpandedType>('none');\n const selectContainerRef = useRef<HTMLDivElement | null>(null);\n const selectListRef = useRef<HTMLUListElement | null>(null);\n const clickAwayRef = useMouseEventAway<HTMLDivElement, 'pointerdown'>(\n 'pointerdown',\n () => {\n setExpandedDirection('none');\n }\n );\n\n const setExpandedDirection = useCallback(\n (...args: Parameters<typeof _setExpandedDirection>) => {\n if (disabled) {\n return;\n }\n _setExpandedDirection(...args);\n },\n [disabled]\n );\n\n const options = Children.toArray(children)\n .filter(\n (child): child is OptionElementType<Value> =>\n isValidElement(child) && child.type === OptionHolder\n )\n .map(\n ({\n props: { children: _children, value: _value, disabled: _disabled },\n }) => ({\n label: _children,\n value: _value,\n disabled: _disabled,\n })\n );\n\n const selectedOption = options.find((option) => value === option.value);\n\n const isExpanded = expandedDirection !== 'none';\n\n const onSelectOption = (_value: Value, _label: ReactNode) => {\n onChange?.(_value, _label);\n setExpandedDirection('none');\n selectContainerRef.current?.focus();\n };\n\n // 리스트가 하단으로 나와야하는지 상단으로 나와야하는지 계산하는 함수\n // 현재 Viewport기준으로 Select컴포넌트가 아래로 확장되었을 때 뷰포트 내에 리스트박스가 노출될 수 있다면 하단으로 확장, 아니라면 상단으로 확장\n // direction이 props로 전달되었다면 해당 방향으로 확장\n const expandSelectListAtComputedPosition = () => {\n if (extendDirection) {\n setExpandedDirection(extendDirection);\n return;\n }\n\n const selectContainerRect =\n selectContainerRef.current?.getBoundingClientRect();\n\n if (!selectContainerRect) {\n setExpandedDirection('below');\n return;\n }\n\n // SelectOptionWrapper가 마운트되기 전에 계산해야 하기 때문에 clientHeight를 사용하지 못하고 직접 계산\n const currentSelectHeight = Math.min(\n maxHeight,\n options.length * OPTION_ITEM_HEIGHT_PX\n );\n const bottomGap = document.body.clientHeight - selectContainerRect.bottom;\n\n setExpandedDirection(currentSelectHeight > bottomGap ? 'above' : 'below');\n };\n\n const optionItemRef = useCallback<RefCallback<HTMLLIElement>>(\n (ele) => {\n if (!ele) {\n return;\n }\n\n // 선택한 요소가 없을때는 첫번째 요소에 focus\n if (!value && !ele.previousSibling) {\n setTimeout(() => ele.focus());\n return;\n }\n\n // 선택한 요소가 있다면 해당 요소에 focus\n const optionValue = ele.dataset.optionValue || null;\n if (optionValue === value) {\n setTimeout(() => ele.focus());\n }\n },\n [value]\n );\n\n const keyDownHandler = (e: KeyboardEvent) => {\n const focusedElement = document.activeElement;\n\n if (!focusedElement || !(focusedElement instanceof HTMLElement)) {\n return;\n }\n\n switch (e.key) {\n case 'Tab':\n if (isExpanded) {\n e.preventDefault();\n }\n break;\n case 'ArrowUp':\n e.preventDefault();\n if (!isExpanded) {\n expandSelectListAtComputedPosition();\n break;\n }\n focusSibling(focusedElement, 'previous');\n break;\n case 'ArrowDown':\n e.preventDefault();\n if (!isExpanded) {\n expandSelectListAtComputedPosition();\n break;\n }\n focusSibling(focusedElement, 'next');\n break;\n case 'Escape':\n e.preventDefault();\n setExpandedDirection('none');\n selectContainerRef.current?.focus();\n break;\n case 'Enter':\n case ' ':\n e.preventDefault();\n\n if (e.target === e.currentTarget) {\n if (isExpanded) {\n setExpandedDirection('none');\n return;\n }\n expandSelectListAtComputedPosition();\n }\n\n if (\n focusedElement?.matches('[data-option-value]') &&\n focusedElement instanceof HTMLLIElement &&\n focusedElement.dataset.optionValue\n ) {\n onSelectOption(\n focusedElement.dataset.optionValue as Value,\n focusedElement.innerText\n );\n }\n break;\n default:\n break;\n }\n };\n\n return (\n <SelectContainer\n ref={(el) => {\n if (!el) {\n return;\n }\n selectContainerRef.current = el;\n clickAwayRef.current = el;\n }}\n $width={width}\n tabIndex={disabled ? undefined : 0}\n aria-expanded={isExpanded}\n aria-haspopup=\"listbox\"\n aria-disabled={disabled}\n onKeyDown={keyDownHandler}\n {...props}\n >\n <StyledSelect\n ref={ref}\n expandedDirection={expandedDirection}\n isPlaceholder={!selectedOption && !!placeholder}\n onPointerDown={(e) => {\n if (isExpanded) {\n setExpandedDirection('none');\n return;\n }\n\n e.stopPropagation();\n\n expandSelectListAtComputedPosition();\n }}\n >\n {selectedOption?.label || placeholder || 'ㅤ'}\n </StyledSelect>\n <SelectDownIcon>\n {isExpanded ? (\n <IconArrow2Up size=\"small\" />\n ) : (\n <IconArrow2Down size=\"small\" />\n )}\n </SelectDownIcon>\n {isExpanded && (\n <SelectOptionWrapper\n role=\"listbox\"\n aria-activedescendant={\n value != null ? `${id}-select-option-${value}` : undefined\n }\n ref={selectListRef}\n expandedDirection={expandedDirection}\n maxHeight={maxHeight}\n >\n {options.map(({ value: optionValue, label, disabled: _disabled }) => (\n <SelectOption\n id={`${id}-select-option-${optionValue}`}\n role=\"option\"\n key={optionValue}\n tabIndex={_disabled ? undefined : 0}\n aria-selected={optionValue === value}\n aria-disabled={_disabled}\n ref={optionItemRef}\n isSelected={optionValue === value}\n data-option-value={optionValue}\n // onMouseEnter를 사용하게 되면 키보드로 스크롤 할 때도 focus가 이동하게 되기 때문에 onMouseMove를 사용\n onMouseMove={(e) => {\n if (e.currentTarget === document.activeElement) {\n return;\n }\n e.currentTarget.focus({\n preventScroll: true,\n });\n }}\n onFocus={() => {\n selectListRef.current?.setAttribute(\n 'aria-activedescendant',\n `${id}-select-option-${optionValue}`\n );\n }}\n onClick={() => {\n if (_disabled) {\n return;\n }\n\n onSelectOption(optionValue, label);\n }}\n >\n {label}\n </SelectOption>\n ))}\n </SelectOptionWrapper>\n )}\n </SelectContainer>\n );\n};\n\nexport default forwardRef(DesignedSelect);\n"],"names":["maxHeight","props","expandedDirection","_setExpandedDirection","label","value","disabled","setTimeout","expandSelectListAtComputedPosition","focusSibling","ref","$width","tabIndex","onKeyDown","isPlaceholder","onPointerDown","children","size","role","onMouseMove","e","preventScroll","onSelectOption"],"mappings":";;;;;;;;;;;;;;AAAa;AAAA;AAAA;AA6Bb;AAaK;;;AATDA;;;;;;AAMGC;AAIL;AACA;;AAAOC;AAAmBC;AAE1B;AACA;AACA;;AAIE;AAGF;AAEI;AACE;AACF;AACAA;AACF;AAIF;;AAG0D;AAGtD;;;;;AAGEC;AACAC;AACAC;;AACD;AAGL;AAA2C;;AAE3C;;AAE6D;;;AAG3D;;;AAGF;AACA;AACA;AACA;AAAiD;AAC/C;;AAEE;AACF;AAEA;;;AAKE;AACF;;AAEA;AACA;;;;AASF;;AAGM;AACF;;AAEA;AACA;AACEC;AAAW;;AACX;AACF;;AAEA;;;AAGEA;AAAW;;AACb;AACF;AAIF;AAA6C;AAC3C;;AAGE;AACF;;AAGE;AACE;;AAEA;AACA;AACF;;;AAGIC;AACA;AACF;AACAC;AACA;AACF;;;AAGID;AACA;AACF;AACAC;AACA;AACF;;;AAGE;AACA;AACF;AACA;;AAGE;AACE;;AAEE;AACF;AACAD;AACF;;;AAWA;AACA;AAGJ;;AAGF;AAEIE;;AAEI;AACF;;;;AAIFC;AACAC;AACA;AACA;AACA;AACAC;AAA0B;;AAIxBH;AACAR;AACAY;AACAC;AACE;;AAEE;AACF;;AAIAP;;;AAG0C;AAE/BQ;AAEGC;AAAY;AAEVA;;AACjB;AAICC;AACA;AAGAR;AACAR;AACAF;AAAqBgB;AAER;;;;;AAGTE;AAEAN;;AAEA;AACAF;;;AAGA;AAAA;AACAS;AACE;AACE;AACF;AACAC;AACEC;AACF;;;AAEa;;;;AAOb;AACE;AACF;AAEAC;;AACAN;AAEI;;AAER;AAEL;AAGP;AAEA;;"}
@@ -1,39 +0,0 @@
1
- "use client";
2
- import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
3
- import styled, { css } from 'styled-components';
4
- import { ellipsis, contents300, contents200, contents000, bg200, bg300, bg100 } from '@remember-web/mixin';
5
- import { SelectContainer } from '../styles.js';
6
-
7
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
8
- var StyledSelect = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n ", "\n border: 1px solid ", ";\n ", ";\n\n padding: 10px 36px 10px 12px;\n transition: border-color 0.2s, background-color 0.2s;\n\n ", "\n\n ", ":focus-within & {\n outline: none;\n border-color: ", ";\n }\n ", ":not([aria-disabled='true']) & {\n @media (hover: hover) {\n &:hover {\n background-color: ", ";\n }\n }\n\n &:active {\n background-color: ", ";\n }\n }\n"])), ellipsis(), contents300, function (_ref) {
9
- var expandedDirection = _ref.expandedDirection;
10
- return {
11
- none: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n border-radius: 4px;\n "]))),
12
- above: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n border-radius: 0 0 4px 4px;\n border-top-color: transparent;\n "]))),
13
- below: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n border-radius: 4px 4px 0 0;\n border-bottom-color: transparent;\n "])))
14
- }[expandedDirection !== null && expandedDirection !== void 0 ? expandedDirection : 'none'];
15
- }, function (_ref2) {
16
- var isPlaceholder = _ref2.isPlaceholder;
17
- return isPlaceholder && css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n color: ", ";\n "])), contents200);
18
- }, SelectContainer, contents000, SelectContainer, bg200, bg300);
19
- var SelectDownIcon = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n position: absolute;\n right: 12px;\n top: 50%;\n transform: translateY(-50%);\n\n & > svg {\n display: block;\n }\n\n pointer-events: none;\n"])));
20
- var SelectOptionWrapper = styled.ul(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n all: unset;\n position: absolute;\n left: 0;\n right: 0;\n z-index: 1;\n border: 1px solid ", ";\n background-color: ", ";\n overflow-y: scroll;\n overscroll-behavior: contain;\n transition: border-color 0.2s, background-color 0.2s;\n\n ", ";\n\n ", "\n\n ", ":focus &, ", ":focus-within & {\n outline: none;\n border-color: ", ";\n }\n"])), contents300, bg100, function (_ref3) {
21
- var maxHeight = _ref3.maxHeight;
22
- if (!maxHeight) {
23
- return null;
24
- }
25
- if (typeof maxHeight === 'number') {
26
- return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n max-height: ", "px;\n "])), maxHeight);
27
- }
28
- return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n max-height: ", ";\n "])), maxHeight);
29
- }, function (_ref4) {
30
- var expandedDirection = _ref4.expandedDirection;
31
- return expandedDirection === 'below' ? css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n top: calc(100% - 1px);\n border-top: none;\n border-radius: 0 0 4px 4px;\n "]))) : css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n bottom: calc(100% - 1px);\n border-bottom: none;\n border-radius: 4px 4px 0 0;\n "])));
32
- }, SelectContainer, SelectContainer, contents000);
33
- var SelectOption = styled.li(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n ", "\n padding: 10px 12px;\n color: ", ";\n\n &[aria-disabled='true'] {\n color: ", ";\n }\n\n &:focus {\n background-color: ", ";\n outline: none;\n }\n\n ", "\n"])), ellipsis(), contents000, contents300, bg200, function (_ref5) {
34
- var isSelected = _ref5.isSelected;
35
- return isSelected && css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n background-color: ", ";\n "])), bg200);
36
- });
37
-
38
- export { SelectDownIcon, SelectOption, SelectOptionWrapper, StyledSelect };
39
- //# sourceMappingURL=styles.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"styles.js","sources":["../../../../../../src/Inputs/Select/DesignedSelect/styles.ts"],"sourcesContent":["'use client';\n\nimport styled, { css } from 'styled-components';\nimport {\n bg100,\n bg200,\n bg300,\n contents000,\n contents200,\n contents300,\n ellipsis,\n} from '@remember-web/mixin';\n\nimport { SelectContainer } from '../styles';\nimport type { ExpandedType } from './types';\n\nexport const StyledSelect = styled.div<{\n expandedDirection?: ExpandedType;\n isPlaceholder?: boolean;\n}>`\n ${ellipsis()}\n border: 1px solid ${contents300};\n ${({ expandedDirection }) =>\n ({\n none: css`\n border-radius: 4px;\n `,\n above: css`\n border-radius: 0 0 4px 4px;\n border-top-color: transparent;\n `,\n below: css`\n border-radius: 4px 4px 0 0;\n border-bottom-color: transparent;\n `,\n }[expandedDirection ?? 'none'])};\n\n padding: 10px 36px 10px 12px;\n transition: border-color 0.2s, background-color 0.2s;\n\n ${({ isPlaceholder }) =>\n isPlaceholder &&\n css`\n color: ${contents200};\n `}\n\n ${SelectContainer}:focus-within & {\n outline: none;\n border-color: ${contents000};\n }\n ${SelectContainer}:not([aria-disabled='true']) & {\n @media (hover: hover) {\n &:hover {\n background-color: ${bg200};\n }\n }\n\n &:active {\n background-color: ${bg300};\n }\n }\n`;\n\nexport const SelectDownIcon = styled.div`\n position: absolute;\n right: 12px;\n top: 50%;\n transform: translateY(-50%);\n\n & > svg {\n display: block;\n }\n\n pointer-events: none;\n`;\n\nexport const SelectOptionWrapper = styled.ul<{\n expandedDirection?: ExpandedType;\n maxHeight?: number | string;\n}>`\n all: unset;\n position: absolute;\n left: 0;\n right: 0;\n z-index: 1;\n border: 1px solid ${contents300};\n background-color: ${bg100};\n overflow-y: scroll;\n overscroll-behavior: contain;\n transition: border-color 0.2s, background-color 0.2s;\n\n ${({ maxHeight }) => {\n if (!maxHeight) {\n return null;\n }\n\n if (typeof maxHeight === 'number') {\n return css`\n max-height: ${maxHeight}px;\n `;\n }\n\n return css`\n max-height: ${maxHeight};\n `;\n }};\n\n ${({ expandedDirection }) =>\n expandedDirection === 'below'\n ? css`\n top: calc(100% - 1px);\n border-top: none;\n border-radius: 0 0 4px 4px;\n `\n : css`\n bottom: calc(100% - 1px);\n border-bottom: none;\n border-radius: 4px 4px 0 0;\n `}\n\n ${SelectContainer}:focus &, ${SelectContainer}:focus-within & {\n outline: none;\n border-color: ${contents000};\n }\n`;\n\nexport const SelectOption = styled.li<{ isSelected?: boolean }>`\n ${ellipsis()}\n padding: 10px 12px;\n color: ${contents000};\n\n &[aria-disabled='true'] {\n color: ${contents300};\n }\n\n &:focus {\n background-color: ${bg200};\n outline: none;\n }\n\n ${({ isSelected }) =>\n isSelected &&\n css`\n background-color: ${bg200};\n `}\n`;\n"],"names":["below","SelectDownIcon"],"mappings":";;;;;;AAAa;AAgBN;AAMH;;;;AASEA;;AAI4B;AAK9B;;AAIC;AAmBQC;;AA4BU;;AAEjB;AACF;AAEA;;AAIA;;AAKF;AAEE;AAAoB;AAWf;AAQF;AAcH;;AAIC;;"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sources":["../../../../../../../src/Inputs/Select/NativeSelect/Option/index.tsx"],"sourcesContent":["'use client';\n\nimport type { OptionProps, SelectValue } from '../../types';\n\nexport const NativeOption = <Value extends SelectValue = string>({\n children,\n disabled,\n value,\n}: OptionProps<Value>) => (\n <option value={value} disabled={disabled}>\n {String(children)}\n </option>\n);\n"],"names":["value","disabled"],"mappings":";;;;AAIyB;;;AAGlB;AAEGA;AAAcC;;AACH;AACV;;"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sources":["../../../../../../src/Inputs/Select/NativeSelect/index.tsx"],"sourcesContent":["'use client';\n\nimport type { ForwardRefRenderFunction } from 'react';\nimport { forwardRef } from 'react';\n\nimport { IconArrow2Down } from '@remember-web/icon';\n\nimport { SelectDownIcon, StyledSelect } from './styles';\nimport type { NativeSelectInternalProps } from './types';\nimport { SelectContainer } from '../styles';\n\nconst NativeSelect: ForwardRefRenderFunction<\n HTMLSelectElement,\n NativeSelectInternalProps\n> = (\n { children, className, width, placeholder, value, disabled, ...props },\n ref\n) => {\n const showPlaceholder = !value && !!placeholder;\n\n return (\n <SelectContainer aria-disabled={disabled} className={className}>\n <StyledSelect\n {...props}\n value={value}\n $width={width}\n ref={ref}\n isPlaceholder={showPlaceholder}\n disabled={disabled}\n >\n {!value && (\n <option value=\"\" selected>\n {placeholder || 'ㅤ'}\n </option>\n )}\n {children}\n </StyledSelect>\n <SelectDownIcon>\n <IconArrow2Down size=\"small\" />\n </SelectDownIcon>\n </SelectContainer>\n );\n};\n\nexport default forwardRef(NativeSelect);\n"],"names":["props","className","value","$width","ref","isPlaceholder","disabled","children","size"],"mappings":";;;;;;;;;AAAa;AAAA;AAAA;AAWb;AAMK;;;;;;AAF4DA;AAG/D;;AAGmB;AAAyBC;;AAGtCC;AACAC;AACAC;AACAC;AACAC;AAAmBC;AAGTL;;;;AAID;;AAGOM;;AAAe;AAChB;AAGvB;AAEA;;"}
@@ -1,23 +0,0 @@
1
- "use client";
2
- import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
3
- import styled, { css } from 'styled-components';
4
- import { getTypographyStyles, contents300, contents200, contents000, bg200, bg300 } from '@remember-web/mixin';
5
-
6
- var _templateObject, _templateObject2, _templateObject3;
7
- var StyledSelect = styled.select(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n all: unset;\n\n ", "\n border: 1px solid ", ";\n border-radius: 4px;\n padding: 10px 36px 10px 12px;\n box-sizing: border-box;\n\n ", "\n\n width: ", ";\n\n transition: border-color 0.2s, background-color 0.2s;\n\n &:focus {\n border-color: ", ";\n }\n\n &:not(:disabled) {\n @media (hover: hover) {\n &:hover {\n background-color: ", ";\n }\n }\n\n &:active {\n background-color: ", ";\n }\n }\n"])), getTypographyStyles('Body1_M'), contents300, function (_ref) {
8
- var isPlaceholder = _ref.isPlaceholder;
9
- return isPlaceholder && css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n color: ", ";\n "])), contents200);
10
- }, function (_ref2) {
11
- var $width = _ref2.$width;
12
- if (!$width) {
13
- return null;
14
- }
15
- if (typeof $width === 'number') {
16
- return "".concat($width, "px");
17
- }
18
- return $width;
19
- }, contents000, bg200, bg300);
20
- var SelectDownIcon = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n position: absolute;\n right: 12px;\n top: 50%;\n transform: translateY(-50%);\n\n & > svg {\n display: block;\n }\n\n pointer-events: none;\n"])));
21
-
22
- export { SelectDownIcon, StyledSelect };
23
- //# sourceMappingURL=styles.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"styles.js","sources":["../../../../../../src/Inputs/Select/NativeSelect/styles.ts"],"sourcesContent":["'use client';\n\nimport styled, { css } from 'styled-components';\nimport {\n bg200,\n bg300,\n contents000,\n contents200,\n contents300,\n getTypographyStyles,\n} from '@remember-web/mixin';\n\nexport const StyledSelect = styled.select<{\n $width?: number | string;\n isPlaceholder?: boolean;\n}>`\n all: unset;\n\n ${getTypographyStyles('Body1_M')}\n border: 1px solid ${contents300};\n border-radius: 4px;\n padding: 10px 36px 10px 12px;\n box-sizing: border-box;\n\n ${({ isPlaceholder }) =>\n isPlaceholder &&\n css`\n color: ${contents200};\n `}\n\n width: ${({ $width }) => {\n if (!$width) {\n return null;\n }\n\n if (typeof $width === 'number') {\n return `${$width}px`;\n }\n\n return $width;\n }};\n\n transition: border-color 0.2s, background-color 0.2s;\n\n &:focus {\n border-color: ${contents000};\n }\n\n &:not(:disabled) {\n @media (hover: hover) {\n &:hover {\n background-color: ${bg200};\n }\n }\n\n &:active {\n background-color: ${bg300};\n }\n }\n`;\nexport const SelectDownIcon = styled.div`\n position: absolute;\n right: 12px;\n top: 50%;\n transform: translateY(-50%);\n\n & > svg {\n display: block;\n }\n\n pointer-events: none;\n`;\n"],"names":["SelectDownIcon"],"mappings":";;;;;AAAa;AAYN;AAYH;;AAIC;AAEsB;;AAErB;AACF;AAEA;;AAEA;AAEA;AACF;AAoBWA;;"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sources":["../../../../../../src/Inputs/Select/Option/index.tsx"],"sourcesContent":["'use client';\n\nimport type { OptionProps, SelectValue } from '../types';\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nexport const OptionHolder = <T extends SelectValue>(props: OptionProps<T>) =>\n null;\n\nOptionHolder.displayName = 'Select.Option';\n"],"names":["OptionHolder"],"mappings":";AAIA;;AACyE;AACnE;AAENA;;"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sources":["../../../../../src/Inputs/Select/index.tsx"],"sourcesContent":["'use client';\n\nimport type { Ref, RefAttributes } from 'react';\nimport { Children, forwardRef } from 'react';\n\nimport DesignedSelect from './DesignedSelect';\nimport NativeSelect from './NativeSelect';\nimport { NativeOption } from './NativeSelect/Option';\nimport { OptionHolder } from './Option';\nimport { SelectLabel } from './styles';\nimport type {\n DesignedSelectProps,\n NativeSelectProps,\n SelectProps,\n SelectValue,\n} from './types';\n\nfunction Select<Value extends SelectValue>(\n props: SelectProps<Value>,\n ref: Ref<HTMLDivElement | HTMLSelectElement>\n) {\n const {\n children,\n label,\n value,\n className,\n disabled,\n onChange,\n placeholder,\n width,\n required,\n } = props;\n\n if (props.native) {\n return (\n <div>\n {label && (\n <SelectLabel>\n {label}\n {required && <mark>*</mark>}\n </SelectLabel>\n )}\n <NativeSelect\n disabled={disabled}\n className={className}\n onChange={(e) => {\n onChange?.(e.target.value as Value, e.target.innerText);\n }}\n value={value}\n required={required}\n placeholder={placeholder}\n width={width}\n ref={ref as Ref<HTMLSelectElement>}\n >\n {Children.map(children, (child) => (\n <NativeOption {...child.props} />\n ))}\n </NativeSelect>\n </div>\n );\n }\n\n return (\n <div>\n {label && (\n <SelectLabel>\n {label}\n {required && <mark>*</mark>}\n </SelectLabel>\n )}\n <DesignedSelect\n className={className}\n value={value}\n disabled={disabled}\n onChange={(_value, _label) => onChange?.(_value as Value, _label)}\n placeholder={placeholder}\n width={width}\n maxHeight={props.maxHeight}\n extendDirection={props.extendDirection}\n ref={ref as Ref<HTMLDivElement>}\n >\n {children}\n </DesignedSelect>\n </div>\n );\n}\n\nexport default Object.assign(\n forwardRef(Select) as <Value extends SelectValue>(\n props:\n | (DesignedSelectProps<Value> & RefAttributes<HTMLDivElement>)\n | (NativeSelectProps<Value> & RefAttributes<HTMLSelectElement>)\n ) => JSX.Element,\n { Option: OptionHolder }\n);\n"],"names":["children","disabled","className","onChange","value","required","placeholder","width","ref","Option"],"mappings":";;;;;;;;;;AAAa;AAAA;AAiBb;AAIE;;;;;;;;;;AAaE;AACEA;AAEgBA;AAEGA;AAAO;AAAO;AAI7BC;AACAC;AACAC;AACEA;;AAEFC;AACAC;AACAC;AACAC;AACAC;;;;AAIE;AACW;AAGrB;AAEA;AACER;AAEgBA;AAEGA;AAAO;AAAO;AAI7BE;AACAE;AACAH;AACAE;;;AACAG;AACAC;;;AAGAC;AAAgCR;AAEvB;AACM;AAGvB;AAEA;AAMIS;AAAqB;;"}
@@ -1,20 +0,0 @@
1
- "use client";
2
- import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
3
- import styled from 'styled-components';
4
- import { getTypographyStyles, contents000, contents200, contents300, bg200, roleRed } from '@remember-web/mixin';
5
-
6
- var _templateObject, _templateObject2;
7
- var SelectContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n ", "\n color: ", ";\n width: ", ";\n position: relative;\n user-select: none;\n\n &:focus {\n outline: none;\n border-color: ", ";\n }\n &[aria-disabled='true'] {\n color: ", ";\n border-color: ", ";\n background-color: ", ";\n }\n"])), getTypographyStyles('Body1_M'), contents000, function (_ref) {
8
- var $width = _ref.$width;
9
- if (!$width) {
10
- return 'fit-content';
11
- }
12
- if (typeof $width === 'number') {
13
- return "".concat($width, "px");
14
- }
15
- return $width;
16
- }, contents000, contents200, contents300, bg200);
17
- var SelectLabel = styled.label(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n ", "\n display: block;\n margin-bottom: 12px;\n display: flex;\n align-items: center;\n gap: 4px;\n\n & > mark {\n all: unset;\n color: ", ";\n }\n"])), getTypographyStyles('Headline4_B'), roleRed);
18
-
19
- export { SelectContainer, SelectLabel };
20
- //# sourceMappingURL=styles.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"styles.js","sources":["../../../../../src/Inputs/Select/styles.ts"],"sourcesContent":["'use client';\n\nimport styled from 'styled-components';\nimport {\n bg200,\n contents000,\n contents200,\n contents300,\n getTypographyStyles,\n roleRed,\n} from '@remember-web/mixin';\n\nexport const SelectContainer = styled.div<{ $width?: number | string }>`\n ${getTypographyStyles('Body1_M')}\n color: ${contents000};\n width: ${({ $width }) => {\n if (!$width) {\n return 'fit-content';\n }\n\n if (typeof $width === 'number') {\n return `${$width}px`;\n }\n\n return $width;\n }};\n position: relative;\n user-select: none;\n\n &:focus {\n outline: none;\n border-color: ${contents000};\n }\n &[aria-disabled='true'] {\n color: ${contents200};\n border-color: ${contents300};\n background-color: ${bg200};\n }\n`;\n\nexport const SelectLabel = styled.label`\n ${getTypographyStyles('Headline4_B')}\n display: block;\n margin-bottom: 12px;\n display: flex;\n align-items: center;\n gap: 4px;\n\n & > mark {\n all: unset;\n color: ${roleRed};\n }\n`;\n"],"names":[],"mappings":";;;;;AAAa;AAYN;AAGoB;;AAErB;AACF;AAEA;;AAEA;AAEA;AACF;;;"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"utils.js","sources":["../../../../../src/Inputs/Select/utils.ts"],"sourcesContent":["// focus된 요소의 sibling을 찾아서 focus\nexport function focusSibling<E extends HTMLElement>(\n currentFocusedElement: E,\n siblingDirection: 'previous' | 'next'\n) {\n if (currentFocusedElement?.matches('[data-option-value]')) {\n const siblingElement = getSiblingElement(\n currentFocusedElement,\n siblingDirection\n );\n const listElement = currentFocusedElement.parentElement;\n if (\n listElement &&\n siblingElement?.matches('[data-option-value]') &&\n checkSameElementType(currentFocusedElement, siblingElement)\n ) {\n siblingElement.focus({ preventScroll: true });\n // 방향키를 통해 넘어가는 스크롤 방향에 따라 scrollIntoView의 block을 다르게 설정\n if (\n {\n // 아래 요소를 선택할 때 스크롤이 아래로 내려가는 경우\n next:\n siblingElement.offsetTop >=\n (siblingElement.parentElement?.scrollTop ?? 0) +\n listElement.clientHeight,\n\n // 위 요소를 선택할 때 스크롤이 위로 올라가는 경우\n previous:\n siblingElement.offsetTop <=\n (siblingElement.parentElement?.scrollTop ?? 0),\n }[siblingDirection]\n ) {\n siblingElement.scrollIntoView({\n block: siblingDirection === 'previous' ? 'start' : 'end',\n });\n }\n }\n }\n}\n\nconst checkSameElementType = <E extends Element>(\n element1: E,\n element2: Element\n): element2 is E => element2 instanceof element1.constructor;\n\n// 재귀적으로 disabled되지 않은 sibling을 찾아서 반환\nfunction getSiblingElement<E extends Element>(\n target: E,\n siblingDirection: 'previous' | 'next'\n): E | null {\n const siblingElement = target[`${siblingDirection}ElementSibling`];\n if (\n !siblingElement ||\n !checkSameElementType(target, siblingElement) ||\n !siblingElement.matches('[data-option-value]')\n ) {\n return null;\n }\n\n if (siblingElement.matches('[aria-disabled=\"true\"]')) {\n return getSiblingElement(siblingElement, siblingDirection);\n }\n\n return siblingElement;\n}\n"],"names":["focusSibling","currentFocusedElement","siblingDirection","matches","siblingElement","getSiblingElement","listElement","parentElement","checkSameElementType","_siblingElement$paren","_siblingElement$paren2","_siblingElement$paren3","_siblingElement$paren4","focus","preventScroll","next","offsetTop","scrollTop","clientHeight","previous","scrollIntoView","block","element1","element2","constructor","target","concat"],"mappings":"AAAA;AACO,SAASA,YAAYA,CAC1BC,qBAAwB,EACxBC,gBAAqC,EACrC;EACA,IAAID,qBAAqB,KAArBA,IAAAA,IAAAA,qBAAqB,KAArBA,KAAAA,CAAAA,IAAAA,qBAAqB,CAAEE,OAAO,CAAC,qBAAqB,CAAC,EAAE;AACzD,IAAA,IAAMC,cAAc,GAAGC,iBAAiB,CACtCJ,qBAAqB,EACrBC,gBACF,CAAC,CAAA;AACD,IAAA,IAAMI,WAAW,GAAGL,qBAAqB,CAACM,aAAa,CAAA;AACvD,IAAA,IACED,WAAW,IACXF,cAAc,aAAdA,cAAc,KAAA,KAAA,CAAA,IAAdA,cAAc,CAAED,OAAO,CAAC,qBAAqB,CAAC,IAC9CK,oBAAoB,CAACP,qBAAqB,EAAEG,cAAc,CAAC,EAC3D;AAAA,MAAA,IAAAK,qBAAA,EAAAC,sBAAA,EAAAC,sBAAA,EAAAC,sBAAA,CAAA;MACAR,cAAc,CAACS,KAAK,CAAC;AAAEC,QAAAA,aAAa,EAAE,IAAA;AAAK,OAAC,CAAC,CAAA;AAC7C;MACA,IACE;AACE;AACAC,QAAAA,IAAI,EACFX,cAAc,CAACY,SAAS,IACxB,CAAA,CAAAP,qBAAA,GAAA,CAAAC,sBAAA,GAACN,cAAc,CAACG,aAAa,MAAA,IAAA,IAAAG,sBAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAA5BA,sBAAA,CAA8BO,SAAS,MAAA,IAAA,IAAAR,qBAAA,KAAA,KAAA,CAAA,GAAAA,qBAAA,GAAI,CAAC,IAC3CH,WAAW,CAACY,YAAY;AAE5B;QACAC,QAAQ,EACNf,cAAc,CAACY,SAAS,MAAAL,sBAAA,GAAA,CAAAC,sBAAA,GACvBR,cAAc,CAACG,aAAa,MAAAK,IAAAA,IAAAA,sBAAA,KAA5BA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,sBAAA,CAA8BK,SAAS,cAAAN,sBAAA,KAAA,KAAA,CAAA,GAAAA,sBAAA,GAAI,CAAC,CAAA;OAChD,CAACT,gBAAgB,CAAC,EACnB;QACAE,cAAc,CAACgB,cAAc,CAAC;AAC5BC,UAAAA,KAAK,EAAEnB,gBAAgB,KAAK,UAAU,GAAG,OAAO,GAAG,KAAA;AACrD,SAAC,CAAC,CAAA;AACJ,OAAA;AACF,KAAA;AACF,GAAA;AACF,CAAA;AAEA,IAAMM,oBAAoB,GAAG,SAAvBA,oBAAoBA,CACxBc,QAAW,EACXC,QAAiB,EAAA;AAAA,EAAA,OACCA,QAAQ,YAAYD,QAAQ,CAACE,WAAW,CAAA;AAAA,CAAA,CAAA;;AAE5D;AACA,SAASnB,iBAAiBA,CACxBoB,MAAS,EACTvB,gBAAqC,EAC3B;AACV,EAAA,IAAME,cAAc,GAAGqB,MAAM,IAAAC,MAAA,CAAIxB,gBAAgB,EAAiB,gBAAA,CAAA,CAAA,CAAA;AAClE,EAAA,IACE,CAACE,cAAc,IACf,CAACI,oBAAoB,CAACiB,MAAM,EAAErB,cAAc,CAAC,IAC7C,CAACA,cAAc,CAACD,OAAO,CAAC,qBAAqB,CAAC,EAC9C;AACA,IAAA,OAAO,IAAI,CAAA;AACb,GAAA;AAEA,EAAA,IAAIC,cAAc,CAACD,OAAO,CAAC,wBAAwB,CAAC,EAAE;AACpD,IAAA,OAAOE,iBAAiB,CAACD,cAAc,EAAEF,gBAAgB,CAAC,CAAA;AAC5D,GAAA;AAEA,EAAA,OAAOE,cAAc,CAAA;AACvB;;;;"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sources":["../../../../../src/Inputs/TextInput/index.tsx"],"sourcesContent":["'use client';\n\nimport type { ForwardRefRenderFunction } from 'react';\nimport { forwardRef, useId, useState } from 'react';\n\nimport { IconHidden, IconVisible } from '@remember-web/icon';\n\nimport {\n InputContainer,\n InputDecorator,\n InputError,\n InputHintText,\n InputInner,\n InputLabel,\n InputTogglePasswordVisibilityButton,\n InputWrapper,\n} from './styles';\nimport type { InputProps } from './types';\n\nconst TextInput: ForwardRefRenderFunction<HTMLInputElement, InputProps> = (\n {\n className,\n label,\n leftElement,\n rightElement,\n disabled,\n hintText,\n hintTextColor,\n errorMessage,\n width,\n ...props\n },\n ref\n) => {\n const inputId = useId();\n const labelId = useId();\n const [isVisiblePassword, setIsVisiblePassword] = useState(false);\n const isForceVisibleInput =\n props.type === 'password' &&\n props.hasTogglePasswordVisibilityButton &&\n isVisiblePassword;\n\n return (\n <InputWrapper $width={width}>\n {label && (\n <InputLabel id={labelId} htmlFor={inputId}>\n {label}\n {props.required && <mark>*</mark>}\n </InputLabel>\n )}\n <InputContainer\n disabled={disabled}\n hasError={!!errorMessage}\n className={className}\n >\n {leftElement && <InputDecorator>{leftElement}</InputDecorator>}\n <InputInner\n disabled={disabled}\n id={inputId}\n aria-labelledby={label ? labelId : undefined}\n {...props}\n type={isForceVisibleInput ? 'text' : props.type || 'text'}\n ref={ref}\n />\n {hintText && (\n <InputHintText textColor={hintTextColor}>{hintText}</InputHintText>\n )}\n {props.type === 'password' &&\n props.hasTogglePasswordVisibilityButton && (\n <TogglePasswordVisibilityButton\n value={isVisiblePassword}\n onChange={setIsVisiblePassword}\n />\n )}\n {rightElement && <InputDecorator>{rightElement}</InputDecorator>}\n </InputContainer>\n {errorMessage && <InputError>{errorMessage}</InputError>}\n </InputWrapper>\n );\n};\n\nconst TogglePasswordVisibilityButton = ({\n value,\n onChange,\n}: {\n value: boolean;\n onChange: (value: boolean) => void;\n}) => (\n <InputTogglePasswordVisibilityButton\n type=\"button\"\n role=\"switch\"\n aria-checked={value ? 'true' : 'false'}\n aria-label=\"비밀번호 표시\"\n onClick={() => {\n onChange(!value);\n }}\n >\n {value ? <IconHidden size=\"small\" /> : <IconVisible size=\"small\" />}\n </InputTogglePasswordVisibilityButton>\n);\n\nexport default forwardRef(TextInput);\n"],"names":["props","isVisiblePassword","setIsVisiblePassword","$width","children","id","htmlFor","disabled","className","ref","textColor","value","onChange","type","role","size"],"mappings":";;;;;;;;;AAAa;AAAA;AAAA;AAmBb;AAcK;;;;;;;;;AAHEA;AAIL;AACA;AACA;;AAAOC;AAAmBC;AAC1B;;AAMgBC;AAAcC;AAEZC;AAAaC;AAAiBF;AAErBA;AAAO;AAAO;AAInCG;;AAEAC;AAAqBJ;AAEUA;;AAE7BG;AACAF;;AAC6C;;AAG7CI;AAAS;AAGMC;AAAyBN;AAAU;AAK9CO;AACAC;AAA+B;AAGLR;AAAc;AAAkB;AAEtCA;AAAc;AAAc;AAG9D;AAEA;AAAoC;;;AAQhCS;AACAC;AACA;AACA;;;;AAGEV;AAEmBW;AAAY;AAAmBA;;AAAe;AAC/B;AAGxC;;"}
@@ -1,28 +0,0 @@
1
- "use client";
2
- import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
3
- import styled, { css } from 'styled-components';
4
- import { contents300, roleRed, contents000, bg200, getTypographyStyles, ellipsis, contents200 } from '@remember-web/mixin';
5
- import { formatUnit } from '../../../../shared/utils/style.js';
6
-
7
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12;
8
- var InputWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n ", ";\n"])), function (_ref) {
9
- var $width = _ref.$width;
10
- return $width && css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n width: ", ";\n "])), formatUnit($width));
11
- });
12
- var InputContainer = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n border: 1px solid ", ";\n border-radius: 4px;\n padding: 0 12px;\n gap: 8px;\n\n transition: border-color 0.2s, background-color 0.2s;\n\n ", "\n"])), contents300, function (_ref2) {
13
- var hasError = _ref2.hasError,
14
- disabled = _ref2.disabled;
15
- return [hasError ? css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n border-color: ", ";\n "])), roleRed) : css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n &:focus-within {\n border-color: ", ";\n }\n "])), contents000), disabled && css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n background-color: ", ";\n "])), bg200)];
16
- });
17
- var InputDecorator = styled.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n flex-shrink: 0;\n /* Inline\uC694\uC18C\uAC00 \uB4E4\uC5B4\uC624\uBA74 \uAC15\uC81C\uB85C block\uC73C\uB85C \uCC98\uB9AC (\uC911\uC559\uC815\uB82C\uC744 \uC704\uD574) */\n > * {\n display: block;\n }\n"])));
18
- var InputInner = styled.input(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n ", "\n color: ", ";\n\n display: block;\n flex-grow: 1;\n width: 100%;\n padding: 10px 0;\n border: 0;\n background-color: transparent;\n\n &:placeholder-shown {\n ", "\n }\n\n &::placeholder {\n color: ", ";\n }\n\n &:focus {\n outline: none;\n }\n"])), getTypographyStyles('Body1_M'), contents000, ellipsis(), contents200);
19
- var InputLabel = styled.label(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n ", "\n display: block;\n margin-bottom: 12px;\n display: flex;\n align-items: center;\n gap: 4px;\n\n & > mark {\n all: unset;\n color: ", ";\n }\n"])), getTypographyStyles('Headline4_B'), roleRed);
20
- var InputError = styled.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n ", "\n color: ", ";\n\n margin-top: 8px;\n"])), getTypographyStyles('Body2_M'), roleRed);
21
- var InputHintText = styled.span(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n ", "\n color: ", ";\n white-space: nowrap;\n"])), getTypographyStyles('Body1_M'), function (_ref3) {
22
- var textColor = _ref3.textColor;
23
- return textColor;
24
- });
25
- var InputTogglePasswordVisibilityButton = styled.button(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n all: unset;\n appearance: none;\n cursor: pointer;\n flex-shrink: 0;\n\n & > svg {\n display: block;\n }\n"])));
26
-
27
- export { InputContainer, InputDecorator, InputError, InputHintText, InputInner, InputLabel, InputTogglePasswordVisibilityButton, InputWrapper };
28
- //# sourceMappingURL=styles.js.map