@sebgroup/green-react 1.0.0-beta.2 → 1.0.0-beta.6

package/lib/alert/alert.d.ts

@@ -3,9 +3,10 @@ import { ReactNode } from 'react';
 export interface AlertProps {
     children: ReactNode;
     type: AlertType;
-    heading?: string;
+    header?: ReactNode;
+    footer?: ReactNode;
     isCloseable?: boolean;
     closeText?: string;
 }
-export declare function Alert({ type, heading, children, closeText, isCloseable, }: AlertProps): JSX.Element;
+export declare function Alert({ type, header, footer, children, closeText, isCloseable, }: AlertProps): JSX.Element;
 export default Alert;

package/lib/card/card.d.ts

@@ -1,9 +1,8 @@
 import { ReactNode } from 'react';
-import Button from '../form/button';
 export interface CardProps {
     children?: ReactNode;
-    headline?: string;
-    buttons?: typeof Button[];
+    header?: ReactNode;
+    footer?: ReactNode;
 }
-export declare function Card({ children, headline, buttons }: CardProps): JSX.Element;
+export declare function Card({ children, header, footer }: CardProps): JSX.Element;
 export default Card;

package/lib/dropdown/hooks.d.ts

@@ -1,19 +1,19 @@
-import { DropdownOption } from '@sebgroup/extract';
-import { HTMLAttributes } from 'react';
+import { DropdownHandler, DropdownOption } from '@sebgroup/extract';
+import { HTMLAttributes, RefObject } from 'react';
 interface HookArgs {
     id?: string;
     text?: string;
     options: DropdownOption[];
     loop?: boolean;
+    togglerRef: RefObject<HTMLElement>;
+    listboxRef: RefObject<HTMLElement>;
 }
 declare type Props = HTMLAttributes<HTMLElement>;
 interface HookResult {
+    dropdown?: DropdownHandler;
     togglerProps: Props;
     listboxProps: Props;
     listItems: Props[];
-    activate: () => void;
-    deactivate: () => void;
-    close: () => void;
 }
-export declare const useDropdown: ({ id, text, options, loop }: HookArgs) => HookResult;
+export declare const useDropdown: ({ id, text, options, loop, togglerRef, listboxRef }: HookArgs) => HookResult;
 export {};

package/lib/form/{buttonGroup.d.ts → buttonGroup/buttonGroup.d.ts}

@@ -1,10 +1,10 @@
 import { ReactElement } from 'react';
 import { ButtonVariant } from '@sebgroup/extract';
-import { ButtonProps } from './button';
+import { ButtonProps } from '../button/button';
 interface ButtonGroupProps {
     children: ReactElement<ButtonProps> | ReactElement<ButtonProps>[];
     selectedIndex?: number;
     variant?: ButtonVariant;
 }
-export declare const ButtonGroup: ({ children, selectedIndex, variant }: ButtonGroupProps) => JSX.Element;
+export declare const ButtonGroup: ({ children, selectedIndex, variant, }: ButtonGroupProps) => JSX.Element;
 export default ButtonGroup;

package/lib/form/form.d.ts

@@ -1,9 +1,9 @@
 import { FormDirection, Size } from '@sebgroup/extract';
