@lark-apaas/client-toolkit 1.1.0 → 1.1.2-alpha.shadcn.1

package/lib/components/AppContainer/safety.js

@@ -3,8 +3,14 @@ import { useEffect, useRef, useState } from "react";
 import { Popover, PopoverContent, PopoverTrigger } from "../ui/popover.js";
 import { getCsrfToken } from "../../utils/getCsrfToken.js";
 import { getAppId } from "../../utils/getAppId.js";
+import { useIsMobile } from "../../hooks/index.js";
+import { X } from "lucide-react";
+import { Button } from "../ui/button.js";
 const Component = ()=>{
+    const HasClosedKey = `miaoda-creatByMiaoda-has-closed-${getAppId(window.location.pathname)}`;
+    const [visible, setVisible] = useState(!window.localStorage?.getItem(HasClosedKey));
     const [open, setOpen] = useState(false);
+    const isMobile = useIsMobile();
     const [userinfo, setUserinfo] = useState(null);
     const [isInternetVisible, setIsInternetVisible] = useState(false);
     const timeoutRef = useRef(null);
@@ -19,7 +25,7 @@ const Component = ()=>{
         });
     }, []);
     if ('production' !== process.env.NODE_ENV) return null;
-    if (!userinfo) return null;
+    if (isMobile || !visible || !userinfo) return null;
     return /*#__PURE__*/ jsxs(Popover, {
         open: open,
         onOpenChange: setOpen,
@@ -43,12 +49,26 @@ const Component = ()=>{
                         /*#__PURE__*/ jsx("p", {
                             className: "shrink-0 min-w-[92px]",
                             children: "由妙搭 AI 搭建"
+                        }),
+                        /*#__PURE__*/ jsx(Button, {
+                            size: "icon",
+                            variant: "ghost",
+                            className: "cursor-pointer rounded-full w-4 h-4 hover:bg-[#1f232914]",
+                            onClick: (e)=>{
+                                e.stopPropagation();
+                                e.preventDefault();
+                                setVisible(false);
+                                window.localStorage?.setItem(HasClosedKey, 'true');
+                            },
+                            children: /*#__PURE__*/ jsx(X, {
+                                className: "text-[#646A73] !w-[10px] !h-[10px]"
+                            })
                         })
                     ]
                 })
             }),
             /*#__PURE__*/ jsxs(PopoverContent, {
-                className: "w-80 pt-2 bg-white rounded-xl shadow-[0px_10px_36px_10px_rgba(31,35,41,0.04)] shadow-[0px_8px_24px_0px_rgba(31,35,41,0.04)] shadow-[0px_6px_12px_-10px_rgba(31,35,41,0.06)] outline outline-[0.50px] outline-offset-[-0.50px] outline-[#DEE0E3] inline-flex flex-col justify-center items-start overflow-hidden p-0",
+                className: "w-80 border-0 pt-2 bg-white rounded-xl shadow-[0px_10px_36px_10px_rgba(31,35,41,0.04)] shadow-[0px_8px_24px_0px_rgba(31,35,41,0.04)] shadow-[0px_6px_12px_-10px_rgba(31,35,41,0.06)] outline outline-[0.50px] outline-offset-[-0.50px] outline-[#DEE0E3] inline-flex flex-col justify-center items-start overflow-hidden p-0",
                 side: "top",
                 align: "end",
                 sideOffset: 8,
@@ -78,7 +98,7 @@ const Component = ()=>{
                                                             className: "shrink-0 w-[14px] h-[14px]"
                                                         }),
                                                         /*#__PURE__*/ jsx("div", {
-                                                            className: "flex-1 justify-start text-token-icon-n1 text-sm font-normal font-['PingFang_SC'] leading-5",
+                                                            className: "flex-1 justify-start text-[#2B2F36] text-sm font-normal font-['PingFang_SC'] leading-5",
                                                             children: "运营方"
                                                         })
                                                     ]
