@progressiveui/react 1.22.0

package/umd/dist/components/Wrapper/Wrapper.d.ts

@@ -0,0 +1,22 @@
+import * as React from "react";
+import { ScreenSize } from "../../utils";
+export declare const pageWidths: string[];
+/** Wrapper can wrap it's content in a specific width depending on if the application has a full or fixed width. */
+export interface WrapperProps extends React.HTMLAttributes<HTMLSpanElement> {
+    /** Defines the width of the wrapper. Can be one of 'xs', 'sm', 'md', 'lg', 'full', 'narrow', 'narrower', or 'narrowest'. */
+    pageWidth?: "xs" | "sm" | "md" | "lg" | "full" | "narrow" | "narrower" | "narrowest";
+    /** Specifies the page width for mobile devices. It uses the ScreenSize type. */
+    mobilePageWidth?: ScreenSize;
+    /** Determines the spacing around the wrapper. Can be 'md' for medium or 'xl' for extra large. */
+    spacing?: "md" | "xl";
+    /** Sets the background theme. Can be 'lighter' for a light background or 'dark' for a dark background. */
+    background?: "lighter" | "dark";
+    /** Additional CSS class names to be applied to the wrapper. */
+    className?: string;
+    /** CSS class names specifically for the background of the wrapper. */
+    backgroundClassName?: string;
+    /** Custom CSS properties for the background styling. */
+    backgroundStyle?: React.CSSProperties;
+}
+declare const Wrapper: React.FC<WrapperProps>;
+export default Wrapper;

package/umd/dist/components/Wrapper/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './Wrapper';
+export { pageWidths } from './Wrapper';

package/umd/dist/globals/data/colors.d.ts

@@ -0,0 +1,609 @@
+export default colors;
+declare const colors: {
+    main: {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+    };
+    "sequential-default-07": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sequential-default-06": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sequential-default-05": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sequential-default-04": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sequential-default-03": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sequential-default-02": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sequential-default-01": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sequential-secondary-07": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sequential-secondary-06": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sequential-secondary-05": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sequential-secondary-04": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sequential-secondary-03": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sequential-secondary-02": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sequential-secondary-01": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "categorical-corporate-01": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "categorical-corporate-02": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "categorical-corporate-03": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "categorical-corporate-04": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "categorical-corporate-05": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "categorical-corporate-06": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "categorical-corporate-07": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "categorical-corporate-08": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "categorical-corporate-09": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "categorical-corporate-10": {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    female: {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    male: {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    national: {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    international: {
+        name: string;
+        hex: string;
+        scss: string;
+        type: string;
+        shortDescription: string;
+    };
+    "brand-01": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "interactive-01": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "interactive-02": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "accent-01": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "brand-01-20": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+    };
+    "brand-01-30": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+    };
+    "brand-01-40": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+    };
+    "brand-01-60": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+    };
+    "brand-01-70": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+    };
+    "brand-01-80": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+    };
+    "ui-01": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+        description: string;
+    };
+    "ui-02": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+        description: string;
+    };
+    "ui-03": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "ui-04": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "ui-05": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "ui-06": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "text-01": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "text-02": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "text-03": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "text-04": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "inverse-01": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "field-01": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "field-border-01": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "disabled-01": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "disabled-02": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sdg-01": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sdg-02": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sdg-03": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sdg-04": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sdg-05": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sdg-06": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sdg-07": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sdg-08": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sdg-09": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sdg-10": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sdg-11": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sdg-12": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sdg-13": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sdg-14": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sdg-15": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sdg-16": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "sdg-17": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+    };
+    "support-01": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+        description: string;
+    };
+    "support-light-01": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+        description: string;
+    };
+    "support-02": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+        description: string;
+    };
+    "support-light-02": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+        description: string;
+    };
+    "support-03": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+        description: string;
+    };
+    "support-light-03": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+        description: string;
+    };
+    "support-04": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+        description: string;
+    };
+    "support-light-04": {
+        name: string;
+        hex: string;
+        scss: string;
+        css: string;
+        type: string;
+        shortDescription: string;
+        description: string;
+    };
+};

package/umd/dist/globals/js/settings.d.ts

@@ -0,0 +1,34 @@
+/**
+ * Settings.
+ * @exports CarbonComponents.settings
+ * @type Object
+ * @property {boolean} [disableAutoInit]
+ *   Disables automatic instantiation of components.
+ *   By default (`CarbonComponents.disableAutoInit` is `false`),
+ *   carbon-components attempts to instantiate components automatically
+ *   by searching for elements with `data-component-name` (e.g. `data-loading`) attribute
+ *   or upon DOM events (e.g. clicking) on such elements.
+ *   See each components' static `.init()` methods for details.
+ * @property {string} [prefix=bx]
+ *   Brand prefix. Should be in sync with `$prefix` Sass variable in carbon-components/src/globals/scss/_vars.scss.
+ * // @todo given that the default value is so long, is it appropriate to put in the JSDoc?
+ * @property {string} [selectorTabbable]
+ *   A selector selecting tabbable/focusable nodes.
+ *   By default selectorTabbable references links, areas, inputs, buttons, selects, textareas,
+ *   iframes, objects, embeds, or elements explicitly using tabindex or contenteditable attributes
+ *   as long as the element is not `disabled` or the `tabindex="-1"`.
+ * @property {string} [selectorFocusable]
+ *   CSS selector that selects major nodes that are click focusable
+ *   This property is identical to selectorTabbable with the exception of
+ *   the `:not([tabindex='-1'])` pseudo class
+ */
+declare const settings: {
+    prefix: string;
+    initialized: boolean;
+    selectorTabbable: string;
+    selectorFocusable: string;
+    theme: string;
+    actualTheme: string;
+    setTheme: (theme: string) => void;
+};
+export default settings;

package/umd/dist/hooks/index.d.ts

@@ -0,0 +1 @@
+export { useTogglable } from "./togglable";

package/umd/dist/hooks/togglable.d.ts

@@ -0,0 +1,5 @@
+export function useTogglable(): {
+    isOpen: boolean;
+    open: () => void;
+    close: () => void;
+};

package/umd/dist/hooks/useHeightTransition.d.ts

@@ -0,0 +1,4 @@
+import { CSSProperties } from "react";
+import { TransitionState } from "react-transition-state";
+declare const useHeightTransition: <E extends Element>({ status, isResolved, }: TransitionState) => readonly [CSSProperties, import("react").RefObject<HTMLInputElement>];
+export { useHeightTransition };

package/umd/dist/hooks/useId.d.ts

@@ -0,0 +1,3 @@
+import { useId } from "react";
+declare const _useId: typeof useId;
+export { _useId as useId };

package/umd/dist/hooks/useIsomorphicLayoutEffect.d.ts

@@ -0,0 +1,12 @@
+import { useEffect } from "react";
+/**
+ * Custom hook for using either `useLayoutEffect` or `useEffect` based on the environment (client-side or server-side).
+ * @param {Function} effect - The effect function to be executed.
+ * @param {Array<any>} [dependencies] - An array of dependencies for the effect (optional).
+ * @see [Documentation](https://usehooks-ts.com/react-hook/use-isomorphic-layout-effect)
+ * @example
+ * useIsomorphicLayoutEffect(() => {
+ *   // Code to be executed during the layout phase on the client side
+ * }, [dependency1, dependency2]);
+ */
+export declare const useIsomorphicLayoutEffect: typeof useEffect;