@westpac/ui 0.7.1 → 0.8.0

package/dist/components/input-field/input-field.state.stories.js

@@ -1,127 +0,0 @@
-import { SearchIcon } from '../icon/index.js';
-import { Button, Input, Select } from '../index.js';
-import { InputField } from './input-field.component.js';
-const meta = {
-    title: 'Components/InputField/State',
-    component: InputField,
-    tags: [
-        'autodocs'
-    ],
-    decorators: [
-        (Story)=>React.createElement(Story, null)
-    ]
-};
-export default meta;
-export const InvalidWithErrorMessages = {
-    args: {},
-    render: ()=>{
-        return React.createElement(React.Fragment, null, React.createElement(InputField, {
-            label: "Text after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            errorMessage: "If there is an error it can go here",
-            after: React.createElement(Button, null, "Check")
-        }, React.createElement(Input, {
-            invalid: true
-        })), React.createElement(InputField, {
-            label: "Text after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            errorMessage: [
-                'If there is an error it can go here',
-                'If there is another error it can go here'
-            ],
-            after: React.createElement(Button, null, "Check"),
-            before: React.createElement(Button, null, "Check")
-        }, React.createElement(Input, {
-            invalid: true
-        })), React.createElement(InputField, {
-            label: "Text after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            errorMessage: "If there is an error it can go here",
-            after: {
-                icon: SearchIcon
-            },
-            before: {
-                icon: SearchIcon
-            }
-        }, React.createElement(Input, {
-            invalid: true
-        })), React.createElement(InputField, {
-            label: "Text after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            errorMessage: "If there is an error it can go here",
-            after: "Text",
-            before: "Text"
-        }, React.createElement(Input, {
-            invalid: true
-        })), React.createElement(InputField, {
-            label: "Text after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            errorMessage: "If there is an error it can go here",
-            after: React.createElement(Select, {
-                invalid: true
-            }, React.createElement("option", null, "Select")),
-            before: React.createElement(Select, {
-                invalid: true
-            }, React.createElement("option", null, "Select"))
-        }, React.createElement(Input, {
-            invalid: true
-        })));
-    }
-};
-export const InputFieldWithDisabledState = {
-    args: {},
-    render: ()=>{
-        return React.createElement(React.Fragment, null, React.createElement(InputField, {
-            label: "Text after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            after: {
-                icon: SearchIcon
-            },
-            before: {
-                icon: SearchIcon
-            }
-        }, React.createElement(Input, {
-            disabled: true
-        })), React.createElement(InputField, {
-            label: "Text after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            before: "$AUD",
-            after: "Text"
-        }, React.createElement(Input, {
-            disabled: true
-        })));
-    }
-};
-export const InputFieldWithReadOnlyState = {
-    args: {},
-    render: ()=>{
-        return React.createElement(React.Fragment, null, React.createElement(InputField, {
-            label: "Text after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            after: {
-                icon: SearchIcon
-            },
-            before: {
-                icon: SearchIcon
-            }
-        }, React.createElement(Input, {
-            readOnly: true
-        })), React.createElement(InputField, {
-            label: "Text after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            before: "$AUD",
-            after: "Text"
-        }, React.createElement(Input, {
-            readOnly: true
-        })));
-    }
-};

package/dist/components/input-field/input-field.stories.js

@@ -1,71 +0,0 @@
-import { Button, Input } from '../index.js';
-import { InputField } from './input-field.component.js';
-const meta = {
-    title: 'Components/InputField',
-    component: InputField,
-    tags: [
-        'autodocs'
-    ],
-    decorators: [
-        (Story)=>React.createElement(Story, null)
-    ]
-};
-export default meta;
-export const Default = {
-    args: {},
-    render: ()=>{
-        return React.createElement(InputField, {
-            label: "Label",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            after: React.createElement(Button, null, "Check")
-        }, React.createElement(Input, null));
-    }
-};
-export const AnotherDefault = {
-    args: {},
-    render: ()=>{
-        return React.createElement(InputField, {
-            label: "Label",
-            hint: "I am a hint",
-            supportingText: "I am supporting text"
-        }, React.createElement(Input, null));
-    }
-};
-export const SrOnlyLabel = {
-    args: {},
-    render: ()=>{
-        return React.createElement(InputField, {
-            label: "Label",
-            hideLabel: true,
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            after: React.createElement(Button, null, "Check")
-        }, React.createElement(Input, null));
-    }
-};
-export const Combination = {
-    args: {},
-    render: ()=>{
-        return React.createElement(InputField, {
-            label: "Label",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            after: React.createElement(Button, null, "Check"),
-            before: "$AUD"
-        }, React.createElement(Input, null));
-    }
-};
-export const WithFieldset = {
-    args: {},
-    render: ()=>{
-        return React.createElement(InputField, {
-            tag: "fieldset",
-            label: "Label",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            after: React.createElement(Button, null, "Check"),
-            before: "$AUD"
-        }, React.createElement(Input, null));
-    }
-};

