@ilo-org/react 0.17.7 → 0.18.0

package/lib/types/components/Cards/PromoCard/PromoCard.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { PromoCardProps } from './PromoCard.props';
+
+declare const PromoCard: FC<PromoCardProps>;
+export default PromoCard;

package/lib/types/components/Cards/PromoCard/PromoCard.props.d.ts

@@ -0,0 +1,35 @@
+import { ThemeTypes, CardCornerType, CardSize, HeadingTypes } from '../../../types';
+import { LinkProps } from '../../LinkList/LinkList.props';
+
+export type PromoCardProps = {
+    /**
+     * A line of text that appears as a small heading above the title of the card
+     */
+    eyebrow?: string;
+    /**
+     * The title of the card
+     */
+    title: string;
+    /**
+     * HTML element used for the title
+     */
+    titleLevel?: HeadingTypes;
+    /**
+     * Will render the card to appear on light or dark backgrounds
+     */
+    theme?: ThemeTypes;
+    /**
+     * How big should the card be
+     */
+    size?: CardSize;
+    /**
+     * Apply an optional corner cut to the top of the card
+     */
+    cornercut?: CardCornerType;
+    /**
+     * Introductory text in the card
+     */
+    intro?: string;
+    link?: string;
+    cta?: LinkProps;
+};

package/lib/types/components/Cards/PromoCard/index.d.ts

@@ -0,0 +1,3 @@
+export { default as PromoCard } from './PromoCard';
+export type { PromoCardProps } from './PromoCard.props';
+export { PromoCardArgs } from './PromoCard.args';

package/lib/types/components/Cards/StatCard/StatCard.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { StatCardProps } from './StatCard.props';
+
+declare const StatCard: FC<StatCardProps>;
+export default StatCard;

package/lib/types/components/Cards/StatCard/StatCard.props.d.ts

@@ -0,0 +1,26 @@
+import { CardColor, CardSize, HeadingTypes } from '../../../types';
+import { LinkProps } from '../../LinkList/LinkList.props';
+
+export type StatCardProps = {
+    /**
+     * The title of the card
+     */
+    title: string;
+    /**
+     * HTML element used for the title
+     */
+    titleLevel?: HeadingTypes;
+    /**
+     * Background color of stat card
+     */
+    color?: CardColor;
+    /**
+     * How big should the card be
+     */
+    size?: Omit<CardSize, "narrow" | "wide">;
+    /**
+     * Introductory text in the card
+     */
+    intro?: string;
+    source?: LinkProps;
+};

package/lib/types/components/Cards/StatCard/index.d.ts

@@ -0,0 +1,3 @@
+export { default as StatCard } from './StatCard';
+export type { StatCardProps } from './StatCard.props';
+export { StatCardArgs } from './StatCard.args';

package/lib/types/components/Cards/TextCard/TextCard.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { TextCardProps } from './TextCard.props';
+
+declare const TextCard: FC<TextCardProps>;
+export default TextCard;

package/lib/types/components/Cards/TextCard/TextCard.props.d.ts

@@ -0,0 +1,31 @@
+import { ThemeTypes, CardSize, EventDate, HeadingTypes } from '../../../types';
+import { ProfileProps } from '../../Profile/Profile.props';
+
+export type TextCardProps = {
+    /**
+     * A line of text that appears as a small heading above the title of the card
+     */
+    eyebrow?: string;
+    /**
+     * The title of the card
+     */
+    title: string;
+    /**
+     * HTML element used for the title
+     */
+    titleLevel?: HeadingTypes;
+    /**
+     * Will render the card to appear on light or dark backgrounds
+     */
+    theme?: ThemeTypes;
+    /**
+     * How big should the card be
+     */
+    size?: Omit<CardSize, "standard">;
+    /**
+     * Specify the event Date, in both human and Unix format.
+     */
+    date?: EventDate;
+    profile: ProfileProps;
+    link?: string;
+};

package/lib/types/components/Cards/TextCard/index.d.ts

@@ -0,0 +1,3 @@
+export { default as TextCard } from './TextCard';
+export type { TextCardProps } from './TextCard.props';
+export { TextCardArgs } from './TextCard.args';

