@lumx/react 3.0.7 → 3.1.0

package/dist/README.md

@@ -0,0 +1,38 @@
+# LumApps Design System (LumX)
+
+The first official LumApps Design System for [React][react] applications.
+_LumX_ will help you design your applications faster and more easily. You will be able to use LumX with either the LumApps design styleguides or the [Google Material Design specifications][material].
+
+## Quick start
+
+To start to use LumX, you can either:
+
+-   Install with Yarn/NPM:
+
+```bash
+yarn add @lumx/react
+# Or
+npm install @lumx/react
+```
+
+-   Download the latest release for [React][react-release]
+-   Clone the repository: `git clone https://github.com/lumapps/design-system.git`
+
+## Documentation
+
+You can find an online version of the demo and documentation site at https://design.lumapps.com.
+
+## How to get help, contribute, or provide feedback
+
+Please refer to our [contributing guidelines](CONTRIBUTING.md).
+
+## Copyright and license
+
+Code and documentation copyright 2019 LumApps. Code released under the [MIT license](LICENSE.md).
+
+[angularjs]: https://angularjs.org/
+[react]: https://react.org/
+[material]: http://www.google.com/design/spec/material-design/introduction.html
+[angularjs-release]: https://www.npmjs.com/package/@lumx/angularjs
+[react-release]: https://www.npmjs.com/package/@lumx/react
+[webpack]: https://webpack.js.org/

package/{_internal → dist/_internal}/types.d.ts

@@ -285,4 +285,4 @@ declare const ThumbnailVariant: {
 };
 declare type ThumbnailVariant = ValueOf<typeof ThumbnailVariant>;
 
-export { Alignment as A, Comp as C, Emphasis as E, Falsy as F, GenericProps as G, HasTheme as H, Kind as K, Orientation as O, Size as S, Typography as T, ValueOf as V, HorizontalAlignment as a, Color as b, Callback as c, ColorPalette as d, VerticalAlignment as e, ColorVariant as f, TextElement as g, HeadingElement as h, AspectRatio as i, FocusPoint as j, ThumbnailSize as k, ThumbnailVariant as l, HasAriaLabelOrLabelledBy as m, GlobalSize as n, TypographyInterface as o, Theme as p, TypographyTitleCustom as q, TypographyCustom as r, ThumbnailAspectRatio as s };
+export { Alignment as A, Comp as C, Emphasis as E, Falsy as F, GenericProps as G, HasTheme as H, Kind as K, Orientation as O, Size as S, Typography as T, ValueOf as V, HorizontalAlignment as a, ColorPalette as b, Callback as c, VerticalAlignment as d, ColorVariant as e, TextElement as f, HeadingElement as g, AspectRatio as h, FocusPoint as i, ThumbnailSize as j, ThumbnailVariant as k, HasAriaLabelOrLabelledBy as l, GlobalSize as m, TypographyInterface as n, Color as o, Theme as p, TypographyTitleCustom as q, TypographyCustom as r, ThumbnailAspectRatio as s };

package/{index.d.ts → dist/index.d.ts}

@@ -1,6 +1,6 @@
 import React, { ReactNode, SyntheticEvent, ReactElement, MouseEventHandler, KeyboardEventHandler, AriaAttributes, DetailedHTMLProps, ButtonHTMLAttributes, InputHTMLAttributes, Ref, RefObject, ImgHTMLAttributes, CSSProperties, SetStateAction, Key } from 'react';
