@orbe-agro/client-core 5.3.147 → 5.3.157

package/dist/@ecme/views/concepts/customers/CustomerDetails/ActivitySection.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActivitySection.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerDetails/ActivitySection.tsx"],"sourcesContent":["import { useState } from 'react'\nimport Card from '@/components/ui/Card'\nimport Button from '@/components/ui/Button'\nimport Loading from '@/components/shared/Loading'\nimport { apiGetCustomerLog } from '@/services/CustomersService'\nimport sleep from '@/utils/sleep'\nimport dayjs from 'dayjs'\nimport isEmpty from 'lodash/isEmpty'\nimport {\n    PiEyeDuotone,\n    PiCloudCheckDuotone,\n    PiCreditCardDuotone,\n    PiTicketDuotone,\n    PiPhoneOutgoingDuotone,\n} from 'react-icons/pi'\nimport useSWR from 'swr'\n\ntype Activities = {\n    id: string\n    date: number\n    events: {\n        type: string\n        dateTime: number\n        description: string\n    }[]\n}[]\n\nconst TimeLineMedia = (props: { type: string }) => {\n    const { type } = props\n\n    switch (type) {\n        case 'PRODUCT-VIEW':\n            return <PiEyeDuotone />\n        case 'PRODUCT-UPDATE':\n            return <PiCloudCheckDuotone />\n        case 'PAYMENT':\n            return <PiCreditCardDuotone />\n        case 'SUPPORT-TICKET':\n            return <PiTicketDuotone />\n        case 'TICKET-IN-PROGRESS':\n            return <PiPhoneOutgoingDuotone />\n        default:\n            return <></>\n    }\n}\n\nconst TimeLineContent = (props: {\n    type: string\n    description: string\n    name: string\n}) => {\n    const { type, description, name } = props\n\n    switch (type) {\n        case 'PRODUCT-VIEW':\n            return (\n                <div>\n                    <h6 className=\"font-bold\">View Plan</h6>\n                    <p className=\"font-semibold\">\n                        {name} {description}\n                    </p>\n                </div>\n            )\n        case 'PRODUCT-UPDATE':\n            return (\n                <div>\n                    <h6 className=\"font-bold\">Change Plan</h6>\n                    <p className=\"font-semibold\">\n                        {name} {description}\n                    </p>\n                </div>\n            )\n        case 'PAYMENT':\n            return (\n                <div>\n                    <h6 className=\"font-bold\">Payment</h6>\n                    <p className=\"font-semibold\">\n                        {name} {description}\n                    </p>\n                </div>\n            )\n        case 'SUPPORT-TICKET':\n            return (\n                <div>\n                    <h6 className=\"font-bold\">Support Ticket</h6>\n                    <p className=\"font-semibold\">\n                        {name} {description}\n                    </p>\n                </div>\n            )\n        case 'TICKET-IN-PROGRESS':\n            return (\n                <div>\n                    <h6 className=\"font-bold\">Support Ticket Update</h6>\n                    <p className=\"font-semibold\">{description}</p>\n                </div>\n            )\n        default:\n            return <></>\n    }\n}\n\nconst ActivitySection = ({\n    customerName,\n    id,\n}: {\n    customerName: string\n    id: string\n}) => {\n    const { data, isLoading } = useSWR(\n        ['/api/customers/log', { id: id as string }],\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        ([_, params]) => apiGetCustomerLog<Activities, { id: string }>(params),\n        {\n            revalidateOnFocus: false,\n            revalidateIfStale: false,\n            evalidateOnFocus: false,\n        },\n    )\n\n    const [fetchData, setfetchData] = useState(false)\n    const [showNoMoreData, setShowNoMoreData] = useState(false)\n\n    const handleLoadMore = async () => {\n        setfetchData(true)\n        await sleep(500)\n        setShowNoMoreData(true)\n        setfetchData(false)\n    }\n\n    return (\n        <Loading loading={isLoading}>\n            {data &&\n                data.map((log) => (\n                    <div key={log.id} className=\"mb-4\">\n                        <div className=\"mb-4 font-bold uppercase flex items-center gap-4\">\n                            <span className=\"w-[70px] heading-text\">\n                                {dayjs.unix(log.date).format('DD MMMM')}\n                            </span>\n                            <div className=\"border-b border-2 border-gray-200 dark:border-gray-600 border-dashed w-full\"></div>\n                        </div>\n                        <div className=\"flex flex-col gap-4\">\n                            {isEmpty(log.events) ? (\n                                <div>No Activities</div>\n                            ) : (\n                                log.events.map((event, index) => (\n                                    <div\n                                        key={event.type + index}\n                                        className=\"flex items-center\"\n                                    >\n                                        <span className=\"font-semibold w-[100px]\">\n                                            {dayjs\n                                                .unix(event.dateTime)\n                                                .format('h:mm A')}\n                                        </span>\n                                        <Card\n                                            className=\"max-w-[600px] w-full\"\n                                            bodyClass=\"py-3\"\n                                        >\n                                            <div className=\"flex items-center gap-4\">\n                                                <div className=\"text-primary text-3xl\">\n                                                    <TimeLineMedia\n                                                        type={event.type}\n                                                    />\n                                                </div>\n                                                <TimeLineContent\n                                                    name={customerName}\n                                                    type={event.type}\n                                                    description={\n                                                        event?.description\n                                                    }\n                                                />\n                                            </div>\n                                        </Card>\n                                    </div>\n                                ))\n                            )}\n                        </div>\n                    </div>\n                ))}\n            <div className=\"text-center\">\n                {showNoMoreData ? (\n                    <span className=\"font-semibold h-[40px] flex items-center justify-center\">\n                        No more activities\n                    </span>\n                ) : (\n                    <Button loading={fetchData} onClick={handleLoadMore}>\n                        Load More\n                    </Button>\n                )}\n            </div>\n        </Loading>\n    )\n}\n\nexport default ActivitySection\n"],"names":["TimeLineMedia","props","type","PiEyeDuotone","PiCloudCheckDuotone","PiCreditCardDuotone","PiTicketDuotone","PiPhoneOutgoingDuotone","jsx","Fragment","TimeLineContent","description","name","jsxs","ActivitySection","customerName","id","data","isLoading","useSWR","_","params","apiGetCustomerLog","fetchData","setfetchData","useState","showNoMoreData","setShowNoMoreData","handleLoadMore","sleep","Loading","log","dayjs","isEmpty","event","index","Card","Button"],"mappings":"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"}
+{"version":3,"file":"ActivitySection.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerDetails/ActivitySection.tsx"],"sourcesContent":["import { useState } from 'react'\nimport Card from '@/components/ui/Card'\nimport Button from '@/components/ui/Button'\nimport Loading from '@/components/shared/Loading'\nimport { apiGetCustomerLog } from '@/services/CustomersService'\nimport sleep from '@/utils/sleep'\nimport dayjs from 'dayjs'\nimport isEmpty from 'lodash/isEmpty'\nimport {\n    PiEyeDuotone,\n    PiCloudCheckDuotone,\n    PiCreditCardDuotone,\n    PiTicketDuotone,\n    PiPhoneOutgoingDuotone,\n} from 'react-icons/pi'\nimport useSWR from 'swr'\n\ntype Activities = {\n    id: string\n    date: number\n    events: {\n        type: string\n        dateTime: number\n        description: string\n    }[]\n}[]\n\nconst TimeLineMedia = (props: { type: string }) => {\n    const { type } = props\n\n    switch (type) {\n        case 'PRODUCT-VIEW':\n            return <PiEyeDuotone />\n        case 'PRODUCT-UPDATE':\n            return <PiCloudCheckDuotone />\n        case 'PAYMENT':\n            return <PiCreditCardDuotone />\n        case 'SUPPORT-TICKET':\n            return <PiTicketDuotone />\n        case 'TICKET-IN-PROGRESS':\n            return <PiPhoneOutgoingDuotone />\n        default:\n            return <></>\n    }\n}\n\nconst TimeLineContent = (props: {\n    type: string\n    description: string\n    name: string\n}) => {\n    const { type, description, name } = props\n\n    switch (type) {\n        case 'PRODUCT-VIEW':\n            return (\n                <div>\n                    <h6 className=\"font-bold\">View Plan</h6>\n                    <p className=\"font-semibold\">\n                        {name} {description}\n                    </p>\n                </div>\n            )\n        case 'PRODUCT-UPDATE':\n            return (\n                <div>\n                    <h6 className=\"font-bold\">Change Plan</h6>\n                    <p className=\"font-semibold\">\n                        {name} {description}\n                    </p>\n                </div>\n            )\n        case 'PAYMENT':\n            return (\n                <div>\n                    <h6 className=\"font-bold\">Payment</h6>\n                    <p className=\"font-semibold\">\n                        {name} {description}\n                    </p>\n                </div>\n            )\n        case 'SUPPORT-TICKET':\n            return (\n                <div>\n                    <h6 className=\"font-bold\">Support Ticket</h6>\n                    <p className=\"font-semibold\">\n                        {name} {description}\n                    </p>\n                </div>\n            )\n        case 'TICKET-IN-PROGRESS':\n            return (\n                <div>\n                    <h6 className=\"font-bold\">Support Ticket Update</h6>\n                    <p className=\"font-semibold\">{description}</p>\n                </div>\n            )\n        default:\n            return <></>\n    }\n}\n\nconst ActivitySection = ({\n    customerName,\n    id,\n}: {\n    customerName: string\n    id: string\n}) => {\n    const { data, isLoading } = useSWR(\n        ['/api/customers/log', { id: id as string }],\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        ([_, params]) => apiGetCustomerLog<Activities, { id: string }>(params),\n        {\n            revalidateOnFocus: false,\n            revalidateIfStale: false,\n            evalidateOnFocus: false,\n        },\n    )\n\n    const [fetchData, setfetchData] = useState(false)\n    const [showNoMoreData, setShowNoMoreData] = useState(false)\n\n    const handleLoadMore = async () => {\n        setfetchData(true)\n        await sleep(500)\n        setShowNoMoreData(true)\n        setfetchData(false)\n    }\n\n    return (\n        <Loading loading={isLoading}>\n            {data &&\n                data.map((log) => (\n                    <div key={log.id} className=\"mb-4\">\n                        <div className=\"mb-4 font-bold uppercase flex items-center gap-4\">\n                            <span className=\"w-[70px] heading-text\">\n                                {dayjs.unix(log.date).format('DD MMMM')}\n                            </span>\n                            <div className=\"border-b border-2 border-gray-200 dark:border-gray-600 border-dashed w-full\"></div>\n                        </div>\n                        <div className=\"flex flex-col gap-4\">\n                            {isEmpty(log.events) ? (\n                                <div>No Activities</div>\n                            ) : (\n                                log.events.map((event, index) => (\n                                    <div\n                                        key={event.type + index}\n                                        className=\"flex items-center\"\n                                    >\n                                        <span className=\"font-semibold w-[100px]\">\n                                            {dayjs\n                                                .unix(event.dateTime)\n                                                .format('h:mm A')}\n                                        </span>\n                                        <Card\n                                            className=\"max-w-[600px] w-full\"\n                                            bodyClass=\"py-3\"\n                                        >\n                                            <div className=\"flex items-center gap-4\">\n                                                <div className=\"text-primary text-3xl\">\n                                                    <TimeLineMedia\n                                                        type={event.type}\n                                                    />\n                                                </div>\n                                                <TimeLineContent\n                                                    name={customerName}\n                                                    type={event.type}\n                                                    description={\n                                                        event?.description\n                                                    }\n                                                />\n                                            </div>\n                                        </Card>\n                                    </div>\n                                ))\n                            )}\n                        </div>\n                    </div>\n                ))}\n            <div className=\"text-center\">\n                {showNoMoreData ? (\n                    <span className=\"font-semibold h-[40px] flex items-center justify-center\">\n                        No more activities\n                    </span>\n                ) : (\n                    <Button loading={fetchData} onClick={handleLoadMore}>\n                        Load More\n                    </Button>\n                )}\n            </div>\n        </Loading>\n    )\n}\n\nexport default ActivitySection\n"],"names":["TimeLineMedia","props","type","PiEyeDuotone","PiCloudCheckDuotone","PiCreditCardDuotone","PiTicketDuotone","PiPhoneOutgoingDuotone","jsx","Fragment","TimeLineContent","description","name","jsxs","ActivitySection","customerName","id","data","isLoading","useSWR","_","params","apiGetCustomerLog","fetchData","setfetchData","useState","showNoMoreData","setShowNoMoreData","handleLoadMore","sleep","Loading","log","dayjs","isEmpty","event","index","Card","Button"],"mappings":"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"}