package/lib/types/components/Checkbox/Checkbox.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+import { CheckboxProps } from './Checkbox.props';
+
+declare const LabelledCheckbox: React.ForwardRefExoticComponent<CheckboxProps & import('../FormControl/FormControl.props').FormControlPublicProps & {
+    inputStyle?: React.CSSProperties | undefined;
+} & React.RefAttributes<HTMLInputElement>>;
+export default LabelledCheckbox;

package/lib/types/components/Checkbox/Checkbox.props.d.ts

@@ -0,0 +1,4 @@
+import { ChoiceFieldProps, LabelledFormFieldProps } from '../../types';
+
+export type CheckboxProps = ChoiceFieldProps<HTMLInputElement>;
+export type LabelledCheckboxProps = LabelledFormFieldProps<CheckboxProps>;

package/lib/types/components/Checkbox/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Checkbox } from './Checkbox';
+export { default as CheckboxArgs } from './Checkbox.args';

package/lib/types/components/Collapse/Collapse.d.ts

@@ -0,0 +1,4 @@
+import { CollapseProps } from './Collapse.props';
+
+declare const Collapse: import('react').ForwardRefExoticComponent<CollapseProps & import('react').RefAttributes<Transition<any>>>;
+export default Collapse;

package/lib/types/components/Collapse/Collapse.props.d.ts

@@ -0,0 +1,77 @@
+import { default as React } from 'react';
+
+type Dimension = "height" | "width";
+export interface CollapseProps {
+    className?: string;
+    /**
+     * Show the component; triggers the expand or collapse animation
+     */
+    panelIn?: boolean;
+    /**
+     * Wait until the first "enter" transition to mount the component (add it to the DOM)
+     */
+    mountOnEnter?: boolean;
+    /**
+     * Unmount the component (remove it from the DOM) when it is collapsed
+     */
+    unmountOnExit?: boolean;
+    /**
+     * Run the expand animation when the component mounts, if it is initially
+     * shown
+     */
+    appear?: boolean;
+    /**
+     * Duration of the collapse animation in milliseconds, to ensure that
+     * finishing callbacks are fired even if the original browser transition end
+     * events are canceled
+     */
+    timeout?: number;
+    /**
+     * The dimension used when collapsing, or a function that returns the
+     * dimension
+     */
+    dimension?: Dimension | (() => Dimension);
+    /**
+     * Function that returns the height or width of the animating DOM node
+     *
+     * Allows for providing some custom logic for how much the Collapse component
+     * should animate in its specified dimension. Called with the current
+     * dimension prop value and the DOM node.
+     *
+     * @default element.offsetWidth | element.offsetHeight
+     */
+    getDimensionValue?: (dimension: Dimension, element: HTMLElement) => number;
+    /**
+     * ARIA role of collapsible element
+     */
+    role?: string;
+    /**
+     * You must provide a single JSX child element to this component and that element cannot be a \<React.Fragment\>
+     */
+    children: React.ReactElement;
+    /**
+     * Callback fired before the component expands
+     */
+    onEnter?: () => void;
+    /**
+     * Callback fired after the component starts to expand
+     */
+    onEntering?: () => void;
+    /**
+     * Callback fired after the component has expanded
+     */
+    onEntered?: () => void;
+    /**
+     * Callback fired before the component collapses
+     */
+    onExit?: () => void;
+    /**
+     * Callback fired after the component starts to collapse
+     */
+    onExiting?: () => void;
+    /**
+     * Callback fired after the component has collapsed
+     */
+    onExited?: () => void;
+}
+export {};

package/lib/types/components/Collapse/index.d.ts

@@ -0,0 +1 @@
+export { default as Collapse } from './Collapse';

package/lib/types/components/ContextMenu/ContextMenu.d.ts

@@ -0,0 +1,5 @@
+import { default as React } from 'react';
+import { ContextMenuProps } from './ContextMenu.props';
+
+declare const ContextMenu: React.ForwardRefExoticComponent<ContextMenuProps & React.RefAttributes<HTMLOListElement>>;
+export default ContextMenu;

package/lib/types/components/ContextMenu/ContextMenu.props.d.ts

