@orbe-agro/client-core 5.6.262 → 5.6.263

package/dist/@ecme/components/template/Header.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.stories.js","sources":["../../../../lib/@ecme/components/template/Header.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from '@storybook/react'\nimport Header from './Header'\n\nconst meta = {\n    title: '@ecme/Template/Header',\n    component: Header,\n    parameters: {\n        layout: 'fullscreen',\n    },\n    tags: ['autodocs'],\n    argTypes: {\n        container: {\n            control: 'boolean',\n        },\n        className: {\n            control: 'text',\n        },\n        wrapperClass: {\n            control: 'text',\n        },\n    },\n} satisfies Meta<typeof Header>\n\nexport default meta\n\ntype TStory = StoryObj<typeof meta>\n\nexport const Default: TStory = {\n    args: {\n        container: false,\n        className: '',\n        wrapperClass: '',\n    },\n    render: (args) => (\n        <Header\n            {...args}\n            headerStart={\n                <div className=\"px-4 text-sm font-semibold\">Minha Marca</div>\n            }\n            headerMiddle={<div className=\"text-sm\">Área central</div>}\n            headerEnd={\n                <div className=\"px-4 text-sm text-gray-600\">Usuário</div>\n            }\n        />\n    ),\n}\n"],"names":[],"mappings":";;AAGA,MAAM,OAAO;AAAA,EACT,OAAO;AAAA,EACP,WAAW;AAAA,EACX,YAAY;AAAA,IACR,QAAQ;AAAA,EAAA;AAAA,EAEZ,MAAM,CAAC,UAAU;AAAA,EACjB,UAAU;AAAA,IACN,WAAW;AAAA,MACP,SAAS;AAAA,IAAA;AAAA,IAEb,WAAW;AAAA,MACP,SAAS;AAAA,IAAA;AAAA,IAEb,cAAc;AAAA,MACV,SAAS;AAAA,IAAA;AAAA,EACb;AAER;AAMO,MAAM,UAAkB;AAAA,EAC3B,MAAM;AAAA,IACF,WAAW;AAAA,IACX,WAAW;AAAA,IACX,cAAc;AAAA,EAAA;AAAA,EAElB,QAAQ,CAAC,SACL;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAG;AAAA,MACJ,aACI,oBAAC,OAAA,EAAI,WAAU,8BAA6B,UAAA,eAAW;AAAA,MAE3D,cAAc,oBAAC,OAAA,EAAI,WAAU,WAAU,UAAA,gBAAY;AAAA,MACnD,WACI,oBAAC,OAAA,EAAI,WAAU,8BAA6B,UAAA,UAAA,CAAO;AAAA,IAAA;AAAA,EAAA;AAInE;"}
+{"version":3,"file":"Header.stories.js","sources":["../../../../lib/@ecme/components/template/Header.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from '@storybook/react'\nimport Header from './Header'\n\nconst meta: Meta<typeof Header> = {\n    title: '@ecme/Template/Header',\n    component: Header,\n    parameters: {\n        layout: 'fullscreen',\n    },\n    tags: ['autodocs'],\n    argTypes: {\n        container: {\n            control: 'boolean',\n        },\n        className: {\n            control: 'text',\n        },\n        wrapperClass: {\n            control: 'text',\n        },\n    },\n}\n\nexport default meta\n\ntype TStory = StoryObj<typeof meta>\n\nexport const Default: TStory = {\n    args: {\n        container: false,\n        className: '',\n        wrapperClass: '',\n    },\n    render: (args) => (\n        <Header\n            {...args}\n            headerStart={\n                <div className=\"px-4 text-sm font-semibold\">Minha Marca</div>\n            }\n            headerMiddle={<div className=\"text-sm\">Área central</div>}\n            headerEnd={\n                <div className=\"px-4 text-sm text-gray-600\">Usuário</div>\n            }\n        />\n    ),\n}\n"],"names":[],"mappings":";;AAGA,MAAM,OAA4B;AAAA,EAC9B,OAAO;AAAA,EACP,WAAW;AAAA,EACX,YAAY;AAAA,IACR,QAAQ;AAAA,EAAA;AAAA,EAEZ,MAAM,CAAC,UAAU;AAAA,EACjB,UAAU;AAAA,IACN,WAAW;AAAA,MACP,SAAS;AAAA,IAAA;AAAA,IAEb,WAAW;AAAA,MACP,SAAS;AAAA,IAAA;AAAA,IAEb,cAAc;AAAA,MACV,SAAS;AAAA,IAAA;AAAA,EACb;AAER;AAMO,MAAM,UAAkB;AAAA,EAC3B,MAAM;AAAA,IACF,WAAW;AAAA,IACX,WAAW;AAAA,IACX,cAAc;AAAA,EAAA;AAAA,EAElB,QAAQ,CAAC,SACL;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAG;AAAA,MACJ,aACI,oBAAC,OAAA,EAAI,WAAU,8BAA6B,UAAA,eAAW;AAAA,MAE3D,cAAc,oBAAC,OAAA,EAAI,WAAU,WAAU,UAAA,gBAAY;AAAA,MACnD,WACI,oBAAC,OAAA,EAAI,WAAU,8BAA6B,UAAA,UAAA,CAAO;AAAA,IAAA;AAAA,EAAA;AAInE;"}

package/dist/@ecme/components/template/Notification/Notification.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { useState, useEffect, useRef } from "react";
+import { useState, useRef } from "react";
 import classNames from "classnames";
 import withHeaderItem from "../../../utils/hoc/withHeaderItem.js";
 import { Dropdown } from "../../ui/Dropdown/index.js";
@@ -38,9 +38,6 @@ const _Notification = ({ className }) => {
       setNoResult(true);
     }
   };
