md-components-mdigial-azamat 0.0.51 → 0.0.54

package/README.md

@@ -1,57 +1,128 @@
-<img width="500" alt="ViteReactComponentLibrary" src="https://github.com/receter/my-component-library/assets/2504695/dbb53036-d228-477b-8cf8-f61cd6130776">
 
-# A simple (demo) react component library
 
-This repository was published together with an article on [how to create a react component library](https://dev.to/receter/how-to-create-a-react-component-library-using-vites-library-mode-4lma) using Vite's library mode.
+npm version patch
+npm run build
+npm publish
 
-Here is another repo that consumes this libarary: https://github.com/receter/my-component-library-consumer
 
-The demo library on npm: https://www.npmjs.com/package/@receter/my-component-library
+# MBank UI Component Library
 
-## Installation
+Библиотека компонентов для MBank - современная UI библиотека на React + TypeScript + Vite.
 
-You can install it with npm (don't expect much fanciness):
+## 📦 Установка
 
 ```bash
-npm i @receter/my-component-library
+npm install md-components-mdigial-azamat
 ```
 
-## Usage
+## 🚀 Использование
 
 ```javascript
-import { Button, Input, Label } from '@receter/my-component-library'
+import { Banner, MainBanner, Header, Footer } from 'md-components-mdigial-azamat'
 ```
 
-See this file for an example on using this library: https://github.com/receter/my-component-library-consumer/blob/main/src/App.tsx
+## 📚 Документация
 
-## React + TypeScript + Vite
+Полная документация по всем компонентам и их пропсам доступна в файле [COMPONENTS.md](./COMPONENTS.md).
 
-This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+### Категории компонентов
 
-Currently, two official plugins are available:
+Библиотека содержит **45+ компонентов**, разделенных на 12 категорий:
 
-- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
-- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
+- **Хедеры** - верхняя навигационная часть страницы
+- **Баннеры** - информационные и рекламные блоки (9 компонентов)
+- **Футеры** - нижняя часть страницы
+- **Карточки** - интерактивные карточки с информацией (10 компонентов)
+- **FAQ** - компоненты для часто задаваемых вопросов
+- **Списки** - компоненты для отображения списков элементов (6 компонентов)
+- **Видео** - компоненты для воспроизведения видео (3 компонента)
+- **Таблицы** - компоненты для табличных данных (2 компонента)
+- **Навигация** - компоненты для навигации
+- **Шаги** - компоненты для многошаговых процессов
+- **Загрузка файлов** - компоненты для скачивания файлов (5 компонентов)
+- **Отступы** - компоненты для создания отступов
 
-### Expanding the ESLint configuration
+## 🛠 Разработка
 
-If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
+### Технологии
 
-- Configure the top-level `parserOptions` property like this:
+- **React 18** - UI библиотека
+- **TypeScript** - типизация
+- **Vite** - сборщик и dev-сервер
+- **Tailwind CSS** - стилизация
+- **ESLint + Prettier** - линтинг и форматирование
+
+### Доступные команды
+
+```bash
+# Запуск dev-сервера
+npm run dev
+
+# Сборка библиотеки
+npm run build
+
+# Линтинг кода
+npm run lint
+
+# Форматирование кода
+npm run prettier
+
+# Предпросмотр сборки
+npm run preview
+```
+
+### Структура проекта
 
-```js
-   parserOptions: {
-    ecmaVersion: 'latest',
-    sourceType: 'module',
-    project: ['./tsconfig.json', './tsconfig.node.json'],
-    tsconfigRootDir: __dirname,
-   },
+```
+src/
+├── components/          # Компоненты библиотеки
+│   ├── Banner/         # Компонент баннера
+│   ├── MainBanner/     # Главный баннер
+│   ├── Header/         # Хедер
+│   ├── Footer/         # Футер
+│   └── ...             # Другие компоненты
+├── shared/             # Общие утилиты и типы
+│   ├── ui/            # UI компоненты
+│   ├── types/         # TypeScript типы
+│   └── utils/         # Утилиты
+└── ...
 ```
 
-- Replace `plugin:@typescript-eslint/recommended` to `plugin:@typescript-eslint/recommended-type-checked` or `plugin:@typescript-eslint/strict-type-checked`
-- Optionally add `plugin:@typescript-eslint/stylistic-type-checked`
-- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and add `plugin:react/recommended` & `plugin:react/jsx-runtime` to the `extends` list
+## 📝 Публикация пакета
 
+```bash
+# Обновление версии (patch/minor/major)
 npm version patch
+
+# Сборка проекта
 npm run build
+
+# Публикация в npm registry
 npm publish
+```
+
+**Важно:** Убедитесь, что вы авторизованы в npm и имеете права на публикацию пакета:
+```bash
+npm login
+```
+
+## 🔧 Конфигурация ESLint
+
+Для продакшн приложений рекомендуется расширить конфигурацию ESLint:
+
+```js
+parserOptions: {
+  ecmaVersion: 'latest',
+  sourceType: 'module',
+  project: ['./tsconfig.json', './tsconfig.node.json'],
+  tsconfigRootDir: __dirname,
+}
+```
+
+## 📄 Лицензия
+
+Проект разработан для MBank.
+
+## 👤 Автор
+
+**Azamat Raimbekov**

package/dist/AllComponents.js

@@ -1,4 +1,4 @@
-import { M as o, B as t, C as n, S as r, a as e, V as a, b as i, c as p, d as m, e as s, f as d, P as l, g as c, W as D, F as L, D as f, h as C, i as B, j as F, I as y, k, l as w, A as I, m as S, T as _, n as g, E as M, o as P, p as V, q as u, r as T, s as b, t as A } from "./data.mock-61df66ed.js";
+import { M as o, B as t, C as n, S as r, a as e, V as a, b as i, c as p, d as m, e as s, f as d, P as l, g as c, W as D, F as L, D as f, h as C, i as B, j as F, I as y, k, l as w, A as I, m as S, T as _, n as g, E as M, o as P, p as V, q as u, r as T, s as b, t as A } from "./data.mock-8d89834d.js";
 import H from "./AnimatedSwiper/index.js";
 import { Banner as h } from "./Banner/Banner.js";
 import { CardIconList as q } from "./CardIconList/CardIconList.js";
@@ -44,7 +44,7 @@ import { DownloadFileMini as Do } from "./DownloadFile/components/DownloadFileMi
 import "./Faq/components/Collapse/Collapse.js";
 import "react/jsx-runtime";
 import "react";
-import "./index-10605794.js";
+import "./index-1211cb6b.js";
 import "./const-53dff524.js";
 import "./InstructionList/components/InstructionCard/InstructionCard.js";
 import "./PreviewList/components/PreviewCard/PreviewCard.js";

package/dist/Banner/Banner.js

@@ -1,6 +1,6 @@
 import { jsx as t, jsxs as o } from "react/jsx-runtime";
 import { FieldTypes as x } from "../Types/FiledTypes.js";
-import { B as b } from "../index-10605794.js";
+import { B as b } from "../index-1211cb6b.js";
 import { B as N, c as _ } from "../const-53dff524.js";
 import { C as y } from "../ComponentContainer-cdb2528c.js";
 import { I as g } from "../index-2265d593.js";

package/dist/CardImageList/CardImageList.js

@@ -2,7 +2,7 @@ import { jsx as e, jsxs as p } from "react/jsx-runtime";
 import { CardImage as n } from "../Cards/CardImage/CardImage.js";
 import { CardImageVariant as o } from "../Cards/CardImage/types.js";
 import { FieldTypes as t } from "../Types/FiledTypes.js";
-import { B as c } from "../index-10605794.js";
+import { B as c } from "../index-1211cb6b.js";
 import { B as d } from "../const-53dff524.js";
 import { C as f } from "../ComponentContainer-cdb2528c.js";
 import { c as m } from "../cn-6a4bf187.js";

package/dist/CardInfoTable/index.js

@@ -3,7 +3,7 @@ import { forwardRef as g } from "react";
 import { FieldTypes as i } from "../Types/FiledTypes.js";
 import { C as h } from "../ComponentContainer-cdb2528c.js";
 import { c as p } from "../cn-6a4bf187.js";
-import { B as y } from "../index-10605794.js";
+import { B as y } from "../index-1211cb6b.js";
 import { b as w, a as u } from "../const-53dff524.js";
 import { I as _ } from "../index-2265d593.js";
 const d = {

package/dist/Cards/ContentCard/ContentCard.js

@@ -1,6 +1,6 @@
 import { jsxs as r, jsx as a } from "react/jsx-runtime";
 import { HtmlContent as o } from "../../HtmlContent/HtmlContent.js";
-import { B as t } from "../../index-10605794.js";
+import { B as t } from "../../index-1211cb6b.js";
 import { c as s } from "../../const-53dff524.js";
 import { I as d } from "../../index-2265d593.js";
 const x = [

package/dist/Cards/WarningCard/WarningCard.js

@@ -2,7 +2,7 @@ import { jsx as r, jsxs as t } from "react/jsx-runtime";
 import { warningCardVariant as p, WarningCardVariant as e, WarningCardVariantKey as m } from "./model.js";
 import { I as x } from "../../Icon-70ea6cb8.js";
 import { B as f } from "../../const-53dff524.js";
-import { B as g } from "../../index-10605794.js";
+import { B as g } from "../../index-1211cb6b.js";
 import { C } from "../../ComponentContainer-cdb2528c.js";
 import { c as h } from "../../cn-6a4bf187.js";
 const u = [

package/dist/DownloadFile/components/DownloadFileBanner/DownloadFileBanner.js

@@ -1,7 +1,7 @@
 import { jsx as e, jsxs as l } from "react/jsx-runtime";
 import { I as o } from "../../../Icon-70ea6cb8.js";
 import { p as t } from "../../../palette-6c943596.js";
-import { B as n } from "../../../index-10605794.js";
+import { B as n } from "../../../index-1211cb6b.js";
 import { C as s } from "../../../ComponentContainer-cdb2528c.js";
 const c = ["title", "text", "link"], m = ({
   title: a,

package/dist/DownloadFile/components/DownloadFileBright/index.js

@@ -1,5 +1,5 @@
 import { jsxs as i, jsx as t } from "react/jsx-runtime";
-import { B as b } from "../../../index-10605794.js";
+import { B as b } from "../../../index-1211cb6b.js";
 import { C as r } from "../../../ComponentContainer-cdb2528c.js";
 import { I as n } from "../../../index-2265d593.js";
 import { c } from "../../../cn-6a4bf187.js";

package/dist/DownloadFile/components/DownloadFileFull/DownloadFileFull.js

@@ -2,7 +2,7 @@ import { jsx as e, jsxs as t } from "react/jsx-runtime";
 import { DataTypesEnum as s, FieldTypes as o } from "../../../Types/FiledTypes.js";
 import { I as r } from "../../../Icon-70ea6cb8.js";
 import { p as n } from "../../../palette-6c943596.js";
-import { B as i } from "../../../index-10605794.js";
+import { B as i } from "../../../index-1211cb6b.js";
 import { b as p } from "../../../const-53dff524.js";
 import { C as c } from "../../../ComponentContainer-cdb2528c.js";
 const d = {

package/dist/DownloadFile/components/DownloadFileHalf/DownloadFileHalf.js

@@ -1,7 +1,7 @@
 import { jsx as r, jsxs as a } from "react/jsx-runtime";
 import { I as n } from "../../../Icon-70ea6cb8.js";
 import { p as e } from "../../../palette-6c943596.js";
-import { B as s } from "../../../index-10605794.js";
+import { B as s } from "../../../index-1211cb6b.js";
 import { b as c } from "../../../const-53dff524.js";
 import { C as i } from "../../../ComponentContainer-cdb2528c.js";
 const p = ["data"], d = ({ data: l }) => /* @__PURE__ */ r(i, { children: /* @__PURE__ */ r("div", { className: "grid grid-cols-2 gap-6 max-tablet:grid-cols-1", children: l == null ? void 0 : l.map((o) => /* @__PURE__ */ a(

package/dist/DownloadFile/components/DownloadFileMini/DownloadFileMini.js

@@ -2,7 +2,7 @@ import { jsx as a, jsxs as e } from "react/jsx-runtime";
 import { DataTypesEnum as s, FieldTypes as r } from "../../../Types/FiledTypes.js";
 import { I as n } from "../../../Icon-70ea6cb8.js";
 import { p } from "../../../palette-6c943596.js";
-import { B as i } from "../../../index-10605794.js";
+import { B as i } from "../../../index-1211cb6b.js";
 import { b as t } from "../../../const-53dff524.js";
 import { C as d } from "../../../ComponentContainer-cdb2528c.js";
 const b = {

package/dist/Faq/components/FeedbackForm/FeedbackForm.js

@@ -1,6 +1,6 @@
 import { jsx as ie, jsxs as De } from "react/jsx-runtime";
 import M, { useState as wt } from "react";
-import { B as $e } from "../../../index-10605794.js";
+import { B as $e } from "../../../index-1211cb6b.js";
 import { a as je, b as Ke } from "../../../const-53dff524.js";
 var ce = (e) => e.type === "checkbox", re = (e) => e instanceof Date, B = (e) => e == null;
 const lt = (e) => typeof e == "object";

package/dist/Header/components/HeaderCard/HeaderCard.js

@@ -1,5 +1,5 @@
 import { jsxs as l, jsx as n } from "react/jsx-runtime";
-import { B as r } from "../../../index-10605794.js";
+import { B as r } from "../../../index-1211cb6b.js";
 import { b as o, a as i } from "../../../const-53dff524.js";
 import { I as t } from "../../../index-2265d593.js";
 const p = ({ data: e }) => e ? /* @__PURE__ */ l(

package/dist/InfoBanner/index.js

@@ -1,7 +1,7 @@
 import { jsxs as b, jsx as t } from "react/jsx-runtime";
 import { c as l, a as x } from "../cn-6a4bf187.js";
 import { FieldTypes as n } from "../Types/FiledTypes.js";
-import { B as m } from "../index-10605794.js";
+import { B as m } from "../index-1211cb6b.js";
 import { I as s } from "../index-2265d593.js";
 import { u as p } from "../useScreenSize-c1b64c02.js";
 const c = {

package/dist/InstructionList/InstructionList.js

@@ -1,5 +1,5 @@
 import { jsxs as n, jsx as o } from "react/jsx-runtime";
-import { B as a } from "../index-10605794.js";
+import { B as a } from "../index-1211cb6b.js";
 import { c as i } from "../const-53dff524.js";
 import { C as p } from "../ComponentContainer-cdb2528c.js";
 import { InstructionCardData as m, InstructionCard as l } from "./components/InstructionCard/InstructionCard.js";

package/dist/IntroBanner/IntroBanner.js

@@ -1,5 +1,5 @@
 import { jsxs as a, jsx as t } from "react/jsx-runtime";
-import { B as b } from "../index-10605794.js";
+import { B as b } from "../index-1211cb6b.js";
 import { C as c } from "../ComponentContainer-cdb2528c.js";
 import { I as e } from "../index-2265d593.js";
 import { u as d } from "../useScreenSize-c1b64c02.js";

package/dist/MainBanner/MainBanner.js

@@ -1,5 +1,5 @@
 import { jsxs as o, jsx as l } from "react/jsx-runtime";
-import { B as f } from "../index-10605794.js";
+import { B as f } from "../index-1211cb6b.js";
 import { c as d } from "../const-53dff524.js";
 import { C as b } from "../ComponentContainer-cdb2528c.js";
 import { I as t } from "../index-2265d593.js";

package/dist/PreviewList/PreviewList.js

@@ -1,5 +1,5 @@
 import { jsxs as o, jsx as s } from "react/jsx-runtime";
-import { B as c } from "../index-10605794.js";
+import { B as c } from "../index-1211cb6b.js";
 import { c as d } from "../const-53dff524.js";
 import { C as l } from "../ComponentContainer-cdb2528c.js";
 import { PreviewCardData as x, PreviewCard as t } from "./components/PreviewCard/PreviewCard.js";

package/dist/PreviewList/components/PreviewCard/PreviewCard.js

@@ -1,7 +1,7 @@
 import { jsxs as i, jsx as r } from "react/jsx-runtime";
 import { FieldTypes as a } from "../../../Types/FiledTypes.js";
 import { B as o } from "../../../const-53dff524.js";
-import { B as d } from "../../../index-10605794.js";
+import { B as d } from "../../../index-1211cb6b.js";
 import { I as c } from "../../../index-2265d593.js";
 const m = ["title", "subtitle", "image", "button", "id"], v = {
   title: a.TITLE,

package/dist/RenderAllComponents/const.js

@@ -1,4 +1,4 @@
-import { M as a, B as t, u as s, C as n, S as D, a as r, V as e, b as i, c as o, d, P as l, e as C, f as B, g as L, W as m, v as w, w as p, F as I, h as g, D as F, i as S, j as c, I as M, x as P, k as f, l as u, A as V, m as T, T as W, n as b, E as x, o as h, p as k, q, r as v, s as y, t as A } from "../data.mock-61df66ed.js";
+import { M as a, B as t, u as s, C as n, S as D, a as r, V as e, b as i, c as o, d, P as l, e as C, f as B, g as L, W as m, v as w, w as p, F as I, h as g, D as F, i as S, j as c, I as M, x as P, k as f, l as u, A as V, m as T, T as W, n as b, E as x, o as h, p as k, q, r as v, s as y, t as A } from "../data.mock-8d89834d.js";
 const j = [
   a,
   t,

package/dist/StandartTable/components/CardWarning/index.js

@@ -1,7 +1,7 @@
 import { jsxs as n, jsx as s } from "react/jsx-runtime";
 import { a as r } from "../../../cn-6a4bf187.js";
 import { HtmlContent as c } from "../../../HtmlContent/HtmlContent.js";
-import { B as x } from "../../../index-10605794.js";
+import { B as x } from "../../../index-1211cb6b.js";
 import { b as p, a as t } from "../../../const-53dff524.js";
 import { I as f } from "../../../index-2265d593.js";
 const B = ({

package/dist/Stepper/Stepper.js

@@ -1,6 +1,6 @@
 import { jsx as r, jsxs as a } from "react/jsx-runtime";
 import { FieldTypes as t } from "../Types/FiledTypes.js";
-import { B as c } from "../index-10605794.js";
+import { B as c } from "../index-1211cb6b.js";
 import { B as x } from "../const-53dff524.js";
 import { C as d } from "../ComponentContainer-cdb2528c.js";
 import { I as f } from "../index-2265d593.js";

package/dist/VideoMainBanner/VideoMainBanner.js

@@ -1,7 +1,7 @@
 import { jsxs as r, jsx as e } from "react/jsx-runtime";
 import { a as t, c as u } from "../cn-6a4bf187.js";
 import { FieldTypes as m } from "../Types/FiledTypes.js";
-import { B as y } from "../index-10605794.js";
+import { B as y } from "../index-1211cb6b.js";
 import { C as g } from "../ComponentContainer-cdb2528c.js";
 import { I as w } from "../index-2265d593.js";
 const v = {

package/dist/{data.mock-61df66ed.js → data.mock-8d89834d.js}

@@ -84,13 +84,11 @@ const n = {
   id: "4",
   component_props: {
     title: "Stepper",
-    button: [
-      {
-        text: "button",
-        link: "#",
-        variant: e.Primary
-      }
-    ],
+    button: {
+      title: "Кнопка",
+      link: "#",
+      variant: e.Primary
+    },
     data: [
       {
         title: "Выберите",
@@ -170,13 +168,11 @@ const n = {
     <li>Description line</li>
   </ul>
 `,
-        button: [
-          {
-            title: "button",
-            link: "#",
-            variant: e.Primary
-          }
-        ]
+        button: {
+          title: "button",
+          link: "#",
+          variant: e.Primary
+        }
       },
       {
         title: "Content Card2",

package/dist/{index-10605794.js → index-1211cb6b.js}

@@ -4,14 +4,14 @@ import { c as m } from "./cn-6a4bf187.js";
 import { a as t, b as e } from "./const-53dff524.js";
 const y = h(
   ({
-    children: o,
-    size: s = t.XL,
-    variant: d = e.Primary,
+    children: a,
+    size: d = t.XL,
+    variant: n = e.Primary,
     loading: i = !1,
-    iconRight: a,
-    iconLeft: l,
-    className: n,
-    title: p,
+    iconRight: l,
+    iconLeft: o,
+    className: p,
+    title: s,
     ...b
   }, x) => {
     const g = {
@@ -27,21 +27,21 @@ const y = h(
       [e.Brand]: "bg-greenLight text-white hover:bg-green disabled:bg-lightGray5 disabled:cursor-not-allowed",
       [e.Grey]: "bg-greyLight text-blackBG"
     };
-    return /* @__PURE__ */ c(
+    return !a || !s ? null : /* @__PURE__ */ c(
       "button",
       {
         className: m(
           "flex items-center justify-center gap-2 border-none font-i font-medium cursor-pointer w-fit ",
-          g[s],
-          u[d],
-          n
+          g[d],
+          u[n],
+          p
         ),
         ref: x,
         ...b,
         children: [
-          i ? /* @__PURE__ */ r("span", { className: "flex justify-center items-center w-[22px] h-[22px] p-[2px] bg-transparent rounded-full border-2 border-[#0e0f11] border-t-transparent animate-spin" }) : l && /* @__PURE__ */ r("span", { className: "flex items-center", children: l }),
-          p || o,
-          a && /* @__PURE__ */ r("span", { className: "flex items-center", children: a })
+          i ? /* @__PURE__ */ r("span", { className: "flex justify-center items-center w-[22px] h-[22px] p-[2px] bg-transparent rounded-full border-2 border-[#0e0f11] border-t-transparent animate-spin" }) : o && /* @__PURE__ */ r("span", { className: "flex items-center", children: o }),
+          s || a,
+          l && /* @__PURE__ */ r("span", { className: "flex items-center", children: l })
         ]
       }
     );

package/package.json

@@ -2,7 +2,7 @@
   "name": "md-components-mdigial-azamat",
   "author": "Azamat Raimbekov",
   "private": false,
-  "version": "0.0.51",
+  "version": "0.0.54",
   "type": "module",
   "main": "dist/main.js",
   "types": "dist/main.d.ts",