@progressiveui/react 1.22.0

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

@@ -0,0 +1,37 @@
+import * as React from "react";
+interface CheckboxProps extends Omit<React.ComponentPropsWithRef<"input">, "onChange"> {
+    /**
+     * Specify whether the Checkbox is in an indeterminate state
+     */
+    indeterminate?: boolean;
+    /**
+     * Provide a label to provide a description of the Checkbox input that you are
+     * exposing to the user
+     */
+    labelText?: React.ReactNode;
+    /**
+     * Specify whether the label should be hidden, or not
+     */
+    hideLabel?: boolean;
+    /**
+     * Invalid state for the checkbox
+     */
+    invalid?: boolean;
+    /**
+     * Provide the text that is displayed when the checkbox is in an invalid state
+     */
+    invalidText?: string;
+    /**
+     * The CSS class name to be placed on the wrapping element
+     */
+    wrapperClassName?: string;
+    /**
+     *
+     * @param event | The event triggering the change
+     * @param checked | The new value of the checkbox
+     * @param customId | The id of the checkbox
+     */
+    onChange?(event: React.ChangeEvent<HTMLInputElement>, checked?: boolean, customId?: string): void;
+}
+export declare const Checkbox: React.ForwardRefExoticComponent<Omit<CheckboxProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+export default Checkbox;

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

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

package/lib/dist/components/ContentSwitcher/ContentSwitcher.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import type { PropsWithChildren } from "react";
+/** ContentSwitcher manipulates the content shown following an exclusive or “either/or” pattern. It is used to toggle between two or more content sections within the same space on screen. Only one section can be shown at a time.
+ */
+type ContentSwitcherProps = PropsWithChildren<{
+    className?: string;
+    selectedIndex?: number;
+    small?: boolean;
+    onChange: (data?: object) => void;
+}>;
+declare const ContentSwitcher: React.FC<ContentSwitcherProps>;
+export default ContentSwitcher;

package/lib/dist/components/ContentSwitcher/index.d.ts

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

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

@@ -0,0 +1,31 @@
+import * as React from 'react';
+import type { PropsWithChildren } from 'react';
+/** Context menu are used as navigational elements. They should contain commands that apply to the target object. */
+type ContextMenuProps = PropsWithChildren<{
+    /**
+     * Provide content to display when contextMenu is clicked
+     */
+    content?: React.ReactNode;
+    /**
+     * Provide a href prop as an alternative to onClick
+     */
+    href?: string;
+    /**
+     * Inline links are used within a sentence or paragraph and are styled with an underline. They should not be paired with an icon.
+     */
+    inline?: boolean;
+    /**
+     * Provide a custom className
+     */
+    className?: string;
+}>;
+declare const ContextMenu: React.FC<ContextMenuProps>;
+type ContextMenuGroupProps = PropsWithChildren<{
+    className?: string;
+}>;
+declare const ContextMenuGroup: React.FC<ContextMenuGroupProps>;
+interface ContextMenuItemProps extends React.ComponentPropsWithRef<'div'> {
+    className?: string;
+}
+declare const ContextMenuItem: React.FC<ContextMenuItemProps>;
+export { ContextMenu, ContextMenuItem, ContextMenuGroup };

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

@@ -0,0 +1 @@
+export { ContextMenu, ContextMenuGroup, ContextMenuItem } from './ContextMenu';

package/lib/dist/components/Credits/Credits.d.ts

@@ -0,0 +1,10 @@
+import * as React from "react";
+interface CreditsProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+   Specifiy the info content
+  */
+    info?: React.ReactNode;
+}
+/** Credits are mostly used when a photo need a source attribution. */
+declare const Credits: React.FC<CreditsProps>;
+export default Credits;

package/lib/dist/components/Credits/index.d.ts

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

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

@@ -0,0 +1,8 @@
+import * as React from "react";
+import { InputProps } from "../Input";
+import { DatePickerInputProps } from "./DatePickerInput";
+/** DatePicker with the Input wrapper */
+interface DatePickerProps extends InputProps, DatePickerInputProps {
+}
+declare const DatePicker: React.ForwardRefExoticComponent<DatePickerProps & React.RefAttributes<HTMLInputElement>>;
+export default DatePicker;

package/lib/dist/components/DatePicker/DatePickerInput.d.ts

