@modul/mbui 0.0.5 → 0.0.6-beta-pv-52894-3a6d5f54

package/dist/BottomNavigation/BottomNavigation.d.ts

@@ -1,5 +1,13 @@
-import * as React from "react";
-declare const BottomNavigation: React.ForwardRefExoticComponent<{
-    className: string;
-} & React.RefAttributes<unknown>>;
-export { BottomNavigation };
+import * as React from 'react';
+export interface BottomNavigationLinkProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    asChild?: boolean;
+}
+export declare type IProps = {
+    className?: string;
+    children: React.ReactNode;
+};
+declare const BottomNavigationLink: React.ForwardRefExoticComponent<BottomNavigationLinkProps & React.RefAttributes<HTMLButtonElement>>;
+declare const BottomNavigationListItem: React.ForwardRefExoticComponent<IProps & React.RefAttributes<unknown>>;
+declare const BottomNavigationList: React.ForwardRefExoticComponent<IProps & React.RefAttributes<unknown>>;
+declare const BottomNavigation: React.ForwardRefExoticComponent<IProps & React.RefAttributes<unknown>>;
+export { BottomNavigation, BottomNavigationList, BottomNavigationListItem, BottomNavigationLink };

package/dist/BottomNavigation/BottomNavigation.js

@@ -1,35 +1,26 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.BottomNavigation = void 0;
+exports.BottomNavigationLink = exports.BottomNavigationListItem = exports.BottomNavigationList = exports.BottomNavigation = void 0;
 const tslib_1 = require("tslib");
 const React = (0, tslib_1.__importStar)(require("react"));
