@muffled-ui/react 1.0.21 → 1.0.22

package/README.md

@@ -7,30 +7,73 @@
 [![Build][build-image]][build-url] [![NPM Version][version-image]][version-url] [![License][license-image]][license-url] [![Bundle Size][size-image]][size-url]
 
 [build-image]: https://img.shields.io/github/actions/workflow/status/joshbatley/muffled-ui/publish-npm.yml
+
 [build-url]: https://github.com/joshbatley/muffled-ui/actions
+
 [version-image]: https://img.shields.io/npm/v/@muffled-ui/react
+
 [version-url]: https://www.npmjs.com/package/@muffled-ui/react
+
 [license-image]: https://img.shields.io/github/license/joshbatley/muffled-ui
+
 [license-url]: https://github.com/joshbatley/muffled-ui/blob/main/LICENSE
+
 [size-image]: https://img.shields.io/bundlephobia/min/%40muffled-ui%2Freact%40latest
+
 [size-url]: https://bundlephobia.com/package/@muffled-ui/react
 
 </div>
 
 ## Getting Started
 
-### Installation methods
+### Installation
 
-There are a few methods to choose from depending on your usage for muffled-ui
+Follow these steps to add Muffled UI to your React project:
 
-##### Install tailwind
+#### Install Muffled UI
 