@@ -0,0 +1,38 @@
+import * as React from "react";
+export interface DatePickerInputProps {
+    /**
+     * The starting date value, formatted as a string.
+     */
+    startDate?: string;
+    /**
+     * The ending date value, formatted as a string.
+     */
+    endDate?: string;
+    /**
+     * The DatePicker component to be used (react-datepicker by default)
+     */
+    datePicker?: React.ComponentType<any>;
+    /**
+     * Function to set the starting date. Typically used as an event handler.
+     */
+    setStartDate?: string;
+    /**
+     * Function to set the ending date. Typically used as an event handler.
+     */
+    setEndDate?: string;
+    /**
+     * Additional props for the start date DatePicker component.
+     * Can be used to pass custom settings or event handlers.
+     */
+    fromProps?: object;
+    /**
+     * Additional props for the end date DatePicker component.
+     * Can be used to pass custom settings or event handlers.
+     */
+    toProps?: object;
+    /**
+     * Additional props for the DatePicker component.
+     */
+    datePickerProps?: object;
+}
+export declare const DatePickerInput: React.ForwardRefExoticComponent<DatePickerInputProps & React.RefAttributes<HTMLInputElement>>;

package/lib/dist/components/DatePicker/DateRangePicker.d.ts

@@ -0,0 +1,8 @@
+import * as React from "react";
+import { InputProps } from "../Input";
+import { DateRangePickerInputProps } from "./DateRangePickerInput";
+/** DatePicker with the Input wrapper */
+interface DateRangePickerProps extends InputProps, DateRangePickerInputProps, React.ComponentPropsWithRef<"input"> {
+}
+declare const DateRangePicker: React.FC<DateRangePickerProps>;
+export default DateRangePicker;

package/lib/dist/components/DatePicker/DateRangePickerInput.d.ts

@@ -0,0 +1,34 @@
+import * as React from "react";
+export interface DateRangePickerInputProps {
+    /**
+     * The starting date value, formatted as a string.
+     */
+    startDate?: string;
+    /**
+     * The ending date value, formatted as a string.
+     */
+    endDate?: string;
+    /**
+     * The DatePicker component to be used (react-datepicker by default)
+     */
+    datePicker?: React.ComponentType<any>;
+    /**
+     * Function to set the starting date. Typically used as an event handler.
+     */
+    setStartDate?: string;
+    /**
+     * Function to set the ending date. Typically used as an event handler.
+     */
+    setEndDate?: string;
+    /**
+     * Additional props for the start date DatePicker component.
+     * Can be used to pass custom settings or event handlers.
+     */
+    fromProps?: object;
+    /**
+     * Additional props for the end date DatePicker component.
+     * Can be used to pass custom settings or event handlers.
+     */
+    toProps?: object;
+}
+export declare const DateRangePickerInput: React.ForwardRefExoticComponent<DateRangePickerInputProps & React.RefAttributes<HTMLInputElement>>;

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

@@ -0,0 +1,4 @@
+export { default as DatePicker } from "./DatePicker";
+export { default as DateRangePicker } from "./DateRangePicker";
+export { DatePickerInput } from "./DatePickerInput";
+export { DateRangePickerInput } from "./DateRangePickerInput";

package/lib/dist/components/DatePickerNew/DateRangePickerInput.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+interface DateRangePickerInputProps {
+    startDate?: string;
+    endDate?: string;
+    setStartDate?: string;
+    setEndDate?: string;
+    fromProps?: object;
+    toProps?: object;
+}
+declare const DateRangePickerInput: React.FC<DateRangePickerInputProps>;
+export default DateRangePickerInput;

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

