@streamlayer/react-ui 0.66.0 → 0.67.0

package/lib/ui/gamification/question/styles.js

@@ -1,98 +1,72 @@
-import { styled as o } from "@linaria/react";
-import { SvgIcon as t } from "../../icons/index.js";
+import { styled as s } from "@linaria/react";
+import { SvgIcon as o } from "../../icons/index.js";
 import "react/jsx-runtime";
 import "react";
-const s = o.div`
-  border-radius: var(--border-radius);
-  padding: var(--container-padding);
-  background-color: var(--color-neutrals-white);
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 12px;
-  border: 1px solid var(--color-neutrals-white);
-
-  &:hover {
-    border-color: var(--color-neutrals-gray4);
-  }
-`, a = o.div`
-  display: flex;
-  align-items: center;
-  justify-content: flex-start;
-
-  font-size: 12px;
-  font-weight: 500;
-  margin-bottom: 8px;
-`, p = o.div`
-  font-family: var(--font-serif);
-  color: var(--color-primary-green2);
-  font-size: 14px;
-  font-weight: 400;
-`, l = o.div``, c = o(t)`
-  width: 24px;
-  height: 24px;
-`, d = o(t)`
-  width: 16px;
-  height: 16px;
-
-  path {
-    fill: var(--color-primary-green1);
-    fill-opacity: 1;
-  }
-`, f = o.div`
-  color: var(--color-neutrals-gray7);
-  font-size: 12px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  font-weight: 500;
-
-  margin-left: 6px;
-`, u = o.div`
-  font-weight: 700;
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-`, x = o.div`
-  color: var(--color-white);
-  font-size: 12px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-`, g = o.button`
-  background-color: var(--color-blue-question-action-btn);
-  border: none;
-  border-radius: 2px;
-  font-size: 8px;
-  padding: 6px;
-  height: 20px;
-  text-transform: uppercase;
-  color: #fff;
-  cursor: pointer;
-`, v = o.img`
-  width: 16px;
-  height: 16px;
-`, h = o.span`
-  text-transform: uppercase;
-`, m = o.span`
-  text-transform: uppercase;
-  border-left: 1px solid var(--color-grey-primary);
-  padding-left: 5px;
-  margin-left: 5px;
-`;
+const p = /* @__PURE__ */ s("div")({
+  name: "QuestionItem",
+  class: "QuestionItem_q1w97g3p",
+  propsAsIs: !1
+}), a = /* @__PURE__ */ s("div")({
+  name: "QuestionCaption",
+  class: "QuestionCaption_q2sl39u",
+  propsAsIs: !1
+}), Q = /* @__PURE__ */ s("div")({
+  name: "QuestionBody",
+  class: "QuestionBody_qd5h0uc",
+  propsAsIs: !1
+}), l = /* @__PURE__ */ s("div")({
+  name: "QuestionAction",
+  class: "QuestionAction_q105uluy",
+  propsAsIs: !1
+}), t = () => o, r = /* @__PURE__ */ s(t())({
+  name: "QuestionActionIcon",
+  class: "QuestionActionIcon_q1fa0b9h",
+  propsAsIs: !0
+}), e = () => o, I = /* @__PURE__ */ s(e())({
+  name: "QuestionTypeIcon",
+  class: "QuestionTypeIcon_qxlt78s",
+  propsAsIs: !0
+}), m = /* @__PURE__ */ s("div")({
+  name: "QuestionTypeLabel",
+  class: "QuestionTypeLabel_qmg0vkx",
+  propsAsIs: !1
+}), A = /* @__PURE__ */ s("div")({
+  name: "QuestionContent",
+  class: "QuestionContent_q1uz5j1g",
+  propsAsIs: !1
+}), d = /* @__PURE__ */ s("div")({
+  name: "QuestionSubject",
+  class: "QuestionSubject_qc3icwa",
+  propsAsIs: !1
+}), y = /* @__PURE__ */ s("button")({
+  name: "QuestionActionTitle",
+  class: "QuestionActionTitle_qmx43d1",
+  propsAsIs: !1
+}), _ = /* @__PURE__ */ s("img")({
+  name: "QuestionStatusIcon",
+  class: "QuestionStatusIcon_q1uc7n5z",
+  propsAsIs: !1
+}), T = /* @__PURE__ */ s("span")({
+  name: "QuestionTypeTitle",
+  class: "QuestionTypeTitle_qcpp4y6",
+  propsAsIs: !1
+}), f = /* @__PURE__ */ s("span")({
+  name: "ExpiredQuestion",
+  class: "ExpiredQuestion_e1rdw3wd",
+  propsAsIs: !1
+});
 export {
-  m as ExpiredQuestion,
+  f as ExpiredQuestion,
   l as QuestionAction,
-  c as QuestionActionIcon,
-  g as QuestionActionTitle,
-  p as QuestionBody,
+  r as QuestionActionIcon,
+  y as QuestionActionTitle,
+  Q as QuestionBody,
   a as QuestionCaption,
-  u as QuestionContent,
-  s as QuestionItem,
-  v as QuestionStatusIcon,
-  x as QuestionSubject,
-  d as QuestionTypeIcon,
-  f as QuestionTypeLabel,
-  h as QuestionTypeTitle
+  A as QuestionContent,
+  p as QuestionItem,
+  _ as QuestionStatusIcon,
+  d as QuestionSubject,
+  I as QuestionTypeIcon,
+  m as QuestionTypeLabel,
+  T as QuestionTypeTitle
 };

