@omniumretail/component-library 1.2.50 → 1.2.51

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/main.css CHANGED
@@ -33,4 +33,4 @@
33
33
  :root{--color-grey: #e4e4e4;--color-grey-100: #E5E5E5}.SF5f_Q_Ggz_4JHUHS2Xa{display:flex;align-items:center;padding:13px 20px;box-sizing:border-box;height:72px}.SF5f_Q_Ggz_4JHUHS2Xa *{box-sizing:border-box}.gSVYvBn1sLbcMsGI32b9{display:flex;flex-grow:1;align-items:flex-end;justify-content:center;max-width:calc(100% - 60px)}.gSVYvBn1sLbcMsGI32b9 img{max-width:196px}.gSVYvBn1sLbcMsGI32b9 .fVSt3bSZBcJGsOdA5nIN{font-weight:var(--font-weight-semibold);text-transform:uppercase;color:var(--color-black)}.BIBQmS_NwoMw2Ncq5yuN{cursor:pointer;padding:4px 4px 4px 0;font-size:20px;width:30px;display:flex;align-items:center;justify-content:center}.ZinSgUtysxITkbGRKdux{position:fixed;top:0;left:-100%;bottom:0;width:100%;max-width:430px;background-color:var(--color-white);padding-inline:15px;z-index:999;box-shadow:0 3px 12px rgba(0,0,0,.45);transition:.6s ease-out}.ZinSgUtysxITkbGRKdux.FW1pOdad0uN5LO9h5PgQ{left:0;transition:.3s ease-in}.ZfA8OEmbRzRsNqLAmdtn{background-color:rgba(0,0,0,.3);backdrop-filter:blur(1px);position:absolute;left:0;top:0;right:0;bottom:0;z-index:998;pointer-events:none;opacity:0;transition:.3s}.ZfA8OEmbRzRsNqLAmdtn.FW1pOdad0uN5LO9h5PgQ{opacity:1;pointer-events:all}.YKSQJmdRP_7tKwvQpeuV{width:calc(100% + 30px);margin-left:-15px;background-color:var(--color-orange);display:flex;align-items:center;justify-content:center}.ISssYC5Uz452JVWP0xDc img{max-width:160px}.E6YZPpa60LxA7qqIW7jQ{position:absolute;top:23px;right:15px;font-size:25px;cursor:pointer;color:var(--color-white)}.YYp3pzktjEDEyW8knAZQ{overflow-y:auto;height:calc(100% - 51px);margin:0;padding:0}.u7k2VQ30AQDk6mKA22GX{height:60px;padding:10px;display:flex;align-items:center;border-bottom:1px solid var(--color-black);cursor:pointer;transition:.3s;text-transform:uppercase;width:100%}.u7k2VQ30AQDk6mKA22GX:hover{background-color:var(--color-grey);color:var(--color-black)}.QQoDB9XPcAK18l2DIym4{list-style:none}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN{height:auto;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding-bottom:0}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN>.u7k2VQ30AQDk6mKA22GX{position:relative}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN>.u7k2VQ30AQDk6mKA22GX .NytmT59TmaWHc4FLM2wa{position:absolute;width:60px;height:100%;background:var(--color-black);right:0;display:flex;align-items:center;justify-content:center}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN>.u7k2VQ30AQDk6mKA22GX .NytmT59TmaWHc4FLM2wa:hover{background-color:var(--color-orange)}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN>.u7k2VQ30AQDk6mKA22GX .zo7CFksIKx7Fahu4e4S_{color:var(--color-white)}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN.yk4DnBgiUlzk23Yg_q6E{background:var(--color-grey)}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN.yk4DnBgiUlzk23Yg_q6E .NytmT59TmaWHc4FLM2wa{background-color:var(--color-orange)}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN.yk4DnBgiUlzk23Yg_q6E .uLgjMU9sbvfaa0qKEguP{height:auto;opacity:1}.uLgjMU9sbvfaa0qKEguP{padding:0;width:100%;margin:0;background-color:var(--color-orange);color:var(--color-white);height:0;opacity:0;overflow:hidden;transition:height .3s ease,opacity .3s ease}.uLgjMU9sbvfaa0qKEguP .u7k2VQ30AQDk6mKA22GX{min-height:60px;height:auto;padding-inline:40px}.efnjUnudkE0UTVQ6wrgH{cursor:pointer}.u7k2VQ30AQDk6mKA22GX .fjNRYZMP1O0pTvBDBB3L span{margin-left:8px;transform:translateY(-2px);display:inline-block;font-size:var(--font-size-body-3);text-transform:capitalize}
34
34
  .muC1BdCbIEMIs70EtJoA{position:fixed}@media(max-width: 768px){.muC1BdCbIEMIs70EtJoA{position:absolute;top:0 !important;left:0 !important;right:0 !important;width:100% !important}}.msELhnfhfo6un3c4Spoc{max-height:calc(100vh - 70px);padding:0 !important;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,.15)}@media(max-width: 768px){.msELhnfhfo6un3c4Spoc{max-width:100vw;border-radius:0}}@media(min-width: 768px){.msELhnfhfo6un3c4Spoc{max-width:500px;max-height:calc(100vh - 100px);transform:translate(25%);margin-block-end:20px;margin-bottom:20px !important}}@media(max-width: 768px){.oGsIq0O_Hzwg2mLR72la{position:absolute}}.KSVguXBQ_A1SUSR6e8Wq{overflow-y:auto;max-height:calc(100vh - 200px)}@media(max-width: 768px){.KSVguXBQ_A1SUSR6e8Wq{max-height:calc(100vh - 120px)}}.GeNg2HVTmhQDmsLLTpWj{display:flex;flex-direction:column;align-items:unset !important;padding:10px;border-bottom:1px solid #f0f0f0;background-color:#fff !important;cursor:pointer}.GeNg2HVTmhQDmsLLTpWj:hover{background-color:#f9f9f9}@media(max-width: 768px){.GeNg2HVTmhQDmsLLTpWj{padding:8px}}.GBb48KXbGnQtAY8xqmUp{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;background-color:#f5f5f5;border-bottom:1px solid #e8e8e8}.LoCH7sYpmK3VgRASqTgz{font-size:20px;cursor:pointer;color:#595959;padding:4px;border-radius:4px}.LoCH7sYpmK3VgRASqTgz:hover{background-color:#e8e8e8}.Xjs10kZPSsD_BVFomnIe{color:#ff674c;margin-right:8px}.oibCayv_cOyhyWCKzHSr{display:flex;align-items:center;gap:10px}.oibCayv_cOyhyWCKzHSr span{font-size:14px;font-weight:500;color:#595959}.hhwYXSd0CR75D8ETnUML{display:flex;align-items:center;position:relative;padding-left:12px;width:100%}@media(max-width: 768px){.hhwYXSd0CR75D8ETnUML{padding-left:8px}}.LkP1cqeAyAYI9rCurnE8{position:absolute;left:0;top:50%;transform:translateY(-50%);font-size:16px}@media(max-width: 768px){.LkP1cqeAyAYI9rCurnE8{font-size:12px}}.u_jT9kmq2kyThRlj8HT1{width:50px;height:50px;margin-left:10px;margin-right:10px;flex-shrink:0}@media(max-width: 768px){.u_jT9kmq2kyThRlj8HT1{width:40px;height:40px;margin-left:8px;margin-right:8px}}.ieGdf5FTgLUPcfuZi7Xz{flex:1;overflow:hidden;min-width:0}.QgZ3oHW9IRTexL8xWVqP{font-weight:bold;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;max-width:100%}@media(max-width: 768px){.QgZ3oHW9IRTexL8xWVqP{font-size:12px}}.JwfbSOSIRAz5OO2hiSFc{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;max-width:100%;font-size:12px;color:#666;margin-top:2px}@media(max-width: 768px){.JwfbSOSIRAz5OO2hiSFc{font-size:10px}}.XfXQBYqMfZc4p8s2Mhla{width:6px;height:6px;background-color:#1890ff;border-radius:50%;margin-left:10px;flex-shrink:0}@media(max-width: 768px){.XfXQBYqMfZc4p8s2Mhla{width:4px;height:4px;margin-left:8px}}.RGXTlVxCxbZpD6__J5_g .ant-badge-count{font-size:12px !important;min-width:16px !important;height:16px !important;line-height:16px !important;transform:translate(40%, -50%) !important}.rWa5cnbZQLDtxFxJU6qA{font-size:26px;cursor:pointer;color:#0033a0}@media(min-width: 767px){.rWa5cnbZQLDtxFxJU6qA{color:var(--color-grey-light)}}.Pus_rAoqX05D4Qz2pYxo{animation:Pus_rAoqX05D4Qz2pYxo 1s ease-in-out infinite}@keyframes Pus_rAoqX05D4Qz2pYxo{0%{transform:rotate(0deg)}25%{transform:rotate(10deg)}50%{transform:rotate(-10deg)}75%{transform:rotate(10deg)}100%{transform:rotate(0deg)}}
35
35
  .rUOcBpTPxrzfRw36v939{display:flex;align-items:center;width:100%;margin:16px 0;box-sizing:border-box}.rUOcBpTPxrzfRw36v939 .ant-descriptions{width:calc(100vw - 24px)}.rUOcBpTPxrzfRw36v939 .ant-descriptions-item-label{max-width:140px !important;padding:8px 16px !important;color:var(--color-blue) !important;font-weight:700 !important;font-size:12px !important}.rUOcBpTPxrzfRw36v939 .ant-descriptions-item-content{padding:8px 16px !important;font-size:12px !important}.cyz9pmVdkD7z1n7QUlfu{width:100vw !important;max-width:100vw !important;padding:0px 12px}.PQ794lq3KZF_sigL5bbI{overflow:hidden !important}.PQ794lq3KZF_sigL5bbI .ant-modal .ant-modal-body{overflow-y:auto;overflow-x:hidden;max-height:80vh}.PQ794lq3KZF_sigL5bbI .ant-modal .ant-modal-content{padding:20px 12px !important}.PQ794lq3KZF_sigL5bbI .ant-modal-header{text-align:center !important}.PQ794lq3KZF_sigL5bbI .ant-modal-close{color:var(--button-default-background-hover-color)}.b23UIWngPXOEh5FC2mcC{display:flex;justify-content:center}.b23UIWngPXOEh5FC2mcC.DEfmwZ5CmWvodIcPVgfo{justify-content:space-between}.lIEwxxVD_vq2cGux3ehI{color:var(--button-default-background);font-size:26px}.ckRiBia09XQRtMVbNqvy{color:#c7cac9;pointer-events:none}
36
- .TRyfXWNBGEHsogA6eGN_{display:flex;justify-content:space-between;align-items:center;position:fixed;bottom:0px;width:100%;height:70px;padding:0 10px;box-sizing:border-box;z-index:10;padding-bottom:2px;background-color:#fff}.TRyfXWNBGEHsogA6eGN_::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background-color:#e5e7eb;width:100%}@media(min-width: 767px){.TRyfXWNBGEHsogA6eGN_{background-color:var(--color-black) !important;padding-bottom:0px}}.TRyfXWNBGEHsogA6eGN_ .wJU9Lx1mlSJ82yM1uy5i{display:flex;justify-content:space-between;width:100%}@media(min-width: 767px){.TRyfXWNBGEHsogA6eGN_ .wJU9Lx1mlSJ82yM1uy5i{width:fit-content;gap:100px}}.TRyfXWNBGEHsogA6eGN_ .X3NLcQLxnunLpbrTQW8h{font-size:var(--font-size-body-1);color:var(--color-grey-light)}.TRyfXWNBGEHsogA6eGN_ .wkmxxKMcpmBG8oshX8yW{width:100%;margin-bottom:4px}.TRyfXWNBGEHsogA6eGN_ .TCBuRot8X1MeAAQ9p9SW{margin-left:8px}.TRyfXWNBGEHsogA6eGN_ .X6xkdc8XoFcYrQWq3hB7,.TRyfXWNBGEHsogA6eGN_ .TCBuRot8X1MeAAQ9p9SW{display:inline-block}.TRyfXWNBGEHsogA6eGN_ .u7LoVIvRXqdjsXffoRjw{height:25px;align-self:flex-end}.TRyfXWNBGEHsogA6eGN_ .EqVJkSj9Vem7EVpPIYW_{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1}@media(min-width: 767px){.TRyfXWNBGEHsogA6eGN_ .EqVJkSj9Vem7EVpPIYW_{flex-direction:row;gap:12px;flex:unset}}.TRyfXWNBGEHsogA6eGN_ .EqVJkSj9Vem7EVpPIYW_ .YA6MXmjAZZwtbSZYmcEw{font-size:26px;color:#0033a0;cursor:pointer}@media(min-width: 767px){.TRyfXWNBGEHsogA6eGN_ .EqVJkSj9Vem7EVpPIYW_ .YA6MXmjAZZwtbSZYmcEw{color:var(--color-grey-light)}}.TRyfXWNBGEHsogA6eGN_ .EqVJkSj9Vem7EVpPIYW_ .C4jdW5oFYxdgldUsYeMg{font-size:12px;margin-top:4px;color:#0033a0}@media(min-width: 767px){.TRyfXWNBGEHsogA6eGN_ .EqVJkSj9Vem7EVpPIYW_ .C4jdW5oFYxdgldUsYeMg{color:var(--color-grey-light)}}.TRyfXWNBGEHsogA6eGN_ .FiQHpDUl90uFjStr9OAg{display:flex;justify-content:center;flex:1}@media(min-width: 767px){.TRyfXWNBGEHsogA6eGN_ .FiQHpDUl90uFjStr9OAg{flex:unset}}.TRyfXWNBGEHsogA6eGN_ .FiQHpDUl90uFjStr9OAg .iFeWqTLSjbpgaVFy6shj{display:flex;justify-content:center;align-items:center;width:50px;height:50px;background-color:#0033a0;border-radius:8px;cursor:pointer}@media(min-width: 767px){.TRyfXWNBGEHsogA6eGN_ .FiQHpDUl90uFjStr9OAg .iFeWqTLSjbpgaVFy6shj{background-color:var(--color-grey-light)}}.TRyfXWNBGEHsogA6eGN_ .FiQHpDUl90uFjStr9OAg .iFeWqTLSjbpgaVFy6shj .wbWHzMmDsgEQ056VQENK{font-size:20px;color:#fff}@media(min-width: 767px){.TRyfXWNBGEHsogA6eGN_ .FiQHpDUl90uFjStr9OAg .iFeWqTLSjbpgaVFy6shj .wbWHzMmDsgEQ056VQENK{color:#2c2d2e}}.TRyfXWNBGEHsogA6eGN_ .pPyAGD44QA4U6r5_xMLN{position:relative}.MGvcBnUleTUDOtqafxZd{transform:rotate(45deg);transition:transform .3s ease}.m5JXPA_4FcCHUN17ucxY{position:absolute;bottom:70px;width:180px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:12px;z-index:999}@media(min-width: 767px){.m5JXPA_4FcCHUN17ucxY{transform:translateX(-65%)}}.Rtyw1XuncdBWZdUEV1qj{display:flex;align-items:center;background-color:#fff;padding:8px 16px;border-radius:20px;box-shadow:0 4px 12px rgba(0,51,160,.5);cursor:pointer;transition:all .2s ease;animation:g8HDTZ2GSb3rGEQ5ICmJ .3s cubic-bezier(0.34, 1.56, 0.64, 1)}.Rtyw1XuncdBWZdUEV1qj:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.12)}@keyframes g8HDTZ2GSb3rGEQ5ICmJ{from{opacity:0;transform:scale(0.8) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}.ZVQGcR7lZkCRgAxqbZt1{width:28px;height:28px;border-radius:50%;background-color:#f3f4f6;display:flex;align-items:center;justify-content:center;margin-right:10px;color:#4b5563}.c87nj1oXjBwCQjx_Jq7T{font-size:14px;font-weight:500;color:#374151}
36
+ .TRyfXWNBGEHsogA6eGN_{display:flex;justify-content:space-between;align-items:center;position:fixed;bottom:0px;width:100%;height:70px;padding:0 10px;box-sizing:border-box;z-index:10;padding-bottom:2px;background-color:#fff}.TRyfXWNBGEHsogA6eGN_::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background-color:#e5e7eb;width:100%}@media(min-width: 767px){.TRyfXWNBGEHsogA6eGN_{background-color:var(--color-black) !important;padding-bottom:0px}}.TRyfXWNBGEHsogA6eGN_ .wJU9Lx1mlSJ82yM1uy5i{display:flex;justify-content:space-between;width:100%}@media(min-width: 767px){.TRyfXWNBGEHsogA6eGN_ .wJU9Lx1mlSJ82yM1uy5i{width:fit-content;gap:100px}}.TRyfXWNBGEHsogA6eGN_ .X3NLcQLxnunLpbrTQW8h{font-size:var(--font-size-body-1);color:var(--color-grey-light)}.TRyfXWNBGEHsogA6eGN_ .wkmxxKMcpmBG8oshX8yW{width:100%;margin-bottom:4px}.TRyfXWNBGEHsogA6eGN_ .TCBuRot8X1MeAAQ9p9SW{margin-left:8px}.TRyfXWNBGEHsogA6eGN_ .X6xkdc8XoFcYrQWq3hB7,.TRyfXWNBGEHsogA6eGN_ .TCBuRot8X1MeAAQ9p9SW{display:inline-block}.TRyfXWNBGEHsogA6eGN_ .u7LoVIvRXqdjsXffoRjw{height:25px;align-self:flex-end}.TRyfXWNBGEHsogA6eGN_ .EqVJkSj9Vem7EVpPIYW_{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1}@media(min-width: 767px){.TRyfXWNBGEHsogA6eGN_ .EqVJkSj9Vem7EVpPIYW_{flex-direction:row;gap:12px;flex:unset}}.TRyfXWNBGEHsogA6eGN_ .EqVJkSj9Vem7EVpPIYW_ .YA6MXmjAZZwtbSZYmcEw{font-size:26px;color:#0033a0;cursor:pointer}@media(min-width: 767px){.TRyfXWNBGEHsogA6eGN_ .EqVJkSj9Vem7EVpPIYW_ .YA6MXmjAZZwtbSZYmcEw{color:var(--color-grey-light)}}.TRyfXWNBGEHsogA6eGN_ .EqVJkSj9Vem7EVpPIYW_ .C4jdW5oFYxdgldUsYeMg{font-size:12px;margin-top:4px;color:#0033a0}@media(min-width: 767px){.TRyfXWNBGEHsogA6eGN_ .EqVJkSj9Vem7EVpPIYW_ .C4jdW5oFYxdgldUsYeMg{color:var(--color-grey-light)}}.TRyfXWNBGEHsogA6eGN_ .FiQHpDUl90uFjStr9OAg{display:flex;justify-content:center;flex:1}@media(min-width: 767px){.TRyfXWNBGEHsogA6eGN_ .FiQHpDUl90uFjStr9OAg{flex:unset}}.TRyfXWNBGEHsogA6eGN_ .FiQHpDUl90uFjStr9OAg .iFeWqTLSjbpgaVFy6shj{display:flex;justify-content:center;align-items:center;width:50px;height:50px;background-color:#0033a0;border-radius:8px;cursor:pointer}@media(min-width: 767px){.TRyfXWNBGEHsogA6eGN_ .FiQHpDUl90uFjStr9OAg .iFeWqTLSjbpgaVFy6shj{background-color:var(--color-grey-light)}}.TRyfXWNBGEHsogA6eGN_ .FiQHpDUl90uFjStr9OAg .iFeWqTLSjbpgaVFy6shj .wbWHzMmDsgEQ056VQENK{font-size:20px;color:#fff}@media(min-width: 767px){.TRyfXWNBGEHsogA6eGN_ .FiQHpDUl90uFjStr9OAg .iFeWqTLSjbpgaVFy6shj .wbWHzMmDsgEQ056VQENK{color:#2c2d2e}}.TRyfXWNBGEHsogA6eGN_ .pPyAGD44QA4U6r5_xMLN{position:relative}.ziO_hsrPyI74unWMlZKA{opacity:.5;cursor:not-allowed !important;pointer-events:none}.MGvcBnUleTUDOtqafxZd{transform:rotate(45deg);transition:transform .3s ease}.m5JXPA_4FcCHUN17ucxY{position:absolute;bottom:70px;width:180px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:12px;z-index:999}@media(min-width: 767px){.m5JXPA_4FcCHUN17ucxY{transform:translateX(-65%)}}.Rtyw1XuncdBWZdUEV1qj{display:flex;align-items:center;background-color:#fff;padding:8px 16px;border-radius:20px;box-shadow:0 4px 12px rgba(0,51,160,.5);cursor:pointer;transition:all .2s ease;animation:g8HDTZ2GSb3rGEQ5ICmJ .3s cubic-bezier(0.34, 1.56, 0.64, 1)}.Rtyw1XuncdBWZdUEV1qj:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.12)}@keyframes g8HDTZ2GSb3rGEQ5ICmJ{from{opacity:0;transform:scale(0.8) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}.ZVQGcR7lZkCRgAxqbZt1{width:28px;height:28px;border-radius:50%;background-color:#f3f4f6;display:flex;align-items:center;justify-content:center;margin-right:10px;color:#4b5563}.c87nj1oXjBwCQjx_Jq7T{font-size:14px;font-weight:500;color:#374151}
@@ -4,6 +4,7 @@ interface Action {
4
4
  label: string;
5
5
  icon: React.ReactNode;
6
6
  onClick?: () => void;
7
+ disabled?: boolean;
7
8
  }
8
9
  interface Criticality {
9
10
  Id: string;
@@ -20,20 +21,30 @@ interface BellNotification {
20
21
  Criticality: Criticality;
21
22
  IsRead: boolean;
22
23
  }
24
+ export declare enum ActionType {
25
+ DELETE = "delete",
26
+ UPDATE = "update",
27
+ CREATE = "create",
28
+ EDIT = "edit",
29
+ EXPORT = "export",
30
+ PRINT = "print"
31
+ }
32
+ export interface ActionConfig {
33
+ type: ActionType | string;
34
+ onClick: () => void;
35
+ disabled?: boolean;
36
+ }
23
37
  export interface Footer2Props {
24
38
  onBackClick?: () => void;
25
39
  notifications: BellNotification[];
26
40
  onFilterChange: (filter: 'all' | 'unread') => void;
27
41
  onNotificationClick: (id: string, url: string) => void;
28
42
  handleMarkAllAsRead: () => void;
29
- actions?: Action[];
30
- onDelete?: () => void;
31
- onUpdate?: () => void;
32
- onCreate?: () => void;
33
- onEdit?: () => void;
34
- onExport?: () => void;
35
- onPrint?: () => void;
43
+ customActions?: Action[];
44
+ actions?: ActionConfig[];
36
45
  footerName: string;
46
+ disableBackButton?: boolean;
47
+ disableNotifications?: boolean;
37
48
  }
38
49
  export declare const Footer2: (props: Footer2Props) => import("react/jsx-runtime").JSX.Element;
39
50
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@omniumretail/component-library",
3
- "version": "1.2.50",
3
+ "version": "1.2.51",
4
4
  "private": false,
5
5
  "main": "dist/bundle.js",
6
6
  "typings": "./dist/types/index",
@@ -1,5 +1,5 @@
1
1
  import { Meta, Story } from "@storybook/react";
2
- import { Footer2, Footer2Props } from '.';
2
+ import { Footer2, Footer2Props, ActionType } from '.';
3
3
  import {
4
4
  SettingOutlined,
5
5
  } from '@ant-design/icons';
@@ -188,11 +188,26 @@ const actions = [
188
188
  label: 'Definições',
189
189
  icon: <SettingOutlined />,
190
190
  onClick: () => console.log('Definições'),
191
+ disabled: true
191
192
  }
192
193
  ];
193
194
 
195
+ const handleCreate = () => console.log('Criar novo item');
196
+ const handleEdit = () => console.log('Editar item');
197
+ const handleDelete = () => console.log('Excluir item');
198
+ const handleExport = () => console.log('Exportar item');
199
+
200
+ const actions2 = [
201
+ { type: ActionType.CREATE, onClick: handleCreate },
202
+ { type: ActionType.EDIT, onClick: handleEdit, disabled: true },
203
+ { type: ActionType.DELETE, onClick: handleDelete },
204
+ { type: ActionType.EXPORT, onClick: handleExport }
205
+ ];
206
+
194
207
  export const Primary = Template.bind({});
195
208
  Primary.args = {
196
209
  notifications: notifications,
197
- actions: actions,
210
+ customActions: actions,
211
+ actions: actions2,
212
+ disableBackButton: true
198
213
  };
@@ -19,6 +19,7 @@ interface Action {
19
19
  label: string;
20
20
  icon: React.ReactNode;
21
21
  onClick?: () => void;
22
+ disabled?: boolean;
22
23
  }
23
24
 
24
25
  interface Criticality {
@@ -38,22 +39,45 @@ interface BellNotification {
38
39
  IsRead: boolean;
39
40
  }
40
41
 
42
+ // Definindo ações padrão disponíveis
43
+ export enum ActionType {
44
+ DELETE = 'delete',
45
+ UPDATE = 'update',
46
+ CREATE = 'create',
47
+ EDIT = 'edit',
48
+ EXPORT = 'export',
49
+ PRINT = 'print'
50
+ }
51
+
52
+ export interface ActionConfig {
53
+ type: ActionType | string;
54
+ onClick: () => void;
55
+ disabled?: boolean;
56
+ }
57
+
41
58
  export interface Footer2Props {
42
59
  onBackClick?: () => void;
43
60
  notifications: BellNotification[];
44
61
  onFilterChange: (filter: 'all' | 'unread') => void;
45
62
  onNotificationClick: (id: string, url: string) => void;
46
63
  handleMarkAllAsRead: () => void;
47
- actions?: Action[];
48
- onDelete?: () => void;
49
- onUpdate?: () => void;
50
- onCreate?: () => void;
51
- onEdit?: () => void;
52
- onExport?: () => void;
53
- onPrint?: () => void;
64
+ customActions?: Action[];
65
+ actions?: ActionConfig[];
54
66
  footerName: string;
67
+ disableBackButton?: boolean;
68
+ disableNotifications?: boolean;
55
69
  }
56
70
 
71
+ // Mapeamento de tipos de ações para seus ícones e labels padrão
72
+ const defaultActionProps: Record<string, { icon: React.ReactNode; label: string }> = {
73
+ [ActionType.DELETE]: { icon: <DeleteOutlined />, label: t('navigation.delete') },
74
+ [ActionType.UPDATE]: { icon: <ReloadOutlined />, label: t('navigation.update') },
75
+ [ActionType.CREATE]: { icon: <PlusOutlined />, label: t('navigation.create') },
76
+ [ActionType.EDIT]: { icon: <EditOutlined />, label: t('navigation.edit') },
77
+ [ActionType.EXPORT]: { icon: <ExportOutlined />, label: t('navigation.export') },
78
+ [ActionType.PRINT]: { icon: <PrinterOutlined />, label: t('navigation.print') },
79
+ };
80
+
57
81
  export const Footer2 = (props: Footer2Props) => {
58
82
  const {
59
83
  onBackClick,
@@ -61,14 +85,11 @@ export const Footer2 = (props: Footer2Props) => {
61
85
  onFilterChange,
62
86
  onNotificationClick,
63
87
  handleMarkAllAsRead,
88
+ customActions = [],
64
89
  actions = [],
65
- onDelete,
66
- onUpdate,
67
- onCreate,
68
- onEdit,
69
- onExport,
70
- onPrint,
71
90
  footerName = '',
91
+ disableBackButton = false,
92
+ disableNotifications = false,
72
93
  } = props;
73
94
 
74
95
  const [date, setDate] = useState(moment());
@@ -99,67 +120,32 @@ export const Footer2 = (props: Footer2Props) => {
99
120
  };
100
121
  }, []);
101
122
 
102
- const getDefaultAndCustomActions = (): Action[] => {
103
- const combinedActions = [...actions];
104
-
105
- if (onDelete) {
106
- combinedActions.push({
107
- key: 'delete',
108
- label: t('navigation.delete'),
109
- icon: <DeleteOutlined />,
110
- onClick: onDelete
111
- });
112
- }
113
-
114
- if (onUpdate) {
115
- combinedActions.push({
116
- key: 'update',
117
- label: t('navigation.update'),
118
- icon: <ReloadOutlined />,
119
- onClick: onUpdate
120
- });
121
- }
122
-
123
- if (onCreate) {
124
- combinedActions.push({
125
- key: 'create',
126
- label: t('navigation.create'),
127
- icon: <PlusOutlined />,
128
- onClick: onCreate
129
- });
130
- }
131
-
132
- if (onEdit) {
133
- combinedActions.push({
134
- key: 'edit',
135
- label: t('navigation.edit'),
136
- icon: <EditOutlined />,
137
- onClick: onEdit
138
- });
139
- }
140
-
141
- if (onExport) {
142
- combinedActions.push({
143
- key: 'export',
144
- label: t('navigation.export'),
145
- icon: <ExportOutlined />,
146
- onClick: onExport
147
- });
148
- }
149
-
150
- if (onPrint) {
151
- combinedActions.push({
152
- key: 'print',
153
- label: t('navigation.print'),
154
- icon: <PrinterOutlined />,
155
- onClick: onPrint
156
- });
157
- }
158
-
123
+ const getAllActions = (): Action[] => {
124
+ // Converter ActionConfig para Action
125
+ const standardActions = actions.map(actionConfig => {
126
+ const actionType = actionConfig.type;
127
+ const defaultProps = defaultActionProps[actionType] || {
128
+ label: String(actionType),
129
+ icon: <PlusOutlined />
130
+ };
131
+
132
+ return {
133
+ key: actionType,
134
+ label: defaultProps.label,
135
+ icon: defaultProps.icon,
136
+ onClick: actionConfig.onClick,
137
+ disabled: actionConfig.disabled || false
138
+ };
139
+ });
140
+
141
+ // Combinar com ações personalizadas
142
+ const combinedActions = [...standardActions, ...customActions];
143
+
144
+ // Ordenar por label
159
145
  return combinedActions.sort((a, b) => a.label.localeCompare(b.label));
160
146
  };
161
147
 
162
- const allActions = getDefaultAndCustomActions();
148
+ const allActions = getAllActions();
163
149
 
164
150
  const toggleMenu = () => {
165
151
  setIsMenuOpen(!isMenuOpen);
@@ -198,10 +184,15 @@ export const Footer2 = (props: Footer2Props) => {
198
184
  }
199
185
 
200
186
  <div className={styles.navigation}>
201
- <div className={styles.navItem} onClick={onBackClick}>
202
- <ArrowLeftOutlined className={styles.navIcon} />
203
- <span className={styles.navText}>{t('navigation.back')}</span>
204
- </div>
187
+ {onBackClick && (
188
+ <div
189
+ className={`${styles.navItem} ${disableBackButton ? styles.disabled : ''}`}
190
+ onClick={disableBackButton ? undefined : onBackClick}
191
+ >
192
+ <ArrowLeftOutlined className={styles.navIcon} />
193
+ <span className={styles.navText}>{t('navigation.back')}</span>
194
+ </div>
195
+ )}
205
196
 
206
197
  <div className={styles.addButtonContainer}>
207
198
  <div className={styles.addButton} onClick={toggleMenu}>
@@ -213,9 +204,9 @@ export const Footer2 = (props: Footer2Props) => {
213
204
  {allActions?.map((action) => (
214
205
  <div
215
206
  key={action.key}
216
- className={styles.circleMenuItem}
207
+ className={`${styles.circleMenuItem} ${action.disabled ? styles.disabled : ''}`}
217
208
  onClick={() => {
218
- if (action.onClick) {
209
+ if (action.onClick && !action.disabled) {
219
210
  action.onClick();
220
211
  setIsMenuOpen(false);
221
212
  }
@@ -232,16 +223,18 @@ export const Footer2 = (props: Footer2Props) => {
232
223
  )}
233
224
  </div>
234
225
 
235
- <div className={styles.navItem}>
236
- <BellNotifications
237
- notifications={notifications}
238
- onFilterChange={onFilterChange}
239
- onNotificationClick={onNotificationClick}
240
- handleMarkAllAsRead={handleMarkAllAsRead}
241
- />
226
+ {!disableNotifications && (
227
+ <div className={styles.navItem}>
228
+ <BellNotifications
229
+ notifications={notifications}
230
+ onFilterChange={onFilterChange}
231
+ onNotificationClick={onNotificationClick}
232
+ handleMarkAllAsRead={handleMarkAllAsRead}
233
+ />
242
234
 
243
- <span className={styles.navText}>{t('navigation.notifications')}</span>
244
- </div>
235
+ <span className={styles.navText}>{t('navigation.notifications')}</span>
236
+ </div>
237
+ )}
245
238
  </div>
246
239
 
247
240
  {!isMobile &&
@@ -251,4 +244,4 @@ export const Footer2 = (props: Footer2Props) => {
251
244
  }
252
245
  </div>
253
246
  );
254
- };
247
+ };
@@ -136,6 +136,12 @@
136
136
  }
137
137
  }
138
138
 
139
+ .disabled {
140
+ opacity: 0.5;
141
+ cursor: not-allowed !important;
142
+ pointer-events: none;
143
+ }
144
+
139
145
  .rotateIcon {
140
146
  transform: rotate(45deg);
141
147
  transition: transform 0.3s ease;