@designbasekorea/ui-wc 0.5.3 → 0.5.6

package/dist/esm/components/db-share-icons.js

@@ -1 +1,40 @@
-const l={facebook:'<path fill="currentColor" d="M2.002 12.001c0 4.99 3.656 9.126 8.437 9.879v-6.988h-2.54v-2.891h2.54V9.798c0-2.508 1.493-3.891 3.776-3.891q1.095 0 2.24.195V8.56h-1.264c-1.24 0-1.628.772-1.628 1.563v1.875h2.771l-.443 2.891h-2.328v6.988C18.344 21.129 22 16.992 22 12.001c0-5.522-4.477-10-9.999-10-5.522.001-10 4.478-10 10"/>',x:'<path fill="currentColor" d="M17.801 3h3.066l-6.731 7.638L22 21h-6.171l-4.832-6.297L5.466 21H2.4l7.13-8.17L2 3h6.325l4.365 5.752zm-1.073 16.207h1.7L7.432 4.727H5.605z"/>',instagram:'<path fill="currentColor" fill-rule="evenodd" d="M7.376 12a4.623 4.623 0 1 0 9.246.002A4.623 4.623 0 0 0 7.376 12m1.619 0a3.003 3.003 0 1 1 6.007.001 3.003 3.003 0 0 1-6.007 0m8.889-4.793a1.078 1.078 0 1 0-2.156 0 1.078 1.078 0 0 0 2.156 0m.016-3.728a6.6 6.6 0 0 0-2.186-.42c-.963-.042-1.268-.054-3.71-.054s-2.755 0-3.71.054a6.6 6.6 0 0 0-2.184.42A4.6 4.6 0 0 0 3.477 6.11a6.6 6.6 0 0 0-.419 2.186c-.043.962-.056 1.267-.056 3.71s0 2.753.056 3.71c.015.748.156 1.486.419 2.187a4.6 4.6 0 0 0 2.634 2.632 6.6 6.6 0 0 0 2.185.45c.963.042 1.268.055 3.71.055s2.755 0 3.71-.055a6.6 6.6 0 0 0 2.186-.42 4.61 4.61 0 0 0 2.633-2.632c.263-.7.404-1.438.419-2.186.043-.962.056-1.267.056-3.71s0-2.753-.056-3.71a6.6 6.6 0 0 0-.421-2.217A4.6 4.6 0 0 0 17.9 3.479m1.104 13.852a2.99 2.99 0 0 1-1.712 1.71 5 5 0 0 1-1.67.312c-.95.044-1.218.055-3.654.055-2.438 0-2.687 0-3.655-.055a5 5 0 0 1-1.67-.311 2.99 2.99 0 0 1-1.718-1.711 5.1 5.1 0 0 1-.311-1.67c-.043-.95-.053-1.217-.053-3.653s0-2.686.053-3.655a5 5 0 0 1 .311-1.687c.305-.79.93-1.41 1.719-1.712a5 5 0 0 1 1.669-.311c.95-.043 1.218-.055 3.655-.055s2.687 0 3.654.055a5 5 0 0 1 1.67.31 3 3 0 0 1 1.712 1.713 5.1 5.1 0 0 1 .311 1.669c.043.95.054 1.218.054 3.655s0 2.698-.043 3.654h-.011v-.001a5 5 0 0 1-.311 1.688" clip-rule="evenodd"/>',linkedin:'<path fill="currentColor" fill-rule="evenodd" d="M17 21v-6.75c0-1.059-1.188-1.944-2.246-1.944-1.06 0-1.754.885-1.754 1.944V21H9V9h4v2c.662-1.071 2.356-1.763 3.525-1.763C18.997 9.237 21 11.28 21 13.75V21zM3 21V9h4v12zM7 5a2 2 0 1 1-4 0 2 2 0 0 1 4 0" clip-rule="evenodd"/>',youtube:'<path fill="currentColor" d="M23.498 6.186a3.02 3.02 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.02 3.02 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.02 3.02 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.02 3.02 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814M9.545 15.568V8.432L15.818 12z"/>',pinterest:'<path fill="currentColor" d="M12 2C6.474 2 2 6.478 2 12.008a10 10 0 0 0 6.351 9.316c-.09-.797-.165-1.999.03-2.87.18-.782 1.172-4.974 1.172-4.974s-.3-.601-.3-1.488c0-1.397.81-2.434 1.801-2.434.856 0 1.261.646 1.261 1.413 0 .856-.54 2.149-.825 3.335-.24.992.495 1.804 1.486 1.804 1.772 0 3.138-1.879 3.138-4.583 0-2.39-1.727-4.072-4.174-4.072-2.838 0-4.52 2.133-4.52 4.342 0 .857.33 1.788.751 2.284.075.105.09.18.075.286-.075.315-.24.991-.27 1.127-.045.18-.15.225-.33.135-1.247-.586-2.027-2.404-2.027-3.877 0-3.155 2.297-6.056 6.606-6.056 3.469 0 6.156 2.48 6.156 5.77 0 3.442-2.177 6.222-5.18 6.222-1.006 0-1.967-.526-2.297-1.142l-.616 2.374c-.225.871-.84 1.953-1.246 2.63.931.285 1.922.45 2.958.45 5.526 0 10-4.478 10-10.007C22 6.478 17.526 2 12 2"/>',whatsapp:'<path fill="currentColor" d="M12.042 2a9.92 9.92 0 0 1 7.044 2.906A9.83 9.83 0 0 1 22 11.918c-.003 5.464-4.47 9.91-9.958 9.91h-.005a10 10 0 0 1-4.758-1.206L2 22l1.413-5.136a9.86 9.86 0 0 1-1.329-4.954C2.086 6.446 6.553 2 12.042 2M8.516 7.333a.92.92 0 0 0-.663.31c-.228.249-.872.848-.872 2.066s.89 2.394 1.016 2.562c.124.165 1.722 2.746 4.251 3.739 2.101.825 2.53.661 2.985.62.457-.041 1.473-.6 1.68-1.178s.208-1.074.146-1.178-.229-.165-.478-.289-1.472-.723-1.7-.805-.394-.124-.56.124-.643.805-.788.97c-.145.166-.29.187-.539.063s-1.05-.386-2-1.23c-.74-.656-1.239-1.466-1.385-1.714s-.015-.383.11-.506c.111-.111.248-.29.373-.434.124-.144.166-.248.249-.413s.04-.31-.022-.434c-.062-.123-.545-1.348-.766-1.838-.187-.413-.383-.422-.56-.43z"/>',telegram:'<path fill="currentColor" d="M12 2c5.523 0 10 4.477 10 10s-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2m4.08 6.012c-.375.008-.958.209-3.73 1.366-.975.408-2.915 1.248-5.829 2.514-.466.191-.716.375-.74.558-.042.35.457.458 1.081.657.517.167 1.2.358 1.558.367.325.008.682-.125 1.082-.4 2.72-1.838 4.118-2.77 4.213-2.789.066-.017.15-.033.208.017s.059.15.05.175c-.05.208-2.604 2.537-2.755 2.689-.566.583-1.208.94-.217 1.59.858.566 1.349.924 2.231 1.499.558.366 1 .799 1.583.749.266-.025.54-.275.682-1.024.333-1.765.982-5.603 1.132-7.185.017-.133 0-.308-.017-.392a.44.44 0 0 0-.141-.274c-.125-.1-.308-.117-.39-.117"/>',mail:'<path fill="currentColor" fill-rule="evenodd" d="m1.665 8.67.67-1.34L12 12.161l9.665-4.833.67 1.342L12 13.839z" clip-rule="evenodd"/><path fill="currentColor" fill-rule="evenodd" d="M4 5.75c-.69 0-1.25.56-1.25 1.25v10c0 .69.56 1.25 1.25 1.25h16c.69 0 1.25-.56 1.25-1.25V7c0-.69-.56-1.25-1.25-1.25zM1.25 7A2.75 2.75 0 0 1 4 4.25h16A2.75 2.75 0 0 1 22.75 7v10A2.75 2.75 0 0 1 20 19.75H4A2.75 2.75 0 0 1 1.25 17z" clip-rule="evenodd"/>',link:'<path fill="currentColor" fill-rule="evenodd" d="m15.344 9.698-5.657 5.657-1.06-1.06 5.657-5.657z" clip-rule="evenodd"/><path fill="currentColor" fill-rule="evenodd" d="M17.819 6.163a4.25 4.25 0 0 0-6.01 0l-1.415 1.414-1.06-1.06 1.414-1.414a5.75 5.75 0 0 1 8.132 8.132l-1.416 1.414-1.06-1.062 1.415-1.413a4.25 4.25 0 0 0 0-6.01M6.154 11.818l1.412-1.412-.53-.531-.53-.53-1.414 1.414-.003.003c-2.22 2.244-2.211 5.86.029 8.075 2.245 2.22 5.824 2.31 8.102.056l.003-.003 1.414-1.414-1.06-1.06-1.412 1.41v.002c-1.67 1.65-4.308 1.608-5.993-.057-1.645-1.627-1.659-4.293-.018-5.953" clip-rule="evenodd"/>',copy:'<path fill="currentColor" fill-rule="evenodd" d="M8 3.75a.25.25 0 0 0-.25.25v12c0 .138.112.25.25.25h12a.25.25 0 0 0 .25-.25V4a.25.25 0 0 0-.25-.25zM6.25 4c0-.966.784-1.75 1.75-1.75h12c.966 0 1.75.784 1.75 1.75v12A1.75 1.75 0 0 1 20 17.75H8A1.75 1.75 0 0 1 6.25 16z" clip-rule="evenodd"/><path fill="currentColor" fill-rule="evenodd" d="M3.75 9v9A2.25 2.25 0 0 0 6 20.25h9v1.5H6A3.75 3.75 0 0 1 2.25 18V9z" clip-rule="evenodd"/>',"scan-qrcode":'<path fill="currentColor" d="M2.25 4c0-.964.786-1.75 1.75-1.75h3v1.5H4a.253.253 0 0 0-.25.25v3h-1.5zM20.25 4a.253.253 0 0 0-.25-.25h-3v-1.5h3c.964 0 1.75.786 1.75 1.75v3h-1.5zM20.25 20v-3h1.5v3c0 .964-.786 1.75-1.75 1.75h-3v-1.5h3c.136 0 .25-.114.25-.25M2.25 20v-3h1.5v3c0 .136.114.25.25.25h3v1.5H4c-.964 0-1.75-.786-1.75-1.75M9.5 7.5v2h-2v-2zM11 6H6v5h5zM16.5 7.5v2h-2v-2zM18 6h-5v5h5zM9.5 14.5v2h-2v-2zM11 13H6v5h5zM14.5 16.5H13V18h1.5zM18 15h-1.5v3H18z"/><path fill="currentColor" d="M18 15h-3v1.5h3zM14.5 13H13v1.5h1.5z"/>',"share-alt":'<path fill="currentColor" fill-rule="evenodd" d="M13.69 3.317a.75.75 0 0 1 .804.119l8 7a.75.75 0 0 1 0 1.128l-8 7A.75.75 0 0 1 13.25 18v-3.24c-1.925.051-3.579.315-5.062.932-1.659.692-3.157 1.85-4.588 3.758A.75.75 0 0 1 2.25 19c0-4.145 1.147-6.888 3.291-8.698 1.96-1.655 4.655-2.437 7.709-2.943V4a.75.75 0 0 1 .44-.683m1.06 2.336V8a.75.75 0 0 1-.638.742c-3.283.497-5.85 1.225-7.603 2.706-1.359 1.147-2.303 2.812-2.631 5.39 1.153-1.15 2.386-1.969 3.734-2.53 1.928-.804 4.04-1.058 6.388-1.058a.75.75 0 0 1 .75.75v2.347L20.861 11z" clip-rule="evenodd"/>'},e={facebook:"facebook",x:"x",instagram:"instagram",linkedin:"linkedin",pinterest:"pinterest",whatsapp:"whatsapp",telegram:"telegram",email:"mail",link:"link",qr:"scan-qrcode"};function createShareIcon(e,r=24){const c=document.createElement("template");return c.innerHTML=`<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" width="${r}" height="${r}" aria-hidden="true" focusable="false" data-designbase-icon="${e}">${l[e]}</svg>`,c.content.firstElementChild}function createSharePlatformIcon(l,r=24){return createShareIcon(e[l],r)}export{createShareIcon,createSharePlatformIcon};
+/**
+ * SVG paths synced from @designbasekorea/icons (packages/icons)
+ */
+const SHARE_ICON_PATHS = {
+    facebook: '<path fill="currentColor" d="M2.002 12.001c0 4.99 3.656 9.126 8.437 9.879v-6.988h-2.54v-2.891h2.54V9.798c0-2.508 1.493-3.891 3.776-3.891q1.095 0 2.24.195V8.56h-1.264c-1.24 0-1.628.772-1.628 1.563v1.875h2.771l-.443 2.891h-2.328v6.988C18.344 21.129 22 16.992 22 12.001c0-5.522-4.477-10-9.999-10-5.522.001-10 4.478-10 10"/>',
+    x: '<path fill="currentColor" d="M17.801 3h3.066l-6.731 7.638L22 21h-6.171l-4.832-6.297L5.466 21H2.4l7.13-8.17L2 3h6.325l4.365 5.752zm-1.073 16.207h1.7L7.432 4.727H5.605z"/>',
+    instagram: '<path fill="currentColor" fill-rule="evenodd" d="M7.376 12a4.623 4.623 0 1 0 9.246.002A4.623 4.623 0 0 0 7.376 12m1.619 0a3.003 3.003 0 1 1 6.007.001 3.003 3.003 0 0 1-6.007 0m8.889-4.793a1.078 1.078 0 1 0-2.156 0 1.078 1.078 0 0 0 2.156 0m.016-3.728a6.6 6.6 0 0 0-2.186-.42c-.963-.042-1.268-.054-3.71-.054s-2.755 0-3.71.054a6.6 6.6 0 0 0-2.184.42A4.6 4.6 0 0 0 3.477 6.11a6.6 6.6 0 0 0-.419 2.186c-.043.962-.056 1.267-.056 3.71s0 2.753.056 3.71c.015.748.156 1.486.419 2.187a4.6 4.6 0 0 0 2.634 2.632 6.6 6.6 0 0 0 2.185.45c.963.042 1.268.055 3.71.055s2.755 0 3.71-.055a6.6 6.6 0 0 0 2.186-.42 4.61 4.61 0 0 0 2.633-2.632c.263-.7.404-1.438.419-2.186.043-.962.056-1.267.056-3.71s0-2.753-.056-3.71a6.6 6.6 0 0 0-.421-2.217A4.6 4.6 0 0 0 17.9 3.479m1.104 13.852a2.99 2.99 0 0 1-1.712 1.71 5 5 0 0 1-1.67.312c-.95.044-1.218.055-3.654.055-2.438 0-2.687 0-3.655-.055a5 5 0 0 1-1.67-.311 2.99 2.99 0 0 1-1.718-1.711 5.1 5.1 0 0 1-.311-1.67c-.043-.95-.053-1.217-.053-3.653s0-2.686.053-3.655a5 5 0 0 1 .311-1.687c.305-.79.93-1.41 1.719-1.712a5 5 0 0 1 1.669-.311c.95-.043 1.218-.055 3.655-.055s2.687 0 3.654.055a5 5 0 0 1 1.67.31 3 3 0 0 1 1.712 1.713 5.1 5.1 0 0 1 .311 1.669c.043.95.054 1.218.054 3.655s0 2.698-.043 3.654h-.011v-.001a5 5 0 0 1-.311 1.688" clip-rule="evenodd"/>',
+    linkedin: '<path fill="currentColor" fill-rule="evenodd" d="M17 21v-6.75c0-1.059-1.188-1.944-2.246-1.944-1.06 0-1.754.885-1.754 1.944V21H9V9h4v2c.662-1.071 2.356-1.763 3.525-1.763C18.997 9.237 21 11.28 21 13.75V21zM3 21V9h4v12zM7 5a2 2 0 1 1-4 0 2 2 0 0 1 4 0" clip-rule="evenodd"/>',
+    youtube: '<path fill="currentColor" d="M23.498 6.186a3.02 3.02 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.02 3.02 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.02 3.02 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.02 3.02 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814M9.545 15.568V8.432L15.818 12z"/>',
+    pinterest: '<path fill="currentColor" d="M12 2C6.474 2 2 6.478 2 12.008a10 10 0 0 0 6.351 9.316c-.09-.797-.165-1.999.03-2.87.18-.782 1.172-4.974 1.172-4.974s-.3-.601-.3-1.488c0-1.397.81-2.434 1.801-2.434.856 0 1.261.646 1.261 1.413 0 .856-.54 2.149-.825 3.335-.24.992.495 1.804 1.486 1.804 1.772 0 3.138-1.879 3.138-4.583 0-2.39-1.727-4.072-4.174-4.072-2.838 0-4.52 2.133-4.52 4.342 0 .857.33 1.788.751 2.284.075.105.09.18.075.286-.075.315-.24.991-.27 1.127-.045.18-.15.225-.33.135-1.247-.586-2.027-2.404-2.027-3.877 0-3.155 2.297-6.056 6.606-6.056 3.469 0 6.156 2.48 6.156 5.77 0 3.442-2.177 6.222-5.18 6.222-1.006 0-1.967-.526-2.297-1.142l-.616 2.374c-.225.871-.84 1.953-1.246 2.63.931.285 1.922.45 2.958.45 5.526 0 10-4.478 10-10.007C22 6.478 17.526 2 12 2"/>',
+    whatsapp: '<path fill="currentColor" d="M12.042 2a9.92 9.92 0 0 1 7.044 2.906A9.83 9.83 0 0 1 22 11.918c-.003 5.464-4.47 9.91-9.958 9.91h-.005a10 10 0 0 1-4.758-1.206L2 22l1.413-5.136a9.86 9.86 0 0 1-1.329-4.954C2.086 6.446 6.553 2 12.042 2M8.516 7.333a.92.92 0 0 0-.663.31c-.228.249-.872.848-.872 2.066s.89 2.394 1.016 2.562c.124.165 1.722 2.746 4.251 3.739 2.101.825 2.53.661 2.985.62.457-.041 1.473-.6 1.68-1.178s.208-1.074.146-1.178-.229-.165-.478-.289-1.472-.723-1.7-.805-.394-.124-.56.124-.643.805-.788.97c-.145.166-.29.187-.539.063s-1.05-.386-2-1.23c-.74-.656-1.239-1.466-1.385-1.714s-.015-.383.11-.506c.111-.111.248-.29.373-.434.124-.144.166-.248.249-.413s.04-.31-.022-.434c-.062-.123-.545-1.348-.766-1.838-.187-.413-.383-.422-.56-.43z"/>',
+    telegram: '<path fill="currentColor" d="M12 2c5.523 0 10 4.477 10 10s-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2m4.08 6.012c-.375.008-.958.209-3.73 1.366-.975.408-2.915 1.248-5.829 2.514-.466.191-.716.375-.74.558-.042.35.457.458 1.081.657.517.167 1.2.358 1.558.367.325.008.682-.125 1.082-.4 2.72-1.838 4.118-2.77 4.213-2.789.066-.017.15-.033.208.017s.059.15.05.175c-.05.208-2.604 2.537-2.755 2.689-.566.583-1.208.94-.217 1.59.858.566 1.349.924 2.231 1.499.558.366 1 .799 1.583.749.266-.025.54-.275.682-1.024.333-1.765.982-5.603 1.132-7.185.017-.133 0-.308-.017-.392a.44.44 0 0 0-.141-.274c-.125-.1-.308-.117-.39-.117"/>',
+    mail: '<path fill="currentColor" fill-rule="evenodd" d="m1.665 8.67.67-1.34L12 12.161l9.665-4.833.67 1.342L12 13.839z" clip-rule="evenodd"/><path fill="currentColor" fill-rule="evenodd" d="M4 5.75c-.69 0-1.25.56-1.25 1.25v10c0 .69.56 1.25 1.25 1.25h16c.69 0 1.25-.56 1.25-1.25V7c0-.69-.56-1.25-1.25-1.25zM1.25 7A2.75 2.75 0 0 1 4 4.25h16A2.75 2.75 0 0 1 22.75 7v10A2.75 2.75 0 0 1 20 19.75H4A2.75 2.75 0 0 1 1.25 17z" clip-rule="evenodd"/>',
+    link: '<path fill="currentColor" fill-rule="evenodd" d="m15.344 9.698-5.657 5.657-1.06-1.06 5.657-5.657z" clip-rule="evenodd"/><path fill="currentColor" fill-rule="evenodd" d="M17.819 6.163a4.25 4.25 0 0 0-6.01 0l-1.415 1.414-1.06-1.06 1.414-1.414a5.75 5.75 0 0 1 8.132 8.132l-1.416 1.414-1.06-1.062 1.415-1.413a4.25 4.25 0 0 0 0-6.01M6.154 11.818l1.412-1.412-.53-.531-.53-.53-1.414 1.414-.003.003c-2.22 2.244-2.211 5.86.029 8.075 2.245 2.22 5.824 2.31 8.102.056l.003-.003 1.414-1.414-1.06-1.06-1.412 1.41v.002c-1.67 1.65-4.308 1.608-5.993-.057-1.645-1.627-1.659-4.293-.018-5.953" clip-rule="evenodd"/>',
+    copy: '<path fill="currentColor" fill-rule="evenodd" d="M8 3.75a.25.25 0 0 0-.25.25v12c0 .138.112.25.25.25h12a.25.25 0 0 0 .25-.25V4a.25.25 0 0 0-.25-.25zM6.25 4c0-.966.784-1.75 1.75-1.75h12c.966 0 1.75.784 1.75 1.75v12A1.75 1.75 0 0 1 20 17.75H8A1.75 1.75 0 0 1 6.25 16z" clip-rule="evenodd"/><path fill="currentColor" fill-rule="evenodd" d="M3.75 9v9A2.25 2.25 0 0 0 6 20.25h9v1.5H6A3.75 3.75 0 0 1 2.25 18V9z" clip-rule="evenodd"/>',
+    'scan-qrcode': '<path fill="currentColor" d="M2.25 4c0-.964.786-1.75 1.75-1.75h3v1.5H4a.253.253 0 0 0-.25.25v3h-1.5zM20.25 4a.253.253 0 0 0-.25-.25h-3v-1.5h3c.964 0 1.75.786 1.75 1.75v3h-1.5zM20.25 20v-3h1.5v3c0 .964-.786 1.75-1.75 1.75h-3v-1.5h3c.136 0 .25-.114.25-.25M2.25 20v-3h1.5v3c0 .136.114.25.25.25h3v1.5H4c-.964 0-1.75-.786-1.75-1.75M9.5 7.5v2h-2v-2zM11 6H6v5h5zM16.5 7.5v2h-2v-2zM18 6h-5v5h5zM9.5 14.5v2h-2v-2zM11 13H6v5h5zM14.5 16.5H13V18h1.5zM18 15h-1.5v3H18z"/><path fill="currentColor" d="M18 15h-3v1.5h3zM14.5 13H13v1.5h1.5z"/>',
+    'share-alt': '<path fill="currentColor" fill-rule="evenodd" d="M13.69 3.317a.75.75 0 0 1 .804.119l8 7a.75.75 0 0 1 0 1.128l-8 7A.75.75 0 0 1 13.25 18v-3.24c-1.925.051-3.579.315-5.062.932-1.659.692-3.157 1.85-4.588 3.758A.75.75 0 0 1 2.25 19c0-4.145 1.147-6.888 3.291-8.698 1.96-1.655 4.655-2.437 7.709-2.943V4a.75.75 0 0 1 .44-.683m1.06 2.336V8a.75.75 0 0 1-.638.742c-3.283.497-5.85 1.225-7.603 2.706-1.359 1.147-2.303 2.812-2.631 5.39 1.153-1.15 2.386-1.969 3.734-2.53 1.928-.804 4.04-1.058 6.388-1.058a.75.75 0 0 1 .75.75v2.347L20.861 11z" clip-rule="evenodd"/>',
+};
+const PLATFORM_ICON_MAP = {
+    facebook: 'facebook',
+    x: 'x',
+    instagram: 'instagram',
+    linkedin: 'linkedin',
+    pinterest: 'pinterest',
+    whatsapp: 'whatsapp',
+    telegram: 'telegram',
+    email: 'mail',
+    link: 'link',
+    qr: 'scan-qrcode',
+};
+function createShareIcon(name, size = 24) {
+    const template = document.createElement('template');
+    template.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" width="${size}" height="${size}" aria-hidden="true" focusable="false" data-designbase-icon="${name}">${SHARE_ICON_PATHS[name]}</svg>`;
+    return template.content.firstElementChild;
+}
+function createSharePlatformIcon(platform, size = 24) {
+    return createShareIcon(PLATFORM_ICON_MAP[platform], size);
+}
+
+export { createShareIcon, createSharePlatformIcon };