@@ -86,7 +106,7 @@ const Component = ()=>{
                                                 /*#__PURE__*/ jsx("div", {
                                                     className: "flex justify-start items-center gap-1 overflow-hidden",
                                                     children: /*#__PURE__*/ jsx("div", {
-                                                        className: "justify-start text-token-text-caption text-sm font-normal font-['PingFang_SC'] leading-5",
+                                                        className: "justify-start text-[#646A73] text-sm font-normal font-['PingFang_SC'] leading-5",
                                                         children: userinfo?.name
                                                     })
                                                 })
@@ -116,7 +136,7 @@ const Component = ()=>{
                                                 className: "shrink-0 w-[14px] h-[14px]"
                                             }),
                                             /*#__PURE__*/ jsx("div", {
-                                                className: "flex-1 justify-start text-token-icon-n1 text-sm font-normal font-['PingFang_SC'] leading-5",
+                                                className: "flex-1 justify-start text-[#2B2F36] text-sm font-normal font-['PingFang_SC'] leading-5",
                                                 children: "了解妙搭"
                                             }),
                                             /*#__PURE__*/ jsx("img", {
@@ -134,7 +154,7 @@ const Component = ()=>{
                         children: /*#__PURE__*/ jsx("div", {
                             className: "flex-1 flex justify-start items-center gap-2",
                             children: /*#__PURE__*/ jsx("div", {
-                                className: "justify-start text-token-text-placeholder text-xs font-normal font-['PingFang_SC'] leading-5",
+                                className: "justify-start text-[#8F959E] text-xs font-normal font-['PingFang_SC'] leading-5",
                                 children: "包含 AI 生成内容，请注意甄别"
                             })
                         })

package/lib/components/ui/button.js

@@ -3,15 +3,15 @@ import "react";
 import { Slot } from "@radix-ui/react-slot";
 import { cva } from "class-variance-authority";
 import { clsxWithTw } from "../../utils/utils.js";
-const buttonVariants = cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", {
+const buttonVariants = cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-normal transition-all disabled:cursor-not-allowed disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/20 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", {
     variants: {
         variant: {
-            default: "bg-primary text-primary-foreground hover:bg-primary/90",
-            destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
-            outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
-            secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
-            ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
-            link: "text-primary underline-offset-4 hover:underline"
+            default: "bg-primary text-primary-foreground not-disabled:hover:bg-primary/90",
+            destructive: "bg-destructive text-white not-disabled:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+            outline: "border bg-background not-disabled:hover:bg-accent not-disabled:hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:not-disabled:hover:bg-input/50",
+            secondary: "bg-secondary text-secondary-foreground not-disabled:hover:bg-secondary/80",
+            ghost: "not-disabled:hover:bg-accent not-disabled:hover:text-accent-foreground dark:not-disabled:hover:bg-accent/50",
+            link: "text-primary underline-offset-4 not-disabled:hover:underline"
         },
         size: {
             default: "h-9 px-4 py-2 has-[>svg]:px-3",

package/lib/override.css

@@ -1,13 +1,12 @@
-.ant-btn .ant-btn-icon {
-  align-items: center;
-  display: inline-flex;
-}
-
-.ant-btn-icon {
-  vertical-align: -.125em;
-}
+@layer base {
+  * {
+    border-color: var(--border);
+    outline-color: var(--ring);
+  }
 
-.ant-menu .ant-menu-item, .ant-menu > .ant-menu .ant-menu-item, .ant-dropdown-menu .ant-dropdown-menu-item, .ant-dropdown-menu .ant-dropdown-submenu-title, .ant-menu .ant-menu-submenu-title, .ant-menu > .ant-menu .ant-menu-submenu-title {
-  color: inherit;
+  body {
+    background-color: var(--background);
+    color: var(--foreground);
+  }
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lark-apaas/client-toolkit",
-  "version": "1.1.0",
+  "version": "1.1.2-alpha.shadcn.1",
   "types": "./lib/index.d.ts",
   "main": "./lib/index.js",
   "files": [