package/dist/@ecme/views/concepts/customers/CustomerDetails/BillingSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"BillingSection.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerDetails/BillingSection.tsx"],"sourcesContent":["import { useState, useMemo } from 'react'\nimport Card from '@/components/ui/Card'\nimport Table from '@/components/ui/Table'\nimport Badge from '@/components/ui/Badge'\nimport Tag from '@/components/ui/Tag'\nimport toast from '@/components/ui/toast'\nimport Button from '@/components/ui/Button'\nimport Notification from '@/components/ui/Notification'\nimport classNames from '@/utils/classNames'\nimport isLastChild from '@/utils/isLastChild'\nimport CreditCardDialog from '@/components/view/CreditCardDialog'\nimport {\n    flexRender,\n    getCoreRowModel,\n    getSortedRowModel,\n    useReactTable,\n    createColumnHelper,\n} from '@tanstack/react-table'\nimport { NumericFormat } from 'react-number-format'\nimport { countryList } from '@/constants/countries.constant'\nimport dayjs from 'dayjs'\n\ntype OrderHistory = {\n    id: string\n    item: string\n    status: string\n    amount: number\n    date: number\n}\n\ntype PaymentMethod = {\n    cardHolderName: string\n    cardType: string\n    expMonth: string\n    expYear: string\n    last4Number: string\n    primary: boolean\n}\n\ntype BillingSectionProps = {\n    data: Partial<{\n        orderHistory: OrderHistory[]\n        personalInfo: {\n            address: string\n            postcode: string\n            city: string\n            country: string\n        }\n        paymentMethod: PaymentMethod[]\n    }>\n}\n\nconst { Tr, Td, TBody } = Table\n\nconst months = [\n    'Jan',\n    'Feb',\n    'Mar',\n    'Apr',\n    'May',\n    'Jun',\n    'Jul',\n    'Aug',\n    'Sep',\n    'Oct',\n    'Nov',\n    'Dec',\n]\n\nconst statusColor: Record<string, string> = {\n    paid: 'bg-emerald-500',\n    pending: 'bg-amber-400',\n}\n\nconst columnHelper = createColumnHelper<OrderHistory>()\n\nconst columns = [\n    columnHelper.accessor('item', {\n        header: 'Product',\n        cell: (props) => {\n            const row = props.row.original\n            return (\n                <div className=\"flex items-center gap-2\">\n                    <span className=\"font-semibold\">{row.item}</span>\n                </div>\n            )\n        },\n    }),\n    columnHelper.accessor('status', {\n        header: 'Status',\n        cell: (props) => {\n            const row = props.row.original\n            return (\n                <div className=\"flex items-center gap-2\">\n                    <Badge className={statusColor[row.status]} />\n                    <span className=\"heading-text font-bold capitalize\">\n                        {row.status}\n                    </span>\n                </div>\n            )\n        },\n    }),\n    columnHelper.accessor('date', {\n        header: 'Date',\n        cell: (props) => {\n            const row = props.row.original\n            return (\n                <div className=\"flex items-center\">\n                    {dayjs.unix(row.date).format('MM/DD/YYYY')}\n                </div>\n            )\n        },\n    }),\n    columnHelper.accessor('amount', {\n        header: 'Amount',\n        cell: (props) => {\n            const row = props.row.original\n            return (\n                <div className=\"flex items-center\">\n                    <NumericFormat\n                        displayType=\"text\"\n                        value={(Math.round(row.amount * 100) / 100).toFixed(2)}\n                        prefix={'$'}\n                        thousandSeparator={true}\n                    />\n                </div>\n            )\n        },\n    }),\n]\n\nconst initialSelectedCard = {\n    cardHolderName: '',\n    ccNumber: '',\n    cardExpiry: '',\n    code: '',\n}\n\nconst BillingSection = ({ data }: BillingSectionProps) => {\n    const [selectedCard, setSelectedCard] = useState<{\n        cardHolderName: string\n        ccNumber: string\n        cardExpiry: string\n        code: string\n    }>(initialSelectedCard)\n\n    const [dialogOpen, setDialogOpen] = useState(false)\n\n    const table = useReactTable({\n        data: data.orderHistory || [],\n        columns,\n        getCoreRowModel: getCoreRowModel(),\n        getSortedRowModel: getSortedRowModel(),\n    })\n\n    const countryName = useMemo(() => {\n        return countryList.find(\n            (country) => country.value === data.personalInfo?.country,\n        )?.label\n    }, [data.personalInfo?.country])\n\n    const handleEdit = (cardHolderName: string, cardExpiry: string) => {\n        setSelectedCard({\n            ...initialSelectedCard,\n            cardHolderName,\n            cardExpiry,\n        })\n        setDialogOpen(true)\n    }\n\n    const handleEditClose = () => {\n        setSelectedCard(initialSelectedCard)\n        setDialogOpen(false)\n    }\n\n    const handleSubmit = () => {\n        handleEditClose()\n        toast.push(\n            <Notification title={'Successfully updated!'} type=\"success\" />,\n            {\n                placement: 'top-center',\n            },\n        )\n    }\n\n    return (\n        <>\n            <h6 className=\"mb-4\">Purchase history</h6>\n            <Table>\n                <TBody>\n                    {table\n                        .getRowModel()\n                        .rows.slice(0, 10)\n                        .map((row) => {\n                            return (\n                                <Tr key={row.id}>\n                                    {row.getVisibleCells().map((cell) => {\n                                        return (\n                                            <Td key={cell.id}>\n                                                {flexRender(\n                                                    cell.column.columnDef.cell,\n                                                    cell.getContext(),\n                                                )}\n                                            </Td>\n                                        )\n                                    })}\n                                </Tr>\n                            )\n                        })}\n                </TBody>\n            </Table>\n            <h6 className=\"mt-8\">Addresses</h6>\n            <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-4 mt-4\">\n                <Card>\n                    <div className=\"font-bold heading-text\">\n                        Billing Address\n                    </div>\n                    <div className=\"mt-4 flex flex-col gap-1 font-semibold\">\n                        <span>{data.personalInfo?.address}</span>\n                        <span>{data.personalInfo?.city}</span>\n                        <span>{data.personalInfo?.postcode}</span>\n                        <span>{countryName}</span>\n                    </div>\n                </Card>\n                <Card>\n                    <div className=\"font-bold heading-text\">\n                        Delivery Address\n                    </div>\n                    <div className=\"mt-4 flex flex-col gap-1 font-semibold\">\n                        <span>{data.personalInfo?.address}</span>\n                        <span>{data.personalInfo?.city}</span>\n                        <span>{data.personalInfo?.postcode}</span>\n                        <span>{countryName}</span>\n                    </div>\n                </Card>\n            </div>\n            <h6 className=\"mt-8\">Payment Methods</h6>\n            <Card className=\"mt-4\" bodyClass=\"py-0\">\n                {data.paymentMethod?.map((card, index) => (\n                    <div\n                        key={card.last4Number}\n                        className={classNames(\n                            'flex flex-col lg:flex-row lg:items-center justify-between gap-3 p-4',\n                            !isLastChild(data.paymentMethod || [], index) &&\n                                'border-b border-gray-200 dark:border-gray-600',\n                        )}\n                    >\n                        <div className=\"flex items-center gap-3\">\n                            {card.cardType === 'VISA' && (\n                                <img src=\"/img/others/img-8.png\" alt=\"visa\" />\n                            )}\n                            {card.cardType === 'MASTER' && (\n                                <img src=\"/img/others/img-9.png\" alt=\"master\" />\n                            )}\n                            <div>\n                                <div className=\"flex items-center\">\n                                    <div className=\"text-gray-900 dark:text-gray-100 font-semibold\">\n                                        {card.cardHolderName} ••••{' '}\n                                        {card.last4Number}\n                                    </div>\n                                    {card.primary && (\n                                        <Tag className=\"bg-sky-100 text-primary dark:bg-primary/20 dark:text-primary rounded-md border-0 mx-2\">\n                                            <span className=\"capitalize\">\n                                                {' '}\n                                                Primary{' '}\n                                            </span>\n                                        </Tag>\n                                    )}\n                                </div>\n                                <span>\n                                    Expired{' '}\n                                    {months[parseInt(card.expMonth) - 1]} 20\n                                    {card.expYear}\n                                </span>\n                            </div>\n                        </div>\n                        <div className=\"flex justify-end\">\n                            <Button\n                                size=\"sm\"\n                                onClick={() =>\n                                    handleEdit(\n                                        card.cardHolderName,\n                                        `${card.expMonth}${card.expYear}`,\n                                    )\n                                }\n                            >\n                                Edit\n                            </Button>\n                        </div>\n                    </div>\n                ))}\n                <CreditCardDialog\n                    title=\"Edit credit card\"\n                    defaultValues={selectedCard}\n                    dialogOpen={dialogOpen}\n                    onDialogClose={handleEditClose}\n                    onSubmit={handleSubmit}\n                />\n            </Card>\n        </>\n    )\n}\n\nexport default BillingSection\n"],"names":["Tr","Td","TBody","Table","months","statusColor","columnHelper","createColumnHelper","columns","props","row","jsx","jsxs","Badge","dayjs","NumericFormat","initialSelectedCard","BillingSection","data","selectedCard","setSelectedCard","useState","dialogOpen","setDialogOpen","table","useReactTable","getCoreRowModel","getSortedRowModel","countryName","useMemo","countryList","country","handleEdit","cardHolderName","cardExpiry","handleEditClose","handleSubmit","toast","Notification","Fragment","cell","flexRender","Card","card","index","classNames","isLastChild","Tag","Button","CreditCardDialog"],"mappings":"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"}
+{"version":3,"file":"BillingSection.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerDetails/BillingSection.tsx"],"sourcesContent":["import { useState, useMemo } from 'react'\nimport Card from '@/components/ui/Card'\nimport Table from '@/components/ui/Table'\nimport Badge from '@/components/ui/Badge'\nimport Tag from '@/components/ui/Tag'\nimport toast from '@/components/ui/toast'\nimport Button from '@/components/ui/Button'\nimport Notification from '@/components/ui/Notification'\nimport classNames from '@/utils/classNames'\nimport isLastChild from '@/utils/isLastChild'\nimport CreditCardDialog from '@/components/view/CreditCardDialog'\nimport {\n    flexRender,\n    getCoreRowModel,\n    getSortedRowModel,\n    useReactTable,\n    createColumnHelper,\n} from '@tanstack/react-table'\nimport { NumericFormat } from 'react-number-format'\nimport { countryList } from '@/constants/countries.constant'\nimport dayjs from 'dayjs'\n\ntype OrderHistory = {\n    id: string\n    item: string\n    status: string\n    amount: number\n    date: number\n}\n\ntype PaymentMethod = {\n    cardHolderName: string\n    cardType: string\n    expMonth: string\n    expYear: string\n    last4Number: string\n    primary: boolean\n}\n\ntype BillingSectionProps = {\n    data: Partial<{\n        orderHistory: OrderHistory[]\n        personalInfo: {\n            address: string\n            postcode: string\n            city: string\n            country: string\n        }\n        paymentMethod: PaymentMethod[]\n    }>\n}\n\nconst { Tr, Td, TBody } = Table\n\nconst months = [\n    'Jan',\n    'Feb',\n    'Mar',\n    'Apr',\n    'May',\n    'Jun',\n    'Jul',\n    'Aug',\n    'Sep',\n    'Oct',\n    'Nov',\n    'Dec',\n]\n\nconst statusColor: Record<string, string> = {\n    paid: 'bg-emerald-500',\n    pending: 'bg-amber-400',\n}\n\nconst columnHelper = createColumnHelper<OrderHistory>()\n\nconst columns = [\n    columnHelper.accessor('item', {\n        header: 'Product',\n        cell: (props) => {\n            const row = props.row.original\n            return (\n                <div className=\"flex items-center gap-2\">\n                    <span className=\"font-semibold\">{row.item}</span>\n                </div>\n            )\n        },\n    }),\n    columnHelper.accessor('status', {\n        header: 'Status',\n        cell: (props) => {\n            const row = props.row.original\n            return (\n                <div className=\"flex items-center gap-2\">\n                    <Badge className={statusColor[row.status]} />\n                    <span className=\"heading-text font-bold capitalize\">\n                        {row.status}\n                    </span>\n                </div>\n            )\n        },\n    }),\n    columnHelper.accessor('date', {\n        header: 'Date',\n        cell: (props) => {\n            const row = props.row.original\n            return (\n                <div className=\"flex items-center\">\n                    {dayjs.unix(row.date).format('MM/DD/YYYY')}\n                </div>\n            )\n        },\n    }),\n    columnHelper.accessor('amount', {\n        header: 'Amount',\n        cell: (props) => {\n            const row = props.row.original\n            return (\n                <div className=\"flex items-center\">\n                    <NumericFormat\n                        displayType=\"text\"\n                        value={(Math.round(row.amount * 100) / 100).toFixed(2)}\n                        prefix={'$'}\n                        thousandSeparator={true}\n                    />\n                </div>\n            )\n        },\n    }),\n]\n\nconst initialSelectedCard = {\n    cardHolderName: '',\n    ccNumber: '',\n    cardExpiry: '',\n    code: '',\n}\n\nconst BillingSection = ({ data }: BillingSectionProps) => {\n    const [selectedCard, setSelectedCard] = useState<{\n        cardHolderName: string\n        ccNumber: string\n        cardExpiry: string\n        code: string\n    }>(initialSelectedCard)\n\n    const [dialogOpen, setDialogOpen] = useState(false)\n\n    const table = useReactTable({\n        data: data.orderHistory || [],\n        columns,\n        getCoreRowModel: getCoreRowModel(),\n        getSortedRowModel: getSortedRowModel(),\n    })\n\n    const countryName = useMemo(() => {\n        return countryList.find(\n            (country) => country.value === data.personalInfo?.country,\n        )?.label\n    }, [data.personalInfo?.country])\n\n    const handleEdit = (cardHolderName: string, cardExpiry: string) => {\n        setSelectedCard({\n            ...initialSelectedCard,\n            cardHolderName,\n            cardExpiry,\n        })\n        setDialogOpen(true)\n    }\n\n    const handleEditClose = () => {\n        setSelectedCard(initialSelectedCard)\n        setDialogOpen(false)\n    }\n\n    const handleSubmit = () => {\n        handleEditClose()\n        toast.push(\n            <Notification title={'Successfully updated!'} type=\"success\" />,\n            {\n                placement: 'top-center',\n            },\n        )\n    }\n\n    return (\n        <>\n            <h6 className=\"mb-4\">Purchase history</h6>\n            <Table>\n                <TBody>\n                    {table\n                        .getRowModel()\n                        .rows.slice(0, 10)\n                        .map((row) => {\n                            return (\n                                <Tr key={row.id}>\n                                    {row.getVisibleCells().map((cell) => {\n                                        return (\n                                            <Td key={cell.id}>\n                                                {flexRender(\n                                                    cell.column.columnDef.cell,\n                                                    cell.getContext(),\n                                                )}\n                                            </Td>\n                                        )\n                                    })}\n                                </Tr>\n                            )\n                        })}\n                </TBody>\n            </Table>\n            <h6 className=\"mt-8\">Addresses</h6>\n            <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-4 mt-4\">\n                <Card>\n                    <div className=\"font-bold heading-text\">\n                        Billing Address\n                    </div>\n                    <div className=\"mt-4 flex flex-col gap-1 font-semibold\">\n                        <span>{data.personalInfo?.address}</span>\n                        <span>{data.personalInfo?.city}</span>\n                        <span>{data.personalInfo?.postcode}</span>\n                        <span>{countryName}</span>\n                    </div>\n                </Card>\n                <Card>\n                    <div className=\"font-bold heading-text\">\n                        Delivery Address\n                    </div>\n                    <div className=\"mt-4 flex flex-col gap-1 font-semibold\">\n                        <span>{data.personalInfo?.address}</span>\n                        <span>{data.personalInfo?.city}</span>\n                        <span>{data.personalInfo?.postcode}</span>\n                        <span>{countryName}</span>\n                    </div>\n                </Card>\n            </div>\n            <h6 className=\"mt-8\">Payment Methods</h6>\n            <Card className=\"mt-4\" bodyClass=\"py-0\">\n                {data.paymentMethod?.map((card, index) => (\n                    <div\n                        key={card.last4Number}\n                        className={classNames(\n                            'flex flex-col lg:flex-row lg:items-center justify-between gap-3 p-4',\n                            !isLastChild(data.paymentMethod || [], index) &&\n                                'border-b border-gray-200 dark:border-gray-600',\n                        )}\n                    >\n                        <div className=\"flex items-center gap-3\">\n                            {card.cardType === 'VISA' && (\n                                <img src=\"/img/others/img-8.png\" alt=\"visa\" />\n                            )}\n                            {card.cardType === 'MASTER' && (\n                                <img src=\"/img/others/img-9.png\" alt=\"master\" />\n                            )}\n                            <div>\n                                <div className=\"flex items-center\">\n                                    <div className=\"text-gray-900 dark:text-gray-100 font-semibold\">\n                                        {card.cardHolderName} ••••{' '}\n                                        {card.last4Number}\n                                    </div>\n                                    {card.primary && (\n                                        <Tag className=\"bg-sky-100 text-primary dark:bg-primary/20 dark:text-primary rounded-md border-0 mx-2\">\n                                            <span className=\"capitalize\">\n                                                {' '}\n                                                Primary{' '}\n                                            </span>\n                                        </Tag>\n                                    )}\n                                </div>\n                                <span>\n                                    Expired{' '}\n                                    {months[parseInt(card.expMonth) - 1]} 20\n                                    {card.expYear}\n                                </span>\n                            </div>\n                        </div>\n                        <div className=\"flex justify-end\">\n                            <Button\n                                size=\"sm\"\n                                onClick={() =>\n                                    handleEdit(\n                                        card.cardHolderName,\n                                        `${card.expMonth}${card.expYear}`,\n                                    )\n                                }\n                            >\n                                Edit\n                            </Button>\n                        </div>\n                    </div>\n                ))}\n                <CreditCardDialog\n                    title=\"Edit credit card\"\n                    defaultValues={selectedCard}\n                    dialogOpen={dialogOpen}\n                    onDialogClose={handleEditClose}\n                    onSubmit={handleSubmit}\n                />\n            </Card>\n        </>\n    )\n}\n\nexport default BillingSection\n"],"names":["Tr","Td","TBody","Table","months","statusColor","columnHelper","createColumnHelper","columns","props","row","jsx","jsxs","Badge","dayjs","NumericFormat","initialSelectedCard","BillingSection","data","selectedCard","setSelectedCard","useState","dialogOpen","setDialogOpen","table","useReactTable","getCoreRowModel","getSortedRowModel","countryName","useMemo","countryList","country","handleEdit","cardHolderName","cardExpiry","handleEditClose","handleSubmit","toast","Notification","Fragment","cell","flexRender","Card","card","index","classNames","isLastChild","Tag","Button","CreditCardDialog"],"mappings":"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"}

