@westpac/ui 0.7.0 → 0.8.0

package/dist/components/flexi-cell/flexi-cell.stories.js

@@ -1,759 +0,0 @@
-function _extends() {
-    _extends = Object.assign || function(target) {
-        for(var i = 1; i < arguments.length; i++){
-            var source = arguments[i];
-            for(var key in source){
-                if (Object.prototype.hasOwnProperty.call(source, key)) {
-                    target[key] = source[key];
-                }
-            }
-        }
-        return target;
-    };
-    return _extends.apply(this, arguments);
-}
-import { ArrowRightIcon, InfoIcon, TickCircleIcon } from '../icon/index.js';
-import { Badge, Button, Circle } from '../index.js';
-import { GiftPictogram } from '../pictogram/index.js';
-import { FlexiCell } from './flexi-cell.component.js';
-const meta = {
-    title: 'Components/FlexiCell',
-    component: FlexiCell,
-    tags: [
-        'autodocs'
-    ],
-    decorators: [
-        (Story)=>React.createElement(Story, null)
-    ],
-    argTypes: {
-        after: {
-            description: 'Renders an element on the right',
-            type: {
-                name: 'string'
-            }
-        },
-        badge: {
-            description: 'Renders an element on the top right corner',
-            type: {
-                name: 'string'
-            }
-        },
-        badgeZIndex: {
-            description: 'zIndex for badge',
-            type: {
-                name: 'number'
-            }
-        },
-        before: {
-            description: 'Renders an element on the left',
-            type: {
-                name: 'string'
-            }
-        },
-        body: {
-            description: 'Injects the FlexiCell.Body inside of the children',
-            type: {
-                name: 'boolean'
-            }
-        },
-        children: {
-            description: 'The middle content of FlexiCell',
-            type: {
-                name: 'string'
-            }
-        },
-        href: {
-            description: 'href in case it is an "a" tag',
-            type: {
-                name: 'string'
-            }
-        },
-        withArrow: {
-            description: 'Adds an arrow on top right',
-            type: {
-                name: 'boolean'
-            }
-        },
-        withBorder: {
-            description: 'Adds a border radius and a border',
-            type: {
-                name: 'boolean'
-            }
-        }
-    }
-};
-export default meta;
-export const Default = {
-    args: {
-        tag: 'a',
-        href: '#',
-        withBorder: true,
-        body: true,
-        after: 'after',
-        before: 'before',
-        children: React.createElement(React.Fragment, null, React.createElement(FlexiCell.Label, {
-            tag: "h3"
-        }, "Label"), React.createElement(FlexiCell.Hint, null, "Hint"))
-    }
-};
-export const CreditCard = {
-    args: {
-        tag: 'a',
-        href: '#',
-        withBorder: true,
-        body: true,
-        after: React.createElement(FlexiCell.Adornment, {
-            align: "top"
-        }, React.createElement(FlexiCell.Label, {
-            tag: "h3"
-        }, "$9,999.99"), React.createElement(FlexiCell.Hint, null, "avail $9,999.99")),
-        children: React.createElement(React.Fragment, null, React.createElement(FlexiCell.Label, {
-            tag: "h3"
-        }, "Credit card"), React.createElement(FlexiCell.Hint, null, "Card ending in 1234"))
-    }
-};
-export const Account = {
-    args: {
-        tag: 'a',
-        href: '#',
-        withBorder: true,
-        body: true,
-        after: React.createElement(FlexiCell.Adornment, {
-            align: "top"
-        }, React.createElement(FlexiCell.Label, {
-            tag: "h3"
-        }, "$9,999.99")),
-        children: React.createElement(React.Fragment, null, React.createElement(FlexiCell.Label, {
-            tag: "h3"
-        }, "Account"), React.createElement(FlexiCell.Hint, null, "032-123 12345678"))
-    }
-};
-export const Payee = {
-    args: {
-        tag: 'a',
-        href: '#',
-        withBorder: true,
-        body: true,
-        before: React.createElement(Circle, {
-            className: "bg-primary text-white",
-            "aria-label": "Bruce"
-        }, "B"),
-        after: React.createElement(FlexiCell.Adornment, {
-            align: "center"
-        }, React.createElement(FlexiCell.Hint, {
-            className: "text-muted"
-        }, "Fri 5 Aug")),
-        children: React.createElement(React.Fragment, null, React.createElement("h3", {
-            className: "typography-body-8 font-normal"
-        }, "Payee"), React.createElement("small", {
-            className: "text-muted"
-        }, "Payee details"))
-    }
-};
-export const PayeeWithInfo = {
-    args: {
-        withBorder: true,
-        body: true,
-        before: React.createElement(Circle, {
-            className: "bg-muted text-white",
-            "aria-label": "Walter White"
-        }, "WW"),
-        after: React.createElement(FlexiCell.Adornment, {
-            align: "center"
-        }, React.createElement(Button, {
-            look: "link",
-            href: "/somewhere",
-            iconBefore: InfoIcon,
-            "aria-label": "more info"
-        })),
-        children: React.createElement("a", {
-            href: "#",
-            className: "group text-[inherit] decoration-[inherit] focus:focus-outline"
-        }, React.createElement("h3", {
-            className: "typography-body-8 font-normal"
-        }, "Payee"), React.createElement("small", {
-            className: "text-muted"
-        }, "Payee details"))
-    }
-};
-export const FlagPayee = {
-    args: {
-        withBorder: true,
-        body: true,
-        before: React.createElement("div", null, "Flag"),
-        after: React.createElement(FlexiCell.Adornment, {
-            align: "center"
-        }, React.createElement(Button, {
-            look: "link",
-            href: "/somewhere",
-            iconBefore: InfoIcon,
-            "aria-label": "more info"
-        })),
-        children: React.createElement("a", {
-            href: "#",
-            className: "group text-[inherit] decoration-[inherit] focus:focus-outline"
-        }, React.createElement("h3", {
-            className: "typography-body-8 font-normal"
-        }, "Payee"), React.createElement("small", {
-            className: "text-muted"
-        }, "Payee details"))
-    }
-};
-export const ListItemWithFlag = {
-    args: {
-        tag: 'a',
-        href: '#',
-        withBorder: true,
-        body: true,
-        before: React.createElement("div", null, "Flag"),
-        children: React.createElement("h3", {
-            className: "typography-body-8 font-normal"
-        }, "List item")
-    }
-};
-export const ListItem = {
-    args: {
-        tag: 'a',
-        href: '#',
-        withBorder: true,
-        body: true,
-        children: React.createElement("h3", {
-            className: "typography-body-8 font-normal"
-        }, "List item")
-    }
-};
-export const WestpacSpecialProduct = {
-    args: {
-        tag: 'a',
-        href: '#',
-        withBorder: true,
-        body: true,
-        after: React.createElement(FlexiCell.Adornment, {
-            align: "top"
-        }, React.createElement(ArrowRightIcon, {
-            color: "link",
-            "aria-hidden": "true"
-        })),
-        children: React.createElement(React.Fragment, null, React.createElement(GiftPictogram, {
-            mode: "duo",
-            className: "h-[50px] w-[50px]",
-            "aria-hidden": "true"
-        }), React.createElement("h3", {
-            className: "typography-body-8 font-normal"
-        }, "Westpac specials and product offers"), React.createElement(FlexiCell.Hint, null, "Discounts and cashback from select merchants & product offers from Westpac"))
-    }
-};
-export const FlexiCellWithImage = {
-    args: {
-        tag: 'a',
-        href: '#',
-        withBorder: true,
-        body: true,
-        children: React.createElement(React.Fragment, null, React.createElement("img", {
-            src: "https://images.unsplash.com/photo-1657299170950-87e5b0eaf77c?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1740&q=80",
-            alt: "",
-            className: "mb-2 block w-full"
-        }), React.createElement(FlexiCell.Label, {
-            className: "mb-[0.5rem]"
-        }, "MYER"), React.createElement("h3", {
-            className: "typography-body-8 font-normal"
-        }, "Westpac specials and product offers"))
-    }
-};
-export const StickyFooterExample = {
-    args: {},
-    render: ()=>{
-        return React.createElement("div", {
-            className: "flex flex-col gap-2 lg:flex-row"
-        }, [
-            'Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatem quae possimus, nam nobis cumque ullam et harum, magni quam distinctio, corporis sunt saepe maxime quod. Sapiente voluptatibus sint dicta tenetur.',
-            'Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatem quae possimus, nam nobis cumque ullam et harum, magni quam distinctio, corporis sunt saepe.',
-            'Lorem ipsum dolor sit amet'
-        ].map((title)=>React.createElement(FlexiCell, {
-                withBorder: true,
-                key: title,
-                badge: React.createElement(Badge, {
-                    className: "block",
-                    color: "primary"
-                }, "Badge")
-            }, React.createElement(FlexiCell.Body, null, React.createElement("img", {
-                src: "https://images.unsplash.com/photo-1657299170950-87e5b0eaf77c?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1740&q=80",
-                alt: "",
-                className: "mb-2 block w-full"
-            }), React.createElement(FlexiCell.Label, {
-                className: "mb-[0.5rem]"
-            }, "MYER"), React.createElement("h3", {
-                className: "typography-body-8 font-normal"
-            }, title)), React.createElement(FlexiCell.Footer, null, React.createElement(Button, {
-                size: "small",
-                soft: true
-            }, "Share")))));
-    }
-};
-const MOCK_ACCOUNTS = [
-    {
-        title: 'Cash',
-        id: 'cash',
-        accounts: [
-            {
-                name: 'Westpac Choice',
-                amount: '$1,234.99',
-                number: '732-123 746587'
-            },
-            {
-                name: 'Offset account for loan',
-                amount: '$20,000.00',
-                number: '732-123 123456'
-            }
-        ]
-    },
-    {
-        title: 'Foreign currency',
-        id: 'foreign-currency',
-        accounts: [
-            {
-                name: 'US Dollar Currency Account',
-                amount: '$3,957.57',
-                number: '123-456 1234567'
-            },
-            {
-                name: 'British pound Currency Account',
-                amount: '$9,999,999,999.99',
-                number: '123-456 1234567'
-            }
-        ]
-    },
-    {
-        title: 'Credit cards',
-        id: 'credit-cards',
-        accounts: [
-            {
-                name: 'Altitude Black World Mastercard',
-                amount: '-$3,957.57',
-                number: 'Card ending in 1234'
-            }
-        ]
-    }
-];
-export const AccountList = {
-    args: {},
-    render: ()=>{
-        return React.createElement("div", {
-            className: "flex flex-col gap-2"
-        }, MOCK_ACCOUNTS.map(({ title , id , accounts  })=>React.createElement("div", {
-                key: id,
-                className: "flex flex-col gap-3"
-            }, React.createElement("h3", {
-                className: "m-0 font-normal"
-            }, title), React.createElement("div", {
-                className: "flex flex-col gap-2"
-            }, accounts.map(({ name , amount , number  })=>React.createElement(FlexiCell, {
-                    tag: "a",
-                    href: "#",
-                    body: true,
-                    withBorder: true,
-                    key: name,
-                    after: React.createElement(FlexiCell.Adornment, {
-                        align: "top"
-                    }, React.createElement(FlexiCell.Label, {
-                        className: "font-semibold",
-                        tag: "h4"
-                    }, amount), React.createElement(FlexiCell.Hint, null, "available"))
-                }, React.createElement(FlexiCell.Label, {
-                    className: "font-normal",
-                    tag: "h4"
-                }, name), React.createElement(FlexiCell.Hint, null, number)))))));
-    }
-};
-const MOCK_PAYEES = [
-    {
-        title: 'Recently Paid',
-        id: 'recently-paid',
-        payees: [
-            {
-                initials: 'AJ',
-                name: 'Andrew Jones',
-                paidAt: 'Fri 5 Aug',
-                number: '123-986 463846'
-            },
-            {
-                initials: 'JW',
-                name: 'Joss Wight',
-                paidAt: 'Mon 1 Aug',
-                number: '098-567 465352'
-            }
-        ]
-    },
-    {
-        title: 'A',
-        id: 'a',
-        payees: [
-            {
-                initials: 'AO',
-                name: 'Active OOSH',
-                number: '857-434 856383',
-                paidAt: undefined
-            },
-            {
-                initials: 'AC',
-                name: 'Alice Cartwright',
-                number: '950-456 345363',
-                paidAt: undefined
-            }
-        ]
-    },
-    {
-        title: 'B',
-        id: 'b',
-        payees: [
-            {
-                initials: 'BN',
-                name: 'Benjamin North',
-                number: '098-123 745362',
-                paidAt: undefined
-            }
-        ]
-    }
-];
-export const PayeeList = {
-    args: {},
-    render: ()=>{
-        return React.createElement("div", {
-            className: "flex flex-col gap-2"
-        }, MOCK_PAYEES.map(({ title , id , payees  })=>React.createElement("div", {
-                key: id,
-                className: "flex flex-col gap-3"
-            }, React.createElement("h3", {
-                className: "m-0 border-b border-border pb-1 font-normal"
-            }, title), React.createElement("div", {
-                className: "flex flex-col gap-3"
-            }, payees.map(({ name , initials , paidAt , number  })=>{
-                return React.createElement(FlexiCell, _extends({}, paidAt ? {
-                    href: '#',
-                    tag: 'a'
-                } : {
-                    tag: 'div'
-                }, {
-                    key: name,
-                    className: "group",
-                    body: true,
-                    before: React.createElement(FlexiCell.Adornment, {
-                        align: "top"
-                    }, React.createElement(FlexiCell.Circle, {
-                        className: "bg-muted text-white",
-                        "aria-hidden": "true"
-                    }, initials)),
-                    after: React.createElement(FlexiCell.Adornment, {
-                        align: "center"
-                    }, paidAt ? React.createElement(FlexiCell.Hint, {
-                        tag: "h4"
-                    }, paidAt) : React.createElement(FlexiCell.Button, {
-                        tag: "a",
-                        href: "/somewhere",
-                        iconBefore: InfoIcon,
-                        "aria-label": "more info"
-                    }))
-                }), paidAt ? React.createElement(React.Fragment, null, React.createElement(FlexiCell.Label, {
-                    className: "font-medium",
-                    tag: "h4"
-                }, name), React.createElement(FlexiCell.Hint, null, number)) : React.createElement("a", {
-                    href: "#",
-                    className: "text-[inherit] decoration-[inherit] focus:focus-outline"
-                }, React.createElement(FlexiCell.Label, {
-                    className: "font-medium",
-                    tag: "h4"
-                }, name), React.createElement(FlexiCell.Hint, null, number)));
-            })))));
-    }
-};
-const MOCK_COUNTRIES = [
-    {
-        title: 'Popular',
-        id: 'popular',
-        payees: [
-            {
-                code: 'IN',
-                name: 'India'
-            },
-            {
-                code: 'UK',
-                name: 'United Kingdom'
-            },
-            {
-                code: 'USA',
-                name: 'United States'
-            }
-        ]
-    },
-    {
-        title: 'A',
-        id: 'a',
-        payees: [
-            {
-                code: 'AI',
-                name: 'Ascension Islands'
-            },
-            {
-                code: 'AN',
-                name: 'Andorra'
-            },
-            {
-                code: 'UA',
-                name: 'United Arab Emirates'
-            },
-            {
-                code: 'AF',
-                name: 'Afghanistan'
-            }
-        ]
-    }
-];
-export const CountryList = {
-    args: {},
-    render: ()=>{
-        return React.createElement("div", {
-            className: "flex flex-col gap-2"
-        }, MOCK_COUNTRIES.map(({ title , id , payees  })=>React.createElement("div", {
-                key: id,
-                className: "flex flex-col gap-3"
-            }, React.createElement("h3", {
-                className: "m-0 border-b border-b-border pb-1 font-normal"
-            }, title), React.createElement("div", {
-                className: "flex flex-col gap-3"
-            }, payees.map(({ name  })=>{
-                return React.createElement(FlexiCell, {
-                    tag: "a",
-                    href: "#",
-                    withBorder: true,
-                    body: true,
-                    key: name,
-                    before: React.createElement(FlexiCell.Adornment, {
-                        align: "top"
-                    }, React.createElement("svg", {
-                        width: "30",
-                        height: "24",
-                        viewBox: "0 0 640 480",
-                        fill: "none",
-                        xmlns: "http://www.w3.org/2000/svg",
-                        "aria-hidden": "true"
-                    }, React.createElement("path", {
-                        d: "M0 0H640V480H0V0Z",
-                        fill: "white"
-                    }), React.createElement("path", {
-                        d: "M0 0H213.3V480H0V0Z",
-                        fill: "#002654"
-                    }), React.createElement("path", {
-                        d: "M426.7 0H640V480H426.7V0Z",
-                        fill: "#CE1126"
-                    })))
-                }, React.createElement(FlexiCell.Label, {
-                    className: "font-medium",
-                    tag: "span"
-                }, name));
-            })))));
-    }
-};
-export const ForeignCurrencyList = {
-    args: {},
-    render: ()=>{
-        return React.createElement("div", {
-            className: "flex flex-col gap-2"
-        }, MOCK_PAYEES.map(({ title , id , payees  })=>React.createElement("div", {
-                key: id,
-                className: "flex flex-col gap-3"
-            }, React.createElement("h3", {
-                className: "m-0 border-b border-b-border pb-1 font-normal"
-            }, title), React.createElement("div", {
-                className: "flex flex-col gap-3"
-            }, payees.map(({ name , paidAt , number  })=>{
-                return React.createElement(FlexiCell, _extends({}, paidAt ? {
-                    href: '#',
-                    tag: 'a'
-                } : {
-                    tag: 'div'
-                }, {
-                    body: true,
-                    className: "group",
-                    key: name,
-                    before: React.createElement(FlexiCell.Adornment, {
-                        align: "top"
-                    }, React.createElement("svg", {
-                        width: "30",
-                        height: "24",
-                        viewBox: "0 0 640 480",
-                        fill: "none",
-                        xmlns: "http://www.w3.org/2000/svg",
-                        "aria-label": "French flag"
-                    }, React.createElement("path", {
-                        d: "M0 0H640V480H0V0Z",
-                        fill: "white"
-                    }), React.createElement("path", {
-                        d: "M0 0H213.3V480H0V0Z",
-                        fill: "#002654"
-                    }), React.createElement("path", {
-                        d: "M426.7 0H640V480H426.7V0Z",
-                        fill: "#CE1126"
-                    }))),
-                    after: React.createElement(FlexiCell.Adornment, {
-                        align: "center"
-                    }, paidAt ? React.createElement(FlexiCell.Hint, {
-                        tag: "h4"
-                    }, paidAt) : React.createElement(FlexiCell.Button, {
-                        href: "/somewhere",
-                        iconBefore: InfoIcon,
-                        "aria-label": "more info"
-                    }))
-                }), paidAt ? React.createElement(React.Fragment, null, React.createElement(FlexiCell.Label, {
-                    className: "font-medium",
-                    tag: "h4"
-                }, name), React.createElement(FlexiCell.Hint, null, number)) : React.createElement("a", {
-                    href: "#",
-                    className: "text-[inherit] decoration-[inherit] focus:focus-outline"
-                }, React.createElement(FlexiCell.Label, {
-                    className: "font-medium",
-                    tag: "h4"
-                }, name), React.createElement(FlexiCell.Hint, null, number)));
-            })))));
-    }
-};
-const MOCK_PROMOS = [
-    {
-        title: 'Get 50% Off on All Products',
-        subtitle: 'Limited time offer! Save big on our entire range of products.',
-        stars: true
-    },
-    {
-        title: 'Exclusive Membership Benefits',
-        subtitle: 'Unlock premium features and discounts with our membership program.',
-        stars: false
-    },
-    {
-        title: 'New Arrival Alert!',
-        subtitle: 'Discover the latest arrivals and stay ahead of the trend.',
-        stars: false
-    },
-    {
-        title: 'Weekend Special Sale',
-        subtitle: "Don't miss out on our weekend sale with massive discounts!",
-        stars: false
-    }
-];
-export const PromotilesHorizontalList = {
-    args: {},
-    render: ()=>{
-        return React.createElement("div", {
-            className: "flex flex-col gap-2"
-        }, MOCK_PROMOS.map(({ title , subtitle , stars  })=>{
-            return React.createElement(FlexiCell, {
-                tag: "a",
-                href: "#",
-                key: title,
-                withBorder: true,
-                body: true,
-                before: React.createElement(FlexiCell.Adornment, {
-                    align: "center"
-                }, React.createElement(Circle, {
-                    className: "h-[70px] w-[70px]"
-                }, "Target")),
-                badge: React.createElement(Badge, {
-                    className: "block",
-                    color: "hero",
-                    "aria-hidden": stars !== null && stars !== void 0 ? stars : 'true'
-                }, stars ? '✭' : 'Corner flag')
-            }, React.createElement("small", null, "MYER"), React.createElement(FlexiCell.Label, {
-                className: "font-medium",
-                tag: "h4"
-            }, title), React.createElement(FlexiCell.Hint, null, subtitle), React.createElement("div", {
-                className: "mt-2 flex gap-2"
-            }, React.createElement(Badge, {
-                color: "primary"
-            }, "Badge1"), React.createElement(Badge, {
-                color: "primary"
-            }, "Badge2")));
-        }));
-    }
-};
-export const PromotilesVerticalList = {
-    args: {},
-    render: ()=>{
-        return React.createElement("div", {
-            className: "flex flex-col gap-2"
-        }, React.createElement("div", {
-            className: "flex gap-3"
-        }, MOCK_PROMOS.map(({ title , subtitle  })=>React.createElement(FlexiCell, {
-                withBorder: true,
-                key: title,
-                className: "group",
-                badge: React.createElement(Badge, {
-                    className: "block",
-                    color: "hero"
-                }, "Badge")
-            }, React.createElement(FlexiCell.Body, {
-                tag: "a",
-                href: "#",
-                className: "text-[inherit] decoration-[inherit] focus:focus-outline"
-            }, React.createElement("img", {
-                src: "https://images.unsplash.com/photo-1657299170950-87e5b0eaf77c?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1740&q=80",
-                alt: "",
-                className: "block h-[63px] w-full object-cover"
-            }), React.createElement("small", null, "MYER"), React.createElement(FlexiCell.Label, {
-                className: "font-medium",
-                tag: "h4"
-            }, title), React.createElement(FlexiCell.Hint, null, subtitle)), React.createElement(FlexiCell.Footer, null, React.createElement("div", {
-                className: "mt-2 flex gap-2"
-            }, React.createElement("a", {
-                href: "#",
-                className: "focus:focus-outline"
-            }, React.createElement(Badge, {
-                color: "primary"
-            }, "Badge1")), React.createElement("a", {
-                href: "#",
-                className: "focus:focus-outline"
-            }, React.createElement(Badge, {
-                color: "primary"
-            }, "Badge2"))))))));
-    }
-};
-const MOCK_PRODUCTS = [
-    {
-        title: 'This is talking about the bonus.',
-        subtitle: 'This is more about the bonus and all the other exciting things about this.'
-    },
-    {
-        title: 'This is a longer heading talking all about the bonus this one wraps.',
-        subtitle: 'This is more about the bonus'
-    },
-    {
-        title: 'This is talking about the bonus.',
-        subtitle: 'This is more about the bonus and all the other exciting things about this.'
-    }
-];
-export const ProductTiles = {
-    args: {},
-    render: ()=>{
-        return React.createElement("div", {
-            className: "flex flex-col gap-2"
-        }, MOCK_PRODUCTS.map(({ title , subtitle  })=>React.createElement(FlexiCell, {
-                tag: "a",
-                href: "#",
-                withBorder: true,
-                withArrow: true,
-                body: true,
-                key: title,
-                after: React.createElement(TickCircleIcon, {
-                    color: "success"
-                })
-            }, React.createElement("div", {
-                className: "flex flex-col gap-2 md:flex-row"
-            }, React.createElement(GiftPictogram, {
-                mode: "duo",
-                className: "h-[24px] w-[24px]",
-                "aria-hidden": "true"
-            }), React.createElement("div", {
-                className: "flex flex-col gap-1"
-            }, React.createElement(FlexiCell.Label, {
-                className: "font-medium",
-                tag: "h4"
-            }, title), React.createElement(FlexiCell.Hint, null, subtitle))))));
-    }
-};