@sebgroup/green-react 0.1.0

package/lib/accordion/accordion-item.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+interface AccordionItemProps {
+    item: AccordionItemInterface;
+    index: number;
+    uuid: string;
+}
+export interface AccordionItemInterface {
+    label: string;
+    labelElementLevel: 2 | 3 | 4 | 5 | 6;
+    subLabel?: string;
+    content: JSX.Element;
+    onClick?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+    onOpen?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+    onClose?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+}
+declare const AccordionItem: ({ item, index, uuid }: AccordionItemProps) => JSX.Element;
+export default AccordionItem;

package/lib/accordion/accordion.d.ts

@@ -0,0 +1,6 @@
+import { AccordionItemInterface } from './accordion-item';
+export interface AccordionInterface {
+    items: AccordionItemInterface[];
+}
+declare const Accordion: ({ items }: AccordionInterface) => JSX.Element;
+export default Accordion;

package/lib/alert-ribbon/alert-ribbon.d.ts

@@ -0,0 +1,16 @@
+import React, { AriaAttributes, ReactNode } from 'react';
+import { AlertRibbonType } from '@sebgroup/extract';
+export interface AlertRibbonProps {
+    children: ReactNode;
+    type?: AlertRibbonType;
+    header?: ReactNode;
+    footer?: ReactNode;
+    isCloseable?: boolean;
+    closeText?: string;
+    onClose?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+    role?: 'alert';
+    ["aria-live"]?: AriaAttributes["aria-live"];
+    closeAriaLabel?: string;
+}
+export declare function AlertRibbon({ type, header, footer, children, closeText, isCloseable, onClose, role, "aria-live": ariaLive, closeAriaLabel }: AlertRibbonProps): JSX.Element;
+export default AlertRibbon;

package/lib/badge/badge.d.ts

@@ -0,0 +1,12 @@
+import { HTMLProps, ReactNode } from 'react';
+import { BadgeType } from '@sebgroup/extract';
+export interface BadgeProps extends HTMLProps<HTMLSpanElement> {
+    children?: ReactNode;
+    badgeType?: BadgeType;
+    isCloseable?: boolean;
+    closeText?: string;
+    customColor?: string;
+    customBackgroundColor?: string;
+}
+export declare function Badge({ children, badgeType, isCloseable, closeText, customColor, customBackgroundColor, ...props }: BadgeProps): JSX.Element | null;
+export default Badge;

package/lib/card/card.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode } from 'react';
+export interface CardProps {
+    children?: ReactNode;
+    header?: ReactNode;
+    footer?: ReactNode;
+}
+export declare function Card({ children, header, footer }: CardProps): JSX.Element;
+export default Card;

package/lib/datepicker/datepicker.d.ts

@@ -0,0 +1,2 @@
+import { DatepickerOptions } from '@sebgroup/extract';
+export declare const Datepicker: (options?: DatepickerOptions) => JSX.Element;

package/lib/datepicker/hook.d.ts

@@ -0,0 +1,12 @@
+import { RefObject } from 'react';
+import { Datepicker, DatepickerData, DatepickerOptions, DatepickerState } from '@sebgroup/extract';
+interface HookResult {
+    datepicker: Datepicker;
+    data: DatepickerData;
+    state: DatepickerState;
+}
+interface DatepickerHook {
+    (datepickerRef: RefObject<HTMLElement>, datepickerDialogRef: RefObject<HTMLElement>, dateInputRef: RefObject<HTMLInputElement>, datepickerTriggerRef: RefObject<HTMLButtonElement>, options?: DatepickerOptions): HookResult;
+}
+export declare const useDatepicker: DatepickerHook;
+export {};

package/lib/dropdown/dropdown.d.ts

