sprint-asia-custom-component 0.1.24 → 0.1.26
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.
- package/dist/index.js +101 -43
- package/package.json +1 -1
- package/src/components/alert/index.js +9 -2
- package/src/components/description/index.js +12 -0
- package/src/components/dropdown/dropdownText/index.js +31 -26
- package/src/components/filter/filterDropdown/index.js +10 -6
- package/src/components/footer/index.js +35 -0
- package/src/components/searchdropdown/index.js +3 -3
- package/src/components/switch/index.js +1 -1
- package/src/components/textinput/index.js +10 -8
- package/src/index.js +2 -1
- package/src/templates/index.js +7 -1
package/dist/index.js
CHANGED
|
@@ -99,7 +99,7 @@
|
|
|
99
99
|
}
|
|
100
100
|
|
|
101
101
|
// THIS FILE IS AUTO GENERATED
|
|
102
|
-
function PiCalendarDuotone(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M216,48V88H40V48a8,8,0,0,1,8-8H208A8,8,0,0,1,216,48Z","opacity":"0.2"}},{"tag":"path","attr":{"d":"M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Zm-96-88v64a8,8,0,0,1-16,0V132.94l-4.42,2.22a8,8,0,0,1-7.16-14.32l16-8A8,8,0,0,1,112,120Zm59.16,30.45L152,176h16a8,8,0,0,1,0,16H136a8,8,0,0,1-6.4-12.8l28.78-38.37A8,8,0,1,0,145.07,132a8,8,0,1,1-13.85-8A24,24,0,0,1,176,136,23.76,23.76,0,0,1,171.16,150.45Z"}}]})(props);}function PiDownloadSimpleDuotone(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M168,112l-40,40L88,112Z","opacity":"0.2"}},{"tag":"path","attr":{"d":"M224,152v56a16,16,0,0,1-16,16H48a16,16,0,0,1-16-16V152a8,8,0,0,1,16,0v56H208V152a8,8,0,0,1,16,0ZM82.34,117.66A8,8,0,0,1,88,104h32V40a8,8,0,0,1,16,0v64h32a8,8,0,0,1,5.66,13.66l-40,40a8,8,0,0,1-11.32,0Zm25,2.34L128,140.69,148.69,120Z"}}]})(props);}function PiEyeDuotone(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M128,56C48,56,16,128,16,128s32,72,112,72,112-72,112-72S208,56,128,56Zm0,112a40,40,0,1,1,40-40A40,40,0,0,1,128,168Z","opacity":"0.2"}},{"tag":"path","attr":{"d":"M247.31,124.76c-.35-.79-8.82-19.58-27.65-38.41C194.57,61.26,162.88,48,128,48S61.43,61.26,36.34,86.35C17.51,105.18,9,124,8.69,124.76a8,8,0,0,0,0,6.5c.35.79,8.82,19.57,27.65,38.4C61.43,194.74,93.12,208,128,208s66.57-13.26,91.66-38.34c18.83-18.83,27.3-37.61,27.65-38.4A8,8,0,0,0,247.31,124.76ZM128,192c-30.78,0-57.67-11.19-79.93-33.25A133.47,133.47,0,0,1,25,128,133.33,133.33,0,0,1,48.07,97.25C70.33,75.19,97.22,64,128,64s57.67,11.19,79.93,33.25A133.46,133.46,0,0,1,231.05,128C223.84,141.46,192.43,192,128,192Zm0-112a48,48,0,1,0,48,48A48.05,48.05,0,0,0,128,80Zm0,80a32,32,0,1,1,32-32A32,32,0,0,1,128,160Z"}}]})(props);}function PiFileArrowUpDuotone(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M208,88H152V32Z","opacity":"0.2"}},{"tag":"path","attr":{"d":"M213.66,82.34l-56-56A8,8,0,0,0,152,24H56A16,16,0,0,0,40,40V216a16,16,0,0,0,16,16H200a16,16,0,0,0,16-16V88A8,8,0,0,0,213.66,82.34ZM160,51.31,188.69,80H160ZM200,216H56V40h88V88a8,8,0,0,0,8,8h48V216Zm-42.34-77.66a8,8,0,0,1-11.32,11.32L136,139.31V184a8,8,0,0,1-16,0V139.31l-10.34,10.35a8,8,0,0,1-11.32-11.32l24-24a8,8,0,0,1,11.32,0Z"}}]})(props);}function PiFunnelDuotone(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M221.9,61.38l-67.74,72.31a8,8,0,0,0-2.16,5.47v55.49a8,8,0,0,1-3.56,6.66l-32,21.33A8,8,0,0,1,104,216V139.16a8,8,0,0,0-2.16-5.47L34.1,61.38A8,8,0,0,1,40,48H216A8,8,0,0,1,221.9,61.38Z","opacity":"0.2"}},{"tag":"path","attr":{"d":"M230.6,49.53A15.81,15.81,0,0,0,216,40H40A16,16,0,0,0,28.19,66.76l.08.09L96,139.17V216a16,16,0,0,0,24.87,13.32l32-21.34A16,16,0,0,0,160,194.66V139.17l67.74-72.32.08-.09A15.8,15.8,0,0,0,230.6,49.53ZM40,56h0Zm108.34,72.28A15.92,15.92,0,0,0,144,139.17v55.49L112,216V139.17a15.92,15.92,0,0,0-4.32-10.94L40,56H216Z"}}]})(props);}function PiInfoDuotone(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M224,128a96,96,0,1,1-96-96A96,96,0,0,1,224,128Z","opacity":"0.2"}},{"tag":"path","attr":{"d":"M144,176a8,8,0,0,1-8,8,16,16,0,0,1-16-16V128a8,8,0,0,1,0-16,16,16,0,0,1,16,16v40A8,8,0,0,1,144,176Zm88-48A104,104,0,1,1,128,24,104.11,104.11,0,0,1,232,128Zm-16,0a88,88,0,1,0-88,88A88.1,88.1,0,0,0,216,128ZM124,96a12,12,0,1,0-12-12A12,12,0,0,0,124,96Z"}}]})(props);}function PiMagnifyingGlassDuotone(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M192,112a80,80,0,1,1-80-80A80,80,0,0,1,192,112Z","opacity":"0.2"}},{"tag":"path","attr":{"d":"M229.66,218.34,179.6,168.28a88.21,88.21,0,1,0-11.32,11.31l50.06,50.07a8,8,0,0,0,11.32-11.32ZM40,112a72,72,0,1,1,72,72A72.08,72.08,0,0,1,40,112Z"}}]})(props);}function PiFileTextFill(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M213.66,82.34l-56-56A8,8,0,0,0,152,24H56A16,16,0,0,0,40,40V216a16,16,0,0,0,16,16H200a16,16,0,0,0,16-16V88A8,8,0,0,0,213.66,82.34ZM160,176H96a8,8,0,0,1,0-16h64a8,8,0,0,1,0,16Zm0-32H96a8,8,0,0,1,0-16h64a8,8,0,0,1,0,16Zm-8-56V44l44,44Z"}}]})(props);}function PiInfoFill(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm-4,48a12,12,0,1,1-12,12A12,12,0,0,1,124,72Zm12,112a16,16,0,0,1-16-16V128a8,8,0,0,1,0-16,16,16,0,0,1,16,16v40a8,8,0,0,1,0,16Z"}}]})(props);}function PiReceiptFill(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M216,40H40A16,16,0,0,0,24,56V208a8,8,0,0,0,11.58,7.15L64,200.94l28.42,14.21a8,8,0,0,0,7.16,0L128,200.94l28.42,14.21a8,8,0,0,0,7.16,0L192,200.94l28.42,14.21A8,8,0,0,0,232,208V56A16,16,0,0,0,216,40ZM176,144H80a8,8,0,0,1,0-16h96a8,8,0,0,1,0,16Zm0-32H80a8,8,0,0,1,0-16h96a8,8,0,0,1,0,16Z"}}]})(props);}function PiShoppingBagFill(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M216,40H40A16,16,0,0,0,24,56V200a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V56A16,16,0,0,0,216,40Zm-88,96A48.05,48.05,0,0,1,80,88a8,8,0,0,1,16,0,32,32,0,0,0,64,0,8,8,0,0,1,16,0A48.05,48.05,0,0,1,128,136Z"}}]})(props);}function PiWalletFill(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M216,72H56a8,8,0,0,1,0-16H192a8,8,0,0,0,0-16H56A24,24,0,0,0,32,64V192a24,24,0,0,0,24,24H216a16,16,0,0,0,16-16V88A16,16,0,0,0,216,72Zm-36,80a12,12,0,1,1,12-12A12,12,0,0,1,180,152Z"}}]})(props);}function PiEyeClosedLight(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M229.21,165a6,6,0,0,1-10.42,6l-20-35.08a122,122,0,0,1-39,18.09l6.17,37a6,6,0,0,1-4.93,6.91,6.85,6.85,0,0,1-1,.08,6,6,0,0,1-5.91-5L148,156.44a128.86,128.86,0,0,1-40,0L101.92,193A6,6,0,0,1,96,198a6.85,6.85,0,0,1-1-.08A6,6,0,0,1,90.08,191l6.17-37a122,122,0,0,1-39-18.09L37.21,171a6,6,0,1,1-10.42-6l20.85-36.48a152,152,0,0,1-20.31-20.77,6,6,0,0,1,9.34-7.54C53.54,121.11,83.07,146,128,146s74.46-24.89,91.33-45.77a6,6,0,0,1,9.34,7.54,152,152,0,0,1-20.31,20.77Z"}}]})(props);}function PiArchive(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M224,48H32A16,16,0,0,0,16,64V88a16,16,0,0,0,16,16v88a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V104a16,16,0,0,0,16-16V64A16,16,0,0,0,224,48ZM208,192H48V104H208ZM224,88H32V64H224V88ZM96,136a8,8,0,0,1,8-8h48a8,8,0,0,1,0,16H104A8,8,0,0,1,96,136Z"}}]})(props);}function PiCaretDown(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M213.66,101.66l-80,80a8,8,0,0,1-11.32,0l-80-80A8,8,0,0,1,53.66,90.34L128,164.69l74.34-74.35a8,8,0,0,1,11.32,11.32Z"}}]})(props);}function PiCaretLeft(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M165.66,202.34a8,8,0,0,1-11.32,11.32l-80-80a8,8,0,0,1,0-11.32l80-80a8,8,0,0,1,11.32,11.32L91.31,128Z"}}]})(props);}function PiCaretRight(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M181.66,133.66l-80,80a8,8,0,0,1-11.32-11.32L164.69,128,90.34,53.66a8,8,0,0,1,11.32-11.32l80,80A8,8,0,0,1,181.66,133.66Z"}}]})(props);}function PiCaretUp(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M213.66,165.66a8,8,0,0,1-11.32,0L128,91.31,53.66,165.66a8,8,0,0,1-11.32-11.32l80-80a8,8,0,0,1,11.32,0l80,80A8,8,0,0,1,213.66,165.66Z"}}]})(props);}function PiClock(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216Zm64-88a8,8,0,0,1-8,8H128a8,8,0,0,1-8-8V72a8,8,0,0,1,16,0v48h48A8,8,0,0,1,192,128Z"}}]})(props);}function PiFileArrowDown(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M213.66,82.34l-56-56A8,8,0,0,0,152,24H56A16,16,0,0,0,40,40V216a16,16,0,0,0,16,16H200a16,16,0,0,0,16-16V88A8,8,0,0,0,213.66,82.34ZM160,51.31,188.69,80H160ZM200,216H56V40h88V88a8,8,0,0,0,8,8h48V216Zm-42.34-61.66a8,8,0,0,1,0,11.32l-24,24a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L120,164.69V120a8,8,0,0,1,16,0v44.69l10.34-10.35A8,8,0,0,1,157.66,154.34Z"}}]})(props);}function PiFunnel(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M230.6,49.53A15.81,15.81,0,0,0,216,40H40A16,16,0,0,0,28.19,66.76l.08.09L96,139.17V216a16,16,0,0,0,24.87,13.32l32-21.34A16,16,0,0,0,160,194.66V139.17l67.74-72.32.08-.09A15.8,15.8,0,0,0,230.6,49.53ZM40,56h0Zm108.34,72.28A15.92,15.92,0,0,0,144,139.17v55.49L112,216V139.17a15.92,15.92,0,0,0-4.32-10.94L40,56H216Z"}}]})(props);}function PiImage(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M216,40H40A16,16,0,0,0,24,56V200a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V56A16,16,0,0,0,216,40Zm0,16V158.75l-26.07-26.06a16,16,0,0,0-22.63,0l-20,20-44-44a16,16,0,0,0-22.62,0L40,149.37V56ZM40,172l52-52,80,80H40Zm176,28H194.63l-36-36,20-20L216,181.38V200ZM144,100a12,12,0,1,1,12,12A12,12,0,0,1,144,100Z"}}]})(props);}function PiMagnifyingGlass(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M229.66,218.34l-50.07-50.06a88.11,88.11,0,1,0-11.31,11.31l50.06,50.07a8,8,0,0,0,11.32-11.32ZM40,112a72,72,0,1,1,72,72A72.08,72.08,0,0,1,40,112Z"}}]})(props);}function PiNotePencil(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M229.66,58.34l-32-32a8,8,0,0,0-11.32,0l-96,96A8,8,0,0,0,88,128v32a8,8,0,0,0,8,8h32a8,8,0,0,0,5.66-2.34l96-96A8,8,0,0,0,229.66,58.34ZM124.69,152H104V131.31l64-64L188.69,88ZM200,76.69,179.31,56,192,43.31,212.69,64ZM224,120v88a16,16,0,0,1-16,16H48a16,16,0,0,1-16-16V48A16,16,0,0,1,48,32h88a8,8,0,0,1,0,16H48V208H208V120a8,8,0,0,1,16,0Z"}}]})(props);}function PiPlus(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M224,128a8,8,0,0,1-8,8H136v80a8,8,0,0,1-16,0V136H40a8,8,0,0,1,0-16h80V40a8,8,0,0,1,16,0v80h80A8,8,0,0,1,224,128Z"}}]})(props);}function PiTrash(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M216,48H176V40a24,24,0,0,0-24-24H104A24,24,0,0,0,80,40v8H40a8,8,0,0,0,0,16h8V208a16,16,0,0,0,16,16H192a16,16,0,0,0,16-16V64h8a8,8,0,0,0,0-16ZM96,40a8,8,0,0,1,8-8h48a8,8,0,0,1,8,8v8H96Zm96,168H64V64H192ZM112,104v64a8,8,0,0,1-16,0V104a8,8,0,0,1,16,0Zm48,0v64a8,8,0,0,1-16,0V104a8,8,0,0,1,16,0Z"}}]})(props);}function PiUser(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M230.92,212c-15.23-26.33-38.7-45.21-66.09-54.16a72,72,0,1,0-73.66,0C63.78,166.78,40.31,185.66,25.08,212a8,8,0,1,0,13.85,8c18.84-32.56,52.14-52,89.07-52s70.23,19.44,89.07,52a8,8,0,1,0,13.85-8ZM72,96a56,56,0,1,1,56,56A56.06,56.06,0,0,1,72,96Z"}}]})(props);}
|
|
102
|
+
function PiCalendarDuotone(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M216,48V88H40V48a8,8,0,0,1,8-8H208A8,8,0,0,1,216,48Z","opacity":"0.2"}},{"tag":"path","attr":{"d":"M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Zm-96-88v64a8,8,0,0,1-16,0V132.94l-4.42,2.22a8,8,0,0,1-7.16-14.32l16-8A8,8,0,0,1,112,120Zm59.16,30.45L152,176h16a8,8,0,0,1,0,16H136a8,8,0,0,1-6.4-12.8l28.78-38.37A8,8,0,1,0,145.07,132a8,8,0,1,1-13.85-8A24,24,0,0,1,176,136,23.76,23.76,0,0,1,171.16,150.45Z"}}]})(props);}function PiDownloadSimpleDuotone(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M168,112l-40,40L88,112Z","opacity":"0.2"}},{"tag":"path","attr":{"d":"M224,152v56a16,16,0,0,1-16,16H48a16,16,0,0,1-16-16V152a8,8,0,0,1,16,0v56H208V152a8,8,0,0,1,16,0ZM82.34,117.66A8,8,0,0,1,88,104h32V40a8,8,0,0,1,16,0v64h32a8,8,0,0,1,5.66,13.66l-40,40a8,8,0,0,1-11.32,0Zm25,2.34L128,140.69,148.69,120Z"}}]})(props);}function PiFileArrowUpDuotone(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M208,88H152V32Z","opacity":"0.2"}},{"tag":"path","attr":{"d":"M213.66,82.34l-56-56A8,8,0,0,0,152,24H56A16,16,0,0,0,40,40V216a16,16,0,0,0,16,16H200a16,16,0,0,0,16-16V88A8,8,0,0,0,213.66,82.34ZM160,51.31,188.69,80H160ZM200,216H56V40h88V88a8,8,0,0,0,8,8h48V216Zm-42.34-77.66a8,8,0,0,1-11.32,11.32L136,139.31V184a8,8,0,0,1-16,0V139.31l-10.34,10.35a8,8,0,0,1-11.32-11.32l24-24a8,8,0,0,1,11.32,0Z"}}]})(props);}function PiFunnelDuotone(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M221.9,61.38l-67.74,72.31a8,8,0,0,0-2.16,5.47v55.49a8,8,0,0,1-3.56,6.66l-32,21.33A8,8,0,0,1,104,216V139.16a8,8,0,0,0-2.16-5.47L34.1,61.38A8,8,0,0,1,40,48H216A8,8,0,0,1,221.9,61.38Z","opacity":"0.2"}},{"tag":"path","attr":{"d":"M230.6,49.53A15.81,15.81,0,0,0,216,40H40A16,16,0,0,0,28.19,66.76l.08.09L96,139.17V216a16,16,0,0,0,24.87,13.32l32-21.34A16,16,0,0,0,160,194.66V139.17l67.74-72.32.08-.09A15.8,15.8,0,0,0,230.6,49.53ZM40,56h0Zm108.34,72.28A15.92,15.92,0,0,0,144,139.17v55.49L112,216V139.17a15.92,15.92,0,0,0-4.32-10.94L40,56H216Z"}}]})(props);}function PiInfoDuotone(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M224,128a96,96,0,1,1-96-96A96,96,0,0,1,224,128Z","opacity":"0.2"}},{"tag":"path","attr":{"d":"M144,176a8,8,0,0,1-8,8,16,16,0,0,1-16-16V128a8,8,0,0,1,0-16,16,16,0,0,1,16,16v40A8,8,0,0,1,144,176Zm88-48A104,104,0,1,1,128,24,104.11,104.11,0,0,1,232,128Zm-16,0a88,88,0,1,0-88,88A88.1,88.1,0,0,0,216,128ZM124,96a12,12,0,1,0-12-12A12,12,0,0,0,124,96Z"}}]})(props);}function PiMagnifyingGlassDuotone(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M192,112a80,80,0,1,1-80-80A80,80,0,0,1,192,112Z","opacity":"0.2"}},{"tag":"path","attr":{"d":"M229.66,218.34,179.6,168.28a88.21,88.21,0,1,0-11.32,11.31l50.06,50.07a8,8,0,0,0,11.32-11.32ZM40,112a72,72,0,1,1,72,72A72.08,72.08,0,0,1,40,112Z"}}]})(props);}function PiFileTextFill(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M213.66,82.34l-56-56A8,8,0,0,0,152,24H56A16,16,0,0,0,40,40V216a16,16,0,0,0,16,16H200a16,16,0,0,0,16-16V88A8,8,0,0,0,213.66,82.34ZM160,176H96a8,8,0,0,1,0-16h64a8,8,0,0,1,0,16Zm0-32H96a8,8,0,0,1,0-16h64a8,8,0,0,1,0,16Zm-8-56V44l44,44Z"}}]})(props);}function PiInfoFill(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm-4,48a12,12,0,1,1-12,12A12,12,0,0,1,124,72Zm12,112a16,16,0,0,1-16-16V128a8,8,0,0,1,0-16,16,16,0,0,1,16,16v40a8,8,0,0,1,0,16Z"}}]})(props);}function PiReceiptFill(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M216,40H40A16,16,0,0,0,24,56V208a8,8,0,0,0,11.58,7.15L64,200.94l28.42,14.21a8,8,0,0,0,7.16,0L128,200.94l28.42,14.21a8,8,0,0,0,7.16,0L192,200.94l28.42,14.21A8,8,0,0,0,232,208V56A16,16,0,0,0,216,40ZM176,144H80a8,8,0,0,1,0-16h96a8,8,0,0,1,0,16Zm0-32H80a8,8,0,0,1,0-16h96a8,8,0,0,1,0,16Z"}}]})(props);}function PiShoppingBagFill(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M216,40H40A16,16,0,0,0,24,56V200a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V56A16,16,0,0,0,216,40Zm-88,96A48.05,48.05,0,0,1,80,88a8,8,0,0,1,16,0,32,32,0,0,0,64,0,8,8,0,0,1,16,0A48.05,48.05,0,0,1,128,136Z"}}]})(props);}function PiWalletFill(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M216,72H56a8,8,0,0,1,0-16H192a8,8,0,0,0,0-16H56A24,24,0,0,0,32,64V192a24,24,0,0,0,24,24H216a16,16,0,0,0,16-16V88A16,16,0,0,0,216,72Zm-36,80a12,12,0,1,1,12-12A12,12,0,0,1,180,152Z"}}]})(props);}function PiEyeClosedLight(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M229.21,165a6,6,0,0,1-10.42,6l-20-35.08a122,122,0,0,1-39,18.09l6.17,37a6,6,0,0,1-4.93,6.91,6.85,6.85,0,0,1-1,.08,6,6,0,0,1-5.91-5L148,156.44a128.86,128.86,0,0,1-40,0L101.92,193A6,6,0,0,1,96,198a6.85,6.85,0,0,1-1-.08A6,6,0,0,1,90.08,191l6.17-37a122,122,0,0,1-39-18.09L37.21,171a6,6,0,1,1-10.42-6l20.85-36.48a152,152,0,0,1-20.31-20.77,6,6,0,0,1,9.34-7.54C53.54,121.11,83.07,146,128,146s74.46-24.89,91.33-45.77a6,6,0,0,1,9.34,7.54,152,152,0,0,1-20.31,20.77Z"}}]})(props);}function PiArchive(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M224,48H32A16,16,0,0,0,16,64V88a16,16,0,0,0,16,16v88a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V104a16,16,0,0,0,16-16V64A16,16,0,0,0,224,48ZM208,192H48V104H208ZM224,88H32V64H224V88ZM96,136a8,8,0,0,1,8-8h48a8,8,0,0,1,0,16H104A8,8,0,0,1,96,136Z"}}]})(props);}function PiCaretDown(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M213.66,101.66l-80,80a8,8,0,0,1-11.32,0l-80-80A8,8,0,0,1,53.66,90.34L128,164.69l74.34-74.35a8,8,0,0,1,11.32,11.32Z"}}]})(props);}function PiCaretLeft(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M165.66,202.34a8,8,0,0,1-11.32,11.32l-80-80a8,8,0,0,1,0-11.32l80-80a8,8,0,0,1,11.32,11.32L91.31,128Z"}}]})(props);}function PiCaretRight(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M181.66,133.66l-80,80a8,8,0,0,1-11.32-11.32L164.69,128,90.34,53.66a8,8,0,0,1,11.32-11.32l80,80A8,8,0,0,1,181.66,133.66Z"}}]})(props);}function PiCaretUp(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M213.66,165.66a8,8,0,0,1-11.32,0L128,91.31,53.66,165.66a8,8,0,0,1-11.32-11.32l80-80a8,8,0,0,1,11.32,0l80,80A8,8,0,0,1,213.66,165.66Z"}}]})(props);}function PiClock(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216Zm64-88a8,8,0,0,1-8,8H128a8,8,0,0,1-8-8V72a8,8,0,0,1,16,0v48h48A8,8,0,0,1,192,128Z"}}]})(props);}function PiEye(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M247.31,124.76c-.35-.79-8.82-19.58-27.65-38.41C194.57,61.26,162.88,48,128,48S61.43,61.26,36.34,86.35C17.51,105.18,9,124,8.69,124.76a8,8,0,0,0,0,6.5c.35.79,8.82,19.57,27.65,38.4C61.43,194.74,93.12,208,128,208s66.57-13.26,91.66-38.34c18.83-18.83,27.3-37.61,27.65-38.4A8,8,0,0,0,247.31,124.76ZM128,192c-30.78,0-57.67-11.19-79.93-33.25A133.47,133.47,0,0,1,25,128,133.33,133.33,0,0,1,48.07,97.25C70.33,75.19,97.22,64,128,64s57.67,11.19,79.93,33.25A133.46,133.46,0,0,1,231.05,128C223.84,141.46,192.43,192,128,192Zm0-112a48,48,0,1,0,48,48A48.05,48.05,0,0,0,128,80Zm0,80a32,32,0,1,1,32-32A32,32,0,0,1,128,160Z"}}]})(props);}function PiFileArrowDown(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M213.66,82.34l-56-56A8,8,0,0,0,152,24H56A16,16,0,0,0,40,40V216a16,16,0,0,0,16,16H200a16,16,0,0,0,16-16V88A8,8,0,0,0,213.66,82.34ZM160,51.31,188.69,80H160ZM200,216H56V40h88V88a8,8,0,0,0,8,8h48V216Zm-42.34-61.66a8,8,0,0,1,0,11.32l-24,24a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L120,164.69V120a8,8,0,0,1,16,0v44.69l10.34-10.35A8,8,0,0,1,157.66,154.34Z"}}]})(props);}function PiFunnel(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M230.6,49.53A15.81,15.81,0,0,0,216,40H40A16,16,0,0,0,28.19,66.76l.08.09L96,139.17V216a16,16,0,0,0,24.87,13.32l32-21.34A16,16,0,0,0,160,194.66V139.17l67.74-72.32.08-.09A15.8,15.8,0,0,0,230.6,49.53ZM40,56h0Zm108.34,72.28A15.92,15.92,0,0,0,144,139.17v55.49L112,216V139.17a15.92,15.92,0,0,0-4.32-10.94L40,56H216Z"}}]})(props);}function PiImage(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M216,40H40A16,16,0,0,0,24,56V200a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V56A16,16,0,0,0,216,40Zm0,16V158.75l-26.07-26.06a16,16,0,0,0-22.63,0l-20,20-44-44a16,16,0,0,0-22.62,0L40,149.37V56ZM40,172l52-52,80,80H40Zm176,28H194.63l-36-36,20-20L216,181.38V200ZM144,100a12,12,0,1,1,12,12A12,12,0,0,1,144,100Z"}}]})(props);}function PiInfo(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216Zm16-40a8,8,0,0,1-8,8,16,16,0,0,1-16-16V128a8,8,0,0,1,0-16,16,16,0,0,1,16,16v40A8,8,0,0,1,144,176ZM112,84a12,12,0,1,1,12,12A12,12,0,0,1,112,84Z"}}]})(props);}function PiMagnifyingGlass(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M229.66,218.34l-50.07-50.06a88.11,88.11,0,1,0-11.31,11.31l50.06,50.07a8,8,0,0,0,11.32-11.32ZM40,112a72,72,0,1,1,72,72A72.08,72.08,0,0,1,40,112Z"}}]})(props);}function PiNotePencil(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M229.66,58.34l-32-32a8,8,0,0,0-11.32,0l-96,96A8,8,0,0,0,88,128v32a8,8,0,0,0,8,8h32a8,8,0,0,0,5.66-2.34l96-96A8,8,0,0,0,229.66,58.34ZM124.69,152H104V131.31l64-64L188.69,88ZM200,76.69,179.31,56,192,43.31,212.69,64ZM224,120v88a16,16,0,0,1-16,16H48a16,16,0,0,1-16-16V48A16,16,0,0,1,48,32h88a8,8,0,0,1,0,16H48V208H208V120a8,8,0,0,1,16,0Z"}}]})(props);}function PiPlus(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M224,128a8,8,0,0,1-8,8H136v80a8,8,0,0,1-16,0V136H40a8,8,0,0,1,0-16h80V40a8,8,0,0,1,16,0v80h80A8,8,0,0,1,224,128Z"}}]})(props);}function PiTrash(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M216,48H176V40a24,24,0,0,0-24-24H104A24,24,0,0,0,80,40v8H40a8,8,0,0,0,0,16h8V208a16,16,0,0,0,16,16H192a16,16,0,0,0,16-16V64h8a8,8,0,0,0,0-16ZM96,40a8,8,0,0,1,8-8h48a8,8,0,0,1,8,8v8H96Zm96,168H64V64H192ZM112,104v64a8,8,0,0,1-16,0V104a8,8,0,0,1,16,0Zm48,0v64a8,8,0,0,1-16,0V104a8,8,0,0,1,16,0Z"}}]})(props);}function PiUser(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M230.92,212c-15.23-26.33-38.7-45.21-66.09-54.16a72,72,0,1,0-73.66,0C63.78,166.78,40.31,185.66,25.08,212a8,8,0,1,0,13.85,8c18.84-32.56,52.14-52,89.07-52s70.23,19.44,89.07,52a8,8,0,1,0,13.85-8ZM72,96a56,56,0,1,1,56,56A56.06,56.06,0,0,1,72,96Z"}}]})(props);}function PiX(props){return GenIcon({"tag":"svg","attr":{"viewBox":"0 0 256 256","fill":"currentColor"},"child":[{"tag":"path","attr":{"d":"M205.66,194.34a8,8,0,0,1-11.32,11.32L128,139.31,61.66,205.66a8,8,0,0,1-11.32-11.32L116.69,128,50.34,61.66A8,8,0,0,1,61.66,50.34L128,116.69l66.34-66.35a8,8,0,0,1,11.32,11.32L139.31,128Z"}}]})(props);}
|
|
103
103
|
|
|
104
104
|
const OutlineButton = ({
|
|
105
105
|
title = "Button",
|
|
@@ -146,19 +146,26 @@
|
|
|
146
146
|
const Alert = ({
|
|
147
147
|
title = "Title",
|
|
148
148
|
subtitle = "Subtitle",
|
|
149
|
+
type = "primary",
|
|
149
150
|
titleLeftButton,
|
|
150
151
|
titleRightButton,
|
|
151
152
|
onClickLeftButton,
|
|
152
153
|
onClickRightButton
|
|
153
154
|
}) => {
|
|
154
155
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
155
|
-
className:
|
|
156
|
+
className: `
|
|
157
|
+
${type === "primary" && "bg-primary50 border-primary600"}
|
|
158
|
+
${type === "warning" && "bg-warning50 border-warning600"}
|
|
159
|
+
${type === "danger" && "bg-danger50 border-danger600"} w-full flex justify-between p-3 border rounded-md`
|
|
156
160
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
157
161
|
className: "w-full flex"
|
|
158
162
|
}, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(PiInfoFill, {
|
|
159
163
|
size: "24",
|
|
160
164
|
variant: "Bold",
|
|
161
|
-
className:
|
|
165
|
+
className: `
|
|
166
|
+
${type === "primary" && "text-primary600"}
|
|
167
|
+
${type === "warning" && "text-warning600"}
|
|
168
|
+
${type === "danger" && "text-danger600"} mr-2`
|
|
162
169
|
})), /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
163
170
|
className: "text-md font-semibold text-black"
|
|
164
171
|
}, title), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
@@ -23789,7 +23796,10 @@
|
|
|
23789
23796
|
const Description = ({
|
|
23790
23797
|
title = "Title",
|
|
23791
23798
|
value = "Description",
|
|
23792
|
-
textColor = "default"
|
|
23799
|
+
textColor = "default",
|
|
23800
|
+
subtitle,
|
|
23801
|
+
linkSubtitle,
|
|
23802
|
+
onClickSubtitle
|
|
23793
23803
|
}) => {
|
|
23794
23804
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
23795
23805
|
className: "w-full"
|
|
@@ -23802,7 +23812,14 @@
|
|
|
23802
23812
|
${textColor == "default" && "text-black font-semibold text-base"}
|
|
23803
23813
|
${textColor == "success" && "text-success500 font-semibold text-base"}
|
|
23804
23814
|
`
|
|
23805
|
-
}, value))
|
|
23815
|
+
}, value)), subtitle && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
23816
|
+
className: "flex items-center mt-1"
|
|
23817
|
+
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
23818
|
+
className: "text-sm font-normal text-black mr-1"
|
|
23819
|
+
}, subtitle), linkSubtitle && /*#__PURE__*/React__default["default"].createElement("p", {
|
|
23820
|
+
className: "m-0 text-sm font-semibold text-primary500 cursor-pointer",
|
|
23821
|
+
onClick: onClickSubtitle
|
|
23822
|
+
}, linkSubtitle)));
|
|
23806
23823
|
};
|
|
23807
23824
|
|
|
23808
23825
|
const DropdownCard = ({
|
|
@@ -23976,16 +23993,21 @@
|
|
|
23976
23993
|
};
|
|
23977
23994
|
|
|
23978
23995
|
const DropdownText = ({
|
|
23979
|
-
options = [
|
|
23980
|
-
|
|
23981
|
-
|
|
23982
|
-
|
|
23983
|
-
|
|
23996
|
+
options = [{
|
|
23997
|
+
option: "Name 1",
|
|
23998
|
+
value: "Value 1"
|
|
23999
|
+
}, {
|
|
24000
|
+
option: "Name 2",
|
|
24001
|
+
value: "Value 2"
|
|
24002
|
+
}],
|
|
24003
|
+
onSelect,
|
|
23984
24004
|
title = "Title Dropdown",
|
|
23985
|
-
placeholder = "
|
|
23986
|
-
isRequired = true
|
|
24005
|
+
placeholder = "Placeholder",
|
|
24006
|
+
isRequired = true,
|
|
24007
|
+
currentOption
|
|
23987
24008
|
}) => {
|
|
23988
24009
|
const [isOpen, setIsOpen] = React.useState(false);
|
|
24010
|
+
const [selectedOption, setSelectedOption] = React.useState(null);
|
|
23989
24011
|
const dropdownRef = React.useRef(null);
|
|
23990
24012
|
React.useEffect(() => {
|
|
23991
24013
|
const handleOutsideClick = event => {
|
|
@@ -24003,11 +24025,13 @@
|
|
|
24003
24025
|
const handleToggleDropdownText = () => {
|
|
24004
24026
|
setIsOpen(!isOpen);
|
|
24005
24027
|
};
|
|
24006
|
-
const handleOptionClick = value => {
|
|
24028
|
+
const handleOptionClick = (option, value) => {
|
|
24029
|
+
console.log("ini option", option);
|
|
24030
|
+
console.log("ini value", value);
|
|
24031
|
+
setSelectedOption(option);
|
|
24007
24032
|
setIsOpen(false);
|
|
24008
|
-
|
|
24009
|
-
|
|
24010
|
-
onSelectValue(value.code);
|
|
24033
|
+
if (onSelect) {
|
|
24034
|
+
onSelect(value);
|
|
24011
24035
|
}
|
|
24012
24036
|
};
|
|
24013
24037
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
@@ -24027,7 +24051,7 @@
|
|
|
24027
24051
|
onClick: handleToggleDropdownText
|
|
24028
24052
|
}, /*#__PURE__*/React__default["default"].createElement("span", {
|
|
24029
24053
|
className: "flex-grow overflow-hidden"
|
|
24030
|
-
},
|
|
24054
|
+
}, selectedOption ? selectedOption : currentOption ? currentOption : placeholder), /*#__PURE__*/React__default["default"].createElement("span", {
|
|
24031
24055
|
className: "ml-2"
|
|
24032
24056
|
}, isOpen ? /*#__PURE__*/React__default["default"].createElement(PiCaretUp, {
|
|
24033
24057
|
size: 16,
|
|
@@ -24042,17 +24066,17 @@
|
|
|
24042
24066
|
"aria-labelledby": "options-menu"
|
|
24043
24067
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
24044
24068
|
className: "px-1 py-2 max-h-40 overflow-y-auto"
|
|
24045
|
-
}, options.
|
|
24046
|
-
className: "hover:bg-neutral20 bg-white py-2.5 px-4 my-0.5 rounded-md"
|
|
24047
|
-
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
24048
|
-
className: "text-sm text-black"
|
|
24049
|
-
}, "Loading...")) : options.map((value, index) => /*#__PURE__*/React__default["default"].createElement("div", {
|
|
24069
|
+
}, options.map((option, index) => /*#__PURE__*/React__default["default"].createElement("div", {
|
|
24050
24070
|
key: index,
|
|
24051
24071
|
className: "hover:bg-neutral20 bg-white py-2.5 px-4 my-0.5 rounded-md",
|
|
24052
|
-
onClick: () =>
|
|
24072
|
+
onClick: () => {
|
|
24073
|
+
if (option.option !== "Loading...") {
|
|
24074
|
+
handleOptionClick(option.option, option.value);
|
|
24075
|
+
}
|
|
24076
|
+
}
|
|
24053
24077
|
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
24054
24078
|
className: "text-sm text-black"
|
|
24055
|
-
},
|
|
24079
|
+
}, option.option))))));
|
|
24056
24080
|
};
|
|
24057
24081
|
|
|
24058
24082
|
function _extends$2() {
|
|
@@ -28773,7 +28797,7 @@
|
|
|
28773
28797
|
mode = "default",
|
|
28774
28798
|
isRequired = true,
|
|
28775
28799
|
value,
|
|
28776
|
-
|
|
28800
|
+
onChangeInput
|
|
28777
28801
|
}) => {
|
|
28778
28802
|
const [isFocused, setIsFocused] = React.useState(false);
|
|
28779
28803
|
const [showPassword, setShowPassword] = React.useState(false);
|
|
@@ -28798,7 +28822,7 @@
|
|
|
28798
28822
|
className: "relative rounded-md"
|
|
28799
28823
|
}, leftIcon && /*#__PURE__*/React__default["default"].createElement("span", {
|
|
28800
28824
|
className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none"
|
|
28801
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
28825
|
+
}, /*#__PURE__*/React__default["default"].createElement(PiInfo, {
|
|
28802
28826
|
size: 16,
|
|
28803
28827
|
className: `
|
|
28804
28828
|
${mode === "primary" && "text-black"}
|
|
@@ -28818,13 +28842,13 @@
|
|
|
28818
28842
|
placeholder: placeholder,
|
|
28819
28843
|
disabled: mode === "disable",
|
|
28820
28844
|
value: value,
|
|
28821
|
-
onChange:
|
|
28845
|
+
onChange: onChangeInput,
|
|
28822
28846
|
onFocus: handleFocus,
|
|
28823
28847
|
onBlur: handleBlur
|
|
28824
28848
|
}), type === 'password' && /*#__PURE__*/React__default["default"].createElement("span", {
|
|
28825
28849
|
className: "absolute inset-y-0 right-0 pr-4 flex items-center cursor-pointer",
|
|
28826
28850
|
onClick: handleTogglePasswordVisibility
|
|
28827
|
-
}, showPassword ? /*#__PURE__*/React__default["default"].createElement(
|
|
28851
|
+
}, showPassword ? /*#__PURE__*/React__default["default"].createElement(PiEye, {
|
|
28828
28852
|
size: 16,
|
|
28829
28853
|
className: `text-black ${mode === "danger" && "text-danger500"}`
|
|
28830
28854
|
}) : /*#__PURE__*/React__default["default"].createElement(PiEyeClosedLight, {
|
|
@@ -28832,7 +28856,7 @@
|
|
|
28832
28856
|
className: `text-black ${mode === "danger" && "text-danger500"}`
|
|
28833
28857
|
})), rightIcon && /*#__PURE__*/React__default["default"].createElement("span", {
|
|
28834
28858
|
className: "absolute inset-y-0 right-0 pr-4 flex items-center pointer-events-none"
|
|
28835
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
28859
|
+
}, /*#__PURE__*/React__default["default"].createElement(PiInfo, {
|
|
28836
28860
|
size: 16,
|
|
28837
28861
|
className: `
|
|
28838
28862
|
${mode === "primary" && "text-black"}
|
|
@@ -28842,11 +28866,11 @@
|
|
|
28842
28866
|
}))), footer && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
28843
28867
|
className: "mt-1"
|
|
28844
28868
|
}, mode === "danger" ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
28845
|
-
className: "flex
|
|
28846
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
28847
|
-
size:
|
|
28869
|
+
className: "flex"
|
|
28870
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(PiInfo, {
|
|
28871
|
+
size: 16,
|
|
28848
28872
|
className: "text-danger500"
|
|
28849
|
-
}), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
28873
|
+
})), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
28850
28874
|
className: "text-danger500 text-xs ml-1"
|
|
28851
28875
|
}, footer)) : /*#__PURE__*/React__default["default"].createElement("p", {
|
|
28852
28876
|
className: "text-black text-xs"
|
|
@@ -44752,7 +44776,7 @@
|
|
|
44752
44776
|
className: `relative inline-block ${checked ? 'bg-primary500' : 'bg-neutral40'} rounded-full w-12 h-6 transition-all duration-300 ${isEdit ? "cursor-pointer" : "cursor-default"}`,
|
|
44753
44777
|
onClick: handleClick
|
|
44754
44778
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
44755
|
-
className: `absolute flex items-center justify-center w-6 h-6 transition-all duration-300 ${checked ? '
|
|
44779
|
+
className: `absolute flex items-center justify-center w-6 h-6 transition-all duration-300 ${checked ? 'right-0' : 'left-0'}`
|
|
44756
44780
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
44757
44781
|
className: `w-4 h-4 bg-white rounded-full shadow-md transition-all`
|
|
44758
44782
|
})));
|
|
@@ -46583,14 +46607,14 @@
|
|
|
46583
46607
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46584
46608
|
className: "flex items-center h-full"
|
|
46585
46609
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46586
|
-
className: "relative cursor-pointer border-
|
|
46610
|
+
className: `${filterSearch ? "border-black" : "border-neutral50"} relative cursor-pointer border-t border-b border-l rounded-tl-md rounded-bl-md`,
|
|
46587
46611
|
onClick: () => setIsOpen(!isOpen)
|
|
46588
46612
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46589
46613
|
className: "flex items-center bg-white rounded-tl-md rounded-bl-md"
|
|
46590
46614
|
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46591
46615
|
className: "flex items-center w-full py-2.5 text-left pl-4 pr-4 bg-white rounded-md font-bold text-sm text-neutral300"
|
|
46592
46616
|
}, filterDropdown), isOpen ? /*#__PURE__*/React__default["default"].createElement(PiCaretUp, null) : /*#__PURE__*/React__default["default"].createElement(PiCaretDown, null), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
46593
|
-
className: "text-neutral50 ml-3
|
|
46617
|
+
className: `${filterSearch ? "text-black" : "text-neutral50"} ml-3`
|
|
46594
46618
|
}, "|")), isOpen && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46595
46619
|
className: "z-10 origin-top-left absolute left-0 mt-2 w-full rounded-md shadow-md bg-white ring-1 ring-black ring-opacity-5 focus:outline-none overflow-hidden",
|
|
46596
46620
|
role: "menu",
|
|
@@ -46609,7 +46633,7 @@
|
|
|
46609
46633
|
}, option)))) : /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46610
46634
|
className: "text-sm font-normal text-black flex justify-center"
|
|
46611
46635
|
}, /*#__PURE__*/React__default["default"].createElement("p", null, "Data Not Available"))))), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46612
|
-
className: "
|
|
46636
|
+
className: `${filterSearch ? "border-black" : "border-neutral50"} relative border-t border-b border-r rounded-tr-md rounded-br-md`
|
|
46613
46637
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46614
46638
|
className: "flex items-center bg-white rounded-tr-md rounded-br-md focus:outline-none"
|
|
46615
46639
|
}, /*#__PURE__*/React__default["default"].createElement(PiMagnifyingGlass, {
|
|
@@ -46680,6 +46704,8 @@
|
|
|
46680
46704
|
role: [],
|
|
46681
46705
|
status: []
|
|
46682
46706
|
});
|
|
46707
|
+
setShowFilterMenu(false);
|
|
46708
|
+
setShowFilterSubmenu(false);
|
|
46683
46709
|
};
|
|
46684
46710
|
const buttonText = dataFilterCheckbox.length + dataFilterStatus.length > 0 ? `${dataFilterCheckbox.length + dataFilterStatus.length} Filter Selected` : 'Filter';
|
|
46685
46711
|
return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("span", {
|
|
@@ -46688,13 +46714,17 @@
|
|
|
46688
46714
|
className: "flex"
|
|
46689
46715
|
}, /*#__PURE__*/React__default["default"].createElement("button", {
|
|
46690
46716
|
type: "button",
|
|
46691
|
-
className: "flex items-center w-60
|
|
46692
|
-
onClick: () => setShowFilterMenu(!showFilterMenu)
|
|
46717
|
+
className: `${dataFilterCheckbox.length + dataFilterStatus.length > 0 ? "border-black text-black" : "border-neutral50 text-neutral300"} flex items-center w-60 text-left px-4 bg-white font-normal text-sm rounded-md border focus:outline-none`
|
|
46693
46718
|
}, /*#__PURE__*/React__default["default"].createElement("span", {
|
|
46694
|
-
className: "flex-grow"
|
|
46695
|
-
|
|
46719
|
+
className: "flex-grow py-2.5",
|
|
46720
|
+
onClick: () => setShowFilterMenu(!showFilterMenu)
|
|
46721
|
+
}, buttonText), dataFilterCheckbox.length + dataFilterStatus.length > 0 ? /*#__PURE__*/React__default["default"].createElement("span", {
|
|
46722
|
+
className: "ml-2",
|
|
46696
46723
|
onClick: handleResetFilter
|
|
46697
|
-
},
|
|
46724
|
+
}, /*#__PURE__*/React__default["default"].createElement(PiX, {
|
|
46725
|
+
size: 16,
|
|
46726
|
+
className: "text-black"
|
|
46727
|
+
})) : /*#__PURE__*/React__default["default"].createElement("span", {
|
|
46698
46728
|
className: "ml-2"
|
|
46699
46729
|
}, /*#__PURE__*/React__default["default"].createElement(PiFunnel, {
|
|
46700
46730
|
size: 16,
|
|
@@ -46731,7 +46761,7 @@
|
|
|
46731
46761
|
fontSize: "8px"
|
|
46732
46762
|
}
|
|
46733
46763
|
}, dataFilterStatus.length))), showFilterSubmenu && option.submenu.length > 0 && dataSelectionOptionMenu === option.menu && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46734
|
-
className:
|
|
46764
|
+
className: `ml-1 border border-neutral40 bg-white p-3 shadow-md rounded-md w-56 absolute left-32 cursor-pointer ${option.type == "checkbox" ? "top-0" : "top-16"}`
|
|
46735
46765
|
}, option.submenu.map((submenu, subIndex) => /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46736
46766
|
key: subIndex,
|
|
46737
46767
|
className: "flex bg-white hover:bg-neutral20 rounded-md py-2.5 px-4 my-0.5",
|
|
@@ -46763,6 +46793,33 @@
|
|
|
46763
46793
|
}, submenu)))))))))));
|
|
46764
46794
|
};
|
|
46765
46795
|
|
|
46796
|
+
const Footer = ({
|
|
46797
|
+
titleLeftButton = "Cancel",
|
|
46798
|
+
titleRightButton = "Submit",
|
|
46799
|
+
isActiveLeftButton,
|
|
46800
|
+
isActiveRightButton,
|
|
46801
|
+
onClickLeftButton,
|
|
46802
|
+
onClickRightButton
|
|
46803
|
+
}) => {
|
|
46804
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46805
|
+
className: "fixed bottom-0 flex justify-end w-full items-center py-1 px-6 bg-white"
|
|
46806
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46807
|
+
className: "flex items-center mr-48"
|
|
46808
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46809
|
+
className: "m-1"
|
|
46810
|
+
}, /*#__PURE__*/React__default["default"].createElement(OutlineButton, {
|
|
46811
|
+
title: titleLeftButton,
|
|
46812
|
+
onClick: onClickLeftButton,
|
|
46813
|
+
isActive: isActiveLeftButton
|
|
46814
|
+
})), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
46815
|
+
className: "m-1"
|
|
46816
|
+
}, /*#__PURE__*/React__default["default"].createElement(PrimaryButton, {
|
|
46817
|
+
title: titleRightButton,
|
|
46818
|
+
onClick: onClickRightButton,
|
|
46819
|
+
isActive: isActiveRightButton
|
|
46820
|
+
}))));
|
|
46821
|
+
};
|
|
46822
|
+
|
|
46766
46823
|
exports.Alert = Alert;
|
|
46767
46824
|
exports.BillerList = BillerList;
|
|
46768
46825
|
exports.BillerProductList = BillerProductList;
|
|
@@ -46785,6 +46842,7 @@
|
|
|
46785
46842
|
exports.FilterCheckbox = FilterCheckbox;
|
|
46786
46843
|
exports.FilterDropdown = FilterDropdown;
|
|
46787
46844
|
exports.FilterText = FilterText;
|
|
46845
|
+
exports.Footer = Footer;
|
|
46788
46846
|
exports.HeaderTable = HeaderTable;
|
|
46789
46847
|
exports.InternalProductList = InternalProductList;
|
|
46790
46848
|
exports.LimitList = LimitList;
|
package/package.json
CHANGED
|
@@ -5,19 +5,26 @@ import OutlineButton from '../button/outlinebutton'
|
|
|
5
5
|
const Alert = ({
|
|
6
6
|
title = "Title",
|
|
7
7
|
subtitle = "Subtitle",
|
|
8
|
+
type = "primary",
|
|
8
9
|
titleLeftButton,
|
|
9
10
|
titleRightButton,
|
|
10
11
|
onClickLeftButton,
|
|
11
12
|
onClickRightButton,
|
|
12
13
|
}) => {
|
|
13
14
|
return (
|
|
14
|
-
<div className=
|
|
15
|
+
<div className={`
|
|
16
|
+
${type === "primary" && "bg-primary50 border-primary600"}
|
|
17
|
+
${type === "warning" && "bg-warning50 border-warning600"}
|
|
18
|
+
${type === "danger" && "bg-danger50 border-danger600"} w-full flex justify-between p-3 border rounded-md`}>
|
|
15
19
|
<div className='w-full flex'>
|
|
16
20
|
<div>
|
|
17
21
|
<PiInfoFill
|
|
18
22
|
size="24"
|
|
19
23
|
variant="Bold"
|
|
20
|
-
className=
|
|
24
|
+
className={`
|
|
25
|
+
${type === "primary" && "text-primary600"}
|
|
26
|
+
${type === "warning" && "text-warning600"}
|
|
27
|
+
${type === "danger" && "text-danger600"} mr-2`}
|
|
21
28
|
/>
|
|
22
29
|
</div>
|
|
23
30
|
<div>
|
|
@@ -4,6 +4,9 @@ const Description = ({
|
|
|
4
4
|
title = "Title",
|
|
5
5
|
value = "Description",
|
|
6
6
|
textColor = "default",
|
|
7
|
+
subtitle,
|
|
8
|
+
linkSubtitle,
|
|
9
|
+
onClickSubtitle
|
|
7
10
|
}) => {
|
|
8
11
|
return (
|
|
9
12
|
<div className='w-full'>
|
|
@@ -14,6 +17,15 @@ const Description = ({
|
|
|
14
17
|
${textColor == "success" && "text-success500 font-semibold text-base"}
|
|
15
18
|
`}>{value}</p>
|
|
16
19
|
</div>
|
|
20
|
+
{subtitle &&
|
|
21
|
+
<div className='flex items-center mt-1'>
|
|
22
|
+
<p className="text-sm font-normal text-black mr-1">{subtitle}</p>
|
|
23
|
+
{
|
|
24
|
+
linkSubtitle &&
|
|
25
|
+
<p className='m-0 text-sm font-semibold text-primary500 cursor-pointer' onClick={onClickSubtitle}>{linkSubtitle}</p>
|
|
26
|
+
}
|
|
27
|
+
</div>
|
|
28
|
+
}
|
|
17
29
|
</div>
|
|
18
30
|
);
|
|
19
31
|
};
|
|
@@ -2,16 +2,24 @@ import React, { useState, useEffect, useRef } from 'react';
|
|
|
2
2
|
import { PiCaretDown, PiCaretUp } from 'react-icons/pi';
|
|
3
3
|
|
|
4
4
|
const DropdownText = ({
|
|
5
|
-
options = [
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
5
|
+
options = [
|
|
6
|
+
{
|
|
7
|
+
option: "Name 1",
|
|
8
|
+
value: "Value 1"
|
|
9
|
+
},
|
|
10
|
+
{
|
|
11
|
+
option: "Name 2",
|
|
12
|
+
value: "Value 2"
|
|
13
|
+
}
|
|
14
|
+
],
|
|
15
|
+
onSelect,
|
|
10
16
|
title = "Title Dropdown",
|
|
11
|
-
placeholder = "
|
|
17
|
+
placeholder = "Placeholder",
|
|
12
18
|
isRequired = true,
|
|
19
|
+
currentOption,
|
|
13
20
|
}) => {
|
|
14
21
|
const [isOpen, setIsOpen] = useState(false);
|
|
22
|
+
const [selectedOption, setSelectedOption] = useState(null);
|
|
15
23
|
const dropdownRef = useRef(null);
|
|
16
24
|
|
|
17
25
|
useEffect(() => {
|
|
@@ -34,11 +42,13 @@ const DropdownText = ({
|
|
|
34
42
|
setIsOpen(!isOpen);
|
|
35
43
|
};
|
|
36
44
|
|
|
37
|
-
const handleOptionClick = (value) => {
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
45
|
+
const handleOptionClick = (option, value) => {
|
|
46
|
+
console.log("ini option", option)
|
|
47
|
+
console.log("ini value", value)
|
|
48
|
+
setSelectedOption(option);
|
|
49
|
+
setIsOpen(false);
|
|
50
|
+
if (onSelect) {
|
|
51
|
+
onSelect(value);
|
|
42
52
|
}
|
|
43
53
|
};
|
|
44
54
|
|
|
@@ -59,7 +69,7 @@ const DropdownText = ({
|
|
|
59
69
|
className="flex items-center w-full py-2.5 text-left px-4 bg-neutral20 border-neutral50 font-normal text-sm text-neutral300 rounded-md border focus:outline-none overflow-hidden"
|
|
60
70
|
onClick={handleToggleDropdownText}
|
|
61
71
|
>
|
|
62
|
-
<span className='flex-grow overflow-hidden'>{
|
|
72
|
+
<span className='flex-grow overflow-hidden'>{selectedOption ? selectedOption : currentOption ? currentOption : placeholder}</span>
|
|
63
73
|
<span className='ml-2'>
|
|
64
74
|
{isOpen ? <PiCaretUp size={16} className='text-neutral300' /> : <PiCaretDown size={16} className='text-neutral300' />}
|
|
65
75
|
</span>
|
|
@@ -75,24 +85,19 @@ const DropdownText = ({
|
|
|
75
85
|
aria-labelledby='options-menu'
|
|
76
86
|
>
|
|
77
87
|
<div className='px-1 py-2 max-h-40 overflow-y-auto'>
|
|
78
|
-
{
|
|
79
|
-
options.length == 0 ?
|
|
88
|
+
{options.map((option, index) => (
|
|
80
89
|
<div
|
|
90
|
+
key={index}
|
|
81
91
|
className='hover:bg-neutral20 bg-white py-2.5 px-4 my-0.5 rounded-md'
|
|
92
|
+
onClick={() => {
|
|
93
|
+
if (option.option !== "Loading...") {
|
|
94
|
+
handleOptionClick(option.option, option.value)
|
|
95
|
+
}
|
|
96
|
+
}}
|
|
82
97
|
>
|
|
83
|
-
<p className='text-sm text-black'>
|
|
98
|
+
<p className='text-sm text-black'>{option.option}</p>
|
|
84
99
|
</div>
|
|
85
|
-
|
|
86
|
-
options.map((value, index) => (
|
|
87
|
-
<div
|
|
88
|
-
key={index}
|
|
89
|
-
className='hover:bg-neutral20 bg-white py-2.5 px-4 my-0.5 rounded-md'
|
|
90
|
-
onClick={() => handleOptionClick(value)}
|
|
91
|
-
>
|
|
92
|
-
<p className='text-sm text-black'>{value.name}</p>
|
|
93
|
-
</div>
|
|
94
|
-
))
|
|
95
|
-
}
|
|
100
|
+
))}
|
|
96
101
|
</div>
|
|
97
102
|
</div>
|
|
98
103
|
)}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { useState, useEffect, useRef } from 'react';
|
|
2
|
-
import { PiFunnel, PiCaretRight } from 'react-icons/pi';
|
|
2
|
+
import { PiFunnel, PiCaretRight, PiX } from 'react-icons/pi';
|
|
3
3
|
|
|
4
4
|
const FilterDropdown = ({
|
|
5
5
|
options = [
|
|
@@ -71,6 +71,8 @@ const FilterDropdown = ({
|
|
|
71
71
|
role:[],
|
|
72
72
|
status:[]
|
|
73
73
|
})
|
|
74
|
+
setShowFilterMenu(false)
|
|
75
|
+
setShowFilterSubmenu(false)
|
|
74
76
|
}
|
|
75
77
|
|
|
76
78
|
const buttonText =
|
|
@@ -86,13 +88,15 @@ const FilterDropdown = ({
|
|
|
86
88
|
<div className='flex'>
|
|
87
89
|
<button
|
|
88
90
|
type='button'
|
|
89
|
-
className="flex items-center w-60
|
|
90
|
-
onClick={() => setShowFilterMenu(!showFilterMenu)}
|
|
91
|
+
className={`${dataFilterCheckbox.length + dataFilterStatus.length > 0 ? "border-black text-black" : "border-neutral50 text-neutral300"} flex items-center w-60 text-left px-4 bg-white font-normal text-sm rounded-md border focus:outline-none`}
|
|
91
92
|
>
|
|
92
|
-
<span className='flex-grow'>{buttonText}</span>
|
|
93
|
+
<span className='flex-grow py-2.5' onClick={() => setShowFilterMenu(!showFilterMenu)}>{buttonText}</span>
|
|
93
94
|
{
|
|
94
95
|
dataFilterCheckbox.length + dataFilterStatus.length > 0 ?
|
|
95
|
-
<
|
|
96
|
+
<span className='ml-2' onClick={handleResetFilter}>
|
|
97
|
+
<PiX size={16} className='text-black' />
|
|
98
|
+
</span>
|
|
99
|
+
:
|
|
96
100
|
<span className='ml-2'>
|
|
97
101
|
<PiFunnel size={16} className='text-neutral300' />
|
|
98
102
|
</span>
|
|
@@ -132,7 +136,7 @@ const FilterDropdown = ({
|
|
|
132
136
|
</div>
|
|
133
137
|
{
|
|
134
138
|
showFilterSubmenu && option.submenu.length > 0 && dataSelectionOptionMenu === option.menu &&
|
|
135
|
-
<div className=
|
|
139
|
+
<div className={`ml-1 border border-neutral40 bg-white p-3 shadow-md rounded-md w-56 absolute left-32 cursor-pointer ${option.type == "checkbox" ? "top-0" : "top-16"}`}>
|
|
136
140
|
{
|
|
137
141
|
option.submenu.map((submenu, subIndex) => (
|
|
138
142
|
<div key={subIndex} className='flex bg-white hover:bg-neutral20 rounded-md py-2.5 px-4 my-0.5'
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import OutlineButton from '../button/outlinebutton';
|
|
3
|
+
import PrimaryButton from '../button/primarybutton';
|
|
4
|
+
|
|
5
|
+
const Footer = ({
|
|
6
|
+
titleLeftButton = "Cancel",
|
|
7
|
+
titleRightButton = "Submit",
|
|
8
|
+
isActiveLeftButton,
|
|
9
|
+
isActiveRightButton,
|
|
10
|
+
onClickLeftButton,
|
|
11
|
+
onClickRightButton
|
|
12
|
+
}) => {
|
|
13
|
+
return (
|
|
14
|
+
<div className='fixed bottom-0 flex justify-end w-full items-center py-1 px-6 bg-white'>
|
|
15
|
+
<div className='flex items-center mr-48'>
|
|
16
|
+
<div className='m-1'>
|
|
17
|
+
<OutlineButton
|
|
18
|
+
title={titleLeftButton}
|
|
19
|
+
onClick={onClickLeftButton}
|
|
20
|
+
isActive={isActiveLeftButton}
|
|
21
|
+
/>
|
|
22
|
+
</div>
|
|
23
|
+
<div className='m-1'>
|
|
24
|
+
<PrimaryButton
|
|
25
|
+
title={titleRightButton}
|
|
26
|
+
onClick={onClickRightButton}
|
|
27
|
+
isActive={isActiveRightButton}
|
|
28
|
+
/>
|
|
29
|
+
</div>
|
|
30
|
+
</div>
|
|
31
|
+
</div>
|
|
32
|
+
);
|
|
33
|
+
};
|
|
34
|
+
|
|
35
|
+
export default Footer;
|
|
@@ -30,13 +30,13 @@ const SearchDropdown = ({
|
|
|
30
30
|
return (
|
|
31
31
|
<div className='relative inline-block text-left w-full' ref={dropdownRef}>
|
|
32
32
|
<div className='flex items-center h-full'>
|
|
33
|
-
<div className="relative cursor-pointer border-
|
|
33
|
+
<div className={`${filterSearch ? "border-black" : "border-neutral50"} relative cursor-pointer border-t border-b border-l rounded-tl-md rounded-bl-md`} onClick={() => setIsOpen(!isOpen)}>
|
|
34
34
|
<div className='flex items-center bg-white rounded-tl-md rounded-bl-md'>
|
|
35
35
|
<p className="flex items-center w-full py-2.5 text-left pl-4 pr-4 bg-white rounded-md font-bold text-sm text-neutral300">{filterDropdown}</p>
|
|
36
36
|
{
|
|
37
37
|
isOpen ? <PiCaretUp /> : <PiCaretDown />
|
|
38
38
|
}
|
|
39
|
-
<p className=
|
|
39
|
+
<p className={`${filterSearch ? "text-black" : "text-neutral50"} ml-3`}>|</p>
|
|
40
40
|
</div>
|
|
41
41
|
{isOpen && (
|
|
42
42
|
<div
|
|
@@ -68,7 +68,7 @@ const SearchDropdown = ({
|
|
|
68
68
|
</div>
|
|
69
69
|
)}
|
|
70
70
|
</div>
|
|
71
|
-
<div className="
|
|
71
|
+
<div className={`${filterSearch ? "border-black" : "border-neutral50"} relative border-t border-b border-r rounded-tr-md rounded-br-md`}>
|
|
72
72
|
<div className='flex items-center bg-white rounded-tr-md rounded-br-md focus:outline-none'>
|
|
73
73
|
<PiMagnifyingGlass className="absolute left-3 top-1/2 transform -translate-y-1/2 text-neutral50 w-4 h-4" />
|
|
74
74
|
<input
|
|
@@ -14,7 +14,7 @@ const Switch = ({ onChange, checked, isEdit }) => {
|
|
|
14
14
|
>
|
|
15
15
|
<div
|
|
16
16
|
className={`absolute flex items-center justify-center w-6 h-6 transition-all duration-300 ${
|
|
17
|
-
checked ? '
|
|
17
|
+
checked ? 'right-0' : 'left-0'}`}
|
|
18
18
|
>
|
|
19
19
|
<div className={`w-4 h-4 bg-white rounded-full shadow-md transition-all`}></div>
|
|
20
20
|
</div>
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { useState } from 'react';
|
|
2
|
-
import { PiEyeClosedLight,
|
|
2
|
+
import { PiEyeClosedLight, PiEye, PiInfo } from 'react-icons/pi';
|
|
3
3
|
|
|
4
4
|
const TextInput = ({
|
|
5
5
|
title = "",
|
|
@@ -11,7 +11,7 @@ const TextInput = ({
|
|
|
11
11
|
mode = "default",
|
|
12
12
|
isRequired = true,
|
|
13
13
|
value,
|
|
14
|
-
|
|
14
|
+
onChangeInput
|
|
15
15
|
}) => {
|
|
16
16
|
const [isFocused, setIsFocused] = useState(false);
|
|
17
17
|
const [showPassword, setShowPassword] = useState(false);
|
|
@@ -42,7 +42,7 @@ const TextInput = ({
|
|
|
42
42
|
<div className="relative rounded-md">
|
|
43
43
|
{leftIcon && (
|
|
44
44
|
<span className="absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none">
|
|
45
|
-
<
|
|
45
|
+
<PiInfo size={16} className={`
|
|
46
46
|
${mode === "primary" && "text-black"}
|
|
47
47
|
${mode === "disable" && "text-neutral50"}
|
|
48
48
|
${mode === "danger" && "text-danger500"}
|
|
@@ -63,20 +63,20 @@ const TextInput = ({
|
|
|
63
63
|
placeholder={placeholder}
|
|
64
64
|
disabled={mode === "disable"}
|
|
65
65
|
value={value}
|
|
66
|
-
onChange={
|
|
66
|
+
onChange={onChangeInput}
|
|
67
67
|
onFocus={handleFocus}
|
|
68
68
|
onBlur={handleBlur}
|
|
69
69
|
/>
|
|
70
70
|
|
|
71
71
|
{type === 'password' && (
|
|
72
72
|
<span className="absolute inset-y-0 right-0 pr-4 flex items-center cursor-pointer" onClick={handleTogglePasswordVisibility}>
|
|
73
|
-
{showPassword ? <
|
|
73
|
+
{showPassword ? <PiEye size={16} className={`text-black ${mode === "danger" && "text-danger500"}`} /> : <PiEyeClosedLight size={16} className={`text-black ${mode === "danger" && "text-danger500"}`} />}
|
|
74
74
|
</span>
|
|
75
75
|
)}
|
|
76
76
|
|
|
77
77
|
{rightIcon && (
|
|
78
78
|
<span className="absolute inset-y-0 right-0 pr-4 flex items-center pointer-events-none">
|
|
79
|
-
<
|
|
79
|
+
<PiInfo size={16} className={`
|
|
80
80
|
${mode === "primary" && "text-black"}
|
|
81
81
|
${mode === "disable" && "text-neutral50"}
|
|
82
82
|
${mode === "danger" && "text-danger500"}
|
|
@@ -88,8 +88,10 @@ const TextInput = ({
|
|
|
88
88
|
{footer && (
|
|
89
89
|
<div className='mt-1'>
|
|
90
90
|
{mode === "danger" ? (
|
|
91
|
-
<div className='flex
|
|
92
|
-
<
|
|
91
|
+
<div className='flex'>
|
|
92
|
+
<div>
|
|
93
|
+
<PiInfo size={16} className='text-danger500' />
|
|
94
|
+
</div>
|
|
93
95
|
<p className="text-danger500 text-xs ml-1">{footer}</p>
|
|
94
96
|
</div>
|
|
95
97
|
) : (
|
package/src/index.js
CHANGED
|
@@ -63,8 +63,9 @@ import ModalDeposit from './components/modal/modalDeposit';
|
|
|
63
63
|
import CellModelOne from './components/table/listTable/cellmodelone';
|
|
64
64
|
import SearchDropdown from './components/searchdropdown';
|
|
65
65
|
import FilterDropdown from './components/filter/filterDropdown';
|
|
66
|
+
import Footer from './components/footer';
|
|
66
67
|
|
|
67
68
|
|
|
68
|
-
export {CellModelOne, SearchDropdown, FilterDropdown, HeaderTable, TextInput, Pagination, ReportList, ReportListClient, InternalProductList, BillerProductList, BillerList, TabBar, ChipBar, Switch, Stepper,
|
|
69
|
+
export {Footer, CellModelOne, SearchDropdown, FilterDropdown, HeaderTable, TextInput, Pagination, ReportList, ReportListClient, InternalProductList, BillerProductList, BillerList, TabBar, ChipBar, Switch, Stepper,
|
|
69
70
|
SearchInput, Notification, ModalState, ModalResult, ModalLoading, Menu, FilterText, FilterCheckbox, ExportToExcel, NotFound, EmptyData, DropzoneUploadPhoto, DropzoneUploadFile, DropdownText, DropdownChip, DropdownCard, Description, CustomDatePicker, Chip, CardInternalProduct, PrimaryButton, OutlineButton,
|
|
70
71
|
DangerButton, Alert, BillingList, ModalBilling, LimitList, ModalLimit, VerticalStepBar, DepositList, ModalDeposit}
|
package/src/templates/index.js
CHANGED
|
@@ -728,9 +728,15 @@ const Templates = () => {
|
|
|
728
728
|
<div>
|
|
729
729
|
<div className='m-9'></div>
|
|
730
730
|
<p className='text-black font-semibold text-xl text-left py-1'>Alert</p>
|
|
731
|
-
<div className='w-full'>
|
|
731
|
+
<div className='w-full py-3'>
|
|
732
732
|
<Alert title='Client & Division Reminder' subtitle='Please ensure you have created the appropriate Client and division for the user before proceeding.'/>
|
|
733
733
|
</div>
|
|
734
|
+
<div className='w-full py-3'>
|
|
735
|
+
<Alert title='Client & Division Reminder' subtitle='Please ensure you have created the appropriate Client and division for the user before proceeding.' type='warning'/>
|
|
736
|
+
</div>
|
|
737
|
+
<div className='w-full py-3'>
|
|
738
|
+
<Alert title='Client & Division Reminder' subtitle='Please ensure you have created the appropriate Client and division for the user before proceeding.' type='danger'/>
|
|
739
|
+
</div>
|
|
734
740
|
<div className='w-full py-3'>
|
|
735
741
|
<Alert title='Client & Division Reminder' subtitle='Please ensure you have created the appropriate Client and division for the user before proceeding.' titleLeftButton="Add Client" onClickLeftButton={() => console.log("left button clicked")}/>
|
|
736
742
|
</div>
|