package/lib/ui/gamification/question/twitter/styles.js

@@ -1,27 +1,17 @@
-import { styled as o } from "@linaria/react";
-import { Button as r } from "../../../button/index.js";
+import { styled as t } from "@linaria/react";
+import { Button as o } from "../../../button/index.js";
 import "react/jsx-runtime";
 import "../../../button/styles.js";
-const n = o.div`
-  display: flex;
-  flex-direction: column;
-  row-gap: 16px;
-  padding: 12px 16px 16px 16px;
-  border: 1px solid var(--color-neutrals-white);
-  border-radius: 8px;
-  background-color: var(--color-neutrals-white);
-
-  &:hover {
-    border-color: var(--color-neutrals-gray4);
-  }
-`, l = o(r)`
-  height: 44px;
-  padding: 0 16px;
-  font-size: 14px;
-  line-height: 20px;
-  cursor: pointer;
-`;
+const p = /* @__PURE__ */ t("div")({
+  name: "Container",
+  class: "Container_cl56x6b",
+  propsAsIs: !1
+}), n = () => o, c = /* @__PURE__ */ t(n())({
+  name: "ActionButton",
+  class: "ActionButton_a11pzf92",
+  propsAsIs: !0
+});
 export {
-  l as ActionButton,
-  n as Container
+  c as ActionButton,
+  p as Container
 };

package/lib/ui/gamification/tabs/styles.js