-  useEffect(() => {
-    getNotificationCount();
-  }, []);
   const onNotificationOpen = async () => {
     if (notificationList.length === 0) {
       setLoading(true);

package/dist/@ecme/components/template/Notification/Notification.js.map

@@ -1 +1 @@
-{"version":3,"file":"Notification.js","sources":["../../../../../lib/@ecme/components/template/Notification/Notification.tsx"],"sourcesContent":["import { useEffect, useState, useRef } from 'react'\nimport classNames from 'classnames'\nimport withHeaderItem from '@/utils/hoc/withHeaderItem'\nimport Dropdown from '@/components/ui/Dropdown'\nimport ScrollBar from '@/components/ui/ScrollBar'\nimport Spinner from '@/components/ui/Spinner'\nimport Badge from '@/components/ui/Badge'\nimport Button from '@/components/ui/Button'\nimport Tooltip from '@/components/ui/Tooltip'\nimport NotificationAvatar from './NotificationAvatar'\nimport NotificationToggle from './NotificationToggle'\nimport { HiOutlineMailOpen } from 'react-icons/hi'\nimport {\n    apiGetNotificationList,\n    apiGetNotificationCount,\n} from '@/services/CommonService'\nimport isLastChild from '@/utils/isLastChild'\nimport useResponsive from '@/utils/hooks/useResponsive'\nimport { useNavigate } from 'react-router-dom'\n\nimport type { DropdownRef } from '@/components/ui/Dropdown'\nimport { useTranslation } from 'react-i18next'\n\ntype NotificationList = {\n    id: string\n    target: string\n    description: string\n    date: string\n    image: string\n    type: number\n    location: string\n    locationLabel: string\n    status: string\n    readed: boolean\n}\n\nconst notificationHeight = 'h-[280px]'\n\nconst _Notification = ({ className }: { className?: string }) => {\n    const [notificationList, setNotificationList] = useState<\n        NotificationList[]\n    >([])\n    const [unreadNotification, setUnreadNotification] = useState(false)\n    const [noResult, setNoResult] = useState(false)\n    const [loading, setLoading] = useState(false)\n\n    const { larger } = useResponsive()\n\n    const navigate = useNavigate()\n\n    const getNotificationCount = async () => {\n        const resp = await apiGetNotificationCount()\n        if (resp.count > 0) {\n            setNoResult(false)\n            setUnreadNotification(true)\n        } else {\n            setNoResult(true)\n        }\n    }\n\n    useEffect(() => {\n        getNotificationCount()\n    }, [])\n\n    const onNotificationOpen = async () => {\n        if (notificationList.length === 0) {\n            setLoading(true)\n            const resp = await apiGetNotificationList()\n            setLoading(false)\n            setNotificationList(resp)\n        }\n    }\n\n    const onMarkAllAsRead = () => {\n        const list = notificationList.map((item: NotificationList) => {\n            if (!item.readed) {\n                item.readed = true\n            }\n            return item\n        })\n        setNotificationList(list)\n        setUnreadNotification(false)\n    }\n\n    const onMarkAsRead = (id: string) => {\n        const list = notificationList.map((item) => {\n            if (item.id === id) {\n                item.readed = true\n            }\n            return item\n        })\n        setNotificationList(list)\n        const hasUnread = notificationList.some((item) => !item.readed)\n\n        if (!hasUnread) {\n            setUnreadNotification(false)\n        }\n    }\n\n    const notificationDropdownRef = useRef<DropdownRef>(null)\n\n    const handleViewAllActivity = () => {\n        navigate('/concepts/account/activity-log')\n        if (notificationDropdownRef.current) {\n            notificationDropdownRef.current.handleDropdownClose()\n        }\n    }\n\n    const { t } = useTranslation()\n\n    const isDisabled = true\n\n    return (\n        <Dropdown\n            disabled={isDisabled}\n            ref={notificationDropdownRef}\n            renderTitle={\n                <NotificationToggle\n                    dot={unreadNotification}\n                    className={isDisabled ? 'header-action-item-disabled' : className}\n                />\n            }\n            menuClass=\"min-w-[280px] md:min-w-[340px]\"\n            placement={larger.md ? 'bottom-end' : 'bottom'}\n            onOpen={onNotificationOpen}\n        >\n            <Dropdown.Item variant=\"header\">\n                <div className=\"mb-1 flex items-center justify-between px-2 dark:border-gray-700\">\n                    <h6>{t('base.layout.notifications.title')}</h6>\n                    <Tooltip\n                        title={t('base.layout.notifications.actions.readAll')}\n                    >\n                        <Button\n                            variant=\"plain\"\n                            shape=\"circle\"\n                            size=\"sm\"\n                            icon={<HiOutlineMailOpen className=\"text-xl\" />}\n                            onClick={onMarkAllAsRead}\n                        />\n                    </Tooltip>\n                </div>\n            </Dropdown.Item>\n            <ScrollBar\n                className={classNames('overflow-y-auto', notificationHeight)}\n            >\n                {notificationList.length > 0 &&\n                    notificationList.map((item, index) => (\n                        <div key={item.id}>\n                            <div\n                                className={`relative flex cursor-pointer rounded-xl px-4 py-3 hover:bg-gray-100 active:bg-gray-100 dark:hover:bg-gray-700`}\n                                onClick={() => onMarkAsRead(item.id)}\n                            >\n                                <div>\n                                    <NotificationAvatar {...item} />\n                                </div>\n                                <div className=\"mx-3\">\n                                    <div>\n                                        {item.target && (\n                                            <span className=\"heading-text font-semibold\">\n                                                {item.target}{' '}\n                                            </span>\n                                        )}\n                                        <span>{item.description}</span>\n                                    </div>\n                                    <span className=\"text-xs\">{item.date}</span>\n                                </div>\n                                <Badge\n                                    className=\"absolute top-4 mt-1.5 ltr:right-4 rtl:left-4\"\n                                    innerClass={`${\n                                        item.readed\n                                            ? 'bg-gray-300 dark:bg-gray-600'\n                                            : 'bg-primary'\n                                    } `}\n                                />\n                            </div>\n                            {!isLastChild(notificationList, index) ? (\n                                <div className=\"my-2 border-b border-gray-200 dark:border-gray-700\" />\n                            ) : (\n                                ''\n                            )}\n                        </div>\n                    ))}\n                {loading && (\n                    <div\n                        className={classNames(\n                            'flex items-center justify-center',\n                            notificationHeight,\n                        )}\n                    >\n                        <Spinner size={40} />\n                    </div>\n                )}\n                {noResult && notificationList.length === 0 && (\n                    <div\n                        className={classNames(\n                            'flex items-center justify-center',\n                            notificationHeight,\n                        )}\n                    >\n                        <div className=\"text-center\">\n                            <img\n                                className=\"mx-auto mb-2 max-w-[150px]\"\n                                src=\"/img/others/no-notification.png\"\n                                alt=\"no-notification\"\n                            />\n                            <h6 className=\"font-semibold\">No notifications!</h6>\n                            <p className=\"mt-1\">Please Try again later</p>\n                        </div>\n                    </div>\n                )}\n            </ScrollBar>\n            <Dropdown.Item variant=\"header\">\n                <div className=\"pt-4\">\n                    <Button\n                        block\n                        variant=\"solid\"\n                        onClick={handleViewAllActivity}\n                    >\n                        {t('base.layout.notifications.buttons.viewAll')}\n                    </Button>\n                </div>\n            </Dropdown.Item>\n        </Dropdown>\n    )\n}\n\nconst Notification = withHeaderItem(_Notification)\n\nexport default Notification\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Notification.js","sources":["../../../../../lib/@ecme/components/template/Notification/Notification.tsx"],"sourcesContent":["import { useEffect, useState, useRef } from 'react'\nimport classNames from 'classnames'\nimport withHeaderItem from '@/utils/hoc/withHeaderItem'\nimport Dropdown from '@/components/ui/Dropdown'\nimport ScrollBar from '@/components/ui/ScrollBar'\nimport Spinner from '@/components/ui/Spinner'\nimport Badge from '@/components/ui/Badge'\nimport Button from '@/components/ui/Button'\nimport Tooltip from '@/components/ui/Tooltip'\nimport NotificationAvatar from './NotificationAvatar'\nimport NotificationToggle from './NotificationToggle'\nimport { HiOutlineMailOpen } from 'react-icons/hi'\nimport {\n    apiGetNotificationList,\n    apiGetNotificationCount,\n} from '@/services/CommonService'\nimport isLastChild from '@/utils/isLastChild'\nimport useResponsive from '@/utils/hooks/useResponsive'\nimport { useNavigate } from 'react-router-dom'\n\nimport type { DropdownRef } from '@/components/ui/Dropdown'\nimport { useTranslation } from 'react-i18next'\n\ntype NotificationList = {\n    id: string\n    target: string\n    description: string\n    date: string\n    image: string\n    type: number\n    location: string\n    locationLabel: string\n    status: string\n    readed: boolean\n}\n\nconst notificationHeight = 'h-[280px]'\n\nconst _Notification = ({ className }: { className?: string }) => {\n    const [notificationList, setNotificationList] = useState<\n        NotificationList[]\n    >([])\n    const [unreadNotification, setUnreadNotification] = useState(false)\n    const [noResult, setNoResult] = useState(false)\n    const [loading, setLoading] = useState(false)\n\n    const { larger } = useResponsive()\n\n    const navigate = useNavigate()\n\n    const getNotificationCount = async () => {\n        const resp = await apiGetNotificationCount()\n        if (resp.count > 0) {\n            setNoResult(false)\n            setUnreadNotification(true)\n        } else {\n            setNoResult(true)\n        }\n    }\n\n/*     useEffect(() => {\n        getNotificationCount()\n    }, []) */\n\n    const onNotificationOpen = async () => {\n        if (notificationList.length === 0) {\n            setLoading(true)\n            const resp = await apiGetNotificationList()\n            setLoading(false)\n            setNotificationList(resp)\n        }\n    }\n\n    const onMarkAllAsRead = () => {\n        const list = notificationList.map((item: NotificationList) => {\n            if (!item.readed) {\n                item.readed = true\n            }\n            return item\n        })\n        setNotificationList(list)\n        setUnreadNotification(false)\n    }\n\n    const onMarkAsRead = (id: string) => {\n        const list = notificationList.map((item) => {\n            if (item.id === id) {\n                item.readed = true\n            }\n            return item\n        })\n        setNotificationList(list)\n        const hasUnread = notificationList.some((item) => !item.readed)\n\n        if (!hasUnread) {\n            setUnreadNotification(false)\n        }\n    }\n\n    const notificationDropdownRef = useRef<DropdownRef>(null)\n\n    const handleViewAllActivity = () => {\n        navigate('/concepts/account/activity-log')\n        if (notificationDropdownRef.current) {\n            notificationDropdownRef.current.handleDropdownClose()\n        }\n    }\n\n    const { t } = useTranslation()\n\n    const isDisabled = true\n\n    return (\n        <Dropdown\n            disabled={isDisabled}\n            ref={notificationDropdownRef}\n            renderTitle={\n                <NotificationToggle\n                    dot={unreadNotification}\n                    className={isDisabled ? 'header-action-item-disabled' : className}\n                />\n            }\n            menuClass=\"min-w-[280px] md:min-w-[340px]\"\n            placement={larger.md ? 'bottom-end' : 'bottom'}\n            onOpen={onNotificationOpen}\n        >\n            <Dropdown.Item variant=\"header\">\n                <div className=\"mb-1 flex items-center justify-between px-2 dark:border-gray-700\">\n                    <h6>{t('base.layout.notifications.title')}</h6>\n                    <Tooltip\n                        title={t('base.layout.notifications.actions.readAll')}\n                    >\n                        <Button\n                            variant=\"plain\"\n                            shape=\"circle\"\n                            size=\"sm\"\n                            icon={<HiOutlineMailOpen className=\"text-xl\" />}\n                            onClick={onMarkAllAsRead}\n                        />\n                    </Tooltip>\n                </div>\n            </Dropdown.Item>\n            <ScrollBar\n                className={classNames('overflow-y-auto', notificationHeight)}\n            >\n                {notificationList.length > 0 &&\n                    notificationList.map((item, index) => (\n                        <div key={item.id}>\n                            <div\n                                className={`relative flex cursor-pointer rounded-xl px-4 py-3 hover:bg-gray-100 active:bg-gray-100 dark:hover:bg-gray-700`}\n                                onClick={() => onMarkAsRead(item.id)}\n                            >\n                                <div>\n                                    <NotificationAvatar {...item} />\n                                </div>\n                                <div className=\"mx-3\">\n                                    <div>\n                                        {item.target && (\n                                            <span className=\"heading-text font-semibold\">\n                                                {item.target}{' '}\n                                            </span>\n                                        )}\n                                        <span>{item.description}</span>\n                                    </div>\n                                    <span className=\"text-xs\">{item.date}</span>\n                                </div>\n                                <Badge\n                                    className=\"absolute top-4 mt-1.5 ltr:right-4 rtl:left-4\"\n                                    innerClass={`${\n                                        item.readed\n                                            ? 'bg-gray-300 dark:bg-gray-600'\n                                            : 'bg-primary'\n                                    } `}\n                                />\n                            </div>\n                            {!isLastChild(notificationList, index) ? (\n                                <div className=\"my-2 border-b border-gray-200 dark:border-gray-700\" />\n                            ) : (\n                                ''\n                            )}\n                        </div>\n                    ))}\n                {loading && (\n                    <div\n                        className={classNames(\n                            'flex items-center justify-center',\n                            notificationHeight,\n                        )}\n                    >\n                        <Spinner size={40} />\n                    </div>\n                )}\n                {noResult && notificationList.length === 0 && (\n                    <div\n                        className={classNames(\n                            'flex items-center justify-center',\n                            notificationHeight,\n                        )}\n                    >\n                        <div className=\"text-center\">\n                            <img\n                                className=\"mx-auto mb-2 max-w-[150px]\"\n                                src=\"/img/others/no-notification.png\"\n                                alt=\"no-notification\"\n                            />\n                            <h6 className=\"font-semibold\">No notifications!</h6>\n                            <p className=\"mt-1\">Please Try again later</p>\n                        </div>\n                    </div>\n                )}\n            </ScrollBar>\n            <Dropdown.Item variant=\"header\">\n                <div className=\"pt-4\">\n                    <Button\n                        block\n                        variant=\"solid\"\n                        onClick={handleViewAllActivity}\n                    >\n                        {t('base.layout.notifications.buttons.viewAll')}\n                    </Button>\n                </div>\n            </Dropdown.Item>\n        </Dropdown>\n    )\n}\n\nconst Notification = withHeaderItem(_Notification)\n\nexport default Notification\n"],"names":[],"mappings":"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"}

package/dist/@ecme/components/template/OrbeAiWidget/OrbeAiChatDrawer.js

@@ -0,0 +1,121 @@
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { useState, useMemo, useEffect } from "react";
+import debounce from "lodash/debounce";
+import { AnimatePresence, motion } from "framer-motion";
+import { TbPlus, TbSearch } from "react-icons/tb";
+import { HiX } from "react-icons/hi";
+import "../../ui/Button/index.js";
+import ChatHistory from "../../../views/concepts/ai/Chat/components/ChatHistory.js";
+import { usGenerativeChatStore } from "../../../views/concepts/ai/Chat/store/generativeChatStore.js";
+import Button from "../../ui/Button/Button.js";
+const iconButtonClass = "flex h-8 w-8 items-center justify-center rounded-full text-gray-500 transition-colors hover:bg-gray-100 hover:text-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-200";
+const OrbeAiChatDrawer = ({ open, onClose }) => {
+  const [queryText, setQueryText] = useState("");
+  const { setSelectedConversation } = usGenerativeChatStore();
+  const debounceFn = useMemo(
+    () => debounce((e) => {
+      setQueryText(e.target.value);
+    }, 500),
+    []
+  );
+  useEffect(() => () => debounceFn.cancel(), [debounceFn]);
+  useEffect(() => {
+    if (!open) {
+      debounceFn.cancel();
+      setQueryText("");
+    }
+  }, [open, debounceFn]);
+  useEffect(() => {
+    if (!open) return;
+    const handleKeyDown = (event) => {
+      if (event.key === "Escape") onClose();
+    };
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
+  }, [open, onClose]);
+  const handleNewChat = () => {
+    setSelectedConversation("");
+    onClose();
+  };
+  return /* @__PURE__ */ jsx(AnimatePresence, { children: open && /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      motion.div,
+      {
+        "aria-hidden": true,
+        initial: { opacity: 0 },
+        animate: { opacity: 1 },
+        exit: { opacity: 0 },
+        transition: { duration: 0.2 },
+        className: "absolute inset-0 z-40 bg-black/40",
+        onClick: onClose
+      },
+      "orbe-ai-drawer-backdrop"
+    ),
+    /* @__PURE__ */ jsxs(
+      motion.aside,
+      {
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-label": "Conversas",
+        initial: { x: "-100%" },
+        animate: { x: 0 },
+        exit: { x: "-100%" },
+        transition: { duration: 0.2, ease: "easeOut" },
+        className: "absolute inset-y-0 left-0 z-50 flex w-[85%] max-w-[300px] flex-col border-r border-gray-200 bg-white shadow-xl dark:border-gray-700 dark:bg-gray-800",
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-b border-gray-200 px-4 py-3 dark:border-gray-700", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-semibold text-gray-900 dark:text-gray-100", children: "Conversas" }),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                className: iconButtonClass,
+                onClick: onClose,
+                "aria-label": "Fechar conversas",
+                children: /* @__PURE__ */ jsx(HiX, { size: 18 })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3 px-4 pt-4", children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                block: true,
+                variant: "solid",
+                size: "sm",
+                icon: /* @__PURE__ */ jsx(TbPlus, {}),
+                onClick: handleNewChat,
+                children: "Novo chat"
+              }
+            ),
+            /* @__PURE__ */ jsxs("label", { className: "flex h-9 items-center gap-2 rounded-lg border border-gray-200 px-3 focus-within:border-primary dark:border-gray-600", children: [
+              /* @__PURE__ */ jsx(TbSearch, { className: "shrink-0 text-lg text-gray-400" }),
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  className: "h-full min-w-0 flex-1 bg-transparent text-sm placeholder:text-gray-400 focus:outline-none heading-text",
+                  placeholder: "Buscar conversa",
+                  onChange: debounceFn
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "px-4 pb-1 pt-4 text-xs font-semibold uppercase tracking-wide text-gray-400", children: "Histórico" }),
+          /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1", children: /* @__PURE__ */ jsx(
+            ChatHistory,
+            {
+              queryText,
+              onClick: onClose,
+              dropdownFloatingClass: "!z-[10000]"
+            }
+          ) })
+        ]
+      },
+      "orbe-ai-drawer"
+    )
+  ] }) });
+};
+export {
+  OrbeAiChatDrawer as default
+};
+//# sourceMappingURL=OrbeAiChatDrawer.js.map

