@lumx/react 4.2.0 → 4.2.1-alpha.1

package/index.d.ts

@@ -1,7 +1,7 @@
-import { Kind as Kind$1, HorizontalAlignment, Size as Size$1, ColorPalette as ColorPalette$1, VerticalAlignment, Alignment, Orientation, AspectRatio, ColorWithVariants as ColorWithVariants$1, ColorVariant as ColorVariant$1, Typography as Typography$1, Emphasis as Emphasis$1, GlobalSize, TypographyInterface as TypographyInterface$1, Theme as Theme$1 } from '@lumx/core/js/constants';
+import { Kind as Kind$1, HorizontalAlignment as HorizontalAlignment$1, Size as Size$1, ColorPalette as ColorPalette$1, Orientation as Orientation$1, Alignment as Alignment$1, AspectRatio, ColorWithVariants as ColorWithVariants$1, ColorVariant as ColorVariant$1, Typography as Typography$1, Emphasis as Emphasis$1, GlobalSize, TypographyInterface as TypographyInterface$1, Theme as Theme$1 } from '@lumx/core/js/constants';
 export * from '@lumx/core/js/constants';
 import * as _lumx_core_js_types from '@lumx/core/js/types';
-import { GenericProps as GenericProps$1, HasTheme as HasTheme$1, ValueOf, HasAriaDisabled as HasAriaDisabled$1, HasCloseMode, HeadingElement as HeadingElement$1, Falsy, HasClassName as HasClassName$1, HasRequiredLinkHref, HasAriaLabelOrLabelledBy } from '@lumx/core/js/types';
+import { GenericProps as GenericProps$1, HasTheme as HasTheme$1, ValueOf, HasAriaDisabled as HasAriaDisabled$1, HasCloseMode, Falsy, HasClassName as HasClassName$1, HeadingElement as HeadingElement$1, HasRequiredLinkHref, HasAriaLabelOrLabelledBy } from '@lumx/core/js/types';
 export * from '@lumx/core/js/types';
 import * as React$1 from 'react';
 import React__default, { Ref, ReactElement, ReactNode, SyntheticEvent, MouseEventHandler, KeyboardEventHandler, AriaAttributes, InputHTMLAttributes, RefObject, ImgHTMLAttributes, CSSProperties, SetStateAction, Key, ElementType, ComponentProps } from 'react';
@@ -241,7 +241,7 @@ interface AutocompleteMultipleProps extends AutocompleteProps {
     /** Selected values. */
     values: any[];
     /** Alignment of the chips in the autocomplete. */
-    chipsAlignment?: HorizontalAlignment;
+    chipsAlignment?: HorizontalAlignment$1;
     /** Selected value render function. Default: Renders the value inside of a Chip. */
     selectedChipRender(choice: any, index: number, onClear?: (event: React.MouseEvent, val: any) => void, isDisabled?: boolean): ReactNode | string;
 }
@@ -318,6 +318,24 @@ interface BadgeWrapperProps extends GenericProps$1 {
 }
 declare const BadgeWrapper: Comp<BadgeWrapperProps, HTMLDivElement>;
 
+/**
+ * Alignments.
+ */
+declare const Alignment: {
+    readonly bottom: "bottom";
+    readonly center: "center";
+    readonly end: "end";
+    readonly left: "left";
+    readonly right: "right";
+    readonly spaceAround: "space-around";
+    readonly spaceBetween: "space-between";
+    readonly spaceEvenly: "space-evenly";
+    readonly start: "start";
+    readonly top: "top";
+};
+type Alignment = ValueOf<typeof Alignment>;
+type VerticalAlignment = Extract<Alignment, 'top' | 'center' | 'bottom'>;
+type HorizontalAlignment = Extract<Alignment, 'right' | 'center' | 'left'>;
 declare const Theme: {
     readonly light: "light";
     readonly dark: "dark";
@@ -338,6 +356,11 @@ declare const Size: {
     readonly huge: "huge";
 };
 type Size = ValueOf<typeof Size>;
+declare const Orientation: {
+    readonly horizontal: "horizontal";
+    readonly vertical: "vertical";
+};
+type Orientation = ValueOf<typeof Orientation>;
 declare const Emphasis: {
     readonly low: "low";
     readonly medium: "medium";
@@ -531,7 +554,7 @@ interface BaseButtonProps extends GenericProps, Pick<AriaAttributes, 'aria-expan
     target?: '_self' | '_blank' | '_parent' | '_top';
     /** Native button type. */
     type?: 'submit' | 'reset' | 'button' | undefined;
-    /** Custom react component for the link (can be used to inject react router Link). */
+    /** Custom component for the link (can be used to inject router Link). */
     linkAs?: 'a' | any;
 }
 
@@ -622,7 +645,7 @@ interface ButtonGroupProps extends GenericProps {
     /**
      * Children
      */
-    children?: React.ReactNode;
+    children?: JSXElement;
 }
 
 /**
@@ -726,7 +749,7 @@ interface ChipGroupProps extends GenericProps$1 {
      * Chip horizontal alignment.
      * @deprecated
      */
-    align?: HorizontalAlignment;
+    align?: HorizontalAlignment$1;
     /** List of Chip. */
     children: ReactNode;
 }
