@hexure/ui 1.1.1 → 1.2.0

package/dist/esm/types/components/Button/Button.d.ts

@@ -13,7 +13,7 @@ export interface ButtonProps extends AccessibleProps {
     /** If enabled, the small button format will be used. */
     small?: boolean;
     /** Define which button type to display. By default the Primary button will be used.  */
-    type?: 'primary' | 'secondary';
+    type?: 'primary' | 'secondary' | 'red';
 }
 declare const Button: FC<ButtonProps>;
 export default Button;

package/dist/esm/types/components/Copy/Copy.d.ts

@@ -10,6 +10,8 @@ export interface CopyProps extends AccessibleProps {
     padding?: string;
     /** Set the type of copy to display */
     type?: 'default' | 'bold' | 'italic' | 'underline' | 'line-through' | 'small';
+    /** Set the color of the copy based on the design system color pallette */
+    color?: 'PRIMARY' | 'GREEN' | 'RED' | 'YELLOW' | 'BLACK' | 'GRAY' | 'MEDIUM_GRAY' | 'LIGHT_GRAY';
 }
 declare const Copy: FC<CopyProps>;
 export default Copy;

package/dist/esm/types/components/Drawer/Drawer.d.ts

@@ -0,0 +1,28 @@
+import { FC, ReactNode } from 'react';
+import { AccessibleProps } from '../../utils/Accessibility';
+interface ButtonProps extends AccessibleProps {
+    disabled: boolean;
+    children: string;
+    icon?: string;
+    onClick: (e?: any) => void;
+    tabIndex?: number;
+}
+export interface DrawerProps extends AccessibleProps {
+    primaryButton: ButtonProps;
+    secondaryButton?: ButtonProps;
+    tertiaryButton?: ButtonProps;
+    /** It is used to pass child nodes, string values and number as child components. */
+    children: ReactNode;
+    /** It is used to give title. */
+    title: string;
+    /** Define an optional description that's displayed under the title */
+    description?: string;
+    /** Set a width wider than 400px */
+    width?: string | number;
+    /** Display an scrim over the main content, forcing users to interact with the drawer */
+    scrim?: 'transparent' | 'dark';
+    /**  It is used to close drawer. */
+    onClose: (e?: any) => void;
+}
+declare const Drawer: FC<DrawerProps>;
+export default Drawer;

package/dist/esm/types/components/Drawer/Drawer.stories.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { ComponentStory, ComponentMeta } from '@storybook/react';
+declare const _default: ComponentMeta<React.FC<import("./Drawer").DrawerProps>>;
+export default _default;
+export declare const _Drawer: ComponentStory<React.FC<import("./Drawer").DrawerProps>>;

package/dist/esm/types/components/Drawer/index.d.ts

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

package/dist/esm/types/components/Modal/Modal.d.ts