package/dist/components/input-field/input-field.type.stories.js

@@ -1,186 +0,0 @@
-import { SearchIcon, VisibilityIcon } from '../icon/index.js';
-import { Button, Input, Select, Textarea } from '../index.js';
-import { InputField } from './input-field.component.js';
-const meta = {
-    title: 'Components/InputField/Types',
-    component: InputField,
-    tags: [
-        'autodocs'
-    ],
-    decorators: [
-        (Story)=>React.createElement(Story, null)
-    ]
-};
-export default meta;
-export const TextBeforeStory = {
-    args: {},
-    render: ()=>{
-        return React.createElement(InputField, {
-            label: "Text before",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            before: "$AUD"
-        }, React.createElement(Input, null));
-    }
-};
-export const TextAfter = {
-    args: {},
-    render: ()=>{
-        return React.createElement(InputField, {
-            label: "Text after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            after: "Text"
-        }, React.createElement(Input, null));
-    }
-};
-export const TextAfterAndBefore = {
-    args: {},
-    render: ()=>{
-        return React.createElement(InputField, {
-            label: "Text after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            before: "$AUD",
-            after: "Text"
-        }, React.createElement(Input, null));
-    }
-};
-export const IconAddOn = {
-    args: {},
-    render: ()=>{
-        return React.createElement(React.Fragment, null, React.createElement(InputField, {
-            label: "Icon before",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            before: {
-                icon: SearchIcon
-            }
-        }, React.createElement(Input, null)), React.createElement(InputField, {
-            label: "Icon after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            after: {
-                icon: SearchIcon
-            }
-        }, React.createElement(Input, null)), React.createElement(InputField, {
-            label: "Icon after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            after: {
-                icon: SearchIcon
-            },
-            before: {
-                icon: SearchIcon
-            }
-        }, React.createElement(Input, null)));
-    }
-};
-export const IconInButtonsOn = {
-    args: {},
-    render: ()=>{
-        return React.createElement(React.Fragment, null, React.createElement(InputField, {
-            label: "Icon button before",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            before: {
-                inset: true,
-                element: React.createElement(Button, {
-                    look: "link",
-                    iconAfter: VisibilityIcon,
-                    iconColor: "muted"
-                })
-            }
-        }, React.createElement(Input, null)), React.createElement(InputField, {
-            label: "Icon button after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            after: {
-                inset: true,
-                element: React.createElement(Button, {
-                    look: "link",
-                    iconAfter: VisibilityIcon,
-                    iconColor: "muted"
-                })
-            }
-        }, React.createElement(Input, null)), React.createElement(InputField, {
-            label: "Icon button before and after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            after: {
-                inset: true,
-                element: React.createElement(Button, {
-                    look: "link",
-                    iconAfter: VisibilityIcon,
-                    iconColor: "muted"
-                })
-            },
-            before: {
-                inset: true,
-                element: React.createElement(Button, {
-                    look: "link",
-                    iconAfter: VisibilityIcon,
-                    iconColor: "muted"
-                })
-            }
-        }, React.createElement(Input, null)));
-    }
-};
-export const ButtonAddOn = {
-    args: {},
-    render: ()=>{
-        return React.createElement(React.Fragment, null, React.createElement(InputField, {
-            label: "Button before",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            before: React.createElement(Button, null, "Check")
-        }, React.createElement(Input, null)), React.createElement(InputField, {
-            label: "Button after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            after: React.createElement(Button, null, "Check")
-        }, React.createElement(Input, null)), React.createElement(InputField, {
-            label: "Button before and after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            after: React.createElement(Button, null, "Check"),
-            before: React.createElement(Button, null, "Check")
-        }, React.createElement(Input, null)), React.createElement(InputField, {
-            label: "Primary button after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            after: React.createElement(Button, {
-                look: "primary"
-            }, "Check")
-        }, React.createElement(Input, null)), React.createElement(InputField, {
-            label: "Faint button after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            after: React.createElement(Button, {
-                look: "faint"
-            }, "Check")
-        }, React.createElement(Input, null)));
-    }
-};
-export const SelectAddOn = {
-    args: {},
-    render: ()=>{
-        return React.createElement(InputField, {
-            label: "Select",
-            hint: "I am a hint",
-            supportingText: "I am supporting text",
-            before: React.createElement(Select, null, React.createElement("option", null, "Select")),
-            after: React.createElement(Select, null, React.createElement("option", null, "Select"))
-        }, React.createElement(Input, null));
-    }
-};
-export const TextArea = {
-    args: {},
-    render: ()=>{
-        return React.createElement(InputField, {
-            label: "Text after",
-            hint: "I am a hint",
-            supportingText: "I am supporting text"
-        }, React.createElement(Textarea, null));
-    }
-};

