@streamlayer/react-ui 0.34.0 → 0.36.0

package/lib/ui/navigation/index.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { ButtonProps } from './button';
+export declare const Navigation: React.FC<{
+    children: React.ReactElement<ButtonProps>[];
+    className?: string;
+}>;

package/lib/ui/navigation/masters.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare const Navigation: import("@linaria/react").StyledMeta & import("react").FC<{
+    children: import("react").ReactElement<import("./button").ButtonProps, string | import("react").JSXElementConstructor<any>>[];
+    className?: string | undefined;
+}>;

package/lib/ui/notifications/decorator.d.ts

@@ -0,0 +1,4 @@
+import type { Decorator } from '@storybook/react';
+export declare const NotificationsList: Decorator<{
+    concurrency: number;
+}>;

package/lib/ui/notifications/index.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { NotificationsList } from '@streamlayer/sdk-web-notifications';
+export declare const Notifications: React.FC<{
+    notificationsStore: NotificationsList;
+}>;

package/lib/ui/notifications/notification/index.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { type Notification } from '@streamlayer/sdk-web-notifications';
+export declare const NotificationComponent: React.FC<Notification & {
+    index: number;
+    total: number;
+}>;

package/lib/ui/notifications/notification/onboarding-inapp/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import type { Notification } from '@streamlayer/sdk-web-notifications';
+export declare const OnBoardingInApp: React.FC<Notification>;

package/lib/ui/notifications/notification/onboarding-inapp/styles.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+export declare const Container: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const BackgroundBlock: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const Icon: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLImageElement> & import("react").ImgHTMLAttributes<HTMLImageElement> & Record<never, unknown>>;
+export declare const ContentWrap: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const SponsorLogo: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLImageElement> & import("react").ImgHTMLAttributes<HTMLImageElement> & Record<never, unknown>>;
+export declare const SponsorText: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement> & Record<never, unknown>>;
+export declare const ContentTitle: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const ContentSubtitle: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const ActionBtn: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & Record<never, unknown>>;
+export declare const CloseBtn: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & Record<never, unknown>>;
+export declare const IconClose: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLImageElement> & import("react").ImgHTMLAttributes<HTMLImageElement> & Record<never, unknown>>;

package/lib/ui/notifications/notification/question-inapp/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import type { Notification } from '@streamlayer/sdk-web-notifications';
+export declare const QuestionInApp: React.FC<Notification>;

package/lib/ui/notifications/notification/question-inapp/styles.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+export declare const Container: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const IconWrap: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const Icon: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLImageElement> & import("react").ImgHTMLAttributes<HTMLImageElement> & Record<never, unknown>>;
+export declare const Content: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const TitleWrap: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const Title: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const CloseBtnWrap: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const CloseBtn: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & Record<never, unknown>>;
+export declare const CloseIcon: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLImageElement> & import("react").ImgHTMLAttributes<HTMLImageElement> & Record<never, unknown>>;

package/lib/ui/notifications/notification/styles.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const NotificationContainer: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;

package/lib/ui/notifications/styles.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const NotificationsContainer: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;

package/lib/ui/theme/ThemeColors.d.ts

@@ -0,0 +1 @@
+export declare const ThemeColors: () => import("react/jsx-runtime").JSX.Element[];

package/lib/ui/theme/Typography.d.ts

@@ -0,0 +1,2 @@
+export declare const useCustomFonts: () => void;
+export declare const Typography: () => import("react/jsx-runtime").JSX.Element;

package/lib/ui/theme/constants.d.ts