@@ -0,0 +1,6 @@
+import { DropdownArgs, OnChange } from '@sebgroup/extract';
+export interface DropdownProps extends DropdownArgs {
+    onChange?: OnChange;
+}
+export declare const Dropdown: ({ compareWith, display, id, informationLabel, label, loop, multiSelect, onChange, options, searchFilter, searchable, texts, useValue, validator, value, }: DropdownProps) => JSX.Element;
+export default Dropdown;

package/lib/dropdown/hooks.d.ts

@@ -0,0 +1,29 @@
+import { DropdownHandler, OnChange, DropdownArgs } from '@sebgroup/extract';
+import { HTMLAttributes, InputHTMLAttributes, RefObject } from 'react';
+import { IValidator } from '@sebgroup/extract';
+interface HookArgs extends DropdownArgs {
+    togglerRef: RefObject<HTMLElement>;
+    listboxRef: RefObject<HTMLElement>;
+    onChange?: OnChange;
+    validator?: IValidator;
+}
+declare type Props = HTMLAttributes<HTMLElement>;
+interface CheckboxItem {
+    labelProps: Props;
+    inputProps: InputHTMLAttributes<HTMLInputElement>;
+    spanProps: Props;
+}
+interface MultiSelectProps {
+    fieldsetProps?: Props;
+    legendProps?: Props;
+    checkboxes?: CheckboxItem[];
+}
+interface HookResult {
+    dropdown?: DropdownHandler;
+    togglerProps: Props;
+    listboxProps: Props;
+    listItems: Props[];
+    multiSelectProps: MultiSelectProps;
+}
+export declare const useDropdown: ({ id, value, texts, options, loop, multiSelect, searchable, searchFilter, compareWith, useValue, display, togglerRef, listboxRef, onChange, validator, }: HookArgs) => HookResult;
+export {};

package/lib/form/button/button.d.ts

@@ -0,0 +1,13 @@
+import { MouseEventHandler, ReactNode } from 'react';
+import { ButtonSize, ButtonType, ButtonVariant } from '@sebgroup/extract';
+export interface ButtonProps {
+    children?: ReactNode;
+    type?: ButtonType;
+    variant?: ButtonVariant;
+    active?: boolean;
+    onClick?: MouseEventHandler<HTMLButtonElement>;
+    disabled?: boolean;
+    size?: ButtonSize;
+}
+export declare function Button({ children, variant, onClick, disabled, active, type, size }: ButtonProps): JSX.Element;
+export default Button;

package/lib/form/buttonGroup/buttonGroup.d.ts

@@ -0,0 +1,10 @@
+import { ReactElement } from 'react';
+import { ButtonVariant } from '@sebgroup/extract';
+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 default ButtonGroup;

package/lib/form/form.d.ts

@@ -0,0 +1,10 @@
+import { FormDirection, Size } from '@sebgroup/extract';
+import { HTMLProps, ReactNode } from 'react';
+export interface FormProps extends HTMLProps<HTMLFormElement> {
+    children?: ReactNode;
+    direction?: FormDirection;
+    formSize?: Size;
+    onFormSubmit?: (values: any) => void;
+}
+export declare const Form: React.FC<FormProps>;
+export default Form;

package/lib/form/formContext.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { FormProps } from './form';
+interface FormContextReturnType {
+    setValues: React.Dispatch<React.SetStateAction<Record<string, any>>>;
+    setErrors: React.Dispatch<React.SetStateAction<Record<string, any>>>;
+    setFields: React.Dispatch<React.SetStateAction<Record<string, any>>>;
+    errors?: Record<string, any>;
+    values?: Record<string, any>;
+}
+export declare const FormContext: React.Context<FormContextReturnType>;
+export declare const useFormContext: () => FormContextReturnType;
+export declare const FormProvider: ({ children, direction, formSize, onSubmit, onFormSubmit, ...props }: React.PropsWithChildren<FormProps>) => JSX.Element;
+export {};

package/lib/form/formItems.d.ts

