@keke1933/vibe-dictionary-mcp 0.9.0 → 0.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +376 -5
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1424,6 +1424,142 @@ var BASE_ADDITIONS = [
|
|
|
1424
1424
|
}
|
|
1425
1425
|
];
|
|
1426
1426
|
|
|
1427
|
+
// ../../packages/catalog/src/additions/starter-pack.ts
|
|
1428
|
+
var STARTER_PACK_ADDITIONS = [
|
|
1429
|
+
{
|
|
1430
|
+
id: "ui-ai-streaming-pulse",
|
|
1431
|
+
domain: "ui",
|
|
1432
|
+
category: "text",
|
|
1433
|
+
titleKo: "AI \uC2A4\uD2B8\uB9AC\uBC0D \uD384\uC2A4 \uD14D\uC2A4\uD2B8",
|
|
1434
|
+
titleEn: "AI Streaming Pulse Text",
|
|
1435
|
+
summary: "\uD55C \uAE00\uC790\uC529 \uCD9C\uB825\uB418\uB294 \uD0C0\uC774\uD551 \uD6A8\uACFC \uB05D\uC5D0 \uBD80\uB4DC\uB7FD\uAC8C \uAE5C\uBE61\uC774\uBA70 \uC228\uC26C\uB294 \uADF8\uB77C\uB514\uC5B8\uD2B8 \uD384\uC2A4 \uCEE4\uC11C\uAC00 \uB530\uB77C\uBD99\uB294 \uC2A4\uD2B8\uB9AC\uBC0D \uD14D\uC2A4\uD2B8",
|
|
1436
|
+
vibeTag: "\uC0DD\uAC01\uD558\uB4EF \uD0C0\uC774\uD551\uB418\uBA70 \uC228\uC26C\uB294 \uD384\uC2A4 \uCEE4\uC11C",
|
|
1437
|
+
vibeKeywords: ["\uC2A4\uD2B8\uB9AC\uBC0D \uD384\uC2A4", "AI \uC2A4\uD2B8\uB9AC\uBC0D", "\uD0C0\uC774\uD551 \uD6A8\uACFC", "\uD384\uC2A4 \uCEE4\uC11C", "\uC2A4\uD2B8\uB9AC\uBC0D \uD14D\uC2A4\uD2B8", "\uC0DD\uC131\uD615 UI"],
|
|
1438
|
+
promptSnippet: '\uC9C0\uC815 \uC601\uC5ED\uC5D0 280\xD7150 \uD06C\uAE30\uB85C AI \uC2A4\uD2B8\uB9AC\uBC0D \uD14D\uC2A4\uD2B8 \uB370\uBAA8\uB97C \uB9CC\uB4E4\uC5B4 \uC918. \uC0C1\uB2E8\uC5D0\uB294 11px \uD06C\uAE30\uC758 AI \uC0DD\uC131 \uC0C1\uD0DC \uB77C\uBCA8(\uBC18\uC9DD\uC774\uB294 \uC6D0\uD615 \uC778\uB514\uCF00\uC774\uD130\uC640 \uD568\uAED8)\uC744 \uB450\uACE0, \uC911\uC559 \uD14D\uC2A4\uD2B8 \uC601\uC5ED\uC5D0\uB294 \uACE0\uC815\uB41C \uC0D8\uD50C \uBB38\uC7A5\uC774 40ms \uAC04\uACA9\uC73C\uB85C \uD55C \uAE00\uC790\uC529 \uC810\uC9C4\uC801\uC73C\uB85C \uD0C0\uC774\uD551 \uCD9C\uB825\uB418\uAC8C \uD574 \uC918. \uCD9C\uB825\uB418\uB294 \uD14D\uC2A4\uD2B8 \uBC14\uB85C \uB4A4\uC5D0\uB294 \uB108\uBE44 8px, \uB192\uC774 15px\uC758 \uBCF4\uB77C-\uCCAD\uB85D \uADF8\uB77C\uB514\uC5B8\uD2B8 \uD384\uC2A4 \uCEE4\uC11C\uB97C \uC778\uB77C\uC778\uC73C\uB85C \uBD99\uC774\uACE0 1\uCD08 \uC8FC\uAE30\uB85C \uBD80\uB4DC\uB7EC\uC6B4 \uC810\uBA78(opacity 0.2~1)\uACFC \uBBF8\uC138\uD55C \uC2A4\uCF00\uC77C \uBAA8\uC158\uC744 \uC918. \uD0C0\uC774\uD551 \uC911\uC5D0\uB294 \uCEE4\uC11C\uAC00 \uAE00\uC790 \uB05D\uC744 \uC989\uAC01 \uB530\uB77C\uAC00\uACE0, \uCD9C\uB825\uC774 \uB05D\uB098\uBA74 \uCEE4\uC11C\uAC00 \uD384\uC2A4\uB97C \uC720\uC9C0\uD558\uBA70 \uB300\uAE30 \uC0C1\uD0DC\uB85C \uC804\uD658\uB3FC. \uD074\uB9AD\uD558\uBA74 \uCC98\uC74C\uBD80\uD130 \uB2E4\uC2DC \uD0C0\uC774\uD551\uC744 \uC7AC\uC0DD\uD574 \uC918. \uB77C\uC774\uD2B8 \uD14C\uB9C8(#f8fafc \uBC14\uD0D5, #0f172a \uD14D\uC2A4\uD2B8, #6366f1 \uAC15\uC870)\uC640 \uB2E4\uD06C \uD14C\uB9C8(#0f172a \uBC14\uD0D5, #f8fafc \uD14D\uC2A4\uD2B8, #818cf8 \uAC15\uC870)\uB97C \uC9C0\uC6D0\uD558\uACE0, role="status"\uC640 aria-live="polite"\uB85C \uC2A4\uD06C\uB9B0 \uB9AC\uB354 \uB0AD\uB3C5\uC744 \uC9C0\uC6D0\uD574 \uC918. \uBAA8\uC158 \uAC10\uC18C \uD658\uACBD\uC5D0\uC11C\uB294 \uC9C0\uC5F0 \uC5C6\uC774 \uC804\uCCB4 \uD14D\uC2A4\uD2B8\uC640 \uC815\uC9C0\uB41C \uCEE4\uC11C\uB97C \uC989\uC2DC \uD45C\uC2DC\uD574 \uC918.'
|
|
1439
|
+
},
|
|
1440
|
+
{
|
|
1441
|
+
id: "ui-particle-burst-heart",
|
|
1442
|
+
domain: "ui",
|
|
1443
|
+
category: "feedback",
|
|
1444
|
+
titleKo: "\uD30C\uD2F0\uD074 \uBC84\uC2A4\uD2B8 \uD558\uD2B8 \uB9AC\uC561\uC158",
|
|
1445
|
+
titleEn: "Particle Burst Heart Reaction",
|
|
1446
|
+
summary: "\uD558\uD2B8 \uBC84\uD2BC \uD074\uB9AD \uC2DC \uD558\uD2B8 \uC544\uC774\uCF58\uC774 \uD295\uAE30\uBA70 8\uBC29\uD5A5\uC73C\uB85C \uC0C9\uC885\uC774 \uD30C\uD2F0\uD074\uACFC \uD655\uC7A5 \uB9C1\uC774 \uD321 \uD130\uC838 \uB098\uC624\uB294 \uB9AC\uC561\uC158",
|
|
1447
|
+
vibeTag: "\uD074\uB9AD \uC21C\uAC04 \uBCC4\uBE5B\uACFC \uB9C1\uC774 \uD321 \uD130\uC9C0\uB294",
|
|
1448
|
+
vibeKeywords: ["\uD30C\uD2F0\uD074 \uBC84\uC2A4\uD2B8 \uD558\uD2B8", "\uC88B\uC544\uC694 \uBAA8\uC158", "\uB9C8\uC774\uD06C\uB85C \uC778\uD130\uB799\uC158", "\uCD95\uD558 \uD30C\uD2F0\uD074", "\uBC14\uC6B4\uC2A4 \uBC84\uD2BC"],
|
|
1449
|
+
promptSnippet: "\uC9C0\uC815 \uC601\uC5ED\uC5D0 48\xD748 \uD06C\uAE30\uC758 \uC778\uD130\uB799\uD2F0\uBE0C \uD558\uD2B8 \uBC84\uD2BC\uACFC \uD30C\uD2F0\uD074 \uBC84\uC2A4\uD2B8 \uD6A8\uACFC\uB97C \uB9CC\uB4E4\uC5B4 \uC918. native button \uD0DC\uADF8\uB97C \uC0AC\uC6A9\uD558\uACE0 \uCD08\uAE30\uC5D0\uB294 \uBE48 \uD68C\uC0C9 \uD558\uD2B8\uC640 \uC22B\uC790 \uCE74\uC6B4\uD130\uB97C \uBCF4\uC5EC \uC918. \uD074\uB9AD \uC2DC active \uC0C1\uD0DC\uAC00 \uD1A0\uAE00\uB418\uBA70, active\uB85C \uBCC0\uD560 \uB54C \uD558\uD2B8\uAC00 300ms cubic-bezier(.17,.89,.32,1.28) \uB3D9\uC548 scale 0.8\uC5D0\uC11C 1.25\uB85C \uD280\uC5B4 \uC62C\uB790\uB2E4\uAC00 1.0\uC73C\uB85C \uC548\uCC29\uD558\uAC8C \uD574 \uC918. \uB3D9\uC2DC\uC5D0 \uBC84\uD2BC \uC911\uC2EC\uC5D0\uC11C \uBC14\uAE65\uCABD\uC73C\uB85C \uBC18\uACBD 36px\uAE4C\uC9C0 \uBE60\uB974\uAC8C \uD37C\uC9C0\uBA70 \uC0AC\uB77C\uC9C0\uB294 \uBC18\uD22C\uBA85 \uD33D\uCC3D \uB9C1(opacity 1\u21920, scale 0.2\u21921.8)\uACFC 8\uBC29\uD5A5\uC73C\uB85C \uAC01\uAE30 \uB2E4\uB978 4\uAC00\uC9C0 \uD30C\uC2A4\uD154 \uC0C9\uC0C1(\uBD84\uD64D, \uB178\uB791, \uBCF4\uB77C, \uCCAD\uB85D)\uC758 \uBBF8\uC138\uD55C \uC6D0\uD615 \uD30C\uD2F0\uD074 8\uAC1C\uAC00 400ms \uB3D9\uC548 \uBC29\uC0AC\uD615\uC73C\uB85C \uB0A0\uC544\uAC00\uBA70 \uD398\uC774\uB4DC\uC544\uC6C3\uB418\uAC8C \uD574 \uC918. \uB2E4\uC2DC \uD074\uB9AD\uD558\uBA74 \uD30C\uD2F0\uD074 \uC5C6\uC774 \uD558\uD2B8\uAC00 \uBD80\uB4DC\uB7FD\uAC8C \uC6D0\uB798 \uC0C9\uC73C\uB85C \uB3CC\uC544\uC640. active \uC2DC \uCE74\uC6B4\uD130 \uC22B\uC790\uAC00 1 \uC99D\uAC00\uD574. \uC591\uD14C\uB9C8\uC640 \uD0A4\uBCF4\uB4DC \uC811\uADFC\uC131(Enter/Space), aria-pressed\uB97C \uC9C0\uC6D0\uD558\uACE0, \uBAA8\uC158 \uAC10\uC18C \uD658\uACBD\uC5D0\uC11C\uB294 \uD30C\uD2F0\uD074\uACFC \uBC14\uC6B4\uC2A4 \uC560\uB2C8\uBA54\uC774\uC158 \uC5C6\uC774 \uC0C9\uC0C1\uACFC \uCE74\uC6B4\uD2B8\uB9CC \uC989\uC2DC \uD1A0\uAE00\uD574 \uC918."
|
|
1450
|
+
},
|
|
1451
|
+
{
|
|
1452
|
+
id: "mg-ambient-aurora-blob",
|
|
1453
|
+
domain: "motion",
|
|
1454
|
+
category: "shader",
|
|
1455
|
+
titleKo: "\uC570\uBE44\uC5B8\uD2B8 \uC624\uB85C\uB77C \uBE14\uB86D",
|
|
1456
|
+
titleEn: "Ambient Aurora Blob",
|
|
1457
|
+
summary: "\uC138 \uAC1C\uC758 \uC720\uAE30\uC801\uC778 \uD30C\uC2A4\uD154 \uB124\uC628 \uADF8\uB77C\uB514\uC5B8\uD2B8 \uBE14\uB86D\uC774 \uB290\uB9AC\uAC8C \uD68C\uC804\uD558\uACE0 \uACB9\uCE58\uBA70 \uBE14\uB7EC \uD544\uD130 \uC18D\uC5D0\uC11C \uBE5B\uC758 \uD750\uB984\uC744 \uC5F0\uCD9C\uD558\uB294 \uBC30\uACBD",
|
|
1458
|
+
vibeTag: "\uBABD\uD658\uC801\uC73C\uB85C \uACB9\uCE58\uBA70 \uD750\uB974\uB294 \uBE5B\uC758 \uC624\uB85C\uB77C",
|
|
1459
|
+
vibeKeywords: ["\uC570\uBE44\uC5B8\uD2B8 \uC624\uB85C\uB77C", "\uC624\uB85C\uB77C \uBC30\uACBD", "\uADF8\uB77C\uB514\uC5B8\uD2B8 \uBAA8\uC158", "\uC624\uB85C\uB77C \uC170\uC774\uB354", "\uD788\uC5B4\uB85C \uBC30\uACBD", "\uC720\uAE30\uC801 \uBE14\uB7EC"],
|
|
1460
|
+
promptSnippet: '\uC9C0\uC815 \uC601\uC5ED\uC5D0 280\xD7150 SVG \uD504\uB808\uC784\uC73C\uB85C \uBABD\uD658\uC801\uC778 \uC570\uBE44\uC5B8\uD2B8 \uC624\uB85C\uB77C \uBC30\uACBD\uC744 \uB9CC\uB4E4\uC5B4 \uC918. \uBC14\uD0D5\uC740 \uC9D9\uC740 \uB0A8\uCCAD\uC0C9(#090d16)\uC73C\uB85C \uB450\uACE0, \uADF8 \uC704\uC5D0 \uBCF4\uB77C(#8b5cf6), \uCCAD\uB85D(#06b6d4), \uCF54\uB784\uD551\uD06C(#f43f5e) 3\uAC1C\uC758 \uD070 \uD0C0\uC6D0 \uBE14\uB86D\uC744 \uACB9\uCCD0 \uC918. \uAC01 \uBE14\uB86D\uC740 feGaussianBlur(stdDeviation="22") \uD544\uD130 \uC548\uC5D0\uC11C 8~12\uCD08 \uC8FC\uAE30\uB85C \uC11C\uB85C \uB2E4\uB978 \uC18D\uB3C4\uC640 \uBC18\uACBD\uC73C\uB85C \uC720\uAE30\uC801\uC73C\uB85C \uACF5\uC804 \uBC0F \uD33D\uCC3D\xB7\uC218\uCD95(scale 0.85~1.2)\uD558\uAC8C \uD574 \uC918. \uBE14\uB86D\uB4E4\uC774 \uC911\uC559\uC5D0\uC11C \uACB9\uCE60 \uB54C blend-mode screen \uB610\uB294 color-dodge\uCC98\uB7FC \uBE5B\uC774 \uC99D\uD3ED\uB418\uC5B4 \uC740\uC740\uD55C \uC624\uB85C\uB77C \uAD11\uCC44\uB97C \uB9CC\uB4E4\uC5B4\uC57C \uD574. \uD504\uB808\uC784 \uBC14\uAE65\uC73C\uB85C \uBC88\uC9C0\uC9C0 \uC54A\uB3C4\uB85D overflow: hidden\uACFC 12px \uB465\uADFC \uBAA8\uC11C\uB9AC\uB85C \uD074\uB9AC\uD551\uD574 \uC918. \uC0C1\uB2E8 \uC911\uC559\uC5D0\uB294 \uC138\uB828\uB41C \uAE00\uB798\uC2A4\uBAA8\uD53C\uC998 \uBC43\uC9C0 \uD14D\uC2A4\uD2B8(\uBC18\uD22C\uBA85 \uD770\uC0C9 \uBC14\uD0D5, backdrop-blur 6px, \uAC00\uB294 \uD770\uC0C9 1px \uD14C\uB450\uB9AC)\uB97C \uC5B9\uC5B4 \uAE4A\uC774\uAC10\uC744 \uC2DC\uC5F0\uD574 \uC918. \uD074\uB9AD \uC2DC \uC560\uB2C8\uBA54\uC774\uC158 \uC8FC\uAE30\uAC00 \uB9AC\uC14B\uB418\uACE0, \uD654\uBA74 \uBC16\uC5D0\uC11C\uB294 \uD504\uB808\uC784 \uB8E8\uD504\uAC00 \uC815\uC9C0\uB418\uBA70, \uBAA8\uC158 \uAC10\uC18C \uD658\uACBD\uC5D0\uC11C\uB294 \uC815\uC801\uC778 \uC624\uB85C\uB77C \uADF8\uB77C\uB514\uC5B8\uD2B8 \uC815\uC9C0 \uD654\uBA74\uC744 \uBCF4\uC5EC \uC918.'
|
|
1461
|
+
},
|
|
1462
|
+
{
|
|
1463
|
+
id: "lay-bottom-sheet-modal",
|
|
1464
|
+
domain: "layout",
|
|
1465
|
+
category: "panel",
|
|
1466
|
+
titleKo: "\uC778\uD130\uB799\uD2F0\uBE0C \uBC14\uD140 \uC2DC\uD2B8 \uB4DC\uB85C\uC5B4",
|
|
1467
|
+
titleEn: "Interactive Bottom Sheet Drawer",
|
|
1468
|
+
summary: "\uC0C1\uB2E8 \uD578\uB4E4 \uBC14\uB97C \uB204\uB974\uBA74 \uD558\uB2E8\uC5D0\uC11C \uBD80\uB4DC\uB7FD\uAC8C \uC2AC\uB77C\uC774\uB4DC \uC5C5\uB418\uB294 \uCE74\uB4DC\uC640 \uBC18\uD22C\uBA85 \uB524 \uBC30\uACBD\uC758 \uBAA8\uBC14\uC77C \uC2A4\uD0C0\uC77C \uC11C\uB78D \uD328\uB110",
|
|
1469
|
+
vibeTag: "\uBAA8\uBC14\uC77C \uC571\uCC98\uB7FC \uBD80\uB4DC\uB7FD\uAC8C \uC62C\uB77C\uC624\uB294 \uBC14\uD140 \uC2DC\uD2B8",
|
|
1470
|
+
vibeKeywords: ["\uC11C\uB78D\uD615 \uBC14\uD140 \uC2DC\uD2B8", "\uBAA8\uBC14\uC77C \uB4DC\uB85C\uC5B4", "\uC2DC\uD2B8 \uBAA8\uB2EC", "\uC2AC\uB77C\uC774\uB4DC \uC5C5", "\uBAA8\uBC14\uC77C UI", "\uD578\uB4E4 \uBC14"],
|
|
1471
|
+
promptSnippet: '\uC9C0\uC815 \uC601\uC5ED\uC5D0 \uBAA8\uBC14\uC77C \uAE30\uAE30 \uD654\uBA74 \uBE44\uC728(240\xD7150 \uBBF8\uB9AC\uBCF4\uAE30)\uC744 \uD749\uB0B4 \uB0B8 \uC778\uD130\uB799\uD2F0\uBE0C \uBC14\uD140 \uC2DC\uD2B8 \uD328\uB110\uC744 \uB9CC\uB4E4\uC5B4 \uC918. \uCD08\uAE30\uC5D0\uB294 \uD558\uB2E8\uC5D0 \uB465\uADFC \uC0C1\uB2E8 \uBAA8\uC11C\uB9AC(16px)\uC640 \uC911\uC559\uC758 \uAC00\uB85C 36px/\uC138\uB85C 4px \uB465\uADFC \uD68C\uC0C9 \uD578\uB4E4 \uBC14\uB9CC 34px \uB192\uC774\uB85C \uC0B4\uC9DD \uB178\uCD9C\uB418\uC5B4 \uC788\uC5B4. \uD578\uB4E4 \uBC14\uB098 \uC2DC\uD2B8 \uC0C1\uB2E8\uC744 \uD074\uB9AD\uD558\uBA74 350ms cubic-bezier(.16,1,.3,1) \uC2A4\uD504\uB9C1 \uBAA8\uC158\uC73C\uB85C \uD328\uB110\uC774 translateY(0)\uC73C\uB85C \uBD80\uB4DC\uB7FD\uAC8C \uC19F\uC544\uC624\uB974\uACE0, \uB4B7\uBC30\uACBD\uC5D0\uB294 \uBC18\uD22C\uBA85 \uAC80\uC740\uC0C9 \uB524 \uC624\uBC84\uB808\uC774(opacity 0\u21920.45)\uAC00 \uAE54\uB824. \uC5F4\uB9B0 \uC2DC\uD2B8 \uC548\uC5D0\uB294 \uC561\uC158 \uBA54\uB274 \uD56D\uBAA9 2\uAC1C(\uACF5\uC720\uD558\uAE30, \uC800\uC7A5\uD558\uAE30)\uC640 \uB2EB\uAE30 \uD14D\uC2A4\uD2B8 \uBC84\uD2BC\uC774 \uB4E4\uC5B4\uAC00 \uC788\uC5B4. \uB524 \uC624\uBC84\uB808\uC774\uB098 \uB2EB\uAE30 \uBC84\uD2BC\uC744 \uB204\uB974\uBA74 \uD328\uB110\uC774 \uB2E4\uC2DC \uC544\uB798\uB85C translateY(116px) \uB0B4\uB824\uAC00\uBA70 \uB2EB\uD600. role="dialog"\uC640 aria-modal="true", aria-expanded\uB97C \uC62C\uBC14\uB974\uAC8C \uC801\uC6A9\uD558\uACE0, Escape \uD0A4\uB85C \uB2EB\uD790 \uC218 \uC788\uAC8C \uD574 \uC918. \uB77C\uC774\uD2B8 \uD14C\uB9C8(#ffffff \uD328\uB110, #1e293b \uD14D\uC2A4\uD2B8)\uC640 \uB2E4\uD06C \uD14C\uB9C8(#1e293b \uD328\uB110, #f8fafc \uD14D\uC2A4\uD2B8)\uB97C \uC9C0\uC6D0\uD558\uBA70, \uBAA8\uC158 \uAC10\uC18C \uD658\uACBD\uC5D0\uC11C\uB294 \uC2AC\uB77C\uC774\uB4DC \uC804\uD658 \uC5C6\uC774 \uC989\uC2DC \uC5F4\uB9AC\uACE0 \uB2EB\uD788\uB3C4\uB85D \uD574 \uC918.'
|
|
1472
|
+
},
|
|
1473
|
+
{
|
|
1474
|
+
id: "ui-swipe-to-confirm",
|
|
1475
|
+
domain: "ui",
|
|
1476
|
+
category: "control",
|
|
1477
|
+
titleKo: "\uC2AC\uB77C\uC774\uB4DC \uC7A0\uAE08\uD574\uC81C \uD655\uC815 \uBC84\uD2BC",
|
|
1478
|
+
titleEn: "Swipe to Confirm Action Slider",
|
|
1479
|
+
summary: "\uAC00\uB85C \uD2B8\uB799 \uC704 \uC6D0\uD615 \uD578\uB4E4\uC744 \uC624\uB978\uCABD \uB05D(80% \uC774\uC0C1)\uAE4C\uC9C0 \uBC00\uBA74 \uACB0\uC81C\uAC00 \uC2B9\uC778\uB418\uACE0, \uC911\uAC04\uC5D0 \uB193\uC73C\uBA74 \uD0C4\uC131 \uC788\uAC8C \uC6D0\uC704\uCE58\uB85C \uB418\uB3CC\uC544\uAC00\uB294 \uC548\uC2EC \uC2AC\uB77C\uC774\uB354",
|
|
1480
|
+
vibeTag: "\uC624\uB978\uCABD \uB05D\uAE4C\uC9C0 \uBC00\uC5B4\uC57C \uD655\uC815\uB418\uB294 \uC548\uC2EC \uBC84\uD2BC",
|
|
1481
|
+
vibeKeywords: ["\uC2AC\uB77C\uC774\uB4DC \uD655\uC815", "\uBC00\uC5B4\uC11C \uC7A0\uAE08\uD574\uC81C", "\uC2A4\uC640\uC774\uD504 \uACB0\uC81C", "\uC548\uC2EC \uC2AC\uB77C\uC774\uB354", "\uC2E4\uC218 \uBC29\uC9C0 \uBC84\uD2BC"],
|
|
1482
|
+
promptSnippet: '\uC9C0\uC815 \uC601\uC5ED\uC5D0 220\xD746 \uD06C\uAE30\uC758 \uC2AC\uB77C\uC774\uB4DC \uD655\uC815(Swipe to Confirm) \uBC84\uD2BC\uC744 \uB9CC\uB4E4\uC5B4 \uC918. \uB465\uADFC \uCEA1\uC290\uD615 \uD2B8\uB799(#e2e8f0 \uBC14\uD0D5, \uB2E4\uD06C #1e293b) \uC911\uC559\uC5D0\uB294 \uC740\uC740\uD55C 12px \uC548\uB0B4 \uBB38\uAD6C("\uBC00\uC5B4\uC11C \uACB0\uC81C\uD558\uAE30")\uB97C \uD45C\uC2DC\uD558\uACE0, \uC67C\uCABD\uC5D0\uB294 38\xD738 \uD06C\uAE30\uC758 \uC6D0\uD615 \uB4DC\uB798\uADF8 \uD578\uB4E4(#ffffff, \uB2E4\uD06C #334155, \uC624\uB978\uCABD \uD654\uC0B4\uD45C \uC544\uC774\uCF58)\uC744 \uBC30\uCE58\uD574 \uC918. \uB9C8\uC6B0\uC2A4\uB098 \uD130\uCE58\uB85C \uD578\uB4E4\uC744 \uC624\uB978\uCABD\uC73C\uB85C \uB04C\uC5B4\uB2F9\uAE38 \uC218 \uC788\uACE0, \uB4DC\uB798\uADF8 \uC9C4\uD589\uB960(0~100%)\uC5D0 \uB530\uB77C \uD2B8\uB799 \uC548\uCABD\uC774 \uCD08\uB85D\uBE5B \uADF8\uB77C\uB514\uC5B8\uD2B8\uB85C \uCC44\uC6CC\uC9C0\uBA70 \uC548\uB0B4 \uBB38\uAD6C\uC758 \uD22C\uBA85\uB3C4\uAC00 \uC904\uC5B4\uB4E4\uC5B4\uC57C \uD574. \uB4DC\uB798\uADF8\uAC00 80% \uBBF8\uB9CC\uC5D0\uC11C \uB05D\uB098\uBA74 250ms \uC2A4\uD504\uB9C1 \uAC10\uC18D\uC73C\uB85C \uC6D0\uC704\uCE58(0)\uB85C \uB418\uB3CC\uC544\uAC00\uACE0, 80%\uB97C \uB118\uACA8 \uB05D\uC5D0 \uB3C4\uB2EC\uD558\uBA74 \uD578\uB4E4\uC774 \uCD08\uB85D\uC0C9 \uCCB4\uD06C \uC544\uC774\uCF58\uC73C\uB85C \uBC14\uB00C\uBA70 \uD2B8\uB799 \uC804\uCCB4\uAC00 \uACB0\uC81C \uC2B9\uC778 \uC644\uB8CC \uC0C1\uD0DC\uB85C \uACE0\uC815\uB3FC. \uC2B9\uC778 \uC644\uB8CC \uC0C1\uD0DC\uC5D0\uC11C \uD074\uB9AD\uD558\uBA74 \uB2E4\uC2DC \uCC98\uC74C \uB300\uAE30 \uC0C1\uD0DC\uB85C \uB9AC\uC14B\uD574 \uC918. role="slider", aria-valuemin="0", aria-valuemax="100", aria-valuenow\uB97C \uC5F0\uB3D9\uD558\uACE0, \uD0A4\uBCF4\uB4DC \uC88C\uC6B0 \uD654\uC0B4\uD45C \uD0A4 \uC870\uC791\uC744 \uC9C0\uC6D0\uD558\uBA70, \uBAA8\uC158 \uAC10\uC18C \uD658\uACBD\uC5D0\uC11C\uB294 \uB4DC\uB798\uADF8 \uBAA8\uC158 \uC5C6\uC774 \uD074\uB9AD \uD55C \uBC88\uC73C\uB85C \uD655\uC815 \uC0C1\uD0DC\uB85C \uC804\uD658\uB418\uAC8C \uD574 \uC918.'
|
|
1483
|
+
},
|
|
1484
|
+
{
|
|
1485
|
+
id: "ui-cli-command-switcher",
|
|
1486
|
+
domain: "ui",
|
|
1487
|
+
category: "layout",
|
|
1488
|
+
titleKo: "\uD328\uD0A4\uC9C0 \uB9E4\uB2C8\uC800 \uD130\uBBF8\uB110 \uBE14\uB85D",
|
|
1489
|
+
titleEn: "CLI Package Manager Switcher",
|
|
1490
|
+
summary: "\uC0C1\uB2E8 \uD0ED(npm, pnpm, yarn, bun) \uC120\uD0DD\uC5D0 \uB530\uB77C \uBA85\uB839\uC5B4\uAC00 \uC2E4\uC2DC\uAC04 \uCE58\uD658\uB418\uACE0, \uC6B0\uCE21 \uBCF5\uC0AC \uBC84\uD2BC \uD074\uB9AD \uC2DC \uD53C\uB4DC\uBC31\uC774 \uC81C\uACF5\uB418\uB294 \uAC1C\uBC1C \uBB38\uC11C \uD130\uBBF8\uB110 \uCEF4\uD3EC\uB10C\uD2B8",
|
|
1491
|
+
vibeTag: "npm\uACFC pnpm\uC744 \uC6D0\uD074\uB9AD\uC73C\uB85C \uC624\uAC00\uB294 \uD130\uBBF8\uB110",
|
|
1492
|
+
vibeKeywords: ["CLI \uD0ED \uBE14\uB85D", "\uD328\uD0A4\uC9C0 \uB9E4\uB2C8\uC800", "\uD130\uBBF8\uB110 \uBCF5\uC0AC", "\uBA85\uB839\uC5B4 \uD0ED", "\uCF54\uB4DC\uBE14\uB85D"],
|
|
1493
|
+
promptSnippet: '\uC9C0\uC815 \uC601\uC5ED\uC5D0 260\xD7110 \uD06C\uAE30\uC758 \uBAA8\uB358 \uAC1C\uBC1C\uC790 \uBB38\uC11C\uC6A9 CLI \uBA85\uB839\uC5B4 \uCF54\uB4DC \uBE14\uB85D\uC744 \uB9CC\uB4E4\uC5B4 \uC918. \uC9D9\uC740 \uB2E4\uD06C \uC2AC\uB808\uC774\uD2B8(#0f172a) \uBC30\uACBD\uC5D0 \uC0C1\uB2E8 \uD5E4\uB354\uC5D0\uB294 npm, pnpm, yarn, bun 4\uAC1C\uC758 \uBBF8\uB2C8 \uD0ED \uBC84\uD2BC(\uD65C\uC131 \uD0ED\uC740 #334155 \uBC30\uACBD\uACFC \uBC1D\uC740 \uD14D\uC2A4\uD2B8)\uC744 \uB450\uACE0, \uC624\uB978\uCABD \uB05D\uC5D0\uB294 \uC0AC\uAC01 \uD14C\uB450\uB9AC\uC758 \uBCF5\uC0AC \uBC84\uD2BC\uC744 \uBC30\uCE58\uD574 \uC918. \uD0ED\uC744 \uD074\uB9AD\uD558\uBA74 \uC544\uB798 \uCF58\uC194 \uC601\uC5ED\uC758 \uC124\uCE58 \uBA85\uB839\uC5B4\uAC00 \uC989\uC2DC \uD574\uB2F9 \uD328\uD0A4\uC9C0 \uB9E4\uB2C8\uC800 \uBB38\uBC95(\uC608: npm i vs pnpm add vs yarn add vs bun add)\uC73C\uB85C \uBC14\uB00C\uC5B4 \uCD9C\uB825\uB3FC. \uBA85\uB839\uC5B4 \uC55E\uC5D0\uB294 \uBCF4\uB77C\uC0C9 \uD130\uBBF8\uB110 \uD504\uB86C\uD504\uD2B8 \uAE30\uD638("$")\uB97C \uACE0\uC815 \uD45C\uC2DC\uD558\uACE0, \uC6B0\uCE21 \uBCF5\uC0AC \uBC84\uD2BC\uC744 \uB204\uB974\uBA74 \uD074\uB9BD\uBCF4\uB4DC\uC5D0 \uD574\uB2F9 \uBB38\uC790\uC5F4\uC774 \uBCF5\uC0AC\uB418\uBA70 1.5\uCD08\uAC04 \uCD08\uB85D\uC0C9 \uCCB4\uD06C \uC544\uC774\uCF58\uACFC "Copied!" \uD234\uD301 \uD53C\uB4DC\uBC31\uC73C\uB85C \uC804\uD658\uB3FC. role="tablist", role="tab", aria-selected\uB97C \uC62C\uBC14\uB974\uAC8C \uC801\uC6A9\uD558\uACE0, \uC881\uC740 \uD654\uBA74\uC5D0\uC11C\uB3C4 \uC218\uD3C9 \uC2A4\uD06C\uB864 \uC5C6\uC774 \uCD95\uC18C \uC9C0\uC6D0\uD558\uBA70, \uBAA8\uC158 \uAC10\uC18C \uD658\uACBD\uC5D0\uC11C\uB294 \uBCF5\uC0AC \uC804\uD658 \uC560\uB2C8\uBA54\uC774\uC158 \uC5C6\uC774 \uC544\uC774\uCF58\uB9CC \uC989\uC2DC \uC804\uD658\uB418\uAC8C \uD574 \uC918.'
|
|
1494
|
+
},
|
|
1495
|
+
{
|
|
1496
|
+
id: "ui-interactive-kbd-key",
|
|
1497
|
+
domain: "ui",
|
|
1498
|
+
category: "hover",
|
|
1499
|
+
titleKo: "3D \uD0C0\uAC74 \uD53C\uB4DC\uBC31 KBD \uBC43\uC9C0",
|
|
1500
|
+
titleEn: "Interactive 3D KBD Key",
|
|
1501
|
+
summary: "\uAE30\uACC4\uC2DD \uD0A4\uBCF4\uB4DC \uD0A4\uCEA1\uCC98\uB7FC \uBC14\uB2E5\uC5D0 3D \uB2E8\uCC28 \uADF8\uB9BC\uC790\uAC00 \uC801\uC6A9\uB418\uC5B4 \uB9C8\uC6B0\uC2A4 \uD074\uB9AD\uC774\uB098 \uD0A4 \uC785\uB825 \uC2DC \uC2E4\uC81C\uB85C \uC465 \uB20C\uB824 \uB4E4\uC5B4\uAC00\uB294 \uC785\uCCB4 \uB2E8\uCD95\uD0A4 \uBC43\uC9C0",
|
|
1502
|
+
vibeTag: "\uD0A4\uBCF4\uB4DC \uD0A4\uCEA1\uCC98\uB7FC \uC3D9 \uB20C\uB9AC\uB294 \uB2E8\uCD95\uD0A4 \uBC43\uC9C0",
|
|
1503
|
+
vibeKeywords: ["\uD0C0\uAC74 KBD \uBC43\uC9C0", "\uB2E8\uCD95\uD0A4 \uBC43\uC9C0", "KBD \uD0DC\uADF8", "\uD0A4\uCEA1 \uC778\uD130\uB799\uC158", "\uD0A4 \uB204\uB984 \uD53C\uB4DC\uBC31"],
|
|
1504
|
+
promptSnippet: '\uC9C0\uC815 \uC601\uC5ED\uC5D0 \uC2E4\uC81C \uAE30\uACC4\uC2DD \uD0A4\uBCF4\uB4DC \uD0A4\uCEA1\uC758 \uBB3C\uB9AC\uC801 \uB20C\uB9BC(Key-press)\uC744 \uC7AC\uD604\uD55C \uC778\uD130\uB799\uD2F0\uBE0C KBD \uB2E8\uCD95\uD0A4 \uCEF4\uD3EC\uB10C\uD2B8\uB97C \uB9CC\uB4E4\uC5B4 \uC918. "\u2318 Command" \uD0A4\uC640 "K" \uD0A4 \uB450 \uAC1C\uC758 \uD0A4\uCEA1\uC774 \uB098\uB780\uD788 \uB193\uC5EC \uC788\uACE0, \uAC01 \uD0A4\uCEA1\uC740 \uB450\uAEBC\uC6B4 3D \uD558\uB2E8 \uADF8\uB9BC\uC790(box-shadow: 0 4px 0 #94a3b8, \uB2E4\uD06C #1e293b)\uC640 1px \uD14C\uB450\uB9AC, \uB465\uADFC \uBAA8\uC11C\uB9AC(6px)\uB97C \uAC16\uCD94\uACE0 \uC788\uC5B4. \uB9C8\uC6B0\uC2A4\uB85C \uD0A4\uCEA1\uC744 \uD074\uB9AD\uD558\uAC70\uB098 \uD0A4\uBCF4\uB4DC\uB97C \uB204\uB974\uBA74 100ms \uB3D9\uC548 transform: translateY(3px)\uC640 \uD568\uAED8 \uD558\uB2E8 \uADF8\uB9BC\uC790\uAC00 1px\uB85C \uB0A9\uC791\uD558\uAC8C \uC555\uCD95\uB418\uBA70 \uC2E4\uC81C \uAE30\uACC4\uC2DD \uC2A4\uC704\uCE58\uAC00 \uB20C\uB9AC\uB294 \uB4EF\uD55C \uD0C0\uAC74\uAC10\uC744 \uC2DC\uAC01\uC801\uC73C\uB85C \uC804\uB2EC\uD574\uC57C \uD574. \uD0A4\uB97C \uB204\uB974\uB294 \uC21C\uAC04 \uC544\uB798\uCABD\uC5D0 \uC791\uC740 \uCEA1\uC290 \uBC43\uC9C0\uB85C "\uCEE4\uB9E8\uB4DC \uD314\uB808\uD2B8 \uC2E4\uD589!" \uD53C\uB4DC\uBC31\uC774 \uBC18\uC9DD \uB098\uD0C0\uB098. \uC6F9 \uD45C\uC900 kbd \uD0DC\uADF8\uB97C \uC0AC\uC6A9\uD558\uACE0, Enter\uC640 Space \uD0A4\uBCF4\uB4DC \uC870\uC791\uC744 \uC9C0\uC6D0\uD558\uBA70, \uB77C\uC774\uD2B8/\uB2E4\uD06C \uD14C\uB9C8 \uB300\uBE44\uC640 \uBAA8\uC158 \uAC10\uC18C \uC2DC \uC989\uC2DC \uB20C\uB9BC \uC0C1\uD0DC\uB97C \uC9C0\uC6D0\uD574 \uC918.'
|
|
1505
|
+
},
|
|
1506
|
+
{
|
|
1507
|
+
id: "ui-tear-off-coupon-card",
|
|
1508
|
+
domain: "ui",
|
|
1509
|
+
category: "card",
|
|
1510
|
+
titleKo: "\uC808\uCDE8\uC120 \uB72F\uAE40 \uCFE0\uD3F0 \uBC14\uC6B0\uCC98 \uCE74\uB4DC",
|
|
1511
|
+
titleEn: "Perforated Tear-Off Coupon Card",
|
|
1512
|
+
summary: "\uC591\uC606 \uBC18\uC6D0 \uD648\uACFC \uC911\uC559 \uC810\uC120 \uC808\uCDE8\uC120\uC774 \uC788\uB294 \uD2F0\uCF13 \uCE74\uB4DC\uC5D0\uC11C \uCFE0\uD3F0 \uBC1B\uAE30\uB97C \uB204\uB974\uBA74 \uC810\uC120\uC774 \uBD84\uB9AC\uB418\uBA70 \uBC1C\uAE09 \uC644\uB8CC \uC2A4\uD0EC\uD504\uAC00 \uAE30\uC6B8\uC5B4\uC838 \uCC0D\uD788\uB294 \uBC14\uC6B0\uCC98 \uC778\uD130\uB799\uC158",
|
|
1513
|
+
vibeTag: "\uC810\uC120\uC774 \uCC0C\uC775 \uB72F\uC5B4\uC9C0\uBA70 \uC2A4\uD0EC\uD504\uAC00 \uCC0D\uD788\uB294",
|
|
1514
|
+
vibeKeywords: ["\uC808\uCDE8\uC120 \uCFE0\uD3F0", "\uD2F0\uCF13 \uCE74\uB4DC", "\uC810\uC120 \uB72F\uAE30", "\uCFE0\uD3F0 \uBC14\uC6B0\uCC98", "\uBC1C\uAE09 \uC2A4\uD0EC\uD504"],
|
|
1515
|
+
promptSnippet: '\uC9C0\uC815 \uC601\uC5ED\uC5D0 260\xD790 \uD06C\uAE30\uC758 \uC808\uCDE8\uC120 \uD2F0\uCF13 \uCFE0\uD3F0 \uCE74\uB4DC\uB97C \uB9CC\uB4E4\uC5B4 \uC918. \uCE74\uB4DC \uBCF8\uCCB4\uB294 \uC88C\uC6B0 \uB450 \uC601\uC5ED\uC73C\uB85C \uB098\uB258\uBA70, \uADF8 \uACBD\uACC4\uC120\uC5D0\uB294 \uC591\uCABD \uAC00\uC7A5\uC790\uB9AC\uC5D0 \uC9C0\uB984 16px\uC758 \uB3D9\uADF8\uB780 \uD380\uCE6D \uD648\uACFC \uC911\uC559\uC758 \uC138\uB85C \uC810\uC120 \uC808\uCDE8\uC120(border-right: 2px dashed)\uC774 \uC788\uC5B4. \uC67C\uCABD \uB113\uC740 \uC601\uC5ED\uC5D0\uB294 "15% OFF" \uAC15\uC870 \uC22B\uC790\uC640 "WELCOME VIBE" \uC11C\uBE0C \uD14D\uC2A4\uD2B8\uB97C \uBC30\uCE58\uD558\uACE0, \uC624\uB978\uCABD \uC881\uC740 \uAF2C\uB9AC\uD45C \uC601\uC5ED\uC5D0\uB294 "\uCFE0\uD3F0 \uBC1B\uAE30" \uBC84\uD2BC\uC744 \uB46C. \uBC84\uD2BC\uC744 \uD074\uB9AD\uD558\uBA74 400ms \uB3D9\uC548 \uC624\uB978\uCABD \uAF2C\uB9AC\uD45C\uAC00 \uC624\uB978\uCABD\uC73C\uB85C 8px \uC774\uB3D9\uD558\uACE0 3\uB3C4 \uC0B4\uC9DD \uAE30\uC6B8\uC5B4\uC9C0\uBA70(rotate: 3deg) \uC808\uCDE8\uC120\uC774 \uC2E4\uC81C\uB85C \uB72F\uACA8\uB098\uAC00\uB294 \uB4EF\uD55C \uBAA8\uC158\uC774 \uBC1C\uC0DD\uD558\uACE0, \uC67C\uCABD \uBCF8\uCCB4 \uC704\uC5D0\uB294 \uBE68\uAC04\uC0C9 "\uBC1C\uAE09 \uC644\uB8CC" \uC789\uD06C \uC2A4\uD0EC\uD504\uAC00 300ms \uBC14\uC6B4\uC2A4\uC640 \uD568\uAED8 \uCF85 \uCC0D\uD600. \uC774\uBBF8 \uBC1C\uAE09\uB41C \uC0C1\uD0DC\uC5D0\uC11C \uB2E4\uC2DC \uD074\uB9AD\uD558\uBA74 \uC6D0\uB798\uB300\uB85C \uCD08\uAE30\uD654\uB3FC. \uC591\uD14C\uB9C8 \uC0C9\uC0C1 \uB300\uBE44\uC640 \uD0A4\uBCF4\uB4DC \uC811\uADFC\uC131(Enter/Space)\uC744 \uC9C0\uC6D0\uD558\uACE0, \uBAA8\uC158 \uAC10\uC18C \uD658\uACBD\uC5D0\uC11C\uB294 \uC808\uCDE8\uC120 \uBD84\uB9AC \uC560\uB2C8\uBA54\uC774\uC158 \uC5C6\uC774 \uC989\uC2DC \uBC1C\uAE09 \uC2A4\uD0EC\uD504 \uC0C1\uD0DC\uB85C \uC804\uD658\uB418\uAC8C \uD574 \uC918.'
|
|
1516
|
+
},
|
|
1517
|
+
{
|
|
1518
|
+
id: "ui-file-dropzone-uploader",
|
|
1519
|
+
domain: "ui",
|
|
1520
|
+
category: "feedback",
|
|
1521
|
+
titleKo: "\uD30C\uC77C \uB4DC\uB86D\uC874 \uC5C5\uB85C\uB354",
|
|
1522
|
+
titleEn: "File Dropzone Uploader",
|
|
1523
|
+
summary: "\uC810\uC120 \uB4DC\uB798\uADF8 \uC601\uC5ED \uC704\uB85C \uD30C\uC77C\uC744 \uB04C\uACE0 \uC62C \uB54C \uD14C\uB450\uB9AC\uAC00 \uD384\uC2A4\uD558\uACE0, \uB4DC\uB86D \uC2DC \uD504\uB85C\uADF8\uB808\uC2A4 \uBC14\uC640 \uD568\uAED8 \uC644\uB8CC \uCCB4\uD06C\uB9C8\uD06C\uAC00 \uB728\uB294 \uD30C\uC77C \uC5C5\uB85C\uB354",
|
|
1524
|
+
vibeTag: "\uB4DC\uB798\uADF8 \uC624\uBC84 \uC2DC \uC740\uC740\uD558\uAC8C \uBC18\uC751\uD558\uB294 \uC5C5\uB85C\uB4DC \uC874",
|
|
1525
|
+
vibeKeywords: ["\uD30C\uC77C \uC5C5\uB85C\uB4DC \uB4DC\uB86D\uC874", "\uB4DC\uB798\uADF8 \uC564 \uB4DC\uB86D \uC5C5\uB85C\uB354", "\uCCA8\uBD80\uD30C\uC77C \uD504\uB85C\uADF8\uB808\uC2A4", "\uD30C\uC77C \uC778\uD48B \uC704\uC82F", "\uC5C5\uB85C\uB4DC \uD504\uB85C\uADF8\uB808\uC2A4 \uBC14"],
|
|
1526
|
+
promptSnippet: '\uC9C0\uC815 \uC601\uC5ED\uC5D0 260\xD7110 \uD06C\uAE30\uC758 \uBAA8\uB358 \uD30C\uC77C \uB4DC\uB86D\uC874(Dropzone) \uC5C5\uB85C\uB354\uB97C \uB9CC\uB4E4\uC5B4 \uC918. \uAE30\uBCF8 \uC0C1\uD0DC\uC5D0\uC11C\uB294 \uD68C\uC0C9 \uC810\uC120 \uD14C\uB450\uB9AC(border: 2px dashed #cbd5e1) \uC548\uC5D0 \uAD6C\uB984 \uC5C5\uB85C\uB4DC \uC544\uC774\uCF58\uACFC "\uD30C\uC77C\uC744 \uB04C\uC5B4\uB2E4 \uB193\uAC70\uB098 \uD074\uB9AD" \uC548\uB0B4 \uBB38\uAD6C\uAC00 \uD45C\uC2DC\uB3FC. \uB9C8\uC6B0\uC2A4\uB97C \uC62C\uB9AC\uAC70\uB098 \uB4DC\uB798\uADF8\uD560 \uB54C \uD14C\uB450\uB9AC\uAC00 \uC120\uBA85\uD55C \uC778\uB514\uACE0 \uBE14\uB8E8(#6366f1)\uB85C \uBC14\uB00C\uBA70 \uBBF8\uC138\uD55C \uD384\uC2A4 \uAE00\uB85C\uC6B0 \uD6A8\uACFC\uB97C \uC918. \uC601\uC5ED\uC744 \uD074\uB9AD\uD558\uBA74 \uD30C\uC77C \uC5C5\uB85C\uB4DC \uBAA8\uC758 \uC0C1\uD0DC\uAC00 \uC2DC\uC791\uB418\uC5B4, \uD30C\uC77C \uC544\uC774\uCF58\uACFC \uD568\uAED8 "document_vibe.pdf (2.4 MB)" \uC815\uBCF4\uC640 \uAC00\uB85C \uAC8C\uC774\uC9C0 \uBC14(0%\u2192100%)\uAC00 800ms \uB3D9\uC548 \uBD80\uB4DC\uB7FD\uAC8C \uCC28\uC62C\uB77C. 100%\uC5D0 \uB3C4\uB2EC\uD558\uBA74 \uCD08\uB85D\uC0C9 \uCCB4\uD06C\uB9C8\uD06C \uBC30\uC9C0\uC640 "\uC5C5\uB85C\uB4DC \uC644\uB8CC" \uC0C1\uD0DC\uB85C \uC804\uD658\uB418\uBA70, \uC644\uB8CC \uC0C1\uD0DC\uC5D0\uC11C \uB2E4\uC2DC \uD074\uB9AD\uD558\uBA74 \uCD08\uAE30 \uC0C1\uD0DC\uB85C \uB9AC\uC14B\uB3FC. \uD0A4\uBCF4\uB4DC Enter/Space \uC811\uADFC\uC131\uACFC \uC591\uD14C\uB9C8(#ffffff / #1e293b)\uB97C \uC9C0\uC6D0\uD558\uACE0, \uBAA8\uC158 \uAC10\uC18C \uD658\uACBD\uC5D0\uC11C\uB294 \uD504\uB85C\uADF8\uB808\uC2A4 \uC560\uB2C8\uBA54\uC774\uC158 \uC5C6\uC774 \uC989\uC2DC \uC644\uB8CC \uC0C1\uD0DC\uB97C \uBCF4\uC5EC \uC918.'
|
|
1527
|
+
},
|
|
1528
|
+
{
|
|
1529
|
+
id: "ui-liquid-segmented-control",
|
|
1530
|
+
domain: "ui",
|
|
1531
|
+
category: "layout",
|
|
1532
|
+
titleKo: "\uB9AC\uD034\uB4DC \uC138\uADF8\uBA3C\uD2B8 \uCEE8\uD2B8\uB864\uB7EC",
|
|
1533
|
+
titleEn: "Liquid Segmented Control",
|
|
1534
|
+
summary: "iOS \uC2A4\uD0C0\uC77C\uB85C \uD0ED \uC120\uD0DD \uC2DC \uBC30\uACBD \uC54C\uC57D \uC778\uB514\uCF00\uC774\uD130\uAC00 \uC824\uB9AC\uCC98\uB7FC \uB298\uC5B4\uB0AC\uB2E4 \uCC29 \uB2EC\uB77C\uBD99\uB294 \uCAC0\uB4DD\uD55C \uC138\uADF8\uBA3C\uD2B8 \uC2A4\uC704\uCC98",
|
|
1535
|
+
vibeTag: "\uC824\uB9AC\uCC98\uB7FC \uB298\uC5B4\uB0AC\uB2E4 \uCC29 \uB2EC\uB77C\uBD99\uB294 \uC54C\uC57D \uD0ED",
|
|
1536
|
+
vibeKeywords: ["\uB9AC\uD034\uB4DC \uC138\uADF8\uBA3C\uD2B8 \uCEE8\uD2B8\uB864", "\uC824\uB9AC \uC54C\uC57D \uD0ED", "\uC2A4\uD504\uB9C1 \uC138\uADF8\uBA3C\uD2B8 \uD1A0\uAE00", "\uCAC0\uB4DD\uD55C \uD0ED \uC2A4\uC704\uCC98", "iOS \uC138\uADF8\uBA3C\uD2B8"],
|
|
1537
|
+
promptSnippet: '\uC9C0\uC815 \uC601\uC5ED\uC5D0 iOS \uC2A4\uD0C0\uC77C\uC758 \uCAC0\uB4DD\uD55C \uB9AC\uD034\uB4DC \uC138\uADF8\uBA3C\uD2B8 \uCEE8\uD2B8\uB864\uB7EC(Segmented Control)\uB97C \uB9CC\uB4E4\uC5B4 \uC918. \uB465\uADFC \uCEA1\uC290\uD615 \uD2B8\uB799(#e2e8f0 \uBC14\uD0D5, \uB2E4\uD06C #0f172a) \uC548\uC5D0 "\uC77C\uAC04", "\uC8FC\uAC04", "\uC6D4\uAC04" 3\uAC1C\uC758 \uD0ED \uBC84\uD2BC\uC774 \uB098\uB780\uD788 \uBC30\uCE58\uB418\uC5B4 \uC788\uC5B4. \uC120\uD0DD\uB41C \uD0ED \uB4A4\uC5D0\uB294 \uD770\uC0C9 \uD50C\uB85C\uD305 \uC54C\uC57D(Pill, box-shadow: 0 2px 8px rgba(0,0,0,0.12))\uC774 \uAE54\uB824 \uC788\uACE0, \uB2E4\uB978 \uD0ED\uC744 \uD074\uB9AD\uD558\uBA74 \uC54C\uC57D\uC774 \uC774\uB3D9 \uBC29\uD5A5\uC73C\uB85C \uC21C\uAC04\uC801\uC73C\uB85C \uAC00\uB85C \uD3ED\uC774 1.25\uBC30\uB85C \uCAC0\uB4DD\uD558\uAC8C \uB298\uC5B4\uB0AC\uB2E4\uAC00(elastic stretch) \uBAA9\uD45C \uC704\uCE58\uC5D0 \uC2A4\uD504\uB9C1 \uBC14\uC6B4\uC2A4\uB85C \uCC29 \uC548\uCC29\uD574. \uD65C\uC131 \uD0ED \uD14D\uC2A4\uD2B8\uB294 \uAD75\uC740 \uC9C4\uD55C \uAE00\uC528\uB85C, \uBE44\uD65C\uC131 \uD0ED \uD14D\uC2A4\uD2B8\uB294 \uC911\uAC04 \uD68C\uC0C9\uC73C\uB85C \uBD80\uB4DC\uB7FD\uAC8C \uC0C9\uC0C1\uC774 \uC804\uD658\uB3FC. role="tablist"\uC640 role="tab", aria-selected\uB97C \uAC16\uCD94\uACE0 \uD0A4\uBCF4\uB4DC \uC88C\uC6B0 \uD654\uC0B4\uD45C \uD0A4 \uC870\uC791\uC744 \uC9C0\uC6D0\uD558\uBA70, \uBAA8\uC158 \uAC10\uC18C \uD658\uACBD\uC5D0\uC11C\uB294 \uC2E0\uCD95 \uC65C\uACE1 \uC5C6\uC774 \uC704\uCE58\uB9CC \uC989\uC2DC \uC774\uB3D9\uD558\uB3C4\uB85D \uD574 \uC918.'
|
|
1538
|
+
},
|
|
1539
|
+
{
|
|
1540
|
+
id: "ui-3d-interactive-bank-card",
|
|
1541
|
+
domain: "ui",
|
|
1542
|
+
category: "card",
|
|
1543
|
+
titleKo: "3D \uC778\uD130\uB799\uD2F0\uBE0C \uACB0\uC81C \uCE74\uB4DC",
|
|
1544
|
+
titleEn: "3D Interactive Payment Card",
|
|
1545
|
+
summary: "\uCE74\uB4DC \uBC88\uD638\uAC00 \uC740\uBC15 \uC5E0\uBCF4\uC2F1\uC73C\uB85C \uC0C8\uACA8\uC9C0\uACE0, CVC \uBC84\uD2BC \uD074\uB9AD \uC2DC 180\uB3C4 \uBD80\uB4DC\uB7FD\uAC8C \uB4A4\uC9D1\uD788\uBA70 \uB4B7\uBA74 \uB9C8\uADF8\uB124\uD2F1 \uB760\uAC00 \uB178\uCD9C\uB418\uB294 \uC2E0\uC6A9\uCE74\uB4DC",
|
|
1546
|
+
vibeTag: "\uC55E\uBA74\uACFC \uB4B7\uBA74\uC774 3D\uB85C \uB4A4\uC9D1\uD788\uB294 \uD504\uB9AC\uBBF8\uC5C4 \uCE74\uB4DC",
|
|
1547
|
+
vibeKeywords: ["3D \uC778\uD130\uB799\uD2F0\uBE0C \uACB0\uC81C \uCE74\uB4DC", "\uC2E0\uC6A9\uCE74\uB4DC 3D \uD50C\uB9BD", "\uC5E0\uBCF4\uC2F1 \uBC45\uD06C \uCE74\uB4DC", "\uACB0\uC81C \uD3FC \uCE74\uB4DC \uB4A4\uC9D1\uAE30", "\uD540\uD14C\uD06C \uCE74\uB4DC \uD50C\uB9BD"],
|
|
1548
|
+
promptSnippet: '\uC9C0\uC815 \uC601\uC5ED\uC5D0 240\xD7140 \uD06C\uAE30\uC758 \uD504\uB9AC\uBBF8\uC5C4 3D \uC2E0\uC6A9\uCE74\uB4DC \uCEF4\uD3EC\uB10C\uD2B8\uB97C \uB9CC\uB4E4\uC5B4 \uC918. \uCE74\uB4DC \uC55E\uBA74(Front)\uC740 \uAE4A\uC740 \uC0AC\uD30C\uC774\uC5B4 \uB124\uC774\uBE44 \uADF8\uB77C\uB514\uC5B8\uD2B8 \uBC14\uD0D5\uC5D0 \uD669\uAE08\uC0C9 \uB9C8\uC774\uD06C\uB85C\uCE69, 16\uC790\uB9AC \uC591\uAC01(Embossed) \uBC88\uD638("\u2022\u2022\u2022\u2022 \u2022\u2022\u2022\u2022 \u2022\u2022\u2022\u2022 4242"), \uC720\uD6A8\uAE30\uAC04("12/28"), \uC2E4\uBC84 \uAD11\uD0DD\uC758 \uBE0C\uB79C\uB4DC \uB85C\uACE0\uB97C \uD45C\uC2DC\uD574 \uC918. \uCE74\uB4DC \uB4B7\uBA74(Back)\uC740 \uC0C1\uB2E8\uC5D0 \uAC80\uC740\uC0C9 \uB9C8\uADF8\uB124\uD2F1 \uB760(Magnetic Strip), \uD770\uC0C9 \uC11C\uBA85\uB780, \uADF8\uB9AC\uACE0 3\uC790\uB9AC CVC \uCF54\uB4DC("883")\uAC00 \uD45C\uC2DC\uB3FC. "\uCE74\uB4DC \uB4A4\uC9D1\uAE30" \uD1A0\uAE00 \uBC84\uD2BC\uC744 \uB204\uB974\uBA74 500ms cubic-bezier(.16,1,.3,1) \uB3D9\uC548 \uCE74\uB4DC\uAC00 perspective(800px) \uC18D\uC5D0\uC11C Y\uCD95\uC73C\uB85C 180\uB3C4 \uBD80\uB4DC\uB7FD\uAC8C \uB4A4\uC9D1\uD600(rotateY 0deg \u2194 180deg). backface-visibility: hidden\uC744 \uC801\uC6A9\uD574 \uC55E\uB4A4 \uBA74\uC774 \uAE54\uB054\uD558\uAC8C \uC804\uD658\uB418\uACE0, \uB9C8\uC6B0\uC2A4 \uD638\uBC84 \uC2DC \uCE74\uB4DC \uD45C\uBA74\uC5D0 \uC740\uC740\uD55C \uC0AC\uC120 \uAD11\uD0DD(Sheen)\uC774 \uD758\uB7EC. \uD0A4\uBCF4\uB4DC \uC811\uADFC\uC131\uACFC \uBAA8\uC158 \uAC10\uC18C \uD658\uACBD(\uD68C\uC804 \uD2B8\uB79C\uC9C0\uC158 \uC5C6\uC774 \uC989\uC2DC \uBA74 \uC804\uD658)\uC744 \uC9C0\uC6D0\uD574 \uC918.'
|
|
1549
|
+
},
|
|
1550
|
+
{
|
|
1551
|
+
id: "ui-voice-note-waveform",
|
|
1552
|
+
domain: "ui",
|
|
1553
|
+
category: "feedback",
|
|
1554
|
+
titleKo: "\uBCF4\uC774\uC2A4\uB178\uD2B8 \uC6E8\uC774\uBE0C\uD3FC \uD50C\uB808\uC774\uC5B4",
|
|
1555
|
+
titleEn: "Voice Note Waveform Player",
|
|
1556
|
+
summary: "\uBA54\uC2E0\uC800 \uC74C\uC131 \uBA54\uBAA8\uCC98\uB7FC \uC7AC\uC0DD \uC2DC \uC624\uB514\uC624 \uD30C\uD615 \uB9C9\uB300\uAC00 \uCC28\uC624\uB974\uACE0, \uC6D0\uD558\uB294 \uB9C9\uB300\uB97C \uD074\uB9AD\uD574 \uC7AC\uC0DD \uC704\uCE58\uB97C \uD0D0\uC0C9\uD558\uB294 \uBBF8\uB2C8 \uD50C\uB808\uC774\uC5B4",
|
|
1557
|
+
vibeTag: "\uC74C\uD30C\uB97C \uC9DA\uC5B4\uAC00\uBA70 \uB4E3\uB294 \uBCF4\uC774\uC2A4\uB178\uD2B8",
|
|
1558
|
+
vibeKeywords: ["\uBCF4\uC774\uC2A4\uB178\uD2B8 \uC6E8\uC774\uBE0C\uD3FC", "\uC74C\uC131 \uBA54\uBAA8 \uBBF8\uB2C8 \uD50C\uB808\uC774\uC5B4", "\uC624\uB514\uC624 \uD30C\uD615 \uD0D0\uC0C9", "\uC74C\uD30C \uC9C4\uD589\uB960 \uBC14", "\uC6E8\uC774\uBE0C\uD3FC \uC2DC\uD06C"],
|
|
1559
|
+
promptSnippet: '\uC9C0\uC815 \uC601\uC5ED\uC5D0 260\xD764 \uD06C\uAE30\uC758 \uBA54\uC2E0\uC800(\uCE74\uCE74\uC624\uD1A1/\uD154\uB808\uADF8\uB7A8) \uC2A4\uD0C0\uC77C \uBCF4\uC774\uC2A4\uB178\uD2B8(\uC74C\uC131 \uBA54\uBAA8) \uD50C\uB808\uC774\uC5B4\uB97C \uB9CC\uB4E4\uC5B4 \uC918. \uB465\uADFC \uCEA1\uC290\uD615 \uCE74\uB4DC \uBC14\uD0D5(#f1f5f9, \uB2E4\uD06C #1e293b)\uC758 \uC67C\uCABD\uC5D0 36\xD736 \uD06C\uAE30\uC758 \uC6D0\uD615 \uC7AC\uC0DD/\uC77C\uC2DC\uC815\uC9C0 \uD1A0\uAE00 \uBC84\uD2BC(\uC0B0\uB73B\uD55C \uCF54\uB784 \uD551\uD06C #f43f5e \uBC30\uACBD\uACFC \uD770\uC0C9 \uC544\uC774\uCF58)\uC744 \uB450\uACE0, \uC911\uC559\uC5D0\uB294 \uB2E4\uC591\uD55C \uB192\uC774(6px~28px)\uB97C \uAC00\uC9C4 20\uAC1C\uC758 \uB465\uADFC \uC624\uB514\uC624 \uD30C\uD615 \uB9C9\uB300(Waveform bars)\uB97C \uCD18\uCD18\uD788 \uBC30\uC5F4\uD574 \uC918. \uC6B0\uCE21 \uB05D\uC5D0\uB294 \uB0A8\uC740 \uC7AC\uC0DD \uC2DC\uAC04("0:12")\uC744 11px \uBCFC\uB4DC \uD14D\uC2A4\uD2B8\uB85C \uD45C\uC2DC\uD574 \uC918. \uC7AC\uC0DD \uBC84\uD2BC\uC744 \uB204\uB974\uBA74 \uC2DC\uAC04\uC774 \uCE74\uC6B4\uD2B8\uB2E4\uC6B4\uB418\uBA74\uC11C \uC7AC\uC0DD \uC9C4\uD589\uB960\uC5D0 \uB530\uB77C \uD30C\uD615 \uB9C9\uB300\uB4E4\uC774 \uC67C\uCABD\uBD80\uD130 \uD68C\uC0C9\uC5D0\uC11C \uC120\uBA85\uD55C \uCF54\uB784 \uD551\uD06C\uB85C \uCC44\uC6CC\uC9C0\uACE0, \uC784\uC758\uC758 \uD30C\uD615 \uB9C9\uB300\uB97C \uD074\uB9AD\uD558\uBA74 \uD574\uB2F9 \uC704\uCE58\uB85C \uC7AC\uC0DD \uD5E4\uB4DC\uAC00 \uC989\uAC01 \uC810\uD504(Seek)\uD574. role="progressbar" \uB610\uB294 "slider" \uC811\uADFC\uC131\uC744 \uC9C0\uC6D0\uD558\uACE0, \uC591\uD14C\uB9C8 \uBC0F \uBAA8\uC158 \uAC10\uC18C \uD658\uACBD\uC744 \uC9C0\uC6D0\uD574 \uC918.'
|
|
1560
|
+
}
|
|
1561
|
+
];
|
|
1562
|
+
|
|
1427
1563
|
// ../../packages/catalog/src/additions/signature.ts
|
|
1428
1564
|
var SIGNATURE_ADDITIONS = [
|
|
1429
1565
|
{
|
|
@@ -6562,6 +6698,7 @@ var CATEGORY_LABEL_MAP = Object.fromEntries(
|
|
|
6562
6698
|
].map((c) => [c.id, c.label])
|
|
6563
6699
|
);
|
|
6564
6700
|
var TECHNIQUES = [
|
|
6701
|
+
...STARTER_PACK_ADDITIONS,
|
|
6565
6702
|
...SIGNATURE_ADDITIONS,
|
|
6566
6703
|
...UI_COLLECTION_ADDITIONS,
|
|
6567
6704
|
...MOTION_COLLECTION_ADDITIONS,
|
|
@@ -7364,6 +7501,82 @@ var EN_BASE_TECHNIQUES = {
|
|
|
7364
7501
|
)
|
|
7365
7502
|
};
|
|
7366
7503
|
|
|
7504
|
+
// ../../packages/catalog/src/translations/additions/starter-pack.ts
|
|
7505
|
+
var EN_STARTER_PACK_TECHNIQUES = {
|
|
7506
|
+
"ui-ai-streaming-pulse": {
|
|
7507
|
+
summary: "A typing effect outputs text letter by letter, followed by a smoothly pulsing and breathing gradient glow cursor.",
|
|
7508
|
+
vibeTag: "Typing as if thinking with a breathing pulse cursor",
|
|
7509
|
+
vibeKeywords: ["streaming pulse cursor", "AI streaming", "typing effect", "pulse cursor", "streaming text", "generative UI"],
|
|
7510
|
+
promptSnippet: 'Create an AI streaming text demo in a 280\xD7150 area. At the top, place an 11px status badge with a shimmering circular AI generation indicator. In the center text container, stream fixed sample text character by character every 40ms. Immediately after the printed characters, append an inline 8\xD715px purple-to-teal gradient pulse cursor with a 1-second breathing loop (opacity 0.2 to 1 and slight scale motion). While typing, the cursor follows the trailing character immediately; upon completion, it stays in a gentle breathing pulse. Clicking restarts the typing stream from the beginning. Support light theme (#f8fafc surface, #0f172a text, #6366f1 accent) and dark theme (#0f172a surface, #f8fafc text, #818cf8 accent), bind role="status" and aria-live="polite" for screen readers, and show the full text and static cursor immediately under reduced motion.'
|
|
7511
|
+
},
|
|
7512
|
+
"ui-particle-burst-heart": {
|
|
7513
|
+
summary: "Clicking the heart button triggers a spring bounce along with an 8-way burst of colorful confetti particles and an expanding ring.",
|
|
7514
|
+
vibeTag: "Stars and rings bursting open on click",
|
|
7515
|
+
vibeKeywords: ["particle burst heart", "like motion", "micro interaction", "celebration particle", "bounce button"],
|
|
7516
|
+
promptSnippet: "Create an interactive 48\xD748 heart button with a particle burst effect in the specified area. Use a native button element showing an outlined gray heart and counter by default. Clicking toggles an active state: upon activation, the heart bounces from scale 0.8 to 1.25 down to 1.0 over 300ms cubic-bezier(.17,.89,.32,1.28). Simultaneously, expand a translucent shockwave ring (opacity 1 to 0, scale 0.2 to 1.8) outward up to 36px radius, while 8 round confetti particles in 4 pastel shades (pink, yellow, violet, teal) fly radially outward and fade out over 400ms. Clicking again smoothly reverts the heart without particles. The counter increments by 1 when active. Support both themes, keyboard access (Enter/Space), and aria-pressed, and toggle colors and counts immediately without animations under reduced motion."
|
|
7517
|
+
},
|
|
7518
|
+
"mg-ambient-aurora-blob": {
|
|
7519
|
+
summary: "Three organic pastel neon gradient blobs rotate and overlap slowly behind a blur filter to create a glowing aurora backdrop.",
|
|
7520
|
+
vibeTag: "Dreamy overlapping streams of aurora light",
|
|
7521
|
+
vibeKeywords: ["ambient aurora blob", "aurora background", "gradient motion", "aurora shader", "hero background", "organic blur"],
|
|
7522
|
+
promptSnippet: 'Build a dreamy ambient aurora background as a 280\xD7150 SVG frame in the specified area. Use deep navy (#090d16) as the base, topped with three large elliptical blobs in violet (#8b5cf6), cyan (#06b6d4), and coral pink (#f43f5e). Animate each blob through organic orbits and gentle scaling (0.85 to 1.2) across 8 to 12 second periods inside a feGaussianBlur(stdDeviation="22") filter. When blobs overlap in the center, simulate an amplified light bloom similar to screen or color-dodge blending. Clip to the frame with overflow: hidden and 12px rounded corners. Float a polished glassmorphism badge (translucent white, backdrop-blur 6px, subtle 1px white border) in the top center to demonstrate depth. Clicking resets the cycle, the frame loop pauses when offscreen, and reduced motion displays a static still aurora gradient frame.'
|
|
7523
|
+
},
|
|
7524
|
+
"lay-bottom-sheet-modal": {
|
|
7525
|
+
summary: "A mobile-style drawer panel that slides up smoothly from the bottom with a dimmed backdrop when the handle bar is clicked.",
|
|
7526
|
+
vibeTag: "A bottom sheet sliding up smoothly like a mobile app",
|
|
7527
|
+
vibeKeywords: ["drawer bottom sheet", "mobile drawer", "sheet modal", "slide up", "mobile UI", "handle bar"],
|
|
7528
|
+
promptSnippet: 'Create an interactive bottom sheet panel simulating a mobile viewport (240\xD7150 preview) in the specified area. Initially, expose only the top 34px peek of the sheet featuring 16px rounded top corners and a centered 36\xD74px pill handle bar. Clicking the handle or sheet top triggers a 350ms cubic-bezier(.16,1,.3,1) spring slide up to translateY(0), while a translucent dark backdrop fades in (opacity 0 to 0.45). Inside the opened sheet, present two action menu items (Share, Save) and a close text button. Clicking the backdrop or close button slides the panel back down to translateY(116px). Bind role="dialog", aria-modal="true", and aria-expanded, support Escape key closing, support light theme (#ffffff sheet, #1e293b text) and dark theme (#1e293b sheet, #f8fafc text), and open and close immediately without sliding under reduced motion.'
|
|
7529
|
+
},
|
|
7530
|
+
"ui-swipe-to-confirm": {
|
|
7531
|
+
summary: "Dragging a circular knob across a horizontal track confirms an action once past 80%, springing back if released early.",
|
|
7532
|
+
vibeTag: "A reassuring slider that must be dragged all the way to confirm",
|
|
7533
|
+
vibeKeywords: ["swipe confirm slider", "slide to unlock", "swipe to pay", "action slider", "mistake prevention"],
|
|
7534
|
+
promptSnippet: 'Build a 220\xD746 swipe-to-confirm slider button in the specified area. On a pill-shaped track (#e2e8f0 track, dark #1e293b), center a subtle 12px label ("Slide to Pay") and place a 38\xD738 circular drag knob (#ffffff, dark #334155, right arrow icon) on the left. Dragging the knob rightward fills the track with a green gradient and dims the hint text based on progress (0 to 100%). If released before 80%, smoothly spring back to 0 over 250ms; past 80%, lock into a confirmed state with a green checkmark and success copy. Clicking in the confirmed state resets back to idle. Bind role="slider", aria-valuemin="0", aria-valuemax="100", aria-valuenow, support left/right keyboard arrows, and confirm in one click without drag animations under reduced motion.'
|
|
7535
|
+
},
|
|
7536
|
+
"ui-cli-command-switcher": {
|
|
7537
|
+
summary: "A developer-docs terminal component that swaps commands instantly across npm, pnpm, yarn, and bun tabs with copy feedback.",
|
|
7538
|
+
vibeTag: "A terminal switching between npm and pnpm with one click",
|
|
7539
|
+
vibeKeywords: ["cli command switcher", "package manager tabs", "terminal copy", "command snippet", "codeblock"],
|
|
7540
|
+
promptSnippet: 'Create a 260\xD7110 CLI command code block for modern developer documentation in the specified area. On a deep slate (#0f172a) background, place four mini tabs for npm, pnpm, yarn, and bun (active tab has #334155 background with light text) in the top header alongside a square copy button on the right. Clicking a tab immediately replaces the console command with the chosen package manager syntax (e.g., npm i vs pnpm add vs yarn add vs bun add). Prefix the line with a purple terminal prompt ("$"), and clicking copy writes to clipboard and turns into a green checkmark and "Copied!" feedback for 1.5 seconds. Bind role="tablist", role="tab", aria-selected, fit narrow screens without horizontal overflow, and switch icons immediately without transitions under reduced motion.'
|
|
7541
|
+
},
|
|
7542
|
+
"ui-interactive-kbd-key": {
|
|
7543
|
+
summary: "A mechanical 3D keycap badge with realistic depth shadow that compresses down when clicked or pressed on keyboard.",
|
|
7544
|
+
vibeTag: "Keyboard shortcut badges pressing down like real keycaps",
|
|
7545
|
+
vibeKeywords: ["interactive kbd badge", "shortcut badge", "kbd tag", "keycap interaction", "key press feedback"],
|
|
7546
|
+
promptSnippet: 'Create an interactive KBD shortcut component in the specified area that simulates real mechanical keycap presses. Display two keycaps for "\u2318 Command" and "K" side-by-side, each styled with a 3D bottom shadow (box-shadow: 0 4px 0 #94a3b8, dark #1e293b), 1px border, and 6px rounded corners. Clicking or pressing keys translates the keycap down by translateY(3px) over 100ms while compressing the shadow to 1px to mimic a physical tactile switch press. Triggering the keys flashes a pill badge underneath reading "Command Palette opened!". Use standard kbd tags, support Enter and Space keyboard events, maintain both theme contrasts, and show pressed states immediately under reduced motion.'
|
|
7547
|
+
},
|
|
7548
|
+
"ui-tear-off-coupon-card": {
|
|
7549
|
+
summary: "A perforated ticket coupon with side circular punch holes where claiming tears the stub away and stamps an ISSUED seal.",
|
|
7550
|
+
vibeTag: "Perforated line tearing open with a stamped seal",
|
|
7551
|
+
vibeKeywords: ["tear off coupon voucher", "ticket card", "perforated stub", "coupon voucher", "issued stamp"],
|
|
7552
|
+
promptSnippet: 'Create a 260\xD790 perforated coupon ticket card in the specified area. Divide the card into left and right zones separated by 16px semicircular edge cutouts and a dashed vertical tear line (border-right: 2px dashed). The left zone highlights "15% OFF" and "WELCOME VIBE", while the right stub holds a "Claim" button. Clicking shifts the right stub rightward by 8px and tilts it 3 degrees over 400ms to simulate paper tearing, while a red "ISSUED" seal stamps onto the main voucher with a 300ms bounce. Clicking again when claimed resets back to initial. Support both themes, keyboard access (Enter/Space), and transition immediately to the stamped state without tear animations under reduced motion.'
|
|
7553
|
+
},
|
|
7554
|
+
"ui-file-dropzone-uploader": {
|
|
7555
|
+
summary: "A drag-and-drop file upload zone with a pulsating border on hover, animated progress bar, and completion checkmark.",
|
|
7556
|
+
vibeTag: "Upload zone responding softly on drag over",
|
|
7557
|
+
vibeKeywords: ["file dropzone uploader", "drag and drop upload", "file attachment progress", "upload input widget", "upload progress bar"],
|
|
7558
|
+
promptSnippet: 'Build a modern 260\xD7110 file dropzone uploader in the specified area. By default, show a cloud upload icon and "Drag & drop or click to upload" hint inside a dashed gray border (border: 2px dashed #cbd5e1). Hovering or dragging over turns the border into vibrant indigo (#6366f1) with a soft pulsing glow. Clicking triggers a simulated upload: a file icon appears with "document_vibe.pdf (2.4 MB)" info as a horizontal progress bar fills smoothly from 0% to 100% over 800ms. Upon 100%, transition into a green checkmark badge and "Upload Complete" state; clicking again resets to idle. Support keyboard accessibility (Enter/Space), dual themes (#ffffff / #1e293b), and jump directly to complete without progress animation under reduced motion.'
|
|
7559
|
+
},
|
|
7560
|
+
"ui-liquid-segmented-control": {
|
|
7561
|
+
summary: "An iOS-style segmented control where the floating pill indicator elastically stretches and snaps to the active tab.",
|
|
7562
|
+
vibeTag: "A pill tab stretching like jelly and snapping into place",
|
|
7563
|
+
vibeKeywords: ["liquid segmented control", "jelly pill tab", "spring segment toggle", "elastic tab switcher", "iOS segment"],
|
|
7564
|
+
promptSnippet: 'Create an iOS-style elastic segmented control in the specified area. Inside a pill-shaped track (#e2e8f0 surface, dark #0f172a), lay out three tab buttons ("Daily", "Weekly", "Monthly"). Behind the active tab, float a white pill indicator (box-shadow: 0 2px 8px rgba(0,0,0,0.12)). When switching tabs, elastically stretch the pill horizontally by 1.25x in the direction of travel before snapping into the target position with spring damping. Transition active tab text to bold dark and inactive tabs to muted gray. Support role="tablist", role="tab", aria-selected, left/right keyboard arrows, and move immediately without elastic stretching under reduced motion.'
|
|
7565
|
+
},
|
|
7566
|
+
"ui-3d-interactive-bank-card": {
|
|
7567
|
+
summary: "A 3D payment card with embossed metallic digits that flips 180 degrees to reveal the magnetic strip and CVC code.",
|
|
7568
|
+
vibeTag: "A premium card flipping front and back in 3D",
|
|
7569
|
+
vibeKeywords: ["3d interactive payment card", "credit card 3d flip", "embossed bank card", "checkout form card flip", "fintech card flip"],
|
|
7570
|
+
promptSnippet: 'Create a premium 240\xD7140 3D credit card component in the specified area. The front shows a deep sapphire navy gradient, golden EMV microchip, 16-digit embossed number ("\u2022\u2022\u2022\u2022 \u2022\u2022\u2022\u2022 \u2022\u2022\u2022\u2022 4242"), expiry date ("12/28"), and metallic brand logo. The back features a top black magnetic strip, white signature panel, and 3-digit CVC code ("883"). Clicking a "Flip Card" toggle smoothly rotates the card 180 degrees around the Y-axis over 500ms cubic-bezier(.16,1,.3,1) with perspective(800px) and backface-visibility: hidden. Hovering sweeps a soft diagonal metallic sheen across the surface. Support keyboard access and switch faces immediately without rotation under reduced motion.'
|
|
7571
|
+
},
|
|
7572
|
+
"ui-voice-note-waveform": {
|
|
7573
|
+
summary: "A messenger-style voice note player where audio waveform bars fill on playback with click-to-seek progress.",
|
|
7574
|
+
vibeTag: "Listening to voice notes by tapping audio waves",
|
|
7575
|
+
vibeKeywords: ["voice note waveform", "audio message mini player", "audio wave seeking", "sound wave progress", "waveform seek"],
|
|
7576
|
+
promptSnippet: 'Create a 260\xD764 messenger-style voice note player in the specified area. In a rounded capsule card (#f1f5f9, dark #1e293b), place a 36\xD736 play/pause toggle button (vibrant coral pink #f43f5e with white icon) on the left, 20 rounded waveform bars of varying heights (6px to 28px) in the center, and remaining time ("0:12") in 11px bold text on the right. Playing counts down time while progressively filling bars from gray to vibrant coral pink; clicking any bar seeks the playback head immediately to that timestamp. Support role="progressbar" or "slider" accessibility, dual themes, and static full bars under reduced motion.'
|
|
7577
|
+
}
|
|
7578
|
+
};
|
|
7579
|
+
|
|
7367
7580
|
// ../../packages/catalog/src/translations/additions/signature.ts
|
|
7368
7581
|
var EN_SIGNATURE_TECHNIQUES = {
|
|
7369
7582
|
"envelope-invitation-reveal": {
|
|
@@ -10665,6 +10878,7 @@ var EN_PATTERN_TECHNIQUES = {
|
|
|
10665
10878
|
|
|
10666
10879
|
// ../../packages/catalog/src/translations/en.ts
|
|
10667
10880
|
var ENGLISH_TECHNIQUES = {
|
|
10881
|
+
...EN_STARTER_PACK_TECHNIQUES,
|
|
10668
10882
|
...EN_SIGNATURE_TECHNIQUES,
|
|
10669
10883
|
...EN_UI_COLLECTION,
|
|
10670
10884
|
...EN_MOTION_COLLECTION,
|
|
@@ -10858,6 +11072,154 @@ var BASE_SEARCH_METADATA = {
|
|
|
10858
11072
|
"vd-breaking-news-ticker": m(["scene", "text"], ["auto", "click"], "\uC0D8\uD50C \uC18D\uBCF4 \uD5E4\uB4DC\uB77C\uC778\uACFC \uB274\uC2A4\uB760", "Present sample breaking-news headlines and a scrolling ticker", "\uC18D\uBCF4 \uB760 \uC790\uB9C9|\uD750\uB974\uB294 \uB274\uC2A4 \uD5E4\uB4DC\uB77C\uC778", "breaking news crawl|scrolling headline ticker")
|
|
10859
11073
|
};
|
|
10860
11074
|
|
|
11075
|
+
// ../../packages/catalog/src/search-metadata/additions/starter-pack.ts
|
|
11076
|
+
var STARTER_PACK_SEARCH_METADATA = {
|
|
11077
|
+
"ui-ai-streaming-pulse": {
|
|
11078
|
+
targets: ["text"],
|
|
11079
|
+
triggers: ["auto", "click"],
|
|
11080
|
+
useCases: {
|
|
11081
|
+
ko: ["\uC0DD\uC131\uD615 AI \uCC57\uBD07 \uB2F5\uBCC0, LLM \uC2A4\uD2B8\uB9AC\uBC0D \uC751\uB2F5 \uB610\uB294 \uD0C0\uC774\uD551 \uC5F0\uCD9C\uC774 \uD544\uC694\uD55C \uD654\uBA74\uC5D0 \uC801\uC6A9\uD560 \uB54C"],
|
|
11082
|
+
en: ["Stream generative AI chatbot responses or simulate typing with a breathing pulse cursor"]
|
|
11083
|
+
},
|
|
11084
|
+
aliases: {
|
|
11085
|
+
ko: ["AI \uC2A4\uD2B8\uB9AC\uBC0D \uD14D\uC2A4\uD2B8", "\uD384\uC2A4 \uCEE4\uC11C \uD0C0\uC774\uD551", "\uD0C0\uC774\uD504\uB77C\uC774\uD130 \uD14D\uC2A4\uD2B8"],
|
|
11086
|
+
en: ["AI streaming pulse text", "breathing cursor typing", "generative typewriter text"]
|
|
11087
|
+
}
|
|
11088
|
+
},
|
|
11089
|
+
"ui-particle-burst-heart": {
|
|
11090
|
+
targets: ["button"],
|
|
11091
|
+
triggers: ["click"],
|
|
11092
|
+
useCases: {
|
|
11093
|
+
ko: ["\uC88B\uC544\uC694, \uC990\uACA8\uCC3E\uAE30, \uBD81\uB9C8\uD06C \uD074\uB9AD \uC2DC \uCD95\uD558\uD558\uB294 \uB4EF\uD55C \uB9C8\uC774\uD06C\uB85C \uD30C\uD2F0\uD074 \uD53C\uB4DC\uBC31\uC744 \uC904 \uB54C"],
|
|
11094
|
+
en: ["Celebrate likes, favorites, or bookmark clicks with celebratory particle burst feedback"]
|
|
11095
|
+
},
|
|
11096
|
+
aliases: {
|
|
11097
|
+
ko: ["\uD30C\uD2F0\uD074 \uBC84\uC2A4\uD2B8 \uD558\uD2B8", "\uC88B\uC544\uC694 \uD30C\uD2F0\uD074 \uBAA8\uC158", "\uD558\uD2B8 \uD321 \uC560\uB2C8\uBA54\uC774\uC158"],
|
|
11098
|
+
en: ["particle burst heart", "confetti like reaction", "heart bounce burst"]
|
|
11099
|
+
}
|
|
11100
|
+
},
|
|
11101
|
+
"mg-ambient-aurora-blob": {
|
|
11102
|
+
targets: ["background", "scene"],
|
|
11103
|
+
triggers: ["auto", "click"],
|
|
11104
|
+
useCases: {
|
|
11105
|
+
ko: ["\uB79C\uB529 \uD398\uC774\uC9C0 \uD788\uC5B4\uB85C \uC139\uC158\uC774\uB098 \uBAA8\uB358 SaaS \uC11C\uBE44\uC2A4\uC758 \uC740\uC740\uD55C \uC624\uB85C\uB77C \uBC30\uACBD\uC744 \uB9CC\uB4E4 \uB54C"],
|
|
11106
|
+
en: ["Create an ambient glowing aurora background for landing hero sections or modern SaaS screens"]
|
|
11107
|
+
},
|
|
11108
|
+
aliases: {
|
|
11109
|
+
ko: ["\uC570\uBE44\uC5B8\uD2B8 \uC624\uB85C\uB77C \uBE14\uB86D", "\uC624\uB85C\uB77C \uADF8\uB77C\uB514\uC5B8\uD2B8 \uBC30\uACBD", "\uBE14\uB7EC \uBE14\uB86D \uBAA8\uC158"],
|
|
11110
|
+
en: ["ambient aurora blob", "aurora gradient backdrop", "blurred glowing blob animation"]
|
|
11111
|
+
}
|
|
11112
|
+
},
|
|
11113
|
+
"lay-bottom-sheet-modal": {
|
|
11114
|
+
targets: ["panel", "navigation"],
|
|
11115
|
+
triggers: ["click"],
|
|
11116
|
+
useCases: {
|
|
11117
|
+
ko: ["\uBAA8\uBC14\uC77C \uC6F9\uC5D0\uC11C \uD558\uB2E8 \uC635\uC158 \uC11C\uB78D, \uC561\uC158 \uC2DC\uD2B8, \uC0C1\uC138 \uC815\uBCF4 \uD31D\uC5C5\uC744 \uB744\uC6B8 \uB54C"],
|
|
11118
|
+
en: ["Present mobile web action sheets, option drawers, or bottom popups smoothly"]
|
|
11119
|
+
},
|
|
11120
|
+
aliases: {
|
|
11121
|
+
ko: ["\uC778\uD130\uB799\uD2F0\uBE0C \uBC14\uD140 \uC2DC\uD2B8", "\uBAA8\uBC14\uC77C \uB4DC\uB85C\uC5B4 \uC11C\uB78D", "\uD558\uB2E8 \uC2AC\uB77C\uC774\uB4DC \uBAA8\uB2EC"],
|
|
11122
|
+
en: ["interactive bottom sheet", "mobile drawer panel", "slide up action sheet"]
|
|
11123
|
+
}
|
|
11124
|
+
},
|
|
11125
|
+
"ui-swipe-to-confirm": {
|
|
11126
|
+
targets: ["button", "input"],
|
|
11127
|
+
triggers: ["drag", "click"],
|
|
11128
|
+
useCases: {
|
|
11129
|
+
ko: ["\uC1A1\uAE08, \uACB0\uC81C \uD655\uC815, \uC911\uC694 \uB370\uC774\uD130 \uC0AD\uC81C \uB4F1 \uC2E4\uC218 \uBC29\uC9C0\uAC00 \uD544\uC694\uD55C \uC548\uC2EC \uC778\uD130\uB799\uC158\uC744 \uB9CC\uB4E4 \uB54C"],
|
|
11130
|
+
en: ["Prevent accidental clicks on payments, money transfers, or irreversible actions"]
|
|
11131
|
+
},
|
|
11132
|
+
aliases: {
|
|
11133
|
+
ko: ["\uBC00\uC5B4\uC11C \uC7A0\uAE08\uD574\uC81C", "\uC2AC\uB77C\uC774\uB4DC \uACB0\uC81C \uBC84\uD2BC", "\uC2A4\uC640\uC774\uD504 \uD655\uC815 \uBC84\uD2BC"],
|
|
11134
|
+
en: ["swipe to confirm button", "slide to pay slider", "swipe to action button"]
|
|
11135
|
+
}
|
|
11136
|
+
},
|
|
11137
|
+
"ui-cli-command-switcher": {
|
|
11138
|
+
targets: ["panel", "button"],
|
|
11139
|
+
triggers: ["click"],
|
|
11140
|
+
useCases: {
|
|
11141
|
+
ko: ["\uAC1C\uBC1C\uC790 \uBB38\uC11C\uB098 \uB77C\uC774\uBE0C\uB7EC\uB9AC \uC124\uCE58 \uD398\uC774\uC9C0\uC5D0\uC11C \uD328\uD0A4\uC9C0 \uB9E4\uB2C8\uC800\uBCC4 \uBA85\uB839\uC5B4\uB97C \uD55C \uBC88\uC5D0 \uBCF5\uC0AC\uD560 \uB54C"],
|
|
11142
|
+
en: ["Provide multi-package manager install snippets with one-click copy on developer docs"]
|
|
11143
|
+
},
|
|
11144
|
+
aliases: {
|
|
11145
|
+
ko: ["CLI \uBA85\uB839\uC5B4 \uD0ED", "\uD328\uD0A4\uC9C0 \uB9E4\uB2C8\uC800 \uD130\uBBF8\uB110", "npm yarn \uBCF5\uC0AC \uBE14\uB85D"],
|
|
11146
|
+
en: ["cli command switcher", "package manager tabs", "terminal install codeblock"]
|
|
11147
|
+
}
|
|
11148
|
+
},
|
|
11149
|
+
"ui-interactive-kbd-key": {
|
|
11150
|
+
targets: ["button", "text"],
|
|
11151
|
+
triggers: ["hover", "click"],
|
|
11152
|
+
useCases: {
|
|
11153
|
+
ko: ["\uC6F9\uC571\uC5D0\uC11C \uB2E8\uCD95\uD0A4\uB97C \uC548\uB0B4\uD558\uAC70\uB098 \uAE30\uACC4\uC2DD \uD0A4\uBCF4\uB4DC \uD0C0\uAC74 \uB290\uB08C\uC758 \uC785\uCCB4 \uBC43\uC9C0\uB97C \uBCF4\uC5EC\uC904 \uB54C"],
|
|
11154
|
+
en: ["Show tactile keyboard shortcut keys with realistic 3D key-press feedback"]
|
|
11155
|
+
},
|
|
11156
|
+
aliases: {
|
|
11157
|
+
ko: ["KBD \uB2E8\uCD95\uD0A4 \uBC43\uC9C0", "\uD0A4\uBCF4\uB4DC \uD0A4\uCEA1 \uBC84\uD2BC", "\uB2E8\uCD95\uD0A4 \uD234\uD301"],
|
|
11158
|
+
en: ["interactive kbd key", "mechanical keycap button", "shortcut key badge"]
|
|
11159
|
+
}
|
|
11160
|
+
},
|
|
11161
|
+
"ui-tear-off-coupon-card": {
|
|
11162
|
+
targets: ["card", "button"],
|
|
11163
|
+
triggers: ["click"],
|
|
11164
|
+
useCases: {
|
|
11165
|
+
ko: ["\uC774\uBCA4\uD2B8 \uD504\uB85C\uBAA8\uC158, \uC1FC\uD551\uBAB0 \uD560\uC778 \uCFE0\uD3F0, \uBC14\uC6B0\uCC98 \uD2F0\uCF13 \uBC1C\uAE09 \uD654\uBA74\uC744 \uAD6C\uC131\uD560 \uB54C"],
|
|
11166
|
+
en: ["Deliver promotional discount coupons or ticket vouchers with satisfying tear-off stubs"]
|
|
11167
|
+
},
|
|
11168
|
+
aliases: {
|
|
11169
|
+
ko: ["\uC808\uCDE8\uC120 \uCFE0\uD3F0 \uCE74\uB4DC", "\uD2F0\uCF13 \uBC14\uC6B0\uCC98", "\uB72F\uC5B4\uC9C0\uB294 \uD560\uC778 \uCFE0\uD3F0"],
|
|
11170
|
+
en: ["perforated coupon card", "tear off voucher ticket", "discount claim card"]
|
|
11171
|
+
}
|
|
11172
|
+
},
|
|
11173
|
+
"ui-file-dropzone-uploader": {
|
|
11174
|
+
targets: ["input", "panel"],
|
|
11175
|
+
triggers: ["click", "drag"],
|
|
11176
|
+
useCases: {
|
|
11177
|
+
ko: ["\uD30C\uC77C \uC5C5\uB85C\uB4DC \uB4DC\uB86D\uC874, \uCCA8\uBD80\uD30C\uC77C \uB4F1\uB85D \uD3FC, SaaS \uAD00\uB9AC\uC790 \uD398\uC774\uC9C0\uC758 \uD30C\uC77C \uC778\uD48B\uC744 \uB9CC\uB4E4 \uB54C"],
|
|
11178
|
+
en: ["Build drag-and-drop file upload zones with animated progress feedback for SaaS forms"]
|
|
11179
|
+
},
|
|
11180
|
+
aliases: {
|
|
11181
|
+
ko: ["\uD30C\uC77C \uB4DC\uB86D\uC874 \uC5C5\uB85C\uB354", "\uB4DC\uB798\uADF8 \uC564 \uB4DC\uB86D \uC5C5\uB85C\uB4DC", "\uD30C\uC77C \uCCA8\uBD80 \uCEF4\uD3EC\uB10C\uD2B8"],
|
|
11182
|
+
en: ["file dropzone uploader", "drag and drop upload area", "file attachment dropzone"]
|
|
11183
|
+
}
|
|
11184
|
+
},
|
|
11185
|
+
"ui-liquid-segmented-control": {
|
|
11186
|
+
targets: ["navigation", "button"],
|
|
11187
|
+
triggers: ["click"],
|
|
11188
|
+
useCases: {
|
|
11189
|
+
ko: ["\uBDF0 \uBAA8\uB4DC \uC804\uD658, \uAE30\uAC04 \uC120\uD0DD \uD544\uD130, \uD0ED \uC2A4\uC704\uCC98\uB97C \uCAC0\uB4DD\uD55C iOS \uAC10\uC131\uC73C\uB85C \uAD6C\uD604\uD560 \uB54C"],
|
|
11190
|
+
en: ["Switch between view modes, date ranges, or toggle filters with elastic iOS-style pills"]
|
|
11191
|
+
},
|
|
11192
|
+
aliases: {
|
|
11193
|
+
ko: ["\uB9AC\uD034\uB4DC \uC138\uADF8\uBA3C\uD2B8 \uCEE8\uD2B8\uB864", "\uC824\uB9AC \uC54C\uC57D \uD0ED", "\uC138\uADF8\uBA3C\uD2B8 \uD1A0\uAE00 \uC2A4\uC704\uCC98"],
|
|
11194
|
+
en: ["liquid segmented control", "elastic pill tab switcher", "spring segment toggle"]
|
|
11195
|
+
}
|
|
11196
|
+
},
|
|
11197
|
+
"ui-3d-interactive-bank-card": {
|
|
11198
|
+
targets: ["card", "button"],
|
|
11199
|
+
triggers: ["hover", "click"],
|
|
11200
|
+
useCases: {
|
|
11201
|
+
ko: ["\uCCB4\uD06C\uC544\uC6C3 \uACB0\uC81C \uD654\uBA74, \uC2E0\uC6A9\uCE74\uB4DC \uB4F1\uB85D \uBC0F CVC \uBCF4\uC548\uCF54\uB4DC \uD655\uC778 \uC778\uD130\uB799\uC158\uC744 \uB9CC\uB4E4 \uB54C"],
|
|
11202
|
+
en: ["Interactive checkout payment forms with 3D credit card flipping for CVC security codes"]
|
|
11203
|
+
},
|
|
11204
|
+
aliases: {
|
|
11205
|
+
ko: ["3D \uC778\uD130\uB799\uD2F0\uBE0C \uACB0\uC81C \uCE74\uB4DC", "\uC2E0\uC6A9\uCE74\uB4DC 3D \uD50C\uB9BD", "\uACB0\uC81C \uD3FC \uCE74\uB4DC \uB4A4\uC9D1\uAE30"],
|
|
11206
|
+
en: ["3d interactive payment card", "credit card 3d flip", "checkout bank card"]
|
|
11207
|
+
}
|
|
11208
|
+
},
|
|
11209
|
+
"ui-voice-note-waveform": {
|
|
11210
|
+
targets: ["button", "input"],
|
|
11211
|
+
triggers: ["click"],
|
|
11212
|
+
useCases: {
|
|
11213
|
+
ko: ["\uBA54\uC2E0\uC800 \uC74C\uC131 \uBA54\uBAA8, AI \uBCF4\uC774\uC2A4 \uC624\uB514\uC624 \uBBF8\uB9AC\uBCF4\uAE30, \uD31F\uCE90\uC2A4\uD2B8 \uD074\uB9BD \uC7AC\uC0DD \uC778\uD130\uB799\uC158\uC744 \uAD6C\uC131\uD560 \uB54C"],
|
|
11214
|
+
en: ["Play voice notes or audio message clips with interactive clickable waveform bars"]
|
|
11215
|
+
},
|
|
11216
|
+
aliases: {
|
|
11217
|
+
ko: ["\uBCF4\uC774\uC2A4\uB178\uD2B8 \uC6E8\uC774\uBE0C\uD3FC \uD50C\uB808\uC774\uC5B4", "\uC74C\uC131 \uBA54\uBAA8 \uBBF8\uB2C8 \uD50C\uB808\uC774\uC5B4", "\uC624\uB514\uC624 \uD30C\uD615 \uD0D0\uC0C9 \uBC14"],
|
|
11218
|
+
en: ["voice note waveform player", "audio memo mini player", "sound wave seek player"]
|
|
11219
|
+
}
|
|
11220
|
+
}
|
|
11221
|
+
};
|
|
11222
|
+
|
|
10861
11223
|
// ../../packages/catalog/src/search-metadata/additions/signature.ts
|
|
10862
11224
|
var SIGNATURE_SEARCH_METADATA = {
|
|
10863
11225
|
"envelope-invitation-reveal": {
|
|
@@ -17818,6 +18180,7 @@ var VFX_SEARCH_METADATA = {
|
|
|
17818
18180
|
var TARGETS = ["button", "card", "text", "list", "background", "shape", "scene", "navigation", "panel", "input", "chart", "logo", "image"];
|
|
17819
18181
|
var TRIGGERS = ["pointer-move", "hover", "click", "hold", "drag", "input", "auto", "static"];
|
|
17820
18182
|
var SEARCH_METADATA = {
|
|
18183
|
+
...STARTER_PACK_SEARCH_METADATA,
|
|
17821
18184
|
...SIGNATURE_SEARCH_METADATA,
|
|
17822
18185
|
...UI_COLLECTION_SEARCH,
|
|
17823
18186
|
...MOTION_COLLECTION_SEARCH,
|
|
@@ -27629,6 +27992,14 @@ function createSearchTokenizer(synonyms, extraStopWords = []) {
|
|
|
27629
27992
|
return [...new Set(canonical.split(/[^\p{L}\p{N}.%-]+/u).filter((token) => token && !stopWords.has(token)))];
|
|
27630
27993
|
};
|
|
27631
27994
|
}
|
|
27995
|
+
function createSearchEntries(fields, tokenize) {
|
|
27996
|
+
return fields.flatMap(([field, values]) => values.map((value) => ({
|
|
27997
|
+
field,
|
|
27998
|
+
value,
|
|
27999
|
+
normalizedValue: normalizeSearchText(value),
|
|
28000
|
+
tokens: new Set(tokenize(value))
|
|
28001
|
+
})));
|
|
28002
|
+
}
|
|
27632
28003
|
function rankSearchEntries(entries3, queryTokens, weights3, exact, exactBonus = 100) {
|
|
27633
28004
|
if (!queryTokens.length && !exact) return null;
|
|
27634
28005
|
const matchedOn = [];
|
|
@@ -27680,7 +28051,7 @@ function entries(item) {
|
|
|
27680
28051
|
["question", texts.flatMap((text2) => text2.questions)],
|
|
27681
28052
|
["example", texts.map((text2) => text2.example)]
|
|
27682
28053
|
];
|
|
27683
|
-
const result2 = fields
|
|
28054
|
+
const result2 = createSearchEntries(fields, tokens);
|
|
27684
28055
|
index.set(item, result2);
|
|
27685
28056
|
return result2;
|
|
27686
28057
|
}
|
|
@@ -27691,7 +28062,7 @@ function rankDomainKnowledge(query = "") {
|
|
|
27691
28062
|
const results = [];
|
|
27692
28063
|
for (const item of DOMAIN_KNOWLEDGE) {
|
|
27693
28064
|
const allEntries = entries(item);
|
|
27694
|
-
const exact = allEntries.find((entry) =>
|
|
28065
|
+
const exact = allEntries.find((entry) => entry.normalizedValue === normalizedQuery);
|
|
27695
28066
|
const result2 = rankSearchEntries(allEntries, queryTokens, weights, exact, exact?.field === "domain" || exact?.field === "title" ? 150 : 100);
|
|
27696
28067
|
if (result2) results.push({ item, ...result2 });
|
|
27697
28068
|
}
|
|
@@ -27825,7 +28196,7 @@ function entries2(item) {
|
|
|
27825
28196
|
["summary", [item.summary, en.summary]],
|
|
27826
28197
|
["prompt", [item.promptSnippet, en.promptSnippet]]
|
|
27827
28198
|
];
|
|
27828
|
-
const result2 = fields
|
|
28199
|
+
const result2 = createSearchEntries(fields, tokens2);
|
|
27829
28200
|
index2.set(item, result2);
|
|
27830
28201
|
return result2;
|
|
27831
28202
|
}
|
|
@@ -27833,7 +28204,7 @@ function rank(item, query, queryTokens) {
|
|
|
27833
28204
|
if (!query.trim()) return { item, score: 0, matchedOn: [] };
|
|
27834
28205
|
const normalizedQuery = normalizeSearchText(query);
|
|
27835
28206
|
const allEntries = entries2(item);
|
|
27836
|
-
const exact = allEntries.find((entry) => entry.field !== "prompt" &&
|
|
28207
|
+
const exact = allEntries.find((entry) => entry.field !== "prompt" && entry.normalizedValue === normalizedQuery);
|
|
27837
28208
|
const result2 = rankSearchEntries(allEntries, queryTokens, weights2, exact, exact?.field === "title" ? 150 : 100);
|
|
27838
28209
|
return result2 ? { item, ...result2 } : null;
|
|
27839
28210
|
}
|
|
@@ -27854,7 +28225,7 @@ function searchTechniques(options = {}) {
|
|
|
27854
28225
|
// package.json
|
|
27855
28226
|
var package_default = {
|
|
27856
28227
|
name: "@keke1933/vibe-dictionary-mcp",
|
|
27857
|
-
version: "0.
|
|
28228
|
+
version: "0.10.0",
|
|
27858
28229
|
license: "MIT",
|
|
27859
28230
|
author: "leejh96",
|
|
27860
28231
|
description: "Read-only local MCP for searching Vibe Dictionary techniques and retrieving implementation prompts",
|
package/package.json
CHANGED