DSW-1522 add pie tag (#45)

* Add pie tag to nextjs and vanilla app. * Resolve indent * Remove caret. * Update yarn lock files
justeattakeaway · Jan 11, 2024 · a9026af · a9026af
1 parent dd19870
commit a9026af
Show file tree

Hide file tree

Showing 6 changed files with 58 additions and 5 deletions.
diff --git a/nextjs-app/package.json b/nextjs-app/package.json
@@ -23,6 +23,7 @@
     "@justeattakeaway/pie-modal": "0.34.0",
     "@justeattakeaway/pie-spinner": "0.3.0",
     "@justeattakeaway/pie-switch": "0.20.0",
+    "@justeattakeaway/pie-tag": "0.3.0",
     "@lit-labs/nextjs": "0.1.4",
     "@lit/react": "1.0.2",
     "lit": "3.1.0",

diff --git a/nextjs-app/src/pages/index.tsx b/nextjs-app/src/pages/index.tsx
@@ -7,20 +7,22 @@ import { PieSpinner } from "@justeattakeaway/pie-spinner/dist/react"
 import { PieModal } from "@justeattakeaway/pie-modal/dist/react"
 import { PieCookieBanner } from "@justeattakeaway/pie-cookie-banner/dist/react"
 import { PieIconButton } from "@justeattakeaway/pie-icon-button/dist/react"
-import { IconClose } from "@justeattakeaway/pie-icons-webc/dist/react/IconClose";
+import { IconClose } from "@justeattakeaway/pie-icons-webc/dist/react/IconClose"
 import { PieSwitch } from "@justeattakeaway/pie-switch/dist/react"
 import { PieCard } from "@justeattakeaway/pie-card/dist/react"
+import { PieTag } from "@justeattakeaway/pie-tag/dist/react"
+
 import Link from 'next/link'
 
 export default function Home() {
   const [counter, setCounter] = useState(0)
   const [isModalOpen, setIsModalOpen] = useState(false)
   const [isSwitchChecked, setIsSwitchCheck] = useState(false)
-  
+
   const handleSwitchChange = () => {
     setIsSwitchCheck(current => !current);
     console.log(isSwitchChecked);
-  };  
+  };
 
   return (
     <>
@@ -37,8 +39,8 @@ export default function Home() {
       <PieDivider />
 
       <h2>Pie Switch</h2>
-      <PieSwitch 
-        label={`checked: ${isSwitchChecked}`} 
+      <PieSwitch
+        label={`checked: ${isSwitchChecked}`}
         checked={isSwitchChecked}
         onChange={handleSwitchChange}></PieSwitch>
       <PieDivider />
@@ -70,6 +72,11 @@ export default function Home() {
 
       <h2>Pie Form Label</h2>
       <PieFormLabel>Label</PieFormLabel>
+
+      <PieDivider />
+
+      <h2>Pie Tag</h2>
+      <PieTag>Pie Tag</PieTag>
     </>
   );
 }
diff --git a/nextjs-app/yarn.lock b/nextjs-app/yarn.lock
@@ -299,6 +299,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@justeattakeaway/pie-tag@npm:0.3.0":
+  version: 0.3.0
+  resolution: "@justeattakeaway/pie-tag@npm:0.3.0"
+  dependencies:
+    "@justeattakeaway/pie-webc-core": 0.16.0
+  checksum: 96c5c8d8593cda49ae4d9b5b45470a600e96376e370d45a10a5a18a06364ca662cac691b5f28407ed977dd7287dd318b0300d2229b4ce89e6971cd8fbc657e0a
+  languageName: node
+  linkType: hard
+
 "@justeattakeaway/pie-webc-core@npm:0.12.0":
   version: 0.12.0
   resolution: "@justeattakeaway/pie-webc-core@npm:0.12.0"
@@ -315,6 +324,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@justeattakeaway/pie-webc-core@npm:0.16.0":
+  version: 0.16.0
+  resolution: "@justeattakeaway/pie-webc-core@npm:0.16.0"
+  dependencies:
+    lit: 3.1.0
+  checksum: 663cd47a424f56d5bb4c2478873771da3be51b2c91d1e1bb0e1abcebed46bde5cbdc656b8d6159644130397adfbde915e44b9a426fc67926e9a100703ffd93be
+  languageName: node
+  linkType: hard
+
 "@lit-labs/nextjs@npm:0.1.4":
   version: 0.1.4
   resolution: "@lit-labs/nextjs@npm:0.1.4"
@@ -3207,6 +3225,7 @@ __metadata:
     "@justeattakeaway/pie-modal": 0.34.0
     "@justeattakeaway/pie-spinner": 0.3.0
     "@justeattakeaway/pie-switch": 0.20.0
+    "@justeattakeaway/pie-tag": 0.3.0
     "@lit-labs/nextjs": 0.1.4
     "@lit/react": 1.0.2
     "@types/node": 20.9.1

diff --git a/vanilla-app/main.js b/vanilla-app/main.js
@@ -9,6 +9,7 @@ import '@justeattakeaway/pie-modal';
 import '@justeattakeaway/pie-switch';
 import '@justeattakeaway/pie-spinner';
 import '@justeattakeaway/pie-link';
+import '@justeattakeaway/pie-tag';
 import '@justeattakeaway/pie-icons-webc/IconClose';
 import '@justeattakeaway/pie-icons-webc/IconSearch';
 
@@ -73,6 +74,11 @@ document.querySelector('#app').innerHTML = `
     
     <h2>pie-form-label</h2>
     <pie-form-label>Label</pie-form-label>
+    
+    <pie-divider></pie-divider>
+    
+    <h2>pie-tag</h2>
+    <pie-tag>Pie Tag</pie-tag>
 `;
 
 setupCounter(document.querySelector('#counter'));

diff --git a/vanilla-app/package.json b/vanilla-app/package.json
@@ -27,6 +27,7 @@
     "@justeattakeaway/pie-modal": "0.34.0",
     "@justeattakeaway/pie-spinner": "0.3.0",
     "@justeattakeaway/pie-switch": "0.20.0",
+    "@justeattakeaway/pie-tag": "0.3.0",
     "lit": "3.1.0"
   },
   "volta": {

diff --git a/vanilla-app/yarn.lock b/vanilla-app/yarn.lock
@@ -370,6 +370,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@justeattakeaway/pie-tag@npm:0.3.0":
+  version: 0.3.0
+  resolution: "@justeattakeaway/pie-tag@npm:0.3.0"
+  dependencies:
+    "@justeattakeaway/pie-webc-core": 0.16.0
+  checksum: 96c5c8d8593cda49ae4d9b5b45470a600e96376e370d45a10a5a18a06364ca662cac691b5f28407ed977dd7287dd318b0300d2229b4ce89e6971cd8fbc657e0a
+  languageName: node
+  linkType: hard
+
 "@justeattakeaway/pie-webc-core@npm:0.12.0":
   version: 0.12.0
   resolution: "@justeattakeaway/pie-webc-core@npm:0.12.0"
@@ -386,6 +395,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@justeattakeaway/pie-webc-core@npm:0.16.0":
+  version: 0.16.0
+  resolution: "@justeattakeaway/pie-webc-core@npm:0.16.0"
+  dependencies:
+    lit: 3.1.0
+  checksum: 663cd47a424f56d5bb4c2478873771da3be51b2c91d1e1bb0e1abcebed46bde5cbdc656b8d6159644130397adfbde915e44b9a426fc67926e9a100703ffd93be
+  languageName: node
+  linkType: hard
+
 "@lit-labs/ssr-dom-shim@npm:^1.1.2":
   version: 1.1.2
   resolution: "@lit-labs/ssr-dom-shim@npm:1.1.2"
@@ -1184,6 +1202,7 @@ __metadata:
     "@justeattakeaway/pie-modal": 0.34.0
     "@justeattakeaway/pie-spinner": 0.3.0
     "@justeattakeaway/pie-switch": 0.20.0
+    "@justeattakeaway/pie-tag": 0.3.0
     deepmerge: 4.3.1
     lit: 3.1.0
     vite: 4.5.0