@@ -1,67 +1,24 @@
-import { styled as o } from "@linaria/react";
-const t = o.div``, e = o.div`
-  position: relative;
-  box-sizing: border-box;
-  width: 100%;
-  display: flex;
-  overflow: hidden;
-  border-radius: 8px;
-  background-color: var(--color-neutrals-gray2);
-  padding: 4px;
-
-  &:before {
-    content: '';
-    position: absolute;
-    background-color: var(--color-white);
-    border-radius: 6px;
-    height: 28px;
-    left: 4px;
-    width: calc(50% - 4px);
-    transition: transform var(--animation-duration) var(--animation-function);
-  }
-
-  &[data-position='left'] {
-    &:before {
-      transform: translateX(0);
-    }
-  }
-
-  &[data-position='right'] {
-    &:before {
-      transform: translateX(100%);
-    }
-  }
-`, n = o.button`
-  border: none;
-  outline: none;
-  background-color: transparent;
-  color: var(--color-neutrals-gray7);
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  font-size: 12px;
-  font-weight: 550;
-  width: 50%;
-  box-sizing: border-box;
-  padding: 4px 10px;
-  height: 28px;
-  cursor: pointer;
-
-  &:hover {
-    color: var(--color-primary-green1);
-  }
-
-  &[data-selected='true'] {
-    color: var(--color-primary-green1);
-    cursor: default;
-  }
-`, i = o.span`
-  position: relative;
-  z-index: 2;
-`;
+import { styled as s } from "@linaria/react";
+const a = /* @__PURE__ */ s("div")({
+  name: "Container",
+  class: "Container_c115qtkr",
+  propsAsIs: !1
+}), n = /* @__PURE__ */ s("div")({
+  name: "STabs",
+  class: "STabs_sxnslc8",
+  propsAsIs: !1
+}), o = /* @__PURE__ */ s("button")({
+  name: "Button",
+  class: "Button_b1umzux0",
+  propsAsIs: !1
+}), e = /* @__PURE__ */ s("span")({
+  name: "Title",
+  class: "Title_tspsaas",
+  propsAsIs: !1
+});
 export {
-  n as Button,
-  t as Container,
-  e as STabs,
-  i as Title
+  o as Button,
+  a as Container,
+  n as STabs,
+  e as Title
 };

package/lib/ui/gamification/user-statistics/components/rank/styles.js

@@ -1,25 +1,19 @@
-import { styled as e } from "@linaria/react";
-const t = e.div`
-  display: flex;
-  align-items: center;
-  flex: 1;
-  justify-content: space-between;
-  padding: 9px 8px;
-  color: var(--color-neutrals-white);
-  border-radius: 4px;
-  background-color: var(--color-primary-green2);
-  overflow: hidden;
-`, r = e.div`
-  font-size: 9px;
-  line-height: 14px;
-  text-transform: uppercase;
-  opacity: 0.8;
-`, i = e.div`
-  font-size: 14px;
-  line-height: 16px;
-`;
+import { styled as s } from "@linaria/react";
+const n = /* @__PURE__ */ s("div")({
+  name: "Container",
+  class: "Container_c1zy8a",
+  propsAsIs: !1
+}), a = /* @__PURE__ */ s("div")({
+  name: "Title",
+  class: "Title_t1vih9p5",
+  propsAsIs: !1
+}), o = /* @__PURE__ */ s("div")({
+  name: "Indicator",
+  class: "Indicator_i1fbnvpb",
+  propsAsIs: !1
+});
 export {
-  t as Container,
-  i as Indicator,
-  r as Title
+  n as Container,
+  o as Indicator,
+  a as Title
 };

package/lib/ui/gamification/user-statistics/components/statistic/styles.js

@@ -1,23 +1,19 @@
-import { styled as t } from "@linaria/react";
-const i = t.div`
-  display: flex;
-  align-items: center;
-  flex-direction: column;
-  row-gap: 4px;
-  padding-top: 2px;
-  color: var(--color-neutrals-white);
-  text-align: center;
-`, o = t.div`
-  font-size: 14px;
-  line-height: 16px;
-`, n = t.div`
-  font-size: 9px;
-  line-height: 14px;
-  text-transform: uppercase;
-  opacity: 0.8;
-`;
+import { styled as s } from "@linaria/react";
+const o = /* @__PURE__ */ s("div")({
+  name: "Container",
+  class: "Container_ctmhwyc",
+  propsAsIs: !1
+}), a = /* @__PURE__ */ s("div")({
+  name: "Indicator",
+  class: "Indicator_i1jri200",
+  propsAsIs: !1
+}), n = /* @__PURE__ */ s("div")({
+  name: "Title",
+  class: "Title_t8s05oq",
+  propsAsIs: !1
+});
 export {
-  i as Container,
-  o as Indicator,
+  o as Container,
+  a as Indicator,
   n as Title
 };