package/dist/components/link/link.stories.js

@@ -1,93 +0,0 @@
-import { ArrowRightIcon, PdfFileIcon } from '../icon/index.js';
-import { Link } from './link.component.js';
-const meta = {
-    title: 'Components/Link',
-    component: Link,
-    tags: [
-        'autodocs'
-    ],
-    decorators: [
-        (Story)=>React.createElement(Story, null)
-    ]
-};
-export default meta;
-export const Default = {
-    args: {
-        children: "Look, I'm a default link",
-        href: '#'
-    }
-};
-const SIZES = [
-    'xsmall',
-    'small',
-    'medium',
-    'large',
-    'xlarge'
-];
-export const Standalone = ()=>React.createElement("div", {
-        className: "space-y-1"
-    }, React.createElement("h1", {
-        className: "font-bold"
-    }, "Default"), React.createElement(Link, {
-        href: "#"
-    }, "Look I'm a standalone link"), React.createElement("h1", {
-        className: "font-bold"
-    }, "Icon Before override"), React.createElement(Link, {
-        href: "#",
-        iconBefore: PdfFileIcon
-    }, "Look I'm a standalone link"), React.createElement("h1", {
-        className: "font-bold"
-    }, "Icon Before override"), React.createElement(Link, {
-        href: "#",
-        iconAfter: ArrowRightIcon
-    }, "Look I'm a standalone link"));
-export const Inline = ()=>React.createElement("div", {
-        className: "space-y-1"
-    }, React.createElement("p", {
-        className: "typography-body-10"
-    }, "Lorem ipsum dolor", ' ', React.createElement(Link, {
-        href: "#",
-        type: "inline"
-    }, "look, I'm an inline link"), ' ', "sit amet consectetur, adipisicing elit. Libero facilis odit voluptate reprehenderit laborum numquam ex optio doloribus magni repudiandae vero fugiat iusto tempora debitis sunt laboriosam nobis, ut voluptatum?"), React.createElement("p", {
-        className: "typography-body-10"
-    }, "Lorem ipsum dolor", ' ', React.createElement(Link, {
-        href: "#",
-        type: "inline",
-        underline: false
-    }, "look, I'm an inline link with no underline"), ' ', "sit amet consectetur, adipisicing elit. Libero facilis odit voluptate reprehenderit laborum numquam ex optio doloribus magni repudiandae vero fugiat iusto tempora debitis sunt laboriosam nobis, ut voluptatum?"), React.createElement("p", {
-        className: "typography-body-10"
-    }, "Lorem ipsum dolor", ' ', React.createElement(Link, {
-        href: "#",
-        type: "inline",
-        iconBefore: PdfFileIcon
-    }, "look, I'm an inline link"), ' ', "sit amet consectetur, adipisicing elit. Libero facilis odit voluptate reprehenderit laborum numquam ex optio doloribus magni repudiandae vero fugiat iusto tempora debitis sunt laboriosam nobis, ut voluptatum?"), React.createElement("p", {
-        className: "typography-body-10"
-    }, "Lorem ipsum dolor", ' ', React.createElement(Link, {
-        href: "#",
-        type: "inline",
-        iconAfter: PdfFileIcon
-    }, "look, I'm an inline link"), ' ', "sit amet consectetur, adipisicing elit. Libero facilis odit voluptate reprehenderit laborum numquam ex optio doloribus magni repudiandae vero fugiat iusto tempora debitis sunt laboriosam nobis, ut voluptatum?"), React.createElement(Link, {
-        href: "#",
-        type: "inline",
-        iconBefore: PdfFileIcon
-    }, "look, I'm an inline link"));
-export const IconSizes = ()=>React.createElement("div", {
-        className: "space-y-1"
-    }, SIZES.map((size)=>React.createElement("div", {
-            key: size
-        }, React.createElement("h1", {
-            className: "font-bold"
-        }, size), React.createElement(Link, {
-            href: "#",
-            iconSize: size,
-            iconBefore: PdfFileIcon,
-            iconAfter: PdfFileIcon
-        }, "Look I'm a standalone link"), React.createElement("p", {
-            className: "typography-body-10"
-        }, "Lorem ipsum dolor", ' ', React.createElement(Link, {
-            href: "#",
-            type: "inline",
-            iconSize: size,
-            iconBefore: PdfFileIcon,
-            iconAfter: PdfFileIcon
-        }, "look, I'm an inline link"), ' ', "sit amet consectetur, adipisicing elit. Libero facilis odit voluptate reprehenderit laborum numquam ex optio doloribus magni repudiandae vero fugiat iusto tempora debitis sunt laboriosam nobis, ut voluptatum?"))));