package/dist/@ecme/views/concepts/customers/CustomerDetails/CustomerDetails.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomerDetails.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerDetails/CustomerDetails.tsx"],"sourcesContent":["import Card from '@/components/ui/Card'\nimport Tabs from '@/components/ui/Tabs'\nimport Loading from '@/components/shared/Loading'\nimport ProfileSection from './ProfileSection'\nimport BillingSection from './BillingSection'\nimport ActivitySection from './ActivitySection'\nimport { apiGetCustomer } from '@/services/CustomersService'\nimport useSWR from 'swr'\nimport { useParams } from 'react-router-dom'\nimport isEmpty from 'lodash/isEmpty'\nimport type { Customer } from '../CustomerList/types'\n\nconst { TabNav, TabList, TabContent } = Tabs\n\nconst CustomerDetails = () => {\n    const { id } = useParams()\n\n    const { data, isLoading } = useSWR(\n        ['/api/customers', { id: id as string }],\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        ([_, params]) => apiGetCustomer<Customer, { id: string }>(params),\n        {\n            revalidateOnFocus: false,\n            revalidateIfStale: false,\n            evalidateOnFocus: false,\n        },\n    )\n\n    return (\n        <Loading loading={isLoading}>\n            {!isEmpty(data) && (\n                <div className=\"flex flex-col xl:flex-row gap-4\">\n                    <div className=\"min-w-[330px] 2xl:min-w-[400px]\">\n                        <ProfileSection data={data} />\n                    </div>\n                    <Card className=\"w-full\">\n                        <Tabs defaultValue=\"billing\">\n                            <TabList>\n                                <TabNav value=\"billing\">Billing</TabNav>\n                                <TabNav value=\"activity\">Activity</TabNav>\n                            </TabList>\n                            <div className=\"p-4\">\n                                <TabContent value=\"billing\">\n                                    <BillingSection data={data} />\n                                </TabContent>\n                                <TabContent value=\"activity\">\n                                    <ActivitySection\n                                        customerName={data.name}\n                                        id={id as string}\n                                    />\n                                </TabContent>\n                            </div>\n                        </Tabs>\n                    </Card>\n                </div>\n            )}\n        </Loading>\n    )\n}\n\nexport default CustomerDetails\n"],"names":["TabNav","TabList","TabContent","Tabs","CustomerDetails","id","useParams","data","isLoading","useSWR","_","params","apiGetCustomer","jsx","Loading","isEmpty","jsxs","ProfileSection","Card","BillingSection","ActivitySection"],"mappings":";;;;;;;;;;;;AAYA,MAAM,EAAE,QAAAA,GAAQ,SAAAC,GAAS,YAAAC,EAAA,IAAeC,GAElCC,IAAkB,MAAM;AAC1B,QAAM,EAAE,IAAAC,EAAA,IAAOC,EAAA,GAET,EAAE,MAAAC,GAAM,WAAAC,EAAA,IAAcC;AAAA,IACxB,CAAC,kBAAkB,EAAE,IAAAJ,GAAkB;AAAA;AAAA,IAEvC,CAAC,CAACK,GAAGC,CAAM,MAAMC,EAAyCD,CAAM;AAAA,IAChE;AAAA,MACI,mBAAmB;AAAA,MACnB,mBAAmB;AAAA,MACnB,kBAAkB;AAAA,IAAA;AAAA,EACtB;AAGJ,SACI,gBAAAE,EAACC,GAAA,EAAQ,SAASN,GACb,UAAA,CAACO,EAAQR,CAAI,KACV,gBAAAS,EAAC,OAAA,EAAI,WAAU,mCACX,UAAA;AAAA,IAAA,gBAAAH,EAAC,SAAI,WAAU,mCACX,UAAA,gBAAAA,EAACI,GAAA,EAAe,MAAAV,GAAY,GAChC;AAAA,sBACCW,GAAA,EAAK,WAAU,UACZ,UAAA,gBAAAF,EAACb,GAAA,EAAK,cAAa,WACf,UAAA;AAAA,MAAA,gBAAAa,EAACf,GAAA,EACG,UAAA;AAAA,QAAA,gBAAAY,EAACb,GAAA,EAAO,OAAM,WAAU,UAAA,WAAO;AAAA,QAC/B,gBAAAa,EAACb,GAAA,EAAO,OAAM,YAAW,UAAA,WAAA,CAAQ;AAAA,MAAA,GACrC;AAAA,MACA,gBAAAgB,EAAC,OAAA,EAAI,WAAU,OACX,UAAA;AAAA,QAAA,gBAAAH,EAACX,KAAW,OAAM,WACd,UAAA,gBAAAW,EAACM,GAAA,EAAe,MAAAZ,GAAY,GAChC;AAAA,QACA,gBAAAM,EAACX,GAAA,EAAW,OAAM,YACd,UAAA,gBAAAW;AAAA,UAACO;AAAA,UAAA;AAAA,YACG,cAAcb,EAAK;AAAA,YACnB,IAAAF;AAAA,UAAA;AAAA,QAAA,EACJ,CACJ;AAAA,MAAA,EAAA,CACJ;AAAA,IAAA,EAAA,CACJ,EAAA,CACJ;AAAA,EAAA,EAAA,CACJ,EAAA,CAER;AAER;"}
+{"version":3,"file":"CustomerDetails.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerDetails/CustomerDetails.tsx"],"sourcesContent":["import Card from '@/components/ui/Card'\nimport Tabs from '@/components/ui/Tabs'\nimport Loading from '@/components/shared/Loading'\nimport ProfileSection from './ProfileSection'\nimport BillingSection from './BillingSection'\nimport ActivitySection from './ActivitySection'\nimport { apiGetCustomer } from '@/services/CustomersService'\nimport useSWR from 'swr'\nimport { useParams } from 'react-router-dom'\nimport isEmpty from 'lodash/isEmpty'\nimport type { Customer } from '../CustomerList/types'\n\nconst { TabNav, TabList, TabContent } = Tabs\n\nconst CustomerDetails = () => {\n    const { id } = useParams()\n\n    const { data, isLoading } = useSWR(\n        ['/api/customers', { id: id as string }],\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        ([_, params]) => apiGetCustomer<Customer, { id: string }>(params),\n        {\n            revalidateOnFocus: false,\n            revalidateIfStale: false,\n            evalidateOnFocus: false,\n        },\n    )\n\n    return (\n        <Loading loading={isLoading}>\n            {!isEmpty(data) && (\n                <div className=\"flex flex-col xl:flex-row gap-4\">\n                    <div className=\"min-w-[330px] 2xl:min-w-[400px]\">\n                        <ProfileSection data={data} />\n                    </div>\n                    <Card className=\"w-full\">\n                        <Tabs defaultValue=\"billing\">\n                            <TabList>\n                                <TabNav value=\"billing\">Billing</TabNav>\n                                <TabNav value=\"activity\">Activity</TabNav>\n                            </TabList>\n                            <div className=\"p-4\">\n                                <TabContent value=\"billing\">\n                                    <BillingSection data={data} />\n                                </TabContent>\n                                <TabContent value=\"activity\">\n                                    <ActivitySection\n                                        customerName={data.name}\n                                        id={id as string}\n                                    />\n                                </TabContent>\n                            </div>\n                        </Tabs>\n                    </Card>\n                </div>\n            )}\n        </Loading>\n    )\n}\n\nexport default CustomerDetails\n"],"names":["TabNav","TabList","TabContent","Tabs","CustomerDetails","id","useParams","data","isLoading","useSWR","_","params","apiGetCustomer","jsx","Loading","isEmpty","jsxs","ProfileSection","Card","BillingSection","ActivitySection"],"mappings":";;;;;;;;;;;;AAYA,MAAM,EAAE,QAAAA,GAAQ,SAAAC,GAAS,YAAAC,EAAA,IAAeC,GAElCC,IAAkB,MAAM;AACpB,QAAA,EAAE,IAAAC,EAAG,IAAIC,EAAU,GAEnB,EAAE,MAAAC,GAAM,WAAAC,EAAA,IAAcC;AAAA,IACxB,CAAC,kBAAkB,EAAE,IAAAJ,GAAkB;AAAA;AAAA,IAEvC,CAAC,CAACK,GAAGC,CAAM,MAAMC,EAAyCD,CAAM;AAAA,IAChE;AAAA,MACI,mBAAmB;AAAA,MACnB,mBAAmB;AAAA,MACnB,kBAAkB;AAAA,IAAA;AAAA,EAE1B;AAGI,SAAA,gBAAAE,EAACC,GAAQ,EAAA,SAASN,GACb,UAAA,CAACO,EAAQR,CAAI,KACV,gBAAAS,EAAC,OAAI,EAAA,WAAU,mCACX,UAAA;AAAA,IAAA,gBAAAH,EAAC,SAAI,WAAU,mCACX,UAAC,gBAAAA,EAAAI,GAAA,EAAe,MAAAV,EAAY,CAAA,GAChC;AAAA,sBACCW,GAAK,EAAA,WAAU,UACZ,UAAC,gBAAAF,EAAAb,GAAA,EAAK,cAAa,WACf,UAAA;AAAA,MAAA,gBAAAa,EAACf,GACG,EAAA,UAAA;AAAA,QAAC,gBAAAY,EAAAb,GAAA,EAAO,OAAM,WAAU,UAAO,WAAA;AAAA,QAC9B,gBAAAa,EAAAb,GAAA,EAAO,OAAM,YAAW,UAAQ,WAAA,CAAA;AAAA,MAAA,GACrC;AAAA,MACA,gBAAAgB,EAAC,OAAI,EAAA,WAAU,OACX,UAAA;AAAA,QAAA,gBAAAH,EAACX,KAAW,OAAM,WACd,UAAC,gBAAAW,EAAAM,GAAA,EAAe,MAAAZ,EAAY,CAAA,GAChC;AAAA,QACA,gBAAAM,EAACX,GAAW,EAAA,OAAM,YACd,UAAA,gBAAAW;AAAA,UAACO;AAAA,UAAA;AAAA,YACG,cAAcb,EAAK;AAAA,YACnB,IAAAF;AAAA,UAAA;AAAA,QAAA,EAER,CAAA;AAAA,MAAA,EACJ,CAAA;AAAA,IAAA,EAAA,CACJ,EACJ,CAAA;AAAA,EAAA,EAAA,CACJ,EAER,CAAA;AAER;"}

package/dist/@ecme/views/concepts/customers/CustomerDetails/ProfileSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProfileSection.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerDetails/ProfileSection.tsx"],"sourcesContent":["import { useState } from 'react'\nimport Card from '@/components/ui/Card'\nimport Button from '@/components/ui/Button'\nimport Avatar from '@/components/ui/Avatar/Avatar'\nimport Notification from '@/components/ui/Notification'\nimport Tooltip from '@/components/ui/Tooltip'\nimport toast from '@/components/ui/toast'\nimport ConfirmDialog from '@/components/shared/ConfirmDialog'\nimport dayjs from 'dayjs'\nimport { HiPencil, HiOutlineTrash } from 'react-icons/hi'\nimport {\n    FaXTwitter,\n    FaFacebookF,\n    FaLinkedinIn,\n    FaPinterestP,\n} from 'react-icons/fa6'\nimport { useNavigate } from 'react-router-dom'\n\ntype CustomerInfoFieldProps = {\n    title?: string\n    value?: string\n}\n\ntype ProfileSectionProps = {\n    data: Partial<{\n        id: string\n        img: string\n        name: string\n        email: string\n        lastOnline: number\n        personalInfo: {\n            location: string\n            title: string\n            birthday: string\n            phoneNumber: string\n            facebook: string\n            twitter: string\n            pinterest: string\n            linkedIn: string\n        }\n    }>\n}\n\nconst CustomerInfoField = ({ title, value }: CustomerInfoFieldProps) => {\n    return (\n        <div>\n            <span className=\"font-semibold\">{title}</span>\n            <p className=\"heading-text font-bold\">{value}</p>\n        </div>\n    )\n}\n\nconst ProfileSection = ({ data = {} }: ProfileSectionProps) => {\n    const navigate = useNavigate()\n\n    const [dialogOpen, setDialogOpen] = useState(false)\n\n    const handleSocialNavigate = (link: string = '') => {\n        window.open(`https://${link}`, '_blank', 'rel=noopener noreferrer')\n    }\n\n    const handleDialogClose = () => {\n        setDialogOpen(false)\n    }\n\n    const handleDialogOpen = () => {\n        setDialogOpen(true)\n    }\n\n    const handleDelete = () => {\n        setDialogOpen(false)\n        navigate('/concepts/customers/customer-list')\n        toast.push(\n            <Notification title={'Successfully Deleted'} type=\"success\">\n                Customer successfuly deleted\n            </Notification>,\n        )\n    }\n\n    const handleSendMessage = () => {\n        navigate('/concepts/chat')\n    }\n\n    const handleEdit = () => {\n        navigate(`/concepts/customers/customer-edit/${data.id}`)\n    }\n\n    return (\n        <Card className=\"w-full\">\n            <div className=\"flex justify-end\">\n                <Tooltip title=\"Edit customer\">\n                    <button\n                        className=\"close-button button-press-feedback\"\n                        type=\"button\"\n                        onClick={handleEdit}\n                    >\n                        <HiPencil />\n                    </button>\n                </Tooltip>\n            </div>\n            <div className=\"flex flex-col xl:justify-between h-full 2xl:min-w-[360px] mx-auto\">\n                <div className=\"flex xl:flex-col items-center gap-4 mt-6\">\n                    <Avatar size={90} shape=\"circle\" src={data.img} />\n                    <h4 className=\"font-bold\">{data.name}</h4>\n                </div>\n                <div className=\"grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-1 gap-y-7 gap-x-4 mt-10\">\n                    <CustomerInfoField title=\"Email\" value={data.email} />\n                    <CustomerInfoField\n                        title=\"Phone\"\n                        value={data.personalInfo?.phoneNumber}\n                    />\n                    <CustomerInfoField\n                        title=\"Date of birth\"\n                        value={data.personalInfo?.birthday}\n                    />\n                    <CustomerInfoField\n                        title=\"Last Online\"\n                        value={dayjs\n                            .unix(data.lastOnline as number)\n                            .format('DD MMM YYYY hh:mm A')}\n                    />\n                    <div className=\"mb-7\">\n                        <span>Social</span>\n                        <div className=\"flex mt-4 gap-2\">\n                            <Button\n                                size=\"sm\"\n                                icon={\n                                    <FaFacebookF className=\"text-[#2259f2]\" />\n                                }\n                                onClick={() =>\n                                    handleSocialNavigate(\n                                        data.personalInfo?.facebook,\n                                    )\n                                }\n                            />\n                            <Button\n                                size=\"sm\"\n                                icon={\n                                    <FaXTwitter className=\"text-black dark:text-white\" />\n                                }\n                                onClick={() =>\n                                    handleSocialNavigate(\n                                        data.personalInfo?.twitter,\n                                    )\n                                }\n                            />\n                            <Button\n                                size=\"sm\"\n                                icon={\n                                    <FaLinkedinIn className=\"text-[#155fb8]\" />\n                                }\n                                onClick={() =>\n                                    handleSocialNavigate(\n                                        data.personalInfo?.linkedIn,\n                                    )\n                                }\n                            />\n                            <Button\n                                size=\"sm\"\n                                icon={\n                                    <FaPinterestP className=\"text-[#df0018]\" />\n                                }\n                                onClick={() =>\n                                    handleSocialNavigate(\n                                        data.personalInfo?.pinterest,\n                                    )\n                                }\n                            />\n                        </div>\n                    </div>\n                </div>\n                <div className=\"flex flex-col gap-4\">\n                    <Button block variant=\"solid\" onClick={handleSendMessage}>\n                        Send Messsage\n                    </Button>\n                    <Button\n                        block\n                        customColorClass={() =>\n                            'text-error hover:border-error hover:ring-1 ring-error hover:text-error'\n                        }\n                        icon={<HiOutlineTrash />}\n                        onClick={handleDialogOpen}\n                    >\n                        Delete\n                    </Button>\n                </div>\n                <ConfirmDialog\n                    isOpen={dialogOpen}\n                    type=\"danger\"\n                    title=\"Delete customer\"\n                    onClose={handleDialogClose}\n                    onRequestClose={handleDialogClose}\n                    onCancel={handleDialogClose}\n                    onConfirm={handleDelete}\n                >\n                    <p>\n                        Are you sure you want to delete this customer? All\n                        record related to this customer will be deleted as well.\n                        This action cannot be undone.\n                    </p>\n                </ConfirmDialog>\n            </div>\n        </Card>\n    )\n}\n\nexport default ProfileSection\n"],"names":["CustomerInfoField","title","value","jsx","ProfileSection","data","navigate","useNavigate","dialogOpen","setDialogOpen","useState","handleSocialNavigate","link","handleDialogClose","handleDialogOpen","handleDelete","toast","Notification","handleSendMessage","jsxs","Card","Tooltip","HiPencil","Avatar","dayjs","Button","FaFacebookF","FaXTwitter","FaLinkedinIn","FaPinterestP","HiOutlineTrash","ConfirmDialog"],"mappings":"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"}
+{"version":3,"file":"ProfileSection.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerDetails/ProfileSection.tsx"],"sourcesContent":["import { useState } from 'react'\nimport Card from '@/components/ui/Card'\nimport Button from '@/components/ui/Button'\nimport Avatar from '@/components/ui/Avatar/Avatar'\nimport Notification from '@/components/ui/Notification'\nimport Tooltip from '@/components/ui/Tooltip'\nimport toast from '@/components/ui/toast'\nimport ConfirmDialog from '@/components/shared/ConfirmDialog'\nimport dayjs from 'dayjs'\nimport { HiPencil, HiOutlineTrash } from 'react-icons/hi'\nimport {\n    FaXTwitter,\n    FaFacebookF,\n    FaLinkedinIn,\n    FaPinterestP,\n} from 'react-icons/fa6'\nimport { useNavigate } from 'react-router-dom'\n\ntype CustomerInfoFieldProps = {\n    title?: string\n    value?: string\n}\n\ntype ProfileSectionProps = {\n    data: Partial<{\n        id: string\n        img: string\n        name: string\n        email: string\n        lastOnline: number\n        personalInfo: {\n            location: string\n            title: string\n            birthday: string\n            phoneNumber: string\n            facebook: string\n            twitter: string\n            pinterest: string\n            linkedIn: string\n        }\n    }>\n}\n\nconst CustomerInfoField = ({ title, value }: CustomerInfoFieldProps) => {\n    return (\n        <div>\n            <span className=\"font-semibold\">{title}</span>\n            <p className=\"heading-text font-bold\">{value}</p>\n        </div>\n    )\n}\n\nconst ProfileSection = ({ data = {} }: ProfileSectionProps) => {\n    const navigate = useNavigate()\n\n    const [dialogOpen, setDialogOpen] = useState(false)\n\n    const handleSocialNavigate = (link: string = '') => {\n        window.open(`https://${link}`, '_blank', 'rel=noopener noreferrer')\n    }\n\n    const handleDialogClose = () => {\n        setDialogOpen(false)\n    }\n\n    const handleDialogOpen = () => {\n        setDialogOpen(true)\n    }\n\n    const handleDelete = () => {\n        setDialogOpen(false)\n        navigate('/concepts/customers/customer-list')\n        toast.push(\n            <Notification title={'Successfully Deleted'} type=\"success\">\n                Customer successfuly deleted\n            </Notification>,\n        )\n    }\n\n    const handleSendMessage = () => {\n        navigate('/concepts/chat')\n    }\n\n    const handleEdit = () => {\n        navigate(`/concepts/customers/customer-edit/${data.id}`)\n    }\n\n    return (\n        <Card className=\"w-full\">\n            <div className=\"flex justify-end\">\n                <Tooltip title=\"Edit customer\">\n                    <button\n                        className=\"close-button button-press-feedback\"\n                        type=\"button\"\n                        onClick={handleEdit}\n                    >\n                        <HiPencil />\n                    </button>\n                </Tooltip>\n            </div>\n            <div className=\"flex flex-col xl:justify-between h-full 2xl:min-w-[360px] mx-auto\">\n                <div className=\"flex xl:flex-col items-center gap-4 mt-6\">\n                    <Avatar size={90} shape=\"circle\" src={data.img} />\n                    <h4 className=\"font-bold\">{data.name}</h4>\n                </div>\n                <div className=\"grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-1 gap-y-7 gap-x-4 mt-10\">\n                    <CustomerInfoField title=\"Email\" value={data.email} />\n                    <CustomerInfoField\n                        title=\"Phone\"\n                        value={data.personalInfo?.phoneNumber}\n                    />\n                    <CustomerInfoField\n                        title=\"Date of birth\"\n                        value={data.personalInfo?.birthday}\n                    />\n                    <CustomerInfoField\n                        title=\"Last Online\"\n                        value={dayjs\n                            .unix(data.lastOnline as number)\n                            .format('DD MMM YYYY hh:mm A')}\n                    />\n                    <div className=\"mb-7\">\n                        <span>Social</span>\n                        <div className=\"flex mt-4 gap-2\">\n                            <Button\n                                size=\"sm\"\n                                icon={\n                                    <FaFacebookF className=\"text-[#2259f2]\" />\n                                }\n                                onClick={() =>\n                                    handleSocialNavigate(\n                                        data.personalInfo?.facebook,\n                                    )\n                                }\n                            />\n                            <Button\n                                size=\"sm\"\n                                icon={\n                                    <FaXTwitter className=\"text-black dark:text-white\" />\n                                }\n                                onClick={() =>\n                                    handleSocialNavigate(\n                                        data.personalInfo?.twitter,\n                                    )\n                                }\n                            />\n                            <Button\n                                size=\"sm\"\n                                icon={\n                                    <FaLinkedinIn className=\"text-[#155fb8]\" />\n                                }\n                                onClick={() =>\n                                    handleSocialNavigate(\n                                        data.personalInfo?.linkedIn,\n                                    )\n                                }\n                            />\n                            <Button\n                                size=\"sm\"\n                                icon={\n                                    <FaPinterestP className=\"text-[#df0018]\" />\n                                }\n                                onClick={() =>\n                                    handleSocialNavigate(\n                                        data.personalInfo?.pinterest,\n                                    )\n                                }\n                            />\n                        </div>\n                    </div>\n                </div>\n                <div className=\"flex flex-col gap-4\">\n                    <Button block variant=\"solid\" onClick={handleSendMessage}>\n                        Send Messsage\n                    </Button>\n                    <Button\n                        block\n                        customColorClass={() =>\n                            'text-error hover:border-error hover:ring-1 ring-error hover:text-error'\n                        }\n                        icon={<HiOutlineTrash />}\n                        onClick={handleDialogOpen}\n                    >\n                        Delete\n                    </Button>\n                </div>\n                <ConfirmDialog\n                    isOpen={dialogOpen}\n                    type=\"danger\"\n                    title=\"Delete customer\"\n                    onClose={handleDialogClose}\n                    onRequestClose={handleDialogClose}\n                    onCancel={handleDialogClose}\n                    onConfirm={handleDelete}\n                >\n                    <p>\n                        Are you sure you want to delete this customer? All\n                        record related to this customer will be deleted as well.\n                        This action cannot be undone.\n                    </p>\n                </ConfirmDialog>\n            </div>\n        </Card>\n    )\n}\n\nexport default ProfileSection\n"],"names":["CustomerInfoField","title","value","jsx","ProfileSection","data","navigate","useNavigate","dialogOpen","setDialogOpen","useState","handleSocialNavigate","link","handleDialogClose","handleDialogOpen","handleDelete","toast","Notification","handleSendMessage","jsxs","Card","Tooltip","HiPencil","Avatar","dayjs","Button","FaFacebookF","FaXTwitter","FaLinkedinIn","FaPinterestP","HiOutlineTrash","ConfirmDialog"],"mappings":"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"}

