@bbki.ng/components 1.5.7 → 1.5.8

package/dist/index.d.ts

@@ -153,4 +153,20 @@ declare type BLinkDotProps = {
 };
 declare const BlinkDot: (props: BLinkDotProps) => JSX.Element;
 
-export { Article, ArticleProps, BLinkDotProps, BlinkDot, Breadcrumb, BreadcrumbProps, Button, ButtonProps, ButtonType, DropImage, ImageDropProps, ImagePreviewerProps, Link, LinkColor, LinkProps, Logo, LogoProps, Nav, NavProps, Page, Panel, PanelProps, PathObj, PopConfirm, PopConfirmProps, Skeleton, SkeletonColor, SkeletonProps, Table, TableProps, Tag, TagProps, Tags };
+declare type threeColLayoutProps = {
+    leftRenderer?: () => ReactElement | null;
+    rightRenderer?: () => ReactElement | null;
+    middleRenderer?: () => ReactElement | null;
+};
+declare const ThreeColLayout: (props: threeColLayoutProps) => JSX.Element;
+
+interface listProps {
+    className?: string;
+    compact?: boolean;
+    items: any[];
+    itemRenderer: (itemProps: any, index: number) => ReactElement;
+    horizontal?: boolean;
+}
+declare const List: FunctionComponent<listProps>;
+
+export { Article, ArticleProps, BLinkDotProps, BlinkDot, Breadcrumb, BreadcrumbProps, Button, ButtonProps, ButtonType, DropImage, ImageDropProps, ImagePreviewerProps, Link, LinkColor, LinkProps, List, Logo, LogoProps, Nav, NavProps, Page, Panel, PanelProps, PathObj, PopConfirm, PopConfirmProps, Skeleton, SkeletonColor, SkeletonProps, Table, TableProps, Tag, TagProps, Tags, ThreeColLayout, listProps, threeColLayoutProps };

package/dist/index.js

@@ -66,6 +66,7 @@ __export(src_exports, {
   DropImage: () => DropImage,
   Link: () => Link,
   LinkColor: () => LinkColor,
+  List: () => List,
   Logo: () => Logo,
   Nav: () => Nav,
   Page: () => Page,
@@ -75,7 +76,8 @@ __export(src_exports, {
   SkeletonColor: () => SkeletonColor,
   Table: () => Table,
   Tag: () => Tag,
-  Tags: () => Tags
+  Tags: () => Tags,
+  ThreeColLayout: () => ThreeColLayout
 });
 
 // src/article/Article.tsx
@@ -628,6 +630,44 @@ var BlinkDot = (props) => {
     className: "animate-ping-fast absolute inline-flex h-full w-full rounded-full bg-red-600"
   }));
 };
+
+// src/layout/layout.tsx
+var import_classnames8 = __toESM(require("classnames"));
+var import_react16 = __toESM(require("react"));
+var ThreeColLayout = (props) => {
+  const { leftRenderer, middleRenderer, rightRenderer } = props;
+  const colCls = (0, import_classnames8.default)("max-h-full overflow-auto md:block py-64");
+  return /* @__PURE__ */ import_react16.default.createElement("div", {
+    className: "grid grid-cols-1 xl:grid-cols-3 gap-4 h-full w-full"
+  }, /* @__PURE__ */ import_react16.default.createElement("div", {
+    className: (0, import_classnames8.default)("hidden", colCls)
+  }, leftRenderer && leftRenderer()), /* @__PURE__ */ import_react16.default.createElement("div", {
+    className: (0, import_classnames8.default)(colCls, "sm:px-128 xl:px-0 no-scrollbar", "relative", {
+      hidden: !middleRenderer
+    })
+  }, middleRenderer && middleRenderer()), /* @__PURE__ */ import_react16.default.createElement("div", {
+    className: (0, import_classnames8.default)("hidden", colCls)
+  }, rightRenderer && rightRenderer()));
+};
+
+// src/list/list.tsx
+var import_classnames9 = __toESM(require("classnames"));
+var import_react17 = __toESM(require("react"));
+var List = (props) => {
+  const { items, itemRenderer, className, horizontal, compact } = props;
+  const spaceCls = compact ? "" : horizontal ? "mr-3" : "mb-4";
+  return /* @__PURE__ */ import_react17.default.createElement("ul", {
+    className: (0, import_classnames9.default)(className, "list-style-none", {
+      flex: horizontal,
+      "align-center": horizontal
+    })
+  }, items.map((item, index) => {
+    return /* @__PURE__ */ import_react17.default.createElement("li", {
+      key: item.id || index,
+      className: (0, import_classnames9.default)(spaceCls, "flex-shrink-0")
+    }, itemRenderer(item, index));
+  }));
+};
 module.exports = __toCommonJS(src_exports);
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
@@ -639,6 +679,7 @@ module.exports = __toCommonJS(src_exports);
   DropImage,
   Link,
   LinkColor,
+  List,
   Logo,
   Nav,
   Page,
@@ -648,5 +689,6 @@ module.exports = __toCommonJS(src_exports);
   SkeletonColor,
   Table,
   Tag,
-  Tags
+  Tags,
+  ThreeColLayout
 });

package/dist/index.mjs

@@ -583,6 +583,44 @@ var BlinkDot = (props) => {
     className: "animate-ping-fast absolute inline-flex h-full w-full rounded-full bg-red-600"
   }));
 };
+
+// src/layout/layout.tsx
+import cls2 from "classnames";
+import React15 from "react";
+var ThreeColLayout = (props) => {
+  const { leftRenderer, middleRenderer, rightRenderer } = props;
+  const colCls = cls2("max-h-full overflow-auto md:block py-64");
+  return /* @__PURE__ */ React15.createElement("div", {
+    className: "grid grid-cols-1 xl:grid-cols-3 gap-4 h-full w-full"
+  }, /* @__PURE__ */ React15.createElement("div", {
+    className: cls2("hidden", colCls)
+  }, leftRenderer && leftRenderer()), /* @__PURE__ */ React15.createElement("div", {
+    className: cls2(colCls, "sm:px-128 xl:px-0 no-scrollbar", "relative", {
+      hidden: !middleRenderer
+    })
+  }, middleRenderer && middleRenderer()), /* @__PURE__ */ React15.createElement("div", {
+    className: cls2("hidden", colCls)
+  }, rightRenderer && rightRenderer()));
+};
+
+// src/list/list.tsx
+import cls3 from "classnames";
+import React16 from "react";
+var List = (props) => {
+  const { items, itemRenderer, className, horizontal, compact } = props;
+  const spaceCls = compact ? "" : horizontal ? "mr-3" : "mb-4";
+  return /* @__PURE__ */ React16.createElement("ul", {
+    className: cls3(className, "list-style-none", {
+      flex: horizontal,
+      "align-center": horizontal
+    })
+  }, items.map((item, index) => {
+    return /* @__PURE__ */ React16.createElement("li", {
+      key: item.id || index,
+      className: cls3(spaceCls, "flex-shrink-0")
+    }, itemRenderer(item, index));
+  }));
+};
 export {
   Article,
   BlinkDot,
@@ -592,6 +630,7 @@ export {
   DropImage,
   Link,
   LinkColor,
+  List,
   Logo,
   Nav,
   Page,
@@ -601,5 +640,6 @@ export {
   SkeletonColor,
   Table,
   Tag,
-  Tags
+  Tags,
+  ThreeColLayout
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bbki.ng/components",
-  "version": "1.5.7",
+  "version": "1.5.8",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",