[{"data":1,"prerenderedAt":181},["ShallowReactive",2],{"navigation_docs_en":3,"-en-getting-started-introduction":44,"-en-getting-started-introduction-surround":176},[4,22],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":6},"Getting Started",false,"\u002Fen\u002Fgetting-started","en\u002F1.getting-started",[10,14,18],{"title":11,"path":12,"stem":13},"Quick Start","\u002Fen\u002Fgetting-started\u002Fquick-start","en\u002F1.getting-started\u002F2.quick-start",{"title":15,"path":16,"stem":17},"Installation","\u002Fen\u002Fgetting-started\u002Finstallation","en\u002F1.getting-started\u002Finstallation",{"title":19,"path":20,"stem":21},"Introduction","\u002Fen\u002Fgetting-started\u002Fintroduction","en\u002F1.getting-started\u002Fintroduction",{"title":23,"icon":24,"path":25,"stem":26,"children":27,"page":6},"Components","humbleicons:layers","\u002Fen\u002Fcomponents","en\u002F2.components",[28,32,36,40],{"title":29,"path":30,"stem":31},"Copy","\u002Fen\u002Fcomponents\u002Fcopy","en\u002F2.components\u002Fcopy",{"title":33,"path":34,"stem":35},"Full Screen Dialog","\u002Fen\u002Fcomponents\u002Ffull-screen-dialog","en\u002F2.components\u002Ffull-screen-dialog",{"title":37,"path":38,"stem":39},"Inline Tip","\u002Fen\u002Fcomponents\u002Finline-tip","en\u002F2.components\u002Finline-tip",{"title":41,"path":42,"stem":43},"Status Badge","\u002Fen\u002Fcomponents\u002Fstatus-badge","en\u002F2.components\u002Fstatus-badge",{"id":45,"title":19,"body":46,"description":169,"extension":170,"links":171,"meta":172,"navigation":173,"path":20,"seo":174,"stem":21,"__hash__":175},"docs_en\u002Fen\u002F1.getting-started\u002Fintroduction.md",{"type":47,"value":48,"toc":162},"minimark",[49,64,69,72,100,104,107,125,128,132],[50,51,52,53,63],"p",{},"PropShow Kit is a collection of extended components specifically built for ",[54,55,56],"strong",{},[57,58,62],"a",{"href":59,"rel":60},"https:\u002F\u002Fwww.shadcn-vue.com\u002F",[61],"nofollow","Shadcn Vue",". It provides a series of UI components that are not yet included in the official Shadcn Vue library but are very practical in actual business development.",[65,66,68],"h2",{"id":67},"design-philosophy","Design Philosophy",[50,70,71],{},"PropShow Kit follows the same design philosophy as Shadcn Vue:",[73,74,75,82,88,94],"ul",{},[76,77,78,81],"li",{},[54,79,80],{},"Not a Component Library",": It is not a dependency package installed via npm.",[76,83,84,87],{},[54,85,86],{},"Copy and Paste",": You have full control over the code. Simply copy the component source code directly into your project to use it.",[76,89,90,93],{},[54,91,92],{},"Highly Customizable",": Built on Tailwind CSS, you can modify styles and logic as needed.",[76,95,96,99],{},[54,97,98],{},"Unified Style",": Default styles are consistent with Shadcn Vue, seamlessly integrating into your existing projects.",[65,101,103],{"id":102},"why-do-you-need-it","Why Do You Need It?",[50,105,106],{},"When developing projects with Shadcn Vue, we often encounter requirements for common components that are not provided by the official library, such as:",[73,108,109,114,119],{},[76,110,111,113],{},[54,112,41],{},": A badge with a status indicator dot.",[76,115,116,118],{},[54,117,37],{},": An inline alert box for documentation or tips.",[76,120,121,124],{},[54,122,123],{},"Copy Button",": A button with copy feedback.",[50,126,127],{},"PropShow Kit aims to fill these gaps, saving you development time by not having to write these components from scratch.",[65,129,131],{"id":130},"key-features","Key Features",[73,133,134,141,148,155],{},[76,135,136,137,140],{},"🎨 ",[54,138,139],{},"Shadcn Style",": Maintains visual style and API design consistent with Shadcn Vue.",[76,142,143,144,147],{},"📋 ",[54,145,146],{},"TypeScript",": Written entirely in TypeScript, providing good type hints.",[76,149,150,151,154],{},"🌙 ",[54,152,153],{},"Dark Mode",": Perfectly supports light and dark mode switching.",[76,156,157,158,161],{},"🧩 ",[54,159,160],{},"Independence",": Components are decoupled as much as possible, so you can choose only the components you need.",{"title":163,"searchDepth":164,"depth":164,"links":165},"",2,[166,167,168],{"id":67,"depth":164,"text":68},{"id":102,"depth":164,"text":103},{"id":130,"depth":164,"text":131},"PropShow Kit - A collection of extended components for Shadcn Vue.","md",null,{},true,{"title":19,"description":169},"sXsMFHArFMaOpk2iwWgZc-EDBX_a6M0332TzHybNSgo",[177,179],{"title":15,"path":16,"stem":17,"description":178,"children":-1},"How to use PropShow Kit components in your project.",{"title":29,"path":30,"stem":31,"description":180,"children":-1},"Copy button component, supports custom styles and tooltip text.",1774595237934]