@@ -1179,16 +1202,20 @@ interface ExpansionPanelProps extends GenericProps$1, HasCloseMode, HasTheme$1 {
  */
 declare const ExpansionPanel: Comp<ExpansionPanelProps, HTMLDivElement>;
 
-interface FlagProps extends GenericProps$1, HasTheme$1 {
+interface FlagProps$1 extends GenericProps, HasTheme {
     /** Color of the component. */
-    color?: ColorPalette$1;
+    color?: ColorPalette;
     /** Icon to use before the label. */
     icon?: string;
     /** Text label of the flag. */
-    label: React.ReactNode;
+    children: JSXElement;
     /** Enable text truncate on overflow */
     truncate?: boolean;
 }
+
+interface FlagProps extends Omit<FlagProps$1, 'children'> {
+    label: React.ReactNode;
+}
 /**
  * Flag component.
  *
@@ -1199,18 +1226,17 @@ interface FlagProps extends GenericProps$1, HasTheme$1 {
 declare const Flag: Comp<FlagProps, HTMLDivElement>;
 
 type MarginAutoAlignment = Extract<Alignment, 'top' | 'bottom' | 'right' | 'left'>;
-type GapSize = Extract<Size$1, 'tiny' | 'regular' | 'medium' | 'big' | 'huge'>;
+type GapSize = Extract<Size, 'tiny' | 'regular' | 'medium' | 'big' | 'huge'>;
 type SpaceAlignment = Extract<Alignment, 'space-between' | 'space-evenly' | 'space-around'>;
 type FlexVerticalAlignment = VerticalAlignment | SpaceAlignment;
 type FlexHorizontalAlignment = HorizontalAlignment | SpaceAlignment;
+
 /**
  * Defines the props of the component.
  */
-interface FlexBoxProps extends GenericProps$1 {
-    /** Customize the root element. */
-    as?: React.ElementType;
+interface FlexBoxProps$1 extends GenericProps {
     /** Children elements. */
-    children?: ReactNode;
+    children?: JSXElement;
     /** Whether the "content filling space" is enabled or not. */
     fillSpace?: boolean;
     /** Gap space between flexbox items. */
@@ -1228,6 +1254,14 @@ interface FlexBoxProps extends GenericProps$1 {
     /** Whether the "flex wrap" is enabled or not. */
     wrap?: boolean;
 }
+
+/**
+ * Defines the props of the component.
+ */
+interface FlexBoxProps extends FlexBoxProps$1 {
+    /** Customize the root element. */
+    as?: React__default.ElementType;
+}
 /**
  * FlexBox component.
  *
@@ -1383,15 +1417,6 @@ interface TextProps extends GenericProps {
     children?: JSXElement;
 }
 
-/**
- * Text component.
- *
- * @param  props Component props.
- * @param  ref   Component ref.
- * @return React element.
- */
-declare const Text: Comp<TextProps, HTMLElement>;
-
 /**
  * Defines the props of the component.
  */
@@ -1399,12 +1424,9 @@ interface HeadingProps extends Partial<TextProps> {
     /**
      * Display a specific heading level instead of the one provided by parent context provider.
      */
-    as?: HeadingElement$1;
-    /**
-     * Children
-     */
-    children?: React.ReactNode;
+    as?: HeadingElement;
 }
+
 /**
  * Renders a heading component.
  * Extends the `Text` Component with the heading level automatically computed based on
@@ -1434,13 +1456,13 @@ type GridGutterSize = Extract<Size$1, 'regular' | 'big' | 'huge'>;
  */
 interface GridProps extends GenericProps$1 {
     /** Orientation. */
-    orientation?: Orientation;
+    orientation?: Orientation$1;
     /** Whether the children are wrapped or not. */
     wrap?: string;
     /** Vertical alignment. */
-    vAlign?: Alignment;
+    vAlign?: Alignment$1;
     /** Horizontal alignment. */
-    hAlign?: Alignment;
+    hAlign?: Alignment$1;
     /** Gutter size. */
     gutter?: GridGutterSize;
     /** Children */
@@ -1461,7 +1483,7 @@ type Columns = '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9' | '10' | '11'
  */
 interface GridItemProps extends GenericProps$1 {
     /** Alignment. */
-    align?: Alignment;
+    align?: Alignment$1;
     /** Order. */
     order?: Columns;
     /** Width. */
@@ -1589,7 +1611,7 @@ type ImgHTMLProps = ImgHTMLAttributes<HTMLImageElement>;
  */
 interface ThumbnailProps extends GenericProps$1, HasTheme$1 {
     /** Alignment of the thumbnail in it's parent (requires flex parent). */
-    align?: HorizontalAlignment;
+    align?: HorizontalAlignment$1;
     /** Image alternative text. */
     alt: string;
     /** Image aspect ratio. */
@@ -1677,7 +1699,7 @@ interface ImageBlockProps extends GenericProps$1, HasTheme$1, ImageCaptionMetada
     /** Action toolbar content. */
     actions?: ReactNode;
     /** Alignment. */
-    align?: HorizontalAlignment;
+    align?: HorizontalAlignment$1;
     /** Image alternative text. */
     alt: string;
     /** Caption position. */
@@ -2053,13 +2075,13 @@ declare const ListSubheader: Comp<ListSubheaderProps, HTMLLIElement>;
 /**
  * Defines the props of the component.
  */
-interface MessageProps extends GenericProps$1 {
+interface MessageProps extends GenericProps {
     /** Content. */
-    children?: ReactNode;
+    children?: JSXElement;
     /** Whether the message has a background or not. */
     hasBackground?: boolean;
     /** Message variant. */
-    kind?: Kind$1;
+    kind?: Kind;
     /** Message custom icon SVG path. */
     icon?: string;
     /**
@@ -2074,6 +2096,7 @@ interface MessageProps extends GenericProps$1 {
         label: string;
     };
 }
+
 /**
  * Message component.
  *
@@ -2131,7 +2154,7 @@ declare const NavigationItem: (<E extends ElementType = "a">(props: React$1.Prop
 type NavigationProps = React.ComponentProps<'nav'> & HasClassName$1 & HasTheme$1 & {
     /** Content of the navigation. These components should be of type NavigationItem to be rendered */
     children?: React.ReactNode;
-    orientation?: Orientation;
+    orientation?: Orientation$1;
 } & HasAriaLabelOrLabelledBy;
 type SubComponents = {
     Section: typeof NavigationSection;
@@ -2196,7 +2219,7 @@ interface PostBlockProps extends GenericProps$1, HasTheme$1 {
     /** Metadata content. */
     meta?: ReactNode;
     /** Orientation. */
-    orientation?: Orientation;
+    orientation?: Orientation$1;
     /** Tag content. */
     tags?: ReactNode;
     /** Content (string, or sanitized html). */
@@ -2905,7 +2928,7 @@ interface SwitchProps extends GenericProps$1, HasTheme$1, HasAriaDisabled$1 {
     /** Native input name property. */
     name?: string;
     /** Position of the switch relative to the label. */
-    position?: Extract<Alignment, 'right' | 'left'>;
+    position?: Extract<Alignment$1, 'right' | 'left'>;
     /** Native input value property. */
     value?: string;
     /** On change callback. */
@@ -3078,7 +3101,7 @@ interface TabListProps extends GenericProps$1, HasTheme$1 {
     /** Layout of the tabs in the list. */
     layout?: TabListLayout;
     /** Position of the tabs in the list (requires 'clustered' layout). */
-    position?: Alignment;
+    position?: Alignment$1;
 }
 /**
  * TabList component.
@@ -3143,6 +3166,15 @@ interface TabPanelProps extends GenericProps$1 {
  */
 declare const TabPanel: Comp<TabPanelProps, HTMLDivElement>;
 
+/**
+ * Text component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const Text: Comp<TextProps, HTMLElement>;
+
 /**
  * Defines the props of the component.
  */
@@ -3364,7 +3396,7 @@ interface UserBlockProps extends GenericProps$1, HasTheme$1 {
     /** Props to pass to the name block. */
     nameProps?: GenericProps$1;
     /** Orientation. */
-    orientation?: Orientation;
+    orientation?: Orientation$1;
     /** Simple action toolbar content. */
     simpleAction?: ReactNode;
     /** Size variant. */