designkit-ai 1.0.0

package/components/common/mockup-elements/video-placeholder.html

@@ -0,0 +1,29 @@
+<!--
+@name: Video Placeholder
+@kit: common
+@width: 400
+@height: 225
+@tags: video, placeholder, play, media, mockup, player
+-->
+<svg viewBox="0 0 400 225" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <!-- Container -->
+  <rect x="1" y="1" width="398" height="223" rx="8" stroke="currentColor" stroke-width="1" opacity="0.15" />
+  <rect x="1" y="1" width="398" height="223" rx="8" fill="currentColor" opacity="0.04" />
+  <!-- Play button circle -->
+  <circle cx="200" cy="100" r="32" stroke="currentColor" stroke-width="1.5" opacity="0.3" />
+  <circle cx="200" cy="100" r="32" fill="currentColor" opacity="0.06" />
+  <!-- Play triangle -->
+  <path d="M190 82 L220 100 L190 118Z" fill="currentColor" opacity="0.3" />
+  <!-- Progress bar background -->
+  <rect x="20" y="200" width="360" height="4" rx="2" fill="currentColor" opacity="0.08" />
+  <!-- Progress bar filled portion -->
+  <rect x="20" y="200" width="120" height="4" rx="2" fill="currentColor" opacity="0.2" />
+  <!-- Progress dot -->
+  <circle cx="140" cy="202" r="5" fill="currentColor" opacity="0.25" />
+  <!-- Time text placeholders -->
+  <line x1="20" y1="192" x2="50" y2="192" stroke="currentColor" stroke-width="1" stroke-linecap="round" opacity="0.12" />
+  <line x1="350" y1="192" x2="380" y2="192" stroke="currentColor" stroke-width="1" stroke-linecap="round" opacity="0.12" />
+  <!-- Diagonal lines (video placeholder convention) -->
+  <line x1="30" y1="30" x2="370" y2="180" stroke="currentColor" stroke-width="0.5" opacity="0.04" />
+  <line x1="370" y1="30" x2="30" y2="180" stroke="currentColor" stroke-width="0.5" opacity="0.04" />
+</svg>

package/components/common/ui-icons/icon-add-circle.html

@@ -0,0 +1,12 @@
+<!--
+@name: Icon Add Circle
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, add, plus, circle, create, new, ui
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="12" cy="12" r="9" stroke="currentColor" stroke-width="1.5" />
+  <line x1="12" y1="8" x2="12" y2="16" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
+  <line x1="8" y1="12" x2="16" y2="12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
+</svg>

package/components/common/ui-icons/icon-airdrop.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Airdrop
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, airdrop, transfer, share, apple, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M12 21a9 9 0 010-18" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><path d="M12 17a5 5 0 010-10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><circle cx="12" cy="12" r="1.5" fill="currentColor"/>
+</svg>

package/components/common/ui-icons/icon-airplay.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Airplay
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, airplay, cast, screen, apple, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M5 17H4a2 2 0 01-2-2V5a2 2 0 012-2h16a2 2 0 012 2v10a2 2 0 01-2 2h-1" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><polygon points="12,13 17,21 7,21" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/components/common/ui-icons/icon-apple-logo.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Apple Logo
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, apple, logo, brand, ios, macos
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.81-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.8-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" fill="none"/><path d="M15 2c.1.82-.25 1.65-.78 2.24-.53.6-1.41 1.06-2.27.99-.12-.77.29-1.58.79-2.08C13.27 2.63 14.16 2.12 15 2z" fill="currentColor" opacity="0.7"/>
+</svg>

package/components/common/ui-icons/icon-arrow-back.html

@@ -0,0 +1,11 @@
+<!--
+@name: Icon Arrow Back
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, arrow, back, left, navigation, ui
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M19 12H5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+  <path d="M12 19L5 12L12 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+</svg>

package/components/common/ui-icons/icon-arrow-down.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Arrow Down
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, download, down, arrow, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M12 5v14m7-7l-7 7-7-7" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/components/common/ui-icons/icon-arrow-right.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Arrow Right
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, next, forward, arrow, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M5 12h14m-7-7l7 7-7 7" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/components/common/ui-icons/icon-arrow-up.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Arrow Up
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, upload, up, arrow, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M12 19V5m-7 7l7-7 7 7" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/components/common/ui-icons/icon-bag.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Bag
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, bag, shopping, purchase, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M6 2L3 6v14a2 2 0 002 2h14a2 2 0 002-2V6l-3-4z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><line x1="3" y1="6" x2="21" y2="6" stroke="currentColor" stroke-width="1.5"/><path d="M16 10a4 4 0 01-8 0" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
+</svg>

