fix(ui,icons,ui-preset): Fix CodeBlock and Command components (#10369)

packages/design-system/ui/src/components/command/command.stories.tsx

@@ -1,6 +1,7 @@
 import type { Meta, StoryObj } from "@storybook/react"
 import React from "react"
 import { Badge } from "../badge"
+import { TooltipProvider } from "../tooltip"
 import { Command } from "./command"
 
 const meta: Meta<typeof Command> = {
@@ -18,15 +19,17 @@ type Story = StoryObj<typeof Command>
 export const Default: Story = {
   render: () => {
     return (
-      <div className="w-[500px]">
-        <Command>
-          <Badge className="dark" size="small" color="green">
-            Get
-          </Badge>
-          <code>localhost:9000/store/products</code>
-          <Command.Copy content="localhost:9000/store/products" />
-        </Command>
-      </div>
+      <TooltipProvider>
+        <div className="w-[500px]">
+          <Command>
+            <Badge className="dark" size="small" color="green">
+              GET
+            </Badge>
+            <code>localhost:9000/store/products</code>
+            <Command.Copy content="localhost:9000/store/products" />
+          </Command>
+        </div>
+      </TooltipProvider>
     )
   },
 }

packages/design-system/ui/src/components/command/command.tsx

@@ -14,8 +14,8 @@ const CommandComponent = ({
   return (
     <div
       className={clx(
-        "bg-ui-code-bg-base border-ui-code-border flex items-center rounded-lg border px-3 py-2",
-        "[&>code]:text-ui-code-fg-base [&>code]:code-body [&>code]:mx-3",
+        "bg-ui-contrast-bg-base shadow-elevation-code-block flex items-center rounded-lg px-4 py-1.5",
+        "[&>code]:text-ui-contrast-fg-primary [&>code]:code-body [&>code]:mx-2",
         className
       )}
       {...props}
@@ -32,7 +32,7 @@ const CommandCopy = React.forwardRef<
     <Copy
       {...props}
       ref={ref}
-      className={clx("!text-ui-code-fg-muted ml-auto", className)}
+      className={clx("!text-ui-contrast-fg-secondary ml-auto", className)}
     />
   )
 })