package/dist/@ecme/views/concepts/customers/CustomerEdit/CustomerEdit.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomerEdit.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerEdit/CustomerEdit.tsx"],"sourcesContent":["import { useState } from 'react'\nimport Container from '@/components/shared/Container'\nimport Button from '@/components/ui/Button'\nimport Notification from '@/components/ui/Notification'\nimport toast from '@/components/ui/toast'\nimport ConfirmDialog from '@/components/shared/ConfirmDialog'\nimport { apiGetCustomer } from '@/services/CustomersService'\nimport CustomerForm from '../CustomerForm'\nimport sleep from '@/utils/sleep'\nimport NoUserFound from '@/assets/svg/NoUserFound'\nimport { TbTrash, TbArrowNarrowLeft } from 'react-icons/tb'\nimport { useParams, useNavigate } from 'react-router-dom'\nimport useSWR from 'swr'\nimport type { CustomerFormSchema } from '../CustomerForm'\nimport type { Customer } from '../CustomerList/types'\n\nconst CustomerEdit = () => {\n    const { id } = useParams()\n\n    const navigate = useNavigate()\n\n    const { data, isLoading } = useSWR(\n        [`/api/customers${id}`, { id: id as string }],\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        ([_, params]) => apiGetCustomer<Customer, { id: string }>(params),\n        {\n            revalidateOnFocus: false,\n            revalidateIfStale: false,\n        },\n    )\n\n    const [deleteConfirmationOpen, setDeleteConfirmationOpen] = useState(false)\n    const [isSubmiting, setIsSubmiting] = useState(false)\n\n    const handleFormSubmit = async (values: CustomerFormSchema) => {\n        console.log('Submitted values', values)\n        setIsSubmiting(true)\n        await sleep(800)\n        setIsSubmiting(false)\n        toast.push(<Notification type=\"success\">Changes Saved!</Notification>, {\n            placement: 'top-center',\n        })\n        navigate('/concepts/customers/customer-list')\n    }\n\n    const getDefaultValues = () => {\n        if (data) {\n            const { firstName, lastName, email, personalInfo, img } = data\n\n            return {\n                firstName,\n                lastName,\n                email,\n                img,\n                phoneNumber: personalInfo.phoneNumber,\n                dialCode: personalInfo.dialCode,\n                country: personalInfo.country,\n                address: personalInfo.address,\n                city: personalInfo.city,\n                postcode: personalInfo.postcode,\n                tags: [],\n            }\n        }\n\n        return {}\n    }\n\n    const handleConfirmDelete = () => {\n        setDeleteConfirmationOpen(true)\n        toast.push(\n            <Notification type=\"success\">Customer deleted!</Notification>,\n            { placement: 'top-center' },\n        )\n        navigate('/concepts/customers/customer-list')\n    }\n\n    const handleDelete = () => {\n        setDeleteConfirmationOpen(true)\n    }\n\n    const handleCancel = () => {\n        setDeleteConfirmationOpen(false)\n    }\n\n    const handleBack = () => {\n        history.back()\n    }\n\n    return (\n        <>\n            {!isLoading && !data && (\n                <div className=\"h-full flex flex-col items-center justify-center\">\n                    <NoUserFound height={280} width={280} />\n                    <h3 className=\"mt-8\">No user found!</h3>\n                </div>\n            )}\n            {!isLoading && data && (\n                <>\n                    <CustomerForm\n                        defaultValues={getDefaultValues() as CustomerFormSchema}\n                        newCustomer={false}\n                        onFormSubmit={handleFormSubmit}\n                    >\n                        <Container>\n                            <div className=\"flex items-center justify-between px-8\">\n                                <Button\n                                    className=\"ltr:mr-3 rtl:ml-3\"\n                                    type=\"button\"\n                                    variant=\"plain\"\n                                    icon={<TbArrowNarrowLeft />}\n                                    onClick={handleBack}\n                                >\n                                    Back\n                                </Button>\n                                <div className=\"flex items-center\">\n                                    <Button\n                                        className=\"ltr:mr-3 rtl:ml-3\"\n                                        type=\"button\"\n                                        customColorClass={() =>\n                                            'border-error ring-1 ring-error text-error hover:border-error hover:ring-error hover:text-error bg-transparent'\n                                        }\n                                        icon={<TbTrash />}\n                                        onClick={handleDelete}\n                                    >\n                                        Delete\n                                    </Button>\n                                    <Button\n                                        variant=\"solid\"\n                                        type=\"submit\"\n                                        loading={isSubmiting}\n                                    >\n                                        Save\n                                    </Button>\n                                </div>\n                            </div>\n                        </Container>\n                    </CustomerForm>\n                    <ConfirmDialog\n                        isOpen={deleteConfirmationOpen}\n                        type=\"danger\"\n                        title=\"Remove customers\"\n                        onClose={handleCancel}\n                        onRequestClose={handleCancel}\n                        onCancel={handleCancel}\n                        onConfirm={handleConfirmDelete}\n                    >\n                        <p>\n                            Are you sure you want to remove this customer? This\n                            action can&apos;t be undo.{' '}\n                        </p>\n                    </ConfirmDialog>\n                </>\n            )}\n        </>\n    )\n}\n\nexport default CustomerEdit\n"],"names":["CustomerEdit","id","useParams","navigate","useNavigate","data","isLoading","useSWR","_","params","apiGetCustomer","deleteConfirmationOpen","setDeleteConfirmationOpen","useState","isSubmiting","setIsSubmiting","handleFormSubmit","values","sleep","toast","jsx","Notification","getDefaultValues","firstName","lastName","email","personalInfo","img","handleConfirmDelete","handleDelete","handleCancel","handleBack","jsxs","Fragment","NoUserFound","CustomerForm","Container","Button","TbArrowNarrowLeft","TbTrash","ConfirmDialog"],"mappings":"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"}
+{"version":3,"file":"CustomerEdit.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerEdit/CustomerEdit.tsx"],"sourcesContent":["import { useState } from 'react'\nimport Container from '@/components/shared/Container'\nimport Button from '@/components/ui/Button'\nimport Notification from '@/components/ui/Notification'\nimport toast from '@/components/ui/toast'\nimport ConfirmDialog from '@/components/shared/ConfirmDialog'\nimport { apiGetCustomer } from '@/services/CustomersService'\nimport CustomerForm from '../CustomerForm'\nimport sleep from '@/utils/sleep'\nimport NoUserFound from '@/assets/svg/NoUserFound'\nimport { TbTrash, TbArrowNarrowLeft } from 'react-icons/tb'\nimport { useParams, useNavigate } from 'react-router-dom'\nimport useSWR from 'swr'\nimport type { CustomerFormSchema } from '../CustomerForm'\nimport type { Customer } from '../CustomerList/types'\n\nconst CustomerEdit = () => {\n    const { id } = useParams()\n\n    const navigate = useNavigate()\n\n    const { data, isLoading } = useSWR(\n        [`/api/customers${id}`, { id: id as string }],\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        ([_, params]) => apiGetCustomer<Customer, { id: string }>(params),\n        {\n            revalidateOnFocus: false,\n            revalidateIfStale: false,\n        },\n    )\n\n    const [deleteConfirmationOpen, setDeleteConfirmationOpen] = useState(false)\n    const [isSubmiting, setIsSubmiting] = useState(false)\n\n    const handleFormSubmit = async (values: CustomerFormSchema) => {\n        console.log('Submitted values', values)\n        setIsSubmiting(true)\n        await sleep(800)\n        setIsSubmiting(false)\n        toast.push(<Notification type=\"success\">Changes Saved!</Notification>, {\n            placement: 'top-center',\n        })\n        navigate('/concepts/customers/customer-list')\n    }\n\n    const getDefaultValues = () => {\n        if (data) {\n            const { firstName, lastName, email, personalInfo, img } = data\n\n            return {\n                firstName,\n                lastName,\n                email,\n                img,\n                phoneNumber: personalInfo.phoneNumber,\n                dialCode: personalInfo.dialCode,\n                country: personalInfo.country,\n                address: personalInfo.address,\n                city: personalInfo.city,\n                postcode: personalInfo.postcode,\n                tags: [],\n            }\n        }\n\n        return {}\n    }\n\n    const handleConfirmDelete = () => {\n        setDeleteConfirmationOpen(true)\n        toast.push(\n            <Notification type=\"success\">Customer deleted!</Notification>,\n            { placement: 'top-center' },\n        )\n        navigate('/concepts/customers/customer-list')\n    }\n\n    const handleDelete = () => {\n        setDeleteConfirmationOpen(true)\n    }\n\n    const handleCancel = () => {\n        setDeleteConfirmationOpen(false)\n    }\n\n    const handleBack = () => {\n        history.back()\n    }\n\n    return (\n        <>\n            {!isLoading && !data && (\n                <div className=\"h-full flex flex-col items-center justify-center\">\n                    <NoUserFound height={280} width={280} />\n                    <h3 className=\"mt-8\">No user found!</h3>\n                </div>\n            )}\n            {!isLoading && data && (\n                <>\n                    <CustomerForm\n                        defaultValues={getDefaultValues() as CustomerFormSchema}\n                        newCustomer={false}\n                        onFormSubmit={handleFormSubmit}\n                    >\n                        <Container>\n                            <div className=\"flex items-center justify-between px-8\">\n                                <Button\n                                    className=\"ltr:mr-3 rtl:ml-3\"\n                                    type=\"button\"\n                                    variant=\"plain\"\n                                    icon={<TbArrowNarrowLeft />}\n                                    onClick={handleBack}\n                                >\n                                    Back\n                                </Button>\n                                <div className=\"flex items-center\">\n                                    <Button\n                                        className=\"ltr:mr-3 rtl:ml-3\"\n                                        type=\"button\"\n                                        customColorClass={() =>\n                                            'border-error ring-1 ring-error text-error hover:border-error hover:ring-error hover:text-error bg-transparent'\n                                        }\n                                        icon={<TbTrash />}\n                                        onClick={handleDelete}\n                                    >\n                                        Delete\n                                    </Button>\n                                    <Button\n                                        variant=\"solid\"\n                                        type=\"submit\"\n                                        loading={isSubmiting}\n                                    >\n                                        Save\n                                    </Button>\n                                </div>\n                            </div>\n                        </Container>\n                    </CustomerForm>\n                    <ConfirmDialog\n                        isOpen={deleteConfirmationOpen}\n                        type=\"danger\"\n                        title=\"Remove customers\"\n                        onClose={handleCancel}\n                        onRequestClose={handleCancel}\n                        onCancel={handleCancel}\n                        onConfirm={handleConfirmDelete}\n                    >\n                        <p>\n                            Are you sure you want to remove this customer? This\n                            action can&apos;t be undo.{' '}\n                        </p>\n                    </ConfirmDialog>\n                </>\n            )}\n        </>\n    )\n}\n\nexport default CustomerEdit\n"],"names":["CustomerEdit","id","useParams","navigate","useNavigate","data","isLoading","useSWR","_","params","apiGetCustomer","deleteConfirmationOpen","setDeleteConfirmationOpen","useState","isSubmiting","setIsSubmiting","handleFormSubmit","values","sleep","toast","jsx","Notification","getDefaultValues","firstName","lastName","email","personalInfo","img","handleConfirmDelete","handleDelete","handleCancel","handleBack","jsxs","Fragment","NoUserFound","CustomerForm","Container","Button","TbArrowNarrowLeft","TbTrash","ConfirmDialog"],"mappings":"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"}

package/dist/@ecme/views/concepts/customers/CustomerForm/AccountSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccountSection.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerForm/AccountSection.tsx"],"sourcesContent":["import Card from '@/components/ui/Card'\nimport Switcher from '@/components/ui/Switcher'\nimport { FormItem } from '@/components/ui/Form'\nimport { Controller } from 'react-hook-form'\nimport type { FormSectionBaseProps } from './types'\n\ntype AccountSectionProps = FormSectionBaseProps\n\nconst AccountSection = ({ control }: AccountSectionProps) => {\n    return (\n        <Card>\n            <h4>Account</h4>\n            <div className=\"mt-6\">\n                <FormItem>\n                    <Controller\n                        name=\"banAccount\"\n                        control={control}\n                        render={({ field }) => (\n                            <div className=\"flex items-center justify-between gap-8\">\n                                <div>\n                                    <h6>Banned</h6>\n                                    <p>Disable this account</p>\n                                </div>\n                                <Switcher\n                                    checked={field.value}\n                                    onChange={(checked) => {\n                                        field.onChange(checked)\n                                    }}\n                                />\n                            </div>\n                        )}\n                    />\n                </FormItem>\n                <FormItem className=\"mb-0\">\n                    <Controller\n                        name=\"accountVerified\"\n                        control={control}\n                        render={({ field }) => (\n                            <div className=\"flex items-center justify-between gap-8\">\n                                <div>\n                                    <h6>Account Verified</h6>\n                                    <p>\n                                        Disabling sends a verification request\n                                        to the customer.\n                                    </p>\n                                </div>\n                                <Switcher\n                                    checked={field.value}\n                                    onChange={(checked) => {\n                                        field.onChange(checked)\n                                    }}\n                                />\n                            </div>\n                        )}\n                    />\n                </FormItem>\n            </div>\n        </Card>\n    )\n}\n\nexport default AccountSection\n"],"names":["AccountSection","control","Card","jsx","jsxs","FormItem","Controller","field","Switcher","checked"],"mappings":";;;;;;;;AAQA,MAAMA,IAAiB,CAAC,EAAE,SAAAC,0BAEjBC,GAAA,EACG,UAAA;AAAA,EAAA,gBAAAC,EAAC,QAAG,UAAA,UAAA,CAAO;AAAA,EACX,gBAAAC,EAAC,OAAA,EAAI,WAAU,QACX,UAAA;AAAA,IAAA,gBAAAD,EAACE,GAAA,EACG,UAAA,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QACG,MAAK;AAAA,QACL,SAAAL;AAAA,QACA,QAAQ,CAAC,EAAE,OAAAM,QACP,gBAAAH,EAAC,OAAA,EAAI,WAAU,2CACX,UAAA;AAAA,UAAA,gBAAAA,EAAC,OAAA,EACG,UAAA;AAAA,YAAA,gBAAAD,EAAC,QAAG,UAAA,SAAA,CAAM;AAAA,YACV,gBAAAA,EAAC,OAAE,UAAA,uBAAA,CAAoB;AAAA,UAAA,GAC3B;AAAA,UACA,gBAAAA;AAAA,YAACK;AAAA,YAAA;AAAA,cACG,SAASD,EAAM;AAAA,cACf,UAAU,CAACE,MAAY;AACnB,gBAAAF,EAAM,SAASE,CAAO;AAAA,cAC1B;AAAA,YAAA;AAAA,UAAA;AAAA,QACJ,EAAA,CACJ;AAAA,MAAA;AAAA,IAAA,GAGZ;AAAA,IACA,gBAAAN,EAACE,GAAA,EAAS,WAAU,QAChB,UAAA,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QACG,MAAK;AAAA,QACL,SAAAL;AAAA,QACA,QAAQ,CAAC,EAAE,OAAAM,QACP,gBAAAH,EAAC,OAAA,EAAI,WAAU,2CACX,UAAA;AAAA,UAAA,gBAAAA,EAAC,OAAA,EACG,UAAA;AAAA,YAAA,gBAAAD,EAAC,QAAG,UAAA,mBAAA,CAAgB;AAAA,YACpB,gBAAAA,EAAC,OAAE,UAAA,0DAAA,CAGH;AAAA,UAAA,GACJ;AAAA,UACA,gBAAAA;AAAA,YAACK;AAAA,YAAA;AAAA,cACG,SAASD,EAAM;AAAA,cACf,UAAU,CAACE,MAAY;AACnB,gBAAAF,EAAM,SAASE,CAAO;AAAA,cAC1B;AAAA,YAAA;AAAA,UAAA;AAAA,QACJ,EAAA,CACJ;AAAA,MAAA;AAAA,IAAA,EAER,CACJ;AAAA,EAAA,EAAA,CACJ;AAAA,GACJ;"}
+{"version":3,"file":"AccountSection.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerForm/AccountSection.tsx"],"sourcesContent":["import Card from '@/components/ui/Card'\nimport Switcher from '@/components/ui/Switcher'\nimport { FormItem } from '@/components/ui/Form'\nimport { Controller } from 'react-hook-form'\nimport type { FormSectionBaseProps } from './types'\n\ntype AccountSectionProps = FormSectionBaseProps\n\nconst AccountSection = ({ control }: AccountSectionProps) => {\n    return (\n        <Card>\n            <h4>Account</h4>\n            <div className=\"mt-6\">\n                <FormItem>\n                    <Controller\n                        name=\"banAccount\"\n                        control={control}\n                        render={({ field }) => (\n                            <div className=\"flex items-center justify-between gap-8\">\n                                <div>\n                                    <h6>Banned</h6>\n                                    <p>Disable this account</p>\n                                </div>\n                                <Switcher\n                                    checked={field.value}\n                                    onChange={(checked) => {\n                                        field.onChange(checked)\n                                    }}\n                                />\n                            </div>\n                        )}\n                    />\n                </FormItem>\n                <FormItem className=\"mb-0\">\n                    <Controller\n                        name=\"accountVerified\"\n                        control={control}\n                        render={({ field }) => (\n                            <div className=\"flex items-center justify-between gap-8\">\n                                <div>\n                                    <h6>Account Verified</h6>\n                                    <p>\n                                        Disabling sends a verification request\n                                        to the customer.\n                                    </p>\n                                </div>\n                                <Switcher\n                                    checked={field.value}\n                                    onChange={(checked) => {\n                                        field.onChange(checked)\n                                    }}\n                                />\n                            </div>\n                        )}\n                    />\n                </FormItem>\n            </div>\n        </Card>\n    )\n}\n\nexport default AccountSection\n"],"names":["AccountSection","control","Card","jsx","jsxs","FormItem","Controller","field","Switcher","checked"],"mappings":";;;;;;;;AAQA,MAAMA,IAAiB,CAAC,EAAE,SAAAC,0BAEjBC,GACG,EAAA,UAAA;AAAA,EAAA,gBAAAC,EAAC,QAAG,UAAO,UAAA,CAAA;AAAA,EACX,gBAAAC,EAAC,OAAI,EAAA,WAAU,QACX,UAAA;AAAA,IAAA,gBAAAD,EAACE,GACG,EAAA,UAAA,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QACG,MAAK;AAAA,QACL,SAAAL;AAAA,QACA,QAAQ,CAAC,EAAE,OAAAM,QACN,gBAAAH,EAAA,OAAA,EAAI,WAAU,2CACX,UAAA;AAAA,UAAA,gBAAAA,EAAC,OACG,EAAA,UAAA;AAAA,YAAA,gBAAAD,EAAC,QAAG,UAAM,SAAA,CAAA;AAAA,YACV,gBAAAA,EAAC,OAAE,UAAoB,uBAAA,CAAA;AAAA,UAAA,GAC3B;AAAA,UACA,gBAAAA;AAAA,YAACK;AAAA,YAAA;AAAA,cACG,SAASD,EAAM;AAAA,cACf,UAAU,CAACE,MAAY;AACnB,gBAAAF,EAAM,SAASE,CAAO;AAAA,cAAA;AAAA,YAC1B;AAAA,UAAA;AAAA,QACJ,EACJ,CAAA;AAAA,MAAA;AAAA,IAAA,GAGZ;AAAA,IACA,gBAAAN,EAACE,GAAS,EAAA,WAAU,QAChB,UAAA,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QACG,MAAK;AAAA,QACL,SAAAL;AAAA,QACA,QAAQ,CAAC,EAAE,OAAAM,QACN,gBAAAH,EAAA,OAAA,EAAI,WAAU,2CACX,UAAA;AAAA,UAAA,gBAAAA,EAAC,OACG,EAAA,UAAA;AAAA,YAAA,gBAAAD,EAAC,QAAG,UAAgB,mBAAA,CAAA;AAAA,YACpB,gBAAAA,EAAC,OAAE,UAGH,0DAAA,CAAA;AAAA,UAAA,GACJ;AAAA,UACA,gBAAAA;AAAA,YAACK;AAAA,YAAA;AAAA,cACG,SAASD,EAAM;AAAA,cACf,UAAU,CAACE,MAAY;AACnB,gBAAAF,EAAM,SAASE,CAAO;AAAA,cAAA;AAAA,YAC1B;AAAA,UAAA;AAAA,QACJ,EACJ,CAAA;AAAA,MAAA;AAAA,IAAA,EAGZ,CAAA;AAAA,EAAA,EACJ,CAAA;AAAA,GACJ;"}