package/lib/ui/gamification/user-statistics/styles.js

@@ -1,124 +1,89 @@
-import { styled as e } from "@linaria/react";
-const o = e.div`
-  padding: 12px;
-  font-weight: var(--font-weight-default);
-  background-color: var(--color-primary-green1);
-  border-radius: 12px;
-`, i = e.div`
-  margin-bottom: 12px;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  column-gap: 8px;
-`, n = e.div`
-  display: flex;
-  flex-direction: column;
-  row-gap: 8px;
-`, r = e.div`
-  display: flex;
-  column-gap: 8px;
-  flex: 1;
-  overflow: hidden;
-`, a = e.img`
-  width: 48px;
-  height: 48px;
-  border-radius: 50%;
-  object-fit: cover;
-  object-position: center;
-  flex-shrink: 0;
-`, s = e.div`
-  display: flex;
-  flex-direction: column;
-  row-gap: 6px;
-  overflow: hidden;
-`, c = e.div`
-  color: var(--color-white);
-  font-size: 16px;
-  font-weight: 400;
-  line-height: 24px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-`, p = e.div`
-  display: flex;
-  align-items: center;
-  column-gap: 8px;
-  height: 14px;
-  color: var(--color-neutrals-white);
-  font-size: 14px;
-  text-transform: uppercase;
-`, l = e.img`
-  width: 15px;
-  height: 15px;
-`, d = e.div`
-  display: flex;
-  align-items: center;
-  column-gap: 4px;
-`, x = e.div`
-  display: flex;
-  align-items: baseline;
-  column-gap: 4px;
-`, f = e.div`
-  font-size: 9px;
-  opacity: 0.8;
-`, g = e.div`
-  width: 1px;
-  height: 10px;
-  background-color: var(--color-white);
-  opacity: 0.2;
-`, h = e.div`
-  display: flex;
-  column-gap: 8px;
-`, u = e.div`
-  display: flex;
-  justify-content: space-between;
-  padding: 8px 12px;
-  border-radius: 4px;
-  background-color: var(--color-primary-green2);
-`, m = e.div`
-  background: #2d6ffd;
-  border-radius: 50%;
-  width: 48px;
-  height: 48px;
-  text-align: center;
-  text-transform: uppercase;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: #fff;
-  font-size: 18px;
-  flex-shrink: 0;
-`, v = e.button`
-  border: none;
-  outline: none;
-  background-color: transparent;
-  cursor: pointer;
-  padding: 0px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  border-radius: 50%;
-  width: 100%;
-  height: 100%;
-  max-width: 48px;
-  max-height: 48px;
-`;
+import { styled as s } from "@linaria/react";
+const o = /* @__PURE__ */ s("div")({
+  name: "Container",
+  class: "Container_c1yrpn9o",
+  propsAsIs: !1
+}), t = /* @__PURE__ */ s("div")({
+  name: "TopInfo",
+  class: "TopInfo_t17fwahh",
+  propsAsIs: !1
+}), e = /* @__PURE__ */ s("div")({
+  name: "BottomInfo",
+  class: "BottomInfo_by6w7e9",
+  propsAsIs: !1
+}), n = /* @__PURE__ */ s("div")({
+  name: "User",
+  class: "User_u1g7arbm",
+  propsAsIs: !1
+}), r = /* @__PURE__ */ s("img")({
+  name: "Avatar",
+  class: "Avatar_a1ldeata",
+  propsAsIs: !1
+}), c = /* @__PURE__ */ s("div")({
+  name: "UserInfo",
+  class: "UserInfo_u10d4koz",
+  propsAsIs: !1
+}), l = /* @__PURE__ */ s("div")({
+  name: "UserName",
+  class: "UserName_u1q6roj0",
+  propsAsIs: !1
+}), p = /* @__PURE__ */ s("div")({
+  name: "UserRating",
+  class: "UserRating_ui0m425",
+  propsAsIs: !1
+}), i = /* @__PURE__ */ s("img")({
+  name: "TrophyIcon",
+  class: "TrophyIcon_t1el3mrn",
+  propsAsIs: !1
+}), I = /* @__PURE__ */ s("div")({
+  name: "Rts",
+  class: "Rts_r2vgnxv",
+  propsAsIs: !1
+}), m = /* @__PURE__ */ s("div")({
+  name: "RtsIndicator",
+  class: "RtsIndicator_roqn06j",
+  propsAsIs: !1
+}), f = /* @__PURE__ */ s("div")({
+  name: "RtsLabel",
+  class: "RtsLabel_r15adx7c",
+  propsAsIs: !1
+}), d = /* @__PURE__ */ s("div")({
+  name: "Divider",
+  class: "Divider_dv59lta",
+  propsAsIs: !1
+}), v = /* @__PURE__ */ s("div")({
+  name: "Ranks",
+  class: "Ranks_r55lotb",
+  propsAsIs: !1
+}), A = /* @__PURE__ */ s("div")({
+  name: "Statistics",
+  class: "Statistics_s1knfgqt",
+  propsAsIs: !1
+}), _ = /* @__PURE__ */ s("div")({
+  name: "AvatarPlaceholder",
+  class: "AvatarPlaceholder_a1mqo824",
+  propsAsIs: !1
+}), R = /* @__PURE__ */ s("button")({
+  name: "UserAccountBtn",
+  class: "UserAccountBtn_uxareh6",
+  propsAsIs: !1
+});
 export {
-  a as Avatar,
-  m as AvatarPlaceholder,
-  n as BottomInfo,
+  r as Avatar,
+  _ as AvatarPlaceholder,
+  e as BottomInfo,
   o as Container,
-  g as Divider,
-  h as Ranks,
-  d as Rts,
-  x as RtsIndicator,
+  d as Divider,
+  v as Ranks,
+  I as Rts,
+  m as RtsIndicator,
   f as RtsLabel,
-  u as Statistics,
-  i as TopInfo,
-  l as TrophyIcon,
-  r as User,
-  v as UserAccountBtn,
-  s as UserInfo,
-  c as UserName,
+  A as Statistics,
+  t as TopInfo,
+  i as TrophyIcon,
+  n as User,
+  R as UserAccountBtn,
+  c as UserInfo,
+  l as UserName,
   p as UserRating
 };