-const Icon_1 = require("../Icon");
-const btnClasses = "block hover:bg-btn-ghost-hover focus:bg-btn-ghost-focus active:bg-btn-ghost-active p-[8px] w-full text-[10px] text-center hover:text-primary leading-[1.33] transition duration-300";
-const iconClasses = "block mx-auto mb-[8px]";
-const BottomNavigation = React.forwardRef(({ className, ...props }, ref) => {
-    return (React.createElement("nav", { className: "" },
-        React.createElement("ul", { role: "list", className: "grid grid-flow-col" },
-            React.createElement("li", { className: "" },
-                React.createElement("a", { className: btnClasses, href: "" },
-                    React.createElement(Icon_1.Home, { width: "24px", height: "24px", fill: "red", className: "block mx-auto mb-[8px]" }),
-                    "\u0413\u043B\u0430\u0432\u043D\u0430\u044F")),
-            React.createElement("li", { className: "" },
-                React.createElement("a", { className: btnClasses, href: "" },
-                    React.createElement(Icon_1.Payment, { width: "24px", height: "24px", className: iconClasses }),
-                    "\u041F\u043B\u0430\u0442\u0435\u0436\u0438")),
-            React.createElement("li", { className: "" },
-                React.createElement("a", { className: btnClasses, href: "" },
-                    React.createElement(Icon_1.Clock, { width: "24px", height: "24px", className: iconClasses }),
-                    "\u0418\u0441\u0442\u043E\u0440\u0438\u044F")),
-            React.createElement("li", { className: "" },
-                React.createElement("a", { className: btnClasses, href: "" },
-                    React.createElement(Icon_1.Services, { width: "24px", height: "24px", className: iconClasses }),
-                    "\u0421\u0435\u0440\u0432\u0438\u0441\u044B")),
-            React.createElement("li", { className: "" },
-                React.createElement("button", { className: btnClasses },
-                    React.createElement(Icon_1.ChatSolid, { width: "24px", height: "24px", className: iconClasses }),
-                    "\u0427\u0430\u0442")))));
+const react_slot_1 = require("@radix-ui/react-slot");
+const utils_1 = require("../@/lib/utils");
+const btnClasses = 'inline-flex flex-col gap-y-[8px] place-items-center hover:bg-btn-ghost-hover focus:bg-btn-ghost-focus active:bg-btn-ghost-active p-[8px] w-full text-[10px] text-center hover:text-primary leading-[1.33] transition duration-300';
+const BottomNavigationLink = React.forwardRef(({ className, asChild, ...props }, ref) => {
+    const Comp = asChild ? react_slot_1.Slot : "button";
+    return (React.createElement(Comp, { className: (0, utils_1.cn)(btnClasses, className), ref: ref, ...props }));
+});
+exports.BottomNavigationLink = BottomNavigationLink;
+BottomNavigationLink.displayName = 'BottomNavigationLink';
+const BottomNavigationListItem = React.forwardRef(({ className, children }, ref) => (React.createElement("li", { className: className }, children)));
+exports.BottomNavigationListItem = BottomNavigationListItem;
+BottomNavigationListItem.displayName = 'BottomNavigationListItem';
+const BottomNavigationList = React.forwardRef(({ className, children }, ref) => (React.createElement("ul", { className: "grid grid-flow-col" }, children)));
+exports.BottomNavigationList = BottomNavigationList;
+BottomNavigationList.displayName = 'BottomNavigationList';
+const BottomNavigation = React.forwardRef(({ className, children }, ref) => {
+    return React.createElement("nav", { className: className }, children);
 });
 exports.BottomNavigation = BottomNavigation;
-BottomNavigation.displayName = "BottomNavigation";
+BottomNavigation.displayName = 'BottomNavigation';
 //# sourceMappingURL=BottomNavigation.js.map

package/dist/BottomNavigation/BottomNavigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"BottomNavigation.js","sourceRoot":"","sources":["../../src/BottomNavigation/BottomNavigation.tsx"],"names":[],"mappings":";;;;AAAA,0DAA8B;AAC9B,kCAAoE;AAEpE,MAAM,UAAU,GAAG,qLAAqL,CAAC;AACzM,MAAM,WAAW,GAAG,wBAAwB,CAAC;AAE7C,MAAM,gBAAgB,GAAG,KAAK,CAAC,UAAU,CACvC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAwB,EAAE,GAAG,EAAE,EAAE;IAErD,OAAO,CACT,6BAAK,SAAS,EAAC,EAAE;QAChB,4BAAI,IAAI,EAAC,MAAM,EAAC,SAAS,EAAC,oBAAoB;YAC7C,4BAAI,SAAS,EAAC,EAAE;gBACf,2BAAG,SAAS,EAAE,UAAU,EAAE,IAAI,EAAC,EAAE;oBAChC,oBAAC,WAAI,IAAC,KAAK,EAAC,MAAM,EAAC,MAAM,EAAC,MAAM,EAAC,IAAI,EAAC,KAAK,EAAC,SAAS,EAAC,wBAAwB,GAAE;iEAE7E,CACA;YACL,4BAAI,SAAS,EAAC,EAAE;gBACf,2BAAG,SAAS,EAAE,UAAU,EAAE,IAAI,EAAC,EAAE;oBAChC,oBAAC,cAAO,IAAC,KAAK,EAAC,MAAM,EAAC,MAAM,EAAC,MAAM,EAAC,SAAS,EAAE,WAAW,GAAG;iEAE1D,CACA;YACL,4BAAI,SAAS,EAAC,EAAE;gBACf,2BAAG,SAAS,EAAE,UAAU,EAAE,IAAI,EAAC,EAAE;oBAChC,oBAAC,YAAK,IAAC,KAAK,EAAC,MAAM,EAAC,MAAM,EAAC,MAAM,EAAC,SAAS,EAAE,WAAW,GAAG;iEAExD,CACA;YACL,4BAAI,SAAS,EAAC,EAAE;gBACf,2BAAG,SAAS,EAAE,UAAU,EAAE,IAAI,EAAC,EAAE;oBAChC,oBAAC,eAAQ,IAAC,KAAK,EAAC,MAAM,EAAC,MAAM,EAAC,MAAM,EAAC,SAAS,EAAE,WAAW,GAAG;iEAE3D,CACA;YACL,4BAAI,SAAS,EAAC,EAAE;gBACf,gCAAQ,SAAS,EAAE,UAAU;oBAC5B,oBAAC,gBAAS,IAAC,KAAK,EAAC,MAAM,EAAC,MAAM,EAAC,MAAM,EAAC,SAAS,EAAE,WAAW,GAAG;yCAEvD,CACL,CACD,CACA,CACH,CAAA;AACH,CAAC,CACF,CAAA;AAIQ,4CAAgB;AAFzB,gBAAgB,CAAC,WAAW,GAAG,kBAAkB,CAAA"}
+{"version":3,"file":"BottomNavigation.js","sourceRoot":"","sources":["../../src/BottomNavigation/BottomNavigation.tsx"],"names":[],"mappings":";;;;AAAA,0DAA8B;AAC9B,qDAA2C;AAC3C,0CAAmC;AAWnC,MAAM,UAAU,GACf,mOAAmO,CAAA;AAEpO,MAAM,oBAAoB,GAAG,KAAK,CAAC,UAAU,CAA+C,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACrI,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC,iBAAI,CAAC,CAAC,CAAC,QAAQ,CAAA;IACtC,OAAO,CACN,oBAAC,IAAI,IACJ,SAAS,EAAE,IAAA,UAAE,EAAC,UAAU,EAAE,SAAS,CAAC,EACpC,GAAG,EAAE,GAAG,KACJ,KAAK,GACR,CACF,CAAA;AACF,CAAC,CAAC,CAAA;AAmByE,oDAAoB;AAjB/F,oBAAoB,CAAC,WAAW,GAAG,sBAAsB,CAAA;AAEzD,MAAM,wBAAwB,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAU,EAAE,GAAG,EAAE,EAAE,CAAC,CAC3F,4BAAI,SAAS,EAAE,SAAS,IAAG,QAAQ,CAAM,CACzC,CAAC,CAAA;AAa+C,4DAAwB;AAZzE,wBAAwB,CAAC,WAAW,GAAG,0BAA0B,CAAA;AAEjE,MAAM,oBAAoB,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAU,EAAE,GAAG,EAAE,EAAE,CAAC,CACvF,4BAAI,SAAS,EAAC,oBAAoB,IAAE,QAAQ,CAAM,CAClD,CAAC,CAAA;AAQyB,oDAAoB;AAP/C,oBAAoB,CAAC,WAAW,GAAG,sBAAsB,CAAA;AAEzD,MAAM,gBAAgB,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAU,EAAE,GAAG,EAAE,EAAE;IAClF,OAAO,6BAAK,SAAS,EAAE,SAAS,IAAG,QAAQ,CAAO,CAAA;AACnD,CAAC,CAAC,CAAA;AAGO,4CAAgB;AAFzB,gBAAgB,CAAC,WAAW,GAAG,kBAAkB,CAAA"}

package/dist/BottomNavigation/index.d.ts

@@ -1,3 +1 @@
-import { BottomNavigation } from './BottomNavigation';
-export { BottomNavigation };
-export default BottomNavigation;
+export { BottomNavigation, BottomNavigationList, BottomNavigationListItem, BottomNavigationLink } from './BottomNavigation';

package/dist/BottomNavigation/index.js

@@ -1,7 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.BottomNavigation = void 0;
-const BottomNavigation_1 = require("./BottomNavigation");
+exports.BottomNavigationLink = exports.BottomNavigationListItem = exports.BottomNavigationList = exports.BottomNavigation = void 0;
+var BottomNavigation_1 = require("./BottomNavigation");
 Object.defineProperty(exports, "BottomNavigation", { enumerable: true, get: function () { return BottomNavigation_1.BottomNavigation; } });
-exports.default = BottomNavigation_1.BottomNavigation;
+Object.defineProperty(exports, "BottomNavigationList", { enumerable: true, get: function () { return BottomNavigation_1.BottomNavigationList; } });
+Object.defineProperty(exports, "BottomNavigationListItem", { enumerable: true, get: function () { return BottomNavigation_1.BottomNavigationListItem; } });
+Object.defineProperty(exports, "BottomNavigationLink", { enumerable: true, get: function () { return BottomNavigation_1.BottomNavigationLink; } });
 //# sourceMappingURL=index.js.map

package/dist/BottomNavigation/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/BottomNavigation/index.ts"],"names":[],"mappings":";;;AAAA,yDAAqD;AAE5C,iGAFA,mCAAgB,OAEA;AAEzB,kBAAe,mCAAgB,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/BottomNavigation/index.ts"],"names":[],"mappings":";;;AAAA,uDAA2H;AAAlH,oHAAA,gBAAgB,OAAA;AAAE,wHAAA,oBAAoB,OAAA;AAAE,4HAAA,wBAAwB,OAAA;AAAE,wHAAA,oBAAoB,OAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@modul/mbui",
-  "version": "0.0.5",
+  "version": "0.0.6-beta-pv-52894-3a6d5f54",
   "packageManager": "yarn@3.5.1",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",

package/src/BottomNavigation/BottomNavigation.tsx

@@ -1,51 +1,45 @@
-import * as React from "react"
-import { Home, Services, ChatSolid, Clock, Payment } from "../Icon";
-
-const btnClasses = "block hover:bg-btn-ghost-hover focus:bg-btn-ghost-focus active:bg-btn-ghost-active p-[8px] w-full text-[10px] text-center hover:text-primary leading-[1.33] transition duration-300";
-const iconClasses = "block mx-auto mb-[8px]";
-
-const BottomNavigation = React.forwardRef(
-  ({ className, ...props } : {className: string}, ref) => {
-
-    return (
-		<nav className="">
-			<ul role="list" className="grid grid-flow-col">
-				<li className="">
-					<a className={btnClasses} href="">
-						<Home width="24px" height="24px" fill="red" className="block mx-auto mb-[8px]"/>
-						Главная
-					</a>
-				</li>
-				<li className="">
-					<a className={btnClasses} href="">
-						<Payment width="24px" height="24px" className={iconClasses}/>
-						Платежи
-					</a>
-				</li>
-				<li className="">
-					<a className={btnClasses} href="">
-						<Clock width="24px" height="24px" className={iconClasses}/>
-						История
-					</a>
-				</li>
-				<li className="">
-					<a className={btnClasses} href="">
-						<Services width="24px" height="24px" className={iconClasses}/>
-						Сервисы
-					</a>
-				</li>
-				<li className="">
-					<button className={btnClasses}>
-						<ChatSolid width="24px" height="24px" className={iconClasses}/>
-						Чат
-					</button>
-				</li>
-			</ul>
-		</nav>
-    )
-  }
-)
-
-BottomNavigation.displayName = "BottomNavigation"
-
-export { BottomNavigation }
+import * as React from 'react'
+import { Slot } from '@radix-ui/react-slot'
+import { cn } from '../@/lib/utils'
+
+export interface BottomNavigationLinkProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+	asChild?: boolean
+}
+
+export type IProps = {
+	className?: string
+	children: React.ReactNode
+}
+
+const btnClasses =
+	'inline-flex flex-col gap-y-[8px] place-items-center hover:bg-btn-ghost-hover focus:bg-btn-ghost-focus active:bg-btn-ghost-active p-[8px] w-full text-[10px] text-center hover:text-primary leading-[1.33] transition duration-300'
+
+const BottomNavigationLink = React.forwardRef<HTMLButtonElement, BottomNavigationLinkProps>(({ className, asChild, ...props }, ref) => {
+	const Comp = asChild ? Slot : "button"
+	return (
+		<Comp
+			className={cn(btnClasses, className)}
+			ref={ref}
+			{...props}
+		/>
+	)
+})
+
+BottomNavigationLink.displayName = 'BottomNavigationLink'
+
+const BottomNavigationListItem = React.forwardRef(({ className, children }: IProps, ref) => (
+	<li className={className}>{children}</li>
+))
+BottomNavigationListItem.displayName = 'BottomNavigationListItem'
+
+const BottomNavigationList = React.forwardRef(({ className, children }: IProps, ref) => (
+	<ul className="grid grid-flow-col">{children}</ul>
+))
+BottomNavigationList.displayName = 'BottomNavigationList'
+
+const BottomNavigation = React.forwardRef(({ className, children }: IProps, ref) => {
+	return <nav className={className}>{children}</nav>
+})
+BottomNavigation.displayName = 'BottomNavigation'
+
+export { BottomNavigation, BottomNavigationList, BottomNavigationListItem, BottomNavigationLink }

package/src/BottomNavigation/index.ts

@@ -1,6 +1 @@
-import { BottomNavigation } from './BottomNavigation'
-
-export { BottomNavigation }
-
-export default BottomNavigation
-
+export { BottomNavigation, BottomNavigationList, BottomNavigationListItem, BottomNavigationLink } from './BottomNavigation'