package/components/common/ui-icons/icon-battery.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Battery
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, battery, power, charge, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <rect x="1" y="7" width="18" height="10" rx="2" stroke="currentColor" stroke-width="1.5"/><rect x="3" y="9" width="10" height="6" rx="1" fill="currentColor" opacity="0.3"/><path d="M22 11v2" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
+</svg>

package/components/common/ui-icons/icon-bluetooth.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Bluetooth
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, bluetooth, wireless, connect, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <polyline points="6.5,6.5 17.5,12 6.5,17.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><polyline points="12,2 17.5,6.5 12,12 17.5,17.5 12,22" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/components/common/ui-icons/icon-bolt.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Bolt
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, lightning, flash, power, energy, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <polygon points="13,2 3,14 12,14 11,22 21,10 12,10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/components/common/ui-icons/icon-bookmark-fill.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Bookmark Fill
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, bookmark, save, later, filled, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M19 21l-7-5-7 5V5a2 2 0 012-2h10a2 2 0 012 2z" fill="currentColor" opacity="0.85"/>
+</svg>

package/components/common/ui-icons/icon-bookmark.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Bookmark
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, bookmark, save, later, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M19 21l-7-5-7 5V5a2 2 0 012-2h10a2 2 0 012 2z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/components/common/ui-icons/icon-bubble-left.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Bubble Left
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, chat, comment, message, bubble, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M21 15a2 2 0 01-2 2H7l-4 4V5a2 2 0 012-2h14a2 2 0 012 2z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/components/common/ui-icons/icon-calendar.html

@@ -0,0 +1,19 @@
+<!--
+@name: Icon Calendar
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, calendar, date, schedule, event, ui
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <rect x="3" y="4" width="18" height="18" rx="2" stroke="currentColor" stroke-width="1.5" />
+  <line x1="16" y1="2" x2="16" y2="6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
+  <line x1="8" y1="2" x2="8" y2="6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
+  <line x1="3" y1="10" x2="21" y2="10" stroke="currentColor" stroke-width="1.5" />
+  <!-- Date dots -->
+  <circle cx="8" cy="14" r="1" fill="currentColor" opacity="0.4" />
+  <circle cx="12" cy="14" r="1" fill="currentColor" opacity="0.4" />
+  <circle cx="16" cy="14" r="1" fill="currentColor" opacity="0.4" />
+  <circle cx="8" cy="18" r="1" fill="currentColor" opacity="0.4" />
+  <circle cx="12" cy="18" r="1" fill="currentColor" opacity="0.4" />
+</svg>

package/components/common/ui-icons/icon-camera.html

@@ -0,0 +1,11 @@
+<!--
+@name: Icon Camera
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, camera, photo, capture, picture, ui
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M23 19C23 19.5304 22.7893 20.0391 22.4142 20.4142C22.0391 20.7893 21.5304 21 21 21H3C2.46957 21 1.96086 20.7893 1.58579 20.4142C1.21071 20.0391 1 19.5304 1 19V8C1 7.46957 1.21071 6.96086 1.58579 6.58579C1.96086 6.21071 2.46957 6 3 6H7L9 3H15L17 6H21C21.5304 6 22.0391 6.21071 22.4142 6.58579C22.7893 6.96086 23 7.46957 23 8V19Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+  <circle cx="12" cy="13" r="4" stroke="currentColor" stroke-width="1.5" />
+</svg>

package/components/common/ui-icons/icon-cart.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Cart
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, cart, shopping, buy, store, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="9" cy="21" r="1" fill="currentColor" opacity="0.6"/><circle cx="20" cy="21" r="1" fill="currentColor" opacity="0.6"/><path d="M1 1h4l2.68 13.39a2 2 0 002 1.61h9.72a2 2 0 002-1.61L23 6H6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/components/common/ui-icons/icon-checkmark.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Checkmark
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, check, done, complete, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M20 6L9 17l-5-5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/components/common/ui-icons/icon-chevron-down.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Chevron Down
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, expand, dropdown, chevron, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M6 9l6 6 6-6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/components/common/ui-icons/icon-chevron-left.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Chevron Left
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, back, previous, chevron, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M15 18l-6-6 6-6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/components/common/ui-icons/icon-chevron-right.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Chevron Right
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, next, forward, chevron, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M9 18l6-6-6-6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/components/common/ui-icons/icon-chevron-up.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Chevron Up
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, collapse, chevron, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M18 15l-6-6-6 6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/components/common/ui-icons/icon-clock.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Clock
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, time, clock, schedule, timer, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="1.5"/><path d="M12 6v6l4 2" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
+</svg>

