@bbki.ng/components 1.5.8 → 1.5.9

package/dist/index.d.ts

@@ -1,13 +1,14 @@
-import React, { EventHandler, ReactElement, CSSProperties, Ref, ReactNode, FunctionComponent } from 'react';
+import React, { FunctionComponent, EventHandler, ReactElement, CSSProperties, Ref, ReactNode } from 'react';
 import { LinkProps as LinkProps$1 } from 'react-router-dom';
 
 declare type ArticleProps = {
-    title: string;
+    title: any;
     className?: string;
     content?: any;
     children: any;
+    description?: any;
 };
-declare const Article: (props: ArticleProps) => JSX.Element;
+declare const Article: FunctionComponent<ArticleProps>;
 
 declare enum ButtonType {
     DANGER = "danger",
@@ -55,8 +56,9 @@ interface LinkProps extends LinkProps$1 {
     color?: LinkColor;
     className?: string;
     external?: boolean;
+    name?: any;
+    children?: any;
     to: string;
-    children: any;
 }
 declare const Link: (props: LinkProps) => JSX.Element;
 
@@ -167,6 +169,17 @@ interface listProps {
     itemRenderer: (itemProps: any, index: number) => ReactElement;
     horizontal?: boolean;
 }
-declare const List: FunctionComponent<listProps>;
+declare const List: FunctionComponent<listProps>;
+interface TitledListProps extends listProps {
+    title?: any;
+    description?: any;
+}
+declare const TitledList: FunctionComponent<TitledListProps>;
+interface LinkListProps extends Omit<listProps, "itemRenderer" | "items"> {
+    title?: string;
+    description?: any;
+    links: LinkProps[];
+}
+declare const LinkList: (props: LinkListProps) => JSX.Element;
 
-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 };
+export { Article, ArticleProps, BLinkDotProps, BlinkDot, Breadcrumb, BreadcrumbProps, Button, ButtonProps, ButtonType, DropImage, ImageDropProps, ImagePreviewerProps, Link, LinkColor, LinkList, LinkListProps, LinkProps, List, Logo, LogoProps, Nav, NavProps, Page, Panel, PanelProps, PathObj, PopConfirm, PopConfirmProps, Skeleton, SkeletonColor, SkeletonProps, Table, TableProps, Tag, TagProps, Tags, ThreeColLayout, TitledList, TitledListProps, listProps, threeColLayoutProps };

package/dist/index.js

@@ -66,6 +66,7 @@ __export(src_exports, {
   DropImage: () => DropImage,
   Link: () => Link,
   LinkColor: () => LinkColor,
+  LinkList: () => LinkList,
   List: () => List,
   Logo: () => Logo,
   Nav: () => Nav,
@@ -77,21 +78,24 @@ __export(src_exports, {
   Table: () => Table,
   Tag: () => Tag,
   Tags: () => Tags,
-  ThreeColLayout: () => ThreeColLayout
+  ThreeColLayout: () => ThreeColLayout,
+  TitledList: () => TitledList
 });
 
 // src/article/Article.tsx
 var import_classnames = __toESM(require("classnames"));
 var import_react = __toESM(require("react"));
 var Article = (props) => {
-  const { title, content, children, className } = props;
+  const { title, content, children, className, description } = props;
   return /* @__PURE__ */ import_react.default.createElement("div", {
     className: (0, import_classnames.default)("article", className)
   }, /* @__PURE__ */ import_react.default.createElement("div", {
     className: "text-[2.25rem] leading-none"
   }, title), /* @__PURE__ */ import_react.default.createElement("hr", {
     className: "my-64 border-gray-200"
-  }), /* @__PURE__ */ import_react.default.createElement("div", {
+  }), description && /* @__PURE__ */ import_react.default.createElement("div", {
+    className: "mb-128"
+  }, description), /* @__PURE__ */ import_react.default.createElement("div", {
     className: "text-gray-700"
   }, children || content));
 };
@@ -668,6 +672,31 @@ var List = (props) => {
     }, itemRenderer(item, index));
   }));
 };