@@ -0,0 +1,24 @@
+export interface LinkProps {
+    /**
+     * Specify whether this link marks the end of a section
+     */
+    endsection?: boolean;
+    /**
+     * Specify the label for the the Context Menu's link
+     */
+    label?: Required<string>;
+    /**
+     * Specify the url for the Context Menu's link
+     */
+    url?: Required<string>;
+}
+export interface ContextMenuProps {
+    /**
+     * Specify an optional className to be added to your Context Menu component.
+     */
+    className?: string;
+    /**
+     * Specify the links to be displayed in the Context Menu
+     */
+    links?: Required<Array<LinkProps>>;
+}

package/lib/types/components/ContextMenu/index.d.ts

@@ -0,0 +1 @@
+export { default as ContextMenu } from './ContextMenu';

package/lib/types/components/Credit/Credit.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { CreditProps } from './Credit.props';
+
+declare const Credit: FC<CreditProps>;
+export default Credit;

package/lib/types/components/Credit/Credit.props.d.ts

@@ -0,0 +1,10 @@
+export interface CreditProps {
+    /**
+     * Specify an optional className to be added to your empty component.
+     */
+    className?: string;
+    /**
+     * Specify the credit text
+     */
+    credit?: string;
+}

package/lib/types/components/Credit/index.d.ts

@@ -0,0 +1 @@
+export { default as Credit } from './Credit';

package/lib/types/components/DatePicker/DatePicker.d.ts

@@ -0,0 +1,6 @@
+import { DatePickerProps } from './DatePicker.props';
+
+declare const LabelledDatePicker: import('react').ForwardRefExoticComponent<DatePickerProps & import('../FormControl/FormControl.props').FormControlPublicProps & {
+    inputStyle?: import('react').CSSProperties | undefined;
+} & import('react').RefAttributes<HTMLInputElement>>;
+export default LabelledDatePicker;

package/lib/types/components/DatePicker/DatePicker.props.d.ts

@@ -0,0 +1,21 @@
+import { FormFieldProps, LabelledFormFieldProps } from '../../types';
+
+export interface DatePickerProps extends FormFieldProps<HTMLInputElement> {
+    /**
+     * The latest date to accept
+     */
+    max?: string | number;
+    /**
+     * The earliest date to accept.
+     */
+    min?: string | number;
+    /**
+     * The granularity of the date picker
+     */
+    step?: number;
+    /**
+     * Specify an optional className to be added to your DatePicker component.
+     */
+    placeholder?: string;
+}
+export type LabelledDatePickerProps = LabelledFormFieldProps<DatePickerProps>;

package/lib/types/components/DatePicker/index.d.ts

@@ -0,0 +1 @@
+export { default as DatePicker } from './DatePicker';

package/lib/types/components/Dropdown/Dropdown.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+import { DropdownProps } from './Dropdown.props';
+
+declare const LabelledDropdown: React.ForwardRefExoticComponent<DropdownProps & import('../FormControl/FormControl.props').FormControlPublicProps & {
+    inputStyle?: React.CSSProperties | undefined;
+} & React.RefAttributes<HTMLSelectElement>>;
+export default LabelledDropdown;

package/lib/types/components/Dropdown/Dropdown.props.d.ts

@@ -0,0 +1,43 @@
+import { FormFieldProps, LabelledFormFieldProps } from '../../types';
+
+export interface OptionProps {
+    /**
+     * Is this option disabled?
+     */
+    disabled?: boolean;
+    /**
+     * The option's label
+     */
+    label: string;
+    /**
+     * The option's value
+     */
+    value?: string;
+}
+export interface DropdownProps extends FormFieldProps<HTMLSelectElement> {
+    /**
+     * A string providing a hint for a user agent's autocomplete feature.
+     */
+    autocomplete?: string;
+    /**
+     * The form element to associate the Dropdown with if it's not nested in a form element.
+     */
+    form?: string;
+    /**
+     * Indicates that multiple options can be selected from the list.
+     */
+    multiple?: boolean;
+    /**
+     * The Dropdown's options
+     */
+    options?: OptionProps[];
+    /**
+     * Number of rows in the list that should be visible at one time. Corresponds to the select element's size attribute.
+     */
+    selectSize?: number;
+    /**
+     * The Dropdown's default selection; should match one of the values in `options`
+     */
+    value?: string;
+}
+export type LabelledDropdownProps = LabelledFormFieldProps<DropdownProps>;

