@omniumretail/component-library 1.2.30 → 1.2.31

package/dist/main.css

@@ -1,4 +1,4 @@
-.lCPh1mJwiXUUOgmbv_mk{padding:12px 24px;border-radius:4px;min-width:170px;display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;text-decoration:none;border:none;font-size:14px;line-height:16.8px;font-weight:700;font-family:"Silka",sans-serif;background-color:var(--button-default-background);color:var(--button-default-text-color)}@media(max-width: 767px){.lCPh1mJwiXUUOgmbv_mk{min-width:0px}}.lCPh1mJwiXUUOgmbv_mk:hover{background-color:var(--button-default-background-hover-color) !important;color:var(--button-default-text-hover-color) !important}.lCPh1mJwiXUUOgmbv_mk:focus,.lCPh1mJwiXUUOgmbv_mk:active,.lCPh1mJwiXUUOgmbv_mk:focus:active{background-color:var(--button-default-background-focus-color) !important;color:var(--button-default-text-focus-color) !important}.lCPh1mJwiXUUOgmbv_mk:disabled,.lCPh1mJwiXUUOgmbv_mk.vwrGv_jOJcIvImjzKZNv{background-color:#c7cac9 !important;color:var(--button-disabled-default-text-color) !important;pointer-events:none}.PYUelyvKNnKRxaBMgCyk{flex-direction:row-reverse;gap:5px}.edzSVcT9ajLWxd6QfVI1{background-color:var(--button-style-1-background);color:var(--button-style-1-text-color)}.edzSVcT9ajLWxd6QfVI1:hover{background-color:var(--button-style-1-background-hover-color);color:var(--button-style-1-text-hover-color) !important}.edzSVcT9ajLWxd6QfVI1:focus,.edzSVcT9ajLWxd6QfVI1:active,.edzSVcT9ajLWxd6QfVI1:focus:active{background-color:var(--button-style-1-background-focus-color);color:var(--button-style-1-text-focus-color)}.edzSVcT9ajLWxd6QfVI1:disabled,.edzSVcT9ajLWxd6QfVI1.vwrGv_jOJcIvImjzKZNv{background-color:var(--button-disabled-background-color);color:var(--button-disabled-default-text-color);pointer-events:none}:where(.css-dev-only-do-not-override-m4timi).ant-btn-link:disabled,:where(.css-dev-only-do-not-override-m4timi).ant-btn-link.ant-btn-disabled{color:var(--button-disabled-default-text-color);background-color:#c7cac9}:where(.css-dev-only-do-not-override-m4timi).ant-btn-link:disabled,:where(.css-dev-only-do-not-override-m4timi).ant-btn-link.ant-btn-disabled{color:var(--button-disabled-default-text-color);background-color:#c7cac9}
+.lCPh1mJwiXUUOgmbv_mk{padding:12px 24px;border-radius:4px;min-width:170px;display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;text-decoration:none;border:none;font-size:14px;line-height:16.8px;font-weight:700;font-family:"Silka",sans-serif;background-color:var(--button-default-background);color:var(--button-default-text-color)}@media(max-width: 767px){.lCPh1mJwiXUUOgmbv_mk{min-width:0px}}.lCPh1mJwiXUUOgmbv_mk:hover{background-color:var(--button-default-background-hover-color) !important;color:var(--button-default-text-hover-color) !important}.lCPh1mJwiXUUOgmbv_mk:disabled,.lCPh1mJwiXUUOgmbv_mk.vwrGv_jOJcIvImjzKZNv{background-color:#c7cac9 !important;color:var(--button-disabled-default-text-color) !important;pointer-events:none}.PYUelyvKNnKRxaBMgCyk{flex-direction:row-reverse;gap:5px}.edzSVcT9ajLWxd6QfVI1{background-color:var(--button-style-1-background);color:var(--button-style-1-text-color)}.edzSVcT9ajLWxd6QfVI1:hover{background-color:var(--button-style-1-background-hover-color);color:var(--button-style-1-text-hover-color) !important}.edzSVcT9ajLWxd6QfVI1:disabled,.edzSVcT9ajLWxd6QfVI1.vwrGv_jOJcIvImjzKZNv{background-color:var(--button-disabled-background-color);color:var(--button-disabled-default-text-color);pointer-events:none}:where(.css-dev-only-do-not-override-m4timi).ant-btn-link:disabled,:where(.css-dev-only-do-not-override-m4timi).ant-btn-link.ant-btn-disabled{color:var(--button-disabled-default-text-color);background-color:#c7cac9}:where(.css-dev-only-do-not-override-m4timi).ant-btn-link:disabled,:where(.css-dev-only-do-not-override-m4timi).ant-btn-link.ant-btn-disabled{color:var(--button-disabled-default-text-color);background-color:#c7cac9}
 .UxfXOleP69PjM5rFOMTD{display:grid !important;grid-template-columns:repeat(3, 1fr) !important;justify-items:center !important;align-items:center !important;height:45px !important;gap:0 24px !important;position:relative !important;padding:0px !important}@media(max-width: 767px){.UxfXOleP69PjM5rFOMTD .UxfXOleP69PjM5rFOMTD{grid-template-columns:1fr}.UxfXOleP69PjM5rFOMTD .UK3esJZjnri5Jb9Jxcca,.UxfXOleP69PjM5rFOMTD .U5tZ7kRlrIHUKsuduD1S{justify-self:center}.UxfXOleP69PjM5rFOMTD .LzcTbjk0fp70tXlKd3eS{text-align:center}.UxfXOleP69PjM5rFOMTD .DhO9jcXNunsWq22jXuJJ{text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}.UxfXOleP69PjM5rFOMTD .LzcTbjk0fp70tXlKd3eS{font-size:var(--font-size-body-3);font-weight:var(--font-weight-semibold);text-transform:uppercase}@media(min-width: 768px){.UxfXOleP69PjM5rFOMTD .LzcTbjk0fp70tXlKd3eS{font-size:var(--font-size-body-4)}}.UxfXOleP69PjM5rFOMTD .gn06XRZhFG00HaVjAqNc{align-self:center}@media(max-width: 768px){.UxfXOleP69PjM5rFOMTD .gn06XRZhFG00HaVjAqNc{position:unset !important;top:unset !important;margin:unset !important;left:unset !important;right:unset !important;text-align:unset !important}}.UxfXOleP69PjM5rFOMTD .UK3esJZjnri5Jb9Jxcca{justify-self:start}.UxfXOleP69PjM5rFOMTD .SP4eLTEZBzKjo_LdsNw2{justify-self:end}@media(max-width: 460px){.UxfXOleP69PjM5rFOMTD .SP4eLTEZBzKjo_LdsNw2{width:80px}}@media(max-width: 460px){.UxfXOleP69PjM5rFOMTD .SP4eLTEZBzKjo_LdsNw2 :where(.css-dev-only-do-not-override-fpg3f5).ant-btn.ant-btn-icon-only{padding-inline-start:40px}}.UxfXOleP69PjM5rFOMTD .nt_yaN_SHYobZ6zexnfY{justify-self:end}@media(max-width: 460px){.UxfXOleP69PjM5rFOMTD .nt_yaN_SHYobZ6zexnfY{width:60px}}@media(max-width: 460px){.UxfXOleP69PjM5rFOMTD .nt_yaN_SHYobZ6zexnfY :where(.css-dev-only-do-not-override-fpg3f5).ant-btn.ant-btn-icon-only{padding-inline-start:22px}}
 .ii1Ag3GTfp8unGCe48A0{display:inline-flex;text-decoration:none;height:auto;color:var(--color-black);font-size:var(--font-size-body-3);line-height:100%;font-weight:300;font-style:var(--font-style-italic)}.L9ncGwaItcjHJBLuwrKb{color:var(--color-orange);font-style:var(--font-style-normal)}.Yrb4eAglcF7FedoEB9AH span:nth-child(2){margin-inline-end:8px;margin-inline-start:0;order:-1}
 .dr2zFJ8bDffg5CjjPq2c{color:var(--color-black)}.ant-dropdown-menu-title-content{color:var(--color-black)}
@@ -22,7 +22,7 @@
 .vw302ajYc4_7bIROncyM{font-size:var(--font-size-body-4);font-weight:600;line-height:100%;color:var(--color-blue);text-transform:uppercase;margin-bottom:32px}.k3OGGGQwXB0zmX0T61yt{display:flex;gap:32px}.JHuRhb2cRXyGWESiQ2TQ{width:100%}.DrsaZTs1Ny6wZ76RwDR9{font-size:var(--font-size-body-2);color:var(--color-black);font-weight:700;text-transform:uppercase}.HVSssNqaNxLcYT_1lxBL{display:grid;grid-template-columns:minmax(200px, 1fr) auto auto auto auto;gap:46px}.ACPbYsV0wNkissVLHcFh{margin-top:16px}Label{margin-bottom:8px}.mIHYAri6ebHm4Oeb1ogj{min-width:200px}@media(max-width: 768px){.mIHYAri6ebHm4Oeb1ogj{min-width:150px}}.g19LZsD26yzPPjBtV31w .ant-select{width:100%}.g19LZsD26yzPPjBtV31w .ant-select-selector{border-color:rgba(var(--color-black-rgb), 0.5) !important;height:35px !important;display:flex;align-items:center}.g19LZsD26yzPPjBtV31w .ant-select-arrow{color:var(--color-black)}.g19LZsD26yzPPjBtV31w .ant-switch{width:30px}
 .j8_c3JHTX0JOkT36fF6A{contain:inline-size}.j8_c3JHTX0JOkT36fF6A .HgmGSts5FIH3osmekIYG{height:50px;width:300px}@media(min-width: 1024px){.j8_c3JHTX0JOkT36fF6A .HgmGSts5FIH3osmekIYG{width:450px}}.j8_c3JHTX0JOkT36fF6A .xlaG0XsJDRR9AClqXzzC .ant-tag{background-color:var(--color-orange);color:var(--color-white);padding:6px 16px;max-width:240px}.j8_c3JHTX0JOkT36fF6A .xlaG0XsJDRR9AClqXzzC .anticon-close{color:var(--color-white);font-size:12px}.j8_c3JHTX0JOkT36fF6A .xlaG0XsJDRR9AClqXzzC .anticon-close:hover{color:var(--color-black)}
 .BWmwZ5nFKyctBZyOAXzg{width:100%}.GWTSauaAl_v9W8o4YPxW{background:rgba(44,45,46,.0509803922);height:100%;position:relative}.GWTSauaAl_v9W8o4YPxW .ant-menu-light{background-color:rgba(0,0,0,0) !important;border-inline-end:none !important}.GWTSauaAl_v9W8o4YPxW .ant-menu-title-content{font-size:17px;line-height:20px;font-weight:var(--font-weight-semibold)}.GWTSauaAl_v9W8o4YPxW .ant-menu-title-content:hover{color:var(--color-orange)}.GWTSauaAl_v9W8o4YPxW .ant-menu-sub .ant-menu-title-content{font-size:15px;line-height:18px;font-weight:var(--font-weight-medium)}.GWTSauaAl_v9W8o4YPxW .ant-menu-sub .ant-menu-item{height:30px;line-height:30px;margin-bottom:16px}.GWTSauaAl_v9W8o4YPxW .ant-menu-sub .ant-menu-item:first-child{margin-top:-10px}.GWTSauaAl_v9W8o4YPxW .ant-menu-submenu{border-top:1px solid var(--color-orange);border-radius:0}.GWTSauaAl_v9W8o4YPxW .ant-menu-item:hover{background-color:initial !important}.GWTSauaAl_v9W8o4YPxW .ant-menu-item-selected,.GWTSauaAl_v9W8o4YPxW .ant-menu-submenu-selected>.ant-menu-submenu-title{color:var(--color-orange);background-color:initial}.GWTSauaAl_v9W8o4YPxW .ant-menu-inline .ant-menu-sub.ant-menu-inline{background:initial}.GWTSauaAl_v9W8o4YPxW .ant-menu-submenu-title{height:50px !important;line-height:50px !important}.GWTSauaAl_v9W8o4YPxW .ant-menu-submenu-title:hover{background-color:initial !important}.GWTSauaAl_v9W8o4YPxW .ant-menu-submenu-title .anticon{color:var(--color-orange)}.GWTSauaAl_v9W8o4YPxW .ant-menu-inline.ant-menu-root .ant-menu-item>.ant-menu-title-content{overflow-x:auto;text-overflow:unset}.hWGer1IJ7RdkfQWwYfsw{position:absolute;top:24px;left:24px;right:24px;height:144px}.MD1FhirslDDwd2izGwai{font-size:var(--font-size-body-2);line-height:14px;font-weight:var(--font-weight-light);display:inline-block;padding:12px;cursor:pointer;position:absolute;right:0;top:60px}.RxGn4c38kNq8Ai4ypW_x{position:absolute;top:144px;left:24px;right:24px;bottom:0;overflow-y:auto;overflow-x:hidden;padding-bottom:24px}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{border-radius:10px;background:rgba(0,0,0,.1)}::-webkit-scrollbar-thumb{border-radius:10px;background:rgba(0,0,0,.2)}::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.4)}::-webkit-scrollbar-thumb:active{background:rgba(0,0,0,.9)}
-.rdjN4ln3xiUoa6Q0NMMm{display:flex;flex-direction:column;gap:16px;height:100%}@media(min-width: 600px){.rdjN4ln3xiUoa6Q0NMMm{display:grid;grid-template-columns:220px auto}}@media(min-width: 768px){.rdjN4ln3xiUoa6Q0NMMm{grid-template-columns:300px auto}}.Q4flbvKEPN6Jx9Cob22I{background:#ebeced;overflow:auto;padding:20px}@media(max-width: 599px){.Q4flbvKEPN6Jx9Cob22I{padding:20px 20px 0 20px;max-height:80px}}.hK3soC6m563VuiLnNutq{background:var(--color-white);overflow:auto;padding:20px}@media(max-width: 599px){.hK3soC6m563VuiLnNutq{height:100%}}.guqqOMHeZE56Bg2p5Ad8{font-size:var(--font-size-body-2);color:var(--color-blue);margin-bottom:12px;font-weight:var(--font-weight-semibold);text-transform:uppercase}@media(min-width: 768px){.guqqOMHeZE56Bg2p5Ad8{font-size:var(--font-size-body-4);margin-bottom:36px}}.wRCQxnQc_MZGDeiY1bcL{padding-bottom:15px;font-weight:var(--font-weight-bold);font-size:var(--font-size-body-4)}@media(max-width: 767px){.wRCQxnQc_MZGDeiY1bcL{font-size:var(--font-size-body-3)}}.JRmeFBsSP1f1HJwarMpc{cursor:pointer}.Y6yF3VITdrKdQzDtqTZX{padding-left:16px}.Y6yF3VITdrKdQzDtqTZX .wRCQxnQc_MZGDeiY1bcL{font-weight:var(--font-weight-semibold)}.Y6yF3VITdrKdQzDtqTZX .aKZCkmPsc0LiPdj3sEeG .Y6yF3VITdrKdQzDtqTZX .wRCQxnQc_MZGDeiY1bcL{font-weight:var(--font-weight-light)}.aKZCkmPsc0LiPdj3sEeG{display:block}.U_3frSKmaOQyTCb9oBkg{color:var(--color-orange)}.GEZDeWAneRLnZQyf4y9l{margin-bottom:16px}@media(min-width: 768px){.GEZDeWAneRLnZQyf4y9l{margin-bottom:24px}}.YcOvMLXE7vKR2Y0_BPRr{font-size:var(--font-size-body-3);color:var(--color-blue);font-weight:var(--font-weight-semibold);margin-bottom:8px}@media(min-width: 768px){.YcOvMLXE7vKR2Y0_BPRr{font-size:var(--font-size-body-4)}}.vlMh_CCr45wbKV4fMhJx{font-size:var(--font-size-body-2);font-weight:var(--font-weight-light);color:var(--color-black)}@media(min-width: 768px){.vlMh_CCr45wbKV4fMhJx{font-size:var(--font-size-body-3)}}.NZ_ohAxNxhxZsCBr2PRA{display:flex;flex-direction:row;gap:12px;margin-bottom:24px}@media(min-width: 768px){.NZ_ohAxNxhxZsCBr2PRA{margin-bottom:36px}}.CArVrMs2ac6JvM1VGLSw{flex-direction:column;border-bottom:1px solid rgba(var(--color-blue-rgb), 0.2);margin-bottom:24px}.CArVrMs2ac6JvM1VGLSw .OpqJ6gab6fPIq3KyckPO{width:100%;border-bottom:none}.CArVrMs2ac6JvM1VGLSw .E9TXHxbgaI6LGMZHG9bV{width:100%;height:auto}.CArVrMs2ac6JvM1VGLSw .E9TXHxbgaI6LGMZHG9bV .ant-input{min-height:140px}.CArVrMs2ac6JvM1VGLSw .E9TXHxbgaI6LGMZHG9bV .ant-form-item{margin-bottom:16px}.OpqJ6gab6fPIq3KyckPO{width:100%;border-bottom:1px solid rgba(var(--color-blue-rgb), 0.2)}.E9TXHxbgaI6LGMZHG9bV{width:100px;height:50px;align-self:flex-end}.xdLvKgnXC4tm2aa6tAap{font-size:var(--font-size-body-4);font-weight:var(--font-weight-medium)}@media(max-width: 767px){.xdLvKgnXC4tm2aa6tAap{font-size:var(--font-size-body-3)}}.r5obiTduSUBq1uL7oceW{font-weight:var(--font-weight-light);font-size:var(--font-size-body-3);margin-bottom:4px}@media(max-width: 767px){.r5obiTduSUBq1uL7oceW{font-size:var(--font-size-body-2)}}.CHFuXtnqohUXV_oCAEKD{font-weight:var(--font-weight-light);margin-top:20px;display:flex;gap:4px}._Bw2YaPxzqqQRpeCMde6{word-wrap:break-word;white-space:pre-wrap;max-height:100px;overflow:auto;font-size:var(--font-size-body-3)}@media(max-width: 767px){._Bw2YaPxzqqQRpeCMde6{font-size:var(--font-size-body-2)}}.bIiuhNuRh643knAaSeyC{font-weight:var(--font-weight-semibold);font-size:var(--font-size-body-3)}@media(max-width: 767px){.bIiuhNuRh643knAaSeyC{font-size:var(--font-size-body-2)}}.DdqSfNoeh7KPEQiD0Zpe{margin-bottom:unset;width:100%}.sZh7rUlP4vu0LIE2fcab{font-weight:var(--font-weight-light);margin-bottom:4px;margin-top:16px;display:flex;gap:4px}.mdSJ5YgFou8MwSkVypYb{display:flex;flex-direction:column}.AvKaftoXc2t7E53rqtq6{display:flex;flex-direction:row;gap:20px;margin-top:12px;margin-bottom:12px;width:100%}.U3SMVXW9r1m_VHa3Y3V3{cursor:pointer}.SgT02NKW7ogui8ih5ehj{color:var(--color-black);background-color:var(--color-white);border:1px var(--color-black) solid;min-width:100px;height:20px;font-size:10px;padding:unset}.SgT02NKW7ogui8ih5ehj:hover{background-color:var(--color-grey-light);color:var(--color-black) !important;border:1px var(--color-black) solid !important}.URku_zrOtkyW6n9TPO22{margin-top:5px;cursor:pointer}@media(min-width: 1350px){.URku_zrOtkyW6n9TPO22{margin-top:1px}}@media(min-width: 768px){.URku_zrOtkyW6n9TPO22{font-size:4px}}.napoFD9UzaXTJiFTuxD7{font-size:12px;margin-right:4px}@media(min-width: 1350px){.napoFD9UzaXTJiFTuxD7{margin-top:4px;font-size:16px !important}}@media(min-width: 768px){.napoFD9UzaXTJiFTuxD7{font-size:14px}}.oKvHu4mW0qdERPdlFeaC{font-weight:400 !important;font-size:12px;text-transform:capitalize}@media(min-width: 1350px){.oKvHu4mW0qdERPdlFeaC{font-size:16px !important;margin-bottom:0px}}@media(min-width: 768px){.oKvHu4mW0qdERPdlFeaC{font-size:14px;margin-bottom:0px}}.WPOztO5lxS5PXlAz75dE{color:var(--color-black);background-color:var(--color-white);border:1px var(--color-black) solid;min-width:100px;height:20px;font-size:10px;padding:unset}.WPOztO5lxS5PXlAz75dE:hover{background-color:var(--color-grey-light);color:var(--color-black) !important;border:1px var(--color-black) solid !important}.Yz6q7yIXvsA956q84MoK{min-width:100% !important}.wNWP4ysIqgPu6PZjqhL4{width:25%;height:40px}@media(max-width: 767px){.wNWP4ysIqgPu6PZjqhL4{width:50%}}.WMxJFTbZxL1XrEMouOTq{width:25%;height:40px}@media(max-width: 767px){.WMxJFTbZxL1XrEMouOTq{width:50%}}.VXFyjnZC3eAzs5q36u0u{padding:unset;color:unset !important}.ant-upload-wrapper{line-height:12px}.ant-upload-wrapper .ant-upload-list .ant-upload-list-item{max-width:110px !important;font-size:12px !important}@media(max-width: 767px){.ant-upload-wrapper .ant-upload-list .ant-upload-list-item{font-size:10px !important}}:where(.css-dev-only-do-not-override-f7vrd6).ant-input-number .ant-input-number-input{height:35px}
+.rdjN4ln3xiUoa6Q0NMMm{display:flex;flex-direction:column;gap:16px;height:100%}@media(min-width: 600px){.rdjN4ln3xiUoa6Q0NMMm{display:grid;grid-template-columns:220px auto}}@media(min-width: 768px){.rdjN4ln3xiUoa6Q0NMMm{grid-template-columns:300px auto}}.Q4flbvKEPN6Jx9Cob22I{background:#ebeced;overflow:auto;padding:20px}@media(max-width: 599px){.Q4flbvKEPN6Jx9Cob22I{padding:20px 20px 0 20px;max-height:80px}}.hK3soC6m563VuiLnNutq{background:var(--color-white);overflow:auto;padding:20px}@media(max-width: 599px){.hK3soC6m563VuiLnNutq{height:100%}}.guqqOMHeZE56Bg2p5Ad8{font-size:var(--font-size-body-2);color:var(--color-blue);margin-bottom:12px;font-weight:var(--font-weight-semibold);text-transform:uppercase}@media(min-width: 768px){.guqqOMHeZE56Bg2p5Ad8{font-size:var(--font-size-body-4);margin-bottom:36px}}.wRCQxnQc_MZGDeiY1bcL{padding-bottom:15px;font-weight:var(--font-weight-bold);font-size:var(--font-size-body-4)}@media(max-width: 767px){.wRCQxnQc_MZGDeiY1bcL{font-size:var(--font-size-body-3)}}.JRmeFBsSP1f1HJwarMpc{cursor:pointer}.Y6yF3VITdrKdQzDtqTZX{padding-left:16px}.Y6yF3VITdrKdQzDtqTZX .wRCQxnQc_MZGDeiY1bcL{font-weight:var(--font-weight-semibold)}.Y6yF3VITdrKdQzDtqTZX .aKZCkmPsc0LiPdj3sEeG .Y6yF3VITdrKdQzDtqTZX .wRCQxnQc_MZGDeiY1bcL{font-weight:var(--font-weight-light)}.aKZCkmPsc0LiPdj3sEeG{display:block}.U_3frSKmaOQyTCb9oBkg{color:var(--color-orange)}.GEZDeWAneRLnZQyf4y9l{margin-bottom:16px}@media(min-width: 768px){.GEZDeWAneRLnZQyf4y9l{margin-bottom:24px}}.YcOvMLXE7vKR2Y0_BPRr{font-size:var(--font-size-body-3);color:var(--color-blue);font-weight:var(--font-weight-semibold);margin-bottom:8px}@media(min-width: 768px){.YcOvMLXE7vKR2Y0_BPRr{font-size:var(--font-size-body-4)}}.vlMh_CCr45wbKV4fMhJx{font-size:var(--font-size-body-2);font-weight:var(--font-weight-light);color:var(--color-black)}@media(min-width: 768px){.vlMh_CCr45wbKV4fMhJx{font-size:var(--font-size-body-3)}}.NZ_ohAxNxhxZsCBr2PRA{display:flex;flex-direction:row;gap:12px;margin-bottom:24px}@media(min-width: 768px){.NZ_ohAxNxhxZsCBr2PRA{margin-bottom:36px}}.CArVrMs2ac6JvM1VGLSw{flex-direction:column;border-bottom:1px solid rgba(var(--color-blue-rgb), 0.2);margin-bottom:24px}.CArVrMs2ac6JvM1VGLSw .OpqJ6gab6fPIq3KyckPO{width:100%;border-bottom:none}.CArVrMs2ac6JvM1VGLSw .E9TXHxbgaI6LGMZHG9bV{width:100%;height:auto}.CArVrMs2ac6JvM1VGLSw .E9TXHxbgaI6LGMZHG9bV .ant-input{min-height:140px}.CArVrMs2ac6JvM1VGLSw .E9TXHxbgaI6LGMZHG9bV .ant-form-item{margin-bottom:16px}.OpqJ6gab6fPIq3KyckPO{width:100%;border-bottom:1px solid rgba(var(--color-blue-rgb), 0.2)}.E9TXHxbgaI6LGMZHG9bV{width:100px;height:50px;align-self:flex-end}.xdLvKgnXC4tm2aa6tAap{font-size:var(--font-size-body-4);font-weight:var(--font-weight-medium)}@media(max-width: 767px){.xdLvKgnXC4tm2aa6tAap{font-size:var(--font-size-body-3)}}.r5obiTduSUBq1uL7oceW{font-weight:var(--font-weight-light);font-size:var(--font-size-body-3);margin-bottom:4px}@media(max-width: 767px){.r5obiTduSUBq1uL7oceW{font-size:var(--font-size-body-2)}}.CHFuXtnqohUXV_oCAEKD{font-weight:var(--font-weight-light);margin-top:20px;display:flex;gap:4px}._Bw2YaPxzqqQRpeCMde6{word-wrap:break-word;white-space:pre-wrap;max-height:100px;overflow:auto;font-size:var(--font-size-body-3)}@media(max-width: 767px){._Bw2YaPxzqqQRpeCMde6{font-size:var(--font-size-body-2)}}.bIiuhNuRh643knAaSeyC{font-weight:var(--font-weight-semibold);font-size:var(--font-size-body-3)}@media(max-width: 767px){.bIiuhNuRh643knAaSeyC{font-size:var(--font-size-body-2)}}.DdqSfNoeh7KPEQiD0Zpe{margin-bottom:unset;width:100%}.sZh7rUlP4vu0LIE2fcab{font-weight:var(--font-weight-light);margin-bottom:4px;margin-top:16px;display:flex;gap:4px}.mdSJ5YgFou8MwSkVypYb{display:flex;flex-direction:column}.AvKaftoXc2t7E53rqtq6{display:flex;flex-direction:row;justify-content:center;gap:20px;margin-top:12px;margin-bottom:12px;width:100%}.U3SMVXW9r1m_VHa3Y3V3{cursor:pointer}.SgT02NKW7ogui8ih5ehj{color:var(--color-black);background-color:var(--color-white);border:1px var(--color-black) solid;min-width:100px;height:20px;font-size:10px;padding:unset}.SgT02NKW7ogui8ih5ehj:hover{background-color:var(--color-grey-light);color:var(--color-black) !important;border:1px var(--color-black) solid !important}.URku_zrOtkyW6n9TPO22{text-align:center}.UNtzy3E3VX36bgrXWOvb{margin-top:5px;cursor:pointer}@media(min-width: 1350px){.UNtzy3E3VX36bgrXWOvb{margin-top:1px}}@media(min-width: 768px){.UNtzy3E3VX36bgrXWOvb{font-size:4px}}.napoFD9UzaXTJiFTuxD7{font-size:12px;margin-right:4px}@media(min-width: 1350px){.napoFD9UzaXTJiFTuxD7{margin-top:4px;font-size:16px !important}}@media(min-width: 768px){.napoFD9UzaXTJiFTuxD7{font-size:14px}}.oKvHu4mW0qdERPdlFeaC{font-weight:400 !important;font-size:12px;text-transform:capitalize}@media(min-width: 1350px){.oKvHu4mW0qdERPdlFeaC{font-size:16px !important;margin-bottom:0px}}@media(min-width: 768px){.oKvHu4mW0qdERPdlFeaC{font-size:14px;margin-bottom:0px}}.WPOztO5lxS5PXlAz75dE{color:var(--color-black);background-color:var(--color-white);border:1px var(--color-black) solid;min-width:100px;height:20px;font-size:10px;padding:unset}.WPOztO5lxS5PXlAz75dE:hover{background-color:var(--color-grey-light);color:var(--color-black) !important;border:1px var(--color-black) solid !important}.Yz6q7yIXvsA956q84MoK{min-width:100% !important}.wNWP4ysIqgPu6PZjqhL4{width:25%;height:40px}@media(max-width: 767px){.wNWP4ysIqgPu6PZjqhL4{width:50%}}.WMxJFTbZxL1XrEMouOTq{width:25%;height:40px}@media(max-width: 767px){.WMxJFTbZxL1XrEMouOTq{width:50%}}.VXFyjnZC3eAzs5q36u0u{padding:unset;color:unset !important}.ant-upload-wrapper{line-height:12px}.ant-upload-wrapper .ant-upload-list .ant-upload-list-item{max-width:20vw !important;font-size:12px !important}@media(max-width: 767px){.ant-upload-wrapper .ant-upload-list .ant-upload-list-item{font-size:10px !important;max-width:50vw !important}}:where(.css-dev-only-do-not-override-f7vrd6).ant-input-number .ant-input-number-input{height:35px}
 .lvTuRa6cS5HtBGBJWfyE{color:var(--color-black);background-color:var(--color-white);border:1px var(--color-black) solid;min-width:100px;height:20px;font-size:10px;padding:unset}@media(max-width: 767px){.lvTuRa6cS5HtBGBJWfyE{min-width:0px}}.lvTuRa6cS5HtBGBJWfyE:hover{background-color:var(--color-grey-light);color:var(--color-black) !important;border:1px var(--color-black) solid !important}.ant-upload-wrapper{line-height:12px}.ant-upload-wrapper .ant-upload-list .ant-upload-list-item{max-width:100px}
 .qaO99d3JMWSM8DLS1LvS{display:flex;flex-direction:column;background-color:var(--white-color);padding:24px;color:var(--color-black);width:150px;word-wrap:break-word}.G3bzjyAQXu8uaFGhNMLG{width:150px}.Zv6hI_F5yvuBDnPK8u2C{color:var(--color-blue) !important;font-size:var(--font-size-body-5);font-weight:var(--font-weight-bold)}.JxTKMPM3nEvZB42uuV1e{font-weight:var(--font-weight-semibold);font-size:var(--font-size-label);margin-top:0px}.JKKhO8apIWdMp0JLU0iD{font-weight:var(--font-weight-bold);font-size:var(--font-size-body-base)}.GqgjW40ocDFW4xi4Mszm{font-weight:var(--font-weight-regular);font-size:var(--font-size-label)}
 .zsvRMmfrmqBj9iRjtQpO{display:grid;grid-template-columns:300px auto;gap:16px;height:100%}.pb4QP8qfuDG2T6wfXkUC{overflow:auto;background:#ebeced}.gP05vt1R1r67eWteznvr{overflow:auto;background:var(--color-white)}.pb4QP8qfuDG2T6wfXkUC,.gP05vt1R1r67eWteznvr{padding:20px}.btRPAI8631Q2XXYP6nZ7{font-size:var(--font-size-body-4);color:var(--color-blue);margin-bottom:36px;font-weight:var(--font-weight-semibold);text-transform:uppercase}.SbA9dHRh1JSG4xp1Aqie{padding-bottom:15px;font-weight:var(--font-weight-bold);font-size:var(--font-size-body-4)}@media(max-width: 767px){.SbA9dHRh1JSG4xp1Aqie{font-size:var(--font-size-body-3)}}.ZsQJQ__gMgYGYau95r8U{cursor:pointer}.PPF4FGgo1aDsBm13cNj8{padding-left:16px}.PPF4FGgo1aDsBm13cNj8 .SbA9dHRh1JSG4xp1Aqie{font-weight:var(--font-weight-semibold)}.PPF4FGgo1aDsBm13cNj8 .QEsWraNRLBQux4k4KNAE .PPF4FGgo1aDsBm13cNj8 .SbA9dHRh1JSG4xp1Aqie{font-weight:var(--font-weight-light)}.QEsWraNRLBQux4k4KNAE{display:block}.VQ09MnwMcIzpW1iabb4A{color:var(--color-orange)}.cmcMqdZJEUjlu34ag1Md{margin-bottom:4px;display:flex;justify-content:flex-end;align-items:center}@media(max-width: 767px){.cmcMqdZJEUjlu34ag1Md{margin-bottom:20px}}.i_U4mKg0Sxl4EvVzgv0L{font-size:var(--font-size-body-4);color:var(--color-blue);font-weight:var(--font-weight-semibold);margin-bottom:8px}.Tnut0v2OeSU0e7XwrCXI{font-size:var(--font-size-body-3);font-weight:var(--font-weight-light);color:var(--color-black)}.W2hZQFsItdqKPcBu4UrA{display:flex;flex-direction:row;gap:36px;margin-bottom:36px;border-bottom:1px solid rgba(var(--color-blue-rgb), 0.2);padding-bottom:4px}.tIVLagS5XxibJ4PBCNpp{flex-direction:column;border-bottom:1px solid rgba(var(--color-blue-rgb), 0.2);margin-bottom:24px}.tIVLagS5XxibJ4PBCNpp .RenA6EOwu2sFJGoqYbYz{width:100%;border-bottom:none}.tIVLagS5XxibJ4PBCNpp .N0_FbFF8bLYtEcr8_2B9{width:100%;height:auto}.tIVLagS5XxibJ4PBCNpp .N0_FbFF8bLYtEcr8_2B9 .ant-input{min-height:140px}.tIVLagS5XxibJ4PBCNpp .N0_FbFF8bLYtEcr8_2B9 .ant-form-item{margin-bottom:16px}.RenA6EOwu2sFJGoqYbYz{width:calc(100% - 149px);display:flex;align-items:center}.N0_FbFF8bLYtEcr8_2B9{width:130px;min-width:130px;align-self:flex-end;display:flex;justify-content:space-between;padding-right:15px}.GaBbmrXh2G03hz6ha5vB{display:none}.QYrBVtDmfSFNxJFztXVl{min-width:130px;align-self:flex-end;display:flex;justify-content:space-between;gap:34px}.V_qOYQwuQ9mXa8aniYgl{font-size:var(--font-size-body-4);font-weight:var(--font-weight-medium)}@media(max-width: 767px){.V_qOYQwuQ9mXa8aniYgl{font-size:var(--font-size-body-3)}}.pvSzNydRHp3dkh3WrOeA{font-weight:var(--font-weight-light);font-size:var(--font-size-body-3);margin-bottom:4px}@media(max-width: 767px){.pvSzNydRHp3dkh3WrOeA{font-size:var(--font-size-body-2)}}.Ehgx39o1k8blh7IDJ2mg{padding:6px;font-size:var(--font-size-body-4);font-weight:var(--font-weight-medium);color:var(--color-white);border-radius:5px;display:inline-flex;letter-spacing:3px}.ifR0bkZtK7yVHD6YZ_Zz{background-color:rgba(217,217,217,.5);border-radius:5px;padding:8px 15px;display:flex;flex-direction:row;gap:50px;align-items:center}@media(max-width: 767px){.ifR0bkZtK7yVHD6YZ_Zz{gap:12px;padding:4px 8px}}.NL5HeemkTIg0oPHDXVtO{font-size:var(--font-size-body-3);font-weight:var(--font-weight-medium);color:var(--color-black)}.koYqEMOf6wzxWpwvrFkL{display:flex;justify-content:space-between;margin-bottom:12px;margin-left:16px;gap:40px;width:100%}

package/dist/types/components/ResponseType/ResponseType.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta, Story } from "@storybook/react";
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Primary: Story<any>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@omniumretail/component-library",
-  "version": "1.2.30",
+  "version": "1.2.31",
   "private": false,
   "main": "dist/bundle.js",
   "typings": "./dist/types/index",

package/src/components/Button/styles.module.scss

@@ -24,13 +24,6 @@
         color: var(--button-default-text-hover-color) !important;
     }
 
-    &:focus,
-    &:active,
-    &:focus:active {
-        background-color: var(--button-default-background-focus-color) !important;
-        color: var(--button-default-text-focus-color) !important;
-    }
-
     &:disabled,
     &.disabled {
         background-color: #C7CAC9 !important;
@@ -52,13 +45,6 @@
             color: var(--button-style-1-text-hover-color) !important;
         }
 
-        &:focus,
-        &:active,
-        &:focus:active {
-            background-color: var(--button-style-1-background-focus-color);
-            color: var(--button-style-1-text-focus-color);
-        }
-
         &:disabled,
         &.disabled {
             background-color: var(--button-disabled-background-color);

package/src/components/CategoryResponse/index.tsx

@@ -1,6 +1,6 @@
 import styles from './styles.module.scss';
 import { useEffect, useImperativeHandle, useState } from 'react';
-import { Form, UploadFile, Upload, DatePicker, InputNumber, Tag } from 'antd';
+import { Form, UploadFile, Upload, DatePicker, InputNumber, Tag, Modal } from 'antd';
 import { useForm } from 'antd/es/form/Form';
 import classNames from 'classnames';
 import TextArea from 'antd/es/input/TextArea';
@@ -101,6 +101,8 @@ export const CategoryResponse = React.forwardRef((props: CategoryResponse, ref)
     const [isNoteVisible, setIsNoteVisible] = useState<{ categoryIndex: number; questionIndex: number } | null>(null);
     const [form] = useForm();
     const [isMobile, setIsMobile] = useState(window.innerWidth < 767);
+    const [previewVisible, setPreviewVisible] = useState(false);
+    const [previewImage, setPreviewImage] = useState<string>("");
 
     const handleResize = () => {
         setIsMobile(window.innerWidth < 767);
@@ -141,11 +143,11 @@ export const CategoryResponse = React.forwardRef((props: CategoryResponse, ref)
                     ? !question.Disabled
                         ? (question.IsDate
                             ? (question?.Answer?.length > 0
-                                ? dayjs.unix(Number(question?.Answer?.[0]))
+                                ? dayjs.unix(Number(question?.Answer))
                                 : null)
                             : question.Answer)
-                        : data.StartDate
-                    : question.Answer,
+                        : question.Answer
+                    : data.StartDate,
                 Note: question.Note || "",
                 IsMultipleChoise: question.IsMultipleChoise || false,
                 IsNumerical: question.IsNumerical || false,
@@ -200,10 +202,9 @@ export const CategoryResponse = React.forwardRef((props: CategoryResponse, ref)
                 reader.onload = () => resolve(reader.result as string);
             });
         }
-        const image = new Image();
-        image.src = src;
-        const imgWindow = window.open(src);
-        imgWindow?.document.write(image.outerHTML);
+
+        setPreviewImage(src);
+        setPreviewVisible(true);
     };
 
     const handleAddAction = (questionId: string, questionAnswerId: string) => {
@@ -390,25 +391,36 @@ export const CategoryResponse = React.forwardRef((props: CategoryResponse, ref)
                                                     <span className={styles.buttonLabel}>{t('components.categoryResponse.note')}</span>
                                                 </div>
 
+                                                <div className={styles.uploadContainer}>
+                                                    <Upload
+                                                        listType={"picture"}
+                                                        fileList={fileLists[`${selectedCategory.Data.CategoryId}_${question.Id}`] || []}
+                                                        beforeUpload={() => false} // Prevent automatic upload
+                                                        onChange={({ fileList }) => handleFileChange(fileList, selectedCategory.Data.CategoryId, question.Id)}
+                                                        onPreview={onPreview}
+                                                    >
+                                                        <div className={styles.uploadIconContainer}>
+                                                            <PictureOutlined className={styles.iconStyle} />
+
+                                                            <span className={styles.buttonLabel}>{t('components.categoryResponse.loadFile')}</span>
+                                                        </div>
+                                                    </Upload>
+
+                                                    <Modal
+                                                        open={previewVisible}
+                                                        footer={null}
+                                                        onCancel={() => setPreviewVisible(false)}
+                                                        closeIcon={false}
+                                                    >
+                                                        <img alt="Preview" style={{ width: "100%" }} src={previewImage} />
+                                                    </Modal>
+                                                </div>
+
                                                 <div className={styles.buttonContainer} onClick={() => handleAddAction(question.QuestionId, question.Id)}>
                                                     <FileDoneOutlined className={styles.iconStyle} />
 
                                                     <span className={styles.buttonLabel}>{t('components.categoryResponse.createAction')}</span>
                                                 </div>
-
-                                                <Upload
-                                                    listType={"text"}
-                                                    fileList={fileLists[`${selectedCategory.Data.CategoryId}_${question.Id}`] || []}
-                                                    beforeUpload={() => false} // Prevent automatic upload
-                                                    onChange={({ fileList }) => handleFileChange(fileList, selectedCategory.Data.CategoryId, question.Id)}
-                                                    onPreview={onPreview}
-                                                >
-                                                    <div className={styles.uploadContainer}>
-                                                        <PictureOutlined className={styles.iconStyle} />
-
-                                                        <span className={styles.buttonLabel}>{t('components.categoryResponse.loadFile')}</span>
-                                                    </div>
-                                                </Upload>
                                             </div>
                                         </>
                                     }

package/src/components/CategoryResponse/styles.module.scss

@@ -232,6 +232,7 @@
 .actionsButtonsContainer {
     display: flex;
     flex-direction: row;
+    justify-content: center;
     gap: 20px;
     margin-top: 12px;
     margin-bottom: 12px;
@@ -259,6 +260,10 @@
 }
 
 .uploadContainer {
+    text-align: center;
+}
+
+.uploadIconContainer {
     margin-top: 5px;
     cursor: pointer;
 
@@ -350,11 +355,12 @@
     }
 
     .ant-upload-wrapper .ant-upload-list .ant-upload-list-item {
-        max-width: 110px !important;
+        max-width: calc(100vw/5) !important;
         font-size: 12px !important;
 
         @media(max-width: 767px) {
             font-size: 10px !important;
+            max-width: calc(100vw/2) !important;
         }
     }
 

package/src/components/Questions/index.tsx

@@ -44,9 +44,12 @@ export const Questions = (props: QuestionsProps) => {
         }
 
         const newItems: any = [...items];
+
         const [removed] = newItems.splice(result?.source?.index, 1);
+
         newItems.splice(result.destination?.index, 0, removed);
-        props.form.setFieldValue('questions', newItems);
+
+        console.log(props?.form?.setFieldValue('questions', newItems), "props?.form?.setFieldValue('questions', newItems)");
     };
 
     return (

package/src/components/ResponseType/ResponseType.stories.tsx

@@ -0,0 +1,393 @@
+import { Meta, Story } from "@storybook/react";
+import { useEffect, useState } from "react";
+import { ResponseType } from '.';
+
+export default {
+    title: 'ResponseType',
+    component: ResponseType,
+} as Meta;
+
+const Template: Story<any> = (args) => {
+    const [categoryContentInfo, setCategoryContentInfo] = useState<any>();
+
+    const getAnswer = {
+        "Id": "57859452-4B79-4005-BB6C-3695C78270FD",
+        "Name": "Levi's Stores",
+        "IsOpenAnswer": false,
+        "IsCheckBox": false,
+        "IsNumeric": false,
+        "IsDate": false,
+        "HasGrade": false,
+        "IsEmphasis": false,
+        "IsMultipleChoise": false,
+        "IsStore": false,
+        "State": "Finished",
+        "Grade": 0,
+        "Rank": 8,
+        "Options": [
+            {
+                "Value": "2 - LS Via Catarina Shopping",
+                "Grade": "N/A",
+                "Color": "#000000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "4 - LS Amoreiras Shopping",
+                "Grade": "N/A",
+                "Color": "#000000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "5 - Levis GaiaShopping",
+                "Grade": "N/A",
+                "Color": "#000000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "6 - LS Arrábida Shopping",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "9 - LS Artea",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "10 - LS Nova Arcada",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "11 - LS Rio Shopping",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "12 - LS Garbera",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "13 - LS La Maquinista",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "14 - LS GuimarãesShopping",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "15 - LS Moyua",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "17 - LS As Cancelas",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "19 - LS Intu-Asturias",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "20 - LS Gran Via II",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "21 - LS NorteShopping",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "22 - LS Forum Coimbra",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "24 - LS Marineda City",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "26 - LS Girona",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "27 - LS Vasco da Gama",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "30 - LS Alameda Shop & Spot",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "31 - LS AlgarveShopping",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "32 - LS CascaiShopping",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "33 - LS Vitoria Boulevard",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "34 - LS Oeiras Parque",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "35 - LS LeiriaShopping",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "36 - LS Braga Parque",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "37 - LS Alegro Sintra",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "42 - LS Palácio do Gelo",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "44 - LS Chiado",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "45 - LS Colombo",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "47 - LS Almada Forum",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "48 - LS MarShopping",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "49 - LS Forum Aveiro",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "50 - LS Berceo Mall",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "51 - LS Sant Cugat",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "53 - LS Anec Blau",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "54 - LS Puerto Venecia",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "55 - LS FAN Mallorca",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "56 - LS Ramblas",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "57 - LS Ubbo",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "58 - LS Forum Algarve",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "59 - LS Parc Central",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "60 - LS Pamplona La Morea",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "65 - LS Santander",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "68 - LS Principe",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "69 - LS Restauradores",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "78 - LS Espacio Leon",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "80 - LS Salamanca",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "81 - LS Porto Pi",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "82 - LS Mataró Parc",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "83 - LS Diagonal 605",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "85 - LS Arcs",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "86 - LS Lleida",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "88 - LS Valle Real Santander",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            },
+            {
+                "Value": "25 - Levis La Vaguada",
+                "Grade": "N/A",
+                "Color": "#00000",
+                "NeedsAction": false
+            }
+        ],
+        "CreateDate": "2024-07-04T11:32:36.118Z",
+        "UpdateDate": "2024-12-26T13:18:23.016Z",
+        "StartDate": "2024-12-26T13:18:23.016Z",
+        "Status": "A",
+        "ShowAnswerType": true,
+        "IsInUse": false,
+        "UseName": true
+    };
+
+    let initialValues;
+
+    initialValues = {
+        name: getAnswer?.Name,
+        questions: getAnswer?.Options?.map((option) => ({
+            question: option?.Value,
+            score: option?.Grade,
+            color: option?.Color,
+            flagged: option?.NeedsAction
+
+        }))
+    };
+
+    useEffect(() => {
+        console.log(categoryContentInfo);
+    }, [categoryContentInfo])
+
+    return <ResponseType {...args} categoryContentInfo={setCategoryContentInfo} data={initialValues}  ></ResponseType>
+};
+
+export const Primary = Template.bind({});
+Primary.args = {
+};
+
+
+

package/src/components/ResponseType/index.tsx

@@ -90,6 +90,7 @@ export const ResponseType = (props: categoryContent) => {
                             handleChanges={handleInputChange}
                             responseTypeOptions={responseTypeOptions}
                             responseTypeComponent
+                            form={form}
                         />
                     </Form.Item>
                 </div>