Socket
Socket
Sign inDemoInstall

@propelauth/base-elements

Package Overview
Dependencies
9
Maintainers
2
Versions
13
Alerts
File Explorer

Advanced tools

npm Scripts

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 0.0.10 to 0.0.11

dist/types/BaseAnchorButton.d.ts
src/BaseAnchorButton.tsx

15

dist/index.cjs.js

@@ -55,2 +55,15 @@ 'use strict';

const BaseAnchorButton = /*#__PURE__*/React.forwardRef((props, ref) => {
const {
loading,
className,
children,
...rest
} = props;
return /*#__PURE__*/React__default["default"].createElement("button", _extends({
ref: ref,
className: prepend("BaseAnchorButton", className)
}, rest), loading ? /*#__PURE__*/React__default["default"].createElement(BaseProgress, null) : children);
});
const BaseButton = /*#__PURE__*/React.forwardRef((props, ref) => {

@@ -401,2 +414,3 @@ const {

Button: BaseButton,
AnchorButton: BaseAnchorButton,
Checkbox: BaseCheckbox,

@@ -421,2 +435,3 @@ Container: BaseContainer,

exports.BaseAlert = BaseAlert;
exports.BaseAnchorButton = BaseAnchorButton;
exports.BaseButton = BaseButton;

@@ -423,0 +438,0 @@ exports.BaseCheckbox = BaseCheckbox;

16

dist/index.esm.js

@@ -47,2 +47,15 @@ import React, { forwardRef, useState, useEffect } from 'react';

const BaseAnchorButton = /*#__PURE__*/forwardRef((props, ref) => {
const {
loading,
className,
children,
...rest
} = props;
return /*#__PURE__*/React.createElement("button", _extends({
ref: ref,
className: prepend("BaseAnchorButton", className)
}, rest), loading ? /*#__PURE__*/React.createElement(BaseProgress, null) : children);
});
const BaseButton = /*#__PURE__*/forwardRef((props, ref) => {

@@ -393,2 +406,3 @@ const {

Button: BaseButton,
AnchorButton: BaseAnchorButton,
Checkbox: BaseCheckbox,

@@ -412,3 +426,3 @@ Container: BaseContainer,

export { BaseAlert, BaseButton, BaseCheckbox, BaseContainer, BaseDivider, BaseElements, BaseH1, BaseH3, BaseH5, BaseImage, BaseInput, BaseLabel, BaseLink, BaseModal, BaseParagraph, BasePopover, BaseProgress, BaseSelect, BaseTable };
export { BaseAlert, BaseAnchorButton, BaseButton, BaseCheckbox, BaseContainer, BaseDivider, BaseElements, BaseH1, BaseH3, BaseH5, BaseImage, BaseInput, BaseLabel, BaseLink, BaseModal, BaseParagraph, BasePopover, BaseProgress, BaseSelect, BaseTable };
//# sourceMappingURL=index.esm.js.map

55

dist/types/_types.d.ts
import { Dispatch, SetStateAction, CSSProperties, MouseEventHandler, ChangeEventHandler, ReactNode } from "react";
type AlertProps = {
export type AlertProps = {
type?: "error" | "info" | "success" | "warning";

@@ -8,3 +8,3 @@ className?: string;

};
type ButtonProps = {
export type ButtonProps = {
onClick?: MouseEventHandler<HTMLButtonElement>;

@@ -18,3 +18,12 @@ loading?: boolean;

};
type CheckboxProps = {
export type AnchorButtonProps = {
onClick?: MouseEventHandler<HTMLButtonElement>;
loading?: boolean;
disabled?: boolean;
id?: string;
className?: string;
style?: CSSProperties;
children?: ReactNode;
};
export type CheckboxProps = {
checked: boolean;

@@ -29,3 +38,3 @@ onChange: ChangeEventHandler<HTMLInputElement>;

};
type ContainerProps = {
export type ContainerProps = {
className?: string;

@@ -35,3 +44,3 @@ style?: CSSProperties;

};
type DividerProps = {
export type DividerProps = {
className?: string;

@@ -41,3 +50,3 @@ style?: CSSProperties;

};
type H1Props = {
export type H1Props = {
className?: string;

@@ -47,3 +56,3 @@ style?: CSSProperties;

};
type H3Props = {
export type H3Props = {
className?: string;

@@ -53,3 +62,3 @@ style?: CSSProperties;

};
type H5Props = {
export type H5Props = {
className?: string;

@@ -59,3 +68,3 @@ style?: CSSProperties;

};
type ImageProps = {
export type ImageProps = {
src: string;

@@ -66,3 +75,3 @@ alt?: string;

};
type InputProps = {
export type InputProps = {
value: string;

@@ -79,3 +88,3 @@ onChange?: ChangeEventHandler<HTMLInputElement>;

};
type LabelProps = {
export type LabelProps = {
htmlFor?: string;

@@ -86,3 +95,3 @@ className?: string;

};
type LinkProps = {
export type LinkProps = {
href: string;

@@ -93,3 +102,3 @@ className?: string;

};
type ModalProps = {
export type ModalProps = {
show: boolean;

@@ -102,3 +111,3 @@ setShow: Dispatch<SetStateAction<boolean>>;

};
type ParagraphProps = {
export type ParagraphProps = {
className?: string;

@@ -108,3 +117,3 @@ style?: CSSProperties;

};
type PopoverProps = {
export type PopoverProps = {
referenceElement: HTMLElement | null;

@@ -118,19 +127,19 @@ show: boolean;

};
type ProgressProps = {
export type ProgressProps = {
className?: string;
style?: CSSProperties;
};
type Option = {
export type Option = {
label: string;
value: string;
};
type OptionGroup = {
export type OptionGroup = {
label: string;
options: Array<Option>;
};
type Column = ReactNode;
type Row = {
export type Column = ReactNode;
export type Row = {
[key: string]: ReactNode;
};
type TableProps = {
export type TableProps = {
columns: Column[];

@@ -141,3 +150,3 @@ rows?: Row[];

};
type SelectProps = {
export type SelectProps = {
value: string;

@@ -153,2 +162,3 @@ onChange: ChangeEventHandler<HTMLSelectElement>;

export type BaseButtonProps = ButtonProps;
export type BaseAnchorButtonProps = AnchorButtonProps;
export type BaseCheckboxProps = CheckboxProps;

@@ -170,2 +180,1 @@ export type BaseContainerProps = ContainerProps;

export type BaseTableProps = TableProps;
export {};

7

dist/types/BaseAlert.d.ts
import React from "react";
export declare const BaseAlert: React.ForwardRefExoticComponent<{
type?: "error" | "info" | "success" | "warning" | undefined;
className?: string | undefined;
style?: React.CSSProperties | undefined;
children?: React.ReactNode;
} & React.RefAttributes<HTMLDivElement>>;
export declare const BaseAlert: React.ForwardRefExoticComponent<import("./_types").AlertProps & React.RefAttributes<HTMLDivElement>>;

10

dist/types/BaseButton.d.ts
import React from "react";
export declare const BaseButton: React.ForwardRefExoticComponent<{
onClick?: React.MouseEventHandler<HTMLButtonElement> | undefined;
loading?: boolean | undefined;
disabled?: boolean | undefined;
id?: string | undefined;
className?: string | undefined;
style?: React.CSSProperties | undefined;
children?: React.ReactNode;
} & React.RefAttributes<HTMLButtonElement>>;
export declare const BaseButton: React.ForwardRefExoticComponent<import("./_types").ButtonProps & React.RefAttributes<HTMLButtonElement>>;

11

dist/types/BaseCheckbox.d.ts
import React from "react";
export declare const BaseCheckbox: React.ForwardRefExoticComponent<{
checked: boolean;
onChange: React.ChangeEventHandler<HTMLInputElement>;
id?: string | undefined;
label?: React.ReactNode;
required?: boolean | undefined;
disabled?: boolean | undefined;
className?: string | undefined;
style?: React.CSSProperties | undefined;
} & React.RefAttributes<HTMLInputElement>>;
export declare const BaseCheckbox: React.ForwardRefExoticComponent<import("./_types").CheckboxProps & React.RefAttributes<HTMLInputElement>>;

6

dist/types/BaseContainer.d.ts
import React from "react";
export declare const BaseContainer: React.ForwardRefExoticComponent<{
className?: string | undefined;
style?: React.CSSProperties | undefined;
children?: React.ReactNode;
} & React.RefAttributes<HTMLDivElement>>;
export declare const BaseContainer: React.ForwardRefExoticComponent<import("./_types").ContainerProps & React.RefAttributes<HTMLDivElement>>;

6

dist/types/BaseDivider.d.ts
import React from "react";
export declare const BaseDivider: React.ForwardRefExoticComponent<{
className?: string | undefined;
style?: React.CSSProperties | undefined;
children?: React.ReactNode;
} & React.RefAttributes<HTMLDivElement>>;
export declare const BaseDivider: React.ForwardRefExoticComponent<import("./_types").DividerProps & React.RefAttributes<HTMLDivElement>>;

6

dist/types/BaseH1.d.ts
import React from "react";
export declare const BaseH1: React.ForwardRefExoticComponent<{
className?: string | undefined;
style?: React.CSSProperties | undefined;
children?: React.ReactNode;
} & React.RefAttributes<HTMLHeadingElement>>;
export declare const BaseH1: React.ForwardRefExoticComponent<import("./_types").H1Props & React.RefAttributes<HTMLHeadingElement>>;

6

dist/types/BaseH3.d.ts
import React from "react";
export declare const BaseH3: React.ForwardRefExoticComponent<{
className?: string | undefined;
style?: React.CSSProperties | undefined;
children?: React.ReactNode;
} & React.RefAttributes<HTMLHeadingElement>>;
export declare const BaseH3: React.ForwardRefExoticComponent<import("./_types").H3Props & React.RefAttributes<HTMLHeadingElement>>;

6

dist/types/BaseH5.d.ts
import React from "react";
export declare const BaseH5: React.ForwardRefExoticComponent<{
className?: string | undefined;
style?: React.CSSProperties | undefined;
children?: React.ReactNode;
} & React.RefAttributes<HTMLHeadingElement>>;
export declare const BaseH5: React.ForwardRefExoticComponent<import("./_types").H5Props & React.RefAttributes<HTMLHeadingElement>>;

7

dist/types/BaseImage.d.ts
import React from "react";
export declare const BaseImage: React.ForwardRefExoticComponent<{
src: string;
alt?: string | undefined;
className?: string | undefined;
style?: React.CSSProperties | undefined;
} & React.RefAttributes<HTMLImageElement>>;
export declare const BaseImage: React.ForwardRefExoticComponent<import("./_types").ImageProps & React.RefAttributes<HTMLImageElement>>;

13

dist/types/BaseInput.d.ts
import React from "react";
export declare const BaseInput: React.ForwardRefExoticComponent<{
value: string;
onChange?: React.ChangeEventHandler<HTMLInputElement> | undefined;
id?: string | undefined;
type?: string | undefined;
required?: boolean | undefined;
disabled?: boolean | undefined;
readOnly?: boolean | undefined;
placeholder?: string | undefined;
className?: string | undefined;
style?: React.CSSProperties | undefined;
} & React.RefAttributes<HTMLInputElement>>;
export declare const BaseInput: React.ForwardRefExoticComponent<import("./_types").InputProps & React.RefAttributes<HTMLInputElement>>;

7

dist/types/BaseLabel.d.ts
import React from "react";
export declare const BaseLabel: React.ForwardRefExoticComponent<{
htmlFor?: string | undefined;
className?: string | undefined;
style?: React.CSSProperties | undefined;
children?: React.ReactNode;
} & React.RefAttributes<HTMLLabelElement>>;
export declare const BaseLabel: React.ForwardRefExoticComponent<import("./_types").LabelProps & React.RefAttributes<HTMLLabelElement>>;

7

dist/types/BaseLink.d.ts
import React from "react";
export declare const BaseLink: React.ForwardRefExoticComponent<{
href: string;
className?: string | undefined;
style?: React.CSSProperties | undefined;
children?: React.ReactNode;
} & React.RefAttributes<HTMLAnchorElement>>;
export declare const BaseLink: React.ForwardRefExoticComponent<import("./_types").LinkProps & React.RefAttributes<HTMLAnchorElement>>;

6

dist/types/BaseParagraph.d.ts
import React from "react";
export declare const BaseParagraph: React.ForwardRefExoticComponent<{
className?: string | undefined;
style?: React.CSSProperties | undefined;
children?: React.ReactNode;
} & React.RefAttributes<HTMLParagraphElement>>;
export declare const BaseParagraph: React.ForwardRefExoticComponent<import("./_types").ParagraphProps & React.RefAttributes<HTMLParagraphElement>>;

5

dist/types/BaseProgress.d.ts
import React from "react";
export declare const BaseProgress: React.ForwardRefExoticComponent<{
className?: string | undefined;
style?: React.CSSProperties | undefined;
} & React.RefAttributes<HTMLSpanElement>>;
export declare const BaseProgress: React.ForwardRefExoticComponent<import("./_types").ProgressProps & React.RefAttributes<HTMLSpanElement>>;

19

dist/types/BaseSelect.d.ts
import React from "react";
export declare const BaseSelect: React.ForwardRefExoticComponent<{
value: string;
onChange: React.ChangeEventHandler<HTMLSelectElement>;
options?: ({
label: string;
value: string;
} | {
label: string;
options: {
label: string;
value: string;
}[];
})[] | undefined;
disabled?: boolean | undefined;
id?: string | undefined;
className?: string | undefined;
style?: React.CSSProperties | undefined;
} & React.RefAttributes<HTMLSelectElement>>;
export declare const BaseSelect: React.ForwardRefExoticComponent<import("./_types").SelectProps & React.RefAttributes<HTMLSelectElement>>;

9

dist/types/BaseTable.d.ts
import React from "react";
export declare const BaseTable: React.ForwardRefExoticComponent<{
columns: React.ReactNode[];
rows?: {
[key: string]: React.ReactNode;
}[] | undefined;
className?: string | undefined;
style?: React.CSSProperties | undefined;
} & React.RefAttributes<HTMLTableElement>>;
export declare const BaseTable: React.ForwardRefExoticComponent<import("./_types").TableProps & React.RefAttributes<HTMLTableElement>>;

160

dist/types/index.d.ts

@@ -1,3 +0,4 @@

/// <reference types="react" />
import { ForwardRefExoticComponent, RefAttributes } from "react";
import { BaseAlert } from "./BaseAlert";
import { BaseAnchorButton } from "./BaseAnchorButton";
import { BaseButton } from "./BaseButton";

@@ -21,136 +22,25 @@ import { BaseCheckbox } from "./BaseCheckbox";

import "./_styles.css";
declare const BaseElements: {
Alert: import("react").ForwardRefExoticComponent<{
type?: "error" | "info" | "success" | "warning" | undefined;
className?: string | undefined;
style?: import("react").CSSProperties | undefined;
children?: import("react").ReactNode;
} & import("react").RefAttributes<HTMLDivElement>>;
Button: import("react").ForwardRefExoticComponent<{
onClick?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
loading?: boolean | undefined;
disabled?: boolean | undefined;
id?: string | undefined;
className?: string | undefined;
style?: import("react").CSSProperties | undefined;
children?: import("react").ReactNode;
} & import("react").RefAttributes<HTMLButtonElement>>;
Checkbox: import("react").ForwardRefExoticComponent<{
checked: boolean;
onChange: import("react").ChangeEventHandler<HTMLInputElement>;
id?: string | undefined;
label?: import("react").ReactNode;
required?: boolean | undefined;
disabled?: boolean | undefined;
className?: string | undefined;
style?: import("react").CSSProperties | undefined;
} & import("react").RefAttributes<HTMLInputElement>>;
Container: import("react").ForwardRefExoticComponent<{
className?: string | undefined;
style?: import("react").CSSProperties | undefined;
children?: import("react").ReactNode;
} & import("react").RefAttributes<HTMLDivElement>>;
Divider: import("react").ForwardRefExoticComponent<{
className?: string | undefined;
style?: import("react").CSSProperties | undefined;
children?: import("react").ReactNode;
} & import("react").RefAttributes<HTMLDivElement>>;
H1: import("react").ForwardRefExoticComponent<{
className?: string | undefined;
style?: import("react").CSSProperties | undefined;
children?: import("react").ReactNode;
} & import("react").RefAttributes<HTMLHeadingElement>>;
H3: import("react").ForwardRefExoticComponent<{
className?: string | undefined;
style?: import("react").CSSProperties | undefined;
children?: import("react").ReactNode;
} & import("react").RefAttributes<HTMLHeadingElement>>;
H5: import("react").ForwardRefExoticComponent<{
className?: string | undefined;
style?: import("react").CSSProperties | undefined;
children?: import("react").ReactNode;
} & import("react").RefAttributes<HTMLHeadingElement>>;
Image: import("react").ForwardRefExoticComponent<{
src: string;
alt?: string | undefined;
className?: string | undefined;
style?: import("react").CSSProperties | undefined;
} & import("react").RefAttributes<HTMLImageElement>>;
Input: import("react").ForwardRefExoticComponent<{
value: string;
onChange?: import("react").ChangeEventHandler<HTMLInputElement> | undefined;
id?: string | undefined;
type?: string | undefined;
required?: boolean | undefined;
disabled?: boolean | undefined;
readOnly?: boolean | undefined;
placeholder?: string | undefined;
className?: string | undefined;
style?: import("react").CSSProperties | undefined;
} & import("react").RefAttributes<HTMLInputElement>>;
Label: import("react").ForwardRefExoticComponent<{
htmlFor?: string | undefined;
className?: string | undefined;
style?: import("react").CSSProperties | undefined;
children?: import("react").ReactNode;
} & import("react").RefAttributes<HTMLLabelElement>>;
Link: import("react").ForwardRefExoticComponent<{
href: string;
className?: string | undefined;
style?: import("react").CSSProperties | undefined;
children?: import("react").ReactNode;
} & import("react").RefAttributes<HTMLAnchorElement>>;
Modal: ({ show, setShow, onClose, className, children, ...rest }: {
show: boolean;
setShow: import("react").Dispatch<import("react").SetStateAction<boolean>>;
onClose?: (() => void) | undefined;
className?: string | undefined;
style?: import("react").CSSProperties | undefined;
children?: import("react").ReactNode;
}) => JSX.Element;
Paragraph: import("react").ForwardRefExoticComponent<{
className?: string | undefined;
style?: import("react").CSSProperties | undefined;
children?: import("react").ReactNode;
} & import("react").RefAttributes<HTMLParagraphElement>>;
Popover: ({ referenceElement, show, setShow, placement, className, style, children, }: {
referenceElement: HTMLElement | null;
show: boolean;
setShow: import("react").Dispatch<import("react").SetStateAction<boolean>>;
placement?: string | undefined;
className?: string | undefined;
style?: import("react").CSSProperties | undefined;
children?: import("react").ReactNode;
}) => JSX.Element;
Progress: import("react").ForwardRefExoticComponent<{
className?: string | undefined;
style?: import("react").CSSProperties | undefined;
} & import("react").RefAttributes<HTMLSpanElement>>;
Select: import("react").ForwardRefExoticComponent<{
value: string;
onChange: import("react").ChangeEventHandler<HTMLSelectElement>;
options?: ({
label: string;
value: string;
} | {
label: string;
options: {
label: string;
value: string;
}[];
})[] | undefined;
disabled?: boolean | undefined;
id?: string | undefined;
className?: string | undefined;
style?: import("react").CSSProperties | undefined;
} & import("react").RefAttributes<HTMLSelectElement>>;
Table: import("react").ForwardRefExoticComponent<{
columns: import("react").ReactNode[];
rows?: {
[key: string]: import("react").ReactNode;
}[] | undefined;
className?: string | undefined;
style?: import("react").CSSProperties | undefined;
} & import("react").RefAttributes<HTMLTableElement>>;
import { AlertProps, ButtonProps, AnchorButtonProps, CheckboxProps, ContainerProps, DividerProps, H1Props, H3Props, H5Props, ImageProps, InputProps, LabelProps, LinkProps, ModalProps, ParagraphProps, PopoverProps, ProgressProps, SelectProps, TableProps } from "./_types";
export type BaseElements = {
Alert: ForwardRefExoticComponent<AlertProps & RefAttributes<HTMLDivElement>>;
Button: ForwardRefExoticComponent<ButtonProps & RefAttributes<HTMLButtonElement>>;
AnchorButton: ForwardRefExoticComponent<AnchorButtonProps & RefAttributes<HTMLButtonElement>>;
Checkbox: ForwardRefExoticComponent<CheckboxProps & RefAttributes<HTMLInputElement>>;
Container: ForwardRefExoticComponent<ContainerProps & RefAttributes<HTMLDivElement>>;
Divider: ForwardRefExoticComponent<DividerProps & RefAttributes<HTMLDivElement>>;
H1: ForwardRefExoticComponent<H1Props & RefAttributes<HTMLHeadingElement>>;
H3: ForwardRefExoticComponent<H3Props & RefAttributes<HTMLHeadingElement>>;
H5: ForwardRefExoticComponent<H5Props & RefAttributes<HTMLHeadingElement>>;
Image: ForwardRefExoticComponent<ImageProps & RefAttributes<HTMLImageElement>>;
Input: ForwardRefExoticComponent<InputProps & RefAttributes<HTMLInputElement>>;
Label: ForwardRefExoticComponent<LabelProps & RefAttributes<HTMLLabelElement>>;
Link: ForwardRefExoticComponent<LinkProps & RefAttributes<HTMLAnchorElement>>;
Modal: (props: ModalProps) => JSX.Element;
Paragraph: ForwardRefExoticComponent<ParagraphProps & RefAttributes<HTMLParagraphElement>>;
Popover: (props: PopoverProps) => JSX.Element;
Progress: ForwardRefExoticComponent<ProgressProps & RefAttributes<HTMLSpanElement>>;
Select: ForwardRefExoticComponent<SelectProps & RefAttributes<HTMLSelectElement>>;
Table: ForwardRefExoticComponent<TableProps & RefAttributes<HTMLTableElement>>;
};
export { BaseAlert, BaseButton, BaseCheckbox, BaseContainer, BaseDivider, BaseH1, BaseH3, BaseH5, BaseImage, BaseInput, BaseLabel, BaseLink, BaseModal, BaseParagraph, BasePopover, BaseProgress, BaseSelect, BaseTable, BaseElements, };
export declare const BaseElements: BaseElements;
export { BaseAlert, BaseButton, BaseAnchorButton, BaseCheckbox, BaseContainer, BaseDivider, BaseH1, BaseH3, BaseH5, BaseImage, BaseInput, BaseLabel, BaseLink, BaseModal, BaseParagraph, BasePopover, BaseProgress, BaseSelect, BaseTable, };

2

package.json
{
"name": "@propelauth/base-elements",
"description": "Base elements for PropelAuth's component library",
"version": "0.0.10",
"version": "0.0.11",
"license": "MIT",

@@ -6,0 +6,0 @@ "keywords": [

55

src/_types.ts
import { Dispatch, SetStateAction, CSSProperties, MouseEventHandler, ChangeEventHandler, ReactNode } from "react"
type AlertProps = {
export type AlertProps = {
type?: "error" | "info" | "success" | "warning"

@@ -10,3 +10,3 @@ className?: string

type ButtonProps = {
export type ButtonProps = {
onClick?: MouseEventHandler<HTMLButtonElement>

@@ -21,3 +21,13 @@ loading?: boolean

type CheckboxProps = {
export type AnchorButtonProps = {
onClick?: MouseEventHandler<HTMLButtonElement>
loading?: boolean
disabled?: boolean
id?: string
className?: string
style?: CSSProperties
children?: ReactNode
}
export type CheckboxProps = {
checked: boolean

@@ -33,3 +43,3 @@ onChange: ChangeEventHandler<HTMLInputElement>

type ContainerProps = {
export type ContainerProps = {
className?: string

@@ -40,3 +50,3 @@ style?: CSSProperties

type DividerProps = {
export type DividerProps = {
className?: string

@@ -47,3 +57,3 @@ style?: CSSProperties

type H1Props = {
export type H1Props = {
className?: string

@@ -54,3 +64,3 @@ style?: CSSProperties

type H3Props = {
export type H3Props = {
className?: string

@@ -61,3 +71,3 @@ style?: CSSProperties

type H5Props = {
export type H5Props = {
className?: string

@@ -68,3 +78,3 @@ style?: CSSProperties

type ImageProps = {
export type ImageProps = {
src: string

@@ -76,3 +86,3 @@ alt?: string

type InputProps = {
export type InputProps = {
value: string

@@ -90,3 +100,3 @@ onChange?: ChangeEventHandler<HTMLInputElement>

type LabelProps = {
export type LabelProps = {
htmlFor?: string

@@ -98,3 +108,3 @@ className?: string

type LinkProps = {
export type LinkProps = {
href: string

@@ -106,3 +116,3 @@ className?: string

type ModalProps = {
export type ModalProps = {
show: boolean

@@ -116,3 +126,3 @@ setShow: Dispatch<SetStateAction<boolean>>

type ParagraphProps = {
export type ParagraphProps = {
className?: string

@@ -123,3 +133,3 @@ style?: CSSProperties

type PopoverProps = {
export type PopoverProps = {
referenceElement: HTMLElement | null

@@ -134,3 +144,3 @@ show: boolean

type ProgressProps = {
export type ProgressProps = {
className?: string

@@ -140,3 +150,3 @@ style?: CSSProperties

type Option = {
export type Option = {
label: string

@@ -146,3 +156,3 @@ value: string

type OptionGroup = {
export type OptionGroup = {
label: string

@@ -152,9 +162,9 @@ options: Array<Option>

type Column = ReactNode
export type Column = ReactNode
type Row = {
export type Row = {
[key: string]: ReactNode
}
type TableProps = {
export type TableProps = {
columns: Column[]

@@ -166,3 +176,3 @@ rows?: Row[]

type SelectProps = {
export type SelectProps = {
value: string

@@ -179,2 +189,3 @@ onChange: ChangeEventHandler<HTMLSelectElement>

export type BaseButtonProps = ButtonProps
export type BaseAnchorButtonProps = AnchorButtonProps
export type BaseCheckboxProps = CheckboxProps

@@ -181,0 +192,0 @@ export type BaseContainerProps = ContainerProps

50

src/index.ts

@@ -0,2 +1,4 @@

import { ForwardRefExoticComponent, RefAttributes } from "react"
import { BaseAlert } from "./BaseAlert"
import { BaseAnchorButton } from "./BaseAnchorButton"
import { BaseButton } from "./BaseButton"

@@ -20,6 +22,50 @@ import { BaseCheckbox } from "./BaseCheckbox"

import "./_styles.css"
import {
AlertProps,
ButtonProps,
AnchorButtonProps,
CheckboxProps,
ContainerProps,
DividerProps,
H1Props,
H3Props,
H5Props,
ImageProps,
InputProps,
LabelProps,
LinkProps,
ModalProps,
ParagraphProps,
PopoverProps,
ProgressProps,
SelectProps,
TableProps,
} from "./_types"
const BaseElements = {
export type BaseElements = {
Alert: ForwardRefExoticComponent<AlertProps & RefAttributes<HTMLDivElement>>
Button: ForwardRefExoticComponent<ButtonProps & RefAttributes<HTMLButtonElement>>
AnchorButton: ForwardRefExoticComponent<AnchorButtonProps & RefAttributes<HTMLButtonElement>>
Checkbox: ForwardRefExoticComponent<CheckboxProps & RefAttributes<HTMLInputElement>>
Container: ForwardRefExoticComponent<ContainerProps & RefAttributes<HTMLDivElement>>
Divider: ForwardRefExoticComponent<DividerProps & RefAttributes<HTMLDivElement>>
H1: ForwardRefExoticComponent<H1Props & RefAttributes<HTMLHeadingElement>>
H3: ForwardRefExoticComponent<H3Props & RefAttributes<HTMLHeadingElement>>
H5: ForwardRefExoticComponent<H5Props & RefAttributes<HTMLHeadingElement>>
Image: ForwardRefExoticComponent<ImageProps & RefAttributes<HTMLImageElement>>
Input: ForwardRefExoticComponent<InputProps & RefAttributes<HTMLInputElement>>
Label: ForwardRefExoticComponent<LabelProps & RefAttributes<HTMLLabelElement>>
Link: ForwardRefExoticComponent<LinkProps & RefAttributes<HTMLAnchorElement>>
Modal: (props: ModalProps) => JSX.Element
Paragraph: ForwardRefExoticComponent<ParagraphProps & RefAttributes<HTMLParagraphElement>>
Popover: (props: PopoverProps) => JSX.Element
Progress: ForwardRefExoticComponent<ProgressProps & RefAttributes<HTMLSpanElement>>
Select: ForwardRefExoticComponent<SelectProps & RefAttributes<HTMLSelectElement>>
Table: ForwardRefExoticComponent<TableProps & RefAttributes<HTMLTableElement>>
}
export const BaseElements: BaseElements = {
Alert: BaseAlert,
Button: BaseButton,
AnchorButton: BaseAnchorButton,
Checkbox: BaseCheckbox,

@@ -46,2 +92,3 @@ Container: BaseContainer,

BaseButton,
BaseAnchorButton,
BaseCheckbox,

@@ -63,3 +110,2 @@ BaseContainer,

BaseTable,
BaseElements,
}
dist/default.css

Sorry, the diff of this file is not supported yet

dist/index.cjs.js.map

Sorry, the diff of this file is not supported yet

dist/index.esm.js.map

Sorry, the diff of this file is not supported yet

src/_styles.css

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

About

Packages

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc