quickblox-react-ui-kit 0.3.0-beta.2 → 0.3.0-beta.3

package/storybook-static/docs-Introduction-mdx.ac401482.iframe.bundle.js

@@ -0,0 +1,10 @@
+(self.webpackChunkquickblox_react_ui_kit=self.webpackChunkquickblox_react_ui_kit||[]).push([[715],{"./node_modules/@mdx-js/react/lib/index.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.d(__webpack_exports__,{NF:()=>withMDXComponents,Zo:()=>MDXProvider,ah:()=>useMDXComponents,pC:()=>MDXContext});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js");let MDXContext=react__WEBPACK_IMPORTED_MODULE_0__.createContext({});function withMDXComponents(Component){return boundMDXComponent;function boundMDXComponent(props){let allComponents=useMDXComponents(props.components);return react__WEBPACK_IMPORTED_MODULE_0__.createElement(Component,{...props,allComponents})}}function useMDXComponents(components){let contextComponents=react__WEBPACK_IMPORTED_MODULE_0__.useContext(MDXContext);return react__WEBPACK_IMPORTED_MODULE_0__.useMemo(()=>"function"==typeof components?components(contextComponents):{...contextComponents,...components},[contextComponents,components])}let emptyObject={};function MDXProvider({components,children,disableParentContext}){let allComponents;return allComponents=disableParentContext?"function"==typeof components?components({}):components||emptyObject:useMDXComponents(components),react__WEBPACK_IMPORTED_MODULE_0__.createElement(MDXContext.Provider,{value:allComponents},children)}},"./src/docs/Introduction.mdx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{default:()=>__WEBPACK_DEFAULT_EXPORT__}),__webpack_require__("./node_modules/react/index.js");var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/react/jsx-runtime.js"),_Users_artemkoltunov_Desktop_03_react_ui_kit_public_node_modules_storybook_addon_docs_dist_shims_mdx_react_shim__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/@mdx-js/react/lib/index.js"),_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/@storybook/blocks/dist/index.mjs");function _createMdxContent(props){let _components=Object.assign({h1:"h1",a:"a",p:"p",h3:"h3",pre:"pre",code:"code",h4:"h4",blockquote:"blockquote",strong:"strong",ul:"ul",li:"li",ol:"ol"},(0,_Users_artemkoltunov_Desktop_03_react_ui_kit_public_node_modules_storybook_addon_docs_dist_shims_mdx_react_shim__WEBPACK_IMPORTED_MODULE_2__.ah)(),props.components);return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.h_,{title:"📕 Documentation/Introduction"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h1,{id:"introduction",children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.a,{href:"https://docs.quickblox.com/docs/react-uikit-send-your-first-message#importing-dependencies-in-the-project",target:"_blank",rel:"nofollow noopener noreferrer",children:"Introduction"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"The QuickBlox UIKit for React comprises a collection of pre-assembled UI components that enable effortless creation of an in-app chat equipped with all the necessary messaging functionalities. Our development kit encompasses light and dark themes, colors, and various other features. These components can be personalized to fashion an engaging messaging interface that reflects your brand's distinct identity."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"The QuickBlox UIKit fully supports both private and group dialogs. To initiate the process of sending a message from the ground up using Java or Kotlin, please refer to the instructions provided in the guide below."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"installation",children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.a,{href:"https://docs.quickblox.com/docs/react-uikit-send-your-first-message#step2-adding-dependencies-to-a-react-project",target:"_blank",rel:"nofollow noopener noreferrer",children:"Installation"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"To successfully integrate QuickBlox functionality into your React project, you need to add two main dependencies: quickblox and quickblox-react-ui-kit. By following the documentation, you can easily add these packages to your project."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.pre,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{className:"language-bash",children:"npm install quickblox --save\n"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.pre,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{className:"language-bash",children:"npm install quickblox-react-ui-kit --save\n"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h4,{id:"importing-dependencies-in-the-project",children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.a,{href:"https://docs.quickblox.com/docs/react-uikit-send-your-first-message#importing-dependencies-in-the-project",target:"_blank",rel:"nofollow noopener noreferrer",children:"Importing Dependencies in the Project"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"Open the file where you want to use QuickBlox functionality, such as App.tsx\nAdd the following lines at the beginning of the file to import the dependencies:"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(_components.blockquote,{children:["\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.strong,{children:"Note: We are using // @ts-ignor in TypeScript because QuickBlox SDK doesn't share types."})}),"\n"]}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.pre,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{className:"language-ts",children:"// @ts-ignore\nimport * as QB from 'quickblox/quickblox';\nimport 'quickblox-react-ui-kit';\n"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"adding-qbconfigts-file-to-your-react-application",children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.a,{href:"https://docs.quickblox.com/docs/react-uikit-send-your-first-message#step-3-adding-qbconfigts-file-to-your-react-application",target:"_blank",rel:"nofollow noopener noreferrer",children:"Adding QBconfig.ts File to Your React Application"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"To ensure proper configuration and functionality of the QuickBlox UIKit in your React application, it is essential to add a QBconfig.ts file to the src folder. This file allows you to define the necessary parameters for the QuickBlox UIKit.\nThe QBconfig.ts file contains various configuration settings that determine how the QuickBlox UIKit interacts with the QuickBlox JavaScript SDK and the backend services. These settings include:"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"appId: This parameter represents the unique identifier assigned to your QuickBlox application. It helps establish a connection between the frontend and backend components.\nauthKey and authSecret: These parameters are used for authentication purposes. They ensure secure communication between your application and the QuickBlox backend.\naccountKey: This parameter identifies your QuickBlox account and provides access to the associated services.\napiEndpoint and chatEndpoint: These parameters define the API and chat endpoints provided by QuickBlox. They specify the URLs to which the QuickBlox UIKit will send requests for various functionalities."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.pre,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{className:"language-ts",children:"export const QBConfig = {\n  credentials: {\n    appId: YOUR_APP_ID_FROM_ADMIN_PANEL,\n    accountKey: 'YOUR_ACCOUNT_KEY_FROM_ADMIN_PANEL',\n    authKey: 'YOUR_AUTH_KEY_FROM_ADMIN_PANEL',\n    authSecret: 'YOUR_AUTH_SECRET_FROM_ADMIN_PANEL',\n    sessionToken: '',\n  },\n  appConfig: {\n    chatProtocol: {\n      Active: 2,\n    },\n    debug: false,\n    endpoints: {\n      apiEndpoint: 'https://api.quickblox.com',\n      chatEndpoint: 'chat.quickblox.com',\n    },\n    on: {\n      async sessionExpired(handleResponse: any, retry: any) {\n        console.log(`Test sessionExpired… ${handleResponse} ${retry}`);\n      },\n    },\n    streamManagement: {\n      Enable: true,\n    },\n  },\n};\n"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"In this example, make sure to replace the placeholder values (YOUR_APP_ID_FROM_ADMIN_PANEL, YOUR_ACCOUNT_KEY_FROM_ADMIN_PANEL, YOUR_AUTH_KEY_FROM_ADMIN_PANEL, YOUR_AUTH_SECRET_FROM_ADMIN_PANEL) with the actual values obtained from your QuickBlox application.\nBy adding the QBconfig.ts file to your React application, you ensure that the QuickBlox UIKit is properly configured and can interact seamlessly with the QuickBlox backend services."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(_components.blockquote,{children:["\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.strong,{children:"Note: If you initialize your SDK using a session token, you need to not only fill the sessionToken field in QBConfig but also fill other properties in the same way as when using the initWithAppId method. See the link initialize QuickBlox SDK without Authorization Key and Secret."})}),"\n"]}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"Now we can add dependecies in our code. (Open your App.tsx and add that lines.)"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.pre,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{className:"language-ts",children:"import * as QB from 'quickblox/quickblox';\nimport 'quickblox-react-ui-kit';\nimport { QBConfig } from './QBconfig'; // this line is new\n"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"updating-the-project-structure-according-to-your-needs",children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.a,{href:"https://docs.quickblox.com/docs/react-uikit-send-your-first-message#step-4-updating-the-project-structure-according-to-your-needs",target:"_blank",rel:"nofollow noopener noreferrer",children:"Updating the project structure according to your needs"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:'In order to enhance the organization and maintainability of your project, it is recommended to make changes to the structure of the App.tsx in the src folder.\nYou need to add a constant called "currentUser" inside the App() function in the App.tsx file, which describes your user registered in the admin panel, and configure the QuickBloxUIKitProvider. Additionally, import the necessary entities from quickblox-react-ui-kit.\nAs a result, you should have the code below:'}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.pre,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{className:"language-ts",children:"import React from 'react';\nimport type { QBSession, QBUser } from 'quickblox/quickblox';\nimport {\n  QuickBloxUIKitProvider,\n  QuickBloxUIKitDesktopLayout,\n} from 'quickblox-react-ui-kit';\nimport { QBConfig } from '../../configs/QBconfig';\nimport Header from '../../components/Header';\nimport SettingModal from '../../components/modals/SettingModal';\nimport LogoutModal from '../../components/modals/LogoutModal';\n\ninterface AppProps {\n  session: QBSession;\n  logout: VoidFunction;\n}\n\nconst App = (props: AppProps) => {\n  const { session, logout } = props;\n  const [user, setUser] = useState<QBUser | null>(null);\n\n  return (\n    <QuickBloxUIKitProvider\n      maxFileSize={100 * 1000000}\n      accountData={{ ...QBConfig.credentials, sessionToken: session.token }}\n      qbConfig={{ ...QBConfig }}\n    >\n      <Header\n        avatarUrl={avatarUrl}\n        options={options}\n        handleChange={handleChange}\n        user={user}\n        regex={regex}\n      />\n      <QuickBloxUIKitDesktopLayout uikitHeightOffset={'40px'} />\n      <SettingModal\n        user={user}\n        avatarUrl={avatarUrl}\n        selectedValue={selectedValue}\n        setSelectedValue={setSelectedValue}\n        regex={regex}\n        setUser={setUser}\n      />\n      <LogoutModal\n        selectedValue={selectedValue}\n        setSelectedValue={setSelectedValue}\n        handleLogout={logout}\n      />\n    </QuickBloxUIKitProvider>\n  );\n};\n\nexport default App;\n"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"QuickBloxUIKitProvider can accept up to three parameters:"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(_components.ul,{children:["\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.li,{children:"maxFileSize - controls the maximum size of uploaded files."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.li,{children:"accountData - information about the application's account data."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.li,{children:"loginData - information about the logged-in user."}),"\n"]}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"Let's add the QuickBlox UIKit chat layer - QuickBloxUIKitDesktopLayout - to the markup of the main component of the application."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"If we do not specify a sessionToken in accountData, it means that the login and session start process occurs within our application. In this case, it is necessary to perform the following fifth step in our instruction.\nHowever, if the session start and application login process is already performed in another application, such as on a server, and we already have a ready sessionToken, then we can skip the next step."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"configure-quickbloxuikitprovider",children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.a,{href:"https://docs.quickblox.com/docs/react-uikit-send-your-first-message#step-5-configure-quickbloxuikitprovider",target:"_blank",rel:"nofollow noopener noreferrer",children:"Configure QuickBloxUIKitProvider"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"To configure QuickBloxUIKitProvider and use QuickBloxUIKit in your application, follow these steps:\nInitialize DataContext:"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(_components.ol,{children:["\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.li,{children:"To work with QuickBlox, it is necessary to initialize the UI Kit react DataContext. It contains important data and settings for using QuickBloxSDK. The DataContext connects various components of the application and provides them access to shared data."}),"\n"]}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.pre,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{className:"language-ts",children:"const qbUIKitContext: QBDataContextType = React.useContext(qbDataContext);\n\nconst [isUserAuthorized, setUserAuthorized] = React.useState(false);\nconst [isSDKInitialized, setSDKInitialized] = React.useState(false);\n\nconst prepareSDK = async (): Promise<void> => {\n  // check if we have installed SDK\n  if ((window as any).QB === undefined) {\n    if (QB !== undefined) {\n      (window as any).QB = QB;\n    } else {\n      let QBLib = require('quickblox/quickblox.min');\n      (window as any).QB = QBLib;\n    }\n  }\n\n  const APPLICATION_ID = QBConfig.credentials.appId;\n  const AUTH_KEY = QBConfig.credentials.authKey;\n  const AUTH_SECRET = QBConfig.credentials.authSecret;\n  const ACCOUNT_KEY = QBConfig.credentials.accountKey;\n  const CONFIG = QBConfig.appConfig;\n\n  QB.init(APPLICATION_ID, AUTH_KEY, AUTH_SECRET, ACCOUNT_KEY, CONFIG);\n};\n"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(_components.ol,{start:"2",children:["\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.li,{children:"We need to add user authentication, so to do this, we will introduce two states and use the useEffect hook:"}),"\n"]}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.pre,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{className:"language-ts",children:"const [authorized, setAuthorized] = React.useState(false);\nconst [initedSDK, setInitedSDK] = React.useState(false);\n\n......\n\n useEffect(() => {\n    if (!isSDKInitialized) {\n      prepareSDK().then(result => {\n\n        QB.createSession(currentUser, async function (errorCreateSession: any, session: any) {\n          if (errorCreateSession) {\n            console.log('Create User Session has error:', JSON.stringify(errorCreateSession));\n          } else {\n            const userId: number = session.user_id;\n            const password: string = session.token;\n            const paramsConnect = { userId, password };\n\n            QB.chat.connect(paramsConnect, async function (errorConnect: any, resultConnect: any) {\n              if (errorConnect) {\n                console.log('Can not connect to chat server: ', errorConnect);\n              } else {\n                const authData: AuthorizationData = {\n                  userId: userId,\n                  password: password,\n                  userName: currentUser.login,\n                  sessionToken: session.token\n                };\n                await qbUIKitContext.authorize(authData);\n                setSDKInitialized(true);\n                setUserAuthorized(true);\n              }\n            });\n          }\n        });\n      }).catch(\n          e => {\n            console.log('init SDK has error: ', e)\n          });\n    }\n  }, []);\n\n  ......\n"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"After implementing all the steps, your App.tsx file should look like this. You can compare it this your code or copy it instead of."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.pre,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{className:"language-ts",children:"import React, { useEffect } from 'react';\n\n// @ts-ignore\nimport * as QB from 'quickblox/quickblox';\nimport {\n  QuickBloxUIKitProvider,\n  qbDataContext,\n  QuickBloxUIKitDesktopLayout,\n  LoginData,\n  AuthorizationData,\n  QBDataContextType,\n} from 'quickblox-react-ui-kit';\nimport { QBConfig } from './QBconfig';\nimport './App.css';\n\nfunction App() {\n  const currentUser: LoginData = {\n    login: '',\n    password: '',\n  };\n\n  const qbUIKitContext: QBDataContextType = React.useContext(qbDataContext);\n\n  const [isUserAuthorized, setUserAuthorized] = React.useState(false);\n  const [isSDKInitialized, setSDKInitialized] = React.useState(false);\n\n  const prepareSDK = async (): Promise<void> => {\n    // check if we have installed SDK\n    if ((window as any).QB === undefined) {\n      if (QB !== undefined) {\n        (window as any).QB = QB;\n      } else {\n        let QBLib = require('quickblox/quickblox.min');\n        (window as any).QB = QBLib;\n      }\n    }\n\n    const APPLICATION_ID = QBConfig.credentials.appId;\n    const AUTH_KEY = QBConfig.credentials.authKey;\n    const AUTH_SECRET = QBConfig.credentials.authSecret;\n    const ACCOUNT_KEY = QBConfig.credentials.accountKey;\n    const CONFIG = QBConfig.appConfig;\n\n    QB.init(APPLICATION_ID, AUTH_KEY, AUTH_SECRET, ACCOUNT_KEY, CONFIG);\n  };\n\n  useEffect(() => {\n    if (!isSDKInitialized) {\n      prepareSDK()\n        .then((result) => {\n          QB.createSession(\n            currentUser,\n            async function (errorCreateSession: any, session: any) {\n              if (errorCreateSession) {\n                console.log(\n                  'Create User Session has error:',\n                  JSON.stringify(errorCreateSession),\n                );\n              } else {\n                const userId: number = session.user_id;\n                const password: string = session.token;\n                const paramsConnect = { userId, password };\n\n                QB.chat.connect(\n                  paramsConnect,\n                  async function (errorConnect: any, resultConnect: any) {\n                    if (errorConnect) {\n                      console.log(\n                        'Can not connect to chat server: ',\n                        errorConnect,\n                      );\n                    } else {\n                      const authData: AuthorizationData = {\n                        userId: userId,\n                        password: password,\n                        userName: currentUser.login,\n                        sessionToken: session.token,\n                      };\n                      await qbUIKitContext.authorize(authData);\n                      setSDKInitialized(true);\n                      setUserAuthorized(true);\n                    }\n                  },\n                );\n              }\n            },\n          );\n        })\n        .catch((e) => {\n          console.log('init SDK has error: ', e);\n        });\n    }\n  }, []);\n\n  return (\n    <div>\n      <QuickBloxUIKitProvider\n        maxFileSize={100 * 1000000}\n        accountData={{ ...QBConfig.credentials }}\n        loginData={{\n          login: currentUser.login,\n          password: currentUser.password,\n        }}\n      >\n        <div className=\"App\">\n          {\n            // React states indicating the ability to render UI\n            isSDKInitialized && isUserAuthorized ? (\n              <QuickBloxUIKitDesktopLayout />\n            ) : (\n              <div>wait while SDK is initializing...</div>\n            )\n          }\n        </div>\n      </QuickBloxUIKitProvider>\n    </div>\n  );\n}\n\nexport default App;\n"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"You should run the application using the command:"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.pre,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{className:"language-bash",children:"npm start\n"})})]})}let __WEBPACK_DEFAULT_EXPORT__=function(props={}){let{wrapper:MDXLayout}=Object.assign({},(0,_Users_artemkoltunov_Desktop_03_react_ui_kit_public_node_modules_storybook_addon_docs_dist_shims_mdx_react_shim__WEBPACK_IMPORTED_MODULE_2__.ah)(),props.components);return MDXLayout?(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(MDXLayout,Object.assign({},props,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_createMdxContent,props)})):_createMdxContent(props)}},"./node_modules/memoizerific sync recursive":module=>{function webpackEmptyContext(req){var e=Error("Cannot find module '"+req+"'");throw e.code="MODULE_NOT_FOUND",e}webpackEmptyContext.keys=()=>[],webpackEmptyContext.resolve=webpackEmptyContext,webpackEmptyContext.id="./node_modules/memoizerific sync recursive",module.exports=webpackEmptyContext},"./node_modules/react/cjs/react-jsx-runtime.production.min.js":(__unused_webpack_module,exports,__webpack_require__)=>{"use strict";/**
+ * @license React
+ * react-jsx-runtime.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */var f=__webpack_require__("./node_modules/react/index.js"),k=Symbol.for("react.element"),l=Symbol.for("react.fragment"),m=Object.prototype.hasOwnProperty,n=f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,p={key:!0,ref:!0,__self:!0,__source:!0};function q(c,a,g){var b,d={},e=null,h=null;for(b in void 0!==g&&(e=""+g),void 0!==a.key&&(e=""+a.key),void 0!==a.ref&&(h=a.ref),a)m.call(a,b)&&!p.hasOwnProperty(b)&&(d[b]=a[b]);if(c&&c.defaultProps)for(b in a=c.defaultProps)void 0===d[b]&&(d[b]=a[b]);return{$$typeof:k,type:c,key:e,ref:h,props:d,_owner:n.current}}exports.Fragment=l,exports.jsx=q,exports.jsxs=q},"./node_modules/react/jsx-runtime.js":(module,__unused_webpack_exports,__webpack_require__)=>{"use strict";module.exports=__webpack_require__("./node_modules/react/cjs/react-jsx-runtime.production.min.js")}}]);
+//# sourceMappingURL=docs-Introduction-mdx.ac401482.iframe.bundle.js.map

package/storybook-static/docs-Introduction-mdx.ac401482.iframe.bundle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"docs-Introduction-mdx.ac401482.iframe.bundle.js","mappings":";;;;;;;;AAQA","sources":["webpack://quickblox-react-ui-kit/./node_modules/react/cjs/react-jsx-runtime.production.min.js"],"sourcesContent":["/**\n * @license React\n * react-jsx-runtime.production.min.js\n *\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n'use strict';var f=require(\"react\"),k=Symbol.for(\"react.element\"),l=Symbol.for(\"react.fragment\"),m=Object.prototype.hasOwnProperty,n=f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,p={key:!0,ref:!0,__self:!0,__source:!0};\nfunction q(c,a,g){var b,d={},e=null,h=null;void 0!==g&&(e=\"\"+g);void 0!==a.key&&(e=\"\"+a.key);void 0!==a.ref&&(h=a.ref);for(b in a)m.call(a,b)&&!p.hasOwnProperty(b)&&(d[b]=a[b]);if(c&&c.defaultProps)for(b in a=c.defaultProps,a)void 0===d[b]&&(d[b]=a[b]);return{$$typeof:k,type:c,key:e,ref:h,props:d,_owner:n.current}}exports.Fragment=l;exports.jsx=q;exports.jsxs=q;\n"],"names":[],"sourceRoot":""}

package/storybook-static/docs-Styling-mdx.1d6c1212.iframe.bundle.js

@@ -0,0 +1,10 @@
+(self.webpackChunkquickblox_react_ui_kit=self.webpackChunkquickblox_react_ui_kit||[]).push([[229],{"./node_modules/@mdx-js/react/lib/index.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.d(__webpack_exports__,{NF:()=>withMDXComponents,Zo:()=>MDXProvider,ah:()=>useMDXComponents,pC:()=>MDXContext});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js");let MDXContext=react__WEBPACK_IMPORTED_MODULE_0__.createContext({});function withMDXComponents(Component){return boundMDXComponent;function boundMDXComponent(props){let allComponents=useMDXComponents(props.components);return react__WEBPACK_IMPORTED_MODULE_0__.createElement(Component,{...props,allComponents})}}function useMDXComponents(components){let contextComponents=react__WEBPACK_IMPORTED_MODULE_0__.useContext(MDXContext);return react__WEBPACK_IMPORTED_MODULE_0__.useMemo(()=>"function"==typeof components?components(contextComponents):{...contextComponents,...components},[contextComponents,components])}let emptyObject={};function MDXProvider({components,children,disableParentContext}){let allComponents;return allComponents=disableParentContext?"function"==typeof components?components({}):components||emptyObject:useMDXComponents(components),react__WEBPACK_IMPORTED_MODULE_0__.createElement(MDXContext.Provider,{value:allComponents},children)}},"./src/docs/Styling.mdx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{default:()=>__WEBPACK_DEFAULT_EXPORT__}),__webpack_require__("./node_modules/react/index.js");var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/react/jsx-runtime.js"),_Users_artemkoltunov_Desktop_03_react_ui_kit_public_node_modules_storybook_addon_docs_dist_shims_mdx_react_shim__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/@mdx-js/react/lib/index.js"),_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/@storybook/blocks/dist/index.mjs");function _createMdxContent(props){let _components=Object.assign({h1:"h1",a:"a",p:"p",h2:"h2",img:"img",pre:"pre",code:"code",ul:"ul",li:"li"},(0,_Users_artemkoltunov_Desktop_03_react_ui_kit_public_node_modules_storybook_addon_docs_dist_shims_mdx_react_shim__WEBPACK_IMPORTED_MODULE_2__.ah)(),props.components);return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.h_,{title:"📕 Documentation/Styling"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h1,{id:"customization",children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.a,{href:"https://docs.quickblox.com/docs/react-uikit-customization",target:"_blank",rel:"nofollow noopener noreferrer",children:"Customization"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"The QuickBlox UIKit for React allows you to create your own unique view of the UIKit."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h2,{id:"default-themes",children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.a,{href:"https://docs.quickblox.com/docs/react-uikit-customization#default-themes",target:"_blank",rel:"nofollow noopener noreferrer",children:"Default themes"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"The QuickBlox UIKit for React has 2 built in themes: Dark and Light."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h2,{id:"color-theme",children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.a,{href:"",children:"Color Theme"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.img,{src:"https://files.readme.io/393b8d6-ColorTheme.png",alt:"Image"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"Default theme for UIKit is Light.\nTo set theme you need to set value 'dark' to key data-theme in global styles (html[data-theme=\"dark”]).\nFor example, you can use pure JavaScript:"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.pre,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{className:"language-js",children:"document.documentElement.setAttribute('data-theme', 'dark');\n"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h2,{id:"use-your-own-theme",children:"Use your own theme"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"There are two options how you can create your own theme:"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(_components.ul,{children:["\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.li,{children:"Customize current theme using css"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.li,{children:"Create your own theme to customize selected components"}),"\n"]}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"To customize the current theme you just need to set the new colors in css variables."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"Or you can create your own theme. To do this you need to create a new class that implements the UiKitTheme interface."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"To use your own theme using css you need to create _theme_colors_scheme.scss and set colors"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.pre,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{className:"language-scss",children:"$background-overlay-light: rgba(19, 29, 40, 0.8);\n$background-overlay-dark: rgba(144, 151, 159, 0.8);\n$primary-50: #e7efff;\n$primary-100: #c4d7fe;\n$primary-200: #9cbcfe;\n$primary-300: #74a1fd;\n$primary-400: #578cfc;\n$primary-500: #3978fc;\n$primary-600: #3370fc;\n$primary-700: #2c65fb;\n$primary-800: #245bfb;\n$primary-900: #1748fa;\n$primary-a-100: #ffffff;\n$primary-a-200: #f7f9ff;\n$primary-a-400: #c4cfff;\n$primary-a-700: #abbaff;\n$secondary-50: #e4e6e8;\n$secondary-100: #bcc1c5;\n$secondary-200: #90979f;\n$secondary-300: #636d78;\n$secondary-400: #414e5b;\n$secondary-500: #202f3e;\n$secondary-600: #1c2a38;\n$secondary-700: #182330;\n$secondary-800: #131d28;\n$secondary-900: #0b121b;\n$secondary-a-100: #74a1fd;\n$secondary-a-200: #3978fc;\n$secondary-a-400: #245bfb;\n$secondary-a-700: #0050dc;\n$system-green-100: #c8f1d6;\n$system-green-200: #a4e7bb;\n$system-green-300: #80dda0;\n$system-green-400: #64d68b;\n$system-green-500: #49cf77;\n$error-100: #ffc4c1;\n$error-200: #ff9d98;\n$error-300: #ff766e;\n$error-400: #ff584f;\n$error-500: #ff3b30;\n$information: #fdb0ff;\n$highlight: #fffdc1;\n"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"To use your own new theme colors create _theme_dark.scss and _theme_light.scss files and set color variable."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.pre,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{className:"language-scss",children:"// _theme_dark.scss:\n\nhtml[data-theme='dark'] {\n  --color-background-info: #{$primary-500};\n  --tertiary-elements: #{$background-overlay-dark};\n  --main-elements: #{$primary-300};\n  --secondary-elements: #{$primary-a-100};\n  --input-elements: #{$secondary-200};\n  --disabled-elements: #{$secondary-300};\n  --field-border: #{$secondary-200};\n  --main-text: #{$primary-a-100};\n  --secondary-text: #{$secondary-200};\n  --caption: #{$secondary-100};\n  --main-background: #{$secondary-500};\n  --secondary-background: #{$secondary-800};\n  --incoming-background: #{$secondary-400};\n  --outgoing-background: #{$primary-500};\n  --dropdown-background: #{$secondary-400};\n  --chat-input: #{$secondary-800};\n  --divider: #{$secondary-400};\n  --error: #{$error-300};\n  --hightlight: #{$highlight};\n}\n\n// _theme_light.scss:\n:root {\n  --color-background-info: #{$primary-100};\n  --tertiary-elements: #{$secondary-300};\n  --main-elements: #{$primary-500};\n  --secondary-elements: #{$secondary-500};\n  --input-elements: #{$secondary-500};\n  --disabled-elements: #{$secondary-100};\n  --field-border: #{$secondary-200};\n  --main-text: #{$secondary-900};\n  --secondary-text: #{$secondary-300};\n  --caption: #{$secondary-200};\n  --main-background: #{$primary-a-100};\n  --secondary-background: #{$primary-a-100};\n  --secondary-background-modal: #{$background-overlay-light};\n  --incoming-background: #{$secondary-50};\n  --outgoing-background: #{$primary-50};\n  --dropdown-background: #{$primary-a-100};\n  --chat-input: #{$primary-a-200};\n  --divider: #{$primary-50};\n  --error: #{$error-500};\n  --hightlight: #{$highlight};\n}\n"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"To create your own theme to customize selected components you need to create a new class that implements the UiKitTheme interface."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.pre,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{className:"language-ts",children:"//DefaultTheme implements UiKitTheme\nexport default class CustomTheme extends DefaultTheme {\n  divider = (): string => 'var(--divider)';\n  mainText = (): string => '#FFFFFF';\n  fontFamily = (): string => 'Roboto';\n  /*\n  The DefaultTheme contains other theme methods :\n  caption = (): string => 'var(--caption)';\n  chatInput = (): string => 'var(--chat-input)';\n  disabledElements = (): string => 'var(--disabled-elements)';\n  dropdownBackground = (): string => 'var(--dropdown-background)';\n  error = (): string => 'var(--error)';\n  fieldBorder = (): string => 'var(--field-border)';\n  hightlight = (): string => 'var(--hightlight)';\n  incomingBackground = (): string => 'var(--incoming-background)';\n  inputElements = (): string => 'var(--input-elements)';\n  mainBackground = (): string => 'var(--main-background)';\n  mainElements = (): string => 'var(--main-elements)';\n  outgoingBackground = (): string => 'var(--outgoing-background)';\n  secondaryBackground = (): string => 'var(--secondary-background)';\n  secondaryElements = (): string => 'var(--secondary-elements)';\n  secondaryText = (): string => 'var(--secondary-text)';\n  */\n}\n"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"and specify selected components:"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(_components.ul,{children:["\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.li,{children:"desktop layout container"}),"\n"]}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.pre,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{className:"language-ts",children:"<QuickBloxUIKitDesktopLayout theme={new CustomTheme()}>\n"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h1,{id:"custom-styling",children:"Custom styling"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"We have developed our components with the ability to be customized to individual needs, so each component accepts a prop called className, allowing the user to apply their own styles to the component."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.pre,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{className:"language-ts",children:"import { Button } from '../../ui-components';\nimport './style.scss';\n\n<Button className=\"button\">Button</Button>;\n"})})]})}let __WEBPACK_DEFAULT_EXPORT__=function(props={}){let{wrapper:MDXLayout}=Object.assign({},(0,_Users_artemkoltunov_Desktop_03_react_ui_kit_public_node_modules_storybook_addon_docs_dist_shims_mdx_react_shim__WEBPACK_IMPORTED_MODULE_2__.ah)(),props.components);return MDXLayout?(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(MDXLayout,Object.assign({},props,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_createMdxContent,props)})):_createMdxContent(props)}},"./node_modules/memoizerific sync recursive":module=>{function webpackEmptyContext(req){var e=Error("Cannot find module '"+req+"'");throw e.code="MODULE_NOT_FOUND",e}webpackEmptyContext.keys=()=>[],webpackEmptyContext.resolve=webpackEmptyContext,webpackEmptyContext.id="./node_modules/memoizerific sync recursive",module.exports=webpackEmptyContext},"./node_modules/react/cjs/react-jsx-runtime.production.min.js":(__unused_webpack_module,exports,__webpack_require__)=>{"use strict";/**
+ * @license React
+ * react-jsx-runtime.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */var f=__webpack_require__("./node_modules/react/index.js"),k=Symbol.for("react.element"),l=Symbol.for("react.fragment"),m=Object.prototype.hasOwnProperty,n=f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,p={key:!0,ref:!0,__self:!0,__source:!0};function q(c,a,g){var b,d={},e=null,h=null;for(b in void 0!==g&&(e=""+g),void 0!==a.key&&(e=""+a.key),void 0!==a.ref&&(h=a.ref),a)m.call(a,b)&&!p.hasOwnProperty(b)&&(d[b]=a[b]);if(c&&c.defaultProps)for(b in a=c.defaultProps)void 0===d[b]&&(d[b]=a[b]);return{$$typeof:k,type:c,key:e,ref:h,props:d,_owner:n.current}}exports.Fragment=l,exports.jsx=q,exports.jsxs=q},"./node_modules/react/jsx-runtime.js":(module,__unused_webpack_exports,__webpack_require__)=>{"use strict";module.exports=__webpack_require__("./node_modules/react/cjs/react-jsx-runtime.production.min.js")}}]);
+//# sourceMappingURL=docs-Styling-mdx.1d6c1212.iframe.bundle.js.map

package/storybook-static/docs-Styling-mdx.1d6c1212.iframe.bundle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"docs-Styling-mdx.1d6c1212.iframe.bundle.js","mappings":";;;;;;;;AAQA","sources":["webpack://quickblox-react-ui-kit/./node_modules/react/cjs/react-jsx-runtime.production.min.js"],"sourcesContent":["/**\n * @license React\n * react-jsx-runtime.production.min.js\n *\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n'use strict';var f=require(\"react\"),k=Symbol.for(\"react.element\"),l=Symbol.for(\"react.fragment\"),m=Object.prototype.hasOwnProperty,n=f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,p={key:!0,ref:!0,__self:!0,__source:!0};\nfunction q(c,a,g){var b,d={},e=null,h=null;void 0!==g&&(e=\"\"+g);void 0!==a.key&&(e=\"\"+a.key);void 0!==a.ref&&(h=a.ref);for(b in a)m.call(a,b)&&!p.hasOwnProperty(b)&&(d[b]=a[b]);if(c&&c.defaultProps)for(b in a=c.defaultProps,a)void 0===d[b]&&(d[b]=a[b]);return{$$typeof:k,type:c,key:e,ref:h,props:d,_owner:n.current}}exports.Fragment=l;exports.jsx=q;exports.jsxs=q;\n"],"names":[],"sourceRoot":""}

package/storybook-static/iframe.html

@@ -318,7 +318,7 @@
   } catch (e) {
     // eslint-disable-next-line no-console
     console.warn('unable to connect to top frame for connecting dev tools');
-  }</script><link href="static/css/main.4e852eef.css" rel="stylesheet"><style>#storybook-root[hidden],
+  }</script><link href="static/css/main.6fa55a2c.css" rel="stylesheet"><style>#storybook-root[hidden],
       #storybook-docs[hidden] {
         display: none !important;
       }</style></head><body><div class="sb-preparing-story sb-wrapper"><div class="sb-loader"></div></div><div class="sb-preparing-docs sb-wrapper"><div class="sb-previewBlock"><div class="sb-previewBlock_header"><div class="sb-previewBlock_icon"></div><div class="sb-previewBlock_icon"></div><div class="sb-previewBlock_icon"></div><div class="sb-previewBlock_icon"></div></div><div class="sb-previewBlock_body"><div class="sb-loader"></div></div></div><table aria-hidden="true" class="sb-argstableBlock"><thead class="sb-argstableBlock-head"><tr><th><span>Name</span></th><th><span>Description</span></th><th><span>Default</span></th><th><span>Control</span></th></tr></thead><tbody class="sb-argstableBlock-body"><tr><td><span>propertyName</span><span title="Required">*</span></td><td><div><span>This is a short description</span></div><div class="sb-argstableBlock-summary"><div><span class="sb-argstableBlock-code">summary</span></div></div></td><td><div><span class="sb-argstableBlock-code">defaultValue</span></div></td><td><button>Set string</button></td></tr><tr><td><span>propertyName</span><span>*</span></td><td><div><span>This is a short description</span></div><div class="sb-argstableBlock-summary"><div><span class="sb-argstableBlock-code">summary</span></div></div></td><td><div><span class="sb-argstableBlock-code">defaultValue</span></div></td><td><button>Set string</button></td></tr><tr><td><span>propertyName</span><span>*</span></td><td><div><span>This is a short description</span></div><div class="sb-argstableBlock-summary"><div><span class="sb-argstableBlock-code">summary</span></div></div></td><td><div><span class="sb-argstableBlock-code">defaultValue</span></div></td><td><button>Set string</button></td></tr></tbody></table></div><div class="sb-nopreview sb-wrapper"><div class="sb-nopreview_main"><h1 class="sb-nopreview_heading sb-heading">No Preview</h1><p>Sorry, but you either have no stories or none are selected somehow.</p><ul><li>Please check the Storybook config.</li><li>Try reloading the page.</li></ul><p>If the problem persists, check the browser console, or the terminal you've run Storybook from.</p></div></div><div class="sb-errordisplay sb-wrapper"><pre id="error-message" class="sb-heading"></pre><pre class="sb-errordisplay_code"><code id="error-stack"></code></pre></div><div id="storybook-root"></div><div id="storybook-docs"></div><script>window['CONFIG_TYPE'] = "PRODUCTION";
@@ -348,8 +348,8 @@
             window['DOCS_OPTIONS'] = {"defaultName":"Docs","autodocs":"tag"};</script><script type="module">import './sb-preview/runtime.js';
 
       
-      import './runtime~main.16726a14.iframe.bundle.js';
+      import './runtime~main.e945879b.iframe.bundle.js';
       
-      import './926.f14bb932.iframe.bundle.js';
+      import './926.f5308089.iframe.bundle.js';
       
-      import './main.0332574c.iframe.bundle.js';</script></body></html>
+      import './main.597d432b.iframe.bundle.js';</script></body></html>

package/storybook-static/index.json

@@ -1 +1 @@
-{"v":4,"entries":{"avatar--docs":{"id":"avatar--docs","title":"Avatar","name":"Docs","importPath":"./src/Presentation/ui-components/Avatar/avatar.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"avatar--avatar-default":{"type":"story","id":"avatar--avatar-default","name":"Avatar Default","title":"Avatar","importPath":"./src/Presentation/ui-components/Avatar/avatar.stories.tsx","tags":["autodocs","story"]},"avatar--avatar-icon":{"type":"story","id":"avatar--avatar-icon","name":"Avatar Icon","title":"Avatar","importPath":"./src/Presentation/ui-components/Avatar/avatar.stories.tsx","tags":["autodocs","story"]},"avatar--avatar-image":{"type":"story","id":"avatar--avatar-image","name":"Avatar Image","title":"Avatar","importPath":"./src/Presentation/ui-components/Avatar/avatar.stories.tsx","tags":["autodocs","story"]},"badge--docs":{"id":"badge--docs","title":"Badge","name":"Docs","importPath":"./src/Presentation/ui-components/Badge/Badge.stories.ts","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"badge--badge-default":{"type":"story","id":"badge--badge-default","name":"Badge Default","title":"Badge","importPath":"./src/Presentation/ui-components/Badge/Badge.stories.ts","tags":["autodocs","story"]},"badge--badge-count":{"type":"story","id":"badge--badge-count","name":"Badge Count","title":"Badge","importPath":"./src/Presentation/ui-components/Badge/Badge.stories.ts","tags":["autodocs","story"]},"badge--badge-mute":{"type":"story","id":"badge--badge-mute","name":"Badge Mute","title":"Badge","importPath":"./src/Presentation/ui-components/Badge/Badge.stories.ts","tags":["autodocs","story"]},"button--docs":{"id":"button--docs","title":"Button","name":"Docs","importPath":"./src/Presentation/ui-components/Button/Button.stories.ts","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"button--button-default":{"type":"story","id":"button--button-default","name":"Button Default","title":"Button","importPath":"./src/Presentation/ui-components/Button/Button.stories.ts","tags":["autodocs","story"]},"button--button-outline":{"type":"story","id":"button--button-outline","name":"Button Outline","title":"Button","importPath":"./src/Presentation/ui-components/Button/Button.stories.ts","tags":["autodocs","story"]},"button--button-danger":{"type":"story","id":"button--button-danger","name":"Button Danger","title":"Button","importPath":"./src/Presentation/ui-components/Button/Button.stories.ts","tags":["autodocs","story"]},"button--button-text":{"type":"story","id":"button--button-text","name":"Button Text","title":"Button","importPath":"./src/Presentation/ui-components/Button/Button.stories.ts","tags":["autodocs","story"]},"dialogbanner--docs":{"id":"dialogbanner--docs","title":"DialogBanner","name":"Docs","importPath":"./src/Presentation/ui-components/DialogBanner/DialogBanner.stories.ts","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"dialogbanner--dialog-banner-default":{"type":"story","id":"dialogbanner--dialog-banner-default","name":"Dialog Banner Default","title":"DialogBanner","importPath":"./src/Presentation/ui-components/DialogBanner/DialogBanner.stories.ts","tags":["autodocs","story"]},"dialogitempreview--docs":{"id":"dialogitempreview--docs","title":"DialogItemPreview","name":"Docs","importPath":"./src/Presentation/ui-components/DialogItemPreview/DialogItemPreview.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"dialogitempreview--dialog-item-preview-default":{"type":"story","id":"dialogitempreview--dialog-item-preview-default","name":"Dialog Item Preview Default","title":"DialogItemPreview","importPath":"./src/Presentation/ui-components/DialogItemPreview/DialogItemPreview.stories.tsx","tags":["autodocs","story"]},"dialogitempreview--dialog-item-preview-full-screen":{"type":"story","id":"dialogitempreview--dialog-item-preview-full-screen","name":"Dialog Item Preview Full Screen","title":"DialogItemPreview","importPath":"./src/Presentation/ui-components/DialogItemPreview/DialogItemPreview.stories.tsx","tags":["autodocs","story"]},"dialogitempreview--dialog-item-preview-mobile-screen":{"type":"story","id":"dialogitempreview--dialog-item-preview-mobile-screen","name":"Dialog Item Preview Mobile Screen","title":"DialogItemPreview","importPath":"./src/Presentation/ui-components/DialogItemPreview/DialogItemPreview.stories.tsx","tags":["autodocs","story"]},"dialogitempreview--dialog-item-preview-mobile-screen-i-pad":{"type":"story","id":"dialogitempreview--dialog-item-preview-mobile-screen-i-pad","name":"Dialog Item Preview Mobile Screen I Pad","title":"DialogItemPreview","importPath":"./src/Presentation/ui-components/DialogItemPreview/DialogItemPreview.stories.tsx","tags":["autodocs","story"]},"dialog-window--docs":{"id":"dialog-window--docs","title":"Dialog Window","name":"Docs","importPath":"./src/Presentation/ui-components/DialogWindow/DialogWindow.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"dialog-window--dialog-window-default":{"type":"story","id":"dialog-window--dialog-window-default","name":"Dialog Window Default","title":"Dialog Window","importPath":"./src/Presentation/ui-components/DialogWindow/DialogWindow.stories.tsx","tags":["autodocs","story"]},"dropdown--docs":{"id":"dropdown--docs","title":"Dropdown","name":"Docs","importPath":"./src/Presentation/ui-components/Dropdown/Dropdown.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"dropdown--dropdown-default":{"type":"story","id":"dropdown--dropdown-default","name":"Dropdown Default","title":"Dropdown","importPath":"./src/Presentation/ui-components/Dropdown/Dropdown.stories.tsx","tags":["autodocs","story"]},"dropdown--dropdown-right-icon":{"type":"story","id":"dropdown--dropdown-right-icon","name":"Dropdown Right Icon","title":"Dropdown","importPath":"./src/Presentation/ui-components/Dropdown/Dropdown.stories.tsx","tags":["autodocs","story"]},"dropdown--dropdown-left-icon":{"type":"story","id":"dropdown--dropdown-left-icon","name":"Dropdown Left Icon","title":"Dropdown","importPath":"./src/Presentation/ui-components/Dropdown/Dropdown.stories.tsx","tags":["autodocs","story"]},"header--docs":{"id":"header--docs","title":"Header","name":"Docs","importPath":"./src/Presentation/ui-components/Header/Header.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"header--header-default":{"type":"story","id":"header--header-default","name":"Header Default","title":"Header","importPath":"./src/Presentation/ui-components/Header/Header.stories.tsx","tags":["autodocs","story"]},"header--header-with-avatar":{"type":"story","id":"header--header-with-avatar","name":"Header With Avatar","title":"Header","importPath":"./src/Presentation/ui-components/Header/Header.stories.tsx","tags":["autodocs","story"]},"header--header-with-avatar-and-back":{"type":"story","id":"header--header-with-avatar-and-back","name":"Header With Avatar And Back","title":"Header","importPath":"./src/Presentation/ui-components/Header/Header.stories.tsx","tags":["autodocs","story"]},"header--header-with-one-children-icon":{"type":"story","id":"header--header-with-one-children-icon","name":"Header With One Children Icon","title":"Header","importPath":"./src/Presentation/ui-components/Header/Header.stories.tsx","tags":["autodocs","story"]},"header--header-with-two-children-icon":{"type":"story","id":"header--header-with-two-children-icon","name":"Header With Two Children Icon","title":"Header","importPath":"./src/Presentation/ui-components/Header/Header.stories.tsx","tags":["autodocs","story"]},"loader--docs":{"id":"loader--docs","title":"Loader","name":"Docs","importPath":"./src/Presentation/ui-components/Loader/Loader.stories.ts","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"loader--loader-default":{"type":"story","id":"loader--loader-default","name":"Loader Default","title":"Loader","importPath":"./src/Presentation/ui-components/Loader/Loader.stories.ts","tags":["autodocs","story"]},"message--message-text":{"type":"story","id":"message--message-text","name":"Message Text","title":"Message","importPath":"./src/Presentation/ui-components/Message/Message.stories.tsx","tags":["story"]},"message--message-image":{"type":"story","id":"message--message-image","name":"Message Image","title":"Message","importPath":"./src/Presentation/ui-components/Message/Message.stories.tsx","tags":["story"]},"message--message-file":{"type":"story","id":"message--message-file","name":"Message File","title":"Message","importPath":"./src/Presentation/ui-components/Message/Message.stories.tsx","tags":["story"]},"messageinput--default":{"type":"story","id":"messageinput--default","name":"Default","title":"MessageInput","importPath":"./src/Presentation/ui-components/MessageInput/MessageInput.stories.tsx","tags":["story"]},"messageinput--with-voice-message":{"type":"story","id":"messageinput--with-voice-message","name":"With Voice Message","title":"MessageInput","importPath":"./src/Presentation/ui-components/MessageInput/MessageInput.stories.tsx","tags":["story"]},"messageinput--with-preview":{"type":"story","id":"messageinput--with-preview","name":"With Preview","title":"MessageInput","importPath":"./src/Presentation/ui-components/MessageInput/MessageInput.stories.tsx","tags":["story"]},"messageinput--loading-state":{"type":"story","id":"messageinput--loading-state","name":"Loading State","title":"MessageInput","importPath":"./src/Presentation/ui-components/MessageInput/MessageInput.stories.tsx","tags":["story"]},"messageseparator--docs":{"id":"messageseparator--docs","title":"MessageSeparator","name":"Docs","importPath":"./src/Presentation/ui-components/MessageSeparator/MessageSeparator.stories.ts","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"messageseparator--message-separator-date":{"type":"story","id":"messageseparator--message-separator-date","name":"Message Separator Date","title":"MessageSeparator","importPath":"./src/Presentation/ui-components/MessageSeparator/MessageSeparator.stories.ts","tags":["autodocs","story"]},"messageseparator--message-separator-system":{"type":"story","id":"messageseparator--message-separator-system","name":"Message Separator System","title":"MessageSeparator","importPath":"./src/Presentation/ui-components/MessageSeparator/MessageSeparator.stories.ts","tags":["autodocs","story"]},"placeholder--docs":{"id":"placeholder--docs","title":"Placeholder","name":"Docs","importPath":"./src/Presentation/ui-components/Placeholder/Placeholder.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"placeholder--placeholder-default":{"type":"story","id":"placeholder--placeholder-default","name":"Placeholder Default","title":"Placeholder","importPath":"./src/Presentation/ui-components/Placeholder/Placeholder.stories.tsx","tags":["autodocs","story"]},"placeholder--placeholder-error":{"type":"story","id":"placeholder--placeholder-error","name":"Placeholder Error","title":"Placeholder","importPath":"./src/Presentation/ui-components/Placeholder/Placeholder.stories.tsx","tags":["autodocs","story"]},"previewfilemessage--docs":{"id":"previewfilemessage--docs","title":"PreviewFileMessage","name":"Docs","importPath":"./src/Presentation/ui-components/PreviewFileMessage/PreviewFileMessage.stories.ts","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"previewfilemessage--preview-file-message-default":{"type":"story","id":"previewfilemessage--preview-file-message-default","name":"Preview File Message Default","title":"PreviewFileMessage","importPath":"./src/Presentation/ui-components/PreviewFileMessage/PreviewFileMessage.stories.ts","tags":["autodocs","story"]},"previewfilemessage--preview-file-message-audio":{"type":"story","id":"previewfilemessage--preview-file-message-audio","name":"Preview File Message Audio","title":"PreviewFileMessage","importPath":"./src/Presentation/ui-components/PreviewFileMessage/PreviewFileMessage.stories.ts","tags":["autodocs","story"]},"previewfilemessage--preview-file-message-video":{"type":"story","id":"previewfilemessage--preview-file-message-video","name":"Preview File Message Video","title":"PreviewFileMessage","importPath":"./src/Presentation/ui-components/PreviewFileMessage/PreviewFileMessage.stories.ts","tags":["autodocs","story"]},"previewfilemessage--preview-file-message-image":{"type":"story","id":"previewfilemessage--preview-file-message-image","name":"Preview File Message Image","title":"PreviewFileMessage","importPath":"./src/Presentation/ui-components/PreviewFileMessage/PreviewFileMessage.stories.ts","tags":["autodocs","story"]},"settings-item--docs":{"id":"settings-item--docs","title":"Settings Item","name":"Docs","importPath":"./src/Presentation/ui-components/SettingsItem/SettingsItem.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"settings-item--settings-item-default":{"type":"story","id":"settings-item--settings-item-default","name":"Settings Item Default","title":"Settings Item","importPath":"./src/Presentation/ui-components/SettingsItem/SettingsItem.stories.tsx","tags":["autodocs","story"]},"settings-item--settings-item-notification":{"type":"story","id":"settings-item--settings-item-notification","name":"Settings Item Notification","title":"Settings Item","importPath":"./src/Presentation/ui-components/SettingsItem/SettingsItem.stories.tsx","tags":["autodocs","story"]},"settings-item--settings-item-members":{"type":"story","id":"settings-item--settings-item-members","name":"Settings Item Members","title":"Settings Item","importPath":"./src/Presentation/ui-components/SettingsItem/SettingsItem.stories.tsx","tags":["autodocs","story"]},"textfield--docs":{"id":"textfield--docs","title":"TextField","name":"Docs","importPath":"./src/Presentation/ui-components/TextField/TextField.stories.ts","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"textfield--text-field-default":{"type":"story","id":"textfield--text-field-default","name":"Text Field Default","title":"TextField","importPath":"./src/Presentation/ui-components/TextField/TextField.stories.ts","tags":["autodocs","story"]},"textfield--text-field-disabled":{"type":"story","id":"textfield--text-field-disabled","name":"Text Field Disabled","title":"TextField","importPath":"./src/Presentation/ui-components/TextField/TextField.stories.ts","tags":["autodocs","story"]},"textfield--text-field-reset":{"type":"story","id":"textfield--text-field-reset","name":"Text Field Reset","title":"TextField","importPath":"./src/Presentation/ui-components/TextField/TextField.stories.ts","tags":["autodocs","story"]},"toast--docs":{"id":"toast--docs","title":"Toast","name":"Docs","importPath":"./src/Presentation/ui-components/Toast/Toast.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"toast--toast-default":{"type":"story","id":"toast--toast-default","name":"Toast Default","title":"Toast","importPath":"./src/Presentation/ui-components/Toast/Toast.stories.tsx","tags":["autodocs","story"]},"user-list-item--docs":{"id":"user-list-item--docs","title":"User List Item","name":"Docs","importPath":"./src/Presentation/ui-components/UserListItem/UserListItem.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"user-list-item--user-list-item-default":{"type":"story","id":"user-list-item--user-list-item-default","name":"User List Item Default","title":"User List Item","importPath":"./src/Presentation/ui-components/UserListItem/UserListItem.stories.tsx","tags":["autodocs","story"]},"user-list-item--user-list":{"type":"story","id":"user-list-item--user-list","name":"User List","title":"User List Item","importPath":"./src/Presentation/ui-components/UserListItem/UserListItem.stories.tsx","tags":["autodocs","story"]}}}
+{"v":4,"entries":{"📕-documentation-introduction--docs":{"id":"📕-documentation-introduction--docs","title":"📕 Documentation/Introduction","name":"Docs","importPath":"./src/docs/Introduction.mdx","storiesImports":[],"type":"docs","tags":["unattached-mdx","docs"]},"📕-documentation-styling--docs":{"id":"📕-documentation-styling--docs","title":"📕 Documentation/Styling","name":"Docs","importPath":"./src/docs/Styling.mdx","storiesImports":[],"type":"docs","tags":["unattached-mdx","docs"]},"quickblox-react-ui-kit-presentation-ui-components-avatar--docs":{"id":"quickblox-react-ui-kit-presentation-ui-components-avatar--docs","title":"@quickblox-react-ui-kit/Presentation/ui-components/Avatar","name":"Docs","importPath":"./src/Presentation/ui-components/Avatar/avatar.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"quickblox-react-ui-kit-presentation-ui-components-avatar--avatar-default":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-avatar--avatar-default","name":"Avatar Default","title":"@quickblox-react-ui-kit/Presentation/ui-components/Avatar","importPath":"./src/Presentation/ui-components/Avatar/avatar.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-avatar--avatar-icon":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-avatar--avatar-icon","name":"Avatar Icon","title":"@quickblox-react-ui-kit/Presentation/ui-components/Avatar","importPath":"./src/Presentation/ui-components/Avatar/avatar.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-avatar--avatar-image":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-avatar--avatar-image","name":"Avatar Image","title":"@quickblox-react-ui-kit/Presentation/ui-components/Avatar","importPath":"./src/Presentation/ui-components/Avatar/avatar.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-badge--docs":{"id":"quickblox-react-ui-kit-presentation-ui-components-badge--docs","title":"@quickblox-react-ui-kit/Presentation/ui-components/Badge","name":"Docs","importPath":"./src/Presentation/ui-components/Badge/Badge.stories.ts","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"quickblox-react-ui-kit-presentation-ui-components-badge--badge-default":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-badge--badge-default","name":"Badge Default","title":"@quickblox-react-ui-kit/Presentation/ui-components/Badge","importPath":"./src/Presentation/ui-components/Badge/Badge.stories.ts","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-badge--badge-count":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-badge--badge-count","name":"Badge Count","title":"@quickblox-react-ui-kit/Presentation/ui-components/Badge","importPath":"./src/Presentation/ui-components/Badge/Badge.stories.ts","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-badge--badge-mute":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-badge--badge-mute","name":"Badge Mute","title":"@quickblox-react-ui-kit/Presentation/ui-components/Badge","importPath":"./src/Presentation/ui-components/Badge/Badge.stories.ts","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-button--docs":{"id":"quickblox-react-ui-kit-presentation-ui-components-button--docs","title":"@quickblox-react-ui-kit/Presentation/ui-components/Button","name":"Docs","importPath":"./src/Presentation/ui-components/Button/Button.stories.ts","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"quickblox-react-ui-kit-presentation-ui-components-button--button-default":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-button--button-default","name":"Button Default","title":"@quickblox-react-ui-kit/Presentation/ui-components/Button","importPath":"./src/Presentation/ui-components/Button/Button.stories.ts","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-button--button-outline":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-button--button-outline","name":"Button Outline","title":"@quickblox-react-ui-kit/Presentation/ui-components/Button","importPath":"./src/Presentation/ui-components/Button/Button.stories.ts","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-button--button-danger":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-button--button-danger","name":"Button Danger","title":"@quickblox-react-ui-kit/Presentation/ui-components/Button","importPath":"./src/Presentation/ui-components/Button/Button.stories.ts","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-button--button-text":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-button--button-text","name":"Button Text","title":"@quickblox-react-ui-kit/Presentation/ui-components/Button","importPath":"./src/Presentation/ui-components/Button/Button.stories.ts","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-dialogbanner--docs":{"id":"quickblox-react-ui-kit-presentation-ui-components-dialogbanner--docs","title":"@quickblox-react-ui-kit/Presentation/ui-components/DialogBanner","name":"Docs","importPath":"./src/Presentation/ui-components/DialogBanner/DialogBanner.stories.ts","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"quickblox-react-ui-kit-presentation-ui-components-dialogbanner--dialog-banner-default":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-dialogbanner--dialog-banner-default","name":"DialogBanner Default","title":"@quickblox-react-ui-kit/Presentation/ui-components/DialogBanner","importPath":"./src/Presentation/ui-components/DialogBanner/DialogBanner.stories.ts","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-dialogitempreview--docs":{"id":"quickblox-react-ui-kit-presentation-ui-components-dialogitempreview--docs","title":"@quickblox-react-ui-kit/Presentation/ui-components/DialogItemPreview","name":"Docs","importPath":"./src/Presentation/ui-components/DialogItemPreview/DialogItemPreview.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"quickblox-react-ui-kit-presentation-ui-components-dialogitempreview--dialog-item-preview-default":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-dialogitempreview--dialog-item-preview-default","name":"DialogItemPreview Default","title":"@quickblox-react-ui-kit/Presentation/ui-components/DialogItemPreview","importPath":"./src/Presentation/ui-components/DialogItemPreview/DialogItemPreview.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-dialogitempreview--dialog-item-preview-full-screen":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-dialogitempreview--dialog-item-preview-full-screen","name":"DialogItemPreview FullScreen","title":"@quickblox-react-ui-kit/Presentation/ui-components/DialogItemPreview","importPath":"./src/Presentation/ui-components/DialogItemPreview/DialogItemPreview.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-dialogitempreview--dialog-item-preview-mobile-screen":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-dialogitempreview--dialog-item-preview-mobile-screen","name":"DialogItemPreview MobileScreen","title":"@quickblox-react-ui-kit/Presentation/ui-components/DialogItemPreview","importPath":"./src/Presentation/ui-components/DialogItemPreview/DialogItemPreview.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-dialogitempreview--dialog-item-preview-mobile-screen-i-pad":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-dialogitempreview--dialog-item-preview-mobile-screen-i-pad","name":"DialogItemPreview MobileScreen IPad","title":"@quickblox-react-ui-kit/Presentation/ui-components/DialogItemPreview","importPath":"./src/Presentation/ui-components/DialogItemPreview/DialogItemPreview.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-dialogwindow--docs":{"id":"quickblox-react-ui-kit-presentation-ui-components-dialogwindow--docs","title":"@quickblox-react-ui-kit/Presentation/ui-components/DialogWindow","name":"Docs","importPath":"./src/Presentation/ui-components/DialogWindow/DialogWindow.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"quickblox-react-ui-kit-presentation-ui-components-dialogwindow--dialog-window-default":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-dialogwindow--dialog-window-default","name":"DialogWindow Default","title":"@quickblox-react-ui-kit/Presentation/ui-components/DialogWindow","importPath":"./src/Presentation/ui-components/DialogWindow/DialogWindow.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-dropdown--docs":{"id":"quickblox-react-ui-kit-presentation-ui-components-dropdown--docs","title":"@quickblox-react-ui-kit/Presentation/ui-components/Dropdown","name":"Docs","importPath":"./src/Presentation/ui-components/Dropdown/Dropdown.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"quickblox-react-ui-kit-presentation-ui-components-dropdown--dropdown-default":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-dropdown--dropdown-default","name":"Dropdown Default","title":"@quickblox-react-ui-kit/Presentation/ui-components/Dropdown","importPath":"./src/Presentation/ui-components/Dropdown/Dropdown.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-dropdown--dropdown-right-icon":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-dropdown--dropdown-right-icon","name":"Dropdown Right Icon","title":"@quickblox-react-ui-kit/Presentation/ui-components/Dropdown","importPath":"./src/Presentation/ui-components/Dropdown/Dropdown.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-dropdown--dropdown-left-icon":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-dropdown--dropdown-left-icon","name":"Dropdown Left Icon","title":"@quickblox-react-ui-kit/Presentation/ui-components/Dropdown","importPath":"./src/Presentation/ui-components/Dropdown/Dropdown.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-header--docs":{"id":"quickblox-react-ui-kit-presentation-ui-components-header--docs","title":"@quickblox-react-ui-kit/Presentation/ui-components/Header","name":"Docs","importPath":"./src/Presentation/ui-components/Header/Header.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"quickblox-react-ui-kit-presentation-ui-components-header--header-default":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-header--header-default","name":"Header Default","title":"@quickblox-react-ui-kit/Presentation/ui-components/Header","importPath":"./src/Presentation/ui-components/Header/Header.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-header--header-with-avatar":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-header--header-with-avatar","name":"Header With Avatar","title":"@quickblox-react-ui-kit/Presentation/ui-components/Header","importPath":"./src/Presentation/ui-components/Header/Header.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-header--header-with-avatar-and-back":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-header--header-with-avatar-and-back","name":"Header With Avatar And Back","title":"@quickblox-react-ui-kit/Presentation/ui-components/Header","importPath":"./src/Presentation/ui-components/Header/Header.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-header--header-with-one-children-icon":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-header--header-with-one-children-icon","name":"Header With One Children Icon","title":"@quickblox-react-ui-kit/Presentation/ui-components/Header","importPath":"./src/Presentation/ui-components/Header/Header.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-header--header-with-two-children-icon":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-header--header-with-two-children-icon","name":"Header With Two Children Icon","title":"@quickblox-react-ui-kit/Presentation/ui-components/Header","importPath":"./src/Presentation/ui-components/Header/Header.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-loader--docs":{"id":"quickblox-react-ui-kit-presentation-ui-components-loader--docs","title":"@quickblox-react-ui-kit/Presentation/ui-components/Loader","name":"Docs","importPath":"./src/Presentation/ui-components/Loader/Loader.stories.ts","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"quickblox-react-ui-kit-presentation-ui-components-loader--loader-default":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-loader--loader-default","name":"Loader Default","title":"@quickblox-react-ui-kit/Presentation/ui-components/Loader","importPath":"./src/Presentation/ui-components/Loader/Loader.stories.ts","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-message--docs":{"id":"quickblox-react-ui-kit-presentation-ui-components-message--docs","title":"@quickblox-react-ui-kit/Presentation/ui-components/Message","name":"Docs","importPath":"./src/Presentation/ui-components/Message/Message.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"quickblox-react-ui-kit-presentation-ui-components-message--message-text":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-message--message-text","name":"Message Text","title":"@quickblox-react-ui-kit/Presentation/ui-components/Message","importPath":"./src/Presentation/ui-components/Message/Message.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-message--message-image":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-message--message-image","name":"Message Image","title":"@quickblox-react-ui-kit/Presentation/ui-components/Message","importPath":"./src/Presentation/ui-components/Message/Message.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-message--message-file":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-message--message-file","name":"Message File","title":"@quickblox-react-ui-kit/Presentation/ui-components/Message","importPath":"./src/Presentation/ui-components/Message/Message.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-messageinput--docs":{"id":"quickblox-react-ui-kit-presentation-ui-components-messageinput--docs","title":"@quickblox-react-ui-kit/Presentation/ui-components/MessageInput","name":"Docs","importPath":"./src/Presentation/ui-components/MessageInput/MessageInput.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"quickblox-react-ui-kit-presentation-ui-components-messageinput--message-input-default":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-messageinput--message-input-default","name":"MessageInput Default","title":"@quickblox-react-ui-kit/Presentation/ui-components/MessageInput","importPath":"./src/Presentation/ui-components/MessageInput/MessageInput.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-messageinput--message-input-with-voice-message":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-messageinput--message-input-with-voice-message","name":"MessageInput With Voice Message","title":"@quickblox-react-ui-kit/Presentation/ui-components/MessageInput","importPath":"./src/Presentation/ui-components/MessageInput/MessageInput.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-messageinput--message-input-with-preview":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-messageinput--message-input-with-preview","name":"MessageInput With Preview","title":"@quickblox-react-ui-kit/Presentation/ui-components/MessageInput","importPath":"./src/Presentation/ui-components/MessageInput/MessageInput.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-messageinput--message-input-loading-state":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-messageinput--message-input-loading-state","name":"MessageInput Loading State","title":"@quickblox-react-ui-kit/Presentation/ui-components/MessageInput","importPath":"./src/Presentation/ui-components/MessageInput/MessageInput.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-messageseparator--docs":{"id":"quickblox-react-ui-kit-presentation-ui-components-messageseparator--docs","title":"@quickblox-react-ui-kit/Presentation/ui-components/MessageSeparator","name":"Docs","importPath":"./src/Presentation/ui-components/MessageSeparator/MessageSeparator.stories.ts","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"quickblox-react-ui-kit-presentation-ui-components-messageseparator--message-separator-date":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-messageseparator--message-separator-date","name":"MessageSeparator Date","title":"@quickblox-react-ui-kit/Presentation/ui-components/MessageSeparator","importPath":"./src/Presentation/ui-components/MessageSeparator/MessageSeparator.stories.ts","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-messageseparator--message-separator-system":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-messageseparator--message-separator-system","name":"MessageSeparator System","title":"@quickblox-react-ui-kit/Presentation/ui-components/MessageSeparator","importPath":"./src/Presentation/ui-components/MessageSeparator/MessageSeparator.stories.ts","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-placeholder--docs":{"id":"quickblox-react-ui-kit-presentation-ui-components-placeholder--docs","title":"@quickblox-react-ui-kit/Presentation/ui-components/Placeholder","name":"Docs","importPath":"./src/Presentation/ui-components/Placeholder/Placeholder.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"quickblox-react-ui-kit-presentation-ui-components-placeholder--placeholder-default":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-placeholder--placeholder-default","name":"Placeholder Default","title":"@quickblox-react-ui-kit/Presentation/ui-components/Placeholder","importPath":"./src/Presentation/ui-components/Placeholder/Placeholder.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-placeholder--placeholder-error":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-placeholder--placeholder-error","name":"Placeholder Error","title":"@quickblox-react-ui-kit/Presentation/ui-components/Placeholder","importPath":"./src/Presentation/ui-components/Placeholder/Placeholder.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-previewfilemessage--docs":{"id":"quickblox-react-ui-kit-presentation-ui-components-previewfilemessage--docs","title":"@quickblox-react-ui-kit/Presentation/ui-components/PreviewFileMessage","name":"Docs","importPath":"./src/Presentation/ui-components/PreviewFileMessage/PreviewFileMessage.stories.ts","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"quickblox-react-ui-kit-presentation-ui-components-previewfilemessage--preview-file-message-default":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-previewfilemessage--preview-file-message-default","name":"PreviewFileMessage Default","title":"@quickblox-react-ui-kit/Presentation/ui-components/PreviewFileMessage","importPath":"./src/Presentation/ui-components/PreviewFileMessage/PreviewFileMessage.stories.ts","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-previewfilemessage--preview-file-message-audio":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-previewfilemessage--preview-file-message-audio","name":"PreviewFileMessage Audio","title":"@quickblox-react-ui-kit/Presentation/ui-components/PreviewFileMessage","importPath":"./src/Presentation/ui-components/PreviewFileMessage/PreviewFileMessage.stories.ts","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-previewfilemessage--preview-file-message-video":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-previewfilemessage--preview-file-message-video","name":"PreviewFileMessage Video","title":"@quickblox-react-ui-kit/Presentation/ui-components/PreviewFileMessage","importPath":"./src/Presentation/ui-components/PreviewFileMessage/PreviewFileMessage.stories.ts","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-previewfilemessage--preview-file-message-image":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-previewfilemessage--preview-file-message-image","name":"PreviewFileMessage Image","title":"@quickblox-react-ui-kit/Presentation/ui-components/PreviewFileMessage","importPath":"./src/Presentation/ui-components/PreviewFileMessage/PreviewFileMessage.stories.ts","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-settingsitem--docs":{"id":"quickblox-react-ui-kit-presentation-ui-components-settingsitem--docs","title":"@quickblox-react-ui-kit/Presentation/ui-components/SettingsItem","name":"Docs","importPath":"./src/Presentation/ui-components/SettingsItem/SettingsItem.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"quickblox-react-ui-kit-presentation-ui-components-settingsitem--settings-item-default":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-settingsitem--settings-item-default","name":"SettingsItem Default","title":"@quickblox-react-ui-kit/Presentation/ui-components/SettingsItem","importPath":"./src/Presentation/ui-components/SettingsItem/SettingsItem.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-settingsitem--settings-item-notification":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-settingsitem--settings-item-notification","name":"SettingsItem Notification","title":"@quickblox-react-ui-kit/Presentation/ui-components/SettingsItem","importPath":"./src/Presentation/ui-components/SettingsItem/SettingsItem.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-settingsitem--settings-item-members":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-settingsitem--settings-item-members","name":"SettingsItem Members","title":"@quickblox-react-ui-kit/Presentation/ui-components/SettingsItem","importPath":"./src/Presentation/ui-components/SettingsItem/SettingsItem.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-textfield--docs":{"id":"quickblox-react-ui-kit-presentation-ui-components-textfield--docs","title":"@quickblox-react-ui-kit/Presentation/ui-components/TextField","name":"Docs","importPath":"./src/Presentation/ui-components/TextField/TextField.stories.ts","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"quickblox-react-ui-kit-presentation-ui-components-textfield--text-field-default":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-textfield--text-field-default","name":"TextField Default","title":"@quickblox-react-ui-kit/Presentation/ui-components/TextField","importPath":"./src/Presentation/ui-components/TextField/TextField.stories.ts","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-textfield--text-field-disabled":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-textfield--text-field-disabled","name":"TextField Disabled","title":"@quickblox-react-ui-kit/Presentation/ui-components/TextField","importPath":"./src/Presentation/ui-components/TextField/TextField.stories.ts","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-textfield--text-field-reset":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-textfield--text-field-reset","name":"TextField Reset","title":"@quickblox-react-ui-kit/Presentation/ui-components/TextField","importPath":"./src/Presentation/ui-components/TextField/TextField.stories.ts","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-toast--docs":{"id":"quickblox-react-ui-kit-presentation-ui-components-toast--docs","title":"@quickblox-react-ui-kit/Presentation/ui-components/Toast","name":"Docs","importPath":"./src/Presentation/ui-components/Toast/Toast.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"quickblox-react-ui-kit-presentation-ui-components-toast--toast-default":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-toast--toast-default","name":"Toast Default","title":"@quickblox-react-ui-kit/Presentation/ui-components/Toast","importPath":"./src/Presentation/ui-components/Toast/Toast.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-userlistitem--docs":{"id":"quickblox-react-ui-kit-presentation-ui-components-userlistitem--docs","title":"@quickblox-react-ui-kit/Presentation/ui-components/UserListItem","name":"Docs","importPath":"./src/Presentation/ui-components/UserListItem/UserListItem.stories.tsx","type":"docs","tags":["autodocs","docs"],"storiesImports":[]},"quickblox-react-ui-kit-presentation-ui-components-userlistitem--user-list-item-default":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-userlistitem--user-list-item-default","name":"UserListItem Default","title":"@quickblox-react-ui-kit/Presentation/ui-components/UserListItem","importPath":"./src/Presentation/ui-components/UserListItem/UserListItem.stories.tsx","tags":["autodocs","story"]},"quickblox-react-ui-kit-presentation-ui-components-userlistitem--user-list":{"type":"story","id":"quickblox-react-ui-kit-presentation-ui-components-userlistitem--user-list","name":"UserListItem Multiple","title":"@quickblox-react-ui-kit/Presentation/ui-components/UserListItem","importPath":"./src/Presentation/ui-components/UserListItem/UserListItem.stories.tsx","tags":["autodocs","story"]}}}

package/storybook-static/main.597d432b.iframe.bundle.js

@@ -0,0 +1 @@
+(self.webpackChunkquickblox_react_ui_kit=self.webpackChunkquickblox_react_ui_kit||[]).push([[179],{"./node_modules/@storybook/addon-interactions/dist sync recursive":module=>{function webpackEmptyContext(req){var e=Error("Cannot find module '"+req+"'");throw e.code="MODULE_NOT_FOUND",e}webpackEmptyContext.keys=()=>[],webpackEmptyContext.resolve=webpackEmptyContext,webpackEmptyContext.id="./node_modules/@storybook/addon-interactions/dist sync recursive",module.exports=webpackEmptyContext},"./storybook-config-entry.js":(__unused_webpack_module,__unused_webpack___webpack_exports__,__webpack_require__)=>{"use strict";var external_STORYBOOK_MODULE_GLOBAL_=__webpack_require__("@storybook/global"),external_STORYBOOK_MODULE_PREVIEW_API_=__webpack_require__("@storybook/preview-api"),external_STORYBOOK_MODULE_CHANNELS_=__webpack_require__("@storybook/channels");let pipeline=x=>x(),importers=[async path=>{if(!/^\.[\\/](?:src(?:\/(?!\.)(?:(?:(?!(?:^|\/)\.).)*?)\/|\/|$)(?!\.)(?=.)[^/]*?\.mdx)$/.exec(path))return;let pathRemainder=path.substring(6);return __webpack_require__("./src lazy recursive ^\\.\\/.*$ include: (?:\\/src(?:\\/(?%21\\.)(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/%7C\\/%7C$)(?%21\\.)(?=.)[^/]*?\\.mdx)$")("./"+pathRemainder)},async path=>{if(!/^\.[\\/](?:src(?:\/(?!\.)(?:(?:(?!(?:^|\/)\.).)*?)\/|\/|$)(?!\.)(?=.)[^/]*?\.stories\.(js|jsx|mjs|ts|tsx))$/.exec(path))return;let pathRemainder=path.substring(6);return __webpack_require__("./src lazy recursive ^\\.\\/.*$ include: (?:\\/src(?:\\/(?%21\\.)(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/%7C\\/%7C$)(?%21\\.)(?=.)[^/]*?\\.stories\\.(js%7Cjsx%7Cmjs%7Cts%7Ctsx))$")("./"+pathRemainder)}];async function importFn(path){for(let i=0;i<importers.length;i++){let moduleExports=await pipeline(()=>importers[i](path));if(moduleExports)return moduleExports}}let channel=(0,external_STORYBOOK_MODULE_CHANNELS_.createBrowserChannel)({page:"preview"});external_STORYBOOK_MODULE_PREVIEW_API_.addons.setChannel(channel),"DEVELOPMENT"===external_STORYBOOK_MODULE_GLOBAL_.global.CONFIG_TYPE&&(window.__STORYBOOK_SERVER_CHANNEL__=channel);let preview=new external_STORYBOOK_MODULE_PREVIEW_API_.PreviewWeb;window.__STORYBOOK_PREVIEW__=preview,window.__STORYBOOK_STORY_STORE__=preview.storyStore,window.__STORYBOOK_ADDONS_CHANNEL__=channel,window.__STORYBOOK_CLIENT_API__=new external_STORYBOOK_MODULE_PREVIEW_API_.ClientApi({storyStore:preview.storyStore}),preview.initialize({importFn:importFn,getProjectAnnotations:()=>(0,external_STORYBOOK_MODULE_PREVIEW_API_.composeConfigs)([__webpack_require__("./node_modules/@storybook/react/dist/entry-preview.mjs"),__webpack_require__("./node_modules/@storybook/react/dist/entry-preview-docs.mjs"),__webpack_require__("./node_modules/@storybook/addon-links/dist/preview.js"),__webpack_require__("./node_modules/@storybook/addon-essentials/dist/docs/preview.js"),__webpack_require__("./node_modules/@storybook/addon-essentials/dist/actions/preview.js"),__webpack_require__("./node_modules/@storybook/addon-essentials/dist/backgrounds/preview.js"),__webpack_require__("./node_modules/@storybook/addon-essentials/dist/measure/preview.js"),__webpack_require__("./node_modules/@storybook/addon-essentials/dist/outline/preview.js"),__webpack_require__("./node_modules/@storybook/addon-essentials/dist/highlight/preview.js"),__webpack_require__("./node_modules/@storybook/addon-interactions/dist/preview.js"),__webpack_require__("./.storybook/preview.ts")])})},"./.storybook/preview.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{default:()=>_storybook_preview});let _storybook_preview={parameters:{actions:{argTypesRegex:"^on[A-Z].*"},controls:{matchers:{color:/(background|color)$/i,date:/Date$/i}}}}},"./src lazy recursive ^\\.\\/.*$ include: (?:\\/src(?:\\/(?%21\\.)(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/%7C\\/%7C$)(?%21\\.)(?=.)[^/]*?\\.mdx)$":(module,__unused_webpack_exports,__webpack_require__)=>{var map={"./docs/Introduction.mdx":["./src/docs/Introduction.mdx",768,715],"./docs/Styling.mdx":["./src/docs/Styling.mdx",768,229]};function webpackAsyncContext(req){if(!__webpack_require__.o(map,req))return Promise.resolve().then(()=>{var e=Error("Cannot find module '"+req+"'");throw e.code="MODULE_NOT_FOUND",e});var ids=map[req],id=ids[0];return Promise.all(ids.slice(1).map(__webpack_require__.e)).then(()=>__webpack_require__(id))}webpackAsyncContext.keys=()=>Object.keys(map),webpackAsyncContext.id="./src lazy recursive ^\\.\\/.*$ include: (?:\\/src(?:\\/(?%21\\.)(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/%7C\\/%7C$)(?%21\\.)(?=.)[^/]*?\\.mdx)$",module.exports=webpackAsyncContext},"./src lazy recursive ^\\.\\/.*$ include: (?:\\/src(?:\\/(?%21\\.)(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/%7C\\/%7C$)(?%21\\.)(?=.)[^/]*?\\.stories\\.(js%7Cjsx%7Cmjs%7Cts%7Ctsx))$":(module,__unused_webpack_exports,__webpack_require__)=>{var map={"./Presentation/ui-components/Avatar/avatar.stories":["./src/Presentation/ui-components/Avatar/avatar.stories.tsx",758,949],"./Presentation/ui-components/Avatar/avatar.stories.tsx":["./src/Presentation/ui-components/Avatar/avatar.stories.tsx",758,949],"./Presentation/ui-components/Badge/Badge.stories":["./src/Presentation/ui-components/Badge/Badge.stories.ts",181],"./Presentation/ui-components/Badge/Badge.stories.ts":["./src/Presentation/ui-components/Badge/Badge.stories.ts",181],"./Presentation/ui-components/Button/Button.stories":["./src/Presentation/ui-components/Button/Button.stories.ts",758,626],"./Presentation/ui-components/Button/Button.stories.ts":["./src/Presentation/ui-components/Button/Button.stories.ts",758,626],"./Presentation/ui-components/DialogBanner/DialogBanner.stories":["./src/Presentation/ui-components/DialogBanner/DialogBanner.stories.ts",944],"./Presentation/ui-components/DialogBanner/DialogBanner.stories.ts":["./src/Presentation/ui-components/DialogBanner/DialogBanner.stories.ts",944],"./Presentation/ui-components/DialogItemPreview/DialogItemPreview.stories":["./src/Presentation/ui-components/DialogItemPreview/DialogItemPreview.stories.tsx",758,794],"./Presentation/ui-components/DialogItemPreview/DialogItemPreview.stories.tsx":["./src/Presentation/ui-components/DialogItemPreview/DialogItemPreview.stories.tsx",758,794],"./Presentation/ui-components/DialogWindow/DialogWindow.stories":["./src/Presentation/ui-components/DialogWindow/DialogWindow.stories.tsx",758,665],"./Presentation/ui-components/DialogWindow/DialogWindow.stories.tsx":["./src/Presentation/ui-components/DialogWindow/DialogWindow.stories.tsx",758,665],"./Presentation/ui-components/Dropdown/Dropdown.stories":["./src/Presentation/ui-components/Dropdown/Dropdown.stories.tsx",758,148],"./Presentation/ui-components/Dropdown/Dropdown.stories.tsx":["./src/Presentation/ui-components/Dropdown/Dropdown.stories.tsx",758,148],"./Presentation/ui-components/Header/Header.stories":["./src/Presentation/ui-components/Header/Header.stories.tsx",758,752],"./Presentation/ui-components/Header/Header.stories.tsx":["./src/Presentation/ui-components/Header/Header.stories.tsx",758,752],"./Presentation/ui-components/Loader/Loader.stories":["./src/Presentation/ui-components/Loader/Loader.stories.ts",758,356],"./Presentation/ui-components/Loader/Loader.stories.ts":["./src/Presentation/ui-components/Loader/Loader.stories.ts",758,356],"./Presentation/ui-components/Message/Message.stories":["./src/Presentation/ui-components/Message/Message.stories.tsx",758,687],"./Presentation/ui-components/Message/Message.stories.tsx":["./src/Presentation/ui-components/Message/Message.stories.tsx",758,687],"./Presentation/ui-components/MessageInput/MessageInput.stories":["./src/Presentation/ui-components/MessageInput/MessageInput.stories.tsx",758,119],"./Presentation/ui-components/MessageInput/MessageInput.stories.tsx":["./src/Presentation/ui-components/MessageInput/MessageInput.stories.tsx",758,119],"./Presentation/ui-components/MessageSeparator/MessageSeparator.stories":["./src/Presentation/ui-components/MessageSeparator/MessageSeparator.stories.ts",658],"./Presentation/ui-components/MessageSeparator/MessageSeparator.stories.ts":["./src/Presentation/ui-components/MessageSeparator/MessageSeparator.stories.ts",658],"./Presentation/ui-components/Placeholder/Placeholder.stories":["./src/Presentation/ui-components/Placeholder/Placeholder.stories.tsx",758,874],"./Presentation/ui-components/Placeholder/Placeholder.stories.tsx":["./src/Presentation/ui-components/Placeholder/Placeholder.stories.tsx",758,874],"./Presentation/ui-components/PreviewFileMessage/PreviewFileMessage.stories":["./src/Presentation/ui-components/PreviewFileMessage/PreviewFileMessage.stories.ts",758,594],"./Presentation/ui-components/PreviewFileMessage/PreviewFileMessage.stories.ts":["./src/Presentation/ui-components/PreviewFileMessage/PreviewFileMessage.stories.ts",758,594],"./Presentation/ui-components/SettingsItem/SettingsItem.stories":["./src/Presentation/ui-components/SettingsItem/SettingsItem.stories.tsx",758,231],"./Presentation/ui-components/SettingsItem/SettingsItem.stories.tsx":["./src/Presentation/ui-components/SettingsItem/SettingsItem.stories.tsx",758,231],"./Presentation/ui-components/TextField/TextField.stories":["./src/Presentation/ui-components/TextField/TextField.stories.ts",758,909],"./Presentation/ui-components/TextField/TextField.stories.ts":["./src/Presentation/ui-components/TextField/TextField.stories.ts",758,909],"./Presentation/ui-components/Toast/Toast.stories":["./src/Presentation/ui-components/Toast/Toast.stories.tsx",758,267],"./Presentation/ui-components/Toast/Toast.stories.tsx":["./src/Presentation/ui-components/Toast/Toast.stories.tsx",758,267],"./Presentation/ui-components/UserListItem/UserListItem.stories":["./src/Presentation/ui-components/UserListItem/UserListItem.stories.tsx",758,968],"./Presentation/ui-components/UserListItem/UserListItem.stories.tsx":["./src/Presentation/ui-components/UserListItem/UserListItem.stories.tsx",758,968]};function webpackAsyncContext(req){if(!__webpack_require__.o(map,req))return Promise.resolve().then(()=>{var e=Error("Cannot find module '"+req+"'");throw e.code="MODULE_NOT_FOUND",e});var ids=map[req],id=ids[0];return Promise.all(ids.slice(1).map(__webpack_require__.e)).then(()=>__webpack_require__(id))}webpackAsyncContext.keys=()=>Object.keys(map),webpackAsyncContext.id="./src lazy recursive ^\\.\\/.*$ include: (?:\\/src(?:\\/(?%21\\.)(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/%7C\\/%7C$)(?%21\\.)(?=.)[^/]*?\\.stories\\.(js%7Cjsx%7Cmjs%7Cts%7Ctsx))$",module.exports=webpackAsyncContext},"@storybook/channels":module=>{"use strict";module.exports=__STORYBOOK_MODULE_CHANNELS__},"@storybook/client-logger":module=>{"use strict";module.exports=__STORYBOOK_MODULE_CLIENT_LOGGER__},"@storybook/core-events":module=>{"use strict";module.exports=__STORYBOOK_MODULE_CORE_EVENTS__},"@storybook/global":module=>{"use strict";module.exports=__STORYBOOK_MODULE_GLOBAL__},"@storybook/preview-api":module=>{"use strict";module.exports=__STORYBOOK_MODULE_PREVIEW_API__}},__webpack_require__=>{var __webpack_exec__=moduleId=>__webpack_require__(__webpack_require__.s=moduleId);__webpack_require__.O(0,[926],()=>__webpack_exec__("./storybook-config-entry.js")),__webpack_require__.O()}]);

package/storybook-static/project.json

@@ -1 +1 @@
-{"generatedAt":1710482593073,"hasCustomBabel":false,"hasCustomWebpack":false,"hasStaticDirs":true,"hasStorybookEslint":true,"refCount":0,"metaFramework":{"name":"CRA","packageName":"react-scripts","version":"5.0.1"},"packageManager":{"type":"npm","version":"10.2.4"},"preview":{"usesGlobals":false},"framework":{"name":"@storybook/react-webpack5","options":{"builder":{"useSWC":true}}},"builder":"@storybook/builder-webpack5","renderer":"@storybook/react","storybookVersion":"7.6.12","storybookVersionSpecifier":"^7.6.12","language":"typescript","storybookPackages":{"@storybook/blocks":{"version":"7.6.12"},"@storybook/react":{"version":"7.6.12"},"@storybook/react-webpack5":{"version":"7.6.12"},"@storybook/test":{"version":"7.6.12"},"eslint-plugin-storybook":{"version":"0.6.15"},"storybook":{"version":"7.6.12"}},"addons":{"@storybook/addon-links":{"version":"7.6.12"},"@storybook/addon-essentials":{"version":"7.6.12"},"@storybook/preset-create-react-app":{"version":"7.6.12"},"@storybook/addon-onboarding":{"version":"1.0.11"},"@storybook/addon-interactions":{"version":"7.6.12"},"@storybook/addon-viewport":{"version":"7.6.16"}}}
+{"generatedAt":1711001065132,"hasCustomBabel":false,"hasCustomWebpack":false,"hasStaticDirs":true,"hasStorybookEslint":true,"refCount":0,"metaFramework":{"name":"CRA","packageName":"react-scripts","version":"5.0.1"},"packageManager":{"type":"npm","version":"10.2.4"},"preview":{"usesGlobals":false},"framework":{"name":"@storybook/react-webpack5","options":{"builder":{"useSWC":true}}},"builder":"@storybook/builder-webpack5","renderer":"@storybook/react","storybookVersion":"7.6.12","storybookVersionSpecifier":"^7.6.12","language":"typescript","storybookPackages":{"@storybook/blocks":{"version":"7.6.12"},"@storybook/react":{"version":"7.6.12"},"@storybook/react-webpack5":{"version":"7.6.12"},"@storybook/test":{"version":"7.6.12"},"eslint-plugin-storybook":{"version":"0.6.15"},"storybook":{"version":"7.6.12"}},"addons":{"@storybook/addon-links":{"version":"7.6.12"},"@storybook/addon-essentials":{"version":"7.6.12"},"@storybook/preset-create-react-app":{"version":"7.6.12"},"@storybook/addon-onboarding":{"version":"1.0.11"},"@storybook/addon-interactions":{"version":"7.6.12"},"@storybook/addon-viewport":{"version":"7.6.16"}}}

package/storybook-static/runtime~main.e945879b.iframe.bundle.js

@@ -0,0 +1 @@
+(()=>{"use strict";var __webpack_modules__={},__webpack_module_cache__={};function __webpack_require__(moduleId){var cachedModule=__webpack_module_cache__[moduleId];if(void 0!==cachedModule)return cachedModule.exports;var module=__webpack_module_cache__[moduleId]={id:moduleId,loaded:!1,exports:{}};return __webpack_modules__[moduleId].call(module.exports,module,module.exports,__webpack_require__),module.loaded=!0,module.exports}__webpack_require__.m=__webpack_modules__,__webpack_require__.amdO={},(()=>{var deferred=[];__webpack_require__.O=(result,chunkIds,fn,priority)=>{if(chunkIds){priority=priority||0;for(var i=deferred.length;i>0&&deferred[i-1][2]>priority;i--)deferred[i]=deferred[i-1];deferred[i]=[chunkIds,fn,priority];return}for(var notFulfilled=1/0,i=0;i<deferred.length;i++){for(var chunkIds=deferred[i][0],fn=deferred[i][1],priority=deferred[i][2],fulfilled=!0,j=0;j<chunkIds.length;j++)notFulfilled>=priority&&Object.keys(__webpack_require__.O).every(key=>__webpack_require__.O[key](chunkIds[j]))?chunkIds.splice(j--,1):(fulfilled=!1,priority<notFulfilled&&(notFulfilled=priority));if(fulfilled){deferred.splice(i--,1);var r=fn();void 0!==r&&(result=r)}}return result}})(),__webpack_require__.n=module=>{var getter=module&&module.__esModule?()=>module.default:()=>module;return __webpack_require__.d(getter,{a:getter}),getter},(()=>{var leafPrototypes,getProto=Object.getPrototypeOf?obj=>Object.getPrototypeOf(obj):obj=>obj.__proto__;__webpack_require__.t=function(value,mode){if(1&mode&&(value=this(value)),8&mode||"object"==typeof value&&value&&(4&mode&&value.__esModule||16&mode&&"function"==typeof value.then))return value;var ns=Object.create(null);__webpack_require__.r(ns);var def={};leafPrototypes=leafPrototypes||[null,getProto({}),getProto([]),getProto(getProto)];for(var current=2&mode&&value;"object"==typeof current&&!~leafPrototypes.indexOf(current);current=getProto(current))Object.getOwnPropertyNames(current).forEach(key=>def[key]=()=>value[key]);return def.default=()=>value,__webpack_require__.d(ns,def),ns}})(),__webpack_require__.d=(exports,definition)=>{for(var key in definition)__webpack_require__.o(definition,key)&&!__webpack_require__.o(exports,key)&&Object.defineProperty(exports,key,{enumerable:!0,get:definition[key]})},__webpack_require__.f={},__webpack_require__.e=chunkId=>Promise.all(Object.keys(__webpack_require__.f).reduce((promises,key)=>(__webpack_require__.f[key](chunkId,promises),promises),[])),__webpack_require__.u=chunkId=>""+(({119:"Presentation-ui-components-MessageInput-MessageInput-stories",148:"Presentation-ui-components-Dropdown-Dropdown-stories",181:"Presentation-ui-components-Badge-Badge-stories",229:"docs-Styling-mdx",231:"Presentation-ui-components-SettingsItem-SettingsItem-stories",267:"Presentation-ui-components-Toast-Toast-stories",356:"Presentation-ui-components-Loader-Loader-stories",594:"Presentation-ui-components-PreviewFileMessage-PreviewFileMessage-stories",626:"Presentation-ui-components-Button-Button-stories",658:"Presentation-ui-components-MessageSeparator-MessageSeparator-stories",665:"Presentation-ui-components-DialogWindow-DialogWindow-stories",687:"Presentation-ui-components-Message-Message-stories",715:"docs-Introduction-mdx",752:"Presentation-ui-components-Header-Header-stories",794:"Presentation-ui-components-DialogItemPreview-DialogItemPreview-stories",874:"Presentation-ui-components-Placeholder-Placeholder-stories",909:"Presentation-ui-components-TextField-TextField-stories",944:"Presentation-ui-components-DialogBanner-DialogBanner-stories",949:"Presentation-ui-components-Avatar-avatar-stories",968:"Presentation-ui-components-UserListItem-UserListItem-stories"})[chunkId]||chunkId)+"."+({119:"262a0cf2",148:"aacf2ec2",181:"9449e470",229:"1d6c1212",231:"8f6fca84",267:"55e63162",356:"9bf3fb63",426:"be971fb5",433:"dffc897e",594:"1661d95b",603:"4cf0423b",607:"b04b9f0b",626:"4fac7996",658:"a7d43c0b",665:"3523a670",687:"343dfae0",715:"ac401482",729:"734b4ae4",752:"073c4507",758:"e75a5a47",768:"e44c05aa",794:"90aa44c5",797:"b3873e04",874:"871f508c",909:"4a2eef3e",944:"fa91d2c7",949:"cf806856",968:"04d3eefe"})[chunkId]+".iframe.bundle.js",__webpack_require__.miniCssF=chunkId=>"static/css/"+({119:"Presentation-ui-components-MessageInput-MessageInput-stories",148:"Presentation-ui-components-Dropdown-Dropdown-stories",181:"Presentation-ui-components-Badge-Badge-stories",231:"Presentation-ui-components-SettingsItem-SettingsItem-stories",267:"Presentation-ui-components-Toast-Toast-stories",356:"Presentation-ui-components-Loader-Loader-stories",594:"Presentation-ui-components-PreviewFileMessage-PreviewFileMessage-stories",626:"Presentation-ui-components-Button-Button-stories",658:"Presentation-ui-components-MessageSeparator-MessageSeparator-stories",665:"Presentation-ui-components-DialogWindow-DialogWindow-stories",687:"Presentation-ui-components-Message-Message-stories",752:"Presentation-ui-components-Header-Header-stories",794:"Presentation-ui-components-DialogItemPreview-DialogItemPreview-stories",874:"Presentation-ui-components-Placeholder-Placeholder-stories",909:"Presentation-ui-components-TextField-TextField-stories",944:"Presentation-ui-components-DialogBanner-DialogBanner-stories",949:"Presentation-ui-components-Avatar-avatar-stories",968:"Presentation-ui-components-UserListItem-UserListItem-stories"})[chunkId]+"."+({119:"0e99d80b",148:"66965d64",181:"7b8317f8",231:"7b98a5d4",267:"11d83296",356:"dab34da1",594:"015ac417",626:"1b6e1c55",658:"34aa36b2",665:"6fb3af8d",687:"0e129b10",752:"cdc47631",794:"e720ff21",874:"cb7fb80a",909:"412027f8",944:"bd07fad3",949:"807573c8",968:"4d072348"})[chunkId]+".chunk.css",__webpack_require__.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||Function("return this")()}catch(e){if("object"==typeof window)return window}}(),__webpack_require__.o=(obj,prop)=>Object.prototype.hasOwnProperty.call(obj,prop),(()=>{var inProgress={},dataWebpackPrefix="quickblox-react-ui-kit:";__webpack_require__.l=(url,done,key,chunkId)=>{if(inProgress[url]){inProgress[url].push(done);return}if(void 0!==key)for(var script,needAttach,scripts=document.getElementsByTagName("script"),i=0;i<scripts.length;i++){var s=scripts[i];if(s.getAttribute("src")==url||s.getAttribute("data-webpack")==dataWebpackPrefix+key){script=s;break}}script||(needAttach=!0,(script=document.createElement("script")).charset="utf-8",script.timeout=120,__webpack_require__.nc&&script.setAttribute("nonce",__webpack_require__.nc),script.setAttribute("data-webpack",dataWebpackPrefix+key),script.src=url),inProgress[url]=[done];var onScriptComplete=(prev,event)=>{script.onerror=script.onload=null,clearTimeout(timeout);var doneFns=inProgress[url];if(delete inProgress[url],script.parentNode&&script.parentNode.removeChild(script),doneFns&&doneFns.forEach(fn=>fn(event)),prev)return prev(event)},timeout=setTimeout(onScriptComplete.bind(null,void 0,{type:"timeout",target:script}),12e4);script.onerror=onScriptComplete.bind(null,script.onerror),script.onload=onScriptComplete.bind(null,script.onload),needAttach&&document.head.appendChild(script)}})(),__webpack_require__.r=exports=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(exports,"__esModule",{value:!0})},__webpack_require__.nmd=module=>(module.paths=[],module.children||(module.children=[]),module),__webpack_require__.p="",(()=>{if("undefined"!=typeof document){var createStylesheet=(chunkId,fullhref,oldTag,resolve,reject)=>{var linkTag=document.createElement("link");return linkTag.rel="stylesheet",linkTag.type="text/css",linkTag.onerror=linkTag.onload=event=>{if(linkTag.onerror=linkTag.onload=null,"load"===event.type)resolve();else{var errorType=event&&("load"===event.type?"missing":event.type),realHref=event&&event.target&&event.target.href||fullhref,err=Error("Loading CSS chunk "+chunkId+" failed.\n("+realHref+")");err.code="CSS_CHUNK_LOAD_FAILED",err.type=errorType,err.request=realHref,linkTag.parentNode.removeChild(linkTag),reject(err)}},linkTag.href=fullhref,oldTag?oldTag.parentNode.insertBefore(linkTag,oldTag.nextSibling):document.head.appendChild(linkTag),linkTag},findStylesheet=(href,fullhref)=>{for(var existingLinkTags=document.getElementsByTagName("link"),i=0;i<existingLinkTags.length;i++){var tag=existingLinkTags[i],dataHref=tag.getAttribute("data-href")||tag.getAttribute("href");if("stylesheet"===tag.rel&&(dataHref===href||dataHref===fullhref))return tag}for(var existingStyleTags=document.getElementsByTagName("style"),i=0;i<existingStyleTags.length;i++){var tag=existingStyleTags[i],dataHref=tag.getAttribute("data-href");if(dataHref===href||dataHref===fullhref)return tag}},loadStylesheet=chunkId=>new Promise((resolve,reject)=>{var href=__webpack_require__.miniCssF(chunkId),fullhref=__webpack_require__.p+href;if(findStylesheet(href,fullhref))return resolve();createStylesheet(chunkId,fullhref,null,resolve,reject)}),installedCssChunks={303:0};__webpack_require__.f.miniCss=(chunkId,promises)=>{installedCssChunks[chunkId]?promises.push(installedCssChunks[chunkId]):0!==installedCssChunks[chunkId]&&({119:1,148:1,181:1,231:1,267:1,356:1,594:1,626:1,658:1,665:1,687:1,752:1,794:1,874:1,909:1,944:1,949:1,968:1})[chunkId]&&promises.push(installedCssChunks[chunkId]=loadStylesheet(chunkId).then(()=>{installedCssChunks[chunkId]=0},e=>{throw delete installedCssChunks[chunkId],e}))}}})(),(()=>{var installedChunks={303:0};__webpack_require__.f.j=(chunkId,promises)=>{var installedChunkData=__webpack_require__.o(installedChunks,chunkId)?installedChunks[chunkId]:void 0;if(0!==installedChunkData){if(installedChunkData)promises.push(installedChunkData[2]);else if(303!=chunkId){var promise=new Promise((resolve,reject)=>installedChunkData=installedChunks[chunkId]=[resolve,reject]);promises.push(installedChunkData[2]=promise);var url=__webpack_require__.p+__webpack_require__.u(chunkId),error=Error();__webpack_require__.l(url,event=>{if(__webpack_require__.o(installedChunks,chunkId)&&(0!==(installedChunkData=installedChunks[chunkId])&&(installedChunks[chunkId]=void 0),installedChunkData)){var errorType=event&&("load"===event.type?"missing":event.type),realSrc=event&&event.target&&event.target.src;error.message="Loading chunk "+chunkId+" failed.\n("+errorType+": "+realSrc+")",error.name="ChunkLoadError",error.type=errorType,error.request=realSrc,installedChunkData[1](error)}},"chunk-"+chunkId,chunkId)}else installedChunks[chunkId]=0}},__webpack_require__.O.j=chunkId=>0===installedChunks[chunkId];var webpackJsonpCallback=(parentChunkLoadingFunction,data)=>{var moduleId,chunkId,chunkIds=data[0],moreModules=data[1],runtime=data[2],i=0;if(chunkIds.some(id=>0!==installedChunks[id])){for(moduleId in moreModules)__webpack_require__.o(moreModules,moduleId)&&(__webpack_require__.m[moduleId]=moreModules[moduleId]);if(runtime)var result=runtime(__webpack_require__)}for(parentChunkLoadingFunction&&parentChunkLoadingFunction(data);i<chunkIds.length;i++)chunkId=chunkIds[i],__webpack_require__.o(installedChunks,chunkId)&&installedChunks[chunkId]&&installedChunks[chunkId][0](),installedChunks[chunkId]=0;return __webpack_require__.O(result)},chunkLoadingGlobal=self.webpackChunkquickblox_react_ui_kit=self.webpackChunkquickblox_react_ui_kit||[];chunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null,0)),chunkLoadingGlobal.push=webpackJsonpCallback.bind(null,chunkLoadingGlobal.push.bind(chunkLoadingGlobal))})(),__webpack_require__.nc=void 0})();

package/storybook-static/static/css/{Presentation-ui-components-Message-Message-stories.a518b61a.chunk.css → Presentation-ui-components-Message-Message-stories.0e129b10.chunk.css}

@@ -8,7 +8,7 @@
 .file-bubble-background__incoming{background:#e4e6e8;background:var(--incoming-background, #e4e6e8);border-radius:22px 22px 22px 0px;padding:8px 12px 8px 12px;display:flex;flex-direction:row;gap:10px;align-items:flex-start;justify-content:flex-start;flex-shrink:0;position:relative}.file-bubble-background__outgoing{background:#E7EFFF;background:var(--outgoing-background, #E7EFFF);border-radius:22px 22px 0px 22px;padding:8px 12px 8px 12px;display:flex;flex-direction:row;gap:10px;align-items:flex-start;justify-content:flex-start;flex-shrink:0;position:relative}
 .file-attachment{display:flex;flex-direction:row;gap:8px;align-items:center;justify-content:flex-start;align-self:stretch;flex-shrink:0;position:relative}.file-attachment__placeholder{flex-shrink:0;width:32px;height:32px;position:static}.file-attachment__placeholder__bg{background:#636d78;background:var(--tertiary-elements, #636d78);border-radius:8px;width:32px;height:32px;position:absolute;left:0px;top:0px}.file-attachment__placeholder__bg__icon{border-radius:4px;padding:4px;display:flex;flex-direction:row;gap:0px;align-items:center;justify-content:center;width:24px;height:24px;position:absolute;left:4px;top:4px}.file-attachment__file-name{color:#636d78;color:var(--secondary-text, #636d78);text-align:left;font:var(--body-body-medium);position:relative}.message-icon-file{align-self:stretch;flex:1 1;height:auto;position:relative;overflow:visible;fill:#ffffff;fill:var(--color-media-icon, #ffffff)}
 .message-attachment-image-body{max-width:var(--max-width-image-message);max-height:160px;padding:0;border-radius:4px}.message-attachment-image{display:flex;justify-content:center;flex-flow:row;max-width:var(--max-width-image-message);max-height:160px;font:400 14px/20px "Roboto-Regular", sans-serif;font:var(--body-body-medium, 400 14px/20px "Roboto-Regular", sans-serif);color:#0b1b0f;color:var(--main-tex, #0b1b0f)}
-.audio-player{display:flex;gap:5px;flex-direction:row;align-items:center}.audio-body{padding:5px;border-radius:4px;display:none;width:var(--max-width-audio-message)}.audio-body__controls{display:flex;flex-flow:row;align-items:center;gap:5px;width:24px;height:24px}.audio-body__controls--color{fill:var(--main-elements)}.equalizer{display:flex;flex-direction:row;gap:2px;align-items:flex-end;justify-content:flex-start;position:relative}.equalizer__rectangle{background:#636d78;background:var(--main-elements, #636d78);flex-shrink:0;width:2px;position:relative}.audio-bubble-background__incoming{background:#e4e6e8;background:var(--incoming-background, #e4e6e8);border-radius:22px 22px 22px 0px;padding:8px 12px 8px 12px;display:flex;flex-direction:row;gap:10px;align-items:flex-start;justify-content:flex-start;flex-shrink:0;position:relative}.audio-bubble-background__outgoing{background:#E7EFFF;background:var(--outgoing-background, #E7EFFF);border-radius:22px 22px 0px 22px;padding:8px 12px 8px 12px;display:flex;flex-direction:row;gap:10px;align-items:flex-start;justify-content:flex-start;flex-shrink:0;position:relative}
-.message-attachment-video-body{max-height:130px;max-width:var(--max-width-audio-message);width:var(--max-width-audio-message);padding:0;border-radius:4px}.message-attachment-video{display:flex;justify-content:center;align-items:center;flex-flow:column;max-width:var(--max-width-audio-message);width:var(--max-width-audio-message);max-height:160px}
+.audio-player{display:flex;gap:5px;flex-direction:row;align-items:center}.audio-player__equalizer-time{display:flex;flex-direction:column;gap:2px}.audio-body{padding:5px;border-radius:4px;display:none;width:var(--max-width-audio-message)}.audio-body__controls{display:flex;flex-flow:row;align-items:center;gap:5px;width:24px;height:24px}.audio-body__controls--color{fill:var(--main-elements)}.equalizer{display:flex;flex-direction:row;gap:2px;align-items:flex-end;justify-content:flex-start;position:relative}.equalizer__rectangle{background:#636d78;background:var(--main-elements, #636d78);flex-shrink:0;width:2px;position:relative}.time-play{color:#636d78;color:var(--secondary-text, #636d78);text-align:left;font:var(--label-label-small);height:16px}.audio-bubble-background__incoming{background:#e4e6e8;background:var(--incoming-background, #e4e6e8);border-radius:22px 22px 22px 0px;padding:8px 12px 8px 12px;display:flex;flex-direction:row;gap:10px;align-items:flex-start;justify-content:flex-start;flex-shrink:0;position:relative}.audio-bubble-background__outgoing{background:#E7EFFF;background:var(--outgoing-background, #E7EFFF);border-radius:22px 22px 0px 22px;padding:8px 12px 8px 12px;display:flex;flex-direction:row;gap:10px;align-items:flex-start;justify-content:flex-start;flex-shrink:0;position:relative}
+.message-attachment-video-body{max-height:130px;max-width:var(--max-width-audio-message);width:var(--max-width-audio-message);padding:0;border-radius:4px}.message-attachment-video-body__link{color:#636d78;color:var(--secondary-text, #636d78);text-align:left;font:var(--label-label-small);height:16px}.message-attachment-video{display:flex;justify-content:center;align-items:center;flex-flow:column;max-width:var(--max-width-audio-message);width:var(--max-width-audio-message);max-height:160px}
 
-/*# sourceMappingURL=Presentation-ui-components-Message-Message-stories.a518b61a.chunk.css.map*/
+/*# sourceMappingURL=Presentation-ui-components-Message-Message-stories.0e129b10.chunk.css.map*/

package/storybook-static/static/css/{Presentation-ui-components-Message-Message-stories.a518b61a.chunk.css.map → Presentation-ui-components-Message-Message-stories.0e129b10.chunk.css.map}

@@ -1 +1 @@
-{"version":3,"file":"static/css/Presentation-ui-components-Message-Message-stories.a518b61a.chunk.css","mappings":"AAEA;AEFA;ACEA;ACFA;ACAA;ACAA;ACAA;ACEA;ACFA;ACAA;ACAA;ACAA","sources":["webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Avatar/Avatar.scss","webpack://quickblox-react-ui-kit/./src/Presentation/themes/styles/_mixins.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/CheckBox/CheckBox.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Message/MessageCaption/MessageCaption.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Message/TimeAndStatus/TimeAndStatus.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Message/Message.scss","webpack://quickblox-react-ui-kit/./src/Presentation/Views/Dialog/Message/HighLightLink/HighLightLink.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Message/Bubble/TextBubble/TextBubble.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Message/Bubble/FileBubble/FileBubble.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Message/FileUrl/FileUrl.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Message/Bubble/ImageBubble/ImageBubble.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Message/Bubble/AudioBubble/AudioBubble.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Message/Bubble/VideoBubble/VideoBubble.scss"],"sourcesContent":["@import '../../themes/styles/mixins';\n\n.avatar {\n  @include applyBorderBox;\n  display: flex;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: center;\n\n  overflow: hidden;\n  border-radius: 50%;\n  background-color: var(--disabled-elements);\n  color: var(--secondary-text);\n\n  svg {\n    fill: var(--secondary-text);\n    padding: 10px;\n  }\n\n  &__image {\n    object-fit: cover;\n    width: 100%;\n    height: 100%;\n  }\n\n  &--xs {\n    width: 32px;\n    height: 32px;\n  }\n\n  &--sm {\n    width: 36px;\n    height: 36px;\n  }\n\n  &--md {\n    width: 40px;\n    height: 40px;\n  }\n\n  &--lg {\n    width: 56px;\n    height: 56px;\n  }\n\n  &--xl {\n    width: 64px;\n    height: 64px;\n  }\n\n  &--xxl {\n    width: 80px;\n    height: 80px;\n  }\n}\n","@mixin applyBorderBox {\n  &,\n  * {\n    box-sizing: border-box;\n  }\n}\n",".checkbox {\n  display: flex;\n  align-items: center;\n  flex-shrink: 0;\n  border-radius: 4px;\n  padding: 4px;\n  justify-content: center;\n  width: 18px;\n  height: 18px;\n}\n",".message-caption {\n\n  &__user {\n    padding: 0px 16px 0px 16px;\n    display: flex;\n    flex-direction: row;\n    gap: 8px;\n    align-items: flex-start;\n    justify-content: flex-start;\n    flex-shrink: 0;\n    position: relative;\n\n    &__caption {\n      display: flex;\n      flex-direction: row;\n      gap: 2px;\n      align-items: center;\n      justify-content: flex-start;\n      flex-shrink: 0;\n      position: relative;\n\n      &__name {\n        color: var(--secondary-text, #636d78);\n        text-align: left;\n        font: var(--label-label-medium);\n        position: relative;\n      }\n    }\n  }\n\n  &__forward-reply {\n    display: flex;\n    flex-direction: row;\n    gap: 2px;\n    align-items: center;\n    justify-content: flex-start;\n    flex-shrink: 0;\n    position: relative;\n\n    &--reply {\n      width: 16px;\n      height: 16px;\n      align-self: stretch;\n      flex: 1;\n      position: relative;\n      overflow: visible;\n      fill: var(--tertiary-elements, #636d78);\n    }\n\n    &--forward {\n      width: 16px;\n      height: 16px;\n      align-self: stretch;\n      flex: 1;\n      position: relative;\n      overflow: visible;\n      fill: var(--tertiary-elements, #636d78);\n    }\n\n    &__icon {\n      border-radius: 4px;\n      display: flex;\n      flex-direction: row;\n      gap: 0px;\n      align-items: center;\n      justify-content: center;\n      flex-shrink: 0;\n      width: 16px;\n      height: 16px;\n      position: relative;\n\n      &--filled {\n        align-self: stretch;\n        flex: 1;\n        height: auto;\n        position: relative;\n        overflow: visible;\n        fill: var(--tertiary-elements, #636d78);\n      }\n    }\n\n    &__from {\n      color: var(--tertiary-elements, #636d78);\n      text-align: left;\n      font: var(--label-label-medium);\n      position: relative;\n    }\n  }\n\n}\n",".time-status {\n  background: var(--main-background, #ffffff);\n  padding: 0px 8px 8px 16px;\n  display: flex;\n  flex-direction: row;\n  gap: 8px;\n  align-items: flex-end;\n  justify-content: flex-end;\n  align-self: stretch;\n  flex-shrink: 0;\n  width: 320px;\n  position: relative;\n\n  &__caption {\n    display: flex;\n    gap: 2px;\n    align-items: flex-end;\n    flex-shrink: 0;\n\n    &__status {\n      width: 13px;\n      height: 13px;\n    }\n  }\n  &__time {\n    color: var(--tertiary-elements, #636d78);\n    text-align: left;\n    font: var(--label-label-small);\n    position: relative;\n    // padding-bottom: 10px;\n  }\n}\n\n.status-message {\n  &--sent {\n    fill: var(--tertiary-elements, #636D78);\n  }\n\n  &--delivered {\n    fill: var(--tertiary-elements, #636D78);\n  }\n\n  &--viewed {\n    fill: var(--main-elements, #3978fc);\n  }\n\n  &--error {\n    fill: var(--error, #FF3B30);\n  }\n}\n\n",".message-item {\n  display: flex;\n  flex-direction: row;\n  gap: 0px;\n  align-items: center;\n  justify-content: flex-start;\n  align-self: stretch;\n  flex-shrink: 0;\n  position: relative;\n\n  &__right {\n    display: flex;\n    flex-direction: row;\n    align-items: flex-end;\n    justify-content: flex-end;\n    width: 100%;\n  }\n\n  &__more {\n    display: flex;\n    flex-direction: row;\n    gap: 10px;\n    align-items: center;\n    justify-content: center;\n    align-self: stretch;\n    flex-shrink: 0;\n    position: relative;\n    cursor: pointer;\n\n    &__icon {\n      border-radius: 4px;\n      display: flex;\n      flex-direction: row;\n      gap: 0px;\n      align-items: center;\n      justify-content: center;\n      flex-shrink: 0;\n      width: 24px;\n      height: 24px;\n      position: relative;\n      //padding-bottom: 10px;\n\n      &__actions {\n        fill: var(--tertiary-elements, #636D78);\n        path: var(--tertiary-elements, #636D78);\n      }\n    }\n  }\n\n  &__outgoing {\n    background: var(--main-background, #ffffff);\n    padding: 0px 8px 8px 16px;\n    display: flex;\n    flex-direction: row;\n    gap: 8px;\n    justify-content: flex-end;\n    align-self: stretch;\n    flex-shrink: 0;\n    width: 320px;\n    position: relative;\n\n    &__chat {\n      display: flex;\n      flex-direction: column;\n      gap: 2px;\n      align-items: flex-start;\n      justify-content: flex-start;\n      flex-shrink: 0;\n      position: relative;\n\n      &__bubble-background {\n        background: var(--outgoing-background, #E7EFFF);\n        border-radius: 22px 22px 0px 22px;\n        padding: 8px 12px 8px 12px;\n        display: flex;\n        flex-direction: row;\n        gap: 10px;\n        align-items: flex-start;\n        justify-content: flex-start;\n        flex-shrink: 0;\n        position: relative;\n      }\n    }\n  }\n\n  &__incoming-mes {\n    background: var(--secondary-background, #ffffff);\n    padding: 0px 16px 8px 8px;\n    display: flex;\n    flex-direction: row;\n    gap: 8px;\n    align-items: flex-end;\n    justify-content: flex-start;\n    align-self: stretch;\n    flex-shrink: 0;\n    width: 320px;\n    position: relative;\n  }\n\n  &__incoming {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n    align-items: flex-start;\n    justify-content: flex-end;\n\n    &__chat {\n      display: flex;\n      flex-direction: row;\n      gap: 8px;\n\n      &__bubble {\n        display: flex;\n        flex-direction: column;\n        gap: 4px;\n        align-items: flex-end;\n        justify-content: flex-end;\n        flex-shrink: 0;\n        position: relative;\n\n        &__background {\n          background: var(--incoming-background, #e4e6e8);\n          border-radius: 22px 22px 22px 0px;\n          padding: 8px 12px 8px 12px;\n          display: flex;\n          flex-direction: row;\n          gap: 10px;\n          align-items: flex-start;\n          justify-content: flex-start;\n          flex-shrink: 0;\n          position: relative;\n        }\n      }\n    }\n  }\n}\n",".high-light-link-container {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  padding: 0px;\n\n  width: 240px;\n  height: 70px;\n\n  background: #E4E6E8;\n  border-radius: 8px;\n\n  flex: none;\n  order: 0;\n  flex-grow: 0;\n\n  &--header-wrapper{\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    padding: 6px 16px;\n\n    width: 240px;\n    height: 32px;\n\n    flex: none;\n    order: 0;\n    align-self: stretch;\n    flex-grow: 0;\n\n    &__link_url{\n      width: 208px;\n      height: 20px;\n\n      text-decoration: none;\n      cursor: pointer;\n\n      font-family: 'Roboto';\n      font-style: normal;\n      font-weight: 400;\n      font-size: 14px;\n      line-height: 20px;\n\n      display: flex;\n      align-items: center;\n      letter-spacing: 0.25px;\n\n      color: #636D78;\n\n      flex: none;\n      order: 0;\n      flex-grow: 1;\n    }\n  }\n\n  &--footer-wrapper{\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    padding: 8px 16px;\n\n    width: 240px;\n    height: 32px;\n\n    flex: none;\n    order: 4;\n    align-self: stretch;\n    flex-grow: 0;\n\n    &__content{\n      width: 208px;\n      height: 16px;\n\n      font-family: 'Roboto';\n      font-style: normal;\n      font-weight: 500;\n      font-size: 11px;\n      line-height: 16px;\n\n      display: flex;\n      align-items: center;\n      letter-spacing: 0.5px;\n\n      color: #636D78;\n\n      flex: none;\n      order: 0;\n      flex-grow: 1;\n    }\n  }\n}\n\n.message-urls {\n  max-width: calc(var(--max-width-message-bubble) - 20px);\n  overflow-wrap: break-word;\n}\n\n",".bubble-content-text {\n  overflow-wrap: break-word;\n  max-width: calc(var(--max-width-message-bubble) - 20px);\n\n  color: var(--main-tex, #0b1b0f);\n  text-align: left;\n  font: var(--body-body-medium, 400 14px/20px \"Roboto-Regular\", sans-serif);\n}\n\n.text-bubble-background {\n\n  &__incoming {\n    background: var(--incoming-background, #e4e6e8);\n    border-radius: 22px 22px 22px 0px;\n    padding: 8px 12px 8px 12px;\n    display: flex;\n    flex-direction: row;\n    gap: 10px;\n    align-items: flex-start;\n    justify-content: flex-start;\n    flex-shrink: 0;\n    position: relative;\n    width: 100%;\n  }\n\n  &__outgoing {\n    background: var(--outgoing-background, #E7EFFF);\n    border-radius: 22px 22px 0px 22px;\n    padding: 8px 12px 8px 12px;\n    display: flex;\n    flex-direction: row;\n    gap: 10px;\n    align-items: flex-start;\n    justify-content: flex-start;\n    flex-shrink: 0;\n    position: relative;\n  }\n\n}\n\n",".file-bubble-background {\n\n  &__incoming {\n    background: var(--incoming-background, #e4e6e8);\n    border-radius: 22px 22px 22px 0px;\n    padding: 8px 12px 8px 12px;\n    display: flex;\n    flex-direction: row;\n    gap: 10px;\n    align-items: flex-start;\n    justify-content: flex-start;\n    flex-shrink: 0;\n    position: relative;\n  }\n\n  &__outgoing {\n    background: var(--outgoing-background, #E7EFFF);\n    border-radius: 22px 22px 0px 22px;\n    padding: 8px 12px 8px 12px;\n    display: flex;\n    flex-direction: row;\n    gap: 10px;\n    align-items: flex-start;\n    justify-content: flex-start;\n    flex-shrink: 0;\n    position: relative;\n  }\n\n}\n",".file-attachment {\n  display: flex;\n  flex-direction: row;\n  gap: 8px;\n  align-items: center;\n  justify-content: flex-start;\n  align-self: stretch;\n  flex-shrink: 0;\n  position: relative;\n\n  &__placeholder {\n    flex-shrink: 0;\n    width: 32px;\n    height: 32px;\n    position: static;\n\n    &__bg {\n      background: var(--tertiary-elements, #636d78);\n      border-radius: 8px;\n      width: 32px;\n      height: 32px;\n      position: absolute;\n      left: 0px;\n      top: 0px;\n\n      &__icon {\n        border-radius: 4px;\n        padding: 4px;\n        display: flex;\n        flex-direction: row;\n        gap: 0px;\n        align-items: center;\n        justify-content: center;\n        width: 24px;\n        height: 24px;\n        position: absolute;\n        left: 4px;\n        top: 4px;\n      }\n    }\n  }\n\n  &__file-name {\n    color: var(--secondary-text, #636d78);\n    text-align: left;\n    font: var(--body-body-medium);\n    position: relative;\n  }\n}\n\n.message-icon-file {\n  align-self: stretch;\n  flex: 1;\n  height: auto;\n  position: relative;\n  overflow: visible;\n  fill: var(--color-media-icon, #ffffff);\n}\n",".message-attachment-image-body{\n  max-width: var(--max-width-image-message);\n  max-height: 160px;\n  padding: 0;\n  border-radius: 4px;\n}\n\n.message-attachment-image {\n  display: flex;\n  justify-content: center;\n  flex-flow: row;\n  max-width: var(--max-width-image-message);\n  max-height: 160px;\n  font: var(--body-body-medium, 400 14px / 20px \"Roboto-Regular\", sans-serif);\n  color: var(--main-tex, #0b1b0f);\n}\n",".audio-player {\n  display: flex;\n  gap: 5px;\n  flex-direction: row;\n  align-items: center;\n}\n.audio-body{\n  padding: 5px;\n  border-radius: 4px;\n  display: none;\n  width: var(--max-width-audio-message);\n\n  &__controls {\n    display: flex;\n    flex-flow: row;\n    align-items: center;\n    gap: 5px;\n    width: 24px;\n    height: 24px;\n\n    &--color{\n      fill: var(--main-elements)\n    }\n  }\n}\n\n.equalizer {\n  display: flex;\n  flex-direction: row;\n  gap: 2px;\n  align-items: flex-end;\n  justify-content: flex-start;\n  position: relative;\n\n  &__rectangle {\n    background: var(--main-elements, #636d78);\n    flex-shrink: 0;\n    width: 2px;\n    position: relative;\n  }\n}\n\n.audio-bubble-background {\n\n  &__incoming {\n    background: var(--incoming-background, #e4e6e8);\n    border-radius: 22px 22px 22px 0px;\n    padding: 8px 12px 8px 12px;\n    display: flex;\n    flex-direction: row;\n    gap: 10px;\n    align-items: flex-start;\n    justify-content: flex-start;\n    flex-shrink: 0;\n    position: relative;\n  }\n\n  &__outgoing {\n    background: var(--outgoing-background, #E7EFFF);\n    border-radius: 22px 22px 0px 22px;\n    padding: 8px 12px 8px 12px;\n    display: flex;\n    flex-direction: row;\n    gap: 10px;\n    align-items: flex-start;\n    justify-content: flex-start;\n    flex-shrink: 0;\n    position: relative;\n  }\n\n}\n",".message-attachment-video-body{\n  max-height: 130px;\n  max-width: var(--max-width-audio-message);\n  width: var(--max-width-audio-message);\n  padding: 0;\n  border-radius: 4px;\n}\n\n.message-attachment-video {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-flow: column;\n  //max-width: 300px;\n  max-width: var(--max-width-audio-message);\n  width: var(--max-width-audio-message);\n  max-height: 160px;\n}\n"],"names":[],"sourceRoot":""}
+{"version":3,"file":"static/css/Presentation-ui-components-Message-Message-stories.0e129b10.chunk.css","mappings":"AAEA;AEFA;ACEA;ACFA;ACAA;ACAA;ACAA;ACEA;ACFA;ACAA;ACAA;ACAA","sources":["webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Avatar/Avatar.scss","webpack://quickblox-react-ui-kit/./src/Presentation/themes/styles/_mixins.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/CheckBox/CheckBox.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Message/MessageCaption/MessageCaption.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Message/TimeAndStatus/TimeAndStatus.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Message/Message.scss","webpack://quickblox-react-ui-kit/./src/Presentation/Views/Dialog/Message/HighLightLink/HighLightLink.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Message/Bubble/TextBubble/TextBubble.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Message/Bubble/FileBubble/FileBubble.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Message/FileUrl/FileUrl.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Message/Bubble/ImageBubble/ImageBubble.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Message/Bubble/AudioBubble/AudioBubble.scss","webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Message/Bubble/VideoBubble/VideoBubble.scss"],"sourcesContent":["@import '../../themes/styles/mixins';\n\n.avatar {\n  @include applyBorderBox;\n  display: flex;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: center;\n\n  overflow: hidden;\n  border-radius: 50%;\n  background-color: var(--disabled-elements);\n  color: var(--secondary-text);\n\n  svg {\n    fill: var(--secondary-text);\n    padding: 10px;\n  }\n\n  &__image {\n    object-fit: cover;\n    width: 100%;\n    height: 100%;\n  }\n\n  &--xs {\n    width: 32px;\n    height: 32px;\n  }\n\n  &--sm {\n    width: 36px;\n    height: 36px;\n  }\n\n  &--md {\n    width: 40px;\n    height: 40px;\n  }\n\n  &--lg {\n    width: 56px;\n    height: 56px;\n  }\n\n  &--xl {\n    width: 64px;\n    height: 64px;\n  }\n\n  &--xxl {\n    width: 80px;\n    height: 80px;\n  }\n}\n","@mixin applyBorderBox {\n  &,\n  * {\n    box-sizing: border-box;\n  }\n}\n",".checkbox {\n  display: flex;\n  align-items: center;\n  flex-shrink: 0;\n  border-radius: 4px;\n  padding: 4px;\n  justify-content: center;\n  width: 18px;\n  height: 18px;\n}\n",".message-caption {\n\n  &__user {\n    padding: 0px 16px 0px 16px;\n    display: flex;\n    flex-direction: row;\n    gap: 8px;\n    align-items: flex-start;\n    justify-content: flex-start;\n    flex-shrink: 0;\n    position: relative;\n\n    &__caption {\n      display: flex;\n      flex-direction: row;\n      gap: 2px;\n      align-items: center;\n      justify-content: flex-start;\n      flex-shrink: 0;\n      position: relative;\n\n      &__name {\n        color: var(--secondary-text, #636d78);\n        text-align: left;\n        font: var(--label-label-medium);\n        position: relative;\n      }\n    }\n  }\n\n  &__forward-reply {\n    display: flex;\n    flex-direction: row;\n    gap: 2px;\n    align-items: center;\n    justify-content: flex-start;\n    flex-shrink: 0;\n    position: relative;\n\n    &--reply {\n      width: 16px;\n      height: 16px;\n      align-self: stretch;\n      flex: 1;\n      position: relative;\n      overflow: visible;\n      fill: var(--tertiary-elements, #636d78);\n    }\n\n    &--forward {\n      width: 16px;\n      height: 16px;\n      align-self: stretch;\n      flex: 1;\n      position: relative;\n      overflow: visible;\n      fill: var(--tertiary-elements, #636d78);\n    }\n\n    &__icon {\n      border-radius: 4px;\n      display: flex;\n      flex-direction: row;\n      gap: 0px;\n      align-items: center;\n      justify-content: center;\n      flex-shrink: 0;\n      width: 16px;\n      height: 16px;\n      position: relative;\n\n      &--filled {\n        align-self: stretch;\n        flex: 1;\n        height: auto;\n        position: relative;\n        overflow: visible;\n        fill: var(--tertiary-elements, #636d78);\n      }\n    }\n\n    &__from {\n      color: var(--tertiary-elements, #636d78);\n      text-align: left;\n      font: var(--label-label-medium);\n      position: relative;\n    }\n  }\n\n}\n",".time-status {\n  background: var(--main-background, #ffffff);\n  padding: 0px 8px 8px 16px;\n  display: flex;\n  flex-direction: row;\n  gap: 8px;\n  align-items: flex-end;\n  justify-content: flex-end;\n  align-self: stretch;\n  flex-shrink: 0;\n  width: 320px;\n  position: relative;\n\n  &__caption {\n    display: flex;\n    gap: 2px;\n    align-items: flex-end;\n    flex-shrink: 0;\n\n    &__status {\n      width: 13px;\n      height: 13px;\n    }\n  }\n  &__time {\n    color: var(--tertiary-elements, #636d78);\n    text-align: left;\n    font: var(--label-label-small);\n    position: relative;\n    // padding-bottom: 10px;\n  }\n}\n\n.status-message {\n  &--sent {\n    fill: var(--tertiary-elements, #636D78);\n  }\n\n  &--delivered {\n    fill: var(--tertiary-elements, #636D78);\n  }\n\n  &--viewed {\n    fill: var(--main-elements, #3978fc);\n  }\n\n  &--error {\n    fill: var(--error, #FF3B30);\n  }\n}\n\n",".message-item {\n  display: flex;\n  flex-direction: row;\n  gap: 0px;\n  align-items: center;\n  justify-content: flex-start;\n  align-self: stretch;\n  flex-shrink: 0;\n  position: relative;\n\n  &__right {\n    display: flex;\n    flex-direction: row;\n    align-items: flex-end;\n    justify-content: flex-end;\n    width: 100%;\n  }\n\n  &__more {\n    display: flex;\n    flex-direction: row;\n    gap: 10px;\n    align-items: center;\n    justify-content: center;\n    align-self: stretch;\n    flex-shrink: 0;\n    position: relative;\n    cursor: pointer;\n\n    &__icon {\n      border-radius: 4px;\n      display: flex;\n      flex-direction: row;\n      gap: 0px;\n      align-items: center;\n      justify-content: center;\n      flex-shrink: 0;\n      width: 24px;\n      height: 24px;\n      position: relative;\n      //padding-bottom: 10px;\n\n      &__actions {\n        fill: var(--tertiary-elements, #636D78);\n        path: var(--tertiary-elements, #636D78);\n      }\n    }\n  }\n\n  &__outgoing {\n    background: var(--main-background, #ffffff);\n    padding: 0px 8px 8px 16px;\n    display: flex;\n    flex-direction: row;\n    gap: 8px;\n    justify-content: flex-end;\n    align-self: stretch;\n    flex-shrink: 0;\n    width: 320px;\n    position: relative;\n\n    &__chat {\n      display: flex;\n      flex-direction: column;\n      gap: 2px;\n      align-items: flex-start;\n      justify-content: flex-start;\n      flex-shrink: 0;\n      position: relative;\n\n      &__bubble-background {\n        background: var(--outgoing-background, #E7EFFF);\n        border-radius: 22px 22px 0px 22px;\n        padding: 8px 12px 8px 12px;\n        display: flex;\n        flex-direction: row;\n        gap: 10px;\n        align-items: flex-start;\n        justify-content: flex-start;\n        flex-shrink: 0;\n        position: relative;\n      }\n    }\n  }\n\n  &__incoming-mes {\n    background: var(--secondary-background, #ffffff);\n    padding: 0px 16px 8px 8px;\n    display: flex;\n    flex-direction: row;\n    gap: 8px;\n    align-items: flex-end;\n    justify-content: flex-start;\n    align-self: stretch;\n    flex-shrink: 0;\n    width: 320px;\n    position: relative;\n  }\n\n  &__incoming {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n    align-items: flex-start;\n    justify-content: flex-end;\n\n    &__chat {\n      display: flex;\n      flex-direction: row;\n      gap: 8px;\n\n      &__bubble {\n        display: flex;\n        flex-direction: column;\n        gap: 4px;\n        align-items: flex-end;\n        justify-content: flex-end;\n        flex-shrink: 0;\n        position: relative;\n\n        &__background {\n          background: var(--incoming-background, #e4e6e8);\n          border-radius: 22px 22px 22px 0px;\n          padding: 8px 12px 8px 12px;\n          display: flex;\n          flex-direction: row;\n          gap: 10px;\n          align-items: flex-start;\n          justify-content: flex-start;\n          flex-shrink: 0;\n          position: relative;\n        }\n      }\n    }\n  }\n}\n",".high-light-link-container {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  padding: 0px;\n\n  width: 240px;\n  height: 70px;\n\n  background: #E4E6E8;\n  border-radius: 8px;\n\n  flex: none;\n  order: 0;\n  flex-grow: 0;\n\n  &--header-wrapper{\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    padding: 6px 16px;\n\n    width: 240px;\n    height: 32px;\n\n    flex: none;\n    order: 0;\n    align-self: stretch;\n    flex-grow: 0;\n\n    &__link_url{\n      width: 208px;\n      height: 20px;\n\n      text-decoration: none;\n      cursor: pointer;\n\n      font-family: 'Roboto';\n      font-style: normal;\n      font-weight: 400;\n      font-size: 14px;\n      line-height: 20px;\n\n      display: flex;\n      align-items: center;\n      letter-spacing: 0.25px;\n\n      color: #636D78;\n\n      flex: none;\n      order: 0;\n      flex-grow: 1;\n    }\n  }\n\n  &--footer-wrapper{\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    padding: 8px 16px;\n\n    width: 240px;\n    height: 32px;\n\n    flex: none;\n    order: 4;\n    align-self: stretch;\n    flex-grow: 0;\n\n    &__content{\n      width: 208px;\n      height: 16px;\n\n      font-family: 'Roboto';\n      font-style: normal;\n      font-weight: 500;\n      font-size: 11px;\n      line-height: 16px;\n\n      display: flex;\n      align-items: center;\n      letter-spacing: 0.5px;\n\n      color: #636D78;\n\n      flex: none;\n      order: 0;\n      flex-grow: 1;\n    }\n  }\n}\n\n.message-urls {\n  max-width: calc(var(--max-width-message-bubble) - 20px);\n  overflow-wrap: break-word;\n}\n\n",".bubble-content-text {\n  overflow-wrap: break-word;\n  max-width: calc(var(--max-width-message-bubble) - 20px);\n\n  color: var(--main-tex, #0b1b0f);\n  text-align: left;\n  font: var(--body-body-medium, 400 14px/20px \"Roboto-Regular\", sans-serif);\n}\n\n.text-bubble-background {\n\n  &__incoming {\n    background: var(--incoming-background, #e4e6e8);\n    border-radius: 22px 22px 22px 0px;\n    padding: 8px 12px 8px 12px;\n    display: flex;\n    flex-direction: row;\n    gap: 10px;\n    align-items: flex-start;\n    justify-content: flex-start;\n    flex-shrink: 0;\n    position: relative;\n    width: 100%;\n  }\n\n  &__outgoing {\n    background: var(--outgoing-background, #E7EFFF);\n    border-radius: 22px 22px 0px 22px;\n    padding: 8px 12px 8px 12px;\n    display: flex;\n    flex-direction: row;\n    gap: 10px;\n    align-items: flex-start;\n    justify-content: flex-start;\n    flex-shrink: 0;\n    position: relative;\n  }\n\n}\n\n",".file-bubble-background {\n\n  &__incoming {\n    background: var(--incoming-background, #e4e6e8);\n    border-radius: 22px 22px 22px 0px;\n    padding: 8px 12px 8px 12px;\n    display: flex;\n    flex-direction: row;\n    gap: 10px;\n    align-items: flex-start;\n    justify-content: flex-start;\n    flex-shrink: 0;\n    position: relative;\n  }\n\n  &__outgoing {\n    background: var(--outgoing-background, #E7EFFF);\n    border-radius: 22px 22px 0px 22px;\n    padding: 8px 12px 8px 12px;\n    display: flex;\n    flex-direction: row;\n    gap: 10px;\n    align-items: flex-start;\n    justify-content: flex-start;\n    flex-shrink: 0;\n    position: relative;\n  }\n\n}\n",".file-attachment {\n  display: flex;\n  flex-direction: row;\n  gap: 8px;\n  align-items: center;\n  justify-content: flex-start;\n  align-self: stretch;\n  flex-shrink: 0;\n  position: relative;\n\n  &__placeholder {\n    flex-shrink: 0;\n    width: 32px;\n    height: 32px;\n    position: static;\n\n    &__bg {\n      background: var(--tertiary-elements, #636d78);\n      border-radius: 8px;\n      width: 32px;\n      height: 32px;\n      position: absolute;\n      left: 0px;\n      top: 0px;\n\n      &__icon {\n        border-radius: 4px;\n        padding: 4px;\n        display: flex;\n        flex-direction: row;\n        gap: 0px;\n        align-items: center;\n        justify-content: center;\n        width: 24px;\n        height: 24px;\n        position: absolute;\n        left: 4px;\n        top: 4px;\n      }\n    }\n  }\n\n  &__file-name {\n    color: var(--secondary-text, #636d78);\n    text-align: left;\n    font: var(--body-body-medium);\n    position: relative;\n  }\n}\n\n.message-icon-file {\n  align-self: stretch;\n  flex: 1;\n  height: auto;\n  position: relative;\n  overflow: visible;\n  fill: var(--color-media-icon, #ffffff);\n}\n",".message-attachment-image-body{\n  max-width: var(--max-width-image-message);\n  max-height: 160px;\n  padding: 0;\n  border-radius: 4px;\n}\n\n.message-attachment-image {\n  display: flex;\n  justify-content: center;\n  flex-flow: row;\n  max-width: var(--max-width-image-message);\n  max-height: 160px;\n  font: var(--body-body-medium, 400 14px / 20px \"Roboto-Regular\", sans-serif);\n  color: var(--main-tex, #0b1b0f);\n}\n",".audio-player {\n  display: flex;\n  gap: 5px;\n  flex-direction: row;\n  align-items: center;\n\n  &__equalizer-time {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n  }\n}\n.audio-body{\n  padding: 5px;\n  border-radius: 4px;\n  display: none;\n  width: var(--max-width-audio-message);\n\n  &__controls {\n    display: flex;\n    flex-flow: row;\n    align-items: center;\n    gap: 5px;\n    width: 24px;\n    height: 24px;\n\n    &--color{\n      fill: var(--main-elements)\n    }\n  }\n}\n\n.equalizer {\n  display: flex;\n  flex-direction: row;\n  gap: 2px;\n  align-items: flex-end;\n  justify-content: flex-start;\n  position: relative;\n\n  &__rectangle {\n    background: var(--main-elements, #636d78);\n    flex-shrink: 0;\n    width: 2px;\n    position: relative;\n  }\n}\n\n.time-play {\n  color: var(--secondary-text, #636d78);\n  text-align: left;\n  font: var(--label-label-small);\n  height: 16px;\n}\n\n.audio-bubble-background {\n\n  &__incoming {\n    background: var(--incoming-background, #e4e6e8);\n    border-radius: 22px 22px 22px 0px;\n    padding: 8px 12px 8px 12px;\n    display: flex;\n    flex-direction: row;\n    gap: 10px;\n    align-items: flex-start;\n    justify-content: flex-start;\n    flex-shrink: 0;\n    position: relative;\n  }\n\n  &__outgoing {\n    background: var(--outgoing-background, #E7EFFF);\n    border-radius: 22px 22px 0px 22px;\n    padding: 8px 12px 8px 12px;\n    display: flex;\n    flex-direction: row;\n    gap: 10px;\n    align-items: flex-start;\n    justify-content: flex-start;\n    flex-shrink: 0;\n    position: relative;\n  }\n\n}\n",".message-attachment-video-body{\n  max-height: 130px;\n  max-width: var(--max-width-audio-message);\n  width: var(--max-width-audio-message);\n  padding: 0;\n  border-radius: 4px;\n\n  &__link {\n    color: var(--secondary-text, #636d78);\n    text-align: left;\n    font: var(--label-label-small);\n    height: 16px;\n  }\n}\n\n.message-attachment-video {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-flow: column;\n  //max-width: 300px;\n  max-width: var(--max-width-audio-message);\n  width: var(--max-width-audio-message);\n  max-height: 160px;\n}\n\n\n"],"names":[],"sourceRoot":""}

package/storybook-static/static/css/{Presentation-ui-components-Placeholder-Placeholder-stories.1ebf88ab.chunk.css → Presentation-ui-components-Placeholder-Placeholder-stories.cb7fb80a.chunk.css}

@@ -1,4 +1,3 @@
 .placeholder{display:flex;flex-direction:column;align-items:center}.placeholder,.placeholder *{box-sizing:border-box}.placeholder__text{font-family:"Roboto";font-weight:400;font-size:16px;line-height:24px;letter-spacing:.15px;color:var(--caption);text-align:center}.placeholder__icon{width:52px;height:52px;margin-bottom:16px;fill:var(--caption)}.placeholder__retry{display:flex;align-items:center;padding:4px 8px 4px 8px;fill:#3978fc;color:#3978fc;font-family:"Roboto";font-weight:700;font-size:14px;line-height:16px;letter-spacing:.4px}.placeholder__retry-icon{width:24px;height:24px;margin-right:8px;cursor:pointer}
-.loader{animation:rotate 1s infinite linear}.loader--sm{width:24px;height:24px}.loader--md{width:48px;height:48px}.loader--lg{width:52px;height:52px}@keyframes rotate{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
 
-/*# sourceMappingURL=Presentation-ui-components-Placeholder-Placeholder-stories.1ebf88ab.chunk.css.map*/
+/*# sourceMappingURL=Presentation-ui-components-Placeholder-Placeholder-stories.cb7fb80a.chunk.css.map*/

package/storybook-static/static/css/Presentation-ui-components-Placeholder-Placeholder-stories.cb7fb80a.chunk.css.map

@@ -0,0 +1 @@
+{"version":3,"file":"static/css/Presentation-ui-components-Placeholder-Placeholder-stories.cb7fb80a.chunk.css","mappings":"AAEA","sources":["webpack://quickblox-react-ui-kit/./src/Presentation/ui-components/Placeholder/Placeholder.scss","webpack://quickblox-react-ui-kit/./src/Presentation/themes/styles/_mixins.scss"],"sourcesContent":["@import '../../themes/styles/mixins';\n\n.placeholder {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n\n  @include applyBorderBox;\n\n  &__text {\n\n    font-family: 'Roboto';\n    font-weight: 400;\n    font-size: 16px;\n    line-height: 24px;\n    letter-spacing: 0.15px;\n    color: var(--caption);\n    text-align: center;\n  }\n\n  &__icon {\n    width: 52px;\n    height: 52px;\n    margin-bottom: 16px;\n\n    fill: var(--caption);\n  }\n\n  &__retry {\n    display: flex;\n    align-items: center;\n    padding: 4px 8px 4px 8px;\n\n    fill: #3978fc;\n    color: #3978fc;\n\n    font-family: 'Roboto';\n    font-weight: 700;\n    font-size: 14px;\n    line-height: 16px;\n    letter-spacing: 0.4px;\n  }\n\n  &__retry-icon {\n    width: 24px;\n    height: 24px;\n    margin-right: 8px;\n\n    cursor: pointer;\n  }\n}\n","@mixin applyBorderBox {\n  &,\n  * {\n    box-sizing: border-box;\n  }\n}\n"],"names":[],"sourceRoot":""}

package/storybook-static/static/css/{main.4e852eef.css → main.6fa55a2c.css}

@@ -1,5 +1,5 @@
 @import url(https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,400;0,500;0,700;1,700&display=swap);
 @import url(https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600;700&display=swap);
-:root{--primary: #3978FC;--color-background: #FFFFFF;--color-background-modal: #C4D7FE;--color-background-overlay: #0B121B;--color-divider: #E7EFFF;--color-font: #0B121B;--color-icon: #3978FC;--color-media-icon: #FFFFFF;--color-default-hover: #2C65FB;--color-default-active: #1748FA;--color-background-info: #C4D7FE;--color-border-active: #9CBCFE;--tertiary-elements: #636D78;--main-elements: #3978FC;--toast-color: #131D28;--secondary-elements: #202F3E;--input-elements: #202F3E;--disabled-elements: #BCC1C5;--field-border: #90979F;--main-text: #0B121B;--secondary-text: #636D78;--caption: #90979F;--main-background: #FFFFFF;--secondary-background: #FFFFFF;--secondary-background-modal: rgba(19, 29, 40, 0.8);--incoming-background: #E4E6E8;--outgoing-background: #E7EFFF;--dropdown-background: #FFFFFF;--chat-input: #F7F9FF;--divider: #E7EFFF;--error: #FF3B30;--error-secondary: #FF9D98;--hightlight: #FFFDC1}html[data-theme=dark]{--primary: #3978FC;--color-background: #0B121B;--color-background-modal: #131D28;--color-background-overlay: #0B121B;--color-divider: #414E5B;--color-font: #FFFFFF;--color-icon: #74A1FD;--color-media-icon: #FFFFFF;--color-default-hover: #182330;--color-default-active: #0B121B;--color-background-info: #3978FC;--color-border-active: #90979F;--tertiary-elements: rgba(144, 151, 159, 0.8);--main-elements: #74A1FD;--secondary-elements: #FFFFFF;--input-elements: #90979F;--disabled-elements: #636D78;--field-border: #90979F;--main-text: #FFFFFF;--secondary-text: #90979F;--caption: #BCC1C5;--main-background: #202F3E;--secondary-background: #131D28;--incoming-background: #414E5B;--outgoing-background: #3978FC;--dropdown-background: #414E5B;--chat-input: #131D28;--divider: #414E5B;--error: #FF766E;--error-secondary: #FFC4C1;--hightlight: #FFFDC1}:root{--title-title-large: 500 20px/24px "Roboto", sans-serif;--title-title-medium: 500 16px/24px "Roboto", sans-serif;--title-title-small: 500 14px/20px "Roboto", sans-serif;--label-label-large: 500 14px/20px "Roboto", sans-serif;--label-label-medium: 500 12px/16px "Roboto", sans-serif;--label-label-small: 500 11px/16px "Roboto", sans-serif;--body-body-large: 400 16px/24px "Roboto", sans-serif;--body-body-medium: 400 14px/20px "Roboto", sans-serif;--body-body-small: 400 12px/16px "Roboto", sans-serif;--button-fab: 500 14px/16px "Roboto", sans-serif;--button-default: 700 14px/16px "Roboto", sans-serif;--ui-kit-header: 500 48px "Roboto Mono", sans-serif;--ui-kit-title: 500 32px "Roboto Mono", sans-serif;--ui-kit-body: 400 17px "Roboto Mono", sans-serif;--max-width-message-bubble: 480px;--max-width-message-view-container: 680px;--max-width-image-message: 240px;--max-width-audio-message: 300px;--max-width-dialog-list: 320px;--min-width-screen-desktop: 980px}*{box-sizing:border-box}body{font-family:"Roboto";color:#0B121B;color:var(--main-text);background-color:#FFFFFF;background-color:var(--main-background);overflow:hidden !important;scrollbar-width:none !important}@media only screen and (max-width: 980px){:root{--max-width-message-view-container: 345px;--max-width-message-bubble: 170px;--max-width-image-message: 150px;--max-width-audio-message: 150px;--max-width-dialog-list: 100%}}
+:root{--primary: #3978FC;--color-background: #FFFFFF;--color-background-modal: #C4D7FE;--color-background-overlay: #0B121B;--color-divider: #E7EFFF;--color-font: #0B121B;--color-icon: #3978FC;--color-media-icon: #FFFFFF;--color-default-hover: #2C65FB;--color-default-active: #1748FA;--color-background-info: #C4D7FE;--color-border-active: #9CBCFE;--tertiary-elements: #636D78;--main-elements: #3978FC;--toast-color: #131D28;--secondary-elements: #202F3E;--input-elements: #202F3E;--disabled-elements: #BCC1C5;--field-border: #90979F;--main-text: #0B121B;--secondary-text: #636D78;--caption: #90979F;--main-background: #FFFFFF;--secondary-background: #FFFFFF;--secondary-background-modal: rgba(19, 29, 40, 0.8);--incoming-background: #E4E6E8;--outgoing-background: #E7EFFF;--dropdown-background: #FFFFFF;--chat-input: #F7F9FF;--divider: #E7EFFF;--error: #FF3B30;--error-secondary: #FF9D98;--hightlight: #FFFDC1}html[data-theme=dark]{--primary: #3978FC;--color-background: #0B121B;--color-background-modal: #131D28;--color-background-overlay: #0B121B;--color-divider: #414E5B;--color-font: #FFFFFF;--color-icon: #74A1FD;--color-media-icon: #FFFFFF;--color-default-hover: #182330;--color-default-active: #0B121B;--color-background-info: #3978FC;--color-border-active: #90979F;--tertiary-elements: rgba(144, 151, 159, 0.8);--main-elements: #74A1FD;--secondary-elements: #FFFFFF;--input-elements: #90979F;--disabled-elements: #636D78;--field-border: #90979F;--main-text: #FFFFFF;--secondary-text: #90979F;--caption: #BCC1C5;--main-background: #202F3E;--secondary-background: #131D28;--incoming-background: #414E5B;--outgoing-background: #3978FC;--dropdown-background: #414E5B;--chat-input: #131D28;--divider: #414E5B;--error: #FF766E;--error-secondary: #FFC4C1;--hightlight: #FFFDC1}:root{--title-title-large: 500 20px/24px "Roboto", sans-serif;--title-title-medium: 500 16px/24px "Roboto", sans-serif;--title-title-small: 500 14px/20px "Roboto", sans-serif;--label-label-large: 500 14px/20px "Roboto", sans-serif;--label-label-medium: 500 12px/16px "Roboto", sans-serif;--label-label-small: 500 11px/16px "Roboto", sans-serif;--body-body-large: 400 16px/24px "Roboto", sans-serif;--body-body-medium: 400 14px/20px "Roboto", sans-serif;--body-body-small: 400 12px/16px "Roboto", sans-serif;--button-fab: 500 14px/16px "Roboto", sans-serif;--button-default: 700 14px/16px "Roboto", sans-serif;--ui-kit-header: 500 48px "Roboto Mono", sans-serif;--ui-kit-title: 500 32px "Roboto Mono", sans-serif;--ui-kit-body: 400 17px "Roboto Mono", sans-serif;--max-width-message-bubble: 480px;--max-width-message-view-container: 680px;--max-width-image-message: 240px;--max-width-audio-message: 300px;--max-width-dialog-list: 320px;--min-width-screen-desktop: 980px}*{box-sizing:border-box}body{font-family:"Roboto";color:#0B121B;color:var(--main-text);background-color:#FFFFFF;background-color:var(--main-background)}@media only screen and (max-width: 980px){:root{--max-width-message-view-container: 345px;--max-width-message-bubble: 170px;--max-width-image-message: 150px;--max-width-audio-message: 150px;--max-width-dialog-list: 100%}}
 
-/*# sourceMappingURL=main.4e852eef.css.map*/
+/*# sourceMappingURL=main.6fa55a2c.css.map*/

package/storybook-static/static/css/{main.4e852eef.css.map → main.6fa55a2c.css.map}

@@ -1 +1 @@
-{"version":3,"file":"static/css/main.4e852eef.css","mappings":";;AAEA","sources":["webpack://quickblox-react-ui-kit/./src/Presentation/themes/styles/_fonts.scss","webpack://quickblox-react-ui-kit/./src/Presentation/themes/styles/_theme_light.scss","webpack://quickblox-react-ui-kit/./src/Presentation/themes/styles/_theme_dark.scss","webpack://quickblox-react-ui-kit/./src/Presentation/themes/styles/_variables.scss","webpack://quickblox-react-ui-kit/./src/index.scss"],"sourcesContent":["@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,400;0,500;0,700;1,700&display=swap');\n////font-family: 'Ubuntu', sans-serif;\n@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600;700&display=swap');\n////font-family: 'Roboto', sans-serif;\n/*\n@font-face {\n  font-family: \"Roboto-Regular\";\n  src: url(\"../fonts/Roboto-Regular.eot\");\n  src: local(\"☺\"), url(\"../fonts/Roboto-Regular.woff\") format(\"woff\"),\n  url(\"../fonts/Roboto-Regular.ttf\") format(\"truetype\");\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Roboto-Medium\";\n  src: url(\"../fonts/Roboto-Medium.eot\");\n  src: local(\"☺\"), url(\"../fonts/Roboto-Medium.woff\") format(\"woff\"),\n  url(\"../fonts/Roboto-Medium.ttf\") format(\"truetype\");\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Roboto-Bold\";\n  src: url(\"../fonts/Roboto-Bold.eot\");\n  src: local(\"☺\"), url(\"../fonts/Roboto-Bold.woff\") format(\"woff\"),\n  url(\"../fonts/Roboto-Bold.ttf\") format(\"truetype\");\n  font-weight: normal;\n  font-style: normal;\n}\n*/\n","@import 'theme_colors_scheme';\n\n:root {\n  --primary: #{$primary-500};\n  --color-background: #{$primary-a-100};\n  --color-background-modal: #{$primary-100};\n  --color-background-overlay: #{$secondary-900};\n  --color-divider: #{$primary-50};\n  --color-font: #{$secondary-900};\n  --color-icon: #{$primary-500};\n  --color-media-icon: #{$primary-a-100};\n  --color-default-hover: #{$primary-700};\n  --color-default-active: #{$primary-900};\n\n  --color-background-info: #{$primary-100};\n  --color-border-active: #{$primary-200};\n  --tertiary-elements: #{$secondary-300};\n  --main-elements: #{$primary-500};\n  --toast-color: #{$secondary-800};\n  --secondary-elements: #{$secondary-500};\n  --input-elements: #{$secondary-500};\n  --disabled-elements: #{$secondary-100};\n  --field-border: #{$secondary-200};\n  --main-text: #{$secondary-900};\n  --secondary-text: #{$secondary-300};\n  --caption: #{$secondary-200};\n  --main-background: #{$primary-a-100};\n  --secondary-background: #{$primary-a-100}; // #{$primary-50};\n  --secondary-background-modal: #{$background-overlay-light};\n  --incoming-background: #{$secondary-50};\n  --outgoing-background: #{$primary-50};\n  --dropdown-background: #{$primary-a-100};\n  --chat-input: #{$primary-a-200};\n  --divider: #{$primary-50};\n  --error: #{$error-500};\n  --error-secondary: #{$error-200};\n  --hightlight: #{$highlight};\n}\n","@import 'theme_colors_scheme';\n// https://sass-lang.com/documentation/breaking-changes/css-vars\n\nhtml[data-theme='dark'] {\n  --primary: #{$primary-500};\n  --color-background: #{$secondary-900};\n  --color-background-modal: #{$secondary-800};\n  --color-background-overlay: #{$secondary-900};\n  --color-divider: #{$secondary-400};\n  --color-font: #{$primary-a-100};\n  --color-icon: #{$primary-300};\n  --color-media-icon: #{$primary-a-100};\n  --color-default-hover: #{$secondary-700};\n  --color-default-active: #{$secondary-900};\n\n  --color-background-info: #{$primary-500};\n  --color-border-active: #{$secondary-200};\n  --tertiary-elements: #{$background-overlay-dark};\n  --main-elements: #{$primary-300};\n  --secondary-elements: #{$primary-a-100};\n  --input-elements: #{$secondary-200};\n  --disabled-elements: #{$secondary-300};\n  --field-border: #{$secondary-200};\n  --main-text: #{$primary-a-100};\n  --secondary-text: #{$secondary-200};\n  --caption: #{$secondary-100};\n  --main-background: #{$secondary-500};\n  --secondary-background: #{$secondary-800};\n  --incoming-background: #{$secondary-400};\n  --outgoing-background: #{$primary-500};\n  --dropdown-background: #{$secondary-400};\n  --chat-input: #{$secondary-800};\n  --divider: #{$secondary-400};\n  --error: #{$error-300};\n  --error-secondary: #{$error-100};\n  --hightlight: #{$highlight};\n}\n","@import \"theme_light\";\n@import \"theme_dark\";\n\n$qb-min-width-screen-desktop: 980px;\n\n$qb-max-width-screen: 980px;\n\n$qb-max-width-message-view-container-desktop: 680px;\n$qb-max-width-message-view-container-mobile: 345px;\n\n$qb-max-width-message-bubble-desktop: 480px;\n$qb-max-width-message-bubble-mobile: 170px;\n\n$qb-max-width-image-message-desktop: 240px;\n$qb-max-width-image-message-mobile: 150px;\n\n$qb-max-width-audio-message-desktop: 300px;\n$qb-max-width-audio-message-mobile: 150px;\n\n$qb-max-width-dialog-list-desktop: 320px;\n$qb-max-width-dialog-list-mobile: 100%;\n\n$create-dialog-container-width: 380px;\n\n\n\n/* Fonts */\n:root{\n  --title-title-large: 500 20px/24px \"Roboto\", sans-serif;\n  --title-title-medium: 500 16px/24px \"Roboto\", sans-serif;\n  --title-title-small: 500 14px/20px \"Roboto\", sans-serif;\n  --label-label-large: 500 14px/20px \"Roboto\", sans-serif;\n  --label-label-medium: 500 12px/16px \"Roboto\", sans-serif;\n  --label-label-small: 500 11px/16px \"Roboto\", sans-serif;\n  --body-body-large: 400 16px/24px \"Roboto\", sans-serif;\n  --body-body-medium: 400 14px/20px \"Roboto\", sans-serif;\n  --body-body-small: 400 12px/16px \"Roboto\", sans-serif;\n  --button-fab: 500 14px/16px \"Roboto\", sans-serif;\n  --button-default: 700 14px/16px \"Roboto\", sans-serif;\n  --ui-kit-header: 500 48px \"Roboto Mono\", sans-serif;\n  --ui-kit-title: 500 32px \"Roboto Mono\", sans-serif;\n  --ui-kit-body: 400 17px \"Roboto Mono\", sans-serif;\n\n/* Width */\n  --max-width-message-bubble: #{$qb-max-width-message-bubble-desktop};\n  --max-width-message-view-container: #{$qb-max-width-message-view-container-desktop};\n  --max-width-image-message: #{$qb-max-width-image-message-desktop};\n  --max-width-audio-message: #{$qb-max-width-audio-message-desktop};\n  --max-width-dialog-list: #{$qb-max-width-dialog-list-desktop};\n  --min-width-screen-desktop: #{$qb-min-width-screen-desktop};\n}\n\n\n\n","@import 'Presentation/themes/styles/fonts';\n@import 'Presentation/themes/styles/theme_colors_scheme';\n@import 'Presentation/themes/styles/variables';\n@import 'Presentation/themes/styles/mixins';\n\n* {\n  box-sizing: border-box;\n}\n\nbody {\n  font-family: 'Roboto';\n  color: var(--main-text);\n  background-color: var(--main-background);\n  overflow: hidden !important;\n  scrollbar-width: none !important;\n}\n\n/* Media-query for mobile devices */\n@media only screen and (max-width: #{$qb-max-width-screen}) {\n  :root {\n    --max-width-message-view-container: #{$qb-max-width-message-view-container-mobile};\n    --max-width-message-bubble: #{$qb-max-width-message-bubble-mobile};\n    --max-width-image-message: #{$qb-max-width-image-message-mobile};\n    --max-width-audio-message: #{$qb-max-width-audio-message-mobile};\n    --max-width-dialog-list: #{$qb-max-width-dialog-list-mobile};\n  }\n}\n"],"names":[],"sourceRoot":""}
+{"version":3,"file":"static/css/main.6fa55a2c.css","mappings":";;AAEA","sources":["webpack://quickblox-react-ui-kit/./src/Presentation/themes/styles/_fonts.scss","webpack://quickblox-react-ui-kit/./src/Presentation/themes/styles/_theme_light.scss","webpack://quickblox-react-ui-kit/./src/Presentation/themes/styles/_theme_dark.scss","webpack://quickblox-react-ui-kit/./src/Presentation/themes/styles/_variables.scss","webpack://quickblox-react-ui-kit/./src/index.scss"],"sourcesContent":["@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,400;0,500;0,700;1,700&display=swap');\n////font-family: 'Ubuntu', sans-serif;\n@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600;700&display=swap');\n////font-family: 'Roboto', sans-serif;\n/*\n@font-face {\n  font-family: \"Roboto-Regular\";\n  src: url(\"../fonts/Roboto-Regular.eot\");\n  src: local(\"☺\"), url(\"../fonts/Roboto-Regular.woff\") format(\"woff\"),\n  url(\"../fonts/Roboto-Regular.ttf\") format(\"truetype\");\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Roboto-Medium\";\n  src: url(\"../fonts/Roboto-Medium.eot\");\n  src: local(\"☺\"), url(\"../fonts/Roboto-Medium.woff\") format(\"woff\"),\n  url(\"../fonts/Roboto-Medium.ttf\") format(\"truetype\");\n  font-weight: normal;\n  font-style: normal;\n}\n\n@font-face {\n  font-family: \"Roboto-Bold\";\n  src: url(\"../fonts/Roboto-Bold.eot\");\n  src: local(\"☺\"), url(\"../fonts/Roboto-Bold.woff\") format(\"woff\"),\n  url(\"../fonts/Roboto-Bold.ttf\") format(\"truetype\");\n  font-weight: normal;\n  font-style: normal;\n}\n*/\n","@import 'theme_colors_scheme';\n\n:root {\n  --primary: #{$primary-500};\n  --color-background: #{$primary-a-100};\n  --color-background-modal: #{$primary-100};\n  --color-background-overlay: #{$secondary-900};\n  --color-divider: #{$primary-50};\n  --color-font: #{$secondary-900};\n  --color-icon: #{$primary-500};\n  --color-media-icon: #{$primary-a-100};\n  --color-default-hover: #{$primary-700};\n  --color-default-active: #{$primary-900};\n\n  --color-background-info: #{$primary-100};\n  --color-border-active: #{$primary-200};\n  --tertiary-elements: #{$secondary-300};\n  --main-elements: #{$primary-500};\n  --toast-color: #{$secondary-800};\n  --secondary-elements: #{$secondary-500};\n  --input-elements: #{$secondary-500};\n  --disabled-elements: #{$secondary-100};\n  --field-border: #{$secondary-200};\n  --main-text: #{$secondary-900};\n  --secondary-text: #{$secondary-300};\n  --caption: #{$secondary-200};\n  --main-background: #{$primary-a-100};\n  --secondary-background: #{$primary-a-100}; // #{$primary-50};\n  --secondary-background-modal: #{$background-overlay-light};\n  --incoming-background: #{$secondary-50};\n  --outgoing-background: #{$primary-50};\n  --dropdown-background: #{$primary-a-100};\n  --chat-input: #{$primary-a-200};\n  --divider: #{$primary-50};\n  --error: #{$error-500};\n  --error-secondary: #{$error-200};\n  --hightlight: #{$highlight};\n}\n","@import 'theme_colors_scheme';\n// https://sass-lang.com/documentation/breaking-changes/css-vars\n\nhtml[data-theme='dark'] {\n  --primary: #{$primary-500};\n  --color-background: #{$secondary-900};\n  --color-background-modal: #{$secondary-800};\n  --color-background-overlay: #{$secondary-900};\n  --color-divider: #{$secondary-400};\n  --color-font: #{$primary-a-100};\n  --color-icon: #{$primary-300};\n  --color-media-icon: #{$primary-a-100};\n  --color-default-hover: #{$secondary-700};\n  --color-default-active: #{$secondary-900};\n\n  --color-background-info: #{$primary-500};\n  --color-border-active: #{$secondary-200};\n  --tertiary-elements: #{$background-overlay-dark};\n  --main-elements: #{$primary-300};\n  --secondary-elements: #{$primary-a-100};\n  --input-elements: #{$secondary-200};\n  --disabled-elements: #{$secondary-300};\n  --field-border: #{$secondary-200};\n  --main-text: #{$primary-a-100};\n  --secondary-text: #{$secondary-200};\n  --caption: #{$secondary-100};\n  --main-background: #{$secondary-500};\n  --secondary-background: #{$secondary-800};\n  --incoming-background: #{$secondary-400};\n  --outgoing-background: #{$primary-500};\n  --dropdown-background: #{$secondary-400};\n  --chat-input: #{$secondary-800};\n  --divider: #{$secondary-400};\n  --error: #{$error-300};\n  --error-secondary: #{$error-100};\n  --hightlight: #{$highlight};\n}\n","@import \"theme_light\";\n@import \"theme_dark\";\n\n$qb-min-width-screen-desktop: 980px;\n\n$qb-max-width-screen: 980px;\n\n$qb-max-width-message-view-container-desktop: 680px;\n$qb-max-width-message-view-container-mobile: 345px;\n\n$qb-max-width-message-bubble-desktop: 480px;\n$qb-max-width-message-bubble-mobile: 170px;\n\n$qb-max-width-image-message-desktop: 240px;\n$qb-max-width-image-message-mobile: 150px;\n\n$qb-max-width-audio-message-desktop: 300px;\n$qb-max-width-audio-message-mobile: 150px;\n\n$qb-max-width-dialog-list-desktop: 320px;\n$qb-max-width-dialog-list-mobile: 100%;\n\n$create-dialog-container-width: 380px;\n\n\n\n/* Fonts */\n:root{\n  --title-title-large: 500 20px/24px \"Roboto\", sans-serif;\n  --title-title-medium: 500 16px/24px \"Roboto\", sans-serif;\n  --title-title-small: 500 14px/20px \"Roboto\", sans-serif;\n  --label-label-large: 500 14px/20px \"Roboto\", sans-serif;\n  --label-label-medium: 500 12px/16px \"Roboto\", sans-serif;\n  --label-label-small: 500 11px/16px \"Roboto\", sans-serif;\n  --body-body-large: 400 16px/24px \"Roboto\", sans-serif;\n  --body-body-medium: 400 14px/20px \"Roboto\", sans-serif;\n  --body-body-small: 400 12px/16px \"Roboto\", sans-serif;\n  --button-fab: 500 14px/16px \"Roboto\", sans-serif;\n  --button-default: 700 14px/16px \"Roboto\", sans-serif;\n  --ui-kit-header: 500 48px \"Roboto Mono\", sans-serif;\n  --ui-kit-title: 500 32px \"Roboto Mono\", sans-serif;\n  --ui-kit-body: 400 17px \"Roboto Mono\", sans-serif;\n\n/* Width */\n  --max-width-message-bubble: #{$qb-max-width-message-bubble-desktop};\n  --max-width-message-view-container: #{$qb-max-width-message-view-container-desktop};\n  --max-width-image-message: #{$qb-max-width-image-message-desktop};\n  --max-width-audio-message: #{$qb-max-width-audio-message-desktop};\n  --max-width-dialog-list: #{$qb-max-width-dialog-list-desktop};\n  --min-width-screen-desktop: #{$qb-min-width-screen-desktop};\n}\n\n\n\n","@import 'Presentation/themes/styles/fonts';\n@import 'Presentation/themes/styles/theme_colors_scheme';\n@import 'Presentation/themes/styles/variables';\n@import 'Presentation/themes/styles/mixins';\n\n* {\n  box-sizing: border-box;\n}\n\nbody {\n  font-family: 'Roboto';\n  color: var(--main-text);\n  background-color: var(--main-background);\n}\n\n/* Media-query for mobile devices */\n@media only screen and (max-width: #{$qb-max-width-screen}) {\n  :root {\n    --max-width-message-view-container: #{$qb-max-width-message-view-container-mobile};\n    --max-width-message-bubble: #{$qb-max-width-message-bubble-mobile};\n    --max-width-image-message: #{$qb-max-width-image-message-mobile};\n    --max-width-audio-message: #{$qb-max-width-audio-message-mobile};\n    --max-width-dialog-list: #{$qb-max-width-dialog-list-mobile};\n  }\n}\n"],"names":[],"sourceRoot":""}