contentoh-components-library 21.4.7 → 21.4.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (108) hide show
  1. package/.env.development +1 -5
  2. package/.env.production +1 -3
  3. package/dist/assets/fonts/roboto/LICENSE.txt +202 -0
  4. package/dist/components/atoms/Avatar/index.js +2 -3
  5. package/dist/components/atoms/Card/index.js +5 -46
  6. package/dist/components/atoms/Card/styles.js +1 -3
  7. package/dist/components/atoms/CheckBox/index.js +2 -7
  8. package/dist/components/atoms/CheckBox/styles.js +1 -1
  9. package/dist/components/atoms/InputFormatter/styles.js +1 -1
  10. package/dist/components/molecules/CarouselImagesLogin/index.js +1 -1
  11. package/dist/components/molecules/HeaderTop/index.js +11 -68
  12. package/dist/components/molecules/TagAndInput/index.js +1 -1
  13. package/dist/components/organisms/Chat/Chat.stories.js +8 -27
  14. package/dist/components/organisms/Chat/ContainerItems/index.js +3 -19
  15. package/dist/components/organisms/Chat/ContainerItems/styles.js +1 -1
  16. package/dist/components/organisms/Chat/ContentChat/index.js +197 -350
  17. package/dist/components/organisms/Chat/Footer/index.js +39 -48
  18. package/dist/components/organisms/Chat/index.js +4 -49
  19. package/dist/components/organisms/FullProductNameHeader/index.js +2 -2
  20. package/dist/components/organisms/Modal/styles.js +1 -1
  21. package/dist/components/pages/ProviderProductEdition/ProviderProductEdition.stories.js +29 -169
  22. package/dist/components/pages/ProviderProductEdition/index.js +203 -213
  23. package/dist/components/pages/ProviderProductEdition/styles.js +1 -1
  24. package/dist/components/pages/RetailerProductEdition/RetailerProductEdition.stories.js +60 -85
  25. package/dist/components/pages/RetailerProductEdition/index.js +303 -315
  26. package/dist/components/pages/RetailerProductEdition/styles.js +1 -1
  27. package/dist/components/pages/RetailerProductEdition/utils.js +2 -61
  28. package/dist/index.js +52 -234
  29. package/package.json +1 -4
  30. package/src/components/atoms/Avatar/index.js +2 -8
  31. package/src/components/atoms/Card/index.js +2 -35
  32. package/src/components/atoms/Card/styles.js +5 -41
  33. package/src/components/atoms/CheckBox/index.js +1 -4
  34. package/src/components/atoms/CheckBox/styles.js +0 -2
  35. package/src/components/atoms/InputFormatter/styles.js +1 -2
  36. package/src/components/molecules/CarouselImagesLogin/index.js +1 -1
  37. package/src/components/molecules/HeaderTop/index.js +6 -52
  38. package/src/components/molecules/TagAndInput/index.js +8 -10
  39. package/src/components/organisms/Chat/Chat.stories.js +7 -27
  40. package/src/components/organisms/Chat/ContainerItems/index.js +2 -18
  41. package/src/components/organisms/Chat/ContainerItems/styles.js +2 -10
  42. package/src/components/organisms/Chat/ContentChat/index.js +12 -88
  43. package/src/components/organisms/Chat/Footer/index.js +0 -11
  44. package/src/components/organisms/Chat/index.js +4 -46
  45. package/src/components/organisms/FullProductNameHeader/index.js +1 -1
  46. package/src/components/organisms/Modal/styles.js +1 -4
  47. package/src/components/organisms/OrderDetail/utils/Table/utils.js +16 -6
  48. package/src/components/pages/ProviderProductEdition/ProviderProductEdition.stories.js +34 -188
  49. package/src/components/pages/ProviderProductEdition/index.js +132 -132
  50. package/src/components/pages/ProviderProductEdition/styles.js +1 -5
  51. package/src/components/pages/RetailerProductEdition/RetailerProductEdition.stories.js +41 -72
  52. package/src/components/pages/RetailerProductEdition/index.js +138 -122
  53. package/src/components/pages/RetailerProductEdition/styles.js +0 -4
  54. package/src/components/pages/RetailerProductEdition/utils.js +0 -37
  55. package/src/index.js +0 -15
  56. package/src/components/atoms/ImageCarousel/ImgeSlider.stories.js +0 -76
  57. package/src/components/atoms/ImageCarousel/index.js +0 -103
  58. package/src/components/atoms/ImageCarousel/styles.js +0 -79
  59. package/src/components/atoms/PercentTag/PercentTag.stories.js +0 -7
  60. package/src/components/atoms/PercentTag/index.js +0 -9
  61. package/src/components/atoms/PercentTag/styles.js +0 -69
  62. package/src/components/atoms/RatingStars/RatingStars.stories.js +0 -10
  63. package/src/components/atoms/RatingStars/index.js +0 -31
  64. package/src/components/atoms/RatingStars/styles.js +0 -28
  65. package/src/components/atoms/RetailerCatalog/RetailerCatalog.stories.js +0 -36
  66. package/src/components/atoms/RetailerCatalog/index.js +0 -49
  67. package/src/components/atoms/RetailerCatalog/styles.js +0 -30
  68. package/src/components/atoms/RetailerOption/RetailerOption.stories.js +0 -15
  69. package/src/components/atoms/RetailerOption/index.js +0 -53
  70. package/src/components/atoms/RetailerOption/styles.js +0 -41
  71. package/src/components/atoms/RetailersList/RetailersList.stories.js +0 -33
  72. package/src/components/atoms/RetailersList/index.js +0 -20
  73. package/src/components/atoms/RetailersList/styles.js +0 -19
  74. package/src/components/atoms/UserCatalog/UserCatalog.stories.js +0 -67
  75. package/src/components/atoms/UserCatalog/index.js +0 -96
  76. package/src/components/atoms/UserCatalog/styles.js +0 -24
  77. package/src/components/atoms/UserOption/UserOption.stories.js +0 -25
  78. package/src/components/atoms/UserOption/index.js +0 -95
  79. package/src/components/atoms/UserOption/styles.js +0 -61
  80. package/src/components/atoms/UserSelector/UserSelector.stories.js +0 -25
  81. package/src/components/atoms/UserSelector/index.js +0 -86
  82. package/src/components/atoms/UserSelector/styles.js +0 -55
  83. package/src/components/molecules/GridItem/GridItem.stories.js +0 -126
  84. package/src/components/molecules/GridItem/index.js +0 -97
  85. package/src/components/molecules/GridItem/styles.js +0 -104
  86. package/src/components/molecules/HeaderItem/ColumnItem.js +0 -9
  87. package/src/components/molecules/HeaderItem/HeaderItem.stories.js +0 -24
  88. package/src/components/molecules/HeaderItem/index.js +0 -26
  89. package/src/components/molecules/HeaderItem/styles.js +0 -27
  90. package/src/components/molecules/RowItem/ColumnItem.js +0 -9
  91. package/src/components/molecules/RowItem/RowItem.stories.js +0 -5660
  92. package/src/components/molecules/RowItem/index.js +0 -45
  93. package/src/components/molecules/RowItem/styles.js +0 -40
  94. package/src/components/molecules/StripeCardForm/StripeCardForm.stories.js +0 -13
  95. package/src/components/molecules/StripeCardForm/index.js +0 -42
  96. package/src/components/molecules/StripeCardForm/paymentForm.js +0 -124
  97. package/src/components/molecules/StripeCardForm/styles.js +0 -73
  98. package/src/components/molecules/StripeCardSelector/CardSelector.stories.js +0 -12
  99. package/src/components/molecules/StripeCardSelector/index.js +0 -44
  100. package/src/components/molecules/StripeCardSelector/styles.js +0 -4
  101. package/src/components/molecules/StripeCardSelector/utils.js +0 -17
  102. package/src/components/organisms/GridProducts/GridProducts.stories.js +0 -5485
  103. package/src/components/organisms/GridProducts/index.js +0 -50
  104. package/src/components/organisms/GridProducts/styles.js +0 -14
  105. package/src/components/organisms/GridProducts/utils.js +0 -111
  106. package/src/components/organisms/SideModal/SideModal.stories.js +0 -23
  107. package/src/components/organisms/SideModal/index.js +0 -50
  108. package/src/components/organisms/SideModal/styles.js +0 -30