package/dist/@ecme/views/concepts/customers/CustomerForm/AddressSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"AddressSection.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerForm/AddressSection.tsx"],"sourcesContent":["import Card from '@/components/ui/Card'\nimport Input from '@/components/ui/Input'\nimport Select, { Option as DefaultOption } from '@/components/ui/Select'\nimport Avatar from '@/components/ui/Avatar'\nimport { FormItem } from '@/components/ui/Form'\nimport { countryList } from '@/constants/countries.constant'\nimport { Controller } from 'react-hook-form'\nimport { components } from 'react-select'\nimport type { FormSectionBaseProps } from './types'\nimport type { ControlProps, OptionProps } from 'react-select'\n\ntype AddressSectionProps = FormSectionBaseProps\n\ntype CountryOption = {\n    label: string\n    dialCode: string\n    value: string\n}\n\nconst { Control } = components\n\nconst CustomSelectOption = (props: OptionProps<CountryOption>) => {\n    return (\n        <DefaultOption<CountryOption>\n            {...props}\n            customLabel={(data, label) => (\n                <span className=\"flex items-center gap-2\">\n                    <Avatar\n                        shape=\"circle\"\n                        size={20}\n                        src={`/img/countries/${data.value}.png`}\n                    />\n                    <span>{label}</span>\n                </span>\n            )}\n        />\n    )\n}\n\nconst CustomControl = ({ children, ...props }: ControlProps<CountryOption>) => {\n    const selected = props.getValue()[0]\n    return (\n        <Control {...props}>\n            {selected && (\n                <Avatar\n                    className=\"ltr:ml-4 rtl:mr-4\"\n                    shape=\"circle\"\n                    size={20}\n                    src={`/img/countries/${selected.value}.png`}\n                />\n            )}\n            {children}\n        </Control>\n    )\n}\n\nconst AddressSection = ({ control, errors }: AddressSectionProps) => {\n    return (\n        <Card>\n            <h4 className=\"mb-6\">Address Information</h4>\n            <FormItem\n                label=\"Country\"\n                invalid={Boolean(errors.country)}\n                errorMessage={errors.country?.message}\n            >\n                <Controller\n                    name=\"country\"\n                    control={control}\n                    render={({ field }) => (\n                        <Select<CountryOption>\n                            options={countryList}\n                            {...field}\n                            components={{\n                                Option: CustomSelectOption,\n                                Control: CustomControl,\n                            }}\n                            placeholder=\"\"\n                            value={countryList.filter(\n                                (option) => option.value === field.value,\n                            )}\n                            onChange={(option) => field.onChange(option?.value)}\n                        />\n                    )}\n                />\n            </FormItem>\n            <FormItem\n                label=\"Address\"\n                invalid={Boolean(errors.address)}\n                errorMessage={errors.address?.message}\n            >\n                <Controller\n                    name=\"address\"\n                    control={control}\n                    render={({ field }) => (\n                        <Input\n                            type=\"text\"\n                            autoComplete=\"off\"\n                            placeholder=\"Address\"\n                            {...field}\n                        />\n                    )}\n                />\n            </FormItem>\n            <div className=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n                <FormItem\n                    label=\"City\"\n                    invalid={Boolean(errors.city)}\n                    errorMessage={errors.city?.message}\n                >\n                    <Controller\n                        name=\"city\"\n                        control={control}\n                        render={({ field }) => (\n                            <Input\n                                type=\"text\"\n                                autoComplete=\"off\"\n                                placeholder=\"City\"\n                                {...field}\n                            />\n                        )}\n                    />\n                </FormItem>\n                <FormItem\n                    label=\"Postal Code\"\n                    invalid={Boolean(errors.postcode)}\n                    errorMessage={errors.postcode?.message}\n                >\n                    <Controller\n                        name=\"postcode\"\n                        control={control}\n                        render={({ field }) => (\n                            <Input\n                                type=\"text\"\n                                autoComplete=\"off\"\n                                placeholder=\"Postal Code\"\n                                {...field}\n                            />\n                        )}\n                    />\n                </FormItem>\n            </div>\n        </Card>\n    )\n}\n\nexport default AddressSection\n"],"names":["Control","components","CustomSelectOption","props","jsx","DefaultOption","data","label","jsxs","Avatar","CustomControl","children","selected","AddressSection","control","errors","Card","FormItem","Controller","field","Select","countryList","option","Input"],"mappings":";;;;;;;;;;;;;;AAmBA,MAAM,EAAE,SAAAA,MAAYC,GAEdC,IAAqB,CAACC,MAEpB,gBAAAC;AAAA,EAACC;AAAAA,EAAA;AAAA,IACI,GAAGF;AAAA,IACJ,aAAa,CAACG,GAAMC,MAChB,gBAAAC,EAAC,QAAA,EAAK,WAAU,2BACZ,UAAA;AAAA,MAAA,gBAAAJ;AAAA,QAACK;AAAA,QAAA;AAAA,UACG,OAAM;AAAA,UACN,MAAM;AAAA,UACN,KAAK,kBAAkBH,EAAK,KAAK;AAAA,QAAA;AAAA,MAAA;AAAA,MAErC,gBAAAF,EAAC,UAAM,UAAAG,EAAA,CAAM;AAAA,IAAA,EAAA,CACjB;AAAA,EAAA;AAAA,GAMVG,IAAgB,CAAC,EAAE,UAAAC,GAAU,GAAGR,QAAyC;AAC3E,QAAMS,IAAWT,EAAM,SAAA,EAAW,CAAC;AACnC,SACI,gBAAAK,EAACR,GAAA,EAAS,GAAGG,GACR,UAAA;AAAA,IAAAS,KACG,gBAAAR;AAAA,MAACK;AAAA,MAAA;AAAA,QACG,WAAU;AAAA,QACV,OAAM;AAAA,QACN,MAAM;AAAA,QACN,KAAK,kBAAkBG,EAAS,KAAK;AAAA,MAAA;AAAA,IAAA;AAAA,IAG5CD;AAAA,EAAA,GACL;AAER,GAEME,IAAiB,CAAC,EAAE,SAAAC,GAAS,QAAAC,0BAE1BC,GAAA,EACG,UAAA;AAAA,EAAA,gBAAAZ,EAAC,MAAA,EAAG,WAAU,QAAO,UAAA,uBAAmB;AAAA,EACxC,gBAAAA;AAAA,IAACa;AAAA,IAAA;AAAA,MACG,OAAM;AAAA,MACN,SAAS,EAAQF,EAAO;AAAA,MACxB,cAAcA,EAAO,SAAS;AAAA,MAE9B,UAAA,gBAAAX;AAAA,QAACc;AAAA,QAAA;AAAA,UACG,MAAK;AAAA,UACL,SAAAJ;AAAA,UACA,QAAQ,CAAC,EAAE,OAAAK,EAAA,MACP,gBAAAf;AAAA,YAACgB;AAAA,YAAA;AAAA,cACG,SAASC;AAAA,cACR,GAAGF;AAAA,cACJ,YAAY;AAAA,gBACR,QAAQjB;AAAA,gBACR,SAASQ;AAAA,cAAA;AAAA,cAEb,aAAY;AAAA,cACZ,OAAOW,EAAY;AAAA,gBACf,CAACC,MAAWA,EAAO,UAAUH,EAAM;AAAA,cAAA;AAAA,cAEvC,UAAU,CAACG,MAAWH,EAAM,SAASG,GAAQ,KAAK;AAAA,YAAA;AAAA,UAAA;AAAA,QACtD;AAAA,MAAA;AAAA,IAER;AAAA,EAAA;AAAA,EAEJ,gBAAAlB;AAAA,IAACa;AAAA,IAAA;AAAA,MACG,OAAM;AAAA,MACN,SAAS,EAAQF,EAAO;AAAA,MACxB,cAAcA,EAAO,SAAS;AAAA,MAE9B,UAAA,gBAAAX;AAAA,QAACc;AAAA,QAAA;AAAA,UACG,MAAK;AAAA,UACL,SAAAJ;AAAA,UACA,QAAQ,CAAC,EAAE,OAAAK,EAAA,MACP,gBAAAf;AAAA,YAACmB;AAAA,YAAA;AAAA,cACG,MAAK;AAAA,cACL,cAAa;AAAA,cACb,aAAY;AAAA,cACX,GAAGJ;AAAA,YAAA;AAAA,UAAA;AAAA,QACR;AAAA,MAAA;AAAA,IAER;AAAA,EAAA;AAAA,EAEJ,gBAAAX,EAAC,OAAA,EAAI,WAAU,yCACX,UAAA;AAAA,IAAA,gBAAAJ;AAAA,MAACa;AAAA,MAAA;AAAA,QACG,OAAM;AAAA,QACN,SAAS,EAAQF,EAAO;AAAA,QACxB,cAAcA,EAAO,MAAM;AAAA,QAE3B,UAAA,gBAAAX;AAAA,UAACc;AAAA,UAAA;AAAA,YACG,MAAK;AAAA,YACL,SAAAJ;AAAA,YACA,QAAQ,CAAC,EAAE,OAAAK,EAAA,MACP,gBAAAf;AAAA,cAACmB;AAAA,cAAA;AAAA,gBACG,MAAK;AAAA,gBACL,cAAa;AAAA,gBACb,aAAY;AAAA,gBACX,GAAGJ;AAAA,cAAA;AAAA,YAAA;AAAA,UACR;AAAA,QAAA;AAAA,MAER;AAAA,IAAA;AAAA,IAEJ,gBAAAf;AAAA,MAACa;AAAA,MAAA;AAAA,QACG,OAAM;AAAA,QACN,SAAS,EAAQF,EAAO;AAAA,QACxB,cAAcA,EAAO,UAAU;AAAA,QAE/B,UAAA,gBAAAX;AAAA,UAACc;AAAA,UAAA;AAAA,YACG,MAAK;AAAA,YACL,SAAAJ;AAAA,YACA,QAAQ,CAAC,EAAE,OAAAK,EAAA,MACP,gBAAAf;AAAA,cAACmB;AAAA,cAAA;AAAA,gBACG,MAAK;AAAA,gBACL,cAAa;AAAA,gBACb,aAAY;AAAA,gBACX,GAAGJ;AAAA,cAAA;AAAA,YAAA;AAAA,UACR;AAAA,QAAA;AAAA,MAER;AAAA,IAAA;AAAA,EACJ,EAAA,CACJ;AAAA,GACJ;"}
+{"version":3,"file":"AddressSection.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerForm/AddressSection.tsx"],"sourcesContent":["import Card from '@/components/ui/Card'\nimport Input from '@/components/ui/Input'\nimport Select, { Option as DefaultOption } from '@/components/ui/Select'\nimport Avatar from '@/components/ui/Avatar'\nimport { FormItem } from '@/components/ui/Form'\nimport { countryList } from '@/constants/countries.constant'\nimport { Controller } from 'react-hook-form'\nimport { components } from 'react-select'\nimport type { FormSectionBaseProps } from './types'\nimport type { ControlProps, OptionProps } from 'react-select'\n\ntype AddressSectionProps = FormSectionBaseProps\n\ntype CountryOption = {\n    label: string\n    dialCode: string\n    value: string\n}\n\nconst { Control } = components\n\nconst CustomSelectOption = (props: OptionProps<CountryOption>) => {\n    return (\n        <DefaultOption<CountryOption>\n            {...props}\n            customLabel={(data, label) => (\n                <span className=\"flex items-center gap-2\">\n                    <Avatar\n                        shape=\"circle\"\n                        size={20}\n                        src={`/img/countries/${data.value}.png`}\n                    />\n                    <span>{label}</span>\n                </span>\n            )}\n        />\n    )\n}\n\nconst CustomControl = ({ children, ...props }: ControlProps<CountryOption>) => {\n    const selected = props.getValue()[0]\n    return (\n        <Control {...props}>\n            {selected && (\n                <Avatar\n                    className=\"ltr:ml-4 rtl:mr-4\"\n                    shape=\"circle\"\n                    size={20}\n                    src={`/img/countries/${selected.value}.png`}\n                />\n            )}\n            {children}\n        </Control>\n    )\n}\n\nconst AddressSection = ({ control, errors }: AddressSectionProps) => {\n    return (\n        <Card>\n            <h4 className=\"mb-6\">Address Information</h4>\n            <FormItem\n                label=\"Country\"\n                invalid={Boolean(errors.country)}\n                errorMessage={errors.country?.message}\n            >\n                <Controller\n                    name=\"country\"\n                    control={control}\n                    render={({ field }) => (\n                        <Select<CountryOption>\n                            options={countryList}\n                            {...field}\n                            components={{\n                                Option: CustomSelectOption,\n                                Control: CustomControl,\n                            }}\n                            placeholder=\"\"\n                            value={countryList.filter(\n                                (option) => option.value === field.value,\n                            )}\n                            onChange={(option) => field.onChange(option?.value)}\n                        />\n                    )}\n                />\n            </FormItem>\n            <FormItem\n                label=\"Address\"\n                invalid={Boolean(errors.address)}\n                errorMessage={errors.address?.message}\n            >\n                <Controller\n                    name=\"address\"\n                    control={control}\n                    render={({ field }) => (\n                        <Input\n                            type=\"text\"\n                            autoComplete=\"off\"\n                            placeholder=\"Address\"\n                            {...field}\n                        />\n                    )}\n                />\n            </FormItem>\n            <div className=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n                <FormItem\n                    label=\"City\"\n                    invalid={Boolean(errors.city)}\n                    errorMessage={errors.city?.message}\n                >\n                    <Controller\n                        name=\"city\"\n                        control={control}\n                        render={({ field }) => (\n                            <Input\n                                type=\"text\"\n                                autoComplete=\"off\"\n                                placeholder=\"City\"\n                                {...field}\n                            />\n                        )}\n                    />\n                </FormItem>\n                <FormItem\n                    label=\"Postal Code\"\n                    invalid={Boolean(errors.postcode)}\n                    errorMessage={errors.postcode?.message}\n                >\n                    <Controller\n                        name=\"postcode\"\n                        control={control}\n                        render={({ field }) => (\n                            <Input\n                                type=\"text\"\n                                autoComplete=\"off\"\n                                placeholder=\"Postal Code\"\n                                {...field}\n                            />\n                        )}\n                    />\n                </FormItem>\n            </div>\n        </Card>\n    )\n}\n\nexport default AddressSection\n"],"names":["Control","components","CustomSelectOption","props","jsx","DefaultOption","data","label","jsxs","Avatar","CustomControl","children","selected","AddressSection","control","errors","Card","FormItem","Controller","field","Select","countryList","option","Input"],"mappings":"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"}