package/dist/@ecme/components/template/OrbeAiWidget/OrbeAiChatDrawer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrbeAiChatDrawer.js","sources":["../../../../../lib/@ecme/components/template/OrbeAiWidget/OrbeAiChatDrawer.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from 'react'\nimport debounce from 'lodash/debounce'\nimport { AnimatePresence, motion } from 'framer-motion'\nimport { TbPlus, TbSearch } from 'react-icons/tb'\nimport { HiX } from 'react-icons/hi'\nimport Button from '@/components/ui/Button'\nimport ChatHistory from '@/views/concepts/ai/Chat/components/ChatHistory'\nimport { usGenerativeChatStore } from '@/views/concepts/ai/Chat/store/generativeChatStore'\nimport type { ChangeEvent } from 'react'\n\ntype OrbeAiChatDrawerProps = {\n    open: boolean\n    onClose: () => void\n}\n\nconst iconButtonClass =\n    'flex h-8 w-8 items-center justify-center rounded-full text-gray-500 transition-colors hover:bg-gray-100 hover:text-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-200'\n\n/**\n * Drawer de conversas DENTRO do painel do widget.\n *\n * Não usa o Drawer do ui: ele é portalizado no body com overlay em z-30 e\n * abriria atrás do widget (z-40 / z-[9999]), cobrindo a página inteira. Aqui é\n * `absolute`, então fica recortado pelo painel em qualquer tamanho.\n */\nconst OrbeAiChatDrawer = ({ open, onClose }: OrbeAiChatDrawerProps) => {\n    const [queryText, setQueryText] = useState('')\n    const { setSelectedConversation } = usGenerativeChatStore()\n\n    // Memoizado: o store re-renderiza o drawer a cada token do streaming, e um\n    // debounce recriado a cada render perderia a busca pendente.\n    const debounceFn = useMemo(\n        () =>\n            debounce((e: ChangeEvent<HTMLInputElement>) => {\n                setQueryText(e.target.value)\n            }, 500),\n        [],\n    )\n\n    useEffect(() => () => debounceFn.cancel(), [debounceFn])\n\n    // O input desmonta ao fechar e volta vazio; o filtro precisa acompanhar.\n    useEffect(() => {\n        if (!open) {\n            debounceFn.cancel()\n            setQueryText('')\n        }\n    }, [open, debounceFn])\n\n    useEffect(() => {\n        if (!open) return\n        const handleKeyDown = (event: KeyboardEvent) => {\n            if (event.key === 'Escape') onClose()\n        }\n        window.addEventListener('keydown', handleKeyDown)\n        return () => window.removeEventListener('keydown', handleKeyDown)\n    }, [open, onClose])\n\n    const handleNewChat = () => {\n        setSelectedConversation('')\n        onClose()\n    }\n\n    return (\n        <AnimatePresence>\n            {open && (\n                <>\n                    <motion.div\n                        key=\"orbe-ai-drawer-backdrop\"\n                        aria-hidden\n                        initial={{ opacity: 0 }}\n                        animate={{ opacity: 1 }}\n                        exit={{ opacity: 0 }}\n                        transition={{ duration: 0.2 }}\n                        className=\"absolute inset-0 z-40 bg-black/40\"\n                        onClick={onClose}\n                    />\n                    <motion.aside\n                        key=\"orbe-ai-drawer\"\n                        role=\"dialog\"\n                        aria-modal=\"true\"\n                        aria-label=\"Conversas\"\n                        initial={{ x: '-100%' }}\n                        animate={{ x: 0 }}\n                        exit={{ x: '-100%' }}\n                        transition={{ duration: 0.2, ease: 'easeOut' }}\n                        className=\"absolute inset-y-0 left-0 z-50 flex w-[85%] max-w-[300px] flex-col border-r border-gray-200 bg-white shadow-xl dark:border-gray-700 dark:bg-gray-800\"\n                    >\n                        <div className=\"flex items-center justify-between border-b border-gray-200 px-4 py-3 dark:border-gray-700\">\n                            <span className=\"font-semibold text-gray-900 dark:text-gray-100\">\n                                Conversas\n                            </span>\n                            <button\n                                type=\"button\"\n                                className={iconButtonClass}\n                                onClick={onClose}\n                                aria-label=\"Fechar conversas\"\n                            >\n                                <HiX size={18} />\n                            </button>\n                        </div>\n\n                        <div className=\"flex flex-col gap-3 px-4 pt-4\">\n                            <Button\n                                block\n                                variant=\"solid\"\n                                size=\"sm\"\n                                icon={<TbPlus />}\n                                onClick={handleNewChat}\n                            >\n                                Novo chat\n                            </Button>\n                            <label className=\"flex h-9 items-center gap-2 rounded-lg border border-gray-200 px-3 focus-within:border-primary dark:border-gray-600\">\n                                <TbSearch className=\"shrink-0 text-lg text-gray-400\" />\n                                <input\n                                    className=\"h-full min-w-0 flex-1 bg-transparent text-sm placeholder:text-gray-400 focus:outline-none heading-text\"\n                                    placeholder=\"Buscar conversa\"\n                                    onChange={debounceFn}\n                                />\n                            </label>\n                        </div>\n\n                        <div className=\"px-4 pb-1 pt-4 text-xs font-semibold uppercase tracking-wide text-gray-400\">\n                            Histórico\n                        </div>\n                        <div className=\"min-h-0 flex-1\">\n                            <ChatHistory\n                                queryText={queryText}\n                                onClick={onClose}\n                                dropdownFloatingClass=\"!z-[10000]\"\n                            />\n                        </div>\n                    </motion.aside>\n                </>\n            )}\n        </AnimatePresence>\n    )\n}\n\nexport default OrbeAiChatDrawer\n"],"names":[],"mappings":"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"}

package/dist/@ecme/components/template/OrbeAiWidget/OrbeAiWidget.js

@@ -0,0 +1,127 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
+import { AnimatePresence, motion } from "framer-motion";
+import { TbMenu2, TbMessageChatbot, TbArrowsMinimize, TbArrowsMaximize } from "react-icons/tb";
+import { HiX } from "react-icons/hi";
+import ChatView from "../../../views/concepts/ai/Chat/components/ChatView.js";
+import ChatHistoryRenameDialog from "../../../views/concepts/ai/Chat/components/ChatHistoryRenameDialog.js";
+import useResizablePanel, { MARGIN } from "./useResizablePanel.js";
+import ResizeHandles from "./ResizeHandles.js";
+import OrbeAiChatDrawer from "./OrbeAiChatDrawer.js";
+const iconButtonClass = "flex h-8 w-8 items-center justify-center rounded-full text-gray-500 transition-colors hover:bg-gray-100 hover:text-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-200";
+const OrbeAiWidget = () => {
+  const [open, setOpen] = useState(false);
+  const [fullscreen, setFullscreen] = useState(false);
+  const [drawerOpen, setDrawerOpen] = useState(false);
+  const { rect, startResize, anchor } = useResizablePanel();
+  const toggleOpen = () => {
+    if (!open) anchor();
+    setOpen((prev) => !prev);
+    setDrawerOpen(false);
+  };
+  const toggleFullscreen = () => setFullscreen((prev) => !prev);
+  const toggleDrawer = () => setDrawerOpen((prev) => !prev);
+  const closeDrawer = useCallback(() => setDrawerOpen(false), []);
+  const close = () => {
+    setOpen(false);
+    setFullscreen(false);
+    setDrawerOpen(false);
+  };
+  const panelStyle = fullscreen ? void 0 : {
+    right: rect.right,
+    bottom: rect.bottom,
+    width: rect.width,
+    height: rect.height,
+    maxWidth: `calc(100% - ${rect.right + MARGIN}px)`,
+    maxHeight: `calc(100% - ${rect.bottom + MARGIN}px)`
+  };
+  const panelVariantClass = fullscreen ? "inset-0 rounded-none border-0" : "origin-bottom-right rounded-2xl border shadow-2xl";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `fixed bottom-6 right-6 flex flex-col items-end gap-3 print:hidden ${fullscreen ? "z-[9999]" : "z-40"}`,
+      children: [
+        /* @__PURE__ */ jsx(AnimatePresence, { children: open && /* @__PURE__ */ jsxs(
+          motion.div,
+          {
+            initial: { opacity: 0, y: 24, scale: 0.96 },
+            animate: { opacity: 1, y: 0, scale: 1 },
+            exit: { opacity: 0, y: 24, scale: 0.96 },
+            transition: { duration: 0.2, ease: "easeOut" },
+            style: panelStyle,
+            className: `fixed flex flex-col overflow-hidden border-gray-200 bg-white dark:border-gray-700 dark:bg-gray-800 ${panelVariantClass}`,
+            children: [
+              !fullscreen && /* @__PURE__ */ jsx(ResizeHandles, { onResizeStart: startResize }),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2 border-b border-gray-200 px-3 py-3 sm:px-4 dark:border-gray-700", children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-1 sm:gap-2", children: [
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      type: "button",
+                      className: iconButtonClass,
+                      onClick: toggleDrawer,
+                      "aria-label": "Abrir conversas",
+                      "aria-expanded": drawerOpen,
+                      children: /* @__PURE__ */ jsx(TbMenu2, { size: 20 })
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("span", { className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-primary text-white", children: /* @__PURE__ */ jsx(TbMessageChatbot, { size: 20 }) }),
+                  /* @__PURE__ */ jsx("span", { className: "truncate font-semibold text-gray-900 dark:text-gray-100", children: "Orbe AI" })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-1 sm:gap-2", children: [
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      type: "button",
+                      className: iconButtonClass,
+                      onClick: toggleFullscreen,
+                      "aria-label": fullscreen ? "Sair da tela cheia" : "Tela cheia",
+                      children: fullscreen ? /* @__PURE__ */ jsx(TbArrowsMinimize, { size: 18 }) : /* @__PURE__ */ jsx(TbArrowsMaximize, { size: 18 })
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      type: "button",
+                      className: iconButtonClass,
+                      onClick: close,
+                      "aria-label": "Fechar chat Orbe AI",
+                      children: /* @__PURE__ */ jsx(HiX, { size: 18 })
+                    }
+                  )
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "min-h-0 flex-1 p-2", children: [
+                /* @__PURE__ */ jsx(ChatView, { showMobileNav: false }),
+                /* @__PURE__ */ jsx(ChatHistoryRenameDialog, { overlayClassName: "!z-[10000]" })
+              ] }),
+              /* @__PURE__ */ jsx(
+                OrbeAiChatDrawer,
+                {
+                  open: drawerOpen,
+                  onClose: closeDrawer
+                }
+              )
+            ]
+          },
+          "orbe-ai-panel"
+        ) }),
+        !fullscreen && /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "flex h-14 w-14 items-center justify-center rounded-full bg-primary text-neutral shadow-lg transition-colors hover:bg-primary-mild focus:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2",
+            onClick: toggleOpen,
+            "aria-label": open ? "Fechar chat Orbe AI" : "Abrir chat Orbe AI",
+            "aria-expanded": open,
+            children: open ? /* @__PURE__ */ jsx(HiX, { size: 24 }) : /* @__PURE__ */ jsx(TbMessageChatbot, { size: 26 })
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  OrbeAiWidget as default
+};
+//# sourceMappingURL=OrbeAiWidget.js.map

package/dist/@ecme/components/template/OrbeAiWidget/OrbeAiWidget.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrbeAiWidget.js","sources":["../../../../../lib/@ecme/components/template/OrbeAiWidget/OrbeAiWidget.tsx"],"sourcesContent":["import { useCallback, useState } from 'react'\nimport { AnimatePresence, motion } from 'framer-motion'\nimport {\n    TbMessageChatbot,\n    TbArrowsMaximize,\n    TbArrowsMinimize,\n    TbMenu2,\n} from 'react-icons/tb'\nimport { HiX } from 'react-icons/hi'\nimport ChatView from '@/views/concepts/ai/Chat/components/ChatView'\nimport ChatHistoryRenameDialog from '@/views/concepts/ai/Chat/components/ChatHistoryRenameDialog'\nimport useResizablePanel, { MARGIN } from './useResizablePanel'\nimport ResizeHandles from './ResizeHandles'\nimport OrbeAiChatDrawer from './OrbeAiChatDrawer'\n\nconst iconButtonClass =\n    'flex h-8 w-8 items-center justify-center rounded-full text-gray-500 transition-colors hover:bg-gray-100 hover:text-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-200'\n\nconst OrbeAiWidget = () => {\n    const [open, setOpen] = useState(false)\n    const [fullscreen, setFullscreen] = useState(false)\n    const [drawerOpen, setDrawerOpen] = useState(false)\n    const { rect, startResize, anchor } = useResizablePanel()\n\n    const toggleOpen = () => {\n        // Sempre abre colado no botão. No mesmo clique do setOpen: o React junta\n        // os dois updates e o painel não pisca na posição antiga.\n        if (!open) anchor()\n        setOpen((prev) => !prev)\n        setDrawerOpen(false)\n    }\n    const toggleFullscreen = () => setFullscreen((prev) => !prev)\n    const toggleDrawer = () => setDrawerOpen((prev) => !prev)\n    // Estável: o drawer registra o listener de Esc com ela como dependência.\n    const closeDrawer = useCallback(() => setDrawerOpen(false), [])\n    const close = () => {\n        setOpen(false)\n        setFullscreen(false)\n        setDrawerOpen(false)\n    }\n\n    // Tela cheia: cobre o viewport inteiro (inset-0). Flutuante: ancorado no\n    // canto do botão (right/bottom). O max-* limita só a exibição — o estado\n    // guarda o tamanho escolhido, então ao desfazer o zoom o painel volta igual.\n    // `100%` de um `fixed` é o viewport sem a barra de rolagem.\n    const panelStyle = fullscreen\n        ? undefined\n        : {\n              right: rect.right,\n              bottom: rect.bottom,\n              width: rect.width,\n              height: rect.height,\n              maxWidth: `calc(100% - ${rect.right + MARGIN}px)`,\n              maxHeight: `calc(100% - ${rect.bottom + MARGIN}px)`,\n          }\n    const panelVariantClass = fullscreen\n        ? 'inset-0 rounded-none border-0'\n        : 'origin-bottom-right rounded-2xl border shadow-2xl'\n\n    return (\n        <div\n            className={`fixed bottom-6 right-6 flex flex-col items-end gap-3 print:hidden ${\n                fullscreen ? 'z-[9999]' : 'z-40'\n            }`}\n        >\n            <AnimatePresence>\n                {open && (\n                    <motion.div\n                        key=\"orbe-ai-panel\"\n                        initial={{ opacity: 0, y: 24, scale: 0.96 }}\n                        animate={{ opacity: 1, y: 0, scale: 1 }}\n                        exit={{ opacity: 0, y: 24, scale: 0.96 }}\n                        transition={{ duration: 0.2, ease: 'easeOut' }}\n                        style={panelStyle}\n                        className={`fixed flex flex-col overflow-hidden border-gray-200 bg-white dark:border-gray-700 dark:bg-gray-800 ${panelVariantClass}`}\n                    >\n                        {!fullscreen && (\n                            <ResizeHandles onResizeStart={startResize} />\n                        )}\n\n                        <div className=\"flex items-center justify-between gap-2 border-b border-gray-200 px-3 py-3 sm:px-4 dark:border-gray-700\">\n                            <div className=\"flex min-w-0 items-center gap-1 sm:gap-2\">\n                                <button\n                                    type=\"button\"\n                                    className={iconButtonClass}\n                                    onClick={toggleDrawer}\n                                    aria-label=\"Abrir conversas\"\n                                    aria-expanded={drawerOpen}\n                                >\n                                    <TbMenu2 size={20} />\n                                </button>\n                                <span className=\"flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-primary text-white\">\n                                    <TbMessageChatbot size={20} />\n                                </span>\n                                <span className=\"truncate font-semibold text-gray-900 dark:text-gray-100\">\n                                    Orbe AI\n                                </span>\n                            </div>\n                            <div className=\"flex shrink-0 items-center gap-1 sm:gap-2\">\n                                <button\n                                    type=\"button\"\n                                    className={iconButtonClass}\n                                    onClick={toggleFullscreen}\n                                    aria-label={\n                                        fullscreen\n                                            ? 'Sair da tela cheia'\n                                            : 'Tela cheia'\n                                    }\n                                >\n                                    {fullscreen ? (\n                                        <TbArrowsMinimize size={18} />\n                                    ) : (\n                                        <TbArrowsMaximize size={18} />\n                                    )}\n                                </button>\n                                <button\n                                    type=\"button\"\n                                    className={iconButtonClass}\n                                    onClick={close}\n                                    aria-label=\"Fechar chat Orbe AI\"\n                                >\n                                    <HiX size={18} />\n                                </button>\n                            </div>\n                        </div>\n\n                        <div className=\"min-h-0 flex-1 p-2\">\n                            <ChatView showMobileNav={false} />\n                            <ChatHistoryRenameDialog overlayClassName=\"!z-[10000]\" />\n                        </div>\n\n                        <OrbeAiChatDrawer\n                            open={drawerOpen}\n                            onClose={closeDrawer}\n                        />\n                    </motion.div>\n                )}\n            </AnimatePresence>\n\n            {!fullscreen && (\n                <button\n                    type=\"button\"\n                    className=\"flex h-14 w-14 items-center justify-center rounded-full bg-primary text-neutral shadow-lg transition-colors hover:bg-primary-mild focus:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2\"\n                    onClick={toggleOpen}\n                    aria-label={open ? 'Fechar chat Orbe AI' : 'Abrir chat Orbe AI'}\n                    aria-expanded={open}\n                >\n                    {open ? <HiX size={24} /> : <TbMessageChatbot size={26} />}\n                </button>\n            )}\n        </div>\n    )\n}\n\nexport default OrbeAiWidget\n"],"names":[],"mappings":"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"}

package/dist/@ecme/components/template/OrbeAiWidget/ResizeHandles.js

@@ -0,0 +1,37 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+const EDGES = [
+  { direction: "top", className: "left-0 right-0 top-0 h-1.5 cursor-ns-resize" },
+  { direction: "bottom", className: "bottom-0 left-0 right-0 h-1.5 cursor-ns-resize" },
+  { direction: "left", className: "bottom-0 left-0 top-0 w-1.5 cursor-ew-resize" },
+  { direction: "right", className: "bottom-0 right-0 top-0 w-1.5 cursor-ew-resize" }
+];
+const CORNERS = [
+  { direction: "top-left", className: "left-0 top-0 cursor-nwse-resize" },
+  { direction: "top-right", className: "right-0 top-0 cursor-nesw-resize" },
+  { direction: "bottom-left", className: "bottom-0 left-0 cursor-nesw-resize" },
+  { direction: "bottom-right", className: "bottom-0 right-0 cursor-nwse-resize" }
+];
+const ResizeHandles = ({ onResizeStart }) => /* @__PURE__ */ jsxs(Fragment, { children: [
+  EDGES.map(({ direction, className }) => /* @__PURE__ */ jsx(
+    "span",
+    {
+      "aria-hidden": true,
+      onPointerDown: (event) => onResizeStart(event, direction),
+      className: `absolute z-20 ${className}`
+    },
+    direction
+  )),
+  CORNERS.map(({ direction, className }) => /* @__PURE__ */ jsx(
+    "span",
+    {
+      "aria-hidden": true,
+      onPointerDown: (event) => onResizeStart(event, direction),
+      className: `absolute z-30 h-3 w-3 ${className}`
+    },
+    direction
+  ))
+] });
+export {
+  ResizeHandles as default
+};
+//# sourceMappingURL=ResizeHandles.js.map

package/dist/@ecme/components/template/OrbeAiWidget/ResizeHandles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResizeHandles.js","sources":["../../../../../lib/@ecme/components/template/OrbeAiWidget/ResizeHandles.tsx"],"sourcesContent":["import type { PointerEvent as ReactPointerEvent } from 'react'\nimport type { ResizeDirection } from './useResizablePanel'\n\ntype ResizeHandlesProps = {\n    onResizeStart: (\n        event: ReactPointerEvent,\n        direction: ResizeDirection,\n    ) => void\n}\n\nconst EDGES: { direction: ResizeDirection; className: string }[] = [\n    { direction: 'top', className: 'left-0 right-0 top-0 h-1.5 cursor-ns-resize' },\n    { direction: 'bottom', className: 'bottom-0 left-0 right-0 h-1.5 cursor-ns-resize' },\n    { direction: 'left', className: 'bottom-0 left-0 top-0 w-1.5 cursor-ew-resize' },\n    { direction: 'right', className: 'bottom-0 right-0 top-0 w-1.5 cursor-ew-resize' },\n]\n\nconst CORNERS: { direction: ResizeDirection; className: string }[] = [\n    { direction: 'top-left', className: 'left-0 top-0 cursor-nwse-resize' },\n    { direction: 'top-right', className: 'right-0 top-0 cursor-nesw-resize' },\n    { direction: 'bottom-left', className: 'bottom-0 left-0 cursor-nesw-resize' },\n    { direction: 'bottom-right', className: 'bottom-0 right-0 cursor-nwse-resize' },\n]\n\n/** Alças transparentes de redimensionamento nas 4 bordas + 4 cantos do painel. */\nconst ResizeHandles = ({ onResizeStart }: ResizeHandlesProps) => (\n    <>\n        {EDGES.map(({ direction, className }) => (\n            <span\n                key={direction}\n                aria-hidden\n                onPointerDown={(event) => onResizeStart(event, direction)}\n                className={`absolute z-20 ${className}`}\n            />\n        ))}\n        {CORNERS.map(({ direction, className }) => (\n            <span\n                key={direction}\n                aria-hidden\n                onPointerDown={(event) => onResizeStart(event, direction)}\n                className={`absolute z-30 h-3 w-3 ${className}`}\n            />\n        ))}\n    </>\n)\n\nexport default ResizeHandles\n"],"names":[],"mappings":";AAUA,MAAM,QAA6D;AAAA,EAC/D,EAAE,WAAW,OAAO,WAAW,8CAAA;AAAA,EAC/B,EAAE,WAAW,UAAU,WAAW,iDAAA;AAAA,EAClC,EAAE,WAAW,QAAQ,WAAW,+CAAA;AAAA,EAChC,EAAE,WAAW,SAAS,WAAW,gDAAA;AACrC;AAEA,MAAM,UAA+D;AAAA,EACjE,EAAE,WAAW,YAAY,WAAW,kCAAA;AAAA,EACpC,EAAE,WAAW,aAAa,WAAW,mCAAA;AAAA,EACrC,EAAE,WAAW,eAAe,WAAW,qCAAA;AAAA,EACvC,EAAE,WAAW,gBAAgB,WAAW,sCAAA;AAC5C;AAGA,MAAM,gBAAgB,CAAC,EAAE,cAAA,MACrB,qBAAA,UAAA,EACK,UAAA;AAAA,EAAA,MAAM,IAAI,CAAC,EAAE,WAAW,gBACrB;AAAA,IAAC;AAAA,IAAA;AAAA,MAEG,eAAW;AAAA,MACX,eAAe,CAAC,UAAU,cAAc,OAAO,SAAS;AAAA,MACxD,WAAW,iBAAiB,SAAS;AAAA,IAAA;AAAA,IAHhC;AAAA,EAAA,CAKZ;AAAA,EACA,QAAQ,IAAI,CAAC,EAAE,WAAW,gBACvB;AAAA,IAAC;AAAA,IAAA;AAAA,MAEG,eAAW;AAAA,MACX,eAAe,CAAC,UAAU,cAAc,OAAO,SAAS;AAAA,MACxD,WAAW,yBAAyB,SAAS;AAAA,IAAA;AAAA,IAHxC;AAAA,EAAA,CAKZ;AAAA,EAAA,CACL;"}

package/dist/@ecme/components/template/OrbeAiWidget/index.js

@@ -0,0 +1,5 @@
+import { default as default2 } from "./OrbeAiWidget.js";
+export {
+  default2 as default
+};
+//# sourceMappingURL=index.js.map

package/dist/@ecme/components/template/OrbeAiWidget/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/@ecme/components/template/OrbeAiWidget/useResizablePanel.js

@@ -0,0 +1,91 @@
+import { useState, useCallback, useEffect } from "react";
+const MIN = { width: 360, height: 420 };
+const DEFAULT = { width: 480, height: 720 };
+const MARGIN = 12;
+const ANCHOR = { right: 24, bottom: 92 };
+const clamp = (value, min, max) => Math.min(Math.max(value, min), max);
+const getViewport = () => ({
+  width: document.documentElement.clientWidth,
+  height: document.documentElement.clientHeight
+});
+const useResizablePanel = () => {
+  const [rect, setRect] = useState({ ...ANCHOR, ...DEFAULT });
+  const anchor = useCallback(() => {
+    setRect(
+      (prev) => prev.right === ANCHOR.right && prev.bottom === ANCHOR.bottom ? prev : { ...prev, ...ANCHOR }
+    );
+  }, []);
+  useEffect(() => {
+    window.addEventListener("resize", anchor);
+    return () => window.removeEventListener("resize", anchor);
+  }, [anchor]);
+  const startResize = useCallback(
+    (event, direction) => {
+      event.preventDefault();
+      event.stopPropagation();
+      const startX = event.clientX;
+      const startY = event.clientY;
+      const viewport = getViewport();
+      const start = {
+        ...rect,
+        width: Math.min(rect.width, viewport.width - rect.right - MARGIN),
+        height: Math.min(
+          rect.height,
+          viewport.height - rect.bottom - MARGIN
+        )
+      };
+      const previousUserSelect = document.body.style.userSelect;
+      document.body.style.userSelect = "none";
+      const handleMove = (moveEvent) => {
+        const dx = moveEvent.clientX - startX;
+        const dy = moveEvent.clientY - startY;
+        const next = { ...start };
+        if (direction.includes("left")) {
+          next.width = clamp(
+            start.width - dx,
+            MIN.width,
+            viewport.width - start.right - MARGIN
+          );
+        }
+        if (direction.includes("top")) {
+          next.height = clamp(
+            start.height - dy,
+            MIN.height,
+            viewport.height - start.bottom - MARGIN
+          );
+        }
+        if (direction.includes("right")) {
+          next.width = clamp(
+            start.width + dx,
+            MIN.width,
+            start.width + start.right - MARGIN
+          );
+          next.right = start.right - (next.width - start.width);
+        }
+        if (direction.includes("bottom")) {
+          next.height = clamp(
+            start.height + dy,
+            MIN.height,
+            start.height + start.bottom - MARGIN
+          );
+          next.bottom = start.bottom - (next.height - start.height);
+        }
+        setRect(next);
+      };
+      const stopResize = () => {
+        document.body.style.userSelect = previousUserSelect;
+        window.removeEventListener("pointermove", handleMove);
+        window.removeEventListener("pointerup", stopResize);
+      };
+      window.addEventListener("pointermove", handleMove);
+      window.addEventListener("pointerup", stopResize);
+    },
+    [rect]
+  );
+  return { rect, startResize, anchor };
+};
+export {
+  MARGIN,
+  useResizablePanel as default
+};
+//# sourceMappingURL=useResizablePanel.js.map

package/dist/@ecme/components/template/OrbeAiWidget/useResizablePanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useResizablePanel.js","sources":["../../../../../lib/@ecme/components/template/OrbeAiWidget/useResizablePanel.ts"],"sourcesContent":["import { useCallback, useEffect, useState } from 'react'\nimport type { PointerEvent as ReactPointerEvent } from 'react'\n\n/**\n * `right`/`bottom` são offsets a partir das bordas direita/inferior do\n * viewport — a mesma referência do botão (FAB, `bottom-6 right-6`). Assim,\n * resolução e zoom movem painel e botão juntos.\n */\nexport type Rect = { right: number; bottom: number; width: number; height: number }\n\nexport type ResizeDirection =\n    | 'top'\n    | 'bottom'\n    | 'left'\n    | 'right'\n    | 'top-left'\n    | 'top-right'\n    | 'bottom-left'\n    | 'bottom-right'\n\nconst MIN = { width: 360, height: 420 }\nconst DEFAULT = { width: 480, height: 720 }\nexport const MARGIN = 12 // distância mínima das bordas do viewport\n\n/**\n * Canto inferior-direito do painel, logo acima do FAB:\n * right = `right-6` (24); bottom = `bottom-6` (24) + `h-14` (56) + `gap-3` (12).\n * Se as classes do botão no OrbeAiWidget mudarem, ajustar aqui.\n */\nconst ANCHOR = { right: 24, bottom: 92 }\n\n/** Em telas menores que o MIN o máximo vence: o painel nunca sai da tela. */\nconst clamp = (value: number, min: number, max: number) =>\n    Math.min(Math.max(value, min), max)\n\n/** Área útil do `fixed`: o viewport sem a barra de rolagem, igual ao `100%` do CSS. */\nconst getViewport = () => ({\n    width: document.documentElement.clientWidth,\n    height: document.documentElement.clientHeight,\n})\n\n/**\n * Painel redimensionável por qualquer borda/canto, ancorado no botão. Cada\n * direção move sua borda mantendo a oposta fixa. O tamanho nunca é alterado\n * por mudança de viewport: quem limita é o max-width/max-height do painel.\n */\nconst useResizablePanel = () => {\n    const [rect, setRect] = useState<Rect>({ ...ANCHOR, ...DEFAULT })\n\n    /** Recola o painel acima do botão, mantendo o tamanho escolhido. */\n    const anchor = useCallback(() => {\n        setRect((prev) =>\n            prev.right === ANCHOR.right && prev.bottom === ANCHOR.bottom\n                ? prev\n                : { ...prev, ...ANCHOR },\n        )\n    }, [])\n\n    // Resolução e zoom disparam `resize`: o painel volta para cima do botão.\n    useEffect(() => {\n        window.addEventListener('resize', anchor)\n        return () => window.removeEventListener('resize', anchor)\n    }, [anchor])\n\n    const startResize = useCallback(\n        (event: ReactPointerEvent, direction: ResizeDirection) => {\n            event.preventDefault()\n            event.stopPropagation()\n\n            const startX = event.clientX\n            const startY = event.clientY\n            const viewport = getViewport()\n            // Parte do tamanho RENDERIZADO: se o CSS está limitando o painel, o\n            // valor guardado é maior que o visível e o arrasto teria zona morta.\n            const start: Rect = {\n                ...rect,\n                width: Math.min(rect.width, viewport.width - rect.right - MARGIN),\n                height: Math.min(\n                    rect.height,\n                    viewport.height - rect.bottom - MARGIN,\n                ),\n            }\n\n            const previousUserSelect = document.body.style.userSelect\n            document.body.style.userSelect = 'none'\n\n            const handleMove = (moveEvent: PointerEvent) => {\n                const dx = moveEvent.clientX - startX\n                const dy = moveEvent.clientY - startY\n                const next: Rect = { ...start }\n\n                // Esquerda/topo: a borda ancorada fica fixa, só o tamanho muda.\n                if (direction.includes('left')) {\n                    next.width = clamp(\n                        start.width - dx,\n                        MIN.width,\n                        viewport.width - start.right - MARGIN,\n                    )\n                }\n                if (direction.includes('top')) {\n                    next.height = clamp(\n                        start.height - dy,\n                        MIN.height,\n                        viewport.height - start.bottom - MARGIN,\n                    )\n                }\n                // Direita/baixo: a borda oposta fica fixa, então o offset anda junto.\n                if (direction.includes('right')) {\n                    next.width = clamp(\n                        start.width + dx,\n                        MIN.width,\n                        start.width + start.right - MARGIN,\n                    )\n                    next.right = start.right - (next.width - start.width)\n                }\n                if (direction.includes('bottom')) {\n                    next.height = clamp(\n                        start.height + dy,\n                        MIN.height,\n                        start.height + start.bottom - MARGIN,\n                    )\n                    next.bottom = start.bottom - (next.height - start.height)\n                }\n\n                setRect(next)\n            }\n\n            const stopResize = () => {\n                document.body.style.userSelect = previousUserSelect\n                window.removeEventListener('pointermove', handleMove)\n                window.removeEventListener('pointerup', stopResize)\n            }\n\n            window.addEventListener('pointermove', handleMove)\n            window.addEventListener('pointerup', stopResize)\n        },\n        [rect],\n    )\n\n    return { rect, startResize, anchor }\n}\n\nexport default useResizablePanel\n"],"names":[],"mappings":"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"}