ui-beyable 1.0.16 → 1.0.18

package/lib/cjs/components/Btn/types.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 interface IBtn {
-    children: React.ReactNode;
+    children?: React.ReactNode;
     type?: "button" | "submit" | "reset" | undefined;
     htmlTag?: string;
     onClick?: any;

package/lib/cjs/components/Confirm/Confirm.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { IConfirm } from './types';
+declare function Confirm({ children, title, text, isOpen, onClose, confirmCallback, cancelCallback, confirmText, cancelText, confirmColor, confirmInput, confirmInputLabel, width }: IConfirm): JSX.Element;
+export { Confirm };

package/lib/cjs/components/Confirm/types.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+interface IConfirm {
+    children?: React.ReactNode;
+    title?: React.ReactNode | string;
+    text?: React.ReactNode | string;
+    isOpen: boolean;
+    onClose?: () => any;
+    confirmCallback?: () => any;
+    cancelCallback?: () => any;
+    confirmText?: string;
+    cancelText?: string;
+    confirmColor?: 'primary' | 'secondary' | 'alert' | 'warning' | 'success' | 'black';
+    confirmInput?: string;
+    confirmInputLabel?: React.ReactNode | string;
+    width?: number;
+}
+export { IConfirm };

package/lib/cjs/components/Fieldset/Fieldset.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { IFieldset } from './types';
+declare function Fieldset({ children, label, description, labelClassName, blockClassName, tooltip, tooltipHTML, inputID, append }: IFieldset): JSX.Element;
+export { Fieldset };

package/lib/cjs/components/Fieldset/types.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+interface IFieldset {
+    children: React.ReactNode;
+    label: React.ReactNode | string;
+    description?: React.ReactNode | string;
+    labelClassName?: string;
+    blockClassName?: string;
+    tooltip?: string;
+    tooltipHTML?: any;
+    inputID?: string | number;
+    append?: React.ReactNode;
+}
+export { IFieldset };

package/lib/cjs/components/Modal/Modal.d.ts

@@ -2,6 +2,6 @@
 import { IModal, IModalHeader, IModalBody, IModalFooter } from './types';
 declare function Modal({ children, isOpen, onClose, noClose, width, height, minHeight, fullScreen, animation }: IModal): JSX.Element;
 declare function ModalHeader({ children, className, title, intro, desc, hasBorder, hasBottomPadding }: IModalHeader): JSX.Element;
-declare function ModalBody({ children, className, style, backgroundColor, position, hasVerticalPadding }: IModalBody): JSX.Element;
+declare function ModalBody({ children, className, style, backgroundColor, position, hasVerticalPadding, hasHorizontalPadding }: IModalBody): JSX.Element;
 declare function ModalFooter({ children, className, align, primaryAction, secondaryAction, hasBorder, }: IModalFooter): JSX.Element;
 export { Modal, ModalHeader, ModalBody, ModalFooter };

package/lib/cjs/components/Modal/types.d.ts

@@ -4,9 +4,9 @@ interface IModal {
     isOpen: boolean;
     onClose?: (e: any) => any;
     noClose?: boolean;
-    width?: string;
-    height?: string;
-    minHeight?: string;
+    width?: number;
+    height?: number;
+    minHeight?: number;
     fullScreen?: boolean;
     animation?: string;
 }
@@ -26,6 +26,7 @@ interface IModalBody {
     backgroundColor?: 'grey' | 'white';
     position?: 'static' | 'relative';
     hasVerticalPadding?: boolean;
+    hasHorizontalPadding?: boolean;
 }
 interface IModalFooter {
     children?: React.ReactNode;

package/lib/cjs/components/Textfield/Textfield.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { ITextfield, ITextfieldIcon } from './types';
+declare function Textfield({ value, name, type, placeholder, rows, // For textarea
+min, max, onChange, onEnter, onFocus, onBlur, disabled, readonly, clearable, selectOnFocus, autoFocus, autoComplete, forceFocus, spellCheck, autogrow, // Vertical for textarea, Horizontal for text
+label, labelTooltip, labelTooltipHTML, description, descriptionBottom, errorMessage, unit, append, prepend, icon, iconPosition, className, labelClassName, blockClassName, size, horizontalSize, color, style, doBtnHug, textAlign, fullWidth, width, // 'Full' || 'xl' || 'l' || 's' || 'xs' || 'xxs'
+maxHeight, // For textarea autogrow
+maxWidth, }: ITextfield): JSX.Element;
+declare function TextfieldIcon({ icon, position }: ITextfieldIcon): JSX.Element;
+export { Textfield, TextfieldIcon };

package/lib/cjs/components/Textfield/types.d.ts

@@ -0,0 +1,52 @@
+import React from "react";
+interface ITextfield {
+    value?: string | number;
+    name?: string;
+    type?: string;
+    placeholder?: string;
+    rows?: number;
+    min?: number;
+    max?: number;
+    onChange?: any;
+    onEnter?: any;
+    onFocus?: any;
+    onBlur?: any;
+    disabled?: boolean;
+    readonly?: boolean;
+    clearable?: boolean;
+    selectOnFocus?: boolean;
+    autoFocus?: boolean;
+    autoComplete?: boolean;
+    forceFocus?: boolean;
+    spellCheck?: boolean;
+    autogrow?: boolean;
+    label?: React.ReactNode | string;
+    labelTooltip?: string;
+    labelTooltipHTML?: any;
+    description?: React.ReactNode | string;
+    descriptionBottom?: React.ReactNode | string;
+    errorMessage?: React.ReactNode | string;
+    unit?: string;
+    append?: React.ReactNode;
+    prepend?: React.ReactNode;
+    icon?: string;
+    iconPosition?: 'before' | 'after';
+    className?: string;
+    labelClassName?: string;
+    blockClassName?: string;
+    size?: 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl';
+    horizontalSize?: 'm' | 's';
+    color?: 'white' | 'grey';
+    style?: 'ghost' | 'ghost_underline' | 'highlighted';
+    doBtnHug?: boolean;
+    textAlign?: 'left' | 'center' | 'right';
+    fullWidth?: boolean;
+    width?: 'auto' | 'full' | 'xl' | 'l' | 's' | 'xs' | 'xxs';
+    maxHeight?: number;
+    maxWidth?: number;
+}
+interface ITextfieldIcon {
+    icon?: string;
+    position?: 'before' | 'after';
+}
+export { ITextfield, ITextfieldIcon };

package/lib/cjs/index.d.ts

@@ -3,7 +3,9 @@ import { Article } from './components/Article/Article';
 import { Btn } from './components/Btn/Btn';
 import { Checkbox, Radio, Switch, CheckboxList } from './components/Checkbox/Checkbox';
 import Collapse from './components/Collapse/Collapse';
+import { Confirm } from './components/Confirm/Confirm';
 import { Dropdown } from './components/Dropdown/Dropdown';
+import { Fieldset } from './components/Fieldset/Fieldset';
 import { IconBtn } from './components/IconBtn/IconBtn';
 import { List, ListItem } from './components/List/List';
 import { Listbox, ListboxItem, ListboxSep } from './components/Listbox/Listbox';
@@ -14,6 +16,7 @@ import { Picto } from './components/Picto/Picto';
 import { Portal } from './components/Portal/Portal';
 import { Section } from './components/Section/Section';
 import { Spinner } from './components/Spinner/Spinner';
+import { Textfield, TextfieldIcon } from './components/Textfield/Textfield';
 declare const Theme: any;
 export { Theme, AppRoot, AppHeader, AppLinkWrapper, AppLogo, Article, Btn, Checkbox, CheckboxList, Collapse, // Not OK
-Dropdown, IconBtn, List, ListItem, Listbox, ListboxItem, ListboxSep, Mask, Modal, ModalHeader, ModalBody, ModalFooter, Panel, PanelClose, PanelHeader, PanelBody, Picto, Portal, Radio, Section, Spinner, Switch, };
+Confirm, Dropdown, Fieldset, IconBtn, List, ListItem, Listbox, ListboxItem, ListboxSep, Mask, Modal, ModalHeader, ModalBody, ModalFooter, Panel, PanelClose, PanelHeader, PanelBody, Picto, Portal, Radio, Section, Spinner, Switch, Textfield, TextfieldIcon };