package/components/common/ui-icons/icon-creditcard.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Credit Card
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, card, payment, credit, wallet, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <rect x="1" y="4" width="22" height="16" rx="2" stroke="currentColor" stroke-width="1.5"/><line x1="1" y1="10" x2="23" y2="10" stroke="currentColor" stroke-width="1.5"/><line x1="5" y1="15" x2="11" y2="15" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
+</svg>

package/components/common/ui-icons/icon-doc.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Doc
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, document, file, page, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><polyline points="14,2 14,8 20,8" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/components/common/ui-icons/icon-download.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Download
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, download, save, export, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M21 15v4a2 2 0 01-2 2H5a2 2 0 01-2-2v-4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><polyline points="7,10 12,15 17,10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><line x1="12" y1="15" x2="12" y2="3" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
+</svg>

package/components/common/ui-icons/icon-ellipsis-vertical.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Ellipsis Vertical
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, more, options, menu, dots-vertical, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="12" cy="12" r="1.5" fill="currentColor"/><circle cx="12" cy="5" r="1.5" fill="currentColor"/><circle cx="12" cy="19" r="1.5" fill="currentColor"/>
+</svg>

package/components/common/ui-icons/icon-ellipsis.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Ellipsis
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, more, options, menu, dots, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="12" cy="12" r="1.5" fill="currentColor"/><circle cx="5" cy="12" r="1.5" fill="currentColor"/><circle cx="19" cy="12" r="1.5" fill="currentColor"/>
+</svg>

package/components/common/ui-icons/icon-envelope.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Envelope
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, mail, email, message, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <rect x="2" y="4" width="20" height="16" rx="2" stroke="currentColor" stroke-width="1.5"/><path d="M22 7l-10 6L2 7" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/components/common/ui-icons/icon-eye-slash.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Eye Slash
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, hide, invisible, hidden, privacy, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M17.94 17.94A10.07 10.07 0 0112 20c-7 0-11-8-11-8a18.45 18.45 0 015.06-5.94M9.9 4.24A9.12 9.12 0 0112 4c7 0 11 8 11 8a18.5 18.5 0 01-2.16 3.19" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><line x1="1" y1="1" x2="23" y2="23" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
+</svg>

package/components/common/ui-icons/icon-eye.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Eye
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, view, visible, show, preview, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" stroke="currentColor" stroke-width="1.5"/><circle cx="12" cy="12" r="3" stroke="currentColor" stroke-width="1.5"/>
+</svg>

package/components/common/ui-icons/icon-faceid.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Face ID
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, faceid, biometric, face, apple, ios, security
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M4 8V6a2 2 0 012-2h2M4 16v2a2 2 0 002 2h2M16 4h2a2 2 0 012 2v2M16 20h2a2 2 0 002-2v-2" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><circle cx="9" cy="10" r="0.75" fill="currentColor"/><circle cx="15" cy="10" r="0.75" fill="currentColor"/><path d="M9 15c.83.67 2 1 3 1s2.17-.33 3-1" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
+</svg>

package/components/common/ui-icons/icon-favorite.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Favorite
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, favorite, heart, like, love, ui
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M20.84 4.61C20.3292 4.09924 19.7228 3.69397 19.0554 3.41708C18.3879 3.14019 17.6725 2.99756 16.95 2.99756C16.2275 2.99756 15.5121 3.14019 14.8446 3.41708C14.1772 3.69397 13.5708 4.09924 13.06 4.61L12 5.67L10.94 4.61C9.9083 3.57831 8.50903 2.99809 7.05 2.99809C5.59096 2.99809 4.19169 3.57831 3.16 4.61C2.12831 5.64169 1.54809 7.04097 1.54809 8.5C1.54809 9.95903 2.12831 11.3583 3.16 12.39L4.22 13.45L12 21.23L19.78 13.45L20.84 12.39C21.3508 11.8792 21.756 11.2728 22.0329 10.6054C22.3098 9.93789 22.4524 9.22249 22.4524 8.5C22.4524 7.77751 22.3098 7.0621 22.0329 6.39464C21.756 5.72718 21.3508 5.12075 20.84 4.61Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+</svg>