package/dist/components/list/list.stories.js

@@ -1,86 +0,0 @@
-import { AndroidIcon } from '../icon/index.js';
-import { List } from './list.component.js';
-const meta = {
-    title: 'Components/List',
-    component: List,
-    tags: [
-        'autodocs'
-    ],
-    decorators: [
-        (Story)=>React.createElement(Story, null)
-    ]
-};
-export default meta;
-const LOOKS = [
-    'primary',
-    'hero',
-    'neutral',
-    'success',
-    'danger',
-    'link'
-];
-const TYPES = [
-    'bullet',
-    'link',
-    'tick',
-    'cross',
-    'unstyled',
-    'icon',
-    'ordered'
-];
-export const Default = {
-    args: {
-        children: [
-            React.createElement(List.Item, null, "Styled list"),
-            React.createElement(List.Item, null, "Styled list"),
-            React.createElement(List.Item, null, "Styled list")
-        ]
-    }
-};
-export const Types = ()=>TYPES.map((type)=>React.createElement("div", {
-            className: "mb-2",
-            key: type
-        }, React.createElement("h1", {
-            className: "typography-body-8"
-        }, type), React.createElement(List, {
-            type: type,
-            icon: type === 'icon' ? AndroidIcon : undefined
-        }, React.createElement(List.Item, {
-            href: type === 'link' ? '#' : undefined
-        }, "Styled ", type, " list"), React.createElement(List.Item, {
-            href: type === 'link' ? '#' : undefined
-        }, "Styled ", type, " list"), React.createElement(List.Item, {
-            href: type === 'link' ? '#' : undefined
-        }, "Styled ", type, " list"), React.createElement(List, {
-            icon: type === 'link' ? AndroidIcon : undefined
-        }, React.createElement(List.Item, null, "Styled ", type, " list"), React.createElement(List.Item, null, "Styled ", type, " list"), React.createElement(List.Item, null, "Styled ", type, " list")), React.createElement(List.Item, null, "Styled ", type, " list"))));
-export const Looks = ()=>LOOKS.map((look)=>React.createElement("div", {
-            className: "mb-2",
-            key: look
-        }, React.createElement("h1", {
-            className: "typography-body-8"
-        }, look), React.createElement(List, {
-            look: look,
-            type: "bullet"
-        }, React.createElement(List.Item, null, "Styled ", look, " list"), React.createElement(List.Item, null, "Styled ", look, " list"), React.createElement(List.Item, null, "Styled ", look, " list"), React.createElement(List, {
-            icon: look === 'link' ? AndroidIcon : undefined
-        }, React.createElement(List.Item, null, "Styled ", look, " list"), React.createElement(List.Item, null, "Styled ", look, " list"), React.createElement(List.Item, null, "Styled ", look, " list")), React.createElement(List.Item, null, "Styled ", look, " list"))));
-export const Nested = ()=>React.createElement("div", null, React.createElement(List, {
-        type: "bullet",
-        assistiveText: "test"
-    }, React.createElement(List.Item, null, "Styled list"), React.createElement(List.Item, null, "Styled list"), React.createElement(List.Item, null, "Styled list"), React.createElement(List, null, React.createElement(List.Item, null, "Styled list"), React.createElement(List.Item, null, "Styled list"), React.createElement(List.Item, null, "Styled list"), React.createElement(List, {
-        nested: 0
-    }, React.createElement(List.Item, null, "Styled list"), React.createElement(List.Item, null, "Styled list"), React.createElement(List.Item, null, "Styled list"), React.createElement(List, null, React.createElement(List.Item, null, "Styled list"), React.createElement(List.Item, null, "Styled list"), React.createElement(List.Item, null, "Styled list"))))));
-export const Spacing = ()=>React.createElement("div", null, React.createElement("h1", {
-        className: "typography-body-10 mb-2"
-    }, "Medium"), React.createElement(List, {
-        type: "bullet",
-        className: "mb-4",
-        spacing: "medium"
-    }, React.createElement(List.Item, null, "Styled bullet list"), React.createElement(List.Item, null, "Styled bullet list"), React.createElement(List.Item, null, "Styled bullet list")), React.createElement("h1", {
-        className: "typography-body-10 mb-2"
-    }, "Large"), React.createElement(List, {
-        type: "bullet",
-        className: "mb-4",
-        spacing: "large"
-    }, React.createElement(List.Item, null, "Styled bullet list"), React.createElement(List.Item, null, "Styled bullet list"), React.createElement(List.Item, null, "Styled bullet list")));