@@ -9,8 +9,8 @@ interface ButtonProps {
 }
 export interface ModalProps extends AccessibleProps {
     primaryButton: ButtonProps;
-    secondaryButton: ButtonProps;
-    tertiaryButton: ButtonProps;
+    secondaryButton?: ButtonProps;
+    tertiaryButton?: ButtonProps;
     maxWidth?: string | number;
     /** It is used to pass child nodes, string values and number as child components. */
     children: ReactNode;

package/dist/esm/types/components/Multiselect/MultiSelect.d.ts

@@ -8,7 +8,7 @@ export interface MultiSelectProps extends AccessibleProps {
     readOnly?: boolean;
     displayCount?: number;
     invalid?: boolean;
-    onChange: (e?: any) => void;
+    onChange: (e: any) => void;
     options?: OptionProps[];
     selected: (string | number)[];
     showSelectAll?: boolean;

package/dist/esm/types/index.d.ts

@@ -6,6 +6,7 @@ export { default as Button } from './components/Button';
 export { default as Checkbox } from './components/Checkbox';
 export { default as Checklist } from './components/Checklist';
 export { default as Copy } from './components/Copy';
+export { default as Drawer } from './components/Drawer';
 export { default as Field } from './components/Field';
 export { default as Heading } from './components/Heading';
 export { default as Input } from './components/Input';

package/dist/index.d.ts

@@ -26,7 +26,7 @@ interface AccordionProps extends AccessibleProps {
 }
 declare const Accordion: FC<AccordionProps>;
 
-interface ButtonProps$3 {
+interface ButtonProps$4 {
     children: string;
     icon?: string;
     onClick: (e?: any) => void;
@@ -37,8 +37,8 @@ interface ActionDialogProps extends AccessibleProps {
     title?: string;
     /** It is used to give description. */
     description?: string;
-    primaryButton?: ButtonProps$3;
-    secondaryButton?: ButtonProps$3;
+    primaryButton?: ButtonProps$4;
+    secondaryButton?: ButtonProps$4;
     onClose: (e?: any) => void;
 }
 declare const ActionDialog: FC<ActionDialogProps>;
@@ -52,21 +52,21 @@ interface AlertProps extends AccessibleProps {
 }
 declare const Alert: FC<AlertProps>;
 
-interface ButtonProps$2 {
+interface ButtonProps$3 {
     children: string;
     onClick: (e?: any) => void;
     type?: 'primary' | 'secondary';
     icon?: string;
 }
 interface BulkActionBarProps extends AccessibleProps {
-    actions?: ButtonProps$2[];
+    actions?: ButtonProps$3[];
     errorMsg?: string;
     onClear: (e?: any) => void;
     selectedCount?: number;
 }
 declare const BulkActionBar: FC<BulkActionBarProps>;
 
-interface ButtonProps$1 extends AccessibleProps {
+interface ButtonProps$2 extends AccessibleProps {
     /** Define the button label. */
     children?: string;
     /** If enabled, the button will be disabled */
@@ -79,9 +79,9 @@ interface ButtonProps$1 extends AccessibleProps {
     /** If enabled, the small button format will be used. */
     small?: boolean;
     /** Define which button type to display. By default the Primary button will be used.  */
-    type?: 'primary' | 'secondary';
+    type?: 'primary' | 'secondary' | 'red';
 }
-declare const Button: FC<ButtonProps$1>;
+declare const Button: FC<ButtonProps$2>;
 
 interface CheckboxProps extends AccessibleProps {
     /** It is used to give label to checkbox. */
@@ -118,9 +118,37 @@ interface CopyProps extends AccessibleProps {
     padding?: string;
     /** Set the type of copy to display */
     type?: 'default' | 'bold' | 'italic' | 'underline' | 'line-through' | 'small';
+    /** Set the color of the copy based on the design system color pallette */
+    color?: 'PRIMARY' | 'GREEN' | 'RED' | 'YELLOW' | 'BLACK' | 'GRAY' | 'MEDIUM_GRAY' | 'LIGHT_GRAY';
 }
 declare const Copy: FC<CopyProps>;
 
+interface ButtonProps$1 extends AccessibleProps {
+    disabled: boolean;
+    children: string;
+    icon?: string;
+    onClick: (e?: any) => void;
+    tabIndex?: number;
+}
+interface DrawerProps extends AccessibleProps {
+    primaryButton: ButtonProps$1;
+    secondaryButton?: ButtonProps$1;
+    tertiaryButton?: ButtonProps$1;
+    /** It is used to pass child nodes, string values and number as child components. */
+    children: ReactNode;
+    /** It is used to give title. */
+    title: string;
+    /** Define an optional description that's displayed under the title */
+    description?: string;
+    /** Set a width wider than 400px */
+    width?: string | number;
+    /** Display an scrim over the main content, forcing users to interact with the drawer */
+    scrim?: 'transparent' | 'dark';
+    /**  It is used to close drawer. */
+    onClose: (e?: any) => void;
+}
+declare const Drawer: FC<DrawerProps>;
+
 interface ActionProps {
     label: string;
     onClick: (e?: any) => void;
@@ -183,8 +211,8 @@ interface ButtonProps {
 }
 interface ModalProps extends AccessibleProps {
     primaryButton: ButtonProps;
-    secondaryButton: ButtonProps;
-    tertiaryButton: ButtonProps;
+    secondaryButton?: ButtonProps;
+    tertiaryButton?: ButtonProps;
     maxWidth?: string | number;
     /** It is used to pass child nodes, string values and number as child components. */
     children: ReactNode;
@@ -203,7 +231,7 @@ interface MultiSelectProps extends AccessibleProps {
     readOnly?: boolean;
     displayCount?: number;
     invalid?: boolean;
-    onChange: (e?: any) => void;
+    onChange: (e: any) => void;
     options?: OptionProps$2[];
     selected: (string | number)[];
     showSelectAll?: boolean;
@@ -320,4 +348,4 @@ interface ToggleProps extends AccessibleProps {
 }
 declare const Toggle: FC<ToggleProps>;
 
-export { Accordion, ActionDialog, Alert, BulkActionBar, Button, Checkbox, Checklist, Copy, Field, Heading, Input, Modal, MultiSelect, Pagination, Radio, RadioList, Select, Table, Tabs, Tag, Toggle };
+export { Accordion, ActionDialog, Alert, BulkActionBar, Button, Checkbox, Checklist, Copy, Drawer, Field, Heading, Input, Modal, MultiSelect, Pagination, Radio, RadioList, Select, Table, Tabs, Tag, Toggle };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hexure/ui",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "description": "A library of shared UI components used within Hexure products.",
   "scripts": {
     "rollup": "rollup -c rollup.config.mjs",