@@ -0,0 +1,9 @@
+import { IValidator } from '@sebgroup/extract';
+import React from 'react';
+export interface FormItemsProps {
+    children: React.ReactNode;
+    validate?: IValidator;
+    name: string;
+}
+export declare const FormItems: React.FC<FormItemsProps>;
+export default FormItems;

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

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

package/lib/form/input/input.d.ts

@@ -0,0 +1,11 @@
+import { InputHTMLAttributes } from 'react';
+import { CheckboxProps, NumberInputProps, RadioButtonProps, TextInputProps } from '../types';
+import { IValidator } from '@sebgroup/extract';
+import React from 'react';
+export declare type Renderer = (type: string, props: InputHTMLAttributes<HTMLInputElement>, onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void, onChangeInput?: (value: string) => string, label?: string, info?: string, validator?: IValidator) => JSX.Element;
+export declare const RenderInput: Renderer;
+export declare const TextInput: ({ label, info, onChange, onChangeInput, validator, ...props }: TextInputProps) => JSX.Element;
+export declare const EmailInput: ({ label, info, onChange, onChangeInput, validator, ...props }: TextInputProps) => JSX.Element;
+export declare const NumberInput: ({ label, info, onChange, onChangeInput, validator, ...props }: NumberInputProps) => JSX.Element;
+export declare const Checkbox: ({ label, onChange, validator, ...props }: CheckboxProps) => JSX.Element;
+export declare const RadioButton: React.ForwardRefExoticComponent<Pick<RadioButtonProps, "label" | "onChange" | "validator" | "type" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "async" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "cite" | "classID" | "cols" | "colSpan" | "content" | "controls" | "coords" | "crossOrigin" | "data" | "dateTime" | "default" | "defer" | "disabled" | "download" | "encType" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "height" | "high" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "list" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "multiple" | "muted" | "name" | "nonce" | "noValidate" | "open" | "optimum" | "pattern" | "placeholder" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "size" | "sizes" | "span" | "src" | "srcDoc" | "srcLang" | "srcSet" | "start" | "step" | "summary" | "target" | "useMap" | "value" | "width" | "wmode" | "wrap" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key"> & React.RefAttributes<HTMLInputElement>>;

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

@@ -0,0 +1,13 @@
+import React from 'react';
+import { IValidator } from '@sebgroup/extract';
+export interface RadioGroupProps {
+    title?: string;
+    defaultSelected?: string;
+    description?: string;
+    validator?: IValidator;
+    onChangeRadio?: (value: string) => string;
+    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    name?: string;
+}
+export declare const RadioGroup: ({ defaultSelected, description, title, validator, onChangeRadio, onChange, name, children }: React.PropsWithChildren<RadioGroupProps>) => JSX.Element;
+export default RadioGroup;

package/lib/form/text/text.d.ts

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

package/lib/form/types.d.ts

@@ -0,0 +1,23 @@
+import { IValidator } from '@sebgroup/extract';
+import { HTMLProps } from 'react';
+export interface TextInputProps extends HTMLProps<HTMLInputElement> {
+    type?: 'text' | 'email' | 'number';
+    label?: string;
+    info?: string;
+    validator?: IValidator;
+    onChangeInput?: (value: string) => string;
+}
+export interface NumberInputProps extends TextInputProps {
+    min?: number;
+    max?: number;
+    step?: number;
+}
+export interface CheckboxProps extends HTMLProps<HTMLInputElement> {
+    validator?: IValidator;
+}
+export interface RadioButtonProps extends HTMLProps<HTMLInputElement> {
+    label: string;
+    validator?: string;
+    value: string;
+}
+export declare type InputListener<T> = (newValue?: T) => unknown;

package/lib/form/useInput.d.ts

@@ -0,0 +1,5 @@
+import React, { InputHTMLAttributes, RefObject } from 'react';
+declare const useInput: (props: InputHTMLAttributes<HTMLInputElement>, onChanges?: ((event: React.ChangeEvent<HTMLInputElement>) => void) | undefined, onChangeInput?: ((value: string) => string) | undefined) => React.InputHTMLAttributes<HTMLInputElement> & {
+    ref: RefObject<HTMLInputElement>;
+};
+export default useInput;

