se-design 0.0.111 → 0.0.113

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 (268) hide show
  1. package/dist/assets/icons/edit-text.svg +3 -0
  2. package/dist/assets/icons/fields-create.svg +3 -0
  3. package/dist/assets/icons/fields-panel.svg +3 -0
  4. package/dist/assets/icons/fill-and-sign.svg +10 -0
  5. package/dist/assets/icons/image-field.svg +19 -0
  6. package/dist/assets/icons/reset.svg +3 -0
  7. package/dist/assets/icons/rotate-left.svg +3 -0
  8. package/dist/assets/icons/rotate-right.svg +3 -0
  9. package/dist/assets/icons/success-check.svg +12 -0
  10. package/dist/assets/style.css +1 -1
  11. package/dist/components/Banner/index.d.ts +4 -0
  12. package/dist/components/Button/index.d.ts +1 -1
  13. package/dist/components/CustomAccordion/index.d.ts +2 -0
  14. package/dist/components/Dropdown/index.d.ts +2 -0
  15. package/dist/components/Icon/index.d.ts +1 -0
  16. package/dist/components/LabelChip/index.d.ts +1 -0
  17. package/dist/components/NavigationBar/index.d.ts +14 -0
  18. package/dist/components/Popover/index.d.ts +1 -0
  19. package/dist/components/SearchBox/index.d.ts +13 -0
  20. package/dist/components/Tabs/index.d.ts +1 -0
  21. package/dist/components/ToastBar/index.d.ts +4 -3
  22. package/dist/components/index.d.ts +2 -0
  23. package/dist/index.js +37 -33
  24. package/dist/index.js.map +1 -1
  25. package/dist/index100.js +1 -1
  26. package/dist/index100.js.map +1 -1
  27. package/dist/index101.js +2 -2
  28. package/dist/index101.js.map +1 -1
  29. package/dist/index102.js +2 -149
  30. package/dist/index102.js.map +1 -1
  31. package/dist/index103.js +5 -0
  32. package/dist/index103.js.map +1 -0
  33. package/dist/index104.js +5 -0
  34. package/dist/index104.js.map +1 -0
  35. package/dist/index105.js +5 -0
  36. package/dist/index105.js.map +1 -0
  37. package/dist/index106.js +5 -0
  38. package/dist/index106.js.map +1 -0
  39. package/dist/index107.js +5 -0
  40. package/dist/index107.js.map +1 -0
  41. package/dist/index108.js +5 -0
  42. package/dist/index108.js.map +1 -0
  43. package/dist/index109.js +5 -0
  44. package/dist/index109.js.map +1 -0
  45. package/dist/index110.js +5 -0
  46. package/dist/index110.js.map +1 -0
  47. package/dist/index111.js +5 -0
  48. package/dist/index111.js.map +1 -0
  49. package/dist/index112.js +5 -0
  50. package/dist/index112.js.map +1 -0
  51. package/dist/index113.js +152 -0
  52. package/dist/index113.js.map +1 -0
  53. package/dist/index124.js +11 -5
  54. package/dist/index124.js.map +1 -1
  55. package/dist/index132.js +1232 -75
  56. package/dist/index132.js.map +1 -1
  57. package/dist/index133.js +9 -92
  58. package/dist/index133.js.map +1 -1
  59. package/dist/index134.js +8 -50
  60. package/dist/index134.js.map +1 -1
  61. package/dist/index135.js +4 -7
  62. package/dist/index135.js.map +1 -1
  63. package/dist/index136.js +170 -5
  64. package/dist/index136.js.map +1 -1
  65. package/dist/index137.js +11 -52
  66. package/dist/index137.js.map +1 -1
  67. package/dist/index138.js +6 -2
  68. package/dist/index138.js.map +1 -1
  69. package/dist/index139.js +6 -2
  70. package/dist/index139.js.map +1 -1
  71. package/dist/{index126.js → index140.js} +1 -1
  72. package/dist/{index126.js.map → index140.js.map} +1 -1
  73. package/dist/{index127.js → index141.js} +1 -1
  74. package/dist/index141.js.map +1 -0
  75. package/dist/index142.js +11 -0
  76. package/dist/{index128.js.map → index142.js.map} +1 -1
  77. package/dist/{index129.js → index143.js} +6 -6
  78. package/dist/{index129.js.map → index143.js.map} +1 -1
  79. package/dist/{index130.js → index144.js} +2 -2
  80. package/dist/{index130.js.map → index144.js.map} +1 -1
  81. package/dist/{index131.js → index145.js} +1 -1
  82. package/dist/index145.js.map +1 -0
  83. package/dist/index146.js +79 -0
  84. package/dist/index146.js.map +1 -0
  85. package/dist/index147.js +96 -0
  86. package/dist/index147.js.map +1 -0
  87. package/dist/index148.js +55 -0
  88. package/dist/index148.js.map +1 -0
  89. package/dist/index149.js +11 -0
  90. package/dist/index149.js.map +1 -0
  91. package/dist/index150.js +8 -0
  92. package/dist/index150.js.map +1 -0
  93. package/dist/index151.js +55 -0
  94. package/dist/index151.js.map +1 -0
  95. package/dist/index152.js +5 -0
  96. package/dist/index152.js.map +1 -0
  97. package/dist/index153.js +5 -0
  98. package/dist/index153.js.map +1 -0
  99. package/dist/index16.js +21 -19
  100. package/dist/index16.js.map +1 -1
  101. package/dist/index17.js +1 -1
  102. package/dist/index17.js.map +1 -1
  103. package/dist/index22.js +43 -37
  104. package/dist/index22.js.map +1 -1
  105. package/dist/index26.js +54 -22
  106. package/dist/index26.js.map +1 -1
  107. package/dist/index27.js +34 -22
  108. package/dist/index27.js.map +1 -1
  109. package/dist/index29.js +3 -3
  110. package/dist/index29.js.map +1 -1
  111. package/dist/index3.js +16 -15
  112. package/dist/index3.js.map +1 -1
  113. package/dist/index33.js +33 -23
  114. package/dist/index33.js.map +1 -1
  115. package/dist/index36.js +75 -31
  116. package/dist/index36.js.map +1 -1
  117. package/dist/index37.js +26 -44
  118. package/dist/index37.js.map +1 -1
  119. package/dist/index38.js +45 -64
  120. package/dist/index38.js.map +1 -1
  121. package/dist/index39.js +63 -46
  122. package/dist/index39.js.map +1 -1
  123. package/dist/index4.js +118 -94
  124. package/dist/index4.js.map +1 -1
  125. package/dist/index40.js +61 -69
  126. package/dist/index40.js.map +1 -1
  127. package/dist/index41.js +68 -81
  128. package/dist/index41.js.map +1 -1
  129. package/dist/index42.js +84 -35
  130. package/dist/index42.js.map +1 -1
  131. package/dist/index43.js +33 -24
  132. package/dist/index43.js.map +1 -1
  133. package/dist/index44.js +30 -2
  134. package/dist/index44.js.map +1 -1
  135. package/dist/index45.js +30 -2
  136. package/dist/index45.js.map +1 -1
  137. package/dist/index46.js +1 -1
  138. package/dist/index46.js.map +1 -1
  139. package/dist/index47.js +1 -1
  140. package/dist/index47.js.map +1 -1
  141. package/dist/index48.js +1 -1
  142. package/dist/index48.js.map +1 -1
  143. package/dist/index49.js +1 -1
  144. package/dist/index49.js.map +1 -1
  145. package/dist/index50.js +1 -1
  146. package/dist/index50.js.map +1 -1
  147. package/dist/index51.js +1 -1
  148. package/dist/index51.js.map +1 -1
  149. package/dist/index52.js +1 -1
  150. package/dist/index52.js.map +1 -1
  151. package/dist/index53.js +1 -1
  152. package/dist/index53.js.map +1 -1
  153. package/dist/index54.js +1 -1
  154. package/dist/index54.js.map +1 -1
  155. package/dist/index55.js +1 -1
  156. package/dist/index55.js.map +1 -1
  157. package/dist/index56.js +1 -1
  158. package/dist/index56.js.map +1 -1
  159. package/dist/index57.js +1 -1
  160. package/dist/index57.js.map +1 -1
  161. package/dist/index58.js +1 -1
  162. package/dist/index58.js.map +1 -1
  163. package/dist/index59.js +2 -2
  164. package/dist/index59.js.map +1 -1
  165. package/dist/index6.js +1 -1
  166. package/dist/index6.js.map +1 -1
  167. package/dist/index60.js +1 -1
  168. package/dist/index60.js.map +1 -1
  169. package/dist/index61.js +2 -2
  170. package/dist/index61.js.map +1 -1
  171. package/dist/index62.js +1 -1
  172. package/dist/index62.js.map +1 -1
  173. package/dist/index63.js +1 -1
  174. package/dist/index63.js.map +1 -1
  175. package/dist/index64.js +1 -1
  176. package/dist/index64.js.map +1 -1
  177. package/dist/index65.js +2 -2
  178. package/dist/index65.js.map +1 -1
  179. package/dist/index66.js +1 -1
  180. package/dist/index66.js.map +1 -1
  181. package/dist/index67.js +1 -1
  182. package/dist/index67.js.map +1 -1
  183. package/dist/index68.js +2 -2
  184. package/dist/index68.js.map +1 -1
  185. package/dist/index69.js +1 -1
  186. package/dist/index69.js.map +1 -1
  187. package/dist/index70.js +1 -1
  188. package/dist/index70.js.map +1 -1
  189. package/dist/index71.js +1 -1
  190. package/dist/index71.js.map +1 -1
  191. package/dist/index72.js +1 -1
  192. package/dist/index72.js.map +1 -1
  193. package/dist/index73.js +2 -2
  194. package/dist/index73.js.map +1 -1
  195. package/dist/index74.js +2 -2
  196. package/dist/index74.js.map +1 -1
  197. package/dist/index75.js +1 -1
  198. package/dist/index75.js.map +1 -1
  199. package/dist/index76.js +1 -1
  200. package/dist/index76.js.map +1 -1
  201. package/dist/index77.js +1 -1
  202. package/dist/index77.js.map +1 -1
  203. package/dist/index78.js +1 -1
  204. package/dist/index78.js.map +1 -1
  205. package/dist/index79.js +1 -1
  206. package/dist/index79.js.map +1 -1
  207. package/dist/index8.js +19 -20
  208. package/dist/index8.js.map +1 -1
  209. package/dist/index80.js +1 -1
  210. package/dist/index80.js.map +1 -1
  211. package/dist/index81.js +1 -1
  212. package/dist/index81.js.map +1 -1
  213. package/dist/index82.js +2 -2
  214. package/dist/index82.js.map +1 -1
  215. package/dist/index83.js +2 -2
  216. package/dist/index83.js.map +1 -1
  217. package/dist/index84.js +1 -1
  218. package/dist/index84.js.map +1 -1
  219. package/dist/index85.js +1 -1
  220. package/dist/index85.js.map +1 -1
  221. package/dist/index86.js +1 -1
  222. package/dist/index86.js.map +1 -1
  223. package/dist/index87.js +1 -1
  224. package/dist/index87.js.map +1 -1
  225. package/dist/index88.js +1 -1
  226. package/dist/index88.js.map +1 -1
  227. package/dist/index89.js +2 -2
  228. package/dist/index89.js.map +1 -1
  229. package/dist/index90.js +2 -2
  230. package/dist/index90.js.map +1 -1
  231. package/dist/index91.js +1 -1
  232. package/dist/index91.js.map +1 -1
  233. package/dist/index92.js +2 -2
  234. package/dist/index92.js.map +1 -1
  235. package/dist/index93.js +1 -1
  236. package/dist/index93.js.map +1 -1
  237. package/dist/index94.js +2 -2
  238. package/dist/index94.js.map +1 -1
  239. package/dist/index95.js +1 -1
  240. package/dist/index95.js.map +1 -1
  241. package/dist/index96.js +1 -1
  242. package/dist/index96.js.map +1 -1
  243. package/dist/index97.js +1 -1
  244. package/dist/index97.js.map +1 -1
  245. package/dist/index98.js +1 -1
  246. package/dist/index98.js.map +1 -1
  247. package/dist/index99.js +2 -2
  248. package/dist/index99.js.map +1 -1
  249. package/dist/typographyMixin.scss +60 -21
  250. package/package.json +1 -1
  251. package/dist/index118.js +0 -1236
  252. package/dist/index118.js.map +0 -1
  253. package/dist/index119.js +0 -13
  254. package/dist/index119.js.map +0 -1
  255. package/dist/index120.js +0 -13
  256. package/dist/index120.js.map +0 -1
  257. package/dist/index121.js +0 -8
  258. package/dist/index121.js.map +0 -1
  259. package/dist/index122.js +0 -173
  260. package/dist/index122.js.map +0 -1
  261. package/dist/index123.js +0 -14
  262. package/dist/index123.js.map +0 -1
  263. package/dist/index125.js +0 -9
  264. package/dist/index125.js.map +0 -1
  265. package/dist/index127.js.map +0 -1
  266. package/dist/index128.js +0 -11
  267. package/dist/index131.js.map +0 -1
  268. /package/dist/assets/icons/{down.svg → chevron-down.svg} +0 -0