package/lib/types/components/Dropdown/index.d.ts

@@ -0,0 +1 @@
+export { default as Dropdown } from './Dropdown';

package/lib/types/components/Empty/Empty.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { EmptyProps } from './Empty.props';
+
+declare const Empty: FC<EmptyProps>;
+export default Empty;

package/lib/types/components/Empty/Empty.props.d.ts

@@ -0,0 +1,12 @@
+import { default as React } from 'react';
+
+export interface EmptyProps {
+    /**
+     * Specify an optional className to be added to your empty component.
+     */
+    className?: string;
+    /**
+     * Inline styles to be applied
+     */
+    style?: React.CSSProperties;
+}

package/lib/types/components/Empty/index.d.ts

@@ -0,0 +1 @@
+export { default as Empty } from './Empty';

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

@@ -0,0 +1,11 @@
+import { FC } from 'react';
+import { FieldsetProps } from './Fieldset.props';
+
+type FieldsetContextType = {
+    hasError: boolean;
+    setHasError: (value: boolean) => void;
+};
+export declare const FieldsetErrorContext: import('react').Context<FieldsetContextType>;
+export declare const useFieldsetError: () => FieldsetContextType;
+declare const Fieldset: FC<FieldsetProps>;
+export default Fieldset;

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

@@ -0,0 +1,28 @@
+import { HTMLProps } from 'react';
+
+export interface FieldsetProps extends HTMLProps<HTMLFieldSetElement> {
+    /**
+     * Optional helper text for the fieldset
+     */
+    helper?: string;
+    /**
+     * Optional error text for the fieldset
+     */
+    errorMessage?: string;
+    /**
+     * Optional tooltip text for the fieldset
+     */
+    tooltip?: string;
+    /**
+     * The fieldset's legend
+     */
+    legend?: string;
+    /**
+     * The direction of the Fieldset's children
+     */
+    direction?: "row" | "column" | "row-reverse" | "column-reverse";
+    /**
+     * How the Fieldset children will wrap
+     */
+    wrap?: "reverse" | "nowrap" | "wrap" | "wrap-reverse";
+}

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

@@ -0,0 +1 @@
+export { default as Fieldset } from './Fieldset';

package/lib/types/components/FileUpload/FileUpload.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+import { FileUploadProps } from './FileUpload.props';
+
+declare const LabelledFileUpload: React.ForwardRefExoticComponent<FileUploadProps & import('../FormControl/FormControl.props').FormControlPublicProps & {
+    inputStyle?: React.CSSProperties | undefined;
+} & React.RefAttributes<HTMLInputElement>>;
+export default LabelledFileUpload;

package/lib/types/components/FileUpload/FileUpload.props.d.ts

@@ -0,0 +1,17 @@
+import { FormFieldProps, LabelledFormFieldProps } from '../../types';
+
+export interface FileUploadProps extends FormFieldProps<HTMLInputElement> {
+    /**
+     * The placeholder for the input
+     */
+    placeholder?: string;
+    /**
+     * The accept attribute for the input
+     */
+    accept?: string;
+    /**
+     * Can the user upload more than one file?
+     */
+    multiple?: boolean;
+}
+export type LabelledFileUploadProps = LabelledFormFieldProps<FileUploadProps>;

package/lib/types/components/FileUpload/index.d.ts

@@ -0,0 +1 @@
+export { default as FileUpload } from './FileUpload';

package/lib/types/components/Footer/Footer.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { FooterProps } from './Footer.props';
+
+declare const Footer: FC<FooterProps>;
+export default Footer;

package/lib/types/components/Footer/Footer.props.d.ts

