contentoh-components-library 21.3.30 → 21.3.32

package/src/components/organisms/Chat/ContentChat/styles.js

@@ -0,0 +1,41 @@
+import styled from "styled-components";
+import { GlobalColors, FontFamily } from "../../../../global-files/variables";
+
+export const Container = styled.div`
+  width: 100%;
+  max-width: 700px;
+  min-width: 350px;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: flex-start;
+  gap: 0px;
+  background: white;
+  padding: 0px;
+  overflow: hidden;
+  border-radius: inherit;
+  //border: 1px solid red;
+
+  .container-chatEmpty {
+    width: 100%;
+    flex-grow: 2;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    gap: 18px;
+    background-color: transparent;
+
+    .icon-chat {
+      color: #808080;
+    }
+
+    label {
+      font-family: ${FontFamily.RobotoRegular}, sans-serif;
+      font-size: 17px;
+      text-align: center;
+      color: #808080;
+    }
+  }
+`;

package/src/components/organisms/Chat/Footer/Footer.stories.js

@@ -0,0 +1,22 @@
+import { Footer } from "./index";
+
+export default {
+  title: "Components/organisms/Chat/Footer",
+  component: Footer,
+};
+
+const Template = (args) => <Footer {...args} />;
+
+export const exampleFooterChat = Template.bind({});
+exampleFooterChat.args = {
+  chatCompany: { id: 100, name: "Rotoplas", statusChat: "current" },
+  handlerCreateItemFiles: (files) => {
+    return new Promise((success) => {
+      console.log("files send:", files);
+      setTimeout(() => {
+        console.log("archivos enviados");
+        success(true);
+      }, 5000);
+    });
+  },
+};