package/lib/form/validateInput.d.ts

@@ -0,0 +1,9 @@
+import { ValidatorRules } from '@sebgroup/extract';
+interface InputTargetType {
+    name: string;
+    value: string;
+    type?: string;
+    checked?: boolean;
+}
+export declare const validateInputValue: (target: InputTargetType, rules: ValidatorRules, setError: React.Dispatch<React.SetStateAction<Record<string, any>>>) => string;
+export {};

package/lib/icons/check.d.ts

@@ -0,0 +1 @@
+export declare const checkIcon: JSX.Element;

package/lib/icons/index.d.ts

@@ -0,0 +1,3 @@
+export * from './square-exclamation';
+export * from './square-info';
+export * from './check';

package/lib/icons/square-exclamation.d.ts

@@ -0,0 +1 @@
+export declare const squareExclamationIcon: JSX.Element;

package/lib/icons/square-info.d.ts

@@ -0,0 +1 @@
+export declare const squareInfoIcon: JSX.Element;

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

@@ -0,0 +1,13 @@
+import { PropsWithChildren, HTMLProps } from 'react';
+import { AlignContentType, AlignType, FlexDirectionType, FlexWrapType, JustifyContentType } from './types';
+export interface FlexboxProps extends HTMLProps<HTMLDivElement> {
+    alignContent?: AlignContentType;
+    alignItems?: AlignType;
+    alignSelf?: AlignType;
+    justifyContent?: JustifyContentType;
+    flexDirection?: FlexDirectionType;
+    flexWrap?: FlexWrapType;
+    className?: string;
+}
+export declare const Flexbox: ({ alignContent, alignItems, alignSelf, children, justifyContent, flexDirection, flexWrap, className, ...props }: PropsWithChildren<FlexboxProps>) => JSX.Element;
+export default Flexbox;

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

@@ -0,0 +1,5 @@
+export declare type AlignContentType = 'start' | 'between' | 'center' | 'stretch' | 'around' | 'end' | 'sm-start' | 'sm-between' | 'sm-center' | 'sm-stretch' | 'sm-around' | 'sm-end' | 'md-start' | 'md-between' | 'md-center' | 'md-stretch' | 'md-around' | 'md-end' | 'lg-start' | 'lg-between' | 'lg-center' | 'lg-stretch' | 'lg-around' | 'lg-end' | 'xl-start' | 'xl-between' | 'xl-center' | 'xl-stretch' | 'xl-around' | 'xl-end' | 'xxl-start' | 'xxl-between' | 'xxl-center' | 'xxl-stretch' | 'xxl-around' | 'xxl-end';
+export declare type AlignType = 'start' | 'end' | 'center' | 'baseline' | 'stretch' | 'sm-start' | 'sm-end' | 'sm-center' | 'sm-baseline' | 'sm-stretch' | 'md-start' | 'md-end' | 'md-center' | 'md-baseline' | 'md-stretch' | 'lg-start' | 'lg-end' | 'lg-center' | 'lg-baseline' | 'lg-stretch' | 'xl-start' | 'xl-end' | 'xl-center' | 'xl-baseline' | 'xl-stretch' | 'xxl-start' | 'xxl-end' | 'xxl-center' | 'xxl-baseline' | 'xxl-stretch';
+export declare type JustifyContentType = 'start' | 'between' | 'center' | 'evenly' | 'around' | 'end' | 'sm-start' | 'sm-between' | 'sm-center' | 'sm-evenly' | 'sm-around' | 'sm-end' | 'md-start' | 'md-between' | 'md-center' | 'md-evenly' | 'md-around' | 'md-end' | 'lg-start' | 'lg-between' | 'lg-center' | 'lg-evenly' | 'lg-around' | 'lg-end' | 'xl-start' | 'xl-between' | 'xl-center' | 'xl-evenly' | 'xl-around' | 'xl-end' | 'xxl-start' | 'xxl-between' | 'xxl-center' | 'xxl-evenly' | 'xxl-around' | 'xxl-end';
+export declare type FlexDirectionType = 'row' | 'row-reverse' | 'column' | 'column-reverse' | 'sm-row' | 'sm-row-reverse' | 'sm-column' | 'sm-column-reverse' | 'md-row' | 'md-row-reverse' | 'md-column' | 'md-column-reverse' | 'lg-row' | 'lg-row-reverse' | 'lg-column' | 'lg-column-reverse' | 'xl-row' | 'xl-row-reverse' | 'xl-column' | 'xl-column-reverse' | 'xxl-row' | 'xxl-row-reverse' | 'xxl-column' | 'xxl-column-reverse';
+export declare type FlexWrapType = 'nowrap' | 'wrap' | 'wrap-reverse' | 'sm-nowrap' | 'sm-wrap' | 'sm-wrap-reverse' | 'md-nowrap' | 'md-wrap' | 'md-wrap-reverse' | 'lg-nowrap' | 'lg-wrap' | 'lg-wrap-reverse' | 'xl-nowrap' | 'xl-wrap' | 'xl-wrap-reverse' | 'xxl-nowrap' | 'xxl-wrap' | 'xxl-wrap-reverse';

