@bbki.ng/components 1.5.1 → 1.5.2

package/dist/index.d.ts

@@ -111,4 +111,16 @@ declare const Table: {
     }): JSX.Element;
 };
 
-export { Article, ArticleProps, Breadcrumb, BreadcrumbProps, Button, ButtonProps, ButtonType, Link, LinkColor, LinkProps, Logo, LogoProps, Nav, NavProps, Page, Panel, PanelProps, PathObj, PopConfirm, PopConfirmProps, Table, TableProps, Tag, TagProps, Tags };
+declare enum SkeletonColor {
+    BLUE = "blue",
+    RED = "red",
+    GRAY = "gray"
+}
+declare type SkeletonProps = {
+    width?: number;
+    height?: number;
+    bgColor?: SkeletonColor;
+};
+declare const Skeleton: (props: SkeletonProps) => JSX.Element;
+
+export { Article, ArticleProps, Breadcrumb, BreadcrumbProps, Button, ButtonProps, ButtonType, Link, LinkColor, LinkProps, Logo, LogoProps, Nav, NavProps, Page, Panel, PanelProps, PathObj, PopConfirm, PopConfirmProps, Skeleton, SkeletonColor, SkeletonProps, Table, TableProps, Tag, TagProps, Tags };

package/dist/index.js

@@ -69,6 +69,8 @@ __export(src_exports, {
   Page: () => Page,
   Panel: () => Panel,
   PopConfirm: () => PopConfirm,
+  Skeleton: () => Skeleton,
+  SkeletonColor: () => SkeletonColor,
   Table: () => Table,
   Tag: () => Tag,
   Tags: () => Tags
@@ -324,6 +326,28 @@ var Table = (props) => {
 };
 Table.HCell = (props) => /* @__PURE__ */ import_react10.default.createElement("th", __spreadValues({}, props), props.children);
 Table.Cell = (props) => /* @__PURE__ */ import_react10.default.createElement("td", __spreadValues({}, props), props.children);
+
+// src/skeleton/Seleton.tsx
+var import_classnames5 = __toESM(require("classnames"));
+var import_react11 = __toESM(require("react"));
+var SkeletonColor = /* @__PURE__ */ ((SkeletonColor2) => {
+  SkeletonColor2["BLUE"] = "blue";
+  SkeletonColor2["RED"] = "red";
+  SkeletonColor2["GRAY"] = "gray";
+  return SkeletonColor2;
+})(SkeletonColor || {});
+var COLOR_MAPPING2 = {
+  ["blue" /* BLUE */]: "bg-blue-100",
+  ["red" /* RED */]: "bg-red-100",
+  ["gray" /* GRAY */]: "bg-gray-100"
+};
+var Skeleton = (props) => {
+  const { bgColor = "gray" /* GRAY */, width = 26, height = 24 } = props;
+  return /* @__PURE__ */ import_react11.default.createElement("div", {
+    className: (0, import_classnames5.default)(COLOR_MAPPING2[bgColor], "animate-pulse", "rounded"),
+    style: { width, height }
+  });
+};
 module.exports = __toCommonJS(src_exports);
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
@@ -338,6 +362,8 @@ module.exports = __toCommonJS(src_exports);
   Page,
   Panel,
   PopConfirm,
+  Skeleton,
+  SkeletonColor,
   Table,
   Tag,
   Tags

package/dist/index.mjs

@@ -280,6 +280,28 @@ var Table = (props) => {
 };
 Table.HCell = (props) => /* @__PURE__ */ React11.createElement("th", __spreadValues({}, props), props.children);
 Table.Cell = (props) => /* @__PURE__ */ React11.createElement("td", __spreadValues({}, props), props.children);
+
+// src/skeleton/Seleton.tsx
+import classNames5 from "classnames";
+import React12 from "react";
+var SkeletonColor = /* @__PURE__ */ ((SkeletonColor2) => {
+  SkeletonColor2["BLUE"] = "blue";
+  SkeletonColor2["RED"] = "red";
+  SkeletonColor2["GRAY"] = "gray";
+  return SkeletonColor2;
+})(SkeletonColor || {});
+var COLOR_MAPPING2 = {
+  ["blue" /* BLUE */]: "bg-blue-100",
+  ["red" /* RED */]: "bg-red-100",
+  ["gray" /* GRAY */]: "bg-gray-100"
+};
+var Skeleton = (props) => {
+  const { bgColor = "gray" /* GRAY */, width = 26, height = 24 } = props;
+  return /* @__PURE__ */ React12.createElement("div", {
+    className: classNames5(COLOR_MAPPING2[bgColor], "animate-pulse", "rounded"),
+    style: { width, height }
+  });
+};
 export {
   Article,
   Breadcrumb,
@@ -292,6 +314,8 @@ export {
   Page,
   Panel,
   PopConfirm,
+  Skeleton,
+  SkeletonColor,
   Table,
   Tag,
   Tags

package/package.json

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