-Follow this official set-up [guide](https://tailwindcss.com/docs/guides/create-react-app) to get tailwind working within your react application.
+```bash
+# Using npm
+npm install @muffled-ui/react
 
-##### Install muffled-ui
+# Using yarn
+yarn add @muffled-ui/react
 
+# Using pnpm
+pnpm add @muffled-ui/react
 ```
-npm/yarn install @muffled-ui/react
+
+### Usage
+
+Import and use components in your React application:
+
+```jsx
+import {Button, Card, Input} from '@muffled-ui/react';
+
+function MyComponent() {
+  return (
+    <Card>
+      <CardContent>
+        <h2>Login Form</h2>
+      </CardContent>
+      <CardContent>
+        <Input
+          label="Email"
+          placeholder="Enter your email"
+          type="email"
+        />
+        <Input
+          label="Password"
+          placeholder="Enter your password"
+          type="password"
+        />
+        <Button variant="primary">
+          Sign In
+        </Button>
+      </CardContent>
+    </Card>
+  );
+}
 ```
 
 ## Package used

package/dist/index.d.mts

@@ -1,6 +1,6 @@
 import * as styled_components from 'styled-components';
 import { StyledComponent, DefaultTheme } from 'styled-components';
-import { LayoutProps, SpaceProps, ColorProps, BoxShadowProps, BorderProps, OrderProps, GridProps, FlexboxProps, PositionProps, TypographyProps as TypographyProps$1 } from 'styled-system';
+import { LayoutProps, SpaceProps, ColorProps, BoxShadowProps, BorderProps, OrderProps, GridProps, FlexboxProps, PositionProps, TypographyProps } from 'styled-system';
 import * as react from 'react';
 import { ReactElement } from 'react';
 import { Placement } from '@popperjs/core';
@@ -168,7 +168,7 @@ declare const AccordionSummary: React.FC<AccordionSummaryProps>;
 declare const AccordionDetail: styled_components.StyledComponent<"div", styled_components.DefaultTheme, {}, never>;
 declare const DetailsGrouping: styled_components.StyledComponent<"div", styled_components.DefaultTheme, {}, never>;
 
-type BoxProps = ColorProps & SpaceProps & LayoutProps & BoxShadowProps & BorderProps & OrderProps & GridProps & FlexboxProps & PositionProps & TypographyProps$1 & {
+type BoxProps = ColorProps & SpaceProps & LayoutProps & BoxShadowProps & BorderProps & OrderProps & GridProps & FlexboxProps & PositionProps & TypographyProps & {
     spaceXBetween?: string | number;
     spaceYBetween?: string | number;
 };
@@ -211,6 +211,8 @@ type PaginationProps = {
     skip: number;
     itemCount: number;
     setSkip: (skip: number) => void;
+    hidePageSizeControls?: boolean;
+    setSize: (size: number) => void;
 };
 declare const Pagination: React.FC<PaginationProps>;
 
@@ -238,20 +240,20 @@ type TableHeadProps = {
 } & React.ComponentPropsWithRef<'thead'>;
 declare const TableHead: react.ForwardRefExoticComponent<Omit<TableHeadProps, "ref"> & react.RefAttributes<HTMLTableSectionElement>>;
 
-type TypographyProps = {
+type TextProps = {
     mono?: boolean;
-} & ColorProps & TypographyProps$1;
-declare const Typography: styled_components.StyledComponent<"p", styled_components.DefaultTheme, TypographyProps, never>;
+} & ColorProps & TypographyProps;
+declare const Text: styled_components.StyledComponent<"p", styled_components.DefaultTheme, TextProps, never>;
 
 type HeadingProps = {
     children?: React.ReactNode;
-} & ColorProps & TypographyProps$1 & LayoutProps;
+} & ColorProps & TypographyProps & LayoutProps;
 declare const Title: styled_components.StyledComponent<"h1", styled_components.DefaultTheme, HeadingProps, never>;
 
 type BaseButtonProps = {
     type?: 'button' | 'reset' | 'submit';
     as?: AsProp;
-} & React.ComponentPropsWithoutRef<'button'> & LayoutProps & BorderProps & PositionProps & ColorProps & SpaceProps & TypographyProps$1 & FlexboxProps & BoxShadowProps;
+} & React.ComponentPropsWithoutRef<'button'> & LayoutProps & BorderProps & PositionProps & ColorProps & SpaceProps & TypographyProps & FlexboxProps & BoxShadowProps;
 
 type ButtonProps = {
     active?: boolean;
@@ -602,6 +604,7 @@ type ColorTheme = {
     ring: string;
     offsetBackground: string;
     offsetForeground: string;
+    modalBackdrop: string;
 };
 
 declare const LightTheme: {
@@ -687,4 +690,4 @@ declare const GlobalStyles: styled_components.GlobalStyleComponent<{
     theme: ColorTheme;
 }, styled_components.DefaultTheme>;
 
-export { Accordion, AccordionDetail, type AccordionProps, AccordionSummary, Alert, type AlertProps, Backdrop, Badge, type BadgeProps, BasePicker, type BasePickerProps, BaseUploader, type BaseUploaderProps, Box, type BoxProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, CardContent, CardMedia, type CardMediaProps, type CardProps, CenteredWidget, Checkbox, type CheckboxPrpos, Chip, type ChipProps, CircleLoader, type CircleLoaderProps, CircleProgress, type CircleProgressProps, ClickOutside, type ClickOutsideProps, ClickableElement, type ClickableElementProps, Collapse, type CollapseProps, Container, DarkTheme, DatePicker, type DatePickerProps, DateRangePicker, type DateRangePickerProps, DestructiveButton, type DestructiveButtonProps, DetailsGrouping, Drawer, type DrawerProps, Fade, type FadeProps, GlobalStyles, Grow, type GrowProps, type HeadingProps, ImageComp, type ImageProps, Input, InputGroup, type InputProps, Label, type LabelProps, LightTheme, LinearLoader, type LinearLoaderProps, LinearProgress, type LinearProgressProps, LinearSlide, type LinearSlideProps, List, ListItem, Menu, MenuItem, type MenuItemProps, type MenuProps, Modal, type ModalProps, MuffledUI, NumberField, type NumberFieldProps, Open, type OpenProps, OrderedList, OutlineButton, type OutlineButtonProps, Pagination, type PaginationProps, Panel, Password, type PasswordProps, Portal, type PortalProps, PrimaryButton, type PrimaryButtonProps, type ProvidedTheme, Radio, RadioIcon, type RadioPrpos, Scrollable, SecondaryButton, type SecondaryButtonProps, Select, SelectButton, type SelectButtonProps, SelectContext, SelectFilter, type SelectFilterProps, SelectItem, type SelectItemProps, SelectList, type SelectProps, SettingsContext, type SettingsCtx, SimpleSelect, type SimpleSelectProps, Skeleton, type SkeletonProps, Slide, type SlideProps, SnackbarContext, SnackbarItem, type SnackbarItemProps, SnackbarProvider, StepIcon, type StepIconProps, StepLabel, type StepLabelProps, Stepper, StepperContext, type StepperProps, Switch, type SwitchProps, SyntaxHighlighter, type SyntaxHighlighterProps, type TTheme, TabItem, type TabItemProps, TabItems, type TabItemsProps, TabPane, TabPaneList, type TabPaneListProps, type TabPaneProps$1 as TabPaneProps, Table, TableBody, TableCell, TableHead, type TableHeadProps, type TableProps, TableRow, type TableRowProps, Tabs, TextArea, ThemeButton, type ThemeProviderProps, ThemeSwitch, ThreeColumns, type ThreeColumnsProps, Title, Tooltip, type TooltipProps, TwoColumns, type TwoColumnsProps, Typography, type TypographyProps, UnorderedList, UploadButton, type UploadButtonProps, UploadZone, type UploadZoneProps, clearInputOnSelectItem, stopPropagation, useMuffledSettings, useSelectContext, useSnackbar, useStepperContext };
+export { Accordion, AccordionDetail, type AccordionProps, AccordionSummary, Alert, type AlertProps, Backdrop, Badge, type BadgeProps, BasePicker, type BasePickerProps, BaseUploader, type BaseUploaderProps, Box, type BoxProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, CardContent, CardMedia, type CardMediaProps, type CardProps, CenteredWidget, Checkbox, type CheckboxPrpos, Chip, type ChipProps, CircleLoader, type CircleLoaderProps, CircleProgress, type CircleProgressProps, ClickOutside, type ClickOutsideProps, ClickableElement, type ClickableElementProps, Collapse, type CollapseProps, Container, DarkTheme, DatePicker, type DatePickerProps, DateRangePicker, type DateRangePickerProps, DestructiveButton, type DestructiveButtonProps, DetailsGrouping, Drawer, type DrawerProps, Fade, type FadeProps, GlobalStyles, Grow, type GrowProps, type HeadingProps, ImageComp, type ImageProps, Input, InputGroup, type InputProps, Label, type LabelProps, LightTheme, LinearLoader, type LinearLoaderProps, LinearProgress, type LinearProgressProps, LinearSlide, type LinearSlideProps, List, ListItem, Menu, MenuItem, type MenuItemProps, type MenuProps, Modal, type ModalProps, MuffledUI, NumberField, type NumberFieldProps, Open, type OpenProps, OrderedList, OutlineButton, type OutlineButtonProps, Pagination, type PaginationProps, Panel, Password, type PasswordProps, Portal, type PortalProps, PrimaryButton, type PrimaryButtonProps, type ProvidedTheme, Radio, RadioIcon, type RadioPrpos, Scrollable, SecondaryButton, type SecondaryButtonProps, Select, SelectButton, type SelectButtonProps, SelectContext, SelectFilter, type SelectFilterProps, SelectItem, type SelectItemProps, SelectList, type SelectProps, SettingsContext, type SettingsCtx, SimpleSelect, type SimpleSelectProps, Skeleton, type SkeletonProps, Slide, type SlideProps, SnackbarContext, SnackbarItem, type SnackbarItemProps, SnackbarProvider, StepIcon, type StepIconProps, StepLabel, type StepLabelProps, Stepper, StepperContext, type StepperProps, Switch, type SwitchProps, SyntaxHighlighter, type SyntaxHighlighterProps, type TTheme, TabItem, type TabItemProps, TabItems, type TabItemsProps, TabPane, TabPaneList, type TabPaneListProps, type TabPaneProps$1 as TabPaneProps, Table, TableBody, TableCell, TableHead, type TableHeadProps, type TableProps, TableRow, type TableRowProps, Tabs, Text, TextArea, type TextProps, ThemeButton, type ThemeProviderProps, ThemeSwitch, ThreeColumns, type ThreeColumnsProps, Title, Tooltip, type TooltipProps, TwoColumns, type TwoColumnsProps, UnorderedList, UploadButton, type UploadButtonProps, UploadZone, type UploadZoneProps, clearInputOnSelectItem, stopPropagation, useMuffledSettings, useSelectContext, useSnackbar, useStepperContext };

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as styled_components from 'styled-components';
 import { StyledComponent, DefaultTheme } from 'styled-components';
-import { LayoutProps, SpaceProps, ColorProps, BoxShadowProps, BorderProps, OrderProps, GridProps, FlexboxProps, PositionProps, TypographyProps as TypographyProps$1 } from 'styled-system';
+import { LayoutProps, SpaceProps, ColorProps, BoxShadowProps, BorderProps, OrderProps, GridProps, FlexboxProps, PositionProps, TypographyProps } from 'styled-system';
 import * as react from 'react';
 import { ReactElement } from 'react';
 import { Placement } from '@popperjs/core';
@@ -168,7 +168,7 @@ declare const AccordionSummary: React.FC<AccordionSummaryProps>;
 declare const AccordionDetail: styled_components.StyledComponent<"div", styled_components.DefaultTheme, {}, never>;
 declare const DetailsGrouping: styled_components.StyledComponent<"div", styled_components.DefaultTheme, {}, never>;
 
-type BoxProps = ColorProps & SpaceProps & LayoutProps & BoxShadowProps & BorderProps & OrderProps & GridProps & FlexboxProps & PositionProps & TypographyProps$1 & {
+type BoxProps = ColorProps & SpaceProps & LayoutProps & BoxShadowProps & BorderProps & OrderProps & GridProps & FlexboxProps & PositionProps & TypographyProps & {
     spaceXBetween?: string | number;
     spaceYBetween?: string | number;
 };
@@ -211,6 +211,8 @@ type PaginationProps = {
     skip: number;
     itemCount: number;
     setSkip: (skip: number) => void;
+    hidePageSizeControls?: boolean;
+    setSize: (size: number) => void;
 };
 declare const Pagination: React.FC<PaginationProps>;
 
@@ -238,20 +240,20 @@ type TableHeadProps = {
 } & React.ComponentPropsWithRef<'thead'>;
 declare const TableHead: react.ForwardRefExoticComponent<Omit<TableHeadProps, "ref"> & react.RefAttributes<HTMLTableSectionElement>>;
 
-type TypographyProps = {
+type TextProps = {
     mono?: boolean;
-} & ColorProps & TypographyProps$1;
-declare const Typography: styled_components.StyledComponent<"p", styled_components.DefaultTheme, TypographyProps, never>;
+} & ColorProps & TypographyProps;
+declare const Text: styled_components.StyledComponent<"p", styled_components.DefaultTheme, TextProps, never>;
 
 type HeadingProps = {
     children?: React.ReactNode;
-} & ColorProps & TypographyProps$1 & LayoutProps;
+} & ColorProps & TypographyProps & LayoutProps;
 declare const Title: styled_components.StyledComponent<"h1", styled_components.DefaultTheme, HeadingProps, never>;
 
 type BaseButtonProps = {
     type?: 'button' | 'reset' | 'submit';
     as?: AsProp;
-} & React.ComponentPropsWithoutRef<'button'> & LayoutProps & BorderProps & PositionProps & ColorProps & SpaceProps & TypographyProps$1 & FlexboxProps & BoxShadowProps;
+} & React.ComponentPropsWithoutRef<'button'> & LayoutProps & BorderProps & PositionProps & ColorProps & SpaceProps & TypographyProps & FlexboxProps & BoxShadowProps;
 
 type ButtonProps = {
     active?: boolean;
@@ -602,6 +604,7 @@ type ColorTheme = {
     ring: string;
     offsetBackground: string;
     offsetForeground: string;
+    modalBackdrop: string;
 };
 
 declare const LightTheme: {
@@ -687,4 +690,4 @@ declare const GlobalStyles: styled_components.GlobalStyleComponent<{
     theme: ColorTheme;
 }, styled_components.DefaultTheme>;
 
-export { Accordion, AccordionDetail, type AccordionProps, AccordionSummary, Alert, type AlertProps, Backdrop, Badge, type BadgeProps, BasePicker, type BasePickerProps, BaseUploader, type BaseUploaderProps, Box, type BoxProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, CardContent, CardMedia, type CardMediaProps, type CardProps, CenteredWidget, Checkbox, type CheckboxPrpos, Chip, type ChipProps, CircleLoader, type CircleLoaderProps, CircleProgress, type CircleProgressProps, ClickOutside, type ClickOutsideProps, ClickableElement, type ClickableElementProps, Collapse, type CollapseProps, Container, DarkTheme, DatePicker, type DatePickerProps, DateRangePicker, type DateRangePickerProps, DestructiveButton, type DestructiveButtonProps, DetailsGrouping, Drawer, type DrawerProps, Fade, type FadeProps, GlobalStyles, Grow, type GrowProps, type HeadingProps, ImageComp, type ImageProps, Input, InputGroup, type InputProps, Label, type LabelProps, LightTheme, LinearLoader, type LinearLoaderProps, LinearProgress, type LinearProgressProps, LinearSlide, type LinearSlideProps, List, ListItem, Menu, MenuItem, type MenuItemProps, type MenuProps, Modal, type ModalProps, MuffledUI, NumberField, type NumberFieldProps, Open, type OpenProps, OrderedList, OutlineButton, type OutlineButtonProps, Pagination, type PaginationProps, Panel, Password, type PasswordProps, Portal, type PortalProps, PrimaryButton, type PrimaryButtonProps, type ProvidedTheme, Radio, RadioIcon, type RadioPrpos, Scrollable, SecondaryButton, type SecondaryButtonProps, Select, SelectButton, type SelectButtonProps, SelectContext, SelectFilter, type SelectFilterProps, SelectItem, type SelectItemProps, SelectList, type SelectProps, SettingsContext, type SettingsCtx, SimpleSelect, type SimpleSelectProps, Skeleton, type SkeletonProps, Slide, type SlideProps, SnackbarContext, SnackbarItem, type SnackbarItemProps, SnackbarProvider, StepIcon, type StepIconProps, StepLabel, type StepLabelProps, Stepper, StepperContext, type StepperProps, Switch, type SwitchProps, SyntaxHighlighter, type SyntaxHighlighterProps, type TTheme, TabItem, type TabItemProps, TabItems, type TabItemsProps, TabPane, TabPaneList, type TabPaneListProps, type TabPaneProps$1 as TabPaneProps, Table, TableBody, TableCell, TableHead, type TableHeadProps, type TableProps, TableRow, type TableRowProps, Tabs, TextArea, ThemeButton, type ThemeProviderProps, ThemeSwitch, ThreeColumns, type ThreeColumnsProps, Title, Tooltip, type TooltipProps, TwoColumns, type TwoColumnsProps, Typography, type TypographyProps, UnorderedList, UploadButton, type UploadButtonProps, UploadZone, type UploadZoneProps, clearInputOnSelectItem, stopPropagation, useMuffledSettings, useSelectContext, useSnackbar, useStepperContext };
+export { Accordion, AccordionDetail, type AccordionProps, AccordionSummary, Alert, type AlertProps, Backdrop, Badge, type BadgeProps, BasePicker, type BasePickerProps, BaseUploader, type BaseUploaderProps, Box, type BoxProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, CardContent, CardMedia, type CardMediaProps, type CardProps, CenteredWidget, Checkbox, type CheckboxPrpos, Chip, type ChipProps, CircleLoader, type CircleLoaderProps, CircleProgress, type CircleProgressProps, ClickOutside, type ClickOutsideProps, ClickableElement, type ClickableElementProps, Collapse, type CollapseProps, Container, DarkTheme, DatePicker, type DatePickerProps, DateRangePicker, type DateRangePickerProps, DestructiveButton, type DestructiveButtonProps, DetailsGrouping, Drawer, type DrawerProps, Fade, type FadeProps, GlobalStyles, Grow, type GrowProps, type HeadingProps, ImageComp, type ImageProps, Input, InputGroup, type InputProps, Label, type LabelProps, LightTheme, LinearLoader, type LinearLoaderProps, LinearProgress, type LinearProgressProps, LinearSlide, type LinearSlideProps, List, ListItem, Menu, MenuItem, type MenuItemProps, type MenuProps, Modal, type ModalProps, MuffledUI, NumberField, type NumberFieldProps, Open, type OpenProps, OrderedList, OutlineButton, type OutlineButtonProps, Pagination, type PaginationProps, Panel, Password, type PasswordProps, Portal, type PortalProps, PrimaryButton, type PrimaryButtonProps, type ProvidedTheme, Radio, RadioIcon, type RadioPrpos, Scrollable, SecondaryButton, type SecondaryButtonProps, Select, SelectButton, type SelectButtonProps, SelectContext, SelectFilter, type SelectFilterProps, SelectItem, type SelectItemProps, SelectList, type SelectProps, SettingsContext, type SettingsCtx, SimpleSelect, type SimpleSelectProps, Skeleton, type SkeletonProps, Slide, type SlideProps, SnackbarContext, SnackbarItem, type SnackbarItemProps, SnackbarProvider, StepIcon, type StepIconProps, StepLabel, type StepLabelProps, Stepper, StepperContext, type StepperProps, Switch, type SwitchProps, SyntaxHighlighter, type SyntaxHighlighterProps, type TTheme, TabItem, type TabItemProps, TabItems, type TabItemsProps, TabPane, TabPaneList, type TabPaneListProps, type TabPaneProps$1 as TabPaneProps, Table, TableBody, TableCell, TableHead, type TableHeadProps, type TableProps, TableRow, type TableRowProps, Tabs, Text, TextArea, type TextProps, ThemeButton, type ThemeProviderProps, ThemeSwitch, ThreeColumns, type ThreeColumnsProps, Title, Tooltip, type TooltipProps, TwoColumns, type TwoColumnsProps, UnorderedList, UploadButton, type UploadButtonProps, UploadZone, type UploadZoneProps, clearInputOnSelectItem, stopPropagation, useMuffledSettings, useSelectContext, useSnackbar, useStepperContext };