@@ -0,0 +1,40 @@
+import * as React from "react";
+interface EmptyProps extends Omit<React.ComponentPropsWithRef<"div">, "title"> {
+    /**
+     * The content to be rendered in the empty state. @design
+     */
+    children?: React.ReactNode;
+    /**
+     * The title to be rendered in the empty state.
+     */
+    title?: React.ReactNode;
+    /**
+     * The kind of empty state to be rendered. @design
+     */
+    kind?: "undefined" | "large";
+    /**
+     * The icon to be rendered in the empty state. @design
+     */
+    icon?: React.ReactNode;
+    /**
+     * The button to be rendered in the empty state. @design
+     */
+    button?: React.ReactNode;
+    /**
+     * The CSS class name to be appended to the top-level node.
+     */
+    className?: string;
+    /**
+     * The replaceable components to be used for the empty state.
+     */
+    components?: {
+        Icon: React.ReactNode;
+        Text: React.ReactNode;
+    };
+}
+/** The Empty component can be used whenever a section should indicate that there is no content available. This can be the case for a empty list table or search results. */
+declare const Empty: {
+    ({ button, children, className, components, icon, title, kind, ...other }: EmptyProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default Empty;

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

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

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

@@ -0,0 +1,47 @@
+import * as React from "react";
+import { ScreenSize } from "../../utils";
+/** A Footer is a section at the bottom of each page. It typically contains basic site information, copyright data or links to related pages. */
+interface FooterProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     The content of the footer containing relevant links
+   */
+    children?: React.ReactNode;
+    /**
+     Additional className which will be added
+   */
+    className?: string;
+    /**
+     Meta content, usually the copyright notice
+   */
+    metaContent?: React.ReactNode;
+    metaLinks?: React.ReactNode;
+    /**
+     Optional WFP logo for mobile devices, can be used if the Logo should be provided by the CDN
+   */
+    logo?: string | React.ReactNode;
+    /**
+     Optional WFP logo for desktop devices, can be used if the Logo should be provided by the CDN
+   */
+    logoExtended?: string | React.ReactNode;
+    /**
+     * Specify the max-width on desktop devices (same as \`Wrapper\` component)
+     */
+    pageWidth?: ScreenSize;
+    /**
+     Override the SDG icon
+   */
+    sdgLogo?: React.ReactNode;
+    /**
+     The WFP logo, can be used if the SDG logo should be provided in a different way
+   */
+    subTitle?: string | React.ReactNode;
+    secondary?: React.ReactNode;
+    labelOne?: string;
+    labelTwo?: string;
+    linkTextOne?: string;
+    linkHrefOne?: string;
+    linkTextTwo?: string;
+    linkHrefTwo?: string;
+}
+declare const Footer: React.FC<FooterProps>;
+export default Footer;

package/lib/dist/components/Footer/FooterExternal.d.ts

@@ -0,0 +1,22 @@
+import * as React from "react";
+import type { PropsWithChildren } from "react";
+import { ScreenSize } from "../../utils";
+type FooterExternalProps = PropsWithChildren<{
+    className?: string;
+    productName?: React.ReactNode;
+    metaContent?: React.ReactNode;
+    metaLinks?: React.ReactNode;
+    pageWidth?: ScreenSize;
+}>;
+declare const FooterExternal: React.FC<FooterExternalProps>;
+type LinksColumnProps = PropsWithChildren<{
+    className?: string;
+    title?: string;
+}>;
+declare const LinksColumn: React.FC<LinksColumnProps>;
+export interface FooterMetaLinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
+    className?: string;
+    href?: string;
+}
+declare const FooterMetaLink: React.FC<FooterMetaLinkProps>;
+export { FooterExternal, LinksColumn, FooterMetaLink };

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

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

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

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import type { PropsWithChildren } from 'react';
+type FormProps = PropsWithChildren<{
+    /**
+     * Default margin is added to each form input
+     */
+    longForm?: boolean;
+    /**
+     * Provide a custom className to be applied on the containing <form> node
+     */
+    className?: string;
+}>;
+/** A form is a group of related input controls that allows users to provide data or configure options. */
+declare const Form: React.FC<FormProps>;
+export default Form;

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

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

package/lib/dist/components/FormGroup/FormGroup.d.ts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+interface FormGroupProps extends React.ComponentPropsWithRef<'a'> {
+    legendText?: string;
+    breakpoint?: 'none' | 'sm' | 'md' | 'lg';
+    message?: boolean;
+    messageText?: string;
+    align?: 'vertical' | 'horizontal';
+    inputSpacing?: 'none' | 'md' | 'lg';
+    className?: string;
+    inline?: boolean;
+}
+/** A FormGroup element is used to group several controls as well as labels  within a web form. It uses  `<fieldset>` */
+declare const FormGroup: React.FC<FormGroupProps>;
+export default FormGroup;

package/lib/dist/components/FormGroup/index.d.ts

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

package/lib/dist/components/FormHint/FormHint.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+import type { PropsWithChildren } from "react";
+/** FormHint allows you to add a longer explanation to an input element. */
+type FormHintProps = PropsWithChildren<{
+    /**
+     * The additional className which will be added
+     */
+    className?: string;
+    /**
+     * The description of the icon
+     */
+    description?: string;
+}>;
+declare const FormHint: React.FC<FormHintProps>;
+export default FormHint;

package/lib/dist/components/FormHint/index.d.ts

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

package/lib/dist/components/FormItem/FormItem.d.ts

@@ -0,0 +1,17 @@
+import React, { PropsWithChildren } from "react";
+export interface FormItemProps extends React.AllHTMLAttributes<HTMLDivElement> {
+    /**
+     * Specify whether the FormItem should be rendered as invalid
+     */
+    invalid?: boolean;
+    /**
+     * Specify whether the FormItem should be rendered as inline
+     */
+    inline?: boolean;
+    /**
+     * Provide the contents of your FormItem
+     */
+    children?: React.ReactNode;
+}
+declare const FormItem: React.FC<PropsWithChildren<FormItemProps>>;
+export default FormItem;