@@ -0,0 +1,79 @@
+export declare const MASTERS_COLORS: {
+    PRIMARY_GREEN1: string;
+    PRIMARY_GREEN2: string;
+    PRIMARY_GREEN3: string;
+    PRIMARY_GREEN4: string;
+    SECONDARY_RED1: string;
+    SECONDARY_RED2: string;
+    SECONDARY_YELLOW: string;
+    SECONDARY_GREEN5: string;
+    NEUTRALS_WHITE: string;
+    NEUTRALS_GRAY1: string;
+    NEUTRALS_GRAY2: string;
+    NEUTRALS_GRAY3: string;
+    NEUTRALS_GRAY4: string;
+    NEUTRALS_GRAY5: string;
+    NEUTRALS_GRAY6: string;
+    NEUTRALS_GRAY7: string;
+    NEUTRALS_GRAY8: string;
+    NEUTRALS_GRAY9: string;
+    NEUTRALS_BLACK: string;
+};
+export declare const COLORS: {
+    BG_TRANSPARENT: string;
+    BG_TRANSPARENT_VOTE_CONTAINER: string;
+    BG_TRANSPARENT_ITEM: string;
+    BG_TRANSPARENT_ITEM_VOTE: string;
+    BG_TRANSPARENT_ITEM_SUCCESS: string;
+    BG_TRANSPARENT_ITEM_ERROR: string;
+    BG_TRANSPARENT_VOTE_PROGRESS: string;
+    BG_TRANSPARENT_VOTE_PROGRESS_SUCCESS: string;
+    BG_TRANSPARENT_VOTE_PROGRESS_ERROR: string;
+    BG_TRANSPARENT_USER_CONTAINER: string;
+    BG_TRANSPARENT_ONBOARDING_INAPP: string;
+    LEADERBOARD_UNIT: string;
+    BLUE_PRIMARY: string;
+    RED_PRIMARY: string;
+    RED_SECONDARY: string;
+    BLUE_QUESTION_ACTION_BTN: string;
+    WHITE: string;
+    GREY_1: string;
+    GREY_2: string;
+    GREY_3: string;
+    GREY_4: string;
+    GREY_PRIMARY_ONBOARDING_INAPP: string;
+    BLACK_1: string;
+    GREEN_1: string;
+    RED_1: string;
+    RED_2: string;
+    GREY_PRIMARY: string;
+    DIVIDER_COLOR_PRIMARY: string;
+    DIVIDER_COLOR_SECONDARY: string;
+    GREEN_PRIMARY_BTN: string;
+} & {
+    PRIMARY_GREEN1: string;
+    PRIMARY_GREEN2: string;
+    PRIMARY_GREEN3: string;
+    PRIMARY_GREEN4: string;
+    SECONDARY_RED1: string;
+    SECONDARY_RED2: string;
+    SECONDARY_YELLOW: string;
+    SECONDARY_GREEN5: string;
+    NEUTRALS_WHITE: string;
+    NEUTRALS_GRAY1: string;
+    NEUTRALS_GRAY2: string;
+    NEUTRALS_GRAY3: string;
+    NEUTRALS_GRAY4: string;
+    NEUTRALS_GRAY5: string;
+    NEUTRALS_GRAY6: string;
+    NEUTRALS_GRAY7: string;
+    NEUTRALS_GRAY8: string;
+    NEUTRALS_GRAY9: string;
+    NEUTRALS_BLACK: string;
+};
+export declare const FONT: {
+    REGULAR: string;
+    SERIF: string;
+    COLOR: string;
+};
+export declare const colors: string;

package/lib/ui/theme/index.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare const StreamLayerThemeProvider: React.FC<{
+    children: React.ReactNode;
+    style?: React.CSSProperties;
+}>;

package/lib/ui/theme/masters.d.ts

@@ -0,0 +1 @@
+export declare const mastersVariables: import("@linaria/core").LinariaClassName;

package/lib/ui/theme/theme.d.ts

@@ -0,0 +1,3 @@
+export declare const themeStr: string;
+export declare const theme: import("@linaria/core").LinariaClassName;
+export declare const ThemeVariables: () => import("react/jsx-runtime").JSX.Element;

package/lib/utils/createDemo.js

@@ -1,17 +1,17 @@
 import { jsx as e, jsxs as g, Fragment as y } from "react/jsx-runtime";
 import { useMemo as u, useState as i, useEffect as E } from "react";
 import { anonymous as l } from "@streamlayer/sdk-web-anonymous-auth";
-import { Developer as D } from "./components/developer.js";
+import { Developer as D } from "./debug/components/developer.js";
 import { DeveloperStorage as w } from "./storage.js";
 import { useStreamLayerApp as x } from "./useStreamLayerApp.js";
 import "@linaria/react";
-import "./components/bypassLogin.js";
-import "./components/envToggle.js";
-import "./components/eventInput.js";
+import "./debug/components/bypassLogin.js";
+import "./debug/components/envToggle.js";
+import "./debug/components/eventInput.js";
 import "@nanostores/react";
 import "@streamlayer/sdk-web-core";
