mitre-form-component 2.2.4 → 2.2.6

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 CHANGED
@@ -777,75 +777,84 @@ var fadeOut = keyframes`
777
777
  `;
778
778
  var typeStyles = {
779
779
  error: css4`
780
- background-color: ${theme.colors.red};
781
- border: 1px solid ${theme.colors.red};
782
- color: ${theme.colors.white};
780
+ background-color: ${theme.colors.red} !important;
781
+ border: 1px solid ${theme.colors.red} !important;
782
+ color: ${theme.colors.white} !important;
783
783
  svg {
784
- color: ${theme.colors.white};
784
+ color: ${theme.colors.white} !important;
785
785
  }
786
786
  `,
787
787
  warning: css4`
788
- background-color: ${theme.colors.yellow500};
789
- border: 1px solid ${theme.colors.yellow400};
790
- color: ${theme.colors.black};
788
+ background-color: ${theme.colors.yellow500} !important;
789
+ border: 1px solid ${theme.colors.yellow400} !important;
790
+ color: ${theme.colors.black} !important;
791
791
  svg {
792
- color: ${theme.colors.black};
792
+ color: ${theme.colors.black} !important;
793
793
  }
794
794
  `,
795
795
  info: css4`
796
- background-color: ${theme.colors.blue};
797
- border: 1px solid ${theme.colors.blue};
798
- color: ${theme.colors.white};
796
+ background-color: ${theme.colors.blue} !important;
797
+ border: 1px solid ${theme.colors.blue} !important;
798
+ color: ${theme.colors.white} !important;
799
799
  svg {
800
- color: ${theme.colors.white};
800
+ color: ${theme.colors.white} !important;
801
801
  }
802
802
  `,
803
803
  success: css4`
804
- background-color: ${theme.colors.green};
805
- border: 1px solid ${theme.colors.green2};
806
- color: ${theme.colors.white};
804
+ background-color: ${theme.colors.green} !important;
805
+ border: 1px solid ${theme.colors.green2} !important;
806
+ color: ${theme.colors.white} !important;
807
807
  svg {
808
- color: ${theme.colors.white};
808
+ color: ${theme.colors.white} !important;
809
809
  }
810
810
  `
811
811
  };
812
812
  var AlertContainer = styled5.div`
813
- position: fixed;
814
- width: 500px;
815
- top: 15px;
816
- right: 15px;
817
- padding: 1rem ${({ $dismissible }) => $dismissible ? "2.5rem" : "1rem"} 1rem
818
- 1rem;
819
- margin-bottom: 1rem;
820
- animation: ${({ $isClosing }) => $isClosing ? fadeOut : fadeIn} 0.3s
821
- ease-out;
822
- animation-fill-mode: forwards;
823
- align-items: center;
824
- gap: 0.5rem;
825
- box-shadow: ${theme.shadows.shadow500};
826
- border-radius: 0.5rem;
827
- font-size: 1rem;
828
- font-weight: 500;
813
+ && {
814
+ position: fixed !important;
815
+ width: 500px !important;
816
+ top: 15px !important;
817
+ right: 15px !important;
818
+ padding: 1rem ${({ $dismissible }) => $dismissible ? "2.5rem" : "1rem"} 1rem
819
+ 1rem !important;
820
+ margin: 0 0 1rem !important;
821
+ align-items: center !important;
822
+ gap: 0.5rem !important;
823
+ box-shadow: ${theme.shadows.shadow500} !important;
824
+ border-radius: 0.5rem !important;
825
+ font-size: 1rem !important;
826
+ font-weight: 500 !important;
827
+ box-sizing: border-box !important;
828
+ z-index: 9999 !important;
829
+ animation: ${({ $isClosing }) => $isClosing ? fadeOut : fadeIn} 0.3s
830
+ ease-out;
831
+ animation-fill-mode: forwards;
832
+ }
829
833
 
830
834
  ${({ $type }) => typeStyles[$type]}
831
835
  `;
832
836
  var DismissButton = styled5.button`
833
- position: absolute;
834
- background: transparent;
835
- right: 10px;
836
- border: none;
837
- cursor: pointer;
838
- color: inherit;
839
- opacity: 1;
840
- transition: opacity 0.2s;
837
+ && {
838
+ position: absolute !important;
839
+ background: transparent !important;
840
+ right: 10px !important;
841
+ border: none !important;
842
+ cursor: pointer !important;
843
+ color: inherit !important;
844
+ opacity: 1 !important;
845
+ padding: 0 !important;
846
+ margin: 0 !important;
847
+ box-sizing: border-box !important;
848
+ transition: opacity 0.2s;
849
+ }
841
850
 
842
- &:hover {
843
- opacity: 0.7;
851
+ &&:hover {
852
+ opacity: 0.7 !important;
844
853
  }
845
854
 
846
- svg {
847
- width: 1rem;
848
- height: 1rem;
855
+ && svg {
856
+ width: 1rem !important;
857
+ height: 1rem !important;
849
858
  }
850
859
  `;
851
860
 
@@ -1788,12 +1797,20 @@ var MitreFormComponent = React2.forwardRef(({
1788
1797
  }, REDIRECT_DELAY_MS);
1789
1798
  }
1790
1799
  } else if (channel === "chat") {
1791
- const { channel: _channelInBody, ...requestBodyNoChannel } = requestBody;
1800
+ const { channel: _channelInBody, name: _nameInBody, phone: _phoneInBody, ...requestBodyMinimal } = requestBody;
1801
+ const dialCode = phone.dialCode;
1802
+ const nationalDigits = dialCode && phoneDigitsOnly.startsWith(dialCode) ? phoneDigitsOnly.slice(dialCode.length) : phoneDigitsOnly;
1803
+ const foneDdd = nationalDigits.slice(0, 2);
1804
+ const foneNumber = nationalDigits.slice(2);
1792
1805
  const effectiveIdEmpreendimento = idEmpreendimento ?? selectedProduct.id.toString();
1793
1806
  const effectiveIdProdutoTerceiro = idProdutoTerceiro ?? "0";
1794
1807
  const virtualObj = {
1795
- ...requestBodyNoChannel,
1808
+ ...requestBodyMinimal,
1796
1809
  canal: channel,
1810
+ nome: name,
1811
+ ddi: dialCode,
1812
+ ddd: foneDdd,
1813
+ fone: foneNumber,
1797
1814
  externalOriginId: leadId,
1798
1815
  idEmpreendimento: effectiveIdEmpreendimento,
1799
1816
  id_produto: effectiveIdEmpreendimento,