package/dist/@ecme/views/concepts/customers/CustomerForm/CustomerForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomerForm.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerForm/CustomerForm.tsx"],"sourcesContent":["import { useEffect } from 'react'\nimport { Form } from '@/components/ui/Form'\nimport Container from '@/components/shared/Container'\nimport BottomStickyBar from '@/components/template/BottomStickyBar'\nimport OverviewSection from './OverviewSection'\nimport AddressSection from './AddressSection'\nimport TagsSection from './TagsSection'\nimport ProfileImageSection from './ProfileImageSection'\nimport AccountSection from './AccountSection'\nimport isEmpty from 'lodash/isEmpty'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { useForm } from 'react-hook-form'\nimport { z } from 'zod'\nimport type { ZodType } from 'zod'\nimport type { CommonProps } from '@/@types/common'\nimport type { CustomerFormSchema } from './types'\n\ntype CustomerFormProps = {\n    onFormSubmit: (values: CustomerFormSchema) => void\n    defaultValues?: CustomerFormSchema\n    newCustomer?: boolean\n} & CommonProps\n\nconst validationSchema: ZodType<CustomerFormSchema> = z.object({\n    firstName: z.string().min(1, { message: 'First name required' }),\n    lastName: z.string().min(1, { message: 'Last name required' }),\n    email: z\n        .string()\n        .min(1, { message: 'Email required' })\n        .email({ message: 'Invalid email' }),\n    dialCode: z.string().min(1, { message: 'Please select your country code' }),\n    phoneNumber: z\n        .string()\n        .min(1, { message: 'Please input your mobile number' }),\n    country: z.string().min(1, { message: 'Please select a country' }),\n    address: z.string().min(1, { message: 'Addrress required' }),\n    postcode: z.string().min(1, { message: 'Postcode required' }),\n    city: z.string().min(1, { message: 'City required' }),\n    img: z.string(),\n    tags: z.array(z.object({ value: z.string(), label: z.string() })),\n})\n\nconst CustomerForm = (props: CustomerFormProps) => {\n    const {\n        onFormSubmit,\n        defaultValues = {},\n        newCustomer = false,\n        children,\n    } = props\n\n    const {\n        handleSubmit,\n        reset,\n        formState: { errors },\n        control,\n    } = useForm<CustomerFormSchema>({\n        defaultValues: {\n            ...{\n                banAccount: false,\n                accountVerified: true,\n            },\n            ...defaultValues,\n        },\n        resolver: zodResolver(validationSchema),\n    })\n\n    useEffect(() => {\n        if (!isEmpty(defaultValues)) {\n            reset(defaultValues)\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [JSON.stringify(defaultValues)])\n\n    const onSubmit = (values: CustomerFormSchema) => {\n        onFormSubmit?.(values)\n    }\n\n    return (\n        <Form\n            className=\"flex w-full h-full\"\n            containerClassName=\"flex flex-col w-full justify-between\"\n            onSubmit={handleSubmit(onSubmit)}\n        >\n            <Container>\n                <div className=\"flex flex-col md:flex-row gap-4\">\n                    <div className=\"gap-4 flex flex-col flex-auto\">\n                        <OverviewSection control={control} errors={errors} />\n                        <AddressSection control={control} errors={errors} />\n                    </div>\n                    <div className=\"md:w-[370px] gap-4 flex flex-col\">\n                        <ProfileImageSection\n                            control={control}\n                            errors={errors}\n                        />\n                        <TagsSection control={control} errors={errors} />\n                        {!newCustomer && (\n                            <AccountSection control={control} errors={errors} />\n                        )}\n                    </div>\n                </div>\n            </Container>\n            <BottomStickyBar>{children}</BottomStickyBar>\n        </Form>\n    )\n}\n\nexport default CustomerForm\n"],"names":["validationSchema","z","CustomerForm","props","onFormSubmit","defaultValues","newCustomer","children","handleSubmit","reset","errors","control","useForm","zodResolver","useEffect","isEmpty","jsxs","Form","values","jsx","Container","OverviewSection","AddressSection","ProfileImageSection","TagsSection","AccountSection","BottomStickyBar"],"mappings":";;;;;;;;;;;;;;;AAuBA,MAAMA,IAAgDC,EAAE,OAAO;AAAA,EAC3D,WAAWA,EAAE,SAAS,IAAI,GAAG,EAAE,SAAS,uBAAuB;AAAA,EAC/D,UAAUA,EAAE,SAAS,IAAI,GAAG,EAAE,SAAS,sBAAsB;AAAA,EAC7D,OAAOA,EACF,SACA,IAAI,GAAG,EAAE,SAAS,iBAAA,CAAkB,EACpC,MAAM,EAAE,SAAS,iBAAiB;AAAA,EACvC,UAAUA,EAAE,SAAS,IAAI,GAAG,EAAE,SAAS,mCAAmC;AAAA,EAC1E,aAAaA,EACR,SACA,IAAI,GAAG,EAAE,SAAS,mCAAmC;AAAA,EAC1D,SAASA,EAAE,SAAS,IAAI,GAAG,EAAE,SAAS,2BAA2B;AAAA,EACjE,SAASA,EAAE,SAAS,IAAI,GAAG,EAAE,SAAS,qBAAqB;AAAA,EAC3D,UAAUA,EAAE,SAAS,IAAI,GAAG,EAAE,SAAS,qBAAqB;AAAA,EAC5D,MAAMA,EAAE,SAAS,IAAI,GAAG,EAAE,SAAS,iBAAiB;AAAA,EACpD,KAAKA,EAAE,OAAA;AAAA,EACP,MAAMA,EAAE,MAAMA,EAAE,OAAO,EAAE,OAAOA,EAAE,OAAA,GAAU,OAAOA,EAAE,OAAA,EAAO,CAAG,CAAC;AACpE,CAAC,GAEKC,IAAe,CAACC,MAA6B;AAC/C,QAAM;AAAA,IACF,cAAAC;AAAA,IACA,eAAAC,IAAgB,CAAA;AAAA,IAChB,aAAAC,IAAc;AAAA,IACd,UAAAC;AAAA,EAAA,IACAJ,GAEE;AAAA,IACF,cAAAK;AAAA,IACA,OAAAC;AAAA,IACA,WAAW,EAAE,QAAAC,EAAA;AAAA,IACb,SAAAC;AAAA,EAAA,IACAC,EAA4B;AAAA,IAC5B,eAAe;AAAA,MAEP,YAAY;AAAA,MACZ,iBAAiB;AAAA,MAErB,GAAGP;AAAA,IAAA;AAAA,IAEP,UAAUQ,EAAYb,CAAgB;AAAA,EAAA,CACzC;AAED,SAAAc,EAAU,MAAM;AACZ,IAAKC,EAAQV,CAAa,KACtBI,EAAMJ,CAAa;AAAA,EAG3B,GAAG,CAAC,KAAK,UAAUA,CAAa,CAAC,CAAC,GAO9B,gBAAAW;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,WAAU;AAAA,MACV,oBAAmB;AAAA,MACnB,UAAUT,EARD,CAACU,MAA+B;AAC7C,QAAAd,IAAec,CAAM;AAAA,MACzB,CAMuC;AAAA,MAE/B,UAAA;AAAA,QAAA,gBAAAC,EAACC,GAAA,EACG,UAAA,gBAAAJ,EAAC,OAAA,EAAI,WAAU,mCACX,UAAA;AAAA,UAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,iCACX,UAAA;AAAA,YAAA,gBAAAG,EAACE,GAAA,EAAgB,SAAAV,GAAkB,QAAAD,EAAA,CAAgB;AAAA,YACnD,gBAAAS,EAACG,GAAA,EAAe,SAAAX,GAAkB,QAAAD,EAAA,CAAgB;AAAA,UAAA,GACtD;AAAA,UACA,gBAAAM,EAAC,OAAA,EAAI,WAAU,oCACX,UAAA;AAAA,YAAA,gBAAAG;AAAA,cAACI;AAAAA,cAAA;AAAA,gBACG,SAAAZ;AAAA,gBACA,QAAAD;AAAA,cAAA;AAAA,YAAA;AAAA,YAEJ,gBAAAS,EAACK,GAAA,EAAY,SAAAb,GAAkB,QAAAD,EAAA,CAAgB;AAAA,YAC9C,CAACJ,KACE,gBAAAa,EAACM,GAAA,EAAe,SAAAd,GAAkB,QAAAD,EAAA,CAAgB;AAAA,UAAA,EAAA,CAE1D;AAAA,QAAA,EAAA,CACJ,EAAA,CACJ;AAAA,QACA,gBAAAS,EAACO,KAAiB,UAAAnB,EAAA,CAAS;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGvC;"}
+{"version":3,"file":"CustomerForm.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerForm/CustomerForm.tsx"],"sourcesContent":["import { useEffect } from 'react'\nimport { Form } from '@/components/ui/Form'\nimport Container from '@/components/shared/Container'\nimport BottomStickyBar from '@/components/template/BottomStickyBar'\nimport OverviewSection from './OverviewSection'\nimport AddressSection from './AddressSection'\nimport TagsSection from './TagsSection'\nimport ProfileImageSection from './ProfileImageSection'\nimport AccountSection from './AccountSection'\nimport isEmpty from 'lodash/isEmpty'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { useForm } from 'react-hook-form'\nimport { z } from 'zod'\nimport type { ZodType } from 'zod'\nimport type { CommonProps } from '@/@types/common'\nimport type { CustomerFormSchema } from './types'\n\ntype CustomerFormProps = {\n    onFormSubmit: (values: CustomerFormSchema) => void\n    defaultValues?: CustomerFormSchema\n    newCustomer?: boolean\n} & CommonProps\n\nconst validationSchema: ZodType<CustomerFormSchema> = z.object({\n    firstName: z.string().min(1, { message: 'First name required' }),\n    lastName: z.string().min(1, { message: 'Last name required' }),\n    email: z\n        .string()\n        .min(1, { message: 'Email required' })\n        .email({ message: 'Invalid email' }),\n    dialCode: z.string().min(1, { message: 'Please select your country code' }),\n    phoneNumber: z\n        .string()\n        .min(1, { message: 'Please input your mobile number' }),\n    country: z.string().min(1, { message: 'Please select a country' }),\n    address: z.string().min(1, { message: 'Addrress required' }),\n    postcode: z.string().min(1, { message: 'Postcode required' }),\n    city: z.string().min(1, { message: 'City required' }),\n    img: z.string(),\n    tags: z.array(z.object({ value: z.string(), label: z.string() })),\n})\n\nconst CustomerForm = (props: CustomerFormProps) => {\n    const {\n        onFormSubmit,\n        defaultValues = {},\n        newCustomer = false,\n        children,\n    } = props\n\n    const {\n        handleSubmit,\n        reset,\n        formState: { errors },\n        control,\n    } = useForm<CustomerFormSchema>({\n        defaultValues: {\n            ...{\n                banAccount: false,\n                accountVerified: true,\n            },\n            ...defaultValues,\n        },\n        resolver: zodResolver(validationSchema),\n    })\n\n    useEffect(() => {\n        if (!isEmpty(defaultValues)) {\n            reset(defaultValues)\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [JSON.stringify(defaultValues)])\n\n    const onSubmit = (values: CustomerFormSchema) => {\n        onFormSubmit?.(values)\n    }\n\n    return (\n        <Form\n            className=\"flex w-full h-full\"\n            containerClassName=\"flex flex-col w-full justify-between\"\n            onSubmit={handleSubmit(onSubmit)}\n        >\n            <Container>\n                <div className=\"flex flex-col md:flex-row gap-4\">\n                    <div className=\"gap-4 flex flex-col flex-auto\">\n                        <OverviewSection control={control} errors={errors} />\n                        <AddressSection control={control} errors={errors} />\n                    </div>\n                    <div className=\"md:w-[370px] gap-4 flex flex-col\">\n                        <ProfileImageSection\n                            control={control}\n                            errors={errors}\n                        />\n                        <TagsSection control={control} errors={errors} />\n                        {!newCustomer && (\n                            <AccountSection control={control} errors={errors} />\n                        )}\n                    </div>\n                </div>\n            </Container>\n            <BottomStickyBar>{children}</BottomStickyBar>\n        </Form>\n    )\n}\n\nexport default CustomerForm\n"],"names":["validationSchema","z","CustomerForm","props","onFormSubmit","defaultValues","newCustomer","children","handleSubmit","reset","errors","control","useForm","zodResolver","useEffect","isEmpty","jsxs","Form","values","jsx","Container","OverviewSection","AddressSection","ProfileImageSection","TagsSection","AccountSection","BottomStickyBar"],"mappings":";;;;;;;;;;;;;;;AAuBA,MAAMA,IAAgDC,EAAE,OAAO;AAAA,EAC3D,WAAWA,EAAE,SAAS,IAAI,GAAG,EAAE,SAAS,uBAAuB;AAAA,EAC/D,UAAUA,EAAE,SAAS,IAAI,GAAG,EAAE,SAAS,sBAAsB;AAAA,EAC7D,OAAOA,EACF,SACA,IAAI,GAAG,EAAE,SAAS,iBAAkB,CAAA,EACpC,MAAM,EAAE,SAAS,iBAAiB;AAAA,EACvC,UAAUA,EAAE,SAAS,IAAI,GAAG,EAAE,SAAS,mCAAmC;AAAA,EAC1E,aAAaA,EACR,SACA,IAAI,GAAG,EAAE,SAAS,mCAAmC;AAAA,EAC1D,SAASA,EAAE,SAAS,IAAI,GAAG,EAAE,SAAS,2BAA2B;AAAA,EACjE,SAASA,EAAE,SAAS,IAAI,GAAG,EAAE,SAAS,qBAAqB;AAAA,EAC3D,UAAUA,EAAE,SAAS,IAAI,GAAG,EAAE,SAAS,qBAAqB;AAAA,EAC5D,MAAMA,EAAE,SAAS,IAAI,GAAG,EAAE,SAAS,iBAAiB;AAAA,EACpD,KAAKA,EAAE,OAAO;AAAA,EACd,MAAMA,EAAE,MAAMA,EAAE,OAAO,EAAE,OAAOA,EAAE,OAAA,GAAU,OAAOA,EAAE,OAAO,EAAA,CAAG,CAAC;AACpE,CAAC,GAEKC,IAAe,CAACC,MAA6B;AACzC,QAAA;AAAA,IACF,cAAAC;AAAA,IACA,eAAAC,IAAgB,CAAC;AAAA,IACjB,aAAAC,IAAc;AAAA,IACd,UAAAC;AAAA,EAAA,IACAJ,GAEE;AAAA,IACF,cAAAK;AAAA,IACA,OAAAC;AAAA,IACA,WAAW,EAAE,QAAAC,EAAO;AAAA,IACpB,SAAAC;AAAA,MACAC,EAA4B;AAAA,IAC5B,eAAe;AAAA,MAEP,YAAY;AAAA,MACZ,iBAAiB;AAAA,MAErB,GAAGP;AAAA,IACP;AAAA,IACA,UAAUQ,EAAYb,CAAgB;AAAA,EAAA,CACzC;AAED,SAAAc,EAAU,MAAM;AACR,IAACC,EAAQV,CAAa,KACtBI,EAAMJ,CAAa;AAAA,KAGxB,CAAC,KAAK,UAAUA,CAAa,CAAC,CAAC,GAO9B,gBAAAW;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,WAAU;AAAA,MACV,oBAAmB;AAAA,MACnB,UAAUT,EARD,CAACU,MAA+B;AAC7C,QAAAd,IAAec,CAAM;AAAA,MACzB,CAMuC;AAAA,MAE/B,UAAA;AAAA,QAAA,gBAAAC,EAACC,GACG,EAAA,UAAA,gBAAAJ,EAAC,OAAI,EAAA,WAAU,mCACX,UAAA;AAAA,UAAC,gBAAAA,EAAA,OAAA,EAAI,WAAU,iCACX,UAAA;AAAA,YAAC,gBAAAG,EAAAE,GAAA,EAAgB,SAAAV,GAAkB,QAAAD,EAAgB,CAAA;AAAA,YACnD,gBAAAS,EAACG,GAAe,EAAA,SAAAX,GAAkB,QAAAD,EAAgB,CAAA;AAAA,UAAA,GACtD;AAAA,UACA,gBAAAM,EAAC,OAAI,EAAA,WAAU,oCACX,UAAA;AAAA,YAAA,gBAAAG;AAAA,cAACI;AAAAA,cAAA;AAAA,gBACG,SAAAZ;AAAA,gBACA,QAAAD;AAAA,cAAA;AAAA,YACJ;AAAA,YACA,gBAAAS,EAACK,GAAY,EAAA,SAAAb,GAAkB,QAAAD,EAAgB,CAAA;AAAA,YAC9C,CAACJ,KACG,gBAAAa,EAAAM,GAAA,EAAe,SAAAd,GAAkB,QAAAD,EAAgB,CAAA;AAAA,UAAA,EAE1D,CAAA;AAAA,QAAA,EAAA,CACJ,EACJ,CAAA;AAAA,QACA,gBAAAS,EAACO,KAAiB,UAAAnB,EAAS,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAC/B;AAER;"}

package/dist/@ecme/views/concepts/customers/CustomerForm/OverviewSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"OverviewSection.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerForm/OverviewSection.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport Card from '@/components/ui/Card'\nimport Input from '@/components/ui/Input'\nimport Select, { Option as DefaultOption } from '@/components/ui/Select'\nimport Avatar from '@/components/ui/Avatar'\nimport { FormItem } from '@/components/ui/Form'\nimport NumericInput from '@/components/shared/NumericInput'\nimport { countryList } from '@/constants/countries.constant'\nimport { Controller } from 'react-hook-form'\nimport { components } from 'react-select'\nimport type { FormSectionBaseProps } from './types'\nimport type { ControlProps, OptionProps } from 'react-select'\n\ntype OverviewSectionProps = FormSectionBaseProps\n\ntype CountryOption = {\n    label: string\n    dialCode: string\n    value: string\n}\n\nconst { Control } = components\n\nconst CustomSelectOption = (props: OptionProps<CountryOption>) => {\n    return (\n        <DefaultOption<CountryOption>\n            {...props}\n            customLabel={(data) => (\n                <span className=\"flex items-center gap-2\">\n                    <Avatar\n                        shape=\"circle\"\n                        size={20}\n                        src={`/img/countries/${data.value}.png`}\n                    />\n                    <span>{data.dialCode}</span>\n                </span>\n            )}\n        />\n    )\n}\n\nconst CustomControl = ({ children, ...props }: ControlProps<CountryOption>) => {\n    const selected = props.getValue()[0]\n    return (\n        <Control {...props}>\n            {selected && (\n                <Avatar\n                    className=\"ltr:ml-4 rtl:mr-4\"\n                    shape=\"circle\"\n                    size={20}\n                    src={`/img/countries/${selected.value}.png`}\n                />\n            )}\n            {children}\n        </Control>\n    )\n}\n\nconst OverviewSection = ({ control, errors }: OverviewSectionProps) => {\n    const dialCodeList = useMemo(() => {\n        const newCountryList: Array<CountryOption> = JSON.parse(\n            JSON.stringify(countryList),\n        )\n\n        return newCountryList.map((country) => {\n            country.label = country.dialCode\n            return country\n        })\n    }, [])\n\n    return (\n        <Card>\n            <h4 className=\"mb-6\">Overview</h4>\n            <div className=\"grid md:grid-cols-2 gap-4\">\n                <FormItem\n                    label=\"First Name\"\n                    invalid={Boolean(errors.firstName)}\n                    errorMessage={errors.firstName?.message}\n                >\n                    <Controller\n                        name=\"firstName\"\n                        control={control}\n                        render={({ field }) => (\n                            <Input\n                                type=\"text\"\n                                autoComplete=\"off\"\n                                placeholder=\"First Name\"\n                                {...field}\n                            />\n                        )}\n                    />\n                </FormItem>\n                <FormItem\n                    label=\"User Name\"\n                    invalid={Boolean(errors.lastName)}\n                    errorMessage={errors.lastName?.message}\n                >\n                    <Controller\n                        name=\"lastName\"\n                        control={control}\n                        render={({ field }) => (\n                            <Input\n                                type=\"text\"\n                                autoComplete=\"off\"\n                                placeholder=\"Last Name\"\n                                {...field}\n                            />\n                        )}\n                    />\n                </FormItem>\n            </div>\n            <FormItem\n                label=\"Email\"\n                invalid={Boolean(errors.email)}\n                errorMessage={errors.email?.message}\n            >\n                <Controller\n                    name=\"email\"\n                    control={control}\n                    render={({ field }) => (\n                        <Input\n                            type=\"email\"\n                            autoComplete=\"off\"\n                            placeholder=\"Email\"\n                            {...field}\n                        />\n                    )}\n                />\n            </FormItem>\n            <div className=\"flex items-end gap-4 w-full\">\n                <FormItem\n                    invalid={\n                        Boolean(errors.phoneNumber) || Boolean(errors.dialCode)\n                    }\n                >\n                    <label className=\"form-label mb-2\">Phone number</label>\n                    <Controller\n                        name=\"dialCode\"\n                        control={control}\n                        render={({ field }) => (\n                            <Select<CountryOption>\n                                options={dialCodeList}\n                                {...field}\n                                className=\"w-[150px]\"\n                                components={{\n                                    Option: CustomSelectOption,\n                                    Control: CustomControl,\n                                }}\n                                placeholder=\"\"\n                                value={dialCodeList.filter(\n                                    (option) => option.dialCode === field.value,\n                                )}\n                                onChange={(option) =>\n                                    field.onChange(option?.dialCode)\n                                }\n                            />\n                        )}\n                    />\n                </FormItem>\n                <FormItem\n                    className=\"w-full\"\n                    invalid={\n                        Boolean(errors.phoneNumber) || Boolean(errors.dialCode)\n                    }\n                    errorMessage={errors.phoneNumber?.message}\n                >\n                    <Controller\n                        name=\"phoneNumber\"\n                        control={control}\n                        render={({ field }) => (\n                            <NumericInput\n                                autoComplete=\"off\"\n                                placeholder=\"Phone Number\"\n                                value={field.value}\n                                onChange={field.onChange}\n                                onBlur={field.onBlur}\n                            />\n                        )}\n                    />\n                </FormItem>\n            </div>\n        </Card>\n    )\n}\n\nexport default OverviewSection\n"],"names":["Control","components","CustomSelectOption","props","jsx","DefaultOption","data","jsxs","Avatar","CustomControl","children","selected","OverviewSection","control","errors","dialCodeList","useMemo","countryList","country","Card","FormItem","Controller","field","Input","Select","option","NumericInput"],"mappings":"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"}
+{"version":3,"file":"OverviewSection.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerForm/OverviewSection.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport Card from '@/components/ui/Card'\nimport Input from '@/components/ui/Input'\nimport Select, { Option as DefaultOption } from '@/components/ui/Select'\nimport Avatar from '@/components/ui/Avatar'\nimport { FormItem } from '@/components/ui/Form'\nimport NumericInput from '@/components/shared/NumericInput'\nimport { countryList } from '@/constants/countries.constant'\nimport { Controller } from 'react-hook-form'\nimport { components } from 'react-select'\nimport type { FormSectionBaseProps } from './types'\nimport type { ControlProps, OptionProps } from 'react-select'\n\ntype OverviewSectionProps = FormSectionBaseProps\n\ntype CountryOption = {\n    label: string\n    dialCode: string\n    value: string\n}\n\nconst { Control } = components\n\nconst CustomSelectOption = (props: OptionProps<CountryOption>) => {\n    return (\n        <DefaultOption<CountryOption>\n            {...props}\n            customLabel={(data) => (\n                <span className=\"flex items-center gap-2\">\n                    <Avatar\n                        shape=\"circle\"\n                        size={20}\n                        src={`/img/countries/${data.value}.png`}\n                    />\n                    <span>{data.dialCode}</span>\n                </span>\n            )}\n        />\n    )\n}\n\nconst CustomControl = ({ children, ...props }: ControlProps<CountryOption>) => {\n    const selected = props.getValue()[0]\n    return (\n        <Control {...props}>\n            {selected && (\n                <Avatar\n                    className=\"ltr:ml-4 rtl:mr-4\"\n                    shape=\"circle\"\n                    size={20}\n                    src={`/img/countries/${selected.value}.png`}\n                />\n            )}\n            {children}\n        </Control>\n    )\n}\n\nconst OverviewSection = ({ control, errors }: OverviewSectionProps) => {\n    const dialCodeList = useMemo(() => {\n        const newCountryList: Array<CountryOption> = JSON.parse(\n            JSON.stringify(countryList),\n        )\n\n        return newCountryList.map((country) => {\n            country.label = country.dialCode\n            return country\n        })\n    }, [])\n\n    return (\n        <Card>\n            <h4 className=\"mb-6\">Overview</h4>\n            <div className=\"grid md:grid-cols-2 gap-4\">\n                <FormItem\n                    label=\"First Name\"\n                    invalid={Boolean(errors.firstName)}\n                    errorMessage={errors.firstName?.message}\n                >\n                    <Controller\n                        name=\"firstName\"\n                        control={control}\n                        render={({ field }) => (\n                            <Input\n                                type=\"text\"\n                                autoComplete=\"off\"\n                                placeholder=\"First Name\"\n                                {...field}\n                            />\n                        )}\n                    />\n                </FormItem>\n                <FormItem\n                    label=\"User Name\"\n                    invalid={Boolean(errors.lastName)}\n                    errorMessage={errors.lastName?.message}\n                >\n                    <Controller\n                        name=\"lastName\"\n                        control={control}\n                        render={({ field }) => (\n                            <Input\n                                type=\"text\"\n                                autoComplete=\"off\"\n                                placeholder=\"Last Name\"\n                                {...field}\n                            />\n                        )}\n                    />\n                </FormItem>\n            </div>\n            <FormItem\n                label=\"Email\"\n                invalid={Boolean(errors.email)}\n                errorMessage={errors.email?.message}\n            >\n                <Controller\n                    name=\"email\"\n                    control={control}\n                    render={({ field }) => (\n                        <Input\n                            type=\"email\"\n                            autoComplete=\"off\"\n                            placeholder=\"Email\"\n                            {...field}\n                        />\n                    )}\n                />\n            </FormItem>\n            <div className=\"flex items-end gap-4 w-full\">\n                <FormItem\n                    invalid={\n                        Boolean(errors.phoneNumber) || Boolean(errors.dialCode)\n                    }\n                >\n                    <label className=\"form-label mb-2\">Phone number</label>\n                    <Controller\n                        name=\"dialCode\"\n                        control={control}\n                        render={({ field }) => (\n                            <Select<CountryOption>\n                                options={dialCodeList}\n                                {...field}\n                                className=\"w-[150px]\"\n                                components={{\n                                    Option: CustomSelectOption,\n                                    Control: CustomControl,\n                                }}\n                                placeholder=\"\"\n                                value={dialCodeList.filter(\n                                    (option) => option.dialCode === field.value,\n                                )}\n                                onChange={(option) =>\n                                    field.onChange(option?.dialCode)\n                                }\n                            />\n                        )}\n                    />\n                </FormItem>\n                <FormItem\n                    className=\"w-full\"\n                    invalid={\n                        Boolean(errors.phoneNumber) || Boolean(errors.dialCode)\n                    }\n                    errorMessage={errors.phoneNumber?.message}\n                >\n                    <Controller\n                        name=\"phoneNumber\"\n                        control={control}\n                        render={({ field }) => (\n                            <NumericInput\n                                autoComplete=\"off\"\n                                placeholder=\"Phone Number\"\n                                value={field.value}\n                                onChange={field.onChange}\n                                onBlur={field.onBlur}\n                            />\n                        )}\n                    />\n                </FormItem>\n            </div>\n        </Card>\n    )\n}\n\nexport default OverviewSection\n"],"names":["Control","components","CustomSelectOption","props","jsx","DefaultOption","data","jsxs","Avatar","CustomControl","children","selected","OverviewSection","control","errors","dialCodeList","useMemo","countryList","country","Card","FormItem","Controller","field","Input","Select","option","NumericInput"],"mappings":"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"}

