quickblox-react-ui-kit 0.4.4-alpha.9 → 0.4.5-beta.2

package/dist/index-ui.js

@@ -297,7 +297,7 @@ module.exports = styleTagTransform;
 
 var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
 // Module
-___CSS_LOADER_EXPORT___.push([module.id, `.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}`, ""]);
+___CSS_LOADER_EXPORT___.push([module.id, `.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__icon svg{width:52px;height:52px}.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}`, ""]);
 // Exports
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
 
@@ -58446,7 +58446,7 @@ ___CSS_LOADER_EXPORT___.push([module.id, `.dialog-preview-container{display:flex
 
 var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
 // Module
-___CSS_LOADER_EXPORT___.push([module.id, `.dialog-header{width:100%;padding:12px 16px 12px 20px;display:flex;align-items:center;gap:33px}.dialog-header,.dialog-header *{box-sizing:border-box}.dialog-header__icon{cursor:pointer;width:24px;height:24px;flex-shrink:0}.dialog-header__back{color:var(--main-elements)}.dialog-header__body{width:100%;display:flex;gap:33px;align-items:center;justify-content:space-between;overflow:hidden}.dialog-header__body-left{display:flex;align-items:center;justify-content:flex-start;gap:8px;overflow:hidden}.dialog-header__body-right{height:24px;display:flex;align-items:center;gap:16px}.dialog-header__title{color:var(--main-text, #0b1b0f);text-align:left;font:var(--title-title-medium);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.dialog-header__line{border-style:solid;border-color:var(--color-divider, #e7efff);border-width:0 0 1px 0}@media only screen and (max-width: var(--min-width-screen-desktop)){.dialog-header__body-left{gap:3px}}@media only screen and (min-width: 981px){.dialog-header__back{display:none}}`, ""]);
+___CSS_LOADER_EXPORT___.push([module.id, `.dialog-header{width:100%;padding:12px 16px 12px 20px;display:flex;align-items:center;gap:33px}.dialog-header,.dialog-header *{box-sizing:border-box}.dialog-header__icon{cursor:pointer;width:24px;height:24px;flex-shrink:0}.dialog-header__icon svg{width:24px;height:24px}.dialog-header__back{color:var(--main-elements)}.dialog-header__body{width:100%;display:flex;gap:33px;align-items:center;justify-content:space-between;overflow:hidden}.dialog-header__body-left{display:flex;align-items:center;justify-content:flex-start;gap:8px;overflow:hidden}.dialog-header__body-right{height:24px;display:flex;align-items:center;gap:16px}.dialog-header__title{color:var(--main-text, #0b1b0f);text-align:left;font:var(--title-title-medium);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.dialog-header__line{border-style:solid;border-color:var(--color-divider, #e7efff);border-width:0 0 1px 0}@media only screen and (max-width: var(--min-width-screen-desktop)){.dialog-header__body-left{gap:3px}}@media only screen and (min-width: 981px){.dialog-header__back{display:none}}`, ""]);
 // Exports
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
 
@@ -59285,7 +59285,7 @@ ___CSS_LOADER_EXPORT___.push([module.id, `.message-view-container{display:flex;f
 
 var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
 // Module
-___CSS_LOADER_EXPORT___.push([module.id, `.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: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:var(--secondary-text, #636d78);text-align:left;font:var(--body-body-medium);position:relative}.message-icon-file{align-self:stretch;flex:1;height:auto;position:relative;overflow:visible;fill:var(--color-media-icon, #ffffff)}`, ""]);
+___CSS_LOADER_EXPORT___.push([module.id, `.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: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}.file-attachment__file-name{color:var(--secondary-text, #636d78);text-align:left;font:var(--body-body-medium);position:relative}.message-icon-file{align-self:stretch;flex:1;height:auto;position:relative;overflow:visible;fill:var(--color-media-icon, #ffffff)}`, ""]);
 // Exports
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
 
@@ -59434,7 +59434,7 @@ ___CSS_LOADER_EXPORT___.push([module.id, `.main-button {
 
 var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
 // Module
-___CSS_LOADER_EXPORT___.push([module.id, `.bubble-content-text{overflow-wrap:break-word;max-width:calc(var(--max-width-message-bubble) - 20px);color:var(--main-tex, #0b1b0f);text-align:left;font:var(--body-body-medium, 400 14px/20px "Roboto-Regular", sans-serif)}.text-bubble-background__incoming{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;width:100%}.text-bubble-background__outgoing{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}`, ""]);
+___CSS_LOADER_EXPORT___.push([module.id, `.bubble-content-text{overflow-wrap:break-word;max-width:calc(var(--max-width-message-bubble) - 20px);color:var(--main-tex, #0b1b0f);text-align:left;font:var(--body-body-medium, 400 14px/20px "Roboto-Regular", sans-serif)}.text-bubble-background__incoming{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}.text-bubble-background__outgoing{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}`, ""]);
 // Exports
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
 
@@ -62518,12 +62518,12 @@ class Stubs {
             id: '10231',
             type: FileType.image,
             uid: '10231',
-            url: 'https://via.placeholder.com/600/92c952',
+            url: 'https://files.readme.io/00b5563-small-qb-logo-docs-white-9px.png',
             file: {
                 id: '10231',
                 uid: '',
                 type: FileType.image,
-                url: 'https://via.placeholder.com/600/92c952',
+                url: 'https://files.readme.io/00b5563-small-qb-logo-docs-white-9px.png',
             },
         };
         const photoAttachments = [photo];
@@ -62612,12 +62612,12 @@ class Stubs {
             id: '10231',
             type: FileType.image,
             uid: '10231',
-            url: 'https://via.placeholder.com/600/92c952',
+            url: 'https://cdn-ikpjoif.nitrocdn.com/WZsqFPiehrtwFaaeJNQAQZrkRMgaTuyL/assets/images/optimized/rev-83f47e6/quickblox.com/wp-content/themes/QuickbloxTheme2021/img/chat-api-feature-rich-sdk.jpg',
             file: {
                 id: '10231',
                 uid: '',
                 type: FileType.image,
-                url: 'https://via.placeholder.com/600/92c952',
+                url: 'https://cdn-ikpjoif.nitrocdn.com/WZsqFPiehrtwFaaeJNQAQZrkRMgaTuyL/assets/images/optimized/rev-83f47e6/quickblox.com/wp-content/themes/QuickbloxTheme2021/img/chat-api-feature-rich-sdk.jpg',
             },
         };
         const photoAttachments = [photo];
@@ -63100,12 +63100,12 @@ class Stubs {
             id: '10231',
             type: FileType.image,
             uid: '10231',
-            url: 'https://via.placeholder.com/600/92c952',
+            url: 'https://files.readme.io/00b5563-small-qb-logo-docs-white-9px.png',
             file: {
                 id: '10231',
                 uid: '',
                 type: FileType.image,
-                url: 'https://via.placeholder.com/600/92c952',
+                url: 'https://files.readme.io/00b5563-small-qb-logo-docs-white-9px.png',
             },
         };
         const photoAttachments = [photo];
@@ -75100,7 +75100,7 @@ listRef, messagesToView, AITranslateWidget, AIAssistWidget, maxTokens, defaultTr
                             ? state[message.id].translatedText.length === 0
                             : true, loading: state[message.id] && state[message.id].loading
                             ? state[message.id].loading
-                            : false, onLoading: (isFetching, id) => fetchingHandler(isFetching, id), onError: onError, messageToTranslate: message, messageHistory: messagesToView, currentUserId: currentUserId, maxTokens: maxTokens, onTranslated: (id, textTranslated) => translatedHandler(id, textTranslated) })) : undefined, additionalPart: (0,jsx_runtime_.jsx)("div", { className: "message-item-additional-part", children: renderAdditionalPart(messageTypes, message) }), children: message.attachments && message.attachments.length > 0 ? ((0,jsx_runtime_.jsx)("div", { children: message.attachments.map((attachment) => {
+                            : false, onLoading: (isFetching, id) => fetchingHandler(isFetching, id), onError: onError, messageToTranslate: message, messageHistory: messagesToView, currentUserId: currentUserId, maxTokens: maxTokens, onTranslated: (id, textTranslated) => translatedHandler(id, textTranslated) })) : undefined, additionalPart: (0,jsx_runtime_.jsx)("div", { className: "message-item-additional-part", children: renderAdditionalPart(messageTypes, message) }), children: message.attachments && message.attachments.length > 0 ? ((0,jsx_runtime_.jsx)(jsx_runtime_.Fragment, { children: message.attachments.map((attachment) => {
                             return ((0,jsx_runtime_.jsx)(AttachmentBubble, { attachment: attachment, typeMessage: messageTypes }));
                         }) })) : ((0,jsx_runtime_.jsx)(TextBubble_TextBubble_TextBubble, { text: state[message.id] &&
                             state[message.id].translatedText &&

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "quickblox-react-ui-kit",
-  "version": "0.4.4-alpha.9",
+  "version": "0.4.5-beta.2",
   "main": "dist/index-ui.js",
   "types": "dist/index-ui.d.ts",
   "license": "MIT",
@@ -45,6 +45,7 @@
     "@typescript-eslint/eslint-plugin-tslint": "^5.45.1",
     "@typescript-eslint/parser": "^5.45.1",
     "babel-loader": "^9.2.1",
+    "compression-webpack-plugin": "^11.1.0",
     "css-loader": "^6.11.0",
     "eslint": "^8.29.0",
     "eslint-config-airbnb": "^19.0.4",
@@ -61,6 +62,7 @@
     "eslint-plugin-storybook": "^0.11.3",
     "file-loader": "^6.2.0",
     "html-webpack-plugin": "^5.6.3",
+    "mini-css-extract-plugin": "^2.9.2",
     "path-browserify": "^1.0.1",
     "prettier": "^2.8.0",
     "process": "^0.11.10",

package/src/Data/Stubs.ts

@@ -131,12 +131,12 @@ export class Stubs {
       id: '10231',
       type: FileType.image,
       uid: '10231',
-      url: 'https://via.placeholder.com/600/92c952',
+      url: 'https://files.readme.io/00b5563-small-qb-logo-docs-white-9px.png',
       file: {
         id: '10231',
         uid: '',
         type: FileType.image,
-        url: 'https://via.placeholder.com/600/92c952',
+        url: 'https://files.readme.io/00b5563-small-qb-logo-docs-white-9px.png',
       },
     };
     const photoAttachments: ChatMessageAttachmentEntity[] = [photo];
@@ -267,12 +267,12 @@ export class Stubs {
       id: '10231',
       type: FileType.image,
       uid: '10231',
-      url: 'https://via.placeholder.com/600/92c952',
+      url: 'https://cdn-ikpjoif.nitrocdn.com/WZsqFPiehrtwFaaeJNQAQZrkRMgaTuyL/assets/images/optimized/rev-83f47e6/quickblox.com/wp-content/themes/QuickbloxTheme2021/img/chat-api-feature-rich-sdk.jpg',
       file: {
         id: '10231',
         uid: '',
         type: FileType.image,
-        url: 'https://via.placeholder.com/600/92c952',
+        url: 'https://cdn-ikpjoif.nitrocdn.com/WZsqFPiehrtwFaaeJNQAQZrkRMgaTuyL/assets/images/optimized/rev-83f47e6/quickblox.com/wp-content/themes/QuickbloxTheme2021/img/chat-api-feature-rich-sdk.jpg',
       },
     };
     const photoAttachments: ChatMessageAttachmentEntity[] = [photo];
@@ -1029,12 +1029,12 @@ export class Stubs {
       id: '10231',
       type: FileType.image,
       uid: '10231',
-      url: 'https://via.placeholder.com/600/92c952',
+      url: 'https://files.readme.io/00b5563-small-qb-logo-docs-white-9px.png',
       file: {
         id: '10231',
         uid: '',
         type: FileType.image,
-        url: 'https://via.placeholder.com/600/92c952',
+        url: 'https://files.readme.io/00b5563-small-qb-logo-docs-white-9px.png',
       },
     };
     const photoAttachments: ChatMessageAttachmentEntity[] = [photo];

package/src/Presentation/Views/Dialog/MessageItem/MessageItem.tsx

@@ -346,7 +346,7 @@ export default function MessageItem({
             }
           >
             {message.attachments && message.attachments.length > 0 ? (
-              <div>
+              <>
                 {message.attachments.map((attachment) => {
                   return (
                     <AttachmentBubble
@@ -355,7 +355,7 @@ export default function MessageItem({
                     />
                   );
                 })}
-              </div>
+              </>
             ) : (
               <TextBubble
                 text={

package/src/Presentation/layouts/TestStage/LoginView/Login.scss

@@ -15,23 +15,26 @@ strong {
 /* ---------- LOGIN ---------- */
 
 #login {
-  border: 3px solid #6c38cc;
   margin: 50px auto;
   width: 100%;
 }
 
+form {
+  display: flex;
+  flex-flow: column;
+}
+
 form fieldset input[type="text"],
 input[type="password"] {
   appearance: none;
   background: #e5e5e5;
-  border: none;
   border-radius: 3px;
   color: #5a5656;
   font-family: inherit;
   font-size: 14px;
   height: 50px;
   outline: none;
-  padding: 0px 10px;
+  padding: 0;
   width: 100%;
   border: 1px solid #008dde;
   margin: 1px;

package/src/Presentation/ui-components/DialogItemPreview/DialogItemPreview.stories.tsx

@@ -119,7 +119,7 @@ export const DialogItemPreviewDefault: Story = {
   },
   render: (args) => {
     // eslint-disable-next-line no-param-reassign
-    args.date = new Date(args.date!).toLocaleDateString();
+    args.date = args.date ? new Date(args.date!).toLocaleDateString() : new Date().toLocaleDateString();
 
     return <DialogItemPreview {...args} />;
   },
@@ -134,6 +134,7 @@ export const DialogItemPreviewFullScreen: Story = {
       "Hello, dear Mr. User. Thank you for choosing us. I'm here to assist with your order's delivery. Please provide your preferred address and any specific instructions. We offer standard, express, and same-day delivery in select areas. Let us know your convenience, and we'll ensure a smooth process.",
     badge: <Badge count={5} />,
     contextMenu: <MoreSvg />,
+
   },
   parameters: {
     viewport: {
@@ -142,7 +143,7 @@ export const DialogItemPreviewFullScreen: Story = {
   },
   render: (args) => {
     // eslint-disable-next-line no-param-reassign
-    args.date = new Date(args.date!).toLocaleDateString();
+    args.date = new Date().toLocaleDateString();
 
     return <DialogItemPreview {...args} />;
   },
@@ -165,7 +166,7 @@ export const DialogItemPreviewMobileScreen: Story = {
   },
   render: (args) => {
     // eslint-disable-next-line no-param-reassign
-    args.date = new Date(args.date!).toLocaleDateString();
+    args.date = args.date ? new Date(args.date!).toLocaleDateString() : new Date().toLocaleDateString();
 
     return <DialogItemPreview {...args} />;
   },
@@ -188,7 +189,7 @@ export const DialogItemPreviewMobileScreenIPad: Story = {
   },
   render: (args) => {
     // eslint-disable-next-line no-param-reassign
-    args.date = new Date(args.date!).toLocaleDateString();
+    args.date = args.date ? new Date(args.date!).toLocaleDateString() : new Date().toLocaleDateString();
 
     return <DialogItemPreview {...args} />;
   },

package/src/Presentation/ui-components/Header/Header.scss

@@ -14,6 +14,11 @@
     width: 24px;
     height: 24px;
     flex-shrink: 0;
+
+    svg {
+      width: 24px;
+      height: 24px;
+    }
   }
 
   &__back {

package/src/Presentation/ui-components/Message/Bubble/TextBubble/TextBubble.scss

@@ -20,7 +20,6 @@
     justify-content: flex-start;
     flex-shrink: 0;
     position: relative;
-    width: 100%;
   }
 
   &__outgoing {

package/src/Presentation/ui-components/Message/FileUrl/FileUrl.scss

@@ -33,9 +33,6 @@
         justify-content: center;
         width: 24px;
         height: 24px;
-        position: absolute;
-        left: 4px;
-        top: 4px;
       }
     }
   }

package/src/Presentation/ui-components/Placeholder/Placeholder.scss

@@ -24,6 +24,11 @@
     margin-bottom: 16px;
 
     fill: var(--caption);
+
+    svg {
+      width: 52px;
+      height: 52px;
+    }
   }
 
   &__retry {

package/webpack.lib.config-debug.js

@@ -0,0 +1,87 @@
+const path = require('path');
+
+module.exports = {
+  mode: 'production',
+  entry: path.resolve(__dirname, 'src/index-ui.ts'),
+  output: {
+    filename: 'index-ui.js',
+    path: path.resolve(__dirname, 'dist'),
+    library: {
+      name: 'QuickBloxUIKit',
+      type: 'umd',
+    },
+    globalObject: 'this',
+    clean: true,
+    assetModuleFilename: '[name][ext]', // Сохраняем оригинальные имена файлов
+  },
+  resolve: {
+    extensions: ['.tsx', '.ts', '.js'],
+    modules: [path.resolve(__dirname, 'src'), 'node_modules'],
+  },
+  externals: {
+    react: {
+      commonjs: 'react',
+      commonjs2: 'react',
+      amd: 'react',
+      root: 'React',
+    },
+    'react-dom': {
+      commonjs: 'react-dom',
+      commonjs2: 'react-dom',
+      amd: 'react-dom',
+      root: 'ReactDOM',
+    },
+    'react/jsx-runtime': 'react/jsx-runtime',
+  },
+  module: {
+    rules: [
+      {
+        test: /\.(ts|tsx)$/,
+        use: {
+          loader: 'ts-loader',
+          options: {
+            configFile: path.resolve(__dirname, 'tsconfig.buildlib.json'),
+          },
+        },
+        exclude: [/node_modules/, /stories/],
+      },
+      {
+        test: /\.css$/i,
+        use: ['style-loader', 'css-loader'],
+      },
+      {
+        test: /\.s[ac]ss$/i,
+        use: ['style-loader', 'css-loader', 'sass-loader'],
+      },
+      {
+        test: /\.svg$/i, // 🔥 Все SVG → импортируются **ТОЛЬКО** как React-компоненты
+        use: [
+          {
+            loader: '@svgr/webpack',
+            options: {
+              icon: true,
+              esModule: true,
+            },
+          },
+        ],
+      },
+      {
+        test: /\.(png|jpg|jpeg|gif)$/i, // Поддержка изображений, без хеширования
+        type: 'asset/resource',
+      },
+    ],
+  },
+  optimization: {
+    minimize: false, // 🔥 Отключаем минимизацию JS и CSS
+    splitChunks: false, // 🔥 Отключаем разделение чанков
+    removeAvailableModules: false, // Оставляем модули без изменений
+    removeEmptyChunks: false, // Не удаляем пустые чанки
+    mergeDuplicateChunks: false, // Не объединяем дубликаты
+  },
+  performance: {
+    hints: false, // 🔥 Отключаем предупреждения о производительности
+  },
+  experiments: {
+    outputModule: false, // Отключаем ES-модули (так как UMD не поддерживает их)
+  },
+};

package/webpack.lib.config.js

@@ -1,87 +1,87 @@
 const path = require('path');
 
 module.exports = {
-  mode: 'production',
-  entry: path.resolve(__dirname, 'src/index-ui.ts'),
-  output: {
-    filename: 'index-ui.js',
-    path: path.resolve(__dirname, 'dist'),
-    library: {
-      name: 'QuickBloxUIKit',
-      type: 'umd',
-    },
-    globalObject: 'this',
-    clean: true,
-    assetModuleFilename: '[name][ext]', // Сохраняем оригинальные имена файлов
-  },
-  resolve: {
-    extensions: ['.tsx', '.ts', '.js'],
-    modules: [path.resolve(__dirname, 'src'), 'node_modules'],
-  },
-  externals: {
-    react: {
-      commonjs: 'react',
-      commonjs2: 'react',
-      amd: 'react',
-      root: 'React',
+    mode: 'production',
+    entry: path.resolve(__dirname, 'src/index-ui.ts'),
+    output: {
+        filename: 'index-ui.js',
+        path: path.resolve(__dirname, 'dist'),
+        library: {
+            name: 'QuickBloxUIKit',
+            type: 'umd',
+        },
+        globalObject: 'this',
+        clean: true,
+        assetModuleFilename: '[name][ext]', // Сохраняем оригинальные имена файлов
     },
-    'react-dom': {
-      commonjs: 'react-dom',
-      commonjs2: 'react-dom',
-      amd: 'react-dom',
-      root: 'ReactDOM',
+    resolve: {
+        extensions: ['.tsx', '.ts', '.js'],
+        modules: [path.resolve(__dirname, 'src'), 'node_modules'],
     },
-    'react/jsx-runtime': 'react/jsx-runtime',
-  },
-  module: {
-    rules: [
-      {
-        test: /\.(ts|tsx)$/,
-        use: {
-          loader: 'ts-loader',
-          options: {
-            configFile: path.resolve(__dirname, 'tsconfig.buildlib.json'),
-          },
+    externals: {
+        react: {
+            commonjs: 'react',
+            commonjs2: 'react',
+            amd: 'react',
+            root: 'React',
+        },
+        'react-dom': {
+            commonjs: 'react-dom',
+            commonjs2: 'react-dom',
+            amd: 'react-dom',
+            root: 'ReactDOM',
         },
-        exclude: [/node_modules/, /stories/],
-      },
-      {
-        test: /\.css$/i,
-        use: ['style-loader', 'css-loader'],
-      },
-      {
-        test: /\.s[ac]ss$/i,
-        use: ['style-loader', 'css-loader', 'sass-loader'],
-      },
-      {
-        test: /\.svg$/i, // 🔥 Все SVG → импортируются **ТОЛЬКО** как React-компоненты
-        use: [
-          {
-            loader: '@svgr/webpack',
-            options: {
-              icon: true,
-              esModule: true,
+        'react/jsx-runtime': 'react/jsx-runtime',
+    },
+    module: {
+        rules: [
+            {
+                test: /\.(ts|tsx)$/,
+                use: {
+                    loader: 'ts-loader',
+                    options: {
+                        configFile: path.resolve(__dirname, 'tsconfig.buildlib.json'),
+                    },
+                },
+                exclude: [/node_modules/, /stories/],
+            },
+            {
+                test: /\.css$/i,
+                use: ['style-loader', 'css-loader'],
+            },
+            {
+                test: /\.s[ac]ss$/i,
+                use: ['style-loader', 'css-loader', 'sass-loader'],
+            },
+            {
+                test: /\.svg$/i, // 🔥 Все SVG → импортируются **ТОЛЬКО** как React-компоненты
+                use: [
+                    {
+                        loader: '@svgr/webpack',
+                        options: {
+                            icon: true,
+                            esModule: true,
+                        },
+                    },
+                ],
+            },
+            {
+                test: /\.(png|jpg|jpeg|gif)$/i, // Поддержка изображений, без хеширования
+                type: 'asset/resource',
             },
-          },
         ],
-      },
-      {
-        test: /\.(png|jpg|jpeg|gif)$/i, // Поддержка изображений, без хеширования
-        type: 'asset/resource',
-      },
-    ],
-  },
-  optimization: {
-    minimize: false, // 🔥 Отключаем минимизацию JS и CSS
-    splitChunks: false, // 🔥 Отключаем разделение чанков
-    removeAvailableModules: false, // Оставляем модули без изменений
-    removeEmptyChunks: false, // Не удаляем пустые чанки
-    mergeDuplicateChunks: false, // Не объединяем дубликаты
-  },
-  performance: {
-    hints: false, // 🔥 Отключаем предупреждения о производительности
-  },
-  experiments: {
-    outputModule: false, // Отключаем ES-модули (так как UMD не поддерживает их)
-  },
+    },
+    optimization: {
+        minimize: false, // 🔥 Отключаем минимизацию JS и CSS
+        splitChunks: false, // 🔥 Отключаем разделение чанков
+        removeAvailableModules: false, // Оставляем модули без изменений
+        removeEmptyChunks: false, // Не удаляем пустые чанки
+        mergeDuplicateChunks: false, // Не объединяем дубликаты
+    },
+    performance: {
+        hints: false, // 🔥 Отключаем предупреждения о производительности
+    },
+    experiments: {
+        outputModule: false, // Отключаем ES-модули (так как UMD не поддерживает их)
+    },
 };

package/dist/stories/Button.d.ts

@@ -1,15 +0,0 @@
-import './button.css';
-export interface ButtonProps {
-    /** Is this the principal call to action on the page? */
-    primary?: boolean;
-    /** What background color to use */
-    backgroundColor?: string;
-    /** How large should the button be? */
-    size?: 'small' | 'medium' | 'large';
-    /** Button contents */
-    label: string;
-    /** Optional click handler */
-    onClick?: () => void;
-}
-/** Primary UI component for user interaction */
-export declare const Button: ({ primary, size, backgroundColor, label, ...props }: ButtonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/stories/Button.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/stories/Button.tsx"],"names":[],"mappings":"AAEA,OAAO,cAAc,CAAC;AAEtB,MAAM,WAAW,WAAW;IAC1B,wDAAwD;IACxD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,mCAAmC;IACnC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,sCAAsC;IACtC,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC,sBAAsB;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,6BAA6B;IAC7B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,gDAAgD;AAChD,eAAO,MAAM,MAAM,wDAMhB,WAAW,4CAYb,CAAC"}

package/dist/stories/Button.stories.d.ts

@@ -1,23 +0,0 @@
-import type { StoryObj } from '@storybook/react';
-declare const meta: {
-    title: string;
-    component: ({ primary, size, backgroundColor, label, ...props }: import("./Button").ButtonProps) => import("react/jsx-runtime").JSX.Element;
-    parameters: {
-        layout: string;
-    };
-    tags: string[];
-    argTypes: {
-        backgroundColor: {
-            control: "color";
-        };
-    };
-    args: {
-        onClick: import("@vitest/spy").Mock<(...args: any[]) => any>;
-    };
-};
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;
-export declare const Secondary: Story;
-export declare const Large: Story;
-export declare const Small: Story;

package/dist/stories/Button.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Button.stories.d.ts","sourceRoot":"","sources":["../../src/stories/Button.stories.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAMvD,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;CAeqB,CAAC;AAEhC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAGnC,eAAO,MAAM,OAAO,EAAE,KAKrB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAIvB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAKnB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAKnB,CAAC"}

package/dist/stories/Header.d.ts

@@ -1,12 +0,0 @@
-import './header.css';
-type User = {
-    name: string;
-};
-export interface HeaderProps {
-    user?: User;
-    onLogin?: () => void;
-    onLogout?: () => void;
-    onCreateAccount?: () => void;
-}
-export declare const Header: ({ user, onLogin, onLogout, onCreateAccount }: HeaderProps) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/stories/Header.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../src/stories/Header.tsx"],"names":[],"mappings":"AAGA,OAAO,cAAc,CAAC;AAEtB,KAAK,IAAI,GAAG;IACV,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,WAAW,WAAW;IAC1B,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;CAC9B;AAED,eAAO,MAAM,MAAM,iDAAkD,WAAW,4CAuC/E,CAAC"}

package/dist/stories/Header.stories.d.ts

@@ -1,18 +0,0 @@
-import type { StoryObj } from '@storybook/react';
-declare const meta: {
-    title: string;
-    component: ({ user, onLogin, onLogout, onCreateAccount }: import("./Header").HeaderProps) => import("react/jsx-runtime").JSX.Element;
-    tags: string[];
-    parameters: {
-        layout: string;
-    };
-    args: {
-        onLogin: import("@vitest/spy").Mock<(...args: any[]) => any>;
-        onLogout: import("@vitest/spy").Mock<(...args: any[]) => any>;
-        onCreateAccount: import("@vitest/spy").Mock<(...args: any[]) => any>;
-    };
-};
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const LoggedIn: Story;
-export declare const LoggedOut: Story;