+var TitledList = (props) => {
+  const _a = props, { title, description } = _a, rest = __objRest(_a, ["title", "description"]);
+  if (!title) {
+    return /* @__PURE__ */ import_react17.default.createElement(List, __spreadValues({}, rest));
+  }
+  return /* @__PURE__ */ import_react17.default.createElement(Article, {
+    title,
+    description
+  }, /* @__PURE__ */ import_react17.default.createElement(List, __spreadValues({}, rest)));
+};
+var LinkList = (props) => {
+  const _a = props, { title, description, links } = _a, rest = __objRest(_a, ["title", "description", "links"]);
+  const renderLink = ({ name, to }) => {
+    return /* @__PURE__ */ import_react17.default.createElement(Link, {
+      to,
+      key: name
+    }, name);
+  };
+  return /* @__PURE__ */ import_react17.default.createElement(TitledList, __spreadValues({
+    title,
+    description,
+    items: links,
+    itemRenderer: renderLink
+  }, rest));
+};
 module.exports = __toCommonJS(src_exports);
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
@@ -679,6 +708,7 @@ module.exports = __toCommonJS(src_exports);
   DropImage,
   Link,
   LinkColor,
+  LinkList,
   List,
   Logo,
   Nav,
@@ -690,5 +720,6 @@ module.exports = __toCommonJS(src_exports);
   Table,
   Tag,
   Tags,
-  ThreeColLayout
+  ThreeColLayout,
+  TitledList
 });

package/dist/index.mjs

@@ -34,14 +34,16 @@ var __objRest = (source, exclude) => {
 import classNames from "classnames";
 import React from "react";
 var Article = (props) => {
-  const { title, content, children, className } = props;
+  const { title, content, children, className, description } = props;
   return /* @__PURE__ */ React.createElement("div", {
     className: classNames("article", className)
   }, /* @__PURE__ */ React.createElement("div", {
     className: "text-[2.25rem] leading-none"
   }, title), /* @__PURE__ */ React.createElement("hr", {
     className: "my-64 border-gray-200"
-  }), /* @__PURE__ */ React.createElement("div", {
+  }), description && /* @__PURE__ */ React.createElement("div", {
+    className: "mb-128"
+  }, description), /* @__PURE__ */ React.createElement("div", {
     className: "text-gray-700"
   }, children || content));
 };
@@ -621,6 +623,31 @@ var List = (props) => {
     }, itemRenderer(item, index));
   }));
 };