@@ -0,0 +1,49 @@
+import { LinkGroupProps, LinkProps } from '../LinkList/LinkList.props';
+import { SocialMediaProps } from '../SocialMedia';
+
+export interface FooterProps {
+    /**
+     * Specify an optional className to be added to your Footer.
+     */
+    className?: string;
+    /**
+     * Props for the logo of the Footer
+     */
+    logo?: string;
+    /**
+     * Specify the tagline for the Footer
+     */
+    tagline?: string;
+    /**
+     * Specify the subtagline for the Footer
+     */
+    subtagline?: string;
+    /**
+     * Specify the address for the Footer, in multiple lines
+     */
+    address?: string[];
+    /**
+     * Specify the linkgroup for the Footer's links
+     */
+    linkgroup?: Required<Array<LinkGroupProps>>;
+    /**
+     * Specify the links to be displayed in this link group
+     */
+    socialmedia?: SocialMediaProps;
+    /**
+     * Specify the legal statement for the Footer
+     */
+    subscribe?: LinkProps;
+    /**
+     * Specify the legal statement for the Footer
+     */
+    legal?: string;
+    /**
+     * Specify the secondary links for the Footer
+     */
+    secondarylinks?: LinkProps[];
+    /**
+     * Specify the anchor link for the Footer
+     */
+    anchorlink?: LinkProps;
+}

package/lib/types/components/Footer/index.d.ts

@@ -0,0 +1 @@
+export { default as Footer } from './Footer';

package/lib/types/components/Form/Form.d.ts

@@ -0,0 +1,4 @@
+import { FormProps } from './Form.props';
+
+declare const Form: import('react').ForwardRefExoticComponent<FormProps & import('react').RefAttributes<HTMLFormElement>>;
+export default Form;

package/lib/types/components/Form/Form.props.d.ts

@@ -0,0 +1,7 @@
+export interface FormProps extends React.FormHTMLAttributes<HTMLFormElement> {
+    children?: React.ReactNode;
+    /**
+     * The theme of the form. Also sets the theme of the form's children.
+     */
+    theme?: "light" | "dark";
+}

package/lib/types/components/Form/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Form } from './Form';
+export * as FormArgs from './Form.args';

package/lib/types/components/FormControl/FormControl.d.ts

@@ -0,0 +1,10 @@
+import { FC } from 'react';
+import { FormControlProps } from './FormControl.props';
+
+export interface FormControlContextProps {
+    ariaDescribedBy?: string;
+}
+export declare const FormControlContext: React.Context<FormControlContextProps>;
+export declare const useFormControl: () => FormControlContextProps;
+declare const FormControl: FC<FormControlProps>;
+export default FormControl;

package/lib/types/components/FormControl/FormControl.props.d.ts

@@ -0,0 +1,56 @@
+import { ReactElement } from 'react';
+import { DropdownProps } from '../Dropdown/Dropdown.props';
+import { InputProps } from '../Input/Input.props';
+import { TextareaProps } from '../Textarea';
+import { ToggleProps } from '../Toggle';
+
+export interface FormControlPublicProps {
+    /**
+     * Optional className to add to the FormControl wrapper
+     */
+    className?: string;
+    /**
+     * Is the input disabled?
+     */
+    disabled?: boolean;
+    /**
+     * Does the input have an error?
+     */
+    error?: boolean;
+    /**
+     * The message to display in case of an error
+     */
+    errorMessage?: string;
+    /**
+     * Helper text to display with the label
+     */
+    helper?: string;
+    /**
+     * The FormControl's label
+     */
+    label: string;
+    /**
+     * Where to place the label
+     */
+    labelPlacement?: "top" | "start" | "bottom" | "end";
+    /**
+     * The size of your label. Defaults to "medium"
+     */
+    labelSize?: "small" | "medium" | "large";
+    /**
+     * Inline styles for the input
+     */
+    style?: React.CSSProperties;
+    /**
+     * Optional text to render in a tooltip
+     */
+    tooltip?: string;
+}
+export interface FormControlPrivateProps {
+    /**
+     * The id of the underlying input element
+     */
+    fieldId: string;
+    children: ReactElement<ToggleProps> | ReactElement<InputProps> | ReactElement<DropdownProps> | ReactElement<TextareaProps>;
+}
+export type FormControlProps = FormControlPublicProps & FormControlPrivateProps;

package/lib/types/components/FormControl/index.d.ts

@@ -0,0 +1,2 @@
+export { default as FormControl } from './FormControl';
+export type { FormControlProps } from './FormControl.props';

package/lib/types/components/FormElement/FormElement.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { FormElementProps } from './FormElement.props';
+
+declare const FormElement: FC<FormElementProps>;
+export default FormElement;