package/dist/@ecme/views/concepts/customers/CustomerForm/ProfileImageSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProfileImageSection.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerForm/ProfileImageSection.tsx"],"sourcesContent":["import Card from '@/components/ui/Card'\nimport Avatar from '@/components/ui/Avatar'\nimport Upload from '@/components/ui/Upload'\nimport { Button } from '@/components/ui'\nimport DoubleSidedImage from '@/components/shared/DoubleSidedImage'\nimport { Controller } from 'react-hook-form'\nimport { HiOutlineUser } from 'react-icons/hi'\nimport type { FormSectionBaseProps } from './types'\n\ntype ProfileImageSectionProps = FormSectionBaseProps\n\nconst ProfileImage = ({ control }: ProfileImageSectionProps) => {\n    const beforeUpload = (files: FileList | null) => {\n        let valid: string | boolean = true\n\n        const allowedFileType = ['image/jpeg', 'image/png']\n        if (files) {\n            for (const file of files) {\n                if (!allowedFileType.includes(file.type)) {\n                    valid = 'Please upload a .jpeg or .png file!'\n                }\n            }\n        }\n\n        return valid\n    }\n\n    return (\n        <Card>\n            <h4 className=\"mb-6\">Image</h4>\n            <div className=\"bg-gray-100 dark:bg-gray-700 rounded-lg text-center p-4\">\n                <div className=\"text-center\">\n                    <Controller\n                        name=\"img\"\n                        control={control}\n                        render={({ field }) => (\n                            <>\n                                <div className=\"flex items-center justify-center\">\n                                    {field.value ? (\n                                        <Avatar\n                                            size={100}\n                                            className=\"border-4 border-white bg-gray-100 text-gray-300 shadow-lg\"\n                                            icon={<HiOutlineUser />}\n                                            src={field.value}\n                                        />\n                                    ) : (\n                                        <DoubleSidedImage\n                                            src=\"/img/others/upload.png\"\n                                            darkModeSrc=\"/img/others/upload-dark.png\"\n                                            alt=\"Upload image\"\n                                        />\n                                    )}\n                                </div>\n                                <Upload\n                                    showList={false}\n                                    uploadLimit={1}\n                                    beforeUpload={beforeUpload}\n                                    onChange={(files) => {\n                                        if (files.length > 0) {\n                                            field.onChange(\n                                                URL.createObjectURL(files[0]),\n                                            )\n                                        }\n                                    }}\n                                >\n                                    <Button\n                                        variant=\"solid\"\n                                        className=\"mt-4\"\n                                        type=\"button\"\n                                    >\n                                        Upload Image\n                                    </Button>\n                                </Upload>\n                            </>\n                        )}\n                    />\n                </div>\n            </div>\n        </Card>\n    )\n}\n\nexport default ProfileImage\n"],"names":["ProfileImage","control","beforeUpload","files","valid","allowedFileType","file","Card","jsx","Controller","field","jsxs","Fragment","Avatar","HiOutlineUser","DoubleSidedImage","Upload","Button"],"mappings":";;;;;;;;;;;AAWA,MAAMA,IAAe,CAAC,EAAE,SAAAC,QAAwC;AAC5D,QAAMC,IAAe,CAACC,MAA2B;AAC7C,QAAIC,IAA0B;AAE9B,UAAMC,IAAkB,CAAC,cAAc,WAAW;AAClD,QAAIF;AACA,iBAAWG,KAAQH;AACf,QAAKE,EAAgB,SAASC,EAAK,IAAI,MACnCF,IAAQ;AAKpB,WAAOA;AAAA,EACX;AAEA,2BACKG,GAAA,EACG,UAAA;AAAA,IAAA,gBAAAC,EAAC,MAAA,EAAG,WAAU,QAAO,UAAA,SAAK;AAAA,sBACzB,OAAA,EAAI,WAAU,2DACX,UAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,eACX,UAAA,gBAAAA;AAAA,MAACC;AAAA,MAAA;AAAA,QACG,MAAK;AAAA,QACL,SAAAR;AAAA,QACA,QAAQ,CAAC,EAAE,OAAAS,EAAA,MACP,gBAAAC,EAAAC,GAAA,EACI,UAAA;AAAA,UAAA,gBAAAJ,EAAC,OAAA,EAAI,WAAU,oCACV,UAAAE,EAAM,QACH,gBAAAF;AAAA,YAACK;AAAA,YAAA;AAAA,cACG,MAAM;AAAA,cACN,WAAU;AAAA,cACV,wBAAOC,GAAA,EAAc;AAAA,cACrB,KAAKJ,EAAM;AAAA,YAAA;AAAA,UAAA,IAGf,gBAAAF;AAAA,YAACO;AAAA,YAAA;AAAA,cACG,KAAI;AAAA,cACJ,aAAY;AAAA,cACZ,KAAI;AAAA,YAAA;AAAA,UAAA,GAGhB;AAAA,UACA,gBAAAP;AAAA,YAACQ;AAAA,YAAA;AAAA,cACG,UAAU;AAAA,cACV,aAAa;AAAA,cACb,cAAAd;AAAA,cACA,UAAU,CAACC,MAAU;AACjB,gBAAIA,EAAM,SAAS,KACfO,EAAM;AAAA,kBACF,IAAI,gBAAgBP,EAAM,CAAC,CAAC;AAAA,gBAAA;AAAA,cAGxC;AAAA,cAEA,UAAA,gBAAAK;AAAA,gBAACS;AAAA,gBAAA;AAAA,kBACG,SAAQ;AAAA,kBACR,WAAU;AAAA,kBACV,MAAK;AAAA,kBACR,UAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,YAED;AAAA,UAAA;AAAA,QACJ,EAAA,CACJ;AAAA,MAAA;AAAA,IAAA,GAGZ,EAAA,CACJ;AAAA,EAAA,GACJ;AAER;"}
+{"version":3,"file":"ProfileImageSection.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerForm/ProfileImageSection.tsx"],"sourcesContent":["import Card from '@/components/ui/Card'\nimport Avatar from '@/components/ui/Avatar'\nimport Upload from '@/components/ui/Upload'\nimport { Button } from '@/components/ui'\nimport DoubleSidedImage from '@/components/shared/DoubleSidedImage'\nimport { Controller } from 'react-hook-form'\nimport { HiOutlineUser } from 'react-icons/hi'\nimport type { FormSectionBaseProps } from './types'\n\ntype ProfileImageSectionProps = FormSectionBaseProps\n\nconst ProfileImage = ({ control }: ProfileImageSectionProps) => {\n    const beforeUpload = (files: FileList | null) => {\n        let valid: string | boolean = true\n\n        const allowedFileType = ['image/jpeg', 'image/png']\n        if (files) {\n            for (const file of files) {\n                if (!allowedFileType.includes(file.type)) {\n                    valid = 'Please upload a .jpeg or .png file!'\n                }\n            }\n        }\n\n        return valid\n    }\n\n    return (\n        <Card>\n            <h4 className=\"mb-6\">Image</h4>\n            <div className=\"bg-gray-100 dark:bg-gray-700 rounded-lg text-center p-4\">\n                <div className=\"text-center\">\n                    <Controller\n                        name=\"img\"\n                        control={control}\n                        render={({ field }) => (\n                            <>\n                                <div className=\"flex items-center justify-center\">\n                                    {field.value ? (\n                                        <Avatar\n                                            size={100}\n                                            className=\"border-4 border-white bg-gray-100 text-gray-300 shadow-lg\"\n                                            icon={<HiOutlineUser />}\n                                            src={field.value}\n                                        />\n                                    ) : (\n                                        <DoubleSidedImage\n                                            src=\"/img/others/upload.png\"\n                                            darkModeSrc=\"/img/others/upload-dark.png\"\n                                            alt=\"Upload image\"\n                                        />\n                                    )}\n                                </div>\n                                <Upload\n                                    showList={false}\n                                    uploadLimit={1}\n                                    beforeUpload={beforeUpload}\n                                    onChange={(files) => {\n                                        if (files.length > 0) {\n                                            field.onChange(\n                                                URL.createObjectURL(files[0]),\n                                            )\n                                        }\n                                    }}\n                                >\n                                    <Button\n                                        variant=\"solid\"\n                                        className=\"mt-4\"\n                                        type=\"button\"\n                                    >\n                                        Upload Image\n                                    </Button>\n                                </Upload>\n                            </>\n                        )}\n                    />\n                </div>\n            </div>\n        </Card>\n    )\n}\n\nexport default ProfileImage\n"],"names":["ProfileImage","control","beforeUpload","files","valid","allowedFileType","file","Card","jsx","Controller","field","jsxs","Fragment","Avatar","HiOutlineUser","DoubleSidedImage","Upload","Button"],"mappings":";;;;;;;;;;;AAWA,MAAMA,IAAe,CAAC,EAAE,SAAAC,QAAwC;AACtD,QAAAC,IAAe,CAACC,MAA2B;AAC7C,QAAIC,IAA0B;AAExB,UAAAC,IAAkB,CAAC,cAAc,WAAW;AAClD,QAAIF;AACA,iBAAWG,KAAQH;AACf,QAAKE,EAAgB,SAASC,EAAK,IAAI,MAC3BF,IAAA;AAKb,WAAAA;AAAA,EACX;AAEA,2BACKG,GACG,EAAA,UAAA;AAAA,IAAC,gBAAAC,EAAA,MAAA,EAAG,WAAU,QAAO,UAAK,SAAA;AAAA,sBACzB,OAAI,EAAA,WAAU,2DACX,UAAC,gBAAAA,EAAA,OAAA,EAAI,WAAU,eACX,UAAA,gBAAAA;AAAA,MAACC;AAAA,MAAA;AAAA,QACG,MAAK;AAAA,QACL,SAAAR;AAAA,QACA,QAAQ,CAAC,EAAE,OAAAS,EAAA,MAEH,gBAAAC,EAAAC,GAAA,EAAA,UAAA;AAAA,UAAA,gBAAAJ,EAAC,OAAI,EAAA,WAAU,oCACV,UAAAE,EAAM,QACH,gBAAAF;AAAA,YAACK;AAAA,YAAA;AAAA,cACG,MAAM;AAAA,cACN,WAAU;AAAA,cACV,wBAAOC,GAAc,EAAA;AAAA,cACrB,KAAKJ,EAAM;AAAA,YAAA;AAAA,UAAA,IAGf,gBAAAF;AAAA,YAACO;AAAA,YAAA;AAAA,cACG,KAAI;AAAA,cACJ,aAAY;AAAA,cACZ,KAAI;AAAA,YAAA;AAAA,UAAA,GAGhB;AAAA,UACA,gBAAAP;AAAA,YAACQ;AAAA,YAAA;AAAA,cACG,UAAU;AAAA,cACV,aAAa;AAAA,cACb,cAAAd;AAAA,cACA,UAAU,CAACC,MAAU;AACb,gBAAAA,EAAM,SAAS,KACTO,EAAA;AAAA,kBACF,IAAI,gBAAgBP,EAAM,CAAC,CAAC;AAAA,gBAChC;AAAA,cAER;AAAA,cAEA,UAAA,gBAAAK;AAAA,gBAACS;AAAA,gBAAA;AAAA,kBACG,SAAQ;AAAA,kBACR,WAAU;AAAA,kBACV,MAAK;AAAA,kBACR,UAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,YAED;AAAA,UAAA;AAAA,QACJ,EACJ,CAAA;AAAA,MAAA;AAAA,OAGZ,EACJ,CAAA;AAAA,EAAA,GACJ;AAER;"}