package/dist/esm/components/db-share.js

@@ -1 +1,489 @@
-import{createShareIcon as t,createSharePlatformIcon as e}from"./db-share-icons.js";const s=["facebook","x","linkedin","whatsapp","email","link"],n={facebook:{name:"Facebook",color:"#1877f2",shareUrl:"https://www.facebook.com/sharer/sharer.php?u={url}"},x:{name:"X",color:"#000000",shareUrl:"https://twitter.com/intent/tweet?url={url}&text={title}&hashtags={hashtags}"},instagram:{name:"Instagram",color:"#e4405f",shareUrl:"https://www.instagram.com/",customShare:()=>{window.alert("Instagram에 직접 공유하려면 링크를 복사하여 사용하세요.")}},linkedin:{name:"LinkedIn",color:"#0077b5",shareUrl:"https://www.linkedin.com/sharing/share-offsite/?url={url}"},pinterest:{name:"Pinterest",color:"#bd081c",shareUrl:"https://pinterest.com/pin/create/button/?url={url}&description={title}&media={imageUrl}"},whatsapp:{name:"WhatsApp",color:"#25d366",shareUrl:"https://wa.me/?text={title}%20{url}"},telegram:{name:"Telegram",color:"#0088cc",shareUrl:"https://t.me/share/url?url={url}&text={title}"},email:{name:"이메일",color:"#ea4335",shareUrl:"mailto:?subject={title}&body={description}%20{url}"},link:{name:"링크 복사",color:"#6c757d",shareUrl:""},qr:{name:"QR 코드",color:"#6c757d",shareUrl:""}};class DbShare extends HTMLElement{constructor(){super(...arguments),this.isCopied=!1,this.qrCodeData="",this.copyResetTimer=null,this.modalEl=null,this.contentSlot=null,this.dropdownEl=null}static get observedAttributes(){return["url","title","description","image-url","hashtags","variant","size","position","platforms","button-text","modal-title","show-qr-code","qr-code-size","copy-success-message","open"]}connectedCallback(){this.render()}disconnectedCallback(){this.copyResetTimer&&clearTimeout(this.copyResetTimer)}attributeChangedCallback(t){"open"===t&&"modal"===this.getAttribute("variant")&&this.modalEl?this.syncModalOpen():"url"===t&&this.contentSlot?this.refreshLinkInputValue():this.render()}get open(){return this.hasAttribute("open")&&"false"!==this.getAttribute("open")}set open(t){t?this.setAttribute("open","true"):this.removeAttribute("open")}parseListAttribute(t){const e=this.getAttribute(t);if(!e)return[];try{const t=JSON.parse(e);if(Array.isArray(t))return t.map(t=>String(t).trim()).filter(Boolean)}catch{}return e.split(",").map(t=>t.trim()).filter(Boolean)}getResolvedUrl(){const t=this.getAttribute("url");return t||("undefined"!=typeof window&&window.location?.href?window.location.href:"")}getContext(){return{url:this.getResolvedUrl(),title:this.getAttribute("share-title")||this.getAttribute("title")||"",description:this.getAttribute("description")||"",imageUrl:this.getAttribute("image-url")||"",hashtags:this.parseListAttribute("hashtags"),host:this}}getActivePlatforms(){const t=this.parseListAttribute("platforms");return(t.length>0?t:s).filter(t=>t in n)}replaceUrlVariables(t,e){return t.replace("{url}",encodeURIComponent(e.url)).replace("{title}",encodeURIComponent(e.title)).replace("{description}",encodeURIComponent(e.description)).replace("{imageUrl}",encodeURIComponent(e.imageUrl)).replace("{hashtags}",e.hashtags.join(","))}async handleCopyLink(t){try{await navigator.clipboard.writeText(t.url),this.isCopied=!0,this.dispatchEvent(new CustomEvent("db-copy-success",{bubbles:!0,composed:!0,detail:{url:t.url}})),this.refreshContent(),this.copyResetTimer&&clearTimeout(this.copyResetTimer),this.copyResetTimer=setTimeout(()=>{this.isCopied=!1,this.refreshContent()},3e3)}catch(t){this.dispatchEvent(new CustomEvent("db-copy-error",{bubbles:!0,composed:!0,detail:{error:t}}))}}handleShowQrCode(t){if(this.qrCodeData=t.url,"modal"===this.getAttribute("variant"))return this.open=!0,void this.refreshContent();this.refreshContent()}handlePlatformShare(t){const e=this.getContext(),s=n[t];if(s)try{if("link"===t)this.handleCopyLink(e);else if("qr"===t)this.handleShowQrCode(e);else if(s.customShare)s.customShare(e);else if(s.shareUrl){const t=this.replaceUrlVariables(s.shareUrl,e);window.open(t,"_blank","width=600,height=400")}this.dispatchEvent(new CustomEvent("db-share",{bubbles:!0,composed:!0,detail:{platform:t,url:e.url}}))}catch(e){this.dispatchEvent(new CustomEvent("db-share-error",{bubbles:!0,composed:!0,detail:{platform:t,error:e}}))}}getPlacement(){const t=this.getAttribute("position")||"bottom";return"top"===t||"left"===t?"top-left":"right"===t?"bottom-right":"bottom-left"}mapButtonSize(){const t=this.getAttribute("size")||"m";return"s"===t?"s":"l"===t?"l":"m"}createTriggerButton(e){const s=document.createElement("db-button");return s.className=e||"designbase-wc-share__trigger",s.setAttribute("variant","secondary"),s.setAttribute("size",this.mapButtonSize()),s.textContent=this.getAttribute("button-text")||"공유",s.prepend(t("share-alt",16)),s.addEventListener("db-click",()=>{"modal"!==this.getAttribute("variant")?this.open=!this.open:this.open=!0}),s}createPlatformIcon(t){const s=document.createElement("span");return s.className="designbase-wc-share__platform-icon",s.append(e(t,24)),s}createPlatformButton(e){const s=n[e],r=document.createElement("button");r.type="button",r.className=["designbase-wc-share__platform-button",`designbase-wc-share__platform-button--${e}`,"link"===e&&this.isCopied?"designbase-wc-share__platform-button--copied":""].filter(Boolean).join(" "),r.style.setProperty("--platform-color",s.color),r.title=s.name,r.setAttribute("aria-label",`${s.name}에 공유하기`),r.append(this.createPlatformIcon(e));const a=document.createElement("span");if(a.className="designbase-wc-share__platform-name",a.textContent=s.name,r.append(a),"link"===e&&this.isCopied){const e=document.createElement("span");e.className="designbase-wc-share__copy-success",e.append(t("copy",12));const s=document.createElement("span");s.textContent="복사됨!",e.append(s),r.append(e)}return r.addEventListener("click",()=>this.handlePlatformShare(e)),r}createLinkInput(t){const e=document.createElement("db-input");return e.className="designbase-wc-share__link-input",e.setAttribute("type","text"),e.setAttribute("readonly",""),e.setAttribute("size","s"),e.setAttribute("full-width",""),e.setAttribute("value",t),customElements.whenDefined("db-input").then(()=>{e.setAttribute("value",t),e.value=t}),e}refreshLinkInputValue(){const t=this.getResolvedUrl(),e=this.contentSlot?.querySelector("db-input.designbase-wc-share__link-input");e&&(e.setAttribute("value",t),e.value=t)}createCopyButton(e){const s=document.createElement("db-button");s.className="designbase-wc-share__copy-button",s.setAttribute("size","s"),s.setAttribute("variant","primary");const n=document.createElement("span");return n.className="designbase-wc-button__start-icon",n.setAttribute("aria-hidden","true"),n.append(t(this.isCopied?"copy":"link",16)),s.append(n),s.append(document.createTextNode(this.isCopied?"복사됨!":"복사")),s.addEventListener("db-click",()=>{this.handleCopyLink(e)}),s}generateQrCodeUrl(){const t=Number(this.getAttribute("qr-code-size")||200);return`https://api.qrserver.com/v1/create-qr-code/?size=${t}x${t}&data=${encodeURIComponent(this.qrCodeData)}`}createShareContent(){const t=document.createElement("div");return t.className="designbase-wc-share__content",this.populateShareContent(t),t}populateShareContent(t){const e=document.createElement("div");e.className="designbase-wc-share__platforms",this.getActivePlatforms().forEach(t=>{e.append(this.createPlatformButton(t))}),t.append(e);if("false"!==this.getAttribute("show-qr-code")&&this.qrCodeData){const e=document.createElement("div");e.className="designbase-wc-share__qr-section";const s=document.createElement("h4");s.className="designbase-wc-share__qr-title",s.textContent="QR 코드",e.append(s);const n=document.createElement("div");n.className="designbase-wc-share__qr-code";const r=document.createElement("img"),a=Number(this.getAttribute("qr-code-size")||200);r.src=this.generateQrCodeUrl(),r.alt="QR Code",r.width=a,r.height=a,n.append(r),e.append(n);const i=document.createElement("p");i.className="designbase-wc-share__qr-description",i.textContent="QR 코드를 스캔하여 링크에 접속하세요",e.append(i),t.append(e)}const s=this.getContext(),n=document.createElement("div");n.className="designbase-wc-share__link-preview";const r=document.createElement("h4");r.className="designbase-wc-share__link-title",r.textContent="공유 링크",n.append(r);const a=document.createElement("div");a.className="designbase-wc-share__link-container",a.append(this.createLinkInput(s.url)),a.append(this.createCopyButton(s)),n.append(a),t.append(n)}refreshContent(){const t=this.getAttribute("variant");if("inline"===t){const t=this.querySelector(":scope > .designbase-wc-share__content");return void t?.replaceWith(this.createShareContent())}"modal"===t&&this.contentSlot&&(this.contentSlot.replaceChildren(),this.populateShareContent(this.contentSlot))}syncModalOpen(){this.modalEl&&(this.open?(this.refreshLinkInputValue(),this.modalEl.setAttribute("open","true")):this.modalEl.removeAttribute("open"))}renderDropdown(){const t=document.createElement("db-dropdown");t.className="designbase-wc-share__dropdown",t.setAttribute("placement",this.getPlacement()),t.setAttribute("label",this.getAttribute("button-text")||"공유"),t.setAttribute("trigger-variant","secondary"),t.setAttribute("trigger-icon","share-alt"),t.setAttribute("size",this.mapButtonSize()),t.setAttribute("items",JSON.stringify(this.getActivePlatforms().map(t=>({id:t,label:n[t].name})))),t.addEventListener("db-change",t=>{const e=t.detail,s=e?.id;s&&this.handlePlatformShare(s)}),this.dropdownEl=t,this.append(t)}renderModal(){const t=this.createTriggerButton();this.append(t);const e=document.createElement("db-modal");e.className="designbase-wc-share__modal",e.setAttribute("title",this.getAttribute("modal-title")||"공유하기"),e.setAttribute("size","m"),this.contentSlot=document.createElement("div"),this.contentSlot.className="designbase-wc-share designbase-wc-share__content",this.contentSlot.setAttribute("data-modal-part","body"),this.populateShareContent(this.contentSlot),e.append(this.contentSlot),e.addEventListener("db-close",()=>{this.open=!1,this.qrCodeData="",this.contentSlot&&(this.contentSlot.replaceChildren(),this.populateShareContent(this.contentSlot))}),this.modalEl=e,this.append(e),this.syncModalOpen()}render(){const t=this.getAttribute("variant")||"button";this.className=`designbase-wc-share designbase-wc-share--${t}`,this.replaceChildren(),this.modalEl=null,this.contentSlot=null,this.dropdownEl=null,"inline"!==t?"dropdown"!==t?"modal"!==t?this.append(this.createTriggerButton()):this.renderModal():this.renderDropdown():this.append(this.createShareContent())}}customElements.get("db-share")||customElements.define("db-share",DbShare);export{DbShare};
+import { createShareIcon, createSharePlatformIcon } from './db-share-icons.js';
+
+const DEFAULT_PLATFORMS = ['facebook', 'x', 'linkedin', 'whatsapp', 'email', 'link'];
+const PLATFORM_CONFIGS = {
+    facebook: {
+        name: 'Facebook',
+        color: '#1877f2',
+        shareUrl: 'https://www.facebook.com/sharer/sharer.php?u={url}',
+    },
+    x: {
+        name: 'X',
+        color: '#000000',
+        shareUrl: 'https://twitter.com/intent/tweet?url={url}&text={title}&hashtags={hashtags}',
+    },
+    instagram: {
+        name: 'Instagram',
+        color: '#e4405f',
+        shareUrl: 'https://www.instagram.com/',
+        customShare: () => {
+            window.alert('Instagram에 직접 공유하려면 링크를 복사하여 사용하세요.');
+        },
+    },
+    linkedin: {
+        name: 'LinkedIn',
+        color: '#0077b5',
+        shareUrl: 'https://www.linkedin.com/sharing/share-offsite/?url={url}',
+    },
+    pinterest: {
+        name: 'Pinterest',
+        color: '#bd081c',
+        shareUrl: 'https://pinterest.com/pin/create/button/?url={url}&description={title}&media={imageUrl}',
+    },
+    whatsapp: {
+        name: 'WhatsApp',
+        color: '#25d366',
+        shareUrl: 'https://wa.me/?text={title}%20{url}',
+    },
+    telegram: {
+        name: 'Telegram',
+        color: '#0088cc',
+        shareUrl: 'https://t.me/share/url?url={url}&text={title}',
+    },
+    email: {
+        name: '이메일',
+        color: '#ea4335',
+        shareUrl: 'mailto:?subject={title}&body={description}%20{url}',
+    },
+    link: {
+        name: '링크 복사',
+        color: '#6c757d',
+        shareUrl: '',
+    },
+    qr: {
+        name: 'QR 코드',
+        color: '#6c757d',
+        shareUrl: '',
+    },
+};
+class DbShare extends HTMLElement {
+    constructor() {
+        super(...arguments);
+        this.isCopied = false;
+        this.qrCodeData = '';
+        this.copyResetTimer = null;
+        this.modalEl = null;
+        this.contentSlot = null;
+        this.dropdownEl = null;
+    }
+    static get observedAttributes() {
+        return [
+            'url',
+            'title',
+            'description',
+            'image-url',
+            'hashtags',
+            'variant',
+            'size',
+            'position',
+            'platforms',
+            'button-text',
+            'modal-title',
+            'show-qr-code',
+            'qr-code-size',
+            'copy-success-message',
+            'open',
+        ];
+    }
+    connectedCallback() {
+        this.render();
+    }
+    disconnectedCallback() {
+        if (this.copyResetTimer)
+            clearTimeout(this.copyResetTimer);
+    }
+    attributeChangedCallback(name) {
+        if (name === 'open' && this.getAttribute('variant') === 'modal' && this.modalEl) {
+            this.syncModalOpen();
+            return;
+        }
+        if (name === 'url' && this.contentSlot) {
+            this.refreshLinkInputValue();
+            return;
+        }
+        this.render();
+    }
+    get open() {
+        return this.hasAttribute('open') && this.getAttribute('open') !== 'false';
+    }
+    set open(value) {
+        if (value)
+            this.setAttribute('open', 'true');
+        else
+            this.removeAttribute('open');
+    }
+    parseListAttribute(name) {
+        const raw = this.getAttribute(name);
+        if (!raw)
+            return [];
+        try {
+            const parsed = JSON.parse(raw);
+            if (Array.isArray(parsed))
+                return parsed.map((item) => String(item).trim()).filter(Boolean);
+        }
+        catch {
+            // fall through to comma-separated parsing
+        }
+        return raw
+            .split(',')
+            .map((item) => item.trim())
+            .filter(Boolean);
+    }
+    getResolvedUrl() {
+        const explicit = this.getAttribute('url');
+        if (explicit)
+            return explicit;
+        if (typeof window !== 'undefined' && window.location?.href) {
+            return window.location.href;
+        }
+        return '';
+    }
+    getContext() {
+        return {
+            url: this.getResolvedUrl(),
+            title: this.getAttribute('share-title') || this.getAttribute('title') || '',
+            description: this.getAttribute('description') || '',
+            imageUrl: this.getAttribute('image-url') || '',
+            hashtags: this.parseListAttribute('hashtags'),
+            host: this,
+        };
+    }
+    getActivePlatforms() {
+        const platforms = this.parseListAttribute('platforms');
+        const resolved = platforms.length > 0 ? platforms : DEFAULT_PLATFORMS;
+        return resolved.filter((platform) => platform in PLATFORM_CONFIGS);
+    }
+    replaceUrlVariables(template, context) {
+        return template
+            .replace('{url}', encodeURIComponent(context.url))
+            .replace('{title}', encodeURIComponent(context.title))
+            .replace('{description}', encodeURIComponent(context.description))
+            .replace('{imageUrl}', encodeURIComponent(context.imageUrl))
+            .replace('{hashtags}', context.hashtags.join(','));
+    }
+    async handleCopyLink(context) {
+        try {
+            await navigator.clipboard.writeText(context.url);
+            this.isCopied = true;
+            this.dispatchEvent(new CustomEvent('db-copy-success', {
+                bubbles: true,
+                composed: true,
+                detail: { url: context.url },
+            }));
+            this.refreshContent();
+            if (this.copyResetTimer)
+                clearTimeout(this.copyResetTimer);
+            this.copyResetTimer = setTimeout(() => {
+                this.isCopied = false;
+                this.refreshContent();
+            }, 3000);
+        }
+        catch (error) {
+            this.dispatchEvent(new CustomEvent('db-copy-error', {
+                bubbles: true,
+                composed: true,
+                detail: { error },
+            }));
+        }
+    }
+    handleShowQrCode(context) {
+        this.qrCodeData = context.url;
+        if (this.getAttribute('variant') === 'modal') {
+            this.open = true;
+            this.refreshContent();
+            return;
+        }
+        this.refreshContent();
+    }
+    handlePlatformShare(platform) {
+        const context = this.getContext();
+        const config = PLATFORM_CONFIGS[platform];
+        if (!config)
+            return;
+        try {
+            if (platform === 'link') {
+                void this.handleCopyLink(context);
+            }
+            else if (platform === 'qr') {
+                this.handleShowQrCode(context);
+            }
+            else if (config.customShare) {
+                config.customShare(context);
+            }
+            else if (config.shareUrl) {
+                const shareUrl = this.replaceUrlVariables(config.shareUrl, context);
+                window.open(shareUrl, '_blank', 'width=600,height=400');
+            }
+            this.dispatchEvent(new CustomEvent('db-share', {
+                bubbles: true,
+                composed: true,
+                detail: { platform, url: context.url },
+            }));
+        }
+        catch (error) {
+            this.dispatchEvent(new CustomEvent('db-share-error', {
+                bubbles: true,
+                composed: true,
+                detail: { platform, error },
+            }));
+        }
+    }
+    getPlacement() {
+        const position = this.getAttribute('position') || 'bottom';
+        if (position === 'top')
+            return 'top-left';
+        if (position === 'left')
+            return 'top-left';
+        if (position === 'right')
+            return 'bottom-right';
+        return 'bottom-left';
+    }
+    mapButtonSize() {
+        const size = this.getAttribute('size') || 'm';
+        if (size === 's')
+            return 's';
+        if (size === 'l')
+            return 'l';
+        return 'm';
+    }
+    createTriggerButton(className) {
+        const button = document.createElement('db-button');
+        button.className = className || 'designbase-wc-share__trigger';
+        button.setAttribute('variant', 'secondary');
+        button.setAttribute('size', this.mapButtonSize());
+        button.textContent = this.getAttribute('button-text') || '공유';
+        button.prepend(createShareIcon('share-alt', 16));
+        button.addEventListener('db-click', () => {
+            const variant = this.getAttribute('variant');
+            if (variant === 'modal') {
+                this.open = true;
+                return;
+            }
+            this.open = !this.open;
+        });
+        return button;
+    }
+    createPlatformIcon(platform) {
+        const iconWrap = document.createElement('span');
+        iconWrap.className = 'designbase-wc-share__platform-icon';
+        iconWrap.append(createSharePlatformIcon(platform, 24));
+        return iconWrap;
+    }
+    createPlatformButton(platform) {
+        const config = PLATFORM_CONFIGS[platform];
+        const button = document.createElement('button');
+        button.type = 'button';
+        button.className = [
+            'designbase-wc-share__platform-button',
+            `designbase-wc-share__platform-button--${platform}`,
+            platform === 'link' && this.isCopied ? 'designbase-wc-share__platform-button--copied' : '',
+        ]
+            .filter(Boolean)
+            .join(' ');
+        button.style.setProperty('--platform-color', config.color);
+        button.title = config.name;
+        button.setAttribute('aria-label', `${config.name}에 공유하기`);
+        button.append(this.createPlatformIcon(platform));
+        const name = document.createElement('span');
+        name.className = 'designbase-wc-share__platform-name';
+        name.textContent = config.name;
+        button.append(name);
+        if (platform === 'link' && this.isCopied) {
+            const success = document.createElement('span');
+            success.className = 'designbase-wc-share__copy-success';
+            success.append(createShareIcon('copy', 12));
+            const label = document.createElement('span');
+            label.textContent = '복사됨!';
+            success.append(label);
+            button.append(success);
+        }
+        button.addEventListener('click', () => this.handlePlatformShare(platform));
+        return button;
+    }
+    createLinkInput(url) {
+        const input = document.createElement('db-input');
+        input.className = 'designbase-wc-share__link-input';
+        input.setAttribute('type', 'text');
+        input.setAttribute('readonly', '');
+        input.setAttribute('size', 's');
+        input.setAttribute('full-width', '');
+        input.setAttribute('value', url);
+        customElements.whenDefined('db-input').then(() => {
+            input.setAttribute('value', url);
+            input.value = url;
+        });
+        return input;
+    }
+    refreshLinkInputValue() {
+        const url = this.getResolvedUrl();
+        const input = this.contentSlot?.querySelector('db-input.designbase-wc-share__link-input');
+        if (!input)
+            return;
+        input.setAttribute('value', url);
+        input.value = url;
+    }
+    createCopyButton(context) {
+        const copyButton = document.createElement('db-button');
+        copyButton.className = 'designbase-wc-share__copy-button';
+        copyButton.setAttribute('size', 's');
+        copyButton.setAttribute('variant', 'primary');
+        const iconWrap = document.createElement('span');
+        iconWrap.className = 'designbase-wc-button__start-icon';
+        iconWrap.setAttribute('aria-hidden', 'true');
+        iconWrap.append(createShareIcon(this.isCopied ? 'copy' : 'link', 16));
+        copyButton.append(iconWrap);
+        copyButton.append(document.createTextNode(this.isCopied ? '복사됨!' : '복사'));
+        copyButton.addEventListener('db-click', () => {
+            void this.handleCopyLink(context);
+        });
+        return copyButton;
+    }
+    generateQrCodeUrl() {
+        const qrCodeSize = Number(this.getAttribute('qr-code-size') || 200);
+        return `https://api.qrserver.com/v1/create-qr-code/?size=${qrCodeSize}x${qrCodeSize}&data=${encodeURIComponent(this.qrCodeData)}`;
+    }
+    createShareContent() {
+        const content = document.createElement('div');
+        content.className = 'designbase-wc-share__content';
+        this.populateShareContent(content);
+        return content;
+    }
+    populateShareContent(content) {
+        const platformsWrap = document.createElement('div');
+        platformsWrap.className = 'designbase-wc-share__platforms';
+        this.getActivePlatforms().forEach((platform) => {
+            platformsWrap.append(this.createPlatformButton(platform));
+        });
+        content.append(platformsWrap);
+        const showQrCode = this.getAttribute('show-qr-code') !== 'false';
+        if (showQrCode && this.qrCodeData) {
+            const qrSection = document.createElement('div');
+            qrSection.className = 'designbase-wc-share__qr-section';
+            const qrTitle = document.createElement('h4');
+            qrTitle.className = 'designbase-wc-share__qr-title';
+            qrTitle.textContent = 'QR 코드';
+            qrSection.append(qrTitle);
+            const qrCode = document.createElement('div');
+            qrCode.className = 'designbase-wc-share__qr-code';
+            const qrImage = document.createElement('img');
+            const qrCodeSize = Number(this.getAttribute('qr-code-size') || 200);
+            qrImage.src = this.generateQrCodeUrl();
+            qrImage.alt = 'QR Code';
+            qrImage.width = qrCodeSize;
+            qrImage.height = qrCodeSize;
+            qrCode.append(qrImage);
+            qrSection.append(qrCode);
+            const qrDescription = document.createElement('p');
+            qrDescription.className = 'designbase-wc-share__qr-description';
+            qrDescription.textContent = 'QR 코드를 스캔하여 링크에 접속하세요';
+            qrSection.append(qrDescription);
+            content.append(qrSection);
+        }
+        const context = this.getContext();
+        const linkPreview = document.createElement('div');
+        linkPreview.className = 'designbase-wc-share__link-preview';
+        const linkTitle = document.createElement('h4');
+        linkTitle.className = 'designbase-wc-share__link-title';
+        linkTitle.textContent = '공유 링크';
+        linkPreview.append(linkTitle);
+        const linkContainer = document.createElement('div');
+        linkContainer.className = 'designbase-wc-share__link-container';
+        linkContainer.append(this.createLinkInput(context.url));
+        linkContainer.append(this.createCopyButton(context));
+        linkPreview.append(linkContainer);
+        content.append(linkPreview);
+    }
+    refreshContent() {
+        const variant = this.getAttribute('variant');
+        if (variant === 'inline') {
+            const content = this.querySelector(':scope > .designbase-wc-share__content');
+            content?.replaceWith(this.createShareContent());
+            return;
+        }
+        if (variant === 'modal' && this.contentSlot) {
+            this.contentSlot.replaceChildren();
+            this.populateShareContent(this.contentSlot);
+        }
+    }
+    syncModalOpen() {
+        if (!this.modalEl)
+            return;
+        if (this.open) {
+            this.refreshLinkInputValue();
+            this.modalEl.setAttribute('open', 'true');
+        }
+        else {
+            this.modalEl.removeAttribute('open');
+        }
+    }
+    renderDropdown() {
+        const dropdown = document.createElement('db-dropdown');
+        dropdown.className = 'designbase-wc-share__dropdown';
+        dropdown.setAttribute('placement', this.getPlacement());
+        dropdown.setAttribute('label', this.getAttribute('button-text') || '공유');
+        dropdown.setAttribute('trigger-variant', 'secondary');
+        dropdown.setAttribute('trigger-icon', 'share-alt');
+        dropdown.setAttribute('size', this.mapButtonSize());
+        dropdown.setAttribute('items', JSON.stringify(this.getActivePlatforms().map((platform) => ({
+            id: platform,
+            label: PLATFORM_CONFIGS[platform].name,
+        }))));
+        dropdown.addEventListener('db-change', (event) => {
+            const detail = event.detail;
+            const platform = detail?.id;
+            if (platform)
+                this.handlePlatformShare(platform);
+        });
+        this.dropdownEl = dropdown;
+        this.append(dropdown);
+    }
+    renderModal() {
+        const trigger = this.createTriggerButton();
+        this.append(trigger);
+        const modal = document.createElement('db-modal');
+        modal.className = 'designbase-wc-share__modal';
+        modal.setAttribute('title', this.getAttribute('modal-title') || '공유하기');
+        modal.setAttribute('size', 'm');
+        this.contentSlot = document.createElement('div');
+        this.contentSlot.className = 'designbase-wc-share designbase-wc-share__content';
+        this.contentSlot.setAttribute('data-modal-part', 'body');
+        this.populateShareContent(this.contentSlot);
+        modal.append(this.contentSlot);
+        modal.addEventListener('db-close', () => {
+            this.open = false;
+            this.qrCodeData = '';
+            if (this.contentSlot) {
+                this.contentSlot.replaceChildren();
+                this.populateShareContent(this.contentSlot);
+            }
+        });
+        this.modalEl = modal;
+        this.append(modal);
+        this.syncModalOpen();
+    }
+    render() {
+        const variant = (this.getAttribute('variant') || 'button');
+        this.className = `designbase-wc-share designbase-wc-share--${variant}`;
+        this.replaceChildren();
+        this.modalEl = null;
+        this.contentSlot = null;
+        this.dropdownEl = null;
+        if (variant === 'inline') {
+            this.append(this.createShareContent());
+            return;
+        }
+        if (variant === 'dropdown') {
+            this.renderDropdown();
+            return;
+        }
+        if (variant === 'modal') {
+            this.renderModal();
+            return;
+        }
+        this.append(this.createTriggerButton());
+    }
+}
+if (!customElements.get('db-share'))
+    customElements.define('db-share', DbShare);
+
+export { DbShare };