[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6EFZ6H0DMR7CG2ABGJ7541J":3,"skill-same:01M6EFZ6H0DMR7CG2ABGJ7541J":58},{"skillNo":4,"name":5,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":7,"ownerLogin":8,"ownerAvatarUrl":9,"ownerAccountNo":10,"ownerDisplayName":11,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":15,"categories":16,"keywords":22,"publishedAt":25,"linkOnly":26,"markdownContent":27,"markdownBody":27,"frontMatter":28,"refName":29,"commitSha":30,"skillDirectory":31,"forksCount":32,"repositoryHtmlUrl":33,"repositoryHomepageUrl":34,"ownerHtmlUrl":35,"ownerBlogUrl":6,"ownerDescription":36,"updatedAt":37,"install":38,"resources":51},"01M6EFZ6H0DMR7CG2ABGJ7541J","radix-ui",null,"ComeOnOliver\u002Fskillshub","ComeOnOliver","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F43215937?v=4","01M6E5JNFECJAAVFE0W7SMWWD2","Haoran Shu","01M6E5JNNDQS7AJZDYFQ8TPZCK",67,"MIT","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002FTerminalSkills\u002Fskills\u002Fradix-ui\u002FSKILL.md",[17],{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000032","设计师","PROFESSION","适用职业",[23,24],"ui","radix ui","2026-11-10 10:12:30",false,"# Radix UI\n\n## Overview\n\nRadix UI provides unstyled, accessible React primitives — dropdowns, dialogs, popovers, tabs, accordions, and more. Each component handles keyboard navigation, focus management, screen reader support, and ARIA attributes. You add your own styling. Foundation of shadcn\u002Fui.\n\n## Instructions\n\n### Step 1: Dialog\n\n```tsx\nimport * as Dialog from '@radix-ui\u002Freact-dialog'\n\nfunction ConfirmDialog({ trigger, title, description, onConfirm }) {\n  return (\n    \u003CDialog.Root>\n      \u003CDialog.Trigger asChild>{trigger}\u003C\u002FDialog.Trigger>\n      \u003CDialog.Portal>\n        \u003CDialog.Overlay className=\"fixed inset-0 bg-black\u002F50 animate-in fade-in\" \u002F>\n        \u003CDialog.Content className=\"fixed left-1\u002F2 top-1\u002F2 -translate-x-1\u002F2 -translate-y-1\u002F2 bg-white rounded-lg p-6 w-[90vw] max-w-md shadow-xl animate-in fade-in zoom-in-95\">\n          \u003CDialog.Title className=\"text-lg font-semibold\">{title}\u003C\u002FDialog.Title>\n          \u003CDialog.Description className=\"text-sm text-gray-500 mt-2\">\n            {description}\n          \u003C\u002FDialog.Description>\n          \u003Cdiv className=\"flex justify-end gap-2 mt-6\">\n            \u003CDialog.Close asChild>\n              \u003Cbutton className=\"px-4 py-2 rounded border\">Cancel\u003C\u002Fbutton>\n            \u003C\u002FDialog.Close>\n            \u003Cbutton onClick={onConfirm} className=\"px-4 py-2 rounded bg-red-500 text-white\">\n              Confirm\n            \u003C\u002Fbutton>\n          \u003C\u002Fdiv>\n          \u003CDialog.Close asChild>\n            \u003Cbutton className=\"absolute top-4 right-4\" aria-label=\"Close\">✕\u003C\u002Fbutton>\n          \u003C\u002FDialog.Close>\n        \u003C\u002FDialog.Content>\n      \u003C\u002FDialog.Portal>\n    \u003C\u002FDialog.Root>\n  )\n}\n```\n\n### Step 2: Dropdown Menu\n\n```tsx\nimport * as DropdownMenu from '@radix-ui\u002Freact-dropdown-menu'\n\nfunction UserMenu({ user }) {\n  return (\n    \u003CDropdownMenu.Root>\n      \u003CDropdownMenu.Trigger asChild>\n        \u003Cbutton className=\"flex items-center gap-2\">\n          \u003Cimg src={user.avatar} className=\"w-8 h-8 rounded-full\" alt=\"\" \u002F>\n          {user.name}\n        \u003C\u002Fbutton>\n      \u003C\u002FDropdownMenu.Trigger>\n      \u003CDropdownMenu.Portal>\n        \u003CDropdownMenu.Content className=\"bg-white rounded-lg shadow-lg p-1 min-w-[180px]\" sideOffset={5}>\n          \u003CDropdownMenu.Item className=\"px-3 py-2 rounded cursor-pointer hover:bg-gray-100\">\n            Profile\n          \u003C\u002FDropdownMenu.Item>\n          \u003CDropdownMenu.Item className=\"px-3 py-2 rounded cursor-pointer hover:bg-gray-100\">\n            Settings\n          \u003C\u002FDropdownMenu.Item>\n          \u003CDropdownMenu.Separator className=\"h-px bg-gray-200 my-1\" \u002F>\n          \u003CDropdownMenu.Item className=\"px-3 py-2 rounded cursor-pointer hover:bg-red-50 text-red-600\">\n            Sign out\n          \u003C\u002FDropdownMenu.Item>\n        \u003C\u002FDropdownMenu.Content>\n      \u003C\u002FDropdownMenu.Portal>\n    \u003C\u002FDropdownMenu.Root>\n  )\n}\n```\n\n### Step 3: Tabs\n\n```tsx\nimport * as Tabs from '@radix-ui\u002Freact-tabs'\n\n\u003CTabs.Root defaultValue=\"overview\">\n  \u003CTabs.List className=\"flex border-b\">\n    \u003CTabs.Trigger value=\"overview\" className=\"px-4 py-2 data-[state=active]:border-b-2 data-[state=active]:border-blue-500\">\n      Overview\n    \u003C\u002FTabs.Trigger>\n    \u003CTabs.Trigger value=\"analytics\" className=\"px-4 py-2 data-[state=active]:border-b-2 data-[state=active]:border-blue-500\">\n      Analytics\n    \u003C\u002FTabs.Trigger>\n  \u003C\u002FTabs.List>\n  \u003CTabs.Content value=\"overview\">\u003COverviewPanel \u002F>\u003C\u002FTabs.Content>\n  \u003CTabs.Content value=\"analytics\">\u003CAnalyticsPanel \u002F>\u003C\u002FTabs.Content>\n\u003C\u002FTabs.Root>\n```\n\n## Guidelines\n\n- Radix is unstyled — bring your own CSS\u002FTailwind. For pre-styled, use shadcn\u002Fui.\n- `asChild` merges Radix behavior onto your custom elements (no extra DOM wrappers).\n- `data-[state=active]` and `data-[state=open]` for styling based on component state.\n- Install individual packages: `@radix-ui\u002Freact-dialog`, `@radix-ui\u002Freact-dropdown-menu`.\n- All components handle keyboard (Escape, Arrow keys, Enter) and screen readers automatically.\n",{},"main","def8531e65114c0fca8fb8551c1871ee0eed705c","skills\u002FTerminalSkills\u002Fskills\u002Fradix-ui",24,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub","https:\u002F\u002Fskillshub.wtf","https:\u002F\u002Fgithub.com\u002FComeOnOliver","AI & Blockchain Engineer\r\n","2026-06-24 22:07:19",{"source":7,"skillName":5,"commands":39,"prompt":49,"zipAvailable":50},[40,43,46],{"tool":41,"command":42},"npx","npx skills add ComeOnOliver\u002Fskillshub --skill radix-ui",{"tool":44,"command":45},"bunx","bunx skills add ComeOnOliver\u002Fskillshub --skill radix-ui",{"tool":47,"command":48},"pnpm","pnpm dlx skills add ComeOnOliver\u002Fskillshub --skill radix-ui","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002FTerminalSkills\u002Fskills\u002Fradix-ui\u002FSKILL.md",true,[52],{"path":53,"resourceType":54,"resourceTypeDesc":55,"sizeBytes":56,"sourceHtmlUrl":57},"entry-files.md","REFERENCE","参考文档",174,"https:\u002F\u002Fgithub.com\u002Fihudak\u002Fai-workflows\u002Fblob\u002Fmain\u002Fscripts\u002Ffixtures\u002Freference-parts\u002Fentry_shared_region\u002Fplugins\u002Fworkflows-core\u002Fskills\u002Freference\u002Fentry-files.md",[59,73,83,92,98,105],{"skillNo":60,"name":61,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":7,"ownerLogin":8,"ownerAvatarUrl":9,"ownerAccountNo":10,"ownerDisplayName":11,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":62,"categories":63,"keywords":69,"publishedAt":25},"01M6FKJN13GMG4KY57J3QD8GY5","model-hierarchy-skill","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzscole\u002Fmodel-hierarchy-skill\u002Fmodel-hierarchy-skill\u002FSKILL.md",[64],{"categoryNo":65,"categoryName":66,"taxonomyType":67,"taxonomyTypeDesc":68},"01JBSEEDCAT000000000000023","Skill与智能体开发","SCENARIO","使用场景",[70,71,72],"model","model hierarchy","model hierarchy skill",{"skillNo":74,"name":75,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":7,"ownerLogin":8,"ownerAvatarUrl":9,"ownerAccountNo":10,"ownerDisplayName":11,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":76,"categories":77,"keywords":79,"publishedAt":25},"01M6FKJJJ6GCAMR4PPPRD12M5X","zoom-mcp","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fzoom-mcp\u002FSKILL.md",[78],{"categoryNo":65,"categoryName":66,"taxonomyType":67,"taxonomyTypeDesc":68},[80,81,82],"MCP","zoom","zoom mcp",{"skillNo":84,"name":85,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":7,"ownerLogin":8,"ownerAvatarUrl":9,"ownerAccountNo":10,"ownerDisplayName":11,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":86,"categories":87,"keywords":88,"publishedAt":25},"01M6FKJE3KYT3KPEZMEEHYKA6K","zoom-apps-sdk","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fzoom-apps-sdk\u002FSKILL.md",[],[89,90,91,81],"sdk","zoom apps sdk","apps",{"skillNo":93,"name":94,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":7,"ownerLogin":8,"ownerAvatarUrl":9,"ownerAccountNo":10,"ownerDisplayName":11,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":95,"categories":96,"keywords":97,"publishedAt":25},"01M6FKJ9EDH9Q5VWDF8HAJRSP0","windows","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fwindows\u002FSKILL.md",[],[94],{"skillNo":99,"name":100,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":7,"ownerLogin":8,"ownerAvatarUrl":9,"ownerAccountNo":10,"ownerDisplayName":11,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":101,"categories":102,"keywords":104,"publishedAt":25},"01M6FKJ666BEEFC3AE9GJ72Q93","whiteboard","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fwhiteboard\u002FSKILL.md",[103],{"categoryNo":65,"categoryName":66,"taxonomyType":67,"taxonomyTypeDesc":68},[100],{"skillNo":106,"name":107,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":7,"ownerLogin":8,"ownerAvatarUrl":9,"ownerAccountNo":10,"ownerDisplayName":11,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":108,"categories":109,"keywords":110,"publishedAt":25},"01M6FKJ21WFCDGTJQ2Q91T9DVW","websockets","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fwebsockets\u002FSKILL.md",[],[107]]