package/dist/@ecme/views/concepts/customers/CustomerForm/TagsSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"TagsSection.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerForm/TagsSection.tsx"],"sourcesContent":["import Card from '@/components/ui/Card'\nimport Select from '@/components/ui/Select'\nimport { Controller } from 'react-hook-form'\nimport CreatableSelect from 'react-select/creatable'\nimport type { FormSectionBaseProps } from './types'\n\ntype TagsSectionProps = FormSectionBaseProps\n\nconst defaultOptions = [\n    { value: 'frequentShoppers', label: 'Frequent Shoppers' },\n    { value: 'inactiveCustomers', label: 'Inactive' },\n    { value: 'newCustomers', label: 'New' },\n]\n\nconst TagsSection = ({ control }: TagsSectionProps) => {\n    return (\n        <Card>\n            <h4 className=\"mb-2\">Customer Tags</h4>\n            <div className=\"mt-6\">\n                <Controller\n                    name=\"tags\"\n                    control={control}\n                    render={({ field }) => (\n                        <Select\n                            isMulti\n                            isClearable\n                            placeholder=\"Add tags for customer...\"\n                            componentAs={CreatableSelect}\n                            options={defaultOptions}\n                            onChange={(option) => field.onChange(option)}\n                        />\n                    )}\n                />\n            </div>\n        </Card>\n    )\n}\n\nexport default TagsSection\n"],"names":["defaultOptions","TagsSection","control","Card","jsx","Controller","field","Select","CreatableSelect","option"],"mappings":";;;;;;;AAQA,MAAMA,IAAiB;AAAA,EACnB,EAAE,OAAO,oBAAoB,OAAO,oBAAA;AAAA,EACpC,EAAE,OAAO,qBAAqB,OAAO,WAAA;AAAA,EACrC,EAAE,OAAO,gBAAgB,OAAO,MAAA;AACpC,GAEMC,IAAc,CAAC,EAAE,SAAAC,0BAEdC,GAAA,EACG,UAAA;AAAA,EAAA,gBAAAC,EAAC,MAAA,EAAG,WAAU,QAAO,UAAA,iBAAa;AAAA,EAClC,gBAAAA,EAAC,OAAA,EAAI,WAAU,QACX,UAAA,gBAAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,MAAK;AAAA,MACL,SAAAH;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAI,EAAA,MACP,gBAAAF;AAAA,QAACG;AAAA,QAAA;AAAA,UACG,SAAO;AAAA,UACP,aAAW;AAAA,UACX,aAAY;AAAA,UACZ,aAAaC;AAAA,UACb,SAASR;AAAA,UACT,UAAU,CAACS,MAAWH,EAAM,SAASG,CAAM;AAAA,QAAA;AAAA,MAAA;AAAA,IAC/C;AAAA,EAAA,EAER,CACJ;AAAA,GACJ;"}
+{"version":3,"file":"TagsSection.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerForm/TagsSection.tsx"],"sourcesContent":["import Card from '@/components/ui/Card'\nimport Select from '@/components/ui/Select'\nimport { Controller } from 'react-hook-form'\nimport CreatableSelect from 'react-select/creatable'\nimport type { FormSectionBaseProps } from './types'\n\ntype TagsSectionProps = FormSectionBaseProps\n\nconst defaultOptions = [\n    { value: 'frequentShoppers', label: 'Frequent Shoppers' },\n    { value: 'inactiveCustomers', label: 'Inactive' },\n    { value: 'newCustomers', label: 'New' },\n]\n\nconst TagsSection = ({ control }: TagsSectionProps) => {\n    return (\n        <Card>\n            <h4 className=\"mb-2\">Customer Tags</h4>\n            <div className=\"mt-6\">\n                <Controller\n                    name=\"tags\"\n                    control={control}\n                    render={({ field }) => (\n                        <Select\n                            isMulti\n                            isClearable\n                            placeholder=\"Add tags for customer...\"\n                            componentAs={CreatableSelect}\n                            options={defaultOptions}\n                            onChange={(option) => field.onChange(option)}\n                        />\n                    )}\n                />\n            </div>\n        </Card>\n    )\n}\n\nexport default TagsSection\n"],"names":["defaultOptions","TagsSection","control","Card","jsx","Controller","field","Select","CreatableSelect","option"],"mappings":";;;;;;;AAQA,MAAMA,IAAiB;AAAA,EACnB,EAAE,OAAO,oBAAoB,OAAO,oBAAoB;AAAA,EACxD,EAAE,OAAO,qBAAqB,OAAO,WAAW;AAAA,EAChD,EAAE,OAAO,gBAAgB,OAAO,MAAM;AAC1C,GAEMC,IAAc,CAAC,EAAE,SAAAC,0BAEdC,GACG,EAAA,UAAA;AAAA,EAAC,gBAAAC,EAAA,MAAA,EAAG,WAAU,QAAO,UAAa,iBAAA;AAAA,EAClC,gBAAAA,EAAC,OAAI,EAAA,WAAU,QACX,UAAA,gBAAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,MAAK;AAAA,MACL,SAAAH;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAI,EAAA,MACP,gBAAAF;AAAA,QAACG;AAAA,QAAA;AAAA,UACG,SAAO;AAAA,UACP,aAAW;AAAA,UACX,aAAY;AAAA,UACZ,aAAaC;AAAA,UACb,SAASR;AAAA,UACT,UAAU,CAACS,MAAWH,EAAM,SAASG,CAAM;AAAA,QAAA;AAAA,MAAA;AAAA,IAC/C;AAAA,EAAA,EAGZ,CAAA;AAAA,GACJ;"}

package/dist/@ecme/views/concepts/customers/CustomerList/CustomerList.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomerList.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerList/CustomerList.tsx"],"sourcesContent":["import AdaptiveCard from '@/components/shared/AdaptiveCard'\nimport Container from '@/components/shared/Container'\nimport CustomerListTable from './components/CustomerListTable'\nimport CustomerListActionTools from './components/CustomerListActionTools'\nimport CustomersListTableTools from './components/CustomersListTableTools'\nimport CustomerListSelected from './components/CustomerListSelected'\n\nconst CustomerList = () => {\n    return (\n        <>\n            <Container>\n                <AdaptiveCard>\n                    <div className=\"flex flex-col gap-4\">\n                        <div className=\"flex flex-col md:flex-row md:items-center md:justify-between gap-2\">\n                            <h3>Customers</h3>\n                            <CustomerListActionTools />\n                        </div>\n                        <CustomersListTableTools />\n                        <CustomerListTable />\n                    </div>\n                </AdaptiveCard>\n            </Container>\n            <CustomerListSelected />\n        </>\n    )\n}\n\nexport default CustomerList\n"],"names":["CustomerList","jsxs","Fragment","jsx","Container","AdaptiveCard","CustomerListActionTools","CustomersListTableTools","CustomerListTable","CustomerListSelected"],"mappings":";;;;;;;AAOA,MAAMA,IAAe,MAEb,gBAAAC,EAAAC,GAAA,EACI,UAAA;AAAA,EAAA,gBAAAC,EAACC,KACG,UAAA,gBAAAD,EAACE,GAAA,EACG,UAAA,gBAAAJ,EAAC,OAAA,EAAI,WAAU,uBACX,UAAA;AAAA,IAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,sEACX,UAAA;AAAA,MAAA,gBAAAE,EAAC,QAAG,UAAA,YAAA,CAAS;AAAA,wBACZG,GAAA,CAAA,CAAwB;AAAA,IAAA,GAC7B;AAAA,sBACCC,GAAA,EAAwB;AAAA,sBACxBC,GAAA,CAAA,CAAkB;AAAA,EAAA,EAAA,CACvB,GACJ,GACJ;AAAA,oBACCC,GAAA,CAAA,CAAqB;AAAA,GAC1B;"}
+{"version":3,"file":"CustomerList.js","sources":["../../../../../../lib/@ecme/views/concepts/customers/CustomerList/CustomerList.tsx"],"sourcesContent":["import AdaptiveCard from '@/components/shared/AdaptiveCard'\nimport Container from '@/components/shared/Container'\nimport CustomerListTable from './components/CustomerListTable'\nimport CustomerListActionTools from './components/CustomerListActionTools'\nimport CustomersListTableTools from './components/CustomersListTableTools'\nimport CustomerListSelected from './components/CustomerListSelected'\n\nconst CustomerList = () => {\n    return (\n        <>\n            <Container>\n                <AdaptiveCard>\n                    <div className=\"flex flex-col gap-4\">\n                        <div className=\"flex flex-col md:flex-row md:items-center md:justify-between gap-2\">\n                            <h3>Customers</h3>\n                            <CustomerListActionTools />\n                        </div>\n                        <CustomersListTableTools />\n                        <CustomerListTable />\n                    </div>\n                </AdaptiveCard>\n            </Container>\n            <CustomerListSelected />\n        </>\n    )\n}\n\nexport default CustomerList\n"],"names":["CustomerList","jsxs","Fragment","jsx","Container","AdaptiveCard","CustomerListActionTools","CustomersListTableTools","CustomerListTable","CustomerListSelected"],"mappings":";;;;;;;AAOA,MAAMA,IAAe,MAGT,gBAAAC,EAAAC,GAAA,EAAA,UAAA;AAAA,EAAA,gBAAAC,EAACC,KACG,UAAC,gBAAAD,EAAAE,GAAA,EACG,UAAC,gBAAAJ,EAAA,OAAA,EAAI,WAAU,uBACX,UAAA;AAAA,IAAC,gBAAAA,EAAA,OAAA,EAAI,WAAU,sEACX,UAAA;AAAA,MAAA,gBAAAE,EAAC,QAAG,UAAS,YAAA,CAAA;AAAA,wBACZG,GAAwB,CAAA,CAAA;AAAA,IAAA,GAC7B;AAAA,sBACCC,GAAwB,EAAA;AAAA,sBACxBC,GAAkB,CAAA,CAAA;AAAA,EAAA,EACvB,CAAA,EACJ,CAAA,GACJ;AAAA,oBACCC,GAAqB,CAAA,CAAA;AAAA,GAC1B;"}

package/dist/@ecme/views/concepts/customers/CustomerList/components/CustomerListActionTools.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomerListActionTools.js","sources":["../../../../../../../lib/@ecme/views/concepts/customers/CustomerList/components/CustomerListActionTools.tsx"],"sourcesContent":["import Button from '@/components/ui/Button'\nimport { TbCloudDownload, TbUserPlus } from 'react-icons/tb'\nimport { useNavigate } from 'react-router-dom'\nimport useCustomerList from '../hooks/useCustomerList'\nimport { CSVLink } from 'react-csv'\n\nconst CustomerListActionTools = () => {\n    const navigate = useNavigate()\n\n    const { customerList } = useCustomerList()\n\n    return (\n        <div className=\"flex flex-col md:flex-row gap-3\">\n            <CSVLink\n                className=\"w-full\"\n                filename=\"customerList.csv\"\n                data={customerList}\n            >\n                <Button\n                    icon={<TbCloudDownload className=\"text-xl\" />}\n                    className=\"w-full\"\n                >\n                    Download\n                </Button>\n            </CSVLink>\n            <Button\n                variant=\"solid\"\n                icon={<TbUserPlus className=\"text-xl\" />}\n                onClick={() => navigate('/concepts/customers/customer-create')}\n            >\n                Add new\n            </Button>\n        </div>\n    )\n}\n\nexport default CustomerListActionTools\n"],"names":["CustomerListActionTools","navigate","useNavigate","customerList","useCustomerList","jsxs","jsx","CSVLink","Button","TbCloudDownload","TbUserPlus"],"mappings":";;;;;;;AAMA,MAAMA,IAA0B,MAAM;AAClC,QAAMC,IAAWC,EAAA,GAEX,EAAE,cAAAC,EAAA,IAAiBC,EAAA;AAEzB,SACI,gBAAAC,EAAC,OAAA,EAAI,WAAU,mCACX,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACG,WAAU;AAAA,QACV,UAAS;AAAA,QACT,MAAMJ;AAAA,QAEN,UAAA,gBAAAG;AAAA,UAACE;AAAA,UAAA;AAAA,YACG,MAAM,gBAAAF,EAACG,GAAA,EAAgB,WAAU,UAAA,CAAU;AAAA,YAC3C,WAAU;AAAA,YACb,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MAED;AAAA,IAAA;AAAA,IAEJ,gBAAAH;AAAA,MAACE;AAAA,MAAA;AAAA,QACG,SAAQ;AAAA,QACR,MAAM,gBAAAF,EAACI,GAAA,EAAW,WAAU,UAAA,CAAU;AAAA,QACtC,SAAS,MAAMT,EAAS,qCAAqC;AAAA,QAChE,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAED,GACJ;AAER;"}
+{"version":3,"file":"CustomerListActionTools.js","sources":["../../../../../../../lib/@ecme/views/concepts/customers/CustomerList/components/CustomerListActionTools.tsx"],"sourcesContent":["import Button from '@/components/ui/Button'\nimport { TbCloudDownload, TbUserPlus } from 'react-icons/tb'\nimport { useNavigate } from 'react-router-dom'\nimport useCustomerList from '../hooks/useCustomerList'\nimport { CSVLink } from 'react-csv'\n\nconst CustomerListActionTools = () => {\n    const navigate = useNavigate()\n\n    const { customerList } = useCustomerList()\n\n    return (\n        <div className=\"flex flex-col md:flex-row gap-3\">\n            <CSVLink\n                className=\"w-full\"\n                filename=\"customerList.csv\"\n                data={customerList}\n            >\n                <Button\n                    icon={<TbCloudDownload className=\"text-xl\" />}\n                    className=\"w-full\"\n                >\n                    Download\n                </Button>\n            </CSVLink>\n            <Button\n                variant=\"solid\"\n                icon={<TbUserPlus className=\"text-xl\" />}\n                onClick={() => navigate('/concepts/customers/customer-create')}\n            >\n                Add new\n            </Button>\n        </div>\n    )\n}\n\nexport default CustomerListActionTools\n"],"names":["CustomerListActionTools","navigate","useNavigate","customerList","useCustomerList","jsxs","jsx","CSVLink","Button","TbCloudDownload","TbUserPlus"],"mappings":";;;;;;;AAMA,MAAMA,IAA0B,MAAM;AAClC,QAAMC,IAAWC,EAAY,GAEvB,EAAE,cAAAC,EAAa,IAAIC,EAAgB;AAGrC,SAAA,gBAAAC,EAAC,OAAI,EAAA,WAAU,mCACX,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACG,WAAU;AAAA,QACV,UAAS;AAAA,QACT,MAAMJ;AAAA,QAEN,UAAA,gBAAAG;AAAA,UAACE;AAAA,UAAA;AAAA,YACG,MAAM,gBAAAF,EAACG,GAAgB,EAAA,WAAU,UAAU,CAAA;AAAA,YAC3C,WAAU;AAAA,YACb,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MAED;AAAA,IACJ;AAAA,IACA,gBAAAH;AAAA,MAACE;AAAA,MAAA;AAAA,QACG,SAAQ;AAAA,QACR,MAAM,gBAAAF,EAACI,GAAW,EAAA,WAAU,UAAU,CAAA;AAAA,QACtC,SAAS,MAAMT,EAAS,qCAAqC;AAAA,QAChE,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAED,GACJ;AAER;"}

package/dist/@ecme/views/concepts/customers/CustomerList/components/CustomerListSearch.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomerListSearch.js","sources":["../../../../../../../lib/@ecme/views/concepts/customers/CustomerList/components/CustomerListSearch.tsx"],"sourcesContent":["import DebounceInput from '@/components/shared/DebounceInput'\nimport { TbSearch } from 'react-icons/tb'\nimport { Ref } from 'react'\n\ntype CustomerListSearchProps = {\n    onInputChange: (value: string) => void\n    ref?: Ref<HTMLInputElement>\n}\n\nconst CustomerListSearch = (props: CustomerListSearchProps) => {\n    const { onInputChange, ref } = props\n\n    return (\n        <DebounceInput\n            ref={ref}\n            placeholder=\"Quick search...\"\n            suffix={<TbSearch className=\"text-lg\" />}\n            onChange={(e) => onInputChange(e.target.value)}\n        />\n    )\n}\n\nexport default CustomerListSearch\n"],"names":["CustomerListSearch","props","onInputChange","ref","jsx","DebounceInput","TbSearch","e"],"mappings":";;;AASA,MAAMA,IAAqB,CAACC,MAAmC;AAC3D,QAAM,EAAE,eAAAC,GAAe,KAAAC,EAAA,IAAQF;AAE/B,SACI,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,KAAAF;AAAA,MACA,aAAY;AAAA,MACZ,QAAQ,gBAAAC,EAACE,GAAA,EAAS,WAAU,UAAA,CAAU;AAAA,MACtC,UAAU,CAACC,MAAML,EAAcK,EAAE,OAAO,KAAK;AAAA,IAAA;AAAA,EAAA;AAGzD;"}
+{"version":3,"file":"CustomerListSearch.js","sources":["../../../../../../../lib/@ecme/views/concepts/customers/CustomerList/components/CustomerListSearch.tsx"],"sourcesContent":["import DebounceInput from '@/components/shared/DebounceInput'\nimport { TbSearch } from 'react-icons/tb'\nimport { Ref } from 'react'\n\ntype CustomerListSearchProps = {\n    onInputChange: (value: string) => void\n    ref?: Ref<HTMLInputElement>\n}\n\nconst CustomerListSearch = (props: CustomerListSearchProps) => {\n    const { onInputChange, ref } = props\n\n    return (\n        <DebounceInput\n            ref={ref}\n            placeholder=\"Quick search...\"\n            suffix={<TbSearch className=\"text-lg\" />}\n            onChange={(e) => onInputChange(e.target.value)}\n        />\n    )\n}\n\nexport default CustomerListSearch\n"],"names":["CustomerListSearch","props","onInputChange","ref","jsx","DebounceInput","TbSearch","e"],"mappings":";;;AASM,MAAAA,IAAqB,CAACC,MAAmC;AACrD,QAAA,EAAE,eAAAC,GAAe,KAAAC,EAAA,IAAQF;AAG3B,SAAA,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,KAAAF;AAAA,MACA,aAAY;AAAA,MACZ,QAAQ,gBAAAC,EAACE,GAAS,EAAA,WAAU,UAAU,CAAA;AAAA,MACtC,UAAU,CAACC,MAAML,EAAcK,EAAE,OAAO,KAAK;AAAA,IAAA;AAAA,EACjD;AAER;"}