package/dist/components/organisms/Chat/ContainerItems/styles.js CHANGED
@@ -15,6 +15,6 @@ var _variables = require("../../../../global-files/variables");
15
15
 
16
16
  var _templateObject;
17
17
 
18
- var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n max-height: 100%;\n flex-grow: 2;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: flex-start;\n gap: 8px;\n background: white;\n padding: 15px 11px;\n overflow: auto;\n //border: 1px solid red;\n\n .btn-loadMore {\n display: flex;\n flex-direction: column;\n justify-content: flex-end;\n flex-grow: 2;\n\n .container-btnLoadMore {\n border-radius: 10px;\n .button {\n padding: 5px 10px;\n border: none;\n gap: 10px;\n font-family: ", ";\n .icon,\n .iconLoading {\n font-size: 10px;\n }\n }\n }\n }\n\n // lista de items\n > ul {\n --marginUserValue: 10px;\n list-style: none;\n margin: 0;\n padding: 0;\n width: 100%;\n display: flex;\n flex-direction: column;\n gap: 0px;\n\n // items cambio de estatus general del article\n // items cambio de estatus en servicio del article\n .label-statusArticle,\n .label-statusService {\n width: 100%;\n padding: 10px;\n border-radius: 10px;\n display: grid;\n place-items: center;\n cursor: default;\n\n text-align: left;\n font-family: ", ", sans-serif;\n color: white;\n font-size: 12px;\n\n .label {\n text-align: left;\n font-family: ", ", sans-serif;\n color: white;\n font-size: 12px;\n white-space: pre-wrap;\n cursor: inherit;\n }\n }\n .label-statusArticle {\n background-color: #85bc5b;\n }\n .label-statusService {\n background-color: #8a6caa;\n }\n\n // cada item dentro de la lista (fechas|message|img|file|status...)\n li {\n width: 90%;\n padding: 0px;\n margin: 16px 0px 0px 0px;\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n flex-wrap: nowrap;\n gap: var(--marginUserValue);\n align-items: center;\n align-self: flex-start;\n //border: 1px solid blue;\n\n & > label:first-child,\n .item-img {\n margin: 0px 0px 0px 44px;\n }\n\n &.sameUser {\n margin: 2px 0px 0px 0px;\n /* padding: 0px 0px 0px calc(34px + var(--marginUserValue)); */\n }\n\n // items gray label (para fechas)\n &.label-gray {\n width: 100%;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding: 0px; //0px calc(34px + var(--marginUserValue));\n\n .separator {\n flex-grow: 2;\n min-width: 35px;\n border: 0.3px solid #f0f0f0;\n }\n label {\n padding: 4px 15px;\n text-align: center;\n font-family: ", ", sans-serif;\n color: #b3b3b3;\n font-size: 10px;\n }\n }\n\n // container ImageTooltip del user de un item\n .container-imgUser {\n display: grid;\n place-items: center;\n width: 34px;\n min-width: min-content;\n border-radius: 50%;\n overflow: hidden;\n align-self: flex-start;\n margin: 0;\n }\n .icon-imgUser.fill {\n padding: 0px;\n width: 34px;\n height: 34px;\n color: #9d9d9d;\n border-color: #9d9d9d;\n border-width: 2px;\n }\n .tooltip-imgUser {\n .label-nameUser {\n font-family: ", ", sans-serif;\n color: #262626;\n font-size: 12px;\n text-align: center;\n }\n }\n\n // items de tipo message, comment y file\n .item-message,\n .item-comment,\n .item-file,\n .item-statusTicket,\n .item-statusItem {\n border-radius: 10px;\n padding: 10px;\n font-family: ", ", sans-serif;\n font-size: 12px;\n text-align: left;\n white-space: pre-line;\n color: white;\n word-break: break-word;\n }\n .item-message,\n .item-comment,\n .item-file {\n background-color: #8386ee;\n }\n .item-statusTicket,\n .item-statusItem {\n background-color: #85bc5b;\n }\n\n .item-statusItem {\n display: flex;\n gap: 3px;\n align-items: center;\n }\n\n .item-message {\n &.different-company {\n border: 1px solid #e33aa9;\n }\n }\n /*\n .item-comment {\n background-color: #5e61b2;\n }\n */\n\n // items de tipo img\n .item-img {\n display: grid;\n place-items: center;\n background-color: #f7f7f7;\n border-radius: 10px;\n overflow: hidden;\n max-width: 60%;\n max-height: 300px;\n\n .container-ImagePreview {\n max-height: inherit;\n\n > .img {\n max-height: inherit;\n }\n\n .label-nameImg {\n .iconDefaultImg {\n border-radius: 0px;\n border: none;\n padding: 0px;\n color: #8386ee;\n }\n }\n }\n }\n\n // items de tipo file\n .item-file {\n width: auto;\n max-width: 70%;\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 6px;\n\n .btnDownloadFileItem {\n width: 28px;\n min-width: 28px;\n height: 28px;\n min-height: 28px;\n }\n\n // nameFile solo 1 linea\n .label-nameFileShort {\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n flex-grow: 2;\n cursor: default;\n font-family: ", ", sans-serif;\n font-size: 12px;\n text-align: center;\n color: white;\n }\n }\n\n // label hora del item\n .label-time {\n min-width: fit-content;\n color: #c7c7c7;\n font-family: ", ", sans-serif;\n font-size: 9px;\n }\n\n & > .label-time:first-child {\n display: none;\n }\n\n // items del currentUser\n &.own-message {\n align-self: flex-end;\n flex-direction: row-reverse;\n\n /* &.sameUser {\n padding: 0px calc(34px + var(--marginUserValue)) 0px 0px;\n } */\n\n .item-message,\n .item-comment {\n color: #262626;\n }\n .item-message,\n .item-comment,\n .item-file {\n background-color: #f0f0f0;\n }\n\n & > .item-message:first-child {\n margin: 0px 40px 0px 0px;\n }\n /*\n .item-comment {\n background-color: #d7d7d7;\n }\n */\n\n // items de tipo img\n .item-img {\n .container-ImagePreview {\n .label-nameImg {\n .iconDefaultImg {\n color: #c9c7c7;\n }\n }\n }\n }\n\n // items de tipo file\n .item-file {\n .btnDownloadFileItem {\n .iconFile,\n .container-btnDownload .buttonMUI .icon {\n color: #262626;\n }\n }\n\n // nameFile solo 1 linea\n .label-nameFileShort {\n color: #262626;\n }\n }\n }\n\n // items neutrales (center aligned)\n &.itemNeutral {\n width: 100%;\n\n .itemStatus {\n width: 100%;\n padding: 10px;\n border-radius: 10px;\n display: grid;\n place-items: center;\n cursor: default;\n text-align: center;\n font-family: ", ", sans-serif;\n color: white;\n font-size: 12px;\n line-height: 1.2;\n white-space: pre-wrap;\n\n &.ticket {\n color: white;\n background-color: #85bc5b;\n }\n }\n }\n }\n }\n\n .content-chat {\n ::-webkit-scrollbar {\n width: 0;\n }\n }\n"])), _variables.FontFamily.RobotoRegular, _variables.FontFamily.RobotoRegular, _variables.FontFamily.RobotoRegular, _variables.FontFamily.RobotoMedium, _variables.FontFamily.RobotoMedium, _variables.FontFamily.RobotoRegular, _variables.FontFamily.RobotoRegular, _variables.FontFamily.RobotoRegular, _variables.FontFamily.RobotoRegular);
18
+ var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n max-height: 100%;\n flex-grow: 2;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: flex-start;\n gap: 8px;\n background: white;\n padding: 15px 11px;\n overflow: auto;\n //border: 1px solid red;\n\n .btn-loadMore {\n display: flex;\n flex-direction: column;\n justify-content: flex-end;\n flex-grow: 2;\n\n .container-btnLoadMore {\n border-radius: 10px;\n .button {\n padding: 5px 10px;\n border: none;\n gap: 10px;\n font-family: ", ";\n .icon,\n .iconLoading {\n font-size: 10px;\n }\n }\n }\n }\n\n // lista de items\n > ul {\n --marginUserValue: 10px;\n list-style: none;\n margin: 0;\n padding: 0;\n width: 100%;\n display: flex;\n flex-direction: column;\n gap: 0px;\n\n // items cambio de estatus general del article\n // items cambio de estatus en servicio del article\n .label-statusArticle,\n .label-statusService {\n width: 100%;\n padding: 10px;\n border-radius: 10px;\n display: grid;\n place-items: center;\n cursor: default;\n\n text-align: left;\n font-family: ", ", sans-serif;\n color: white;\n font-size: 12px;\n\n .label {\n text-align: left;\n font-family: ", ", sans-serif;\n color: white;\n font-size: 12px;\n white-space: pre-wrap;\n cursor: inherit;\n }\n }\n .label-statusArticle {\n background-color: #85bc5b;\n }\n .label-statusService {\n background-color: #8a6caa;\n }\n\n // cada item dentro de la lista (fechas|message|img|file|status...)\n li {\n width: 90%;\n padding: 0px;\n margin: 16px 0px 0px 0px;\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n flex-wrap: nowrap;\n gap: var(--marginUserValue);\n align-items: center;\n align-self: flex-start;\n //border: 1px solid blue;\n\n & > label:first-child,\n .item-img {\n margin: 0px 0px 0px 44px;\n }\n\n &.sameUser {\n margin: 2px 0px 0px 0px;\n /* padding: 0px 0px 0px calc(34px + var(--marginUserValue)); */\n }\n\n // items gray label (para fechas)\n &.label-gray {\n width: 100%;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding: 0px; //0px calc(34px + var(--marginUserValue));\n\n .separator {\n flex-grow: 2;\n min-width: 35px;\n border: 0.3px solid #f0f0f0;\n }\n label {\n padding: 4px 15px;\n text-align: center;\n font-family: ", ", sans-serif;\n color: #b3b3b3;\n font-size: 10px;\n }\n }\n\n // container ImageTooltip del user de un item\n .container-imgUser {\n display: grid;\n place-items: center;\n width: 34px;\n min-width: min-content;\n border-radius: 50%;\n overflow: hidden;\n align-self: flex-start;\n margin: 0;\n }\n .icon-imgUser.fill {\n padding: 0px;\n width: 34px;\n height: 34px;\n color: #9d9d9d;\n border-color: #9d9d9d;\n border-width: 2px;\n }\n .tooltip-imgUser {\n .label-nameUser {\n font-family: ", ", sans-serif;\n color: #262626;\n font-size: 12px;\n text-align: center;\n }\n }\n\n // items de tipo message, comment y file\n .item-message,\n .item-comment,\n .item-file,\n .item-statusTicket {\n border-radius: 10px;\n padding: 10px;\n font-family: ", ", sans-serif;\n font-size: 12px;\n text-align: left;\n white-space: pre-line;\n color: white;\n word-break: break-word;\n }\n .item-message,\n .item-comment,\n .item-file {\n background-color: #8386ee;\n }\n .item-statusTicket {\n background-color: #85bc5b;\n }\n\n .item-message {\n &.different-company {\n border: 1px solid #e33aa9;\n }\n }\n /*\n .item-comment {\n background-color: #5e61b2;\n }\n */\n\n // items de tipo img\n .item-img {\n display: grid;\n place-items: center;\n background-color: #f7f7f7;\n border-radius: 10px;\n overflow: hidden;\n max-width: 60%;\n max-height: 300px;\n\n .container-ImagePreview {\n max-height: inherit;\n\n > .img {\n max-height: inherit;\n }\n\n .label-nameImg {\n .iconDefaultImg {\n border-radius: 0px;\n border: none;\n padding: 0px;\n color: #8386ee;\n }\n }\n }\n }\n\n // items de tipo file\n .item-file {\n width: auto;\n max-width: 70%;\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 6px;\n\n .btnDownloadFileItem {\n width: 28px;\n min-width: 28px;\n height: 28px;\n min-height: 28px;\n }\n\n // nameFile solo 1 linea\n .label-nameFileShort {\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n flex-grow: 2;\n cursor: default;\n font-family: ", ", sans-serif;\n font-size: 12px;\n text-align: center;\n color: white;\n }\n }\n\n // label hora del item\n .label-time {\n min-width: fit-content;\n color: #c7c7c7;\n font-family: ", ", sans-serif;\n font-size: 9px;\n }\n\n & > .label-time:first-child {\n display: none;\n }\n\n // items del currentUser\n &.own-message {\n align-self: flex-end;\n flex-direction: row-reverse;\n\n /* &.sameUser {\n padding: 0px calc(34px + var(--marginUserValue)) 0px 0px;\n } */\n\n .item-message,\n .item-comment {\n color: #262626;\n }\n .item-message,\n .item-comment,\n .item-file {\n background-color: #f0f0f0;\n }\n\n & > .item-message:first-child {\n margin: 0px 40px 0px 0px;\n }\n /*\n .item-comment {\n background-color: #d7d7d7;\n }\n */\n\n // items de tipo img\n .item-img {\n .container-ImagePreview {\n .label-nameImg {\n .iconDefaultImg {\n color: #c9c7c7;\n }\n }\n }\n }\n\n // items de tipo file\n .item-file {\n .btnDownloadFileItem {\n .iconFile,\n .container-btnDownload .buttonMUI .icon {\n color: #262626;\n }\n }\n\n // nameFile solo 1 linea\n .label-nameFileShort {\n color: #262626;\n }\n }\n }\n\n // items neutrales (center aligned)\n &.itemNeutral {\n width: 100%;\n\n .itemStatus {\n width: 100%;\n padding: 10px;\n border-radius: 10px;\n display: grid;\n place-items: center;\n cursor: default;\n text-align: center;\n font-family: ", ", sans-serif;\n color: white;\n font-size: 12px;\n line-height: 1.2;\n white-space: pre-wrap;\n\n &.ticket {\n color: white;\n background-color: #85bc5b;\n }\n }\n }\n }\n }\n\n .content-chat {\n ::-webkit-scrollbar {\n width: 0;\n }\n }\n"])), _variables.FontFamily.RobotoRegular, _variables.FontFamily.RobotoRegular, _variables.FontFamily.RobotoRegular, _variables.FontFamily.RobotoMedium, _variables.FontFamily.RobotoMedium, _variables.FontFamily.RobotoRegular, _variables.FontFamily.RobotoRegular, _variables.FontFamily.RobotoRegular, _variables.FontFamily.RobotoRegular);
19
19
 
20
20
  exports.Container = Container;