Procházet zdrojové kódy

chore: update examples

Ryan Chandler před 4 roky
rodič
revize
5aeedf6d8b
3 změnil soubory, kde provedl 14 přidání a 2 odebrání
  1. 4 0
      dist/alpine-clipboard.js
  2. 1 1
      dist/alpine-clipboard.js.map
  3. 9 1
      examples/index.html

+ 4 - 0
dist/alpine-clipboard.js

@@ -10,6 +10,10 @@
             target = target();
           }
 
+          if (typeof target === 'object') {
+            target = JSON.stringify(target);
+          }
+
           return window.navigator.clipboard.writeText(target);
         };
       });

+ 1 - 1
dist/alpine-clipboard.js.map

@@ -1 +1 @@
-{"version":3,"file":"alpine-clipboard.js","sources":["../src/index.js","../builds/cdn.js"],"sourcesContent":["export default function (Alpine) {\n    Alpine.magic('clipboard', () => {\n        return function (target) {\n            if (typeof target === 'function') {\n                target = target()\n            }\n\n            return window.navigator.clipboard.writeText(target)\n        }\n    })\n}","import clipboard from '../src/index'\n\ndocument.addEventListener('alpine:initializing', () => {\n    clipboard(window.Alpine)\n})"],"names":["Alpine","magic","target","window","navigator","clipboard","writeText","document","addEventListener"],"mappings":";;;;;IAAe,oBAAUA,MAAV,EAAkB;IAC7BA,EAAAA,MAAM,CAACC,KAAP,CAAa,WAAb,EAA0B,MAAM;IAC5B,WAAO,UAAUC,MAAV,EAAkB;IACrB,UAAI,OAAOA,MAAP,KAAkB,UAAtB,EAAkC;IAC9BA,QAAAA,MAAM,GAAGA,MAAM,EAAf;IACH;;IAED,aAAOC,MAAM,CAACC,SAAP,CAAiBC,SAAjB,CAA2BC,SAA3B,CAAqCJ,MAArC,CAAP;IACH,KAND;IAOH,GARD;IASH;;ICRDK,QAAQ,CAACC,gBAAT,CAA0B,qBAA1B,EAAiD,MAAM;IACnDH,EAAAA,SAAS,CAACF,MAAM,CAACH,MAAR,CAAT;IACH,CAFD;;;;;;"}
+{"version":3,"file":"alpine-clipboard.js","sources":["../src/index.js","../builds/cdn.js"],"sourcesContent":["export default function (Alpine) {\n    Alpine.magic('clipboard', () => {\n        return function (target) {\n            if (typeof target === 'function') {\n                target = target()\n            }\n\n            if (typeof target === 'object') {\n                target = JSON.stringify(target)\n            }\n\n            return window.navigator.clipboard.writeText(target)\n        }\n    })\n}","import clipboard from '../src/index'\n\ndocument.addEventListener('alpine:initializing', () => {\n    clipboard(window.Alpine)\n})"],"names":["Alpine","magic","target","JSON","stringify","window","navigator","clipboard","writeText","document","addEventListener"],"mappings":";;;;;IAAe,oBAAUA,MAAV,EAAkB;IAC7BA,EAAAA,MAAM,CAACC,KAAP,CAAa,WAAb,EAA0B,MAAM;IAC5B,WAAO,UAAUC,MAAV,EAAkB;IACrB,UAAI,OAAOA,MAAP,KAAkB,UAAtB,EAAkC;IAC9BA,QAAAA,MAAM,GAAGA,MAAM,EAAf;IACH;;IAED,UAAI,OAAOA,MAAP,KAAkB,QAAtB,EAAgC;IAC5BA,QAAAA,MAAM,GAAGC,IAAI,CAACC,SAAL,CAAeF,MAAf,CAAT;IACH;;IAED,aAAOG,MAAM,CAACC,SAAP,CAAiBC,SAAjB,CAA2BC,SAA3B,CAAqCN,MAArC,CAAP;IACH,KAVD;IAWH,GAZD;IAaH;;ICZDO,QAAQ,CAACC,gBAAT,CAA0B,qBAA1B,EAAiD,MAAM;IACnDH,EAAAA,SAAS,CAACF,MAAM,CAACL,MAAR,CAAT;IACH,CAFD;;;;;;"}

+ 9 - 1
examples/index.html

@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <head>
     <title>Alpine Clipboard</title>
-    <script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.x.x/dist/alpine.js" defer></script>
+    <script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine-next/packages/alpinejs/dist/cdn.min.js" defer></script>
 </head>
 <body>
     <div x-data="{ input: '' }">
@@ -13,5 +13,13 @@
         <button type="button" @click="$clipboard(() => 'Testing')">Copy 'Testing' to Clipboard</button>
     </div>
 
+    <div x-data="{ items: ['foo', 'bar'] }">
+        <template x-for="item in items">
+            <p x-text="item"></p>
+        </template>
+
+        <button type="button" @click="$clipboard(items)">Copy the JSON representation of `items` to your clipboard</button>
+    </div>
+
     <script src="../dist/alpine-clipboard.js"></script>
 </body>