@@ -1 +1 @@
1
- {"version":3,"file":"index26.js","sources":["../src/components/Tabs/index.tsx"],"sourcesContent":["import React, { FC, ReactNode, useState, useEffect } from 'react';\n\ninterface TabProps {\n label: string;\n id: string;\n disabled?: boolean;\n renderTabContent?: (tab: TabProps) => ReactNode;\n}\n\ninterface TabsProps {\n defaultActiveTab?: string;\n tabs: TabProps[];\n onTabChange?: (tabId: string) => void;\n}\n\nexport const Tabs: FC<TabsProps> = ({ defaultActiveTab, tabs, onTabChange }) => {\n const defaultTabId = defaultActiveTab || (tabs[0] ? tabs[0].id : '');\n const [activeTab, setActiveTab] = useState(defaultTabId);\n\n useEffect(() => {\n setActiveTab(defaultActiveTab || '');\n }, [defaultActiveTab]);\n\n const handleTabClick = (tab: TabProps) => {\n setActiveTab(tab?.id);\n onTabChange?.(tab?.id);\n };\n\n const isTabActive = (tab: TabProps, activeTab: string) => {\n return tab.id === activeTab;\n }\n\n return (\n <>\n <div className=\"se-design-tabs flex items-center gap-4\">\n {tabs.map((tab) => {\n const isActive = activeTab === tab.id;\n const isDisabled = tab.disabled;\n return (\n <div\n key={tab.label}\n onClick={() => !isDisabled && handleTabClick(tab)}\n className={`text-base ${\n isDisabled \n ? 'text-[var(--color-gray-400)] cursor-not-allowed'\n : isActive\n ? 'text-[var(--color-gray-900)] font-bold hover:cursor-pointer'\n : 'text-[var(--color-gray-700)] font-normal hover:text-[var(--color-gray-900)] cursor-pointer'\n }`}\n >\n {tab.label}\n </div>\n );\n })}\n </div>\n\n <div className=\"se-design-tabs-content\">\n {tabs.map((tab) => (\n <div\n key={tab.id}\n className={`tab-content ${isTabActive(tab, activeTab) ? 'block' : 'hidden'}`}\n >\n {isTabActive(tab, activeTab) && tab?.renderTabContent && tab?.renderTabContent(tab)}\n </div>\n ))}\n </div>\n </>\n );\n};"],"names":["Tabs","defaultActiveTab","tabs","onTabChange","defaultTabId","id","activeTab","setActiveTab","useState","useEffect","handleTabClick","tab","isTabActive","createElement","React","Fragment","className","map","isActive","isDisabled","disabled","key","label","onClick","renderTabContent"],"mappings":";AAeO,MAAMA,IAAsBA,CAAC;AAAA,EAAEC,kBAAAA;AAAAA,EAAkBC,MAAAA;AAAAA,EAAMC,aAAAA;AAAY,MAAM;AACxEC,QAAAA,IAAeH,MAAqBC,EAAK,CAAC,IAAIA,EAAK,CAAC,EAAEG,KAAK,KAC3D,CAACC,GAAWC,CAAY,IAAIC,EAASJ,CAAY;AAEvDK,EAAAA,EAAU,MAAM;AACdF,IAAAA,EAAaN,KAAoB,EAAE;AAAA,EAAA,GAClC,CAACA,CAAgB,CAAC;AAEfS,QAAAA,IAAiBA,CAACC,MAAkB;AACxCJ,IAAAA,EAAaI,KAAAA,gBAAAA,EAAKN,EAAE,GACpBF,KAAAA,QAAAA,EAAcQ,KAAAA,gBAAAA,EAAKN;AAAAA,EACrB,GAEMO,IAAcA,CAACD,GAAeL,MAC3BK,EAAIN,OAAOC;AAGpB,2BACEO,cAAAC,EAAAC,UAAA,MACED,gBAAAA,EAAAD,cAAA,OAAA;AAAA,IAAKG,WAAU;AAAA,EAAA,GACZd,EAAKe,IAAKN,CAAQA,MAAA;AACXO,UAAAA,IAAWZ,MAAcK,EAAIN,IAC7Bc,IAAaR,EAAIS;AAErBN,WAAAA,gBAAAA,EAAAD,cAAA,OAAA;AAAA,MACEQ,KAAKV,EAAIW;AAAAA,MACTC,SAASA,MAAM,CAACJ,KAAcT,EAAeC,CAAG;AAAA,MAChDK,WAAW,aACTG,IACI,oDACAD,IACE,gEACA,4FAA4F;AAAA,IAAA,GAGnGP,EAAIW,KACF;AAAA,EAER,CAAA,CACE,GAELR,gBAAAA,EAAAD,cAAA,OAAA;AAAA,IAAKG,WAAU;AAAA,EAAA,GACZd,EAAKe,IAAKN,CACTG,MAAAA,gBAAAA,EAAAD,cAAA,OAAA;AAAA,IACEQ,KAAKV,EAAIN;AAAAA,IACTW,WAAW,eAAeJ,EAAYD,GAAKL,CAAS,IAAI,UAAU,QAAQ;AAAA,EAEzEM,GAAAA,EAAYD,GAAKL,CAAS,MAAKK,KAAAA,gBAAAA,EAAKa,sBAAoBb,KAAAA,gBAAAA,EAAKa,iBAAiBb,GAC5E,CACN,CACE,CACL;AAEN;"}
1
+ {"version":3,"file":"index26.js","sources":["../src/components/Tabs/index.tsx"],"sourcesContent":["import React, { FC, ReactNode, useState, useEffect } from 'react';\nimport { Icon } from '../Icon';\nimport { Dropdown } from '../Dropdown';\n\nimport './style.scss';\n\ninterface TabProps {\n label: string;\n id: string;\n disabled?: boolean;\n renderTabContent?: (tab: TabProps) => ReactNode;\n}\ninterface TabsProps {\n defaultActiveTab?: string;\n tabs: TabProps[];\n onTabChange?: (tabId: string) => void;\n primaryTabCount?: number; // prop for controlling primary tabs\n}\n\nexport const Tabs: FC<TabsProps> = ({ defaultActiveTab, tabs, onTabChange, primaryTabCount = 0 }) => {\n const defaultTabId = defaultActiveTab || (tabs[0] ? tabs[0].id : '');\n const [activeTab, setActiveTab] = useState(defaultTabId);\n const [showDropdown, setShowDropdown] = useState(false);\n\n const visibleTabCount = primaryTabCount ? primaryTabCount : tabs?.length;\n const visibleTabs = tabs.slice(0, visibleTabCount);\n const overflowTabs = tabs.slice(visibleTabCount);\n const activeOverflowTab = overflowTabs.find((tab) => tab.id === activeTab);\n\n useEffect(() => {\n setActiveTab(defaultActiveTab || '');\n }, [defaultActiveTab]);\n\n const handleTabClick = (tab: TabProps) => {\n setActiveTab(tab?.id);\n onTabChange?.(tab?.id);\n };\n\n const isTabActive = (tab: TabProps, activeTab: string) => {\n return tab.id === activeTab;\n };\n\n return (\n <>\n <div className=\"se-design-tabs flex items-center relative border rounded-md border-[var(--color-gray-200)] w-fit\">\n {visibleTabs.map((tab) => {\n const isActive = activeTab === tab.id;\n const isDisabled = tab.disabled;\n return (\n <div\n key={tab.label}\n onClick={() => !isDisabled && handleTabClick(tab)}\n className={`text-base px-3 py-0.5 border-l first:border-l-0 border-[var(--color-gray-200)] ${\n isDisabled\n ? 'text-[var(--color-gray-400)] cursor-not-allowed'\n : isActive\n ? 'text-[var(--color-blue-500)] bg-[var(--color-blue-100)] font-medium hover:cursor-pointer'\n : 'text-[var(--color-gray-700)] font-normal hover:text-[var(--color-gray-900)] cursor-pointer'\n }`}\n >\n {tab.label}\n </div>\n );\n })}\n\n {overflowTabs.length > 0 && (\n <div className=\"relative\">\n <div\n className={`cursor-pointer text-base text-[var(--color-gray-700)] border-l border-[var(--color-gray-200)] py-0.5 px-1.5 ${activeOverflowTab ? 'bg-[var(--color-blue-100)]' : ''}`}\n >\n {activeOverflowTab ? (\n <Dropdown\n defaultSelectedValue={activeOverflowTab}\n defaultText=\"Select\"\n displaySelected\n dropDownOptions={overflowTabs}\n optionsUniqueBy=\"id\"\n selectBy=\"label\"\n className=\"se-design-tabs-dropdown\"\n type=\"select\"\n onOptionClick={(option: any) => {\n handleTabClick(option);\n }}\n iconColor=\"var(--color-blue-500)\"\n />\n ) : (\n <Icon name=\"kebab-menu\" onClick={() => setShowDropdown(!showDropdown)} />\n )}\n </div>\n\n {showDropdown && (\n <div className=\"absolute top-full left-0 mt-1 bg-white border border-[var(--color-gray-200)] min-w-[165px] w-max shadow-lg rounded-md z-10\">\n {overflowTabs.map((tab) => (\n <div\n key={tab.label}\n onClick={() => {\n handleTabClick(tab);\n setShowDropdown(false);\n }}\n className={`px-4 py-2 cursor-pointer hover:bg-gray-100 ${\n activeTab === tab.id ? 'text-[var(--color-gray-900)] font-bold' : 'text-[var(--color-gray-700)]'\n }`}\n >\n {tab.label}\n </div>\n ))}\n </div>\n )}\n </div>\n )}\n </div>\n\n <div className=\"se-design-tabs-content\">\n {tabs.map((tab) => (\n <div key={tab.id} className={`tab-content ${isTabActive(tab, activeTab) ? 'block' : 'hidden'}`}>\n {isTabActive(tab, activeTab) && tab?.renderTabContent && tab?.renderTabContent(tab)}\n </div>\n ))}\n </div>\n </>\n );\n};\n"],"names":["Tabs","defaultActiveTab","tabs","onTabChange","primaryTabCount","defaultTabId","id","activeTab","setActiveTab","useState","showDropdown","setShowDropdown","visibleTabCount","length","visibleTabs","slice","overflowTabs","activeOverflowTab","find","tab","useEffect","handleTabClick","isTabActive","createElement","React","Fragment","className","map","isActive","isDisabled","disabled","key","label","onClick","Dropdown","defaultSelectedValue","defaultText","displaySelected","dropDownOptions","optionsUniqueBy","selectBy","type","onOptionClick","option","iconColor","Icon","name","renderTabContent"],"mappings":"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"}
package/dist/index27.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import e from "react";
2
- import { Icon as h } from "./index4.js";
3
- import { Button as N } from "./index3.js";
2
+ import { Icon as I } from "./index4.js";
3
+ import { Button as i } from "./index3.js";
4
4
  /* empty css */