package/lib/dist/components/FormItem/index.d.ts

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

package/lib/dist/components/FormLabel/FormLabel.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import type { PropsWithChildren } from 'react';
+/** Form Label can be used whenever it is needed to show a label detached from a regular input. */
+type FormLabelProps = PropsWithChildren<{
+    /**
+     * The ID of the related input which will be used as `htmlFor`
+     */
+    id?: string;
+    /**
+     * Additional `class` attributes
+     */
+    className?: string;
+}>;
+declare const FormLabel: React.FC<FormLabelProps>;
+export default FormLabel;

package/lib/dist/components/FormLabel/index.d.ts

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

package/lib/dist/components/Hero/Hero.d.ts

@@ -0,0 +1,53 @@
+import * as React from 'react';
+import type { PropsWithChildren } from 'react';
+import { HeroKind } from '../../utils';
+/**
+ * Hero are a convenient means of displaying content composed of different types of objects. It is a multi usage component which creates boxes that are usually teasing some kind of content. */
+type HeroProps = PropsWithChildren<{
+    /**
+     The links target
+  */
+    href?: string;
+    /**
+     An optimized photograph
+   */
+    image?: string;
+    /**
+    External link flag
+  */
+    isExternal?: boolean;
+    /**
+    Render the Hero as link
+  */
+    isLink?: boolean;
+    /**
+    A short sentence to explain the content of the node (max 180 characters)
+  */
+    subTitle?: React.ReactNode;
+    /**
+     A search-friendly title (ideally 50 characters, max 100)
+  */
+    title?: string | React.ReactNode;
+    /**
+    Additional metadatas
+  */
+    metadata?: string;
+    /**
+    Additional more content
+  */
+    more?: React.ReactNode;
+    /**
+    Kind of Hero
+  */
+    kind?: HeroKind;
+    /**
+    The URL where the content uploaded is located.
+  */
+    url?: string;
+    /**
+     Additional className which will be added
+   */
+    className?: string;
+}>;
+declare const Hero: React.FC<HeroProps>;
+export default Hero;

package/lib/dist/components/Hero/HeroExternal.d.ts

@@ -0,0 +1,22 @@
+import React, { ReactNode } from 'react';
+import type { PropsWithChildren } from 'react';
+type HeroExternalProps = PropsWithChildren<{
+    /**
+     A search-friendly title (ideally 50 characters, max 100)
+  */
+    title?: string | ReactNode;
+    /**
+     Additional className which will be added
+   */
+    className?: string;
+    /**
+    A short sentence to explain the content of the node (max 180 characters)
+  */
+    subTitle: React.ReactNode;
+    /**
+     An optimized photograph
+   */
+    image: string;
+}>;
+declare const HeroExternal: React.FC<HeroExternalProps>;
+export default HeroExternal;

package/lib/dist/components/Hero/index.d.ts

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

package/lib/dist/components/InfoBar/InfoBar.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { ScreenSize } from '../../utils';
+/** The InfoBar shows very important information on top of the page. */
+interface InfoBarProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     *  `pageWidth` for the `<Wrapper />` component
+     */
+    pageWidth?: ScreenSize;
+    /**
+     * Additional `className` for the `<Wrapper />` component
+     */
+    wrapperClassName?: string;
+    /**
+     * The CSS class name to be placed on the wrapping element.
+     */
+    className?: string;
+    /**
+     * Additional `id` provided to the wrapping element
+     */
+    id?: string;
+}
+declare const InfoBar: React.FC<InfoBarProps>;
+export default InfoBar;

package/lib/dist/components/InfoBar/index.d.ts

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

package/lib/dist/components/InlineLoading/InlineLoading.d.ts

@@ -0,0 +1,26 @@
+import * as React from "react";
+interface InlineLoadingProps {
+    /**
+     * Specify whether the load was successful
+     */
+    success?: boolean;
+    /**
+     * Specify the description for the inline loading text
+     */
+    description?: React.ReactNode;
+    /**
+     * Provide a delay for the `setTimeout` for success
+     */
+    successDelay?: number;
+    /**
+     * Provide an optional handler to be invoked when <InlineLoading> is
+     * successful
+     */
+    onSuccess?: () => void;
+    /**
+     * Specify a custom className to be applied to the container node
+     */
+    className?: string;
+}
+declare const InlineLoading: React.FC<InlineLoadingProps>;
+export default InlineLoading;

package/lib/dist/components/InlineLoading/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./InlineLoading";