package/lib/layout/index.d.ts

@@ -0,0 +1 @@
+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

@@ -0,0 +1,17 @@
+import { ModalType, Size } from '@sebgroup/extract';
+import { MouseEvent, ReactNode } from 'react';
+declare type ModalEventListener = (event: MouseEvent<HTMLButtonElement>) => unknown;
+export interface ModalProps {
+    type?: ModalType;
+    header?: string;
+    children: ReactNode;
+    confirm?: string;
+    dismiss?: string;
+    size?: Size;
+    isOpen?: boolean;
+    onClose?: ModalEventListener;
+    onConfirm?: ModalEventListener;
+    onDismiss?: ModalEventListener;
+}
+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/stepper/hook.d.ts

@@ -0,0 +1,3 @@
+import { AbstractStepper, StepperArgs, StepperData } from '@sebgroup/extract';
+export { StepperArgs };
+export declare const useStepper: ({ min, max, value, step, id, onChange }: StepperArgs) => [AbstractStepper, StepperData];

package/lib/stepper/stepper.d.ts

@@ -0,0 +1,9 @@
+import { StepperArgs } from './hook';
+import { IValidator } from "@sebgroup/extract";
+export interface StepperProps extends StepperArgs {
+    label?: string;
+    description?: string;
+    statusMessage?: string;
+    validator?: IValidator;
+}
+export declare function Stepper({ label, description, statusMessage, validator, ...stepperArgs }: StepperProps): JSX.Element;

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

@@ -0,0 +1,31 @@
+{
+  "name": "@sebgroup/green-react",
+  "version": "0.1.0",
+  "peerDependencies": {
+    "react": "^17 || ^18",
+    "react-dom": "^17 || ^18"
+  },
+  "dependencies": {
+    "@sebgroup/chlorophyll": "^0.1.0",
+    "@sebgroup/extract": "^0.0.1"
+  },
+  "description": "React components built on top of @sebgroup/chlorophyll.",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/sebgroup/green.git"
+  },
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/",
+    "access": "public"
+  },
+  "author": "Johan Öbrink <johan.obrink@gmail.com> (http://www.linkedin.com/in/johanobrink/)",
+  "contributors": [],
+  "license": "Apache-2.0",
+  "bugs": {
+    "url": "https://github.com/sebgroup/green/labels/react"
+  },
+  "homepage": "https://sebgroup.github.io/green/latest/react/",
+  "main": "./index.umd.js",
+  "module": "./index.esm.js",
+  "typings": "./index.d.ts"
+}