package/components/common/ui-icons/icon-folder.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Folder
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, folder, directory, organize, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M22 19a2 2 0 01-2 2H4a2 2 0 01-2-2V5a2 2 0 012-2h5l2 3h9a2 2 0 012 2z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/components/common/ui-icons/icon-globe.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Globe
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, world, web, internet, language, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="1.5"/><line x1="2" y1="12" x2="22" y2="12" stroke="currentColor" stroke-width="1.5"/><path d="M12 2a15.3 15.3 0 014 10 15.3 15.3 0 01-4 10 15.3 15.3 0 01-4-10 15.3 15.3 0 014-10z" stroke="currentColor" stroke-width="1.5"/>
+</svg>

package/components/common/ui-icons/icon-heart-fill.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Heart Fill
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, heart, love, like, filled, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M20.84 4.61a5.5 5.5 0 00-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 00-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 000-7.78z" fill="currentColor" opacity="0.85"/>
+</svg>

package/components/common/ui-icons/icon-heart.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Heart
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, heart, love, like, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M20.84 4.61a5.5 5.5 0 00-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 00-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 000-7.78z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/components/common/ui-icons/icon-home.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Home
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, home, house, navigation, ui
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M3 10.5L12 3L21 10.5V20C21 20.5523 20.5523 21 20 21H15V15H9V21H4C3.44772 21 3 20.5523 3 20V10.5Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+</svg>

package/components/common/ui-icons/icon-link.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Link
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, link, url, chain, connect, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M10 13a5 5 0 007.54.54l3-3a5 5 0 00-7.07-7.07l-1.72 1.71" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><path d="M14 11a5 5 0 00-7.54-.54l-3 3a5 5 0 007.07 7.07l1.71-1.71" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
+</svg>

package/components/common/ui-icons/icon-list-bullet.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon List Bullet
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, list, bullet, items, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <line x1="8" y1="6" x2="21" y2="6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><line x1="8" y1="12" x2="21" y2="12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><line x1="8" y1="18" x2="21" y2="18" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><circle cx="4" cy="6" r="1" fill="currentColor"/><circle cx="4" cy="12" r="1" fill="currentColor"/><circle cx="4" cy="18" r="1" fill="currentColor"/>
+</svg>

package/components/common/ui-icons/icon-location.html

@@ -0,0 +1,11 @@
+<!--
+@name: Icon Location
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, location, map, pin, marker, place, ui
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M21 10C21 17 12 23 12 23C12 23 3 17 3 10C3 7.61305 3.94821 5.32387 5.63604 3.63604C7.32387 1.94821 9.61305 1 12 1C14.3869 1 16.6761 1.94821 18.364 3.63604C20.0518 5.32387 21 7.61305 21 10Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+  <circle cx="12" cy="10" r="3" stroke="currentColor" stroke-width="1.5" />
+</svg>

package/components/common/ui-icons/icon-lock.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Lock
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, lock, secure, password, privacy, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <rect x="3" y="11" width="18" height="11" rx="2" stroke="currentColor" stroke-width="1.5"/><path d="M7 11V7a5 5 0 0110 0v4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
+</svg>

package/components/common/ui-icons/icon-magnifying-glass.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Magnifying Glass
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, search, find, magnify, ios, spotlight
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="11" cy="11" r="7" stroke="currentColor" stroke-width="1.5"/><path d="M21 21l-4.35-4.35" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
+</svg>

package/components/common/ui-icons/icon-map.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Map
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, map, navigation, directions, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <polygon points="1,6 1,22 8,18 16,22 23,18 23,2 16,6 8,2" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" fill="none"/><line x1="8" y1="2" x2="8" y2="18" stroke="currentColor" stroke-width="1.5"/><line x1="16" y1="6" x2="16" y2="22" stroke="currentColor" stroke-width="1.5"/>
+</svg>

package/components/common/ui-icons/icon-menu-hamburger.html

@@ -0,0 +1,12 @@
+<!--
+@name: Icon Menu Hamburger
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, menu, hamburger, navigation, toggle, ui
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <line x1="3" y1="6" x2="21" y2="6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
+  <line x1="3" y1="12" x2="21" y2="12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
+  <line x1="3" y1="18" x2="21" y2="18" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
+</svg>

package/components/common/ui-icons/icon-mic.html

@@ -0,0 +1,10 @@
+<!--
+@name: Icon Mic
+@kit: common
+@width: 24
+@height: 24
+@tags: icon, microphone, voice, audio, record, ios
+-->
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M12 1a3 3 0 00-3 3v8a3 3 0 006 0V4a3 3 0 00-3-3z" stroke="currentColor" stroke-width="1.5"/><path d="M19 10v2a7 7 0 01-14 0v-2" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><line x1="12" y1="19" x2="12" y2="23" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
+</svg>