5
5
  const n = {
6
6
  bannerCtn: "relative rounded-[12px] flex pr-3.5 cursor-pointer",
@@ -9,23 +9,27 @@ const n = {
9
9
  bannerImageCtn: "w-[30%] flex mr-5 justify-end cursor-pointer",
10
10
  bannerCloseIconCtn: "absolute top-[12px] right-[12px] cursor-pointer hover:bg-[var(--color-gray-100)] rounded-full p-1",
11
11
  bannerButton: "self-start"
12
- }, B = (t) => {
12
+ }, T = (t) => {
13
13
  const {
14
- bannerClassName: i,
15
- bannerBgColor: m,
16
- title: C,
14
+ bannerClassName: m,
15
+ bannerBgColor: C,
16
+ title: p,
17
17
  description: b,
18
18
  hasImage: a,
19
19
  imagePosition: r = "right",
20
- hasCloseIcon: p,
20
+ hasCloseIcon: d,
21
21
  closeIconName: u,
22
- onClose: d,
22
+ onClose: g,
23
23
  onBannerClick: o,
24
24
  ctaText: l,
25
- hasLinkCta: g,
25
+ hasLinkCta: x,
26
26
  onCtaClick: c,
27
- hasButtonCta: x,
28
- buttonType: f = "secondary"
27
+ onSecondaryCtaClick: f,
28
+ hasButtonCta: y,
29
+ buttonType: h = "secondary",
30
+ hasSecondaryButtonCta: k = !1,
31
+ secondaryButtonType: E = "secondary",
32
+ secondaryCtaText: B
29
33
  } = t, s = () => a && /* @__PURE__ */ e.createElement("div", {
30
34
  className: `${n.bannerImageCtn} banner-image-ctn min-h-full`,
31
35
  onClick: o
@@ -34,34 +38,42 @@ const n = {
34
38
  className: "max-w-[initial] h-[initial] max-h-[150px] object-contain"
35
39
  }));
36
40
  return /* @__PURE__ */ e.createElement("div", {
37
- className: `${n.bannerCtn} ${i} banner-ctn`,
41
+ className: `${n.bannerCtn} ${m} banner-ctn`,
38
42
  style: {
39
- backgroundColor: m
43
+ backgroundColor: C
40
44
  }
41
45
  }, r === "left" && s(), /* @__PURE__ */ e.createElement("div", {
42
46
  className: `${n.bannerContentCtn} ${a ? "w-[70%]" : "w-[100%]"} banner-content-ctn`,
43
47
  onClick: o
44
48
  }, /* @__PURE__ */ e.createElement("span", {
45
49
  className: "banner-title"
46
- }, C), /* @__PURE__ */ e.createElement("span", {
50
+ }, p), /* @__PURE__ */ e.createElement("span", {
47
51
  className: "banner-description"
48
- }, b), g && /* @__PURE__ */ e.createElement("span", {
52
+ }, b), /* @__PURE__ */ e.createElement("div", {
53
+ className: "flex gap-3"
54
+ }, x && /* @__PURE__ */ e.createElement("span", {
49
55
  className: n.bannerLinkCta,
50
56
  onClick: c
51
- }, l), x && /* @__PURE__ */ e.createElement(N, {
52
- type: f,
57
+ }, l), y && /* @__PURE__ */ e.createElement(i, {
58
+ type: h,
53
59
  size: "sm",
54
60
  label: l,
55
61
  onClick: c,
56
- className: n.bannerButton
57
- })), r === "right" && s(), /* @__PURE__ */ e.createElement("span", {
62
+ className: n == null ? void 0 : n.bannerButton
63
+ }), k && /* @__PURE__ */ e.createElement(i, {
64
+ type: E,
65
+ size: "sm",
66
+ label: B,
67
+ onClick: f,
68
+ className: n == null ? void 0 : n.secondaryBannerButton
69
+ }))), r === "right" && s(), /* @__PURE__ */ e.createElement("span", {
58
70
  className: n.bannerCloseIconCtn,
59
- onClick: d
60
- }, p && /* @__PURE__ */ e.createElement(h, {
71
+ onClick: g
72
+ }, d && /* @__PURE__ */ e.createElement(I, {
61
73
  name: u
62
74
  })));
63
75
  };
64
76
  export {
65
- B as Banner
77
+ T as Banner
66
78
  };
67
79
  //# sourceMappingURL=index27.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index27.js","sources":["../src/components/Banner/index.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { Map } from '../../utils/common.types';\nimport { Icon } from 'components/Icon';\nimport { Button } from 'components/Button';\nimport './style.scss';\n\nexport interface BannerProps {\n bannerClassName?: string | '';\n bannerBgColor?: string | '';\n title: string | '';\n description: string | '';\n hasImage?: boolean | false;\n imagePosition?: 'left' | 'right' | '';\n bannerImage: string | '';\n hasCloseIcon?: boolean | false;\n closeIconName: string | '';\n onClose: () => void | (() => {});\n onBannerClick?: () => void | (() => {});\n hasButtonCta?: boolean | false;\n buttonType?: 'primary' | 'secondary' | 'link';\n hasLinkCta?: boolean | false;\n ctaText: string | '';\n onCtaClick: () => void | (() => {});\n}\n\nconst classNames: Map = {\n bannerCtn: `relative rounded-[12px] flex pr-3.5 cursor-pointer`,\n bannerContentCtn: 'pt-5 pl-6 pb-5 pr-2 flex flex-col gap-2',\n bannerLinkCta: 'text-[#1088e7] cursor-pointer text-base leading-6 underline hover: text-[#0078d4]',\n bannerImageCtn: 'w-[30%] flex mr-5 justify-end cursor-pointer',\n bannerCloseIconCtn:\n 'absolute top-[12px] right-[12px] cursor-pointer hover:bg-[var(--color-gray-100)] rounded-full p-1',\n bannerButton: 'self-start'\n};\n\nexport const Banner: FC<BannerProps> = (props) => {\n const {\n bannerClassName,\n bannerBgColor,\n title,\n description,\n hasImage,\n imagePosition = 'right',\n hasCloseIcon,\n closeIconName,\n onClose,\n onBannerClick,\n ctaText,\n hasLinkCta,\n onCtaClick,\n hasButtonCta,\n buttonType = 'secondary'\n } = props;\n\n const renderImage = () =>\n hasImage && (\n <div className={`${classNames.bannerImageCtn} banner-image-ctn min-h-full`} onClick={onBannerClick}>\n <img src={props.bannerImage} className=\"max-w-[initial] h-[initial] max-h-[150px] object-contain\" />\n </div>\n );\n\n return (\n <div className={`${classNames.bannerCtn} ${bannerClassName} banner-ctn`} style={{ backgroundColor: bannerBgColor }}>\n {imagePosition === 'left' && renderImage()}\n <div\n className={`${classNames.bannerContentCtn} ${hasImage ? 'w-[70%]' : 'w-[100%]'} banner-content-ctn`}\n onClick={onBannerClick}\n >\n <span className=\"banner-title\">{title}</span>\n <span className=\"banner-description\">{description}</span>\n {hasLinkCta && (\n <span className={classNames.bannerLinkCta} onClick={onCtaClick}>\n {ctaText}\n </span>\n )}\n {hasButtonCta && (\n <Button\n type={buttonType}\n size=\"sm\"\n label={ctaText}\n onClick={onCtaClick}\n className={classNames.bannerButton}\n />\n )}\n </div>\n {imagePosition === 'right' && renderImage()}\n <span className={classNames.bannerCloseIconCtn} onClick={onClose}>\n {hasCloseIcon && <Icon name={closeIconName} />}\n </span>\n </div>\n );\n};\n"],"names":["React__default","Icon","Button","classNames","bannerCtn","bannerContentCtn","bannerLinkCta","bannerImageCtn","bannerCloseIconCtn","bannerButton","Banner","props","bannerClassName","bannerBgColor","title","description","hasImage","imagePosition","hasCloseIcon","closeIconName","onClose","onBannerClick","ctaText","hasLinkCta","onCtaClick","hasButtonCta","buttonType","renderImage","React","createElement","className","onClick","src","bannerImage","style","backgroundColor","type","size","label","name"],"mappings":"AAyBA,OAAAA,OAAA;AAAA,SAAA,QAAAC,SAAA;AAAA,SAAA,UAAAC,SAAA;AAAA,OAAA;AAAA,MAAMC,IAAkB;AAAA,EACtBC,WAAW;AAAA,EACXC,kBAAkB;AAAA,EAClBC,eAAe;AAAA,EACfC,gBAAgB;AAAA,EAChBC,oBACE;AAAA,EACFC,cAAc;AAChB,GAEaC,IAA2BC,CAAUA,MAAA;AAC1C,QAAA;AAAA,IACJC,iBAAAA;AAAAA,IACAC,eAAAA;AAAAA,IACAC,OAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACAC,eAAAA,IAAgB;AAAA,IAChBC,cAAAA;AAAAA,IACAC,eAAAA;AAAAA,IACAC,SAAAA;AAAAA,IACAC,eAAAA;AAAAA,IACAC,SAAAA;AAAAA,IACAC,YAAAA;AAAAA,IACAC,YAAAA;AAAAA,IACAC,cAAAA;AAAAA,IACAC,YAAAA,IAAa;AAAA,EAAA,IACXf,GAEEgB,IAAcA,MAClBX,KACEY,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKC,WAAW,GAAG3B,EAAWI,cAAc;AAAA,IAAgCwB,SAASV;AAAAA,EAAAA,GACnFQ,gBAAAA,EAAAA,cAAA,OAAA;AAAA,IAAKG,KAAKrB,EAAMsB;AAAAA,IAAaH,WAAU;AAAA,EAAA,CAA4D,CAChG;AAIPF,SAAAA,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKC,WAAW,GAAG3B,EAAWC,SAAS,IAAIQ,CAAe;AAAA,IAAesB,OAAO;AAAA,MAAEC,iBAAiBtB;AAAAA,IAAAA;AAAAA,EAAc,GAC9GI,MAAkB,UAAUU,EAC7BC,GAAAA,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IACEC,WAAW,GAAG3B,EAAWE,gBAAgB,IAAIW,IAAW,YAAY,UAAU;AAAA,IAC9Ee,SAASV;AAAAA,EAAAA,GAETQ,gBAAAA,EAAAA,cAAA,QAAA;AAAA,IAAMC,WAAU;AAAA,EAAgBhB,GAAAA,CAAY,GAC5Cc,gBAAAA,EAAAC,cAAA,QAAA;AAAA,IAAMC,WAAU;AAAA,KAAsBf,CAAkB,GACvDQ,KACCK,gBAAAA,EAAAC,cAAA,QAAA;AAAA,IAAMC,WAAW3B,EAAWG;AAAAA,IAAeyB,SAASP;AAAAA,KACjDF,CACG,GAEPG,KACCG,gBAAAA,EAAAC,cAAC3B,GAAM;AAAA,IACLkC,MAAMV;AAAAA,IACNW,MAAK;AAAA,IACLC,OAAOhB;AAAAA,IACPS,SAASP;AAAAA,IACTM,WAAW3B,EAAWM;AAAAA,EAAAA,CACvB,CAEA,GACJQ,MAAkB,WAAWU,EAAY,GAC1CE,gBAAAA,EAAAA,cAAA,QAAA;AAAA,IAAMC,WAAW3B,EAAWK;AAAAA,IAAoBuB,SAASX;AAAAA,EACtDF,GAAAA,KAAgBW,gBAAAA,EAAAA,cAAC5B,GAAI;AAAA,IAACsC,MAAMpB;AAAAA,EAAgB,CAAA,CACzC,CACH;AAET;"}
1
+ {"version":3,"file":"index27.js","sources":["../src/components/Banner/index.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { Map } from '../../utils/common.types';\nimport { Icon } from 'components/Icon';\nimport { Button } from 'components/Button';\nimport './style.scss';\n\nexport interface BannerProps {\n bannerClassName?: string | '';\n bannerBgColor?: string | '';\n title: string | '';\n description: string | '';\n hasImage?: boolean | false;\n imagePosition?: 'left' | 'right' | '';\n bannerImage: string | '';\n hasCloseIcon?: boolean | false;\n closeIconName: string | '';\n onClose: () => void | (() => {});\n onBannerClick?: () => void | (() => {});\n hasButtonCta?: boolean | false;\n hasSecondaryButtonCta?: boolean | false;\n buttonType?: 'primary' | 'secondary' | 'link';\n secondaryButtonType?: 'primary' | 'secondary' | 'link';\n hasLinkCta?: boolean | false;\n ctaText: string | '';\n secondaryCtaText: string | '';\n onCtaClick: () => void | (() => {});\n onSecondaryCtaClick: () => void | (() => {});\n}\n\nconst classNames: Map = {\n bannerCtn: `relative rounded-[12px] flex pr-3.5 cursor-pointer`,\n bannerContentCtn: 'pt-5 pl-6 pb-5 pr-2 flex flex-col gap-2',\n bannerLinkCta: 'text-[#1088e7] cursor-pointer text-base leading-6 underline hover: text-[#0078d4]',\n bannerImageCtn: 'w-[30%] flex mr-5 justify-end cursor-pointer',\n bannerCloseIconCtn:\n 'absolute top-[12px] right-[12px] cursor-pointer hover:bg-[var(--color-gray-100)] rounded-full p-1',\n bannerButton: 'self-start'\n};\n\nexport const Banner: FC<BannerProps> = (props) => {\n const {\n bannerClassName,\n bannerBgColor,\n title,\n description,\n hasImage,\n imagePosition = 'right',\n hasCloseIcon,\n closeIconName,\n onClose,\n onBannerClick,\n ctaText,\n hasLinkCta,\n onCtaClick,\n onSecondaryCtaClick,\n hasButtonCta,\n buttonType = 'secondary',\n hasSecondaryButtonCta = false,\n secondaryButtonType = 'secondary',\n secondaryCtaText\n } = props;\n\n const renderImage = () =>\n hasImage && (\n <div className={`${classNames.bannerImageCtn} banner-image-ctn min-h-full`} onClick={onBannerClick}>\n <img src={props.bannerImage} className=\"max-w-[initial] h-[initial] max-h-[150px] object-contain\" />\n </div>\n );\n\n return (\n <div className={`${classNames.bannerCtn} ${bannerClassName} banner-ctn`} style={{ backgroundColor: bannerBgColor }}>\n {imagePosition === 'left' && renderImage()}\n <div\n className={`${classNames.bannerContentCtn} ${hasImage ? 'w-[70%]' : 'w-[100%]'} banner-content-ctn`}\n onClick={onBannerClick}\n >\n <span className=\"banner-title\">{title}</span>\n <span className=\"banner-description\">{description}</span>\n <div className=\"flex gap-3\">\n {hasLinkCta && (\n <span className={classNames.bannerLinkCta} onClick={onCtaClick}>\n {ctaText}\n </span>\n )}\n {hasButtonCta && (\n <Button\n type={buttonType}\n size=\"sm\"\n label={ctaText}\n onClick={onCtaClick}\n className={classNames?.bannerButton}\n />\n )}\n {hasSecondaryButtonCta && (\n <Button\n type={secondaryButtonType}\n size=\"sm\"\n label={secondaryCtaText}\n onClick={onSecondaryCtaClick}\n className={classNames?.secondaryBannerButton}\n />\n )}\n </div>\n </div>\n {imagePosition === 'right' && renderImage()}\n <span className={classNames.bannerCloseIconCtn} onClick={onClose}>\n {hasCloseIcon && <Icon name={closeIconName} />}\n </span>\n </div>\n );\n};\n"],"names":["React__default","Icon","Button","classNames","bannerCtn","bannerContentCtn","bannerLinkCta","bannerImageCtn","bannerCloseIconCtn","bannerButton","Banner","props","bannerClassName","bannerBgColor","title","description","hasImage","imagePosition","hasCloseIcon","closeIconName","onClose","onBannerClick","ctaText","hasLinkCta","onCtaClick","onSecondaryCtaClick","hasButtonCta","buttonType","hasSecondaryButtonCta","secondaryButtonType","secondaryCtaText","renderImage","React","createElement","className","onClick","src","bannerImage","style","backgroundColor","type","size","label","secondaryBannerButton","name"],"mappings":"AA6BA,OAAAA,OAAA;AAAA,SAAA,QAAAC,SAAA;AAAA,SAAA,UAAAC,SAAA;AAAA,OAAA;AAAA,MAAMC,IAAkB;AAAA,EACtBC,WAAW;AAAA,EACXC,kBAAkB;AAAA,EAClBC,eAAe;AAAA,EACfC,gBAAgB;AAAA,EAChBC,oBACE;AAAA,EACFC,cAAc;AAChB,GAEaC,IAA2BC,CAAUA,MAAA;AAC1C,QAAA;AAAA,IACJC,iBAAAA;AAAAA,IACAC,eAAAA;AAAAA,IACAC,OAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACAC,eAAAA,IAAgB;AAAA,IAChBC,cAAAA;AAAAA,IACAC,eAAAA;AAAAA,IACAC,SAAAA;AAAAA,IACAC,eAAAA;AAAAA,IACAC,SAAAA;AAAAA,IACAC,YAAAA;AAAAA,IACAC,YAAAA;AAAAA,IACAC,qBAAAA;AAAAA,IACAC,cAAAA;AAAAA,IACAC,YAAAA,IAAa;AAAA,IACbC,uBAAAA,IAAwB;AAAA,IACxBC,qBAAAA,IAAsB;AAAA,IACtBC,kBAAAA;AAAAA,EAAAA,IACEnB,GAEEoB,IAAcA,MAClBf,KACEgB,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKC,WAAW,GAAG/B,EAAWI,cAAc;AAAA,IAAgC4B,SAASd;AAAAA,EAAAA,GACnFY,gBAAAA,EAAAA,cAAA,OAAA;AAAA,IAAKG,KAAKzB,EAAM0B;AAAAA,IAAaH,WAAU;AAAA,EAAA,CAA4D,CAChG;AAIPF,SAAAA,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKC,WAAW,GAAG/B,EAAWC,SAAS,IAAIQ,CAAe;AAAA,IAAe0B,OAAO;AAAA,MAAEC,iBAAiB1B;AAAAA,IAAAA;AAAAA,EAAc,GAC9GI,MAAkB,UAAUc,EAC7BC,GAAAA,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IACEC,WAAW,GAAG/B,EAAWE,gBAAgB,IAAIW,IAAW,YAAY,UAAU;AAAA,IAC9EmB,SAASd;AAAAA,EAAAA,GAETY,gBAAAA,EAAAA,cAAA,QAAA;AAAA,IAAMC,WAAU;AAAA,EAAgBpB,GAAAA,CAAY,GAC5CkB,gBAAAA,EAAAC,cAAA,QAAA;AAAA,IAAMC,WAAU;AAAA,EAAsBnB,GAAAA,CAAkB,GACxDiB,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKC,WAAU;AAAA,EACZX,GAAAA,KACCU,gBAAAA,EAAAA,cAAA,QAAA;AAAA,IAAMC,WAAW/B,EAAWG;AAAAA,IAAe6B,SAASX;AAAAA,KACjDF,CACG,GAEPI,KACCM,gBAAAA,EAAAC,cAAC/B,GAAM;AAAA,IACLsC,MAAMb;AAAAA,IACNc,MAAK;AAAA,IACLC,OAAOpB;AAAAA,IACPa,SAASX;AAAAA,IACTU,WAAW/B,KAAAA,gBAAAA,EAAYM;AAAAA,EACxB,CAAA,GAEFmB,KACCI,gBAAAA,EAAAC,cAAC/B,GAAM;AAAA,IACLsC,MAAMX;AAAAA,IACNY,MAAK;AAAA,IACLC,OAAOZ;AAAAA,IACPK,SAASV;AAAAA,IACTS,WAAW/B,KAAAA,gBAAAA,EAAYwC;AAAAA,EAAAA,CACxB,CAEA,CACF,GACJ1B,MAAkB,WAAWc,EAAY,GAC1CE,gBAAAA,EAAAA,cAAA,QAAA;AAAA,IAAMC,WAAW/B,EAAWK;AAAAA,IAAoB2B,SAASf;AAAAA,EACtDF,GAAAA,KAAgBe,gBAAAA,EAAAA,cAAChC,GAAI;AAAA,IAAC2C,MAAMzB;AAAAA,EAAgB,CAAA,CACzC,CACH;AAET;"}
package/dist/index29.js CHANGED
@@ -22,9 +22,9 @@ const t = {
22
22
  requestFeatureDescriptionCtn: "flex flex-col"
23
23
  }, B = ({
24
24
  widgetClassName: g = "",
25
- widgetType: a,
26
- widgetTitle: r,
27
- widgetDescription: l,
25
+ widgetType: a = "general",
26
+ widgetTitle: r = "",
27
+ widgetDescription: l = "",
28
28
  widgetImage: p,
29
29
  hasImage: f = !1,
30
30
  hasButtonCta: n = !1,
@@ -1 +1 @@
1
- {"version":3,"file":"index29.js","sources":["../src/components/Widget/index.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport { Map } from \"../../utils/common.types\";\nimport { Button } from \"../Button\";\nimport { Badge } from \"../Badge\";\nimport { Icon } from \"../Icon\";\nimport \"./style.scss\";\n\nexport interface WidgetProps {\n widgetClassName?: string;\n widgetType?: \"promotion\" | \"webinar\" | \"request-feature\" | \"general\";\n widgetTitle?: string;\n hasBadge?: boolean;\n webinarSpeaker?: string;\n badgeText?: string;\n widgetDescription?: string;\n webinarDateInfo?: string;\n hasImage?: boolean;\n widgetImage?: string;\n hasButtonCta?: boolean;\n buttonBgColor?: 'primary' | 'secondary';\n hasLinkCta?: boolean;\n ctaText?: string;\n onCtaClick?: () => void;\n onWidgetClick?: () => void;\n}\n\nconst className: Map = {\n widgetCtn: 'flex flex-col gap-[2px] align-center border border-[var(--color-gray-200)] rounded-[12px] w-[385px]',\n widgetImageCtn: 'cursor-pointer',\n descriptionCtn: 'p-4 flex flex-col',\n widgetTitle: 'text-[var(--color-gray-900)] mt-[4px] mb-[8px]',\n widgetDescription: 'text-[var(--color-gray-700)] mb-[4px]',\n widgetLinkCta: 'text-[var(--color-blue-500)] cursor-pointer hover:text-[var(--color-blue-600)]',\n widgetButtonCta: 'self-start',\n widgetBadge: 'w-fit',\n webinarInfoCtn: 'flex flex-col gap-2',\n webinarSpeaker: 'text-[var(--color-gray-700)]',\n webinarDate: 'text-[var(--color-gray-700)]',\n webinarDescriptionInfo: 'flex gap-2',\n webinarTimeInfo: 'flex gap-2',\n requestFeatureCtn: 'flex gap-[12px]',\n requestFeatureImageCtn: 'w-[48px] h-[48px] border border-[var(--color-gray-200)] rounded-[50%] flex items-center flex-shrink-0 bg-[var(--color-red-50)]',\n requestFeatureDescriptionCtn: 'flex flex-col',\n};\n\nexport const Widget: FC<WidgetProps> = ({\n widgetClassName = \"\",\n widgetType,\n widgetTitle,\n widgetDescription,\n widgetImage,\n hasImage = false,\n hasButtonCta = false,\n hasLinkCta = false,\n ctaText = \"\",\n hasBadge = false,\n badgeText = \"\",\n buttonBgColor = 'secondary',\n onCtaClick,\n onWidgetClick,\n webinarDateInfo,\n webinarSpeaker,\n}) => {\n\n const renderBadge = hasBadge && (\n <Badge\n label={badgeText}\n className={className.widgetBadge}\n bgColor=\"var(--color-yellow-50)\"\n textColor=\"var(--color-yellow-400)\"\n fontWeight=\"normal\"\n />\n );\n\n const renderCTA = (hasLinkCta || hasButtonCta) && (\n <React.Fragment>\n {hasLinkCta && <span className={className.widgetLinkCta}>{ctaText}</span>}\n {hasButtonCta && <Button type={buttonBgColor} size=\"md\" label={ctaText} className={`${className.widgetButtonCta} mt-[4px]`} onClick={onCtaClick} />}\n </React.Fragment>\n );\n\n const renderImage = hasImage && (\n <div className={`${className.widgetImageCtn} widget-image-ctn`}>\n <img src={widgetImage} alt=\"widget-image\"/>\n </div>\n );\n\n return (\n <div className={`${className.widgetCtn} ${widgetClassName} widget-ctn`} onClick={onWidgetClick}>\n {widgetType !== \"general\" && renderImage}\n <div className={className.descriptionCtn}>\n {widgetType !== \"general\" && renderBadge}\n {widgetType !== \"request-feature\" && <span className={`${className.widgetTitle} widget-title`}>{widgetTitle}</span>}\n\n {[\"promotion\", \"general\"].includes(widgetType!) && (\n <span className={`${className.widgetDescription} widget-description`}>{widgetDescription}</span>\n )}\n\n {widgetType === \"webinar\" && (\n <div className={className.webinarInfoCtn}>\n {webinarSpeaker && (\n <div className={`${className.webinarDescriptionInfo} align-baseline`}>\n <Icon name=\"people\" className=\"relative top-[2px]\" />\n <span className={className.webinarSpeaker}>{webinarSpeaker}</span>\n </div>\n )}\n {webinarDateInfo && (\n <div className={`${className.webinarTimeInfo} align-baseline mb-[4px]`}>\n <Icon name=\"clock\" className=\"relative top-[2px]\" />\n <span className={className.webinarDate}>{webinarDateInfo}</span>\n </div>\n )}\n </div>\n )}\n\n {widgetType === \"request-feature\" ? (\n <div className={className.requestFeatureCtn}>\n <div className={className.requestFeatureImageCtn} />\n <div className={className.requestFeatureDescriptionCtn}>\n <span className={`${className.widgetTitle} widget-title`}>{widgetTitle}</span>\n <span className={`${className.widgetDescription} widget-description`}>{widgetDescription}</span>\n {renderCTA}\n </div>\n </div>\n ) : (\n renderCTA\n )}\n </div>\n </div>\n );\n};\n\nexport default Widget;"],"names":["React__default","Button","Badge","Icon","className","widgetCtn","widgetImageCtn","descriptionCtn","widgetTitle","widgetDescription","widgetLinkCta","widgetButtonCta","widgetBadge","webinarInfoCtn","webinarSpeaker","webinarDate","webinarDescriptionInfo","webinarTimeInfo","requestFeatureCtn","requestFeatureImageCtn","requestFeatureDescriptionCtn","Widget","widgetClassName","widgetType","widgetImage","hasImage","hasButtonCta","hasLinkCta","ctaText","hasBadge","badgeText","buttonBgColor","onCtaClick","onWidgetClick","webinarDateInfo","renderBadge","createElement","label","bgColor","textColor","fontWeight","renderCTA","React","Fragment","type","size","onClick","renderImage","src","alt","includes","name"],"mappings":"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"}
1
+ {"version":3,"file":"index29.js","sources":["../src/components/Widget/index.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport { Map } from \"../../utils/common.types\";\nimport { Button } from \"../Button\";\nimport { Badge } from \"../Badge\";\nimport { Icon } from \"../Icon\";\nimport \"./style.scss\";\n\nexport interface WidgetProps {\n widgetClassName?: string;\n widgetType?: \"promotion\" | \"webinar\" | \"request-feature\" | \"general\";\n widgetTitle?: string;\n hasBadge?: boolean;\n webinarSpeaker?: string;\n badgeText?: string;\n widgetDescription?: string;\n webinarDateInfo?: string;\n hasImage?: boolean;\n widgetImage?: string;\n hasButtonCta?: boolean;\n buttonBgColor?: 'primary' | 'secondary';\n hasLinkCta?: boolean;\n ctaText?: string;\n onCtaClick?: () => void;\n onWidgetClick?: () => void;\n}\n\nconst className: Map = {\n widgetCtn: 'flex flex-col gap-[2px] align-center border border-[var(--color-gray-200)] rounded-[12px] w-[385px]',\n widgetImageCtn: 'cursor-pointer',\n descriptionCtn: 'p-4 flex flex-col',\n widgetTitle: 'text-[var(--color-gray-900)] mt-[4px] mb-[8px]',\n widgetDescription: 'text-[var(--color-gray-700)] mb-[4px]',\n widgetLinkCta: 'text-[var(--color-blue-500)] cursor-pointer hover:text-[var(--color-blue-600)]',\n widgetButtonCta: 'self-start',\n widgetBadge: 'w-fit',\n webinarInfoCtn: 'flex flex-col gap-2',\n webinarSpeaker: 'text-[var(--color-gray-700)]',\n webinarDate: 'text-[var(--color-gray-700)]',\n webinarDescriptionInfo: 'flex gap-2',\n webinarTimeInfo: 'flex gap-2',\n requestFeatureCtn: 'flex gap-[12px]',\n requestFeatureImageCtn: 'w-[48px] h-[48px] border border-[var(--color-gray-200)] rounded-[50%] flex items-center flex-shrink-0 bg-[var(--color-red-50)]',\n requestFeatureDescriptionCtn: 'flex flex-col',\n};\n\nexport const Widget: FC<WidgetProps> = ({\n widgetClassName = \"\",\n widgetType = 'general',\n widgetTitle = \"\",\n widgetDescription = \"\",\n widgetImage,\n hasImage = false,\n hasButtonCta = false,\n hasLinkCta = false,\n ctaText = \"\",\n hasBadge = false,\n badgeText = \"\",\n buttonBgColor = 'secondary',\n onCtaClick,\n onWidgetClick,\n webinarDateInfo,\n webinarSpeaker,\n}) => {\n\n const renderBadge = hasBadge && (\n <Badge\n label={badgeText}\n className={className.widgetBadge}\n bgColor=\"var(--color-yellow-50)\"\n textColor=\"var(--color-yellow-400)\"\n fontWeight=\"normal\"\n />\n );\n\n const renderCTA = (hasLinkCta || hasButtonCta) && (\n <React.Fragment>\n {hasLinkCta && <span className={className.widgetLinkCta}>{ctaText}</span>}\n {hasButtonCta && <Button type={buttonBgColor} size=\"md\" label={ctaText} className={`${className.widgetButtonCta} mt-[4px]`} onClick={onCtaClick} />}\n </React.Fragment>\n );\n\n const renderImage = hasImage && (\n <div className={`${className.widgetImageCtn} widget-image-ctn`}>\n <img src={widgetImage} alt=\"widget-image\"/>\n </div>\n );\n\n return (\n <div className={`${className.widgetCtn} ${widgetClassName} widget-ctn`} onClick={onWidgetClick}>\n {widgetType !== \"general\" && renderImage}\n <div className={className.descriptionCtn}>\n {widgetType !== \"general\" && renderBadge}\n {widgetType !== \"request-feature\" && <span className={`${className.widgetTitle} widget-title`}>{widgetTitle}</span>}\n\n {([\"promotion\", \"general\"].includes(widgetType)) && (\n <span className={`${className.widgetDescription} widget-description`}>{widgetDescription}</span>\n )}\n\n {widgetType === \"webinar\" && (\n <div className={className.webinarInfoCtn}>\n {webinarSpeaker && (\n <div className={`${className.webinarDescriptionInfo} align-baseline`}>\n <Icon name=\"people\" className=\"relative top-[2px]\" />\n <span className={className.webinarSpeaker}>{webinarSpeaker}</span>\n </div>\n )}\n {webinarDateInfo && (\n <div className={`${className.webinarTimeInfo} align-baseline mb-[4px]`}>\n <Icon name=\"clock\" className=\"relative top-[2px]\" />\n <span className={className.webinarDate}>{webinarDateInfo}</span>\n </div>\n )}\n </div>\n )}\n\n {widgetType === \"request-feature\" ? (\n <div className={className.requestFeatureCtn}>\n <div className={className.requestFeatureImageCtn} />\n <div className={className.requestFeatureDescriptionCtn}>\n <span className={`${className.widgetTitle} widget-title`}>{widgetTitle}</span>\n <span className={`${className.widgetDescription} widget-description`}>{widgetDescription}</span>\n {renderCTA}\n </div>\n </div>\n ) : (\n renderCTA\n )}\n </div>\n </div>\n );\n};\n\nexport default Widget;"],"names":["React__default","Button","Badge","Icon","className","widgetCtn","widgetImageCtn","descriptionCtn","widgetTitle","widgetDescription","widgetLinkCta","widgetButtonCta","widgetBadge","webinarInfoCtn","webinarSpeaker","webinarDate","webinarDescriptionInfo","webinarTimeInfo","requestFeatureCtn","requestFeatureImageCtn","requestFeatureDescriptionCtn","Widget","widgetClassName","widgetType","widgetImage","hasImage","hasButtonCta","hasLinkCta","ctaText","hasBadge","badgeText","buttonBgColor","onCtaClick","onWidgetClick","webinarDateInfo","renderBadge","createElement","label","bgColor","textColor","fontWeight","renderCTA","React","Fragment","type","size","onClick","renderImage","src","alt","includes","name"],"mappings":"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"}
package/dist/index3.js CHANGED
@@ -1,15 +1,15 @@
1
1
  var s = Object.getOwnPropertySymbols;
2
- var y = Object.prototype.hasOwnProperty, h = Object.prototype.propertyIsEnumerable;
2
+ var h = Object.prototype.hasOwnProperty, y = Object.prototype.propertyIsEnumerable;
3
3
  var b = (e, a) => {
4
4
  var o = {};
5
5
  for (var r in e)
6
- y.call(e, r) && a.indexOf(r) < 0 && (o[r] = e[r]);
6
+ h.call(e, r) && a.indexOf(r) < 0 && (o[r] = e[r]);
7
7
  if (e != null && s)
8
8
  for (var r of s(e))
9
- a.indexOf(r) < 0 && h.call(e, r) && (o[r] = e[r]);
9
+ a.indexOf(r) < 0 && y.call(e, r) && (o[r] = e[r]);
10
10
  return o;
11
11
  };
12
- import l from "react";
12
+ import t from "react";
13
13
  import { Icon as d } from "./index4.js";
14
14
  function n() {
15
15
  return n = Object.assign ? Object.assign.bind() : function(e) {
@@ -20,18 +20,19 @@ function n() {
20
20
  return e;
21
21
  }, n.apply(null, arguments);
22
22
  }
23
- const t = "focus-visible:outline outline-2 outline-[var(--color-blue-400)] outline-offset-2", x = {
23
+ const l = "focus-visible:outline outline-2 outline-[var(--color-blue-400)] outline-offset-2", x = {
24
24
  primary: "bg-[var(--color-gray-200)] text-[var(--color-gray-600)] pointer-events-none cursor-not-allowed",
25
25
  secondary: "text-[var(--color-gray-600)] border border-[var(--color-gray-300)] pointer-events-none cursor-not-allowed",
26
26
  link: "text-[var(--color-gray-600)] pointer-events-none cursor-not-allowed"
27
27
  }, g = {
28
- primary: `bg-[var(--color-blue-500)] text-[var(--color-white)] hover:bg-[var(--color-blue-600)] ${t}`,
29
- secondary: `bg-[var(--color-white)] text-[var(--color-gray-800)] hover:bg-[var(--color-gray-50)] border border-[var(--color-gray-400)] hover:border-[var(--color-gray-500)] ${t}`,
30
- purchase: `bg-[var(--color-green-500)] text-[var(--color-white)] hover:bg-[var(--color-green-700)] border border-[var(--color-green-300)] ${t}`,
31
- "purchase-secondary": `bg-[var(--color-green-50)] text-[var(--color-green-500)] hover:bg-[var(--color-green-400)] border border-[var(--color-green-500)] hover:border-[var(--color-green-700)] ${t}`,
32
- negative: `bg-[var(--color-red-500)] text-[var(--color-white)] hover:bg-[var(--color-red-500)] border border-[var(--color-red-500)] hover:border-[var(--color-red-500)] ${t}`,
33
- "negative-secondary": `bg-[var(--color-red-50)] text-[var(--color-red-500)] hover:bg-[var(--color-red-50)] border border-[var(--color-red-500)] hover:border-[var(--color-red-500)] ${t}`,
34
- link: `text-[var(--color-blue-500)] px-0 py-0 hover:text-[var(--color-blue-600)] ${t}`,
28
+ primary: `bg-[var(--color-blue-500)] text-[var(--color-white)] hover:bg-[var(--color-blue-600)] ${l}`,
29
+ secondary: `bg-[var(--color-white)] text-[var(--color-gray-800)] hover:bg-[var(--color-gray-50)] border border-[var(--color-gray-400)] hover:border-[var(--color-gray-500)] ${l}`,
30
+ "secondary-blue": `bg-[var(--color-white)] border border-[var(--color-blue-500)] text-[var(--color-blue-500)] hover:bg-[var(--color-blue-100)] ${l}`,
31
+ purchase: `bg-[var(--color-green-500)] text-[var(--color-white)] hover:bg-[var(--color-green-700)] border border-[var(--color-green-300)] ${l}`,
32
+ "purchase-secondary": `bg-[var(--color-green-50)] text-[var(--color-green-500)] hover:bg-[var(--color-green-400)] border border-[var(--color-green-500)] hover:border-[var(--color-green-700)] ${l}`,
33
+ negative: `bg-[var(--color-red-500)] text-[var(--color-white)] hover:bg-[var(--color-red-500)] border border-[var(--color-red-500)] hover:border-[var(--color-red-500)] ${l}`,
34
+ "negative-secondary": `bg-[var(--color-red-50)] text-[var(--color-red-500)] hover:bg-[var(--color-red-50)] border border-[var(--color-red-500)] hover:border-[var(--color-red-500)] ${l}`,
35
+ link: `text-[var(--color-blue-500)] px-0 py-0 hover:text-[var(--color-blue-600)] ${l}`,
35
36
  sm: "px-3 py-1",
36
37
  md: "px-4 py-2",
37
38
  smRow: "px-3 py-0.5"
@@ -54,13 +55,13 @@ const t = "focus-visible:outline outline-2 outline-[var(--color-blue-400)] outli
54
55
  "className"
55
56
  ]);
56
57
  const p = e !== "link" ? g[a] : "";
57
- return /* @__PURE__ */ l.createElement("button", n({
58
+ return /* @__PURE__ */ t.createElement("button", n({
58
59
  type: "button",
59
60
  className: `rounded-[6px] text-base font-normal flex gap-1 items-center min-w-fit ${p} ${u ? x[e] : g[e]} ${i}`
60
- }, m), r && c === "left" && /* @__PURE__ */ l.createElement(d, {
61
+ }, m), r && c === "left" && /* @__PURE__ */ t.createElement(d, {
61
62
  name: r,
62
63
  className: ""
63
- }), o, r && c === "right" && /* @__PURE__ */ l.createElement(d, {
64
+ }), o, r && c === "right" && /* @__PURE__ */ t.createElement(d, {
64
65
  name: r,
65
66
  className: ""
66
67
  }));
@@ -1 +1 @@
1
- {"version":3,"file":"index3.js","sources":["../src/components/Button/index.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { Map } from '../../utils/common.types';\nimport { Icon } from '../Icon';\n\nexport interface ButtonProps {\n /**\n * Type of the button\n */\n type?: 'primary' | 'secondary' | 'negative' | 'negative-secondary' | 'purchase' | 'purchase-secondary' | 'link';\n /**\n * Size of the button\n */\n size?: 'sm' | 'md' | 'smRow';\n /**\n * Button contents\n */\n label: string | '';\n /**\n * Icon name\n */\n icon?: string;\n /**\n * Icon position\n */\n iconPosition?: 'left' | 'right';\n /**\n * Disabled state\n */\n disabled?: boolean;\n /**\n * Optional click handler\n */\n onClick?: () => void;\n /**\n * Custom class name\n */\n className?: string;\n}\n\nconst focusClass = 'focus-visible:outline outline-2 outline-[var(--color-blue-400)] outline-offset-2';\nconst disabledClassNames: Map = {\n primary: 'bg-[var(--color-gray-200)] text-[var(--color-gray-600)] pointer-events-none cursor-not-allowed',\n secondary:\n 'text-[var(--color-gray-600)] border border-[var(--color-gray-300)] pointer-events-none cursor-not-allowed',\n link: 'text-[var(--color-gray-600)] pointer-events-none cursor-not-allowed'\n};\nconst classNames: Map = {\n primary: `bg-[var(--color-blue-500)] text-[var(--color-white)] hover:bg-[var(--color-blue-600)] ${focusClass}`,\n secondary: `bg-[var(--color-white)] text-[var(--color-gray-800)] hover:bg-[var(--color-gray-50)] border border-[var(--color-gray-400)] hover:border-[var(--color-gray-500)] ${focusClass}`,\n purchase: `bg-[var(--color-green-500)] text-[var(--color-white)] hover:bg-[var(--color-green-700)] border border-[var(--color-green-300)] ${focusClass}`,\n 'purchase-secondary': `bg-[var(--color-green-50)] text-[var(--color-green-500)] hover:bg-[var(--color-green-400)] border border-[var(--color-green-500)] hover:border-[var(--color-green-700)] ${focusClass}`,\n negative: `bg-[var(--color-red-500)] text-[var(--color-white)] hover:bg-[var(--color-red-500)] border border-[var(--color-red-500)] hover:border-[var(--color-red-500)] ${focusClass}`,\n 'negative-secondary': `bg-[var(--color-red-50)] text-[var(--color-red-500)] hover:bg-[var(--color-red-50)] border border-[var(--color-red-500)] hover:border-[var(--color-red-500)] ${focusClass}`,\n link: `text-[var(--color-blue-500)] px-0 py-0 hover:text-[var(--color-blue-600)] ${focusClass}`,\n sm: 'px-3 py-1',\n md: 'px-4 py-2',\n smRow: 'px-3 py-0.5'\n};\n\nexport const Button: FC<ButtonProps> = ({\n type = 'primary',\n size = 'md',\n label = '',\n icon = '',\n iconPosition = 'left',\n disabled = false,\n className = '',\n ...props\n}) => {\n const sizeClassName = type !== 'link' ? classNames[size] : '';\n\n return (\n <button\n type=\"button\"\n className={`rounded-[6px] text-base font-normal flex gap-1 items-center min-w-fit ${sizeClassName} ${disabled ? disabledClassNames[type] : classNames[type]} ${className}`}\n {...props}\n >\n {icon && iconPosition === 'left' && <Icon name={icon} className=\"\" />}\n {label}\n {icon && iconPosition === 'right' && <Icon name={icon} className=\"\" />}\n </button>\n );\n};\n"],"names":["focusClass","disabledClassNames","primary","secondary","link","classNames","purchase","negative","sm","md","smRow","Button","_a","_b","type","size","label","icon","iconPosition","disabled","className","props","sizeClassName","React","createElement","_extends","Icon","name"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAuCA,MAAMA,IAAa,oFACbC,IAA0B;AAAA,EAC9BC,SAAS;AAAA,EACTC,WACE;AAAA,EACFC,MAAM;AACR,GACMC,IAAkB;AAAA,EACtBH,SAAS,yFAAyFF,CAAU;AAAA,EAC5GG,WAAW,mKAAmKH,CAAU;AAAA,EACxLM,UAAU,kIAAkIN,CAAU;AAAA,EACtJ,sBAAsB,2KAA2KA,CAAU;AAAA,EAC3MO,UAAU,gKAAgKP,CAAU;AAAA,EACpL,sBAAsB,gKAAgKA,CAAU;AAAA,EAChMI,MAAM,8EAA8EJ,CAAU;AAAA,EAC9FQ,IAAI;AAAA,EACJC,IAAI;AAAA,EACJC,OAAO;AACT,GAEaC,IAA0BA,CAACC,MASlC;AATkC,MAAAC,IAAAD,GACtCE;AAAAA,UAAAA,IAAO;AAAA,IACPC,MAAAA,IAAO;AAAA,IACPC,OAAAA,IAAQ;AAAA,IACRC,MAAAA,IAAO;AAAA,IACPC,cAAAA,IAAe;AAAA,IACfC,UAAAA,IAAW;AAAA,IACXC,WAAAA,IAAY;AAAA,MAP0BP,GAQnCQ,IAAAA,EARmCR,GAQnCQ;AAAAA,IAPHP;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA;AAGA,QAAME,IAAgBR,MAAS,SAAST,EAAWU,CAAI,IAAI;AAGzDQ,SAAAA,gBAAAA,EAAAC,cAAA,UAAAC,EAAA;AAAA,IACEX,MAAK;AAAA,IACLM,WAAW,yEAAyEE,CAAa,IAAIH,IAAWlB,EAAmBa,CAAI,IAAIT,EAAWS,CAAI,CAAC,IAAIM,CAAS;AAAA,EAAA,GACpKC,CAAK,GAERJ,KAAQC,MAAiB,UAAUK,gBAAAA,EAAAC,cAACE,GAAI;AAAA,IAACC,MAAMV;AAAAA,IAAMG,WAAU;AAAA,EAAA,CAAI,GACnEJ,GACAC,KAAQC,MAAiB,WAAWK,gBAAAA,EAAAC,cAACE,GAAI;AAAA,IAACC,MAAMV;AAAAA,IAAMG,WAAU;AAAA,EAAA,CAAI,CAC/D;AAEZ;"}
1
+ {"version":3,"file":"index3.js","sources":["../src/components/Button/index.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { Map } from '../../utils/common.types';\nimport { Icon } from '../Icon';\n\nexport interface ButtonProps {\n /**\n * Type of the button\n */\n type?: 'primary' | 'secondary' | 'secondary-blue' | 'negative' | 'negative-secondary' | 'purchase' | 'purchase-secondary' | 'link';\n /**\n * Size of the button\n */\n size?: 'sm' | 'md' | 'smRow';\n /**\n * Button contents\n */\n label: string | '';\n /**\n * Icon name\n */\n icon?: string;\n /**\n * Icon position\n */\n iconPosition?: 'left' | 'right';\n /**\n * Disabled state\n */\n disabled?: boolean;\n /**\n * Optional click handler\n */\n onClick?: () => void;\n /**\n * Custom class name\n */\n className?: string;\n}\n\nconst focusClass = 'focus-visible:outline outline-2 outline-[var(--color-blue-400)] outline-offset-2';\nconst disabledClassNames: Map = {\n primary: 'bg-[var(--color-gray-200)] text-[var(--color-gray-600)] pointer-events-none cursor-not-allowed',\n secondary:\n 'text-[var(--color-gray-600)] border border-[var(--color-gray-300)] pointer-events-none cursor-not-allowed',\n link: 'text-[var(--color-gray-600)] pointer-events-none cursor-not-allowed'\n};\nconst classNames: Map = {\n primary: `bg-[var(--color-blue-500)] text-[var(--color-white)] hover:bg-[var(--color-blue-600)] ${focusClass}`,\n secondary: `bg-[var(--color-white)] text-[var(--color-gray-800)] hover:bg-[var(--color-gray-50)] border border-[var(--color-gray-400)] hover:border-[var(--color-gray-500)] ${focusClass}`,\n 'secondary-blue': `bg-[var(--color-white)] border border-[var(--color-blue-500)] text-[var(--color-blue-500)] hover:bg-[var(--color-blue-100)] ${focusClass}`,\n purchase: `bg-[var(--color-green-500)] text-[var(--color-white)] hover:bg-[var(--color-green-700)] border border-[var(--color-green-300)] ${focusClass}`,\n 'purchase-secondary': `bg-[var(--color-green-50)] text-[var(--color-green-500)] hover:bg-[var(--color-green-400)] border border-[var(--color-green-500)] hover:border-[var(--color-green-700)] ${focusClass}`,\n negative: `bg-[var(--color-red-500)] text-[var(--color-white)] hover:bg-[var(--color-red-500)] border border-[var(--color-red-500)] hover:border-[var(--color-red-500)] ${focusClass}`,\n 'negative-secondary': `bg-[var(--color-red-50)] text-[var(--color-red-500)] hover:bg-[var(--color-red-50)] border border-[var(--color-red-500)] hover:border-[var(--color-red-500)] ${focusClass}`,\n link: `text-[var(--color-blue-500)] px-0 py-0 hover:text-[var(--color-blue-600)] ${focusClass}`,\n sm: 'px-3 py-1',\n md: 'px-4 py-2',\n smRow: 'px-3 py-0.5'\n};\n\nexport const Button: FC<ButtonProps> = ({\n type = 'primary',\n size = 'md',\n label = '',\n icon = '',\n iconPosition = 'left',\n disabled = false,\n className = '',\n ...props\n}) => {\n const sizeClassName = type !== 'link' ? classNames[size] : '';\n\n return (\n <button\n type=\"button\"\n className={`rounded-[6px] text-base font-normal flex gap-1 items-center min-w-fit ${sizeClassName} ${disabled ? disabledClassNames[type] : classNames[type]} ${className}`}\n {...props}\n >\n {icon && iconPosition === 'left' && <Icon name={icon} className=\"\" />}\n {label}\n {icon && iconPosition === 'right' && <Icon name={icon} className=\"\" />}\n </button>\n );\n};\n"],"names":["focusClass","disabledClassNames","primary","secondary","link","classNames","purchase","negative","sm","md","smRow","Button","_a","_b","type","size","label","icon","iconPosition","disabled","className","props","sizeClassName","React","createElement","_extends","Icon","name"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAuCA,MAAMA,IAAa,oFACbC,IAA0B;AAAA,EAC9BC,SAAS;AAAA,EACTC,WACE;AAAA,EACFC,MAAM;AACR,GACMC,IAAkB;AAAA,EACtBH,SAAS,yFAAyFF,CAAU;AAAA,EAC5GG,WAAW,mKAAmKH,CAAU;AAAA,EACxL,kBAAkB,+HAA+HA,CAAU;AAAA,EAC3JM,UAAU,kIAAkIN,CAAU;AAAA,EACtJ,sBAAsB,2KAA2KA,CAAU;AAAA,EAC3MO,UAAU,gKAAgKP,CAAU;AAAA,EACpL,sBAAsB,gKAAgKA,CAAU;AAAA,EAChMI,MAAM,8EAA8EJ,CAAU;AAAA,EAC9FQ,IAAI;AAAA,EACJC,IAAI;AAAA,EACJC,OAAO;AACT,GAEaC,IAA0BA,CAACC,MASlC;AATkC,MAAAC,IAAAD,GACtCE;AAAAA,UAAAA,IAAO;AAAA,IACPC,MAAAA,IAAO;AAAA,IACPC,OAAAA,IAAQ;AAAA,IACRC,MAAAA,IAAO;AAAA,IACPC,cAAAA,IAAe;AAAA,IACfC,UAAAA,IAAW;AAAA,IACXC,WAAAA,IAAY;AAAA,MAP0BP,GAQnCQ,IAAAA,EARmCR,GAQnCQ;AAAAA,IAPHP;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA;AAGA,QAAME,IAAgBR,MAAS,SAAST,EAAWU,CAAI,IAAI;AAGzDQ,SAAAA,gBAAAA,EAAAC,cAAA,UAAAC,EAAA;AAAA,IACEX,MAAK;AAAA,IACLM,WAAW,yEAAyEE,CAAa,IAAIH,IAAWlB,EAAmBa,CAAI,IAAIT,EAAWS,CAAI,CAAC,IAAIM,CAAS;AAAA,EAAA,GACpKC,CAAK,GAERJ,KAAQC,MAAiB,UAAUK,gBAAAA,EAAAC,cAACE,GAAI;AAAA,IAACC,MAAMV;AAAAA,IAAMG,WAAU;AAAA,EAAA,CAAI,GACnEJ,GACAC,KAAQC,MAAiB,WAAWK,gBAAAA,EAAAC,cAACE,GAAI;AAAA,IAACC,MAAMV;AAAAA,IAAMG,WAAU;AAAA,EAAA,CAAI,CAC/D;AAEZ;"}
package/dist/index33.js CHANGED
@@ -1,36 +1,46 @@
1
- import e, { useState as o, useEffect as i } from "react";
2
- import { Icon as m } from "./index4.js";
3
- const f = ({
4
- renderAccordionContents: a,
5
- renderAccordionSrcElement: c,
6
- defaultOpen: n,
7
- className: r = ""
1
+ import e, { useState as d, useEffect as f } from "react";
2
+ import { Icon as c } from "./index4.js";
3
+ const g = ({
4
+ renderAccordionContents: o,
5
+ renderAccordionSrcElement: i,
6
+ defaultOpen: a,
7
+ className: l = "",
8
+ arrowPosition: n = "left",
9
+ contentClassName: m = ""
8
10
  }) => {
9
- const [t, s] = o(!1);
10
- return i(() => {
11
- s(n || !1);
12
- }, [n]), /* @__PURE__ */ e.createElement("div", {
13
- className: `se-design-accordion ${r}`
11
+ const [t, r] = d(!1);
12
+ f(() => {
13
+ r(a || !1);
14
+ }, [a]);
15
+ const s = () => n === "left" ? t ? "rotate-90" : "" : t ? "rotate-180" : "";
16
+ return /* @__PURE__ */ e.createElement("div", {
17
+ className: `se-design-accordion ${l}`
14
18
  }, /* @__PURE__ */ e.createElement("div", {
15
- className: "flex items-center cursor-pointer",
16
- onClick: () => s(!t)
19
+ className: "flex flex-col"
17
20
  }, /* @__PURE__ */ e.createElement("div", {
18
- className: `se-design-accordion-icon transform transition-transform duration-300 ${t ? "rotate-90" : ""}`
19
- }, /* @__PURE__ */ e.createElement(m, {
21
+ className: "flex items-center cursor-pointer",
22
+ onClick: () => r(!t)
23
+ }, n === "left" && /* @__PURE__ */ e.createElement("div", {
24
+ className: `se-design-accordion-icon transform transition-transform duration-300 ${s()}`
25
+ }, /* @__PURE__ */ e.createElement(c, {
20
26
  name: "rightSide"
21
27
  })), /* @__PURE__ */ e.createElement("div", {
22
28
  className: "se-design-accordion-elements flex-1"
23
29
  }, /* @__PURE__ */ e.createElement("div", {
24
- className: "se-design-accordion-src-element"
25
- }, c({
30
+ className: "se-design-accordion-src-element title"
31
+ }, i({
26
32
  isOpen: t
27
- })), t && /* @__PURE__ */ e.createElement("div", {
28
- className: "se-design-accordion-content transition-all duration-300 mt-1"
29
- }, a({
33
+ }))), n === "right" && /* @__PURE__ */ e.createElement("div", {
34
+ className: `se-design-accordion-icon transform transition-transform duration-300 ${s()}`
35
+ }, /* @__PURE__ */ e.createElement(c, {
36
+ name: "chevron-down"
37
+ }))), t && /* @__PURE__ */ e.createElement("div", {
38
+ className: `se-design-accordion-content transition-all duration-300 mt-1 ${m}`
39
+ }, o({
30
40
  isOpen: t
31
- })))));
41
+ }))));
32
42
  };
33
43
  export {
34
- f as CustomAccordion
44
+ g as CustomAccordion
35
45
  };
36
46
  //# sourceMappingURL=index33.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index33.js","sources":["../src/components/CustomAccordion/index.tsx"],"sourcesContent":["import React, { FC, useEffect, useState } from 'react';\nimport { Icon } from '../Icon';\n\nexport interface CustomAccordionProps {\n renderAccordionContents: (props: { isOpen: boolean }) => React.ReactNode;\n renderAccordionSrcElement: (props: { isOpen: boolean }) => React.ReactNode;\n defaultOpen?: boolean;\n className?: string;\n}\n\nexport const CustomAccordion: FC<CustomAccordionProps> = ({ renderAccordionContents, renderAccordionSrcElement, defaultOpen, className = '' }) => {\n const [isOpen, setIsOpen] = useState(false);\n useEffect(()=>{\n setIsOpen(defaultOpen || false)\n },[defaultOpen])\n\n return (\n <div className={`se-design-accordion ${className}`}>\n <div className='flex items-center cursor-pointer' onClick={() => setIsOpen(!isOpen)}>\n <div className={`se-design-accordion-icon transform transition-transform duration-300 ${isOpen ? 'rotate-90' : ''}`}>\n <Icon name=\"rightSide\" />\n </div>\n <div className='se-design-accordion-elements flex-1'>\n <div className='se-design-accordion-src-element'>{renderAccordionSrcElement({isOpen})}</div>\n {isOpen &&\n (<div className='se-design-accordion-content transition-all duration-300 mt-1'>\n {renderAccordionContents({isOpen})}\n </div>\n )}\n </div>\n </div>\n </div>\n );\n};\n"],"names":["CustomAccordion","renderAccordionContents","renderAccordionSrcElement","defaultOpen","className","isOpen","setIsOpen","useState","useEffect","React","createElement","onClick","Icon","name"],"mappings":";;AAUO,MAAMA,IAA4CA,CAAC;AAAA,EAAEC,yBAAAA;AAAAA,EAAyBC,2BAAAA;AAAAA,EAA2BC,aAAAA;AAAAA,EAAaC,WAAAA,IAAY;AAAG,MAAM;AAChJ,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAS,EAAK;AAC1CC,SAAAA,EAAU,MAAI;AACZF,IAAAA,EAAUH,KAAe,EAAK;AAAA,EAAA,GAC9B,CAACA,CAAW,CAAC,GAGbM,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKN,WAAW,uBAAuBA,CAAS;AAAA,EAAA,GAC9CM,gBAAAA,EAAAA,cAAA,OAAA;AAAA,IAAKN,WAAU;AAAA,IAAmCO,SAASA,MAAML,EAAU,CAACD,CAAM;AAAA,EAAA,GAChFK,gBAAAA,EAAAA,cAAA,OAAA;AAAA,IAAKN,WAAW,wEAAwEC,IAAS,cAAc,EAAE;AAAA,EAAA,GAC/GK,gBAAAA,EAAAA,cAACE,GAAI;AAAA,IAACC,MAAK;AAAA,EAAa,CAAA,CACrB,GACLJ,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKN,WAAU;AAAA,EAAA,GACbM,gBAAAA,EAAAA,cAAA,OAAA;AAAA,IAAKN,WAAU;AAAA,KAAmCF,EAA0B;AAAA,IAACG,QAAAA;AAAAA,EAAO,CAAA,CAAO,GAC1FA,KACEI,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKN,WAAU;AAAA,KACbH,EAAwB;AAAA,IAACI,QAAAA;AAAAA,EAAAA,CAAO,CAC9B,CAEJ,CACF,CACF;AAET;"}
1
+ {"version":3,"file":"index33.js","sources":["../src/components/CustomAccordion/index.tsx"],"sourcesContent":["import React, { FC, useEffect, useState } from 'react';\nimport { Icon } from '../Icon';\n\nexport interface CustomAccordionProps {\n renderAccordionContents: (props: { isOpen: boolean }) => React.ReactNode;\n renderAccordionSrcElement: (props: { isOpen: boolean }) => React.ReactNode;\n defaultOpen?: boolean;\n className?: string;\n arrowPosition?: 'left' | 'right';\n contentClassName?: string;\n}\n\nexport const CustomAccordion: FC<CustomAccordionProps> = ({ \n renderAccordionContents, \n renderAccordionSrcElement, \n defaultOpen, \n className = '',\n arrowPosition = 'left',\n contentClassName = ''\n}) => {\n const [isOpen, setIsOpen] = useState(false);\n useEffect(()=>{\n setIsOpen(defaultOpen || false)\n },[defaultOpen])\n\n const getArrowRotation = () => {\n if (arrowPosition === 'left') {\n return isOpen ? 'rotate-90' : '';\n }\n return isOpen ? 'rotate-180' : '';\n };\n\n return (\n <div className={`se-design-accordion ${className}`}>\n <div className=\"flex flex-col\">\n <div className=\"flex items-center cursor-pointer\" onClick={() => setIsOpen(!isOpen)}>\n {arrowPosition === 'left' && (\n <div className={`se-design-accordion-icon transform transition-transform duration-300 ${getArrowRotation()}`}>\n <Icon name=\"rightSide\" />\n </div>\n )}\n <div className=\"se-design-accordion-elements flex-1\">\n <div className=\"se-design-accordion-src-element title\">{renderAccordionSrcElement({isOpen})}</div>\n </div>\n {arrowPosition === 'right' && (\n <div className={`se-design-accordion-icon transform transition-transform duration-300 ${getArrowRotation()}`}>\n <Icon name=\"chevron-down\" />\n </div>\n )}\n </div>\n {isOpen && (\n <div className={`se-design-accordion-content transition-all duration-300 mt-1 ${contentClassName}`}>\n {renderAccordionContents({isOpen})}\n </div>\n )}\n </div>\n </div>\n );\n};\n"],"names":["CustomAccordion","renderAccordionContents","renderAccordionSrcElement","defaultOpen","className","arrowPosition","contentClassName","isOpen","setIsOpen","useState","useEffect","getArrowRotation","React","createElement","onClick","Icon","name"],"mappings":";;AAYO,MAAMA,IAA4CA,CAAC;AAAA,EACxDC,yBAAAA;AAAAA,EACAC,2BAAAA;AAAAA,EACAC,aAAAA;AAAAA,EACAC,WAAAA,IAAY;AAAA,EACZC,eAAAA,IAAgB;AAAA,EAChBC,kBAAAA,IAAmB;AACrB,MAAM;AACJ,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAS,EAAK;AAC1CC,EAAAA,EAAU,MAAI;AACZF,IAAAA,EAAUL,KAAe,EAAK;AAAA,EAAA,GAC9B,CAACA,CAAW,CAAC;AAEf,QAAMQ,IAAmBA,MACnBN,MAAkB,SACbE,IAAS,cAAc,KAEzBA,IAAS,eAAe;AAI/BK,SAAAA,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKT,WAAW,uBAAuBA,CAAS;AAAA,EAAA,GAC9CS,gBAAAA,EAAAA,cAAA,OAAA;AAAA,IAAKT,WAAU;AAAA,EAAA,GACbS,gBAAAA,EAAAA,cAAA,OAAA;AAAA,IAAKT,WAAU;AAAA,IAAmCU,SAASA,MAAMN,EAAU,CAACD,CAAM;AAAA,EAC/EF,GAAAA,MAAkB,UACjBO,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKT,WAAW,wEAAwEO,GAAkB;AAAA,EAAA,GACxGE,gBAAAA,EAAAA,cAACE,GAAI;AAAA,IAACC,MAAK;AAAA,EAAa,CAAA,CACrB,GAEPJ,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKT,WAAU;AAAA,EAAA,GACbS,gBAAAA,EAAAA,cAAA,OAAA;AAAA,IAAKT,WAAU;AAAA,KAAyCF,EAA0B;AAAA,IAACK,QAAAA;AAAAA,EAAAA,CAAO,CAAO,CAC9F,GACJF,MAAkB,WACjBO,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKT,WAAW,wEAAwEO,GAAkB;AAAA,EAAA,GACxGE,gBAAAA,EAAAA,cAACE,GAAI;AAAA,IAACC,MAAK;AAAA,EAAgB,CAAA,CACxB,CAEJ,GACJT,KACCK,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKT,WAAW,gEAAgEE,CAAgB;AAAA,KAC7FL,EAAwB;AAAA,IAACM,QAAAA;AAAAA,EAAO,CAAA,CAC9B,CAEJ,CACF;AAET;"}
package/dist/index36.js CHANGED
@@ -1,37 +1,81 @@
1
- import e from "react";
1
+ import a, { useState as h, useRef as H, useEffect as s, useMemo as _ } from "react";
2
+ import { Icon as g } from "./index4.js";
3
+ import { LabelChip as $ } from "./index8.js";
4
+ import { debounce as z } from "./index124.js";
2
5
  /* empty css */
3
- const r = {
4
- progressBarCtn: "flex items-center gap-2",
5
- progressBar: "flex-1 w-[70%] bg-[var(--color-gray-200)] h-[6px] rounded-[12px] overflow-hidden",
6
- progressBarProgress: "h-full rounded-[12px]",
7
- stepsCount: "steps-count"
8
- }, d = ({
9
- totalTasks: t = 0,
10
- completedTasks: o = 0,
11
- progressBarCtnClassName: n = "",
12
- needPercentageCompleted: c = !0,
13
- progressBarColor: s
14
- }) => {
15
- const a = t > 0 ? o / t * 100 : 0;
16
- return /* @__PURE__ */ e.createElement("div", {
17
- className: `${r.progressBarCtn} ${n} progress-bar-ctn`,
6
+ function T(r) {
7
+ const {
8
+ disabled: C = !1,
9
+ placeholder: S = "Search",
10
+ debounceDuration: f = 500,
11
+ onInputChange: l = () => {
12
+ },
13
+ onSearchClear: k = () => {
14
+ },
15
+ updateSearchString: i = "",
16
+ collapsible: p = !1,
17
+ width: v = "200px",
18
+ chips: m = []
19
+ } = r, [t, d] = h(""), [o, b] = h(!(r != null && r.collapsible)), [n, x] = h(m || []), c = H(null);
20
+ s(() => {
21
+ o && c.current && setTimeout(() => {
22
+ var e;
23
+ return (e = c == null ? void 0 : c.current) == null ? void 0 : e.focus();
24
+ }, 0);
25
+ }, [o]), s(() => {
26
+ i !== t && d(i);
27
+ }, [i]), s(() => {
28
+ x(m);
29
+ }, [m]);
30
+ const u = _(() => z(l, f), [l, f]);
31
+ s(() => () => {
32
+ u.cancel();
33
+ }, [u]);
34
+ const I = (e) => {
35
+ d(e), u(e);
36
+ }, N = () => {
37
+ d(""), l(""), k();
38
+ }, w = () => {
39
+ p && (t == null ? void 0 : t.trimEnd()) === "" && b(!1);
40
+ }, y = (e) => {
41
+ x(n.filter((B) => B !== e));
42
+ }, E = (n == null ? void 0 : n.length) > 0;
43
+ return /* @__PURE__ */ a.createElement("div", {
44
+ className: `se-search-box ${o ? "expand-box" : "shrink-box"}`,
18
45
  style: {
19
- width: "100%"
46
+ width: v
20
47
  }
21
- }, /* @__PURE__ */ e.createElement("div", {
22
- className: r.progressBar
23
- }, /* @__PURE__ */ e.createElement("div", {
24
- className: r.progressBarProgress,
25
- style: {
26
- width: `${a}%`,
27
- background: `${s || "linear-gradient(to right, var(--color-green-500), var(--color-green-400))"}`,
28
- transition: "width 0.4s ease-in-out"
29
- }
30
- })), c && /* @__PURE__ */ e.createElement("div", {
31
- className: r.stepsCount
32
- }, `${Math.round(a)}% completed`));
33
- };
48
+ }, o && /* @__PURE__ */ a.createElement("div", {
49
+ className: `chips-and-search-box-container${E ? " has-chips" : ""}`
50
+ }, E && (n == null ? void 0 : n.map((e) => /* @__PURE__ */ a.createElement($, {
51
+ key: e,
52
+ label: e,
53
+ icon: "close",
54
+ onIconClick: () => y(e),
55
+ size: "sm"
56
+ }))), /* @__PURE__ */ a.createElement("div", {
57
+ className: "search-input-container"
58
+ }, /* @__PURE__ */ a.createElement(g, {
59
+ name: "search",
60
+ className: "search-icon img-wrap",
61
+ onClick: () => p && b((e) => !e)
62
+ }), /* @__PURE__ */ a.createElement("input", {
63
+ ref: c,
64
+ className: "search-input border-transparent focus:border-transparent active:border-transparent focus:ring-0",
65
+ id: "search_bar",
66
+ type: "text",
67
+ placeholder: S,
68
+ onChange: (e) => I(e.target.value),
69
+ value: t,
70
+ disabled: C,
71
+ onBlur: w
72
+ }), !!t && /* @__PURE__ */ a.createElement(g, {
73
+ name: "close",
74
+ className: "cross-icon img-wrap",
75
+ onClick: N
76
+ }))));
77
+ }
34
78
  export {
35
- d as ProgressBar
79
+ T as SearchBox
36
80
  };
37
81
  //# sourceMappingURL=index36.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index36.js","sources":["../src/components/ProgressBar/index.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { Map } from '../../utils/common.types';\nimport './style.scss';\n\nexport interface ProgressBarProps {\n totalTasks: number;\n completedTasks: number;\n progressBarCtnClassName?: string;\n needPercentageCompleted?: boolean;\n progressBarColor?: string;\n}\n\nconst className: Map = {\n progressBarCtn: 'flex items-center gap-2',\n progressBar: 'flex-1 w-[70%] bg-[var(--color-gray-200)] h-[6px] rounded-[12px] overflow-hidden',\n progressBarProgress: 'h-full rounded-[12px]',\n stepsCount: 'steps-count'\n};\n\nexport const ProgressBar: FC<ProgressBarProps> = ({\n totalTasks = 0,\n completedTasks = 0,\n progressBarCtnClassName = '',\n needPercentageCompleted = true,\n progressBarColor\n}) => {\n const percentageComplete = totalTasks > 0 ? (completedTasks / totalTasks) * 100 : 0;\n return (\n <div\n className={`${className.progressBarCtn} ${progressBarCtnClassName} progress-bar-ctn`}\n style={{ width: '100%' }}\n >\n <div className={className.progressBar}>\n <div\n className={className.progressBarProgress}\n style={{\n width: `${percentageComplete}%`,\n background: `${progressBarColor ? progressBarColor : 'linear-gradient(to right, var(--color-green-500), var(--color-green-400))'}`,\n transition: 'width 0.4s ease-in-out'\n }}\n ></div>\n </div>\n {needPercentageCompleted && (\n <div className={className.stepsCount}>{`${Math.round(percentageComplete)}% completed`}</div>\n )}\n </div>\n );\n};\n"],"names":["React__default","className","progressBarCtn","progressBar","progressBarProgress","stepsCount","ProgressBar","totalTasks","completedTasks","progressBarCtnClassName","needPercentageCompleted","progressBarColor","percentageComplete","React","createElement","style","width","background","transition","Math","round"],"mappings":"AAYA,OAAAA,OAAA;AAAA,OAAA;AAAA,MAAMC,IAAiB;AAAA,EACrBC,gBAAgB;AAAA,EAChBC,aAAa;AAAA,EACbC,qBAAqB;AAAA,EACrBC,YAAY;AACd,GAEaC,IAAoCA,CAAC;AAAA,EAChDC,YAAAA,IAAa;AAAA,EACbC,gBAAAA,IAAiB;AAAA,EACjBC,yBAAAA,IAA0B;AAAA,EAC1BC,yBAAAA,IAA0B;AAAA,EAC1BC,kBAAAA;AACF,MAAM;AACJ,QAAMC,IAAqBL,IAAa,IAAKC,IAAiBD,IAAc,MAAM;AAEhFM,SAAAA,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IACEb,WAAW,GAAGA,EAAUC,cAAc,IAAIO,CAAuB;AAAA,IACjEM,OAAO;AAAA,MAAEC,OAAO;AAAA,IAAA;AAAA,EAAO,GAEvBF,gBAAAA,EAAAA,cAAA,OAAA;AAAA,IAAKb,WAAWA,EAAUE;AAAAA,EAAAA,GACxBW,gBAAAA,EAAAA,cAAA,OAAA;AAAA,IACEb,WAAWA,EAAUG;AAAAA,IACrBW,OAAO;AAAA,MACLC,OAAO,GAAGJ,CAAkB;AAAA,MAC5BK,YAAY,GAAGN,KAAsC,2EAA2E;AAAA,MAChIO,YAAY;AAAA,IAAA;AAAA,EAEV,CAAA,CACH,GACJR,KACCG,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKb,WAAWA,EAAUI;AAAAA,EAAAA,GAAa,GAAGc,KAAKC,MAAMR,CAAkB,CAAC,aAAmB,CAE1F;AAET;"}
1
+ {"version":3,"file":"index36.js","sources":["../src/components/SearchBox/index.tsx"],"sourcesContent":["import React, { useState, useMemo, useEffect, useRef } from 'react';\n\nimport { Icon } from 'components/Icon';\nimport { LabelChip } from 'components/LabelChip';\nimport { debounce } from 'utils/debounce';\n\nimport './style.scss';\n\nexport interface SearchBoxProps {\n disabled?: boolean,\n placeholder?: string,\n debounceDuration?: number,\n onInputChange?: (value: string) => void,\n onSearchClear?: () => void,\n updateSearchString?: string,\n collapsible?: boolean,\n width?: string,\n chips?: string[]\n}\n\nexport function SearchBox(props: SearchBoxProps) {\n const {\n disabled = false,\n placeholder = 'Search',\n debounceDuration = 500,\n onInputChange = () => {},\n onSearchClear = () => {},\n updateSearchString = '',\n collapsible = false,\n width = '200px',\n chips = []\n } = props;\n const [inputValue, setInputValue] = useState('');\n const [isExpanded, setIsExpanded] = useState(!props?.collapsible);\n const [searchChips, setSearchChips] = useState<string[]>(chips || []);\n const inputRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (isExpanded && inputRef.current) {\n setTimeout(() => inputRef?.current?.focus(), 0);\n }\n }, [isExpanded]);\n \n // Manually update the searchbox text\n useEffect(() => {\n if (updateSearchString !== inputValue) {\n setInputValue(updateSearchString);\n }\n }, [updateSearchString]);\n\n useEffect(() => {\n setSearchChips(chips);\n }, [chips]);\n\n \n \n const debouncedOnInputChange = useMemo(\n () => debounce(onInputChange, debounceDuration),\n [onInputChange, debounceDuration]\n );\n\n useEffect(() => {\n return () => {\n debouncedOnInputChange.cancel();\n };\n }, [debouncedOnInputChange]);\n\n\n const onChangeHandler = (value: string) => {\n setInputValue(value);\n debouncedOnInputChange(value);\n };\n\n const iconClickHandler = () => {\n setInputValue('');\n onInputChange('');\n onSearchClear();\n };\n\n const onBlurHandler = () => {\n if (collapsible && inputValue?.trimEnd() === '') {\n setIsExpanded(false);\n }\n };\n\n const removeChip = (chip: string) => {\n setSearchChips(searchChips.filter((c) => c !== chip));\n }\n\n const hasChips = searchChips?.length > 0;\n\n return (\n <div className={`se-search-box ${isExpanded ? 'expand-box' : 'shrink-box'}`} style={{ width: width }}>\n {/* <Icon name=\"search\" className=\"search-icon img-wrap\" onClick={() => collapsible && setIsExpanded((prev) => !prev)} /> */}\n {isExpanded && (\n <div className={`chips-and-search-box-container${hasChips ? ' has-chips' : ''}`}>\n {hasChips && searchChips?.map((chip) => (\n <LabelChip key={chip} label={chip} icon=\"close\" onIconClick={() => removeChip(chip)} size=\"sm\" />\n ))}\n <div className=\"search-input-container\">\n <Icon name=\"search\" className=\"search-icon img-wrap\" onClick={() => collapsible && setIsExpanded((prev) => !prev)} />\n <input\n ref={inputRef}\n className={`search-input border-transparent focus:border-transparent active:border-transparent focus:ring-0`}\n id=\"search_bar\"\n type=\"text\"\n placeholder={placeholder}\n onChange={(e) => onChangeHandler(e.target.value)}\n value={inputValue}\n disabled={disabled}\n onBlur={onBlurHandler}\n />\n {!!inputValue && (\n <Icon\n name=\"close\"\n className=\"cross-icon img-wrap\"\n onClick={iconClickHandler}\n />\n )}\n </div>\n </div>\n )}\n </div>\n );\n}\n"],"names":["SearchBox","props","disabled","placeholder","debounceDuration","onInputChange","onSearchClear","updateSearchString","collapsible","width","chips","inputValue","setInputValue","useState","isExpanded","setIsExpanded","searchChips","setSearchChips","inputRef","useRef","useEffect","current","setTimeout","focus","debouncedOnInputChange","useMemo","debounce","cancel","onChangeHandler","value","iconClickHandler","onBlurHandler","trimEnd","removeChip","chip","filter","c","hasChips","length","React","createElement","className","style","map","LabelChip","key","label","icon","onIconClick","size","Icon","name","onClick","prev","ref","id","type","onChange","e","target","onBlur"],"mappings":"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"}