@bbki.ng/components 2.0.0 → 2.1.2

package/dist/style.css

@@ -0,0 +1 @@
+*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}: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: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:where([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:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;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::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}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::-webkit-backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.p-8{padding:2rem}

package/package.json

@@ -1,43 +1,36 @@
 {
   "name": "@bbki.ng/components",
-  "version": "2.0.0",
-  "main": "./dist/index.js",
-  "module": "./dist/index.mjs",
-  "types": "./dist/index.d.ts",
-  "sideEffects": false,
-  "license": "MIT",
+  "version": "2.1.2",
+  "type": "module",
   "files": [
-    "dist/**"
+    "dist"
   ],
-  "scripts": {
-    "build": "tsup src/index.tsx --format esm,cjs --dts --external react --external classnames --external react-router-dom",
-    "dev": "tsup src/index.tsx --format esm,cjs --watch --dts --external react --external classnames --external react-router-dom",
-    "lint": "prettier --write \"**/*.{ts,tsx,md}\"",
-    "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist"
-  },
-  "devDependencies": {
-    "@bbki.ng/eslint-preset": "1.0.2",
-    "@bbki.ng/tsconfig": "1.1.1",
-    "@types/react": "^17.0.13",
-    "@types/react-dom": "^17.0.8",
-    "@types/react-router-dom": "^5.3.2",
-    "autoprefixer": "^10.4.0",
-    "postcss": "^8.4.5",
-    "postcss-flexbugs-fixes": "^5.0.2",
-    "react": "^17.0.2",
-    "tailwindcss": "^3.0.7",
-    "tsup": "^5.10.1",
-    "typescript": "^4.5.3"
+  "main": "./dist/components.cjs",
+  "module": "./dist/components.js",
+  "exports": {
+    ".": {
+      "import": "./dist/components.js",
+      "require": "./dist/components.umd.cjs"
+    }
   },
-  "publishConfig": {
-    "access": "public"
+  "dependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
   },
-  "peerDependencies": {
-    "@tailwindcss/typography": "^0.5.0",
-    "classnames": "^2.3.1",
-    "react-router-dom": "5.3.0"
+  "devDependencies": {
+    "@types/node": "18.6.1",
+    "@types/react": "^18.0.15",
+    "@types/react-dom": "^18.0.6",
+    "@vitejs/plugin-react": "^2.0.0",
+    "autoprefixer": "10.4.7",
+    "postcss": "8.4.14",
+    "tailwindcss": "3.1.6",
+    "typescript": "^4.6.4",
+    "vite": "^3.0.0"
   },
-  "dependencies": {
-    "phenomenon": "^1.6.0"
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "preview": "vite preview"
   }
-}
+}

package/dist/index.d.ts

@@ -1,289 +0,0 @@
-import * as React from 'react';
-import React__default, { FunctionComponent, EventHandler, ReactElement, ReactNode, CSSProperties, Ref } from 'react';
-import { LinkProps as LinkProps$1 } from 'react-router-dom';
-
-declare type ArticleProps = {
-    title: any;
-    className?: string;
-    content?: any;
-    children: any;
-    description?: any;
-};
-declare const Article: FunctionComponent<ArticleProps>;
-
-declare enum ButtonType {
-    DANGER = "danger",
-    PRIMARY = "primary",
-    NORMAL = "normal",
-    DISABLED = "disabled"
-}
-interface ButtonProps {
-    className?: string;
-    children: React__default.ReactNode;
-    type?: ButtonType;
-    onClick: EventHandler<React__default.MouseEvent<HTMLButtonElement>>;
-}
-declare function Button(props: ButtonProps): JSX.Element;
-declare namespace Button {
-    var displayName: string;
-}
-
-declare type LogoProps = {
-    className?: string;
-};
-declare const Logo: React.MemoExoticComponent<(props: LogoProps) => JSX.Element>;
-
-declare type PathObj = {
-    path?: string;
-    name: string;
-};
-declare type BreadcrumbProps = {
-    paths: PathObj[];
-};
-declare const Breadcrumb: (props: BreadcrumbProps) => JSX.Element;
-
-declare type NavProps = {
-    paths: PathObj[];
-    loading?: boolean;
-    mini?: boolean;
-    className?: string;
-};
-declare const Nav: (props: NavProps) => JSX.Element;
-
-declare enum LinkColor {
-    BLUE = "blue",
-    RED = "red",
-    GRAY = "gray"
-}
-interface LinkProps extends LinkProps$1 {
-    color?: LinkColor;
-    className?: string;
-    external?: boolean;
-    name?: any;
-    children?: any;
-    to: string;
-}
-declare const Link: (props: LinkProps) => JSX.Element;
-
-interface TagProps extends Pick<LinkProps, "to" | "children" | "className"> {
-    name?: string;
-}
-declare const Tag: (props: TagProps) => JSX.Element;
-declare const Tags: (props: {
-    tags: TagProps[];
-    className?: string;
-}) => JSX.Element;
-
-declare type PanelProps = {
-    width?: number;
-    children: any;
-    className?: string;
-};
-declare const Panel: (props: PanelProps) => JSX.Element;
-
-declare type PageProps = {
-    nav: ReactElement;
-    main: ReactElement;
-    footer: ReactNode;
-};
-declare const Page: (props: PageProps) => JSX.Element;
-declare const NotFound: (props: {
-    children?: any;
-}) => JSX.Element;
-declare const Error: (props: {
-    error: Error;
-}) => JSX.Element;
-declare class ErrorBoundary extends React__default.Component<{
-    children: any;
-}, {
-    error?: Error;
-    hasError: boolean;
-}> {
-    constructor(props: {
-        children: any;
-    });
-    static getDerivedStateFromError(error: Error): {
-        hasError: boolean;
-        error: Error;
-    };
-    render(): any;
-}
-
-declare type PopConfirmProps = {
-    onOk?: EventHandler<React__default.MouseEvent<HTMLButtonElement>> | (() => Promise<void>);
-    onCancel?: EventHandler<React__default.MouseEvent<HTMLButtonElement>>;
-    className?: string;
-    content?: any;
-    children?: any;
-    width?: number;
-};
-declare const PopConfirm: (props: PopConfirmProps) => JSX.Element;
-
-declare type TableProps = {
-    rowCount: number;
-    rowRenderer: (index: number) => any;
-    headerRenderer?: () => any;
-    className?: string;
-};
-declare const Table: {
-    (props: TableProps): JSX.Element;
-    HCell(props: {
-        children: any;
-        style?: CSSProperties;
-    }): JSX.Element;
-    Cell(props: {
-        children: any;
-        style?: CSSProperties;
-    }): JSX.Element;
-};
-
-declare enum SkeletonColor {
-    BLUE = "blue",
-    RED = "red",
-    GRAY = "gray",
-    BLACK = "black"
-}
-interface SkeletonProps {
-    className?: string;
-    width?: number;
-    height?: number;
-    bgColor?: SkeletonColor;
-}
-interface ArticleSkeletonProps extends SkeletonProps {
-    titleLength?: number;
-    descriptionLength?: number;
-    children?: any;
-}
-interface LinkListSkeletonProps extends ArticleSkeletonProps {
-    linksLength: number[];
-}
-declare const Skeleton: (props: SkeletonProps) => JSX.Element;
-declare const ArticleSkeleton: (props: ArticleSkeletonProps) => JSX.Element;
-declare const LinkListSkeleton: (props: LinkListSkeletonProps) => JSX.Element;
-
-interface ImagePreviewerProps {
-    className?: string;
-    visible: boolean;
-    imageRef: Ref<HTMLImageElement>;
-    imageSrc: string;
-    imageSize: {
-        width: number;
-        height: number;
-    };
-}
-interface ImageDropProps<T> {
-    uploader: (file: File, img?: HTMLImageElement) => Promise<T>;
-    onDrop?: (events: Event, file: File) => void;
-    onUploadFinish?: (result: T) => void;
-    waitTimeAfterFinish?: number;
-    defaultBgColor?: string;
-    dragOverBgColor?: string;
-    dropAreaStyle?: CSSStyleDeclaration;
-    placeholder?: any;
-    className?: string;
-    ghost?: boolean;
-    children?: (props: ImagePreviewerProps) => ReactNode;
-}
-declare const DropImage: FunctionComponent<ImageDropProps<any>>;
-
-declare type BLinkDotProps = {
-    className?: string;
-};
-declare const BlinkDot: (props: BLinkDotProps) => JSX.Element;
-
-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>;
-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;
-
-interface NoiseCoverProps {
-    className?: string;
-    width?: number;
-    height?: number;
-    children?: any;
-    color?: string;
-}
-declare const NoiseCover: (props: NoiseCoverProps) => JSX.Element;
-
-declare enum ossProcessType {
-    THUMBNAIL = "thumbnail",
-    WEBP = "webp",
-    NULL = "null",
-    oWEBP = "owebp",
-    PROG = "prog"
-}
-interface Photo {
-    src: string;
-    width: number;
-    height: number;
-    processType?: ossProcessType;
-    avgColor?: string;
-    thumbnailSrc?: string;
-    renderedWidth?: number;
-}
-interface ImgProps extends Photo {
-    className?: string;
-    size?: "large" | "normal";
-    removeBlurBgAfterLoad?: boolean;
-}
-
-declare const Img: (props: ImgProps) => JSX.Element;
-
-interface RandomRowsLayoutProps {
-    classNames?: string;
-    cellWrapperClsGenerator?: (colNum: number, randBoolean: boolean) => string;
-    cellsCount: number;
-    cellRenderer: (index: number, randomBool: boolean, col: number) => React__default.ReactNode;
-}
-
-declare type ImageRenderer = (Img: ReactElement, index: number, col: number, randBool: boolean) => ReactNode;
-interface GalleryProps extends Omit<RandomRowsLayoutProps, "classNames" | "cellsCount" | "cellRenderer"> {
-    className?: string;
-    images: ImgProps[];
-    children?: ReactNode;
-    imageRenderer?: ImageRenderer;
-}
-declare const Gallery: (props: GalleryProps) => JSX.Element;
-
-interface ISettings {
-    canvas?: HTMLCanvasElement;
-    step?: number;
-}
-
-interface IOpt {
-    multiplier: number;
-    color: number[];
-    offset?: number;
-    length: number;
-}
-
-interface LoadingSpiralProps extends IOpt, ISettings {
-    className?: string;
-    maxWidth?: number;
-    offset?: number;
-}
-declare const LoadingSpiral: (props?: LoadingSpiralProps | undefined) => JSX.Element;
-
-export { Article, ArticleProps, ArticleSkeleton, ArticleSkeletonProps, BLinkDotProps, BlinkDot, Breadcrumb, BreadcrumbProps, Button, ButtonProps, ButtonType, DropImage, Error, ErrorBoundary, Gallery, GalleryProps, ImageDropProps, ImagePreviewerProps, ImageRenderer, Img, ImgProps, Link, LinkColor, LinkList, LinkListProps, LinkListSkeleton, LinkListSkeletonProps, LinkProps, List, LoadingSpiral, LoadingSpiralProps, Logo, LogoProps, Nav, NavProps, NoiseCover, NoiseCoverProps, NotFound, Page, Panel, PanelProps, PathObj, Photo, PopConfirm, PopConfirmProps, Skeleton, SkeletonColor, SkeletonProps, Table, TableProps, Tag, TagProps, Tags, ThreeColLayout, TitledList, TitledListProps, listProps, ossProcessType, threeColLayoutProps };