-import { K as Kind, C as Comp, G as GenericProps, H as HasTheme, a as HorizontalAlignment, S as Size, b as Color, E as Emphasis, V as ValueOf, c as Callback, d as ColorPalette, A as Alignment, e as VerticalAlignment, O as Orientation, f as ColorVariant, T as Typography, g as TextElement, h as HeadingElement, i as AspectRatio, F as Falsy, j as FocusPoint, k as ThumbnailSize, l as ThumbnailVariant, m as HasAriaLabelOrLabelledBy, n as GlobalSize, o as TypographyInterface } from './_internal/types.js';
-export { A as Alignment, i as AspectRatio, c as Callback, b as Color, d as ColorPalette, f as ColorVariant, E as Emphasis, j as FocusPoint, G as GenericProps, n as GlobalSize, h as HeadingElement, a as HorizontalAlignment, K as Kind, O as Orientation, S as Size, g as TextElement, p as Theme, s as ThumbnailAspectRatio, k as ThumbnailSize, l as ThumbnailVariant, T as Typography, r as TypographyCustom, o as TypographyInterface, q as TypographyTitleCustom, e as VerticalAlignment } from './_internal/types.js';
+import { K as Kind, C as Comp, G as GenericProps, H as HasTheme, a as HorizontalAlignment, S as Size, b as ColorPalette, E as Emphasis, V as ValueOf, c as Callback, A as Alignment, d as VerticalAlignment, O as Orientation, e as ColorVariant, T as Typography, f as TextElement, g as HeadingElement, h as AspectRatio, F as Falsy, i as FocusPoint, j as ThumbnailSize, k as ThumbnailVariant, l as HasAriaLabelOrLabelledBy, m as GlobalSize, n as TypographyInterface } from './_internal/types.js';
+export { A as Alignment, h as AspectRatio, c as Callback, o as Color, b as ColorPalette, e as ColorVariant, E as Emphasis, i as FocusPoint, G as GenericProps, m as GlobalSize, g as HeadingElement, a as HorizontalAlignment, K as Kind, O as Orientation, S as Size, f as TextElement, p as Theme, s as ThumbnailAspectRatio, j as ThumbnailSize, k as ThumbnailVariant, T as Typography, r as TypographyCustom, n as TypographyInterface, q as TypographyTitleCustom, d as VerticalAlignment } from './_internal/types.js';
 
 interface AlertDialogProps extends Omit<DialogProps, 'header' | 'footer'> {
     /** Message variant. */
@@ -261,7 +261,7 @@ interface BadgeProps extends GenericProps {
     /** Badge content. */
     children?: ReactNode;
     /** Color variant. */
-    color?: Color;
+    color?: ColorPalette;
 }
 /**
  * Badge component.
@@ -279,7 +279,7 @@ declare type HTMLButtonProps = DetailedHTMLProps<ButtonHTMLAttributes<HTMLButton
 declare type ButtonSize = Extract<Size, 's' | 'm'>;
 interface BaseButtonProps extends GenericProps, Pick<AriaAttributes, 'aria-expanded' | 'aria-haspopup' | 'aria-pressed' | 'aria-label'>, HasTheme {
     /** Color variant. */
-    color?: Color;
+    color?: ColorPalette;
     /** Emphasis variant. */
     emphasis?: Emphasis;
     /** Whether or not the button has a background color in low emphasis. */
@@ -426,7 +426,7 @@ interface ChipProps extends GenericProps, HasTheme {
     /** A component to be rendered before the content. */
     before?: ReactNode;
     /** Color variant. */
-    color?: Color;
+    color?: ColorPalette;
     /** Whether the component is clickable or not. */
     isClickable?: boolean;
     /** Whether the component is disabled or not. */
@@ -1172,13 +1172,40 @@ interface GridItemProps extends GenericProps {
  */
 declare const GridItem: Comp<GridItemProps, HTMLDivElement>;
 
+declare type GridColumnGapSize = Extract<Size, 'tiny' | 'regular' | 'big' | 'huge'>;
+/**
+ * Defines the props of the component.
+ */
+interface GridColumnProps extends GenericProps {
+    /** Customize the root element. */
+    as?: React.ElementType;
+    /** Children elements. */
+    children?: ReactNode;
+    /** Space between columns and rows. */
+    gap?: GridColumnGapSize;
+    /** Ideal number of columns. */
+    maxColumns?: number;
+    /** Minimum width for each item, reduce the number of column if there is not enough space. */
+    itemMinWidth?: number;
+}
+/**
+ * The GridColumn is a layout component that can display children in a grid
+ * with custom display properties. It also comes with a responsive design,
+ * with a number of column that reduce when there is not enough space for each item.
+ *
+ * @param props Component props.
+ * @param ref Component ref.
+ * @return React element.
+ */
+declare const GridColumn: Comp<GridColumnProps>;
+
 declare type IconSizes = Extract<Size, 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl'>;
 /**
  * Defines the props of the component.
  */
 interface IconProps extends GenericProps, HasTheme {
     /** Color variant. */
-    color?: Color;
+    color?: ColorPalette;
     /** Lightened or darkened variant of the selected icon color. */
     colorVariant?: ColorVariant;
     /** Whether the icon has a shape. */
@@ -1403,7 +1430,7 @@ declare type HTMLAnchorProps = React.DetailedHTMLProps<React.AnchorHTMLAttribute
  */
 interface LinkProps extends GenericProps {
     /** Color variant. */
-    color?: Color;
+    color?: ColorPalette;
     /** Lightened or darkened variant of the selected icon color. */
     colorVariant?: ColorVariant;
     /** Link href. */
@@ -1710,12 +1737,44 @@ interface ProgressProps extends GenericProps, HasTheme {
 /**
  * Progress component.
  *
+ * @deprecated use `ProgressLinear` and `ProgressCircular` instead.
  * @param  props Component props.
  * @param  ref   Component ref.
  * @return React element.
  */
 declare const Progress: Comp<ProgressProps, HTMLDivElement>;
 
+/**
+ * Progress sizes.
+ */
+declare type ProgressCircularSize = Extract<Size, 'xxs' | 'xs' | 's' | 'm'>;
+/**
+ * Defines the props of the component.
+ */
+interface ProgressCircularProps extends GenericProps, HasTheme {
+    /** Progress circular size. */
+    size?: ProgressCircularSize;
+}
+/**
+ * ProgressCircularProps component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const ProgressCircular: Comp<ProgressCircularProps, HTMLDivElement>;
+
+interface ProgressLinearProps extends GenericProps, HasTheme {
+}
+/**
+ * ProgressLinear component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+declare const ProgressLinear: Comp<ProgressLinearProps, HTMLDivElement>;
+
 interface ProgressTrackerProviderProps {
     /** Active step index. */
     activeStepIndex?: number;
@@ -2726,4 +2785,4 @@ interface UserBlockProps extends GenericProps, HasTheme {
  */
 declare const UserBlock: Comp<UserBlockProps, HTMLDivElement>;
 
-export { AlertDialog, AlertDialogProps, Autocomplete, AutocompleteMultiple, AutocompleteMultipleProps, AutocompleteProps, Avatar, AvatarProps, AvatarSize, Badge, BadgeProps, BaseButtonProps, Button, ButtonEmphasis, ButtonGroup, ButtonGroupProps, ButtonProps, ButtonSize, Checkbox, CheckboxProps, Chip, ChipGroup, ChipGroupProps, ChipProps, CommentBlock, CommentBlockProps, CommentBlockVariant, DatePicker, DatePickerControlled, DatePickerControlledProps, DatePickerField, DatePickerFieldProps, DatePickerProps, Dialog, DialogProps, DialogSizes, Divider, DividerProps, DragHandle, DragHandleProps, Dropdown, DropdownProps, Elevation, ExpansionPanel, ExpansionPanelProps, Flag, FlagProps, FlexBox, FlexBoxProps, FlexHorizontalAlignment, FlexVerticalAlignment, GapSize, GenericBlock, GenericBlockGapSize, GenericBlockProps, Grid, GridItem, GridItemProps, GridProps, Heading, HeadingLevelProvider, HeadingLevelProviderProps, HeadingProps, Icon, IconButton, IconButtonProps, IconProps, IconSizes, ImageBlock, ImageBlockCaptionPosition, ImageBlockProps, ImageBlockSize, InlineList, InlineListProps, InputHelper, InputHelperProps, InputLabel, InputLabelProps, Lightbox, LightboxProps, Link, LinkPreview, LinkPreviewProps, LinkProps, List, ListDivider, ListDividerProps, ListItem, ListItemProps, ListItemSize, ListProps, ListSubheader, ListSubheaderProps, MarginAutoAlignment, Message, MessageProps, Mosaic, MosaicProps, Notification, NotificationProps, Offset, Placement, Popover, PopoverDialog, PopoverDialogProps, PopoverProps, PostBlock, PostBlockProps, Progress, ProgressProps, ProgressTracker, ProgressTrackerProps, ProgressTrackerProvider, ProgressTrackerProviderProps, ProgressTrackerStep, ProgressTrackerStepPanel, ProgressTrackerStepPanelProps, ProgressTrackerStepProps, ProgressVariant, RadioButton, RadioButtonProps, RadioGroup, RadioGroupProps, Select, SelectMultiple, SelectMultipleField, SelectMultipleProps, SelectProps, SelectVariant, SideNavigation, SideNavigationItem, SideNavigationItemProps, SideNavigationProps, SkeletonCircle, SkeletonCircleProps, SkeletonRectangle, SkeletonRectangleProps, SkeletonRectangleVariant, SkeletonTypography, SkeletonTypographyProps, Slider, SliderProps, Slides, SlidesProps, Slideshow, SlideshowControls, SlideshowControlsProps, SlideshowItem, SlideshowItemProps, SlideshowProps, Switch, SwitchProps, Tab, TabList, TabListLayout, TabListProps, TabPanel, TabPanelProps, TabProps, TabProvider, TabProviderProps, Table, TableBody, TableBodyProps, TableCell, TableCellProps, TableCellVariant, TableHeader, TableHeaderProps, TableProps, TableRow, TableRowProps, Text, TextField, TextFieldProps, TextProps, ThOrder, Thumbnail, ThumbnailProps, Toolbar, ToolbarProps, Tooltip, TooltipPlacement, TooltipProps, Uploader, UploaderProps, UploaderSize, UploaderVariant, UserBlock, UserBlockProps, UserBlockSize, clamp, isClickable, useFocusPointStyle, useHeadingLevel };
+export { AlertDialog, AlertDialogProps, Autocomplete, AutocompleteMultiple, AutocompleteMultipleProps, AutocompleteProps, Avatar, AvatarProps, AvatarSize, Badge, BadgeProps, BaseButtonProps, Button, ButtonEmphasis, ButtonGroup, ButtonGroupProps, ButtonProps, ButtonSize, Checkbox, CheckboxProps, Chip, ChipGroup, ChipGroupProps, ChipProps, CommentBlock, CommentBlockProps, CommentBlockVariant, DatePicker, DatePickerControlled, DatePickerControlledProps, DatePickerField, DatePickerFieldProps, DatePickerProps, Dialog, DialogProps, DialogSizes, Divider, DividerProps, DragHandle, DragHandleProps, Dropdown, DropdownProps, Elevation, ExpansionPanel, ExpansionPanelProps, Flag, FlagProps, FlexBox, FlexBoxProps, FlexHorizontalAlignment, FlexVerticalAlignment, GapSize, GenericBlock, GenericBlockGapSize, GenericBlockProps, Grid, GridColumn, GridColumnGapSize, GridColumnProps, GridItem, GridItemProps, GridProps, Heading, HeadingLevelProvider, HeadingLevelProviderProps, HeadingProps, Icon, IconButton, IconButtonProps, IconProps, IconSizes, ImageBlock, ImageBlockCaptionPosition, ImageBlockProps, ImageBlockSize, InlineList, InlineListProps, InputHelper, InputHelperProps, InputLabel, InputLabelProps, Lightbox, LightboxProps, Link, LinkPreview, LinkPreviewProps, LinkProps, List, ListDivider, ListDividerProps, ListItem, ListItemProps, ListItemSize, ListProps, ListSubheader, ListSubheaderProps, MarginAutoAlignment, Message, MessageProps, Mosaic, MosaicProps, Notification, NotificationProps, Offset, Placement, Popover, PopoverDialog, PopoverDialogProps, PopoverProps, PostBlock, PostBlockProps, Progress, ProgressCircular, ProgressCircularProps, ProgressCircularSize, ProgressLinear, ProgressLinearProps, ProgressProps, ProgressTracker, ProgressTrackerProps, ProgressTrackerProvider, ProgressTrackerProviderProps, ProgressTrackerStep, ProgressTrackerStepPanel, ProgressTrackerStepPanelProps, ProgressTrackerStepProps, ProgressVariant, RadioButton, RadioButtonProps, RadioGroup, RadioGroupProps, Select, SelectMultiple, SelectMultipleField, SelectMultipleProps, SelectProps, SelectVariant, SideNavigation, SideNavigationItem, SideNavigationItemProps, SideNavigationProps, SkeletonCircle, SkeletonCircleProps, SkeletonRectangle, SkeletonRectangleProps, SkeletonRectangleVariant, SkeletonTypography, SkeletonTypographyProps, Slider, SliderProps, Slides, SlidesProps, Slideshow, SlideshowControls, SlideshowControlsProps, SlideshowItem, SlideshowItemProps, SlideshowProps, Switch, SwitchProps, Tab, TabList, TabListLayout, TabListProps, TabPanel, TabPanelProps, TabProps, TabProvider, TabProviderProps, Table, TableBody, TableBodyProps, TableCell, TableCellProps, TableCellVariant, TableHeader, TableHeaderProps, TableProps, TableRow, TableRowProps, Text, TextField, TextFieldProps, TextProps, ThOrder, Thumbnail, ThumbnailProps, Toolbar, ToolbarProps, Tooltip, TooltipPlacement, TooltipProps, Uploader, UploaderProps, UploaderSize, UploaderVariant, UserBlock, UserBlockProps, UserBlockSize, clamp, isClickable, useFocusPointStyle, useHeadingLevel };