package/lib/ui/gamification/vote/expired-alert/styles.js

@@ -1,29 +1,19 @@
-import { styled as t } from "@linaria/react";
-const i = t.div`
-  display: flex;
-  flex-grow: 1;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  row-gap: 12px;
-  padding-bottom: 32px;
-`, n = t.div`
-  color: var(--color-primary-green2);
-  font-size: 20px;
-  font-family: var(--font-serif);
-  font-weight: 400;
-  line-height: 26px;
-  text-align: center;
-`, o = t.div`
-  color: var(--color-neutrals-gray9);
-  font-size: 14px;
-  font-weight: var(--font-weight-default);
-  line-height: 20px;
-  letter-spacing: -0.154px;
-  text-align: center;
-`;
+import { styled as s } from "@linaria/react";
+const t = /* @__PURE__ */ s("div")({
+  name: "Container",
+  class: "Container_c38csyt",
+  propsAsIs: !1
+}), o = /* @__PURE__ */ s("div")({
+  name: "Title",
+  class: "Title_ty221rx",
+  propsAsIs: !1
+}), i = /* @__PURE__ */ s("div")({
+  name: "Description",
+  class: "Description_dlaj9xp",
+  propsAsIs: !1
+});
 export {
-  i as Container,
-  o as Description,
-  n as Title
+  t as Container,
+  i as Description,
+  o as Title
 };