+var TitledList = (props) => {
+  const _a = props, { title, description } = _a, rest = __objRest(_a, ["title", "description"]);
+  if (!title) {
+    return /* @__PURE__ */ React16.createElement(List, __spreadValues({}, rest));
+  }
+  return /* @__PURE__ */ React16.createElement(Article, {
+    title,
+    description
+  }, /* @__PURE__ */ React16.createElement(List, __spreadValues({}, rest)));
+};
+var LinkList = (props) => {
+  const _a = props, { title, description, links } = _a, rest = __objRest(_a, ["title", "description", "links"]);
+  const renderLink = ({ name, to }) => {
+    return /* @__PURE__ */ React16.createElement(Link, {
+      to,
+      key: name
+    }, name);
+  };
+  return /* @__PURE__ */ React16.createElement(TitledList, __spreadValues({
+    title,
+    description,
+    items: links,
+    itemRenderer: renderLink
+  }, rest));
+};
 export {
   Article,
   BlinkDot,
@@ -630,6 +657,7 @@ export {
   DropImage,
   Link,
   LinkColor,
+  LinkList,
   List,
   Logo,
   Nav,
@@ -641,5 +669,6 @@ export {
   Table,
   Tag,
   Tags,
-  ThreeColLayout
+  ThreeColLayout,
+  TitledList
 };

package/package.json

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

package/dist/index.css

@@ -1,226 +0,0 @@
-/* src/main.css */
-*,
-::before,
-::after {
-  box-sizing: border-box;
-  border-width: 0;
-  border-style: solid;
-  border-color: currentColor;
-}
-::before,
-::after {
-  --tw-content: "";
-}
-html {
-  line-height: 1.5;
-  -webkit-text-size-adjust: 100%;
-  -moz-tab-size: 4;
-  -o-tab-size: 4;
-  tab-size: 4;
-  font-family:
-    pt-sans,
-    ui-sans-serif,
-    system-ui,
-    -apple-system,
-    BlinkMacSystemFont,
-    Segoe UI,
-    Roboto,
-    Helvetica Neue,
-    Arial,
-    Noto Sans,
-    sans-serif,
-    Apple Color Emoji,
-    Segoe UI Emoji,
-    Segoe UI Symbol,
-    Noto Color Emoji;
-}
-body {
-  margin: 0;
-  line-height: inherit;
-}
-hr {
-  height: 0;
-  color: inherit;
-  border-top-width: 1px;
-}
-abbr[title] {
-  -webkit-text-decoration: underline dotted;
-  text-decoration: underline dotted;
-}
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-  font-size: inherit;
-  font-weight: inherit;
-}
-a {
-  color: inherit;
-  text-decoration: inherit;
-}
-b,
-strong {
-  font-weight: bolder;
-}
-code,
-kbd,
-samp,
-pre {
-  font-family:
-    ui-monospace,
-    SFMono-Regular,
-    Menlo,
-    Monaco,
-    Consolas,
-    Liberation Mono,
-    Courier New,
-    monospace;
-  font-size: 1em;
-}
-small {
-  font-size: 80%;
-}
-sub,
-sup {
-  font-size: 75%;
-  line-height: 0;
-  position: relative;
-  vertical-align: baseline;
-}
-sub {
-  bottom: -0.25em;
-}
-sup {
-  top: -0.5em;
-}
-table {
-  text-indent: 0;
-  border-color: inherit;
-  border-collapse: collapse;
-}
-button,
-input,
-optgroup,
-select,
-textarea {
-  font-family: inherit;
-  font-size: 100%;
-  line-height: inherit;
-  color: inherit;
-  margin: 0;
-  padding: 0;
-}
-button,
-select {
-  text-transform: none;
-}
-button,
-[type=button],
-[type=reset],
-[type=submit] {
-  -webkit-appearance: button;
-  background-color: transparent;
-  background-image: none;
-}
-:-moz-focusring {
-  outline: auto;
-}
-:-moz-ui-invalid {
-  box-shadow: none;
-}
-progress {
-  vertical-align: baseline;
-}
-::-webkit-inner-spin-button,
-::-webkit-outer-spin-button {
-  height: auto;
-}
-[type=search] {
-  -webkit-appearance: textfield;
-  outline-offset: -2px;
-}
-::-webkit-search-decoration {
-  -webkit-appearance: none;
-}
-::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  font: inherit;
-}
-summary {
-  display: list-item;
-}
-blockquote,
-dl,
-dd,
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-hr,
-figure,
-p,
-pre {
-  margin: 0;
-}
-fieldset {
-  margin: 0;
-  padding: 0;
-}
-legend {
-  padding: 0;
-}
-ol,
-ul,
-menu {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-}
-textarea {
-  resize: vertical;
-}
-input::-moz-placeholder,
-textarea::-moz-placeholder {
-  opacity: 1;
-  color: #9CA3AF;
-}
-input:-ms-input-placeholder,
-textarea:-ms-input-placeholder {
-  opacity: 1;
-  color: #9CA3AF;
-}
-input::placeholder,
-textarea::placeholder {
-  opacity: 1;
-  color: #9CA3AF;
-}
-button,
-[role=button] {
-  cursor: pointer;
-}
-:disabled {
-  cursor: default;
-}
-img,
-svg,
-video,
-canvas,
-audio,
-iframe,
-embed,
-object {
-  display: block;
-  vertical-align: middle;
-}
-img,
-video {
-  max-width: 100%;
-  height: auto;
-}
-[hidden] {
-  display: none;
-}