-import { ReactNode } from 'react';
-export interface FormProps {
+import { HTMLProps, ReactNode } from 'react';
+export interface FormProps extends HTMLProps<HTMLFormElement> {
     children?: ReactNode;
     direction?: FormDirection;
-    size?: Size;
+    formSize?: Size;
 }
-export declare function Form({ children, direction, size, }: FormProps): JSX.Element;
+export declare function Form({ children, direction, formSize, }: FormProps): JSX.Element;
 export default Form;

package/lib/form/group/group.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+export interface GroupProps {
+    children: ReactNode;
+    error?: Error | string;
+    groupBorder?: boolean;
+    invalid?: boolean;
+}
+export declare function Group({ children, error, groupBorder }: GroupProps): JSX.Element;
+export default Group;

package/lib/form/index.d.ts

@@ -1,5 +1,7 @@
-export * from './button';
-export * from './buttonGroup';
+export * from './button/button';
+export * from './buttonGroup/buttonGroup';
 export * from './form';
-export * from './input';
-export * from './text';
+export * from './group/group';
+export * from './input/input';
+export * from './text/text';
+export * from './radioButton/radioGroup';

package/lib/form/{input.d.ts → input/input.d.ts}

@@ -1,5 +1,6 @@
-import { CheckboxProps, TextInputProps } from './types';
+import { CheckboxProps, RadioButtonProps, TextInputProps } from '../types';
 export declare const TextInput: ({ label, info, onChangeText, ...props }: TextInputProps<string>) => JSX.Element;
 export declare const EmailInput: ({ label, info, onChangeText, ...props }: TextInputProps<string>) => JSX.Element;
 export declare const NumberInput: ({ label, info, onChangeText, ...props }: TextInputProps<number>) => JSX.Element;
 export declare const Checkbox: ({ label, onChecked, ...props }: CheckboxProps) => JSX.Element;
+export declare const RadioButton: ({ label, onChangeRadioBtn, validator, ...props }: RadioButtonProps) => JSX.Element;

package/lib/form/radioButton/radioGroup.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { IValidator } from '../types';
+export interface RadioGroupProps {
+    title?: string;
+    description?: string;
+    validator?: IValidator;
+}
+export declare const RadioGroup: ({ description, title, validator, children, }: React.PropsWithChildren<RadioGroupProps>) => JSX.Element;
+export default RadioGroup;

package/lib/form/{text.d.ts → text/text.d.ts}

@@ -2,5 +2,5 @@ import { ReactNode } from 'react';
 interface TextProps {
     children: ReactNode;
 }
-declare const Text: ({ children }: TextProps) => JSX.Element;
+export declare const Text: ({ children }: TextProps) => JSX.Element;
 export default Text;

package/lib/form/types.d.ts

@@ -1,4 +1,5 @@
 import { ChangeEventHandler, FocusEventHandler } from 'react';
+import { IndicatorType } from '@sebgroup/extract';
 export interface InputProps {
     id?: string;
     label?: string;
@@ -22,4 +23,20 @@ export interface CheckboxProps extends InputProps {
     value?: string;
     onChecked?: (checked: boolean | undefined) => unknown;
 }
+export interface OnChangeRadioButton {
+    value?: string;
+    checked?: boolean;
+}
+export interface RadioButtonProps {
+    label?: string;
+    value?: string;
+    disabled?: boolean;
+    validator?: string;
+    checked?: boolean;
+    onChangeRadioBtn?: (checked: OnChangeRadioButton | undefined) => unknown;
+}
 export declare type InputListener<T> = (newValue?: T) => unknown;
+export interface IValidator {
+    message: string;
+    indicator: IndicatorType;
+}

package/lib/layout/flexbox/flexbox.d.ts

@@ -0,0 +1,9 @@
+import { PropsWithChildren } from 'react';
+interface FlexboxProps {
+    alignContent?: 'start' | 'between' | 'center' | 'stretch' | 'around' | 'end';
+    alignItems?: 'start' | 'end' | 'center' | 'baseline' | 'stretch';
+    alignSelf?: 'auto' | 'start' | 'end' | 'center' | 'baseline' | 'stretch';
+    justifyContent?: 'start' | 'between' | 'center' | 'evenly' | 'around' | 'end';
+}
+export declare const Flexbox: ({ alignContent, alignItems, alignSelf, children, justifyContent, }: PropsWithChildren<FlexboxProps>) => JSX.Element;
+export default Flexbox;

package/lib/layout/index.d.ts

@@ -1 +1 @@
-export * from './group';
+export * from './flexbox/flexbox';

package/lib/link/link.d.ts

@@ -0,0 +1,7 @@
+import { HTMLProps, PropsWithChildren } from 'react';
+import { ButtonVariant } from '@sebgroup/extract';
+interface LinkProps extends HTMLProps<HTMLAnchorElement> {
+    button?: boolean | ButtonVariant;
+}
+export declare const Link: ({ button, children, ...props }: PropsWithChildren<LinkProps>) => JSX.Element;
+export default Link;

package/lib/list/list.d.ts

@@ -0,0 +1,14 @@
+import { ListType } from '@sebgroup/extract';
+import { ReactNode, HTMLAttributes } from 'react';
+export interface ListProps extends HTMLAttributes<HTMLOListElement | HTMLUListElement> {
+    listType?: ListType;
+    tableCaption?: string;
+    tableData?: TableListProps[];
+    children?: ReactNode[];
+}
+export interface TableListProps {
+    title: string;
+    definition: string[];
+}
+export declare const List: ({ listType, tableCaption, tableData, children, ...props }: ListProps) => JSX.Element;
+export default List;

package/lib/list/listItem.d.ts

@@ -0,0 +1,10 @@
+import { ListType } from '@sebgroup/extract';
+import { HTMLAttributes, ReactNode } from 'react';
+import { TableListProps } from './list';
+interface ListItemProps extends HTMLAttributes<HTMLLIElement> {
+    listType?: ListType;
+    tableRowData?: TableListProps;
+    children?: ReactNode;
+}
+declare const ListItem: ({ listType, tableRowData, children, ...props }: ListItemProps) => JSX.Element;
+export default ListItem;

package/lib/modal/modal.d.ts

@@ -8,9 +8,10 @@ export interface ModalProps {
     confirm?: string;
     dismiss?: string;
     size?: Size;
+    isOpen?: boolean;
     onClose?: ModalEventListener;
     onConfirm?: ModalEventListener;
     onDismiss?: ModalEventListener;
 }
-export declare const Modal: ({ type, ...props }: ModalProps) => JSX.Element;
+export declare const Modal: ({ type, isOpen, ...props }: ModalProps) => JSX.Element | null;
 export default Modal;

package/lib/navbar/navbar.d.ts

@@ -0,0 +1,12 @@
+import { NavbarVariant } from '@sebgroup/extract';
+import { HTMLAttributes, ReactNode } from 'react';
+export interface NavProps extends HTMLAttributes<HTMLElement> {
+    title?: string;
+    titleLink?: string;
+    brandLink?: string;
+    brandAriaLabel?: string;
+    variant?: NavbarVariant;
+    children?: ReactNode;
+}
+export declare const Navbar: ({ children, variant, title, titleLink, brandLink, brandAriaLabel, }: NavProps) => JSX.Element;
+export default Navbar;

package/lib/tabs/tabs.d.ts

@@ -0,0 +1,13 @@
+import { ReactNode } from 'react';
+export interface IList {
+    text?: string;
+    href?: string;
+    disabled?: boolean;
+}
+interface TabsProps {
+    list?: IList[];
+    onTabChange?: (index: number) => void;
+    children?: ReactNode[];
+}
+export declare const Tabs: ({ list, onTabChange, children }: TabsProps) => JSX.Element;
+export default Tabs;

package/package.json

@@ -1,16 +1,13 @@
 {
   "name": "@sebgroup/green-react",
-  "version": "1.0.0-beta.2",
+  "version": "1.0.0-beta.6",
   "peerDependencies": {
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "rxjs": "^6.6.7",
-    "merge": "^2.1.1"
+    "react": "^17.0.0",
+    "react-dom": "^17.0.0"
   },
   "dependencies": {
-    "@sebgroup/chlorophyll": "1.0.0-beta.2",
-    "@sebgroup/extract": "1.0.0-beta.2",
-    "react-popper": "^2.2.5"
+    "@sebgroup/chlorophyll": "^1.0.0-beta.6",
+    "@sebgroup/extract": "^1.0.0-beta.6"
   },
   "description": "React components built on top of @sebgroup/chlorophyll.",
   "repository": {
@@ -28,7 +25,7 @@
     "url": "https://github.com/sebgroup/green/labels/react"
   },
   "homepage": "https://sebgroup.github.io/green/latest/react/",
-  "main": "./react.umd.js",
-  "module": "./react.esm.js",
+  "main": "./index.umd.js",
+  "module": "./index.esm.js",
   "typings": "./index.d.ts"
 }

package/lib/layout/group.d.ts

@@ -1,6 +0,0 @@
-import { ReactNode } from 'react';
-export interface GroupProps {
-    children: ReactNode;
-}
-export declare function Group({ children }: GroupProps): JSX.Element;
-export default Group;