-import "./components/styles.js";
-import "./components/sdkKey.js";
+import "./debug/components/styles.js";
+import "./debug/components/sdkKey.js";
 import "@streamlayer/sdk-web-storage";
 import "@streamlayer/sdk-web";
 function K({

package/lib/utils/{components → debug/components}/developer.js

@@ -1,7 +1,7 @@
 import { jsxs as e, jsx as o } from "react/jsx-runtime";
 import { styled as i } from "@linaria/react";
 import { useMemo as x, useState as g } from "react";
-import { DeveloperStorage as h } from "../storage.js";
+import { DeveloperStorage as h } from "../../storage.js";
 import { BypassLogin as u } from "./bypassLogin.js";
 import { EnvToggle as b } from "./envToggle.js";
 import { EventInput as v } from "./eventInput.js";

package/lib/utils/debug/index.js

@@ -0,0 +1,33 @@
+import { jsx as i } from "react/jsx-runtime";
+import { useMemo as a, useState as r } from "react";
+import { useStreamLayer as u } from "@streamlayer/react";
+import { Developer as v } from "./components/developer.js";
+import { DeveloperStorage as c } from "./storage.js";
+import "@linaria/react";
+import "../storage.js";
+import "@streamlayer/sdk-web-storage";
+import "./components/bypassLogin.js";
+import "./components/envToggle.js";
+import "./components/eventInput.js";
+import "@nanostores/react";
+import "@streamlayer/sdk-web-core";
+import "./components/styles.js";
+import "./components/sdkKey.js";
+const M = () => {
+  const e = a(() => new c(), []), [t, o] = r(e.getEnv()), [m, s] = r(e.getSdkKey() || "set-sdk-key"), [p, n] = r(e.getEvent() || "");
+  return {
+    env: t,
+    setEnv: o,
+    sdkKey: m,
+    setSdkKey: s,
+    event: p,
+    setEvent: n
+  };
+}, h = (e) => {
+  const t = u();
+  return /* @__PURE__ */ i(v, { sdk: t, ...e });
+};
+export {
+  h as StreamLayerDebug,
+  M as useStreamLayerDebug
+};

package/lib/utils/debug/storage.js

@@ -0,0 +1,52 @@
+var n = Object.defineProperty;
+var i = (s, r, e) => r in s ? n(s, r, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[r] = e;
+var t = (s, r, e) => (i(s, typeof r != "symbol" ? r + "" : r, e), e);
+import { Storage as h } from "@streamlayer/sdk-web-storage";
+class d extends h {
+  constructor() {
+    super("dev");
+    // Schema
+    t(this, "setSchema", (e) => {
+      this.write("schema", e);
+    });
+    t(this, "getSchema", () => this.read(
+      "schema"
+      /* SCHEMA */
+    ));
+    // Token
+    t(this, "setToken", (e) => {
+      this.write("token", e);
+    });
+    t(this, "getToken", () => this.read(
+      "token"
+      /* TOKEN */
+    ));
+    // Event
+    t(this, "setEvent", (e) => {
+      this.write("event", e);
+    });
+    t(this, "getEvent", () => this.read(
+      "event"
+      /* EVENT */
+    ));
+    // SDK_KEY
+    t(this, "setSdkKey", (e) => {
+      this.write("sdkKey", e);
+    });
+    t(this, "getSdkKey", () => this.read(
+      "sdkKey"
+      /* SDK_KEY */
+    ));
+    // ENV
+    t(this, "setEnv", (e) => {
+      this.write("env", e);
+    });
+    t(this, "getEnv", () => this.read(
+      "env"
+      /* ENV */
+    ) || "production");
+  }
+}
+export {
+  d as DeveloperStorage
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@streamlayer/react-ui",
-  "version": "0.34.0",
+  "version": "0.36.0",
   "type": "module",
   "main": "./src/index.js",
   "typings": "./lib/index.d.ts",
@@ -10,6 +10,11 @@
       "default": "./lib/index.js",
       "types": "./lib/index.d.js"
     },
+    "./masters": {
+      "import": "./lib/ui/app/masters.js",
+      "default": "./lib/ui/app/masters.js",
+      "types": "./lib/ui/app/masters.d.js"
+    },
     "./*": {
       "import": "./lib/*/index.js",
       "default": "./lib/*/index.js",
@@ -22,16 +27,21 @@
   ],
   "peerDependencies": {
     "@streamlayer/sl-eslib": "^5.45.1",
-    "@streamlayer/feature-gamification": "^0.17.3",
-    "@streamlayer/sdk-web": "^0.28.0",
-    "@streamlayer/sdk-web-anonymous-auth": "^0.10.9",
-    "@streamlayer/sdk-web-api": "^0.0.4",
-    "@streamlayer/sdk-web-core": "^0.14.0",
-    "@streamlayer/sdk-web-features": "^0.10.3",
-    "@streamlayer/sdk-web-interfaces": "^0.18.2",
-    "@streamlayer/sdk-web-notifications": "^0.10.1",
-    "@streamlayer/sdk-web-storage": "^0.3.4",
-    "@streamlayer/sdk-web-types": "^0.16.2"
+    "@streamlayer/feature-gamification": "^0.17.4",
+    "@streamlayer/sdk-web": "^0.28.1",
+    "@streamlayer/sdk-web-anonymous-auth": "^0.10.10",
+    "@streamlayer/sdk-web-api": "^0.0.5",
+    "@streamlayer/sdk-web-core": "^0.14.1",
+    "@streamlayer/sdk-web-features": "^0.10.4",
+    "@streamlayer/sdk-web-interfaces": "^0.18.3",
+    "@streamlayer/sdk-web-notifications": "^0.10.2",
+    "@streamlayer/sdk-web-storage": "^0.3.5",
+    "@streamlayer/sdk-web-types": "^0.16.3"
+  },
+  "nx": {
+    "implicitDependencies": [
+      "!react"
+    ]
   },
   "devDependencies": {
     "@connectrpc/connect": "^1.1.3",
@@ -62,6 +72,7 @@
     "vite-plugin-node-polyfills": "^0.16.0",
     "vite-plugin-svgr": "^4.1.0",
     "vite-svg-loader": "^4.0.0",
-    "vite-tsconfig-paths": "^4.2.1"
+    "vite-tsconfig-paths": "^4.2.1",
+    "@streamlayer/react": "^0.23.0"
   }
 }