Update all dependencies to latest

.github/workflows/gh-pages.yaml

@@ -36,7 +36,7 @@ jobs:
       - name: Node 🧰
         uses: actions/setup-node@v3
         with:
-          node-version: 16.x
+          node-version: 18.x
           cache: 'pnpm'
 
       - name: Install 📦

.github/workflows/publish.yaml

@@ -20,7 +20,7 @@ jobs:
       - name: Node 🧰
         uses: actions/setup-node@v3
         with:
-          node-version: 16.x
+          node-version: 18.x
           cache: 'pnpm'
 
       - name: Install 📦

.github/workflows/reset-organization.yaml

@@ -21,7 +21,7 @@ jobs:
       - name: Node 🧰
         uses: actions/setup-node@v3
         with:
-          node-version: 16.x
+          node-version: 18.x
 
       - name: Install 📦
         run: |

.github/workflows/test.yaml

@@ -24,7 +24,7 @@ jobs:
       - name: Node 🧰
         uses: actions/setup-node@v3
         with:
-          node-version: 16.x
+          node-version: 18.x
           cache: 'pnpm'
 
       - name: Install 📦

.npmrc

@@ -1,3 +1,3 @@
 engine-strict=true
-use-node-version=16.14.0
+use-node-version=18.16.0
 strict-peer-dependencies=false

package.json

@@ -28,18 +28,18 @@
   },
   "license": "MIT",
   "engines": {
-    "node": ">=16.14.0",
+    "node": ">=18.16.0",
     "pnpm": ">=7"
   },
   "devDependencies": {
-    "@commercelayer/eslint-config-ts": "^1.0.1",
-    "concurrently": "^8.2.0",
-    "eslint": "^8.42.0",
+    "@commercelayer/eslint-config-ts": "^1.1.0",
+    "concurrently": "^8.2.1",
+    "eslint": "^8.49.0",
     "husky": "^8.0.3",
-    "lerna": "^7.0.1",
-    "lint-staged": "^13.2.2",
-    "npm-check-updates": "^16.10.12",
+    "lerna": "^7.3.0",
+    "lint-staged": "^14.0.1",
+    "npm-check-updates": "^16.14.4",
     "replace-in-file": "^7.0.1",
-    "typescript": "^5.1.3"
+    "typescript": "^5.2.2"
   }
 }

packages/docs/.storybook/main.ts

@@ -1,8 +1,16 @@
 import { StorybookConfig } from '@storybook/types'
 
 const storybookConfig: StorybookConfig = {
-  stories: ['../stories/**/*.mdx', '../stories/**/*.stories.@(js|jsx|ts|tsx)'],
-  addons: ['@storybook/addon-links', '@storybook/addon-essentials', '@storybook/addon-interactions', '@storybook/addon-mdx-gfm'],
+  stories: [
+    '../stories/**/*.mdx',
+    '../stories/**/*.stories.@(js|jsx|ts|tsx)'
+  ],
+  addons: [
+    '@storybook/addon-links',
+    '@storybook/addon-essentials',
+    '@storybook/addon-interactions',
+    '@storybook/addon-mdx-gfm'
+  ],
   // @ts-expect-error This 'managerEntries' exists.
   managerEntries: [
     require.resolve('./addon-drop-in-css/manager.tsx'),

packages/docs/.storybook/manager-head.html

@@ -1,17 +1,3 @@
 <meta name="description" content="Commerce Layer drop-in.js lets you transform any plain HTML page into an enterprise-grade static commerce website, with almost no coding required, thanks to a set of micro frontends that handle the main ecommerce functionalities." key="desc" />
 <link rel="shortcut icon" href="favicon.ico" />
-
-<style>
-  .sidebar-header img {
-    margin: 16px 0;
-  }
-
-  .sidebar-container .sidebar-header button[title="Shortcuts"] {
-    display: none;
-  }
-
-  .sidebar-container .sidebar-header div:first-of-type {
-    margin: 0;
-    justify-content: center;
-  }
-</style>
+<link rel="stylesheet" href="https://data.commercelayer.app/assets/css/storybook-manager.css" />

packages/docs/package.json

@@ -16,40 +16,40 @@
     "email": "marco.montalbano@commercelayer.io"
   },
   "devDependencies": {
-    "@babel/core": "^7.22.5",
-    "@babel/preset-env": "^7.22.5",
-    "@babel/preset-react": "^7.22.5",
-    "@babel/preset-typescript": "^7.22.5",
-    "@storybook/addon-actions": "^7.0.20",
-    "@storybook/addon-essentials": "^7.0.20",
-    "@storybook/addon-interactions": "^7.0.20",
-    "@storybook/addon-links": "^7.0.20",
-    "@storybook/addon-mdx-gfm": "^7.0.20",
-    "@storybook/addons": "^7.0.20",
-    "@storybook/api": "^7.0.20",
-    "@storybook/blocks": "^7.0.20",
-    "@storybook/components": "^7.0.20",
-    "@storybook/core-common": "^7.0.20",
-    "@storybook/html": "^7.0.20",
-    "@storybook/html-webpack5": "^7.0.20",
-    "@storybook/testing-library": "^0.1.0",
-    "@storybook/theming": "^7.0.20",
-    "@storybook/types": "^7.0.20",
-    "@types/common-tags": "^1.8.1",
+    "@babel/core": "^7.22.20",
+    "@babel/preset-env": "^7.22.20",
+    "@babel/preset-react": "^7.22.15",
+    "@babel/preset-typescript": "^7.22.15",
+    "@storybook/addon-actions": "^7.4.2",
+    "@storybook/addon-essentials": "^7.4.2",
+    "@storybook/addon-interactions": "^7.4.2",
+    "@storybook/addon-links": "^7.4.2",
+    "@storybook/addon-mdx-gfm": "^7.4.2",
+    "@storybook/addons": "^7.4.2",
+    "@storybook/api": "^7.4.2",
+    "@storybook/blocks": "^7.4.2",
+    "@storybook/components": "^7.4.2",
+    "@storybook/core-common": "^7.4.2",
+    "@storybook/html": "^7.4.2",
+    "@storybook/html-webpack5": "^7.4.2",
+    "@storybook/testing-library": "^0.2.1",
+    "@storybook/theming": "^7.4.2",
+    "@storybook/types": "^7.4.2",
+    "@types/common-tags": "^1.8.2",
     "@types/react": "^18",
-    "babel-loader": "^9.1.2",
+    "babel-loader": "^9.1.3",
     "common-tags": "^1.8.2",
     "http-server": "^14.1.1",
-    "nodemon": "^2.0.22",
+    "nodemon": "^3.0.1",
     "react": "^18",
     "react-dom": "^18",
-    "sass": "^1.63.4",
-    "storybook": "^7.0.20",
-    "typescript": "^5.1.3",
-    "webpack": "^5.86.0"
+    "sass": "^1.67.0",
+    "storybook": "^7.4.2",
+    "typescript": "^5.2.2",
+    "webpack": "^5.88.2"
   },
   "dependencies": {
     "@commercelayer/drop-in.js": "workspace:^2.0.1",
-    "lit-html": "^2.7.4"
+    "lit-html": "^2.8.0"
   }
 }

packages/docs/stories/add-to-cart/cl-add-to-cart.stories.ts

@@ -14,16 +14,14 @@ const meta: Meta<Args> = {
 export default meta
 
 const Template: StoryFn<Args> = (args) => {
-  return create(
-    html`
-      <cl-add-to-cart
-        code=${args.code ?? nothing}
-        quantity=${args.quantity ?? nothing}
-      >
-        Add to cart
-      </cl-add-to-cart>
-    `
-  )
+  return create(html`
+    <cl-add-to-cart
+      code=${args.code ?? nothing}
+      quantity=${args.quantity ?? nothing}
+    >
+      Add to cart
+    </cl-add-to-cart>
+  `)
 }
 
 export const Basic = Template.bind({})

packages/docs/stories/availability/cl-availability-info.stories.ts

@@ -28,19 +28,15 @@ const meta: Meta<Args> = {
 export default meta
 
 export const Basic: StoryFn<Args> = (args) => {
-  return create(
-    html`
-      <cl-availability
-        code=${args['Use an available product']
-          ? codes.available
-          : codes.outOfStock}
-      >
-        <cl-availability-info
-          type=${args.type ?? nothing}
-        ></cl-availability-info>
-      </cl-availability>
-    `
-  )
+  return create(html`
+    <cl-availability
+      code=${args['Use an available product']
+        ? codes.available
+        : codes.outOfStock}
+    >
+      <cl-availability-info type=${args.type ?? nothing}></cl-availability-info>
+    </cl-availability>
+  `)
 }
 Basic.args = {
   'Use an available product': true,

packages/docs/stories/availability/cl-availability-status.stories.ts

@@ -28,19 +28,17 @@ const meta: Meta<Args> = {
 export default meta
 
 export const Basic: StoryFn<Args> = (args) => {
-  return create(
-    html`
-      <cl-availability
-        code=${args['Use an available product']
-          ? codes.available
-          : codes.outOfStock}
-      >
-        <cl-availability-status type=${args.type ?? nothing}>
-          • message
-        </cl-availability-status>
-      </cl-availability>
-    `
-  )
+  return create(html`
+    <cl-availability
+      code=${args['Use an available product']
+        ? codes.available
+        : codes.outOfStock}
+    >
+      <cl-availability-status type=${args.type ?? nothing}>
+        • message
+      </cl-availability-status>
+    </cl-availability>
+  `)
 }
 Basic.args = {
   'Use an available product': true,

packages/docs/stories/cart/cl-cart--minicart.stories.ts

@@ -25,47 +25,45 @@ const meta: Meta<Args> = {
 export default meta
 
 export const Basic: StoryFn<Args> = (args) => {
-  return create(
-    html`
-      <cl-cart-link>
-        <svg
-          width="32"
-          height="32"
-          viewBox="0 0 32 32"
-          fill="none"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            d="M27 6H5C4.44772 6 4 6.44772 4 7V25C4 25.5523 4.44772 26 5 26H27C27.5523 26 28 25.5523 28 25V7C28 6.44772 27.5523 6 27 6Z"
-            stroke="black"
-            stroke-width="2"
-            stroke-linecap="round"
-            stroke-linejoin="round"
-          ></path>
-          <path
-            d="M4 10H28"
-            stroke="black"
-            stroke-width="2"
-            stroke-linecap="round"
-            stroke-linejoin="round"
-          ></path>
-          <path
-            d="M21 14C21 15.3261 20.4732 16.5979 19.5355 17.5355C18.5979 18.4732 17.3261 19 16 19C14.6739 19 13.4021 18.4732 12.4645 17.5355C11.5268 16.5979 11 15.3261 11 14"
-            stroke="black"
-            stroke-width="2"
-            stroke-linecap="round"
-            stroke-linejoin="round"
-          ></path>
-        </svg>
+  return create(html`
+    <cl-cart-link>
+      <svg
+        width="32"
+        height="32"
+        viewBox="0 0 32 32"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path
+          d="M27 6H5C4.44772 6 4 6.44772 4 7V25C4 25.5523 4.44772 26 5 26H27C27.5523 26 28 25.5523 28 25V7C28 6.44772 27.5523 6 27 6Z"
+          stroke="black"
+          stroke-width="2"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+        ></path>
+        <path
+          d="M4 10H28"
+          stroke="black"
+          stroke-width="2"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+        ></path>
+        <path
+          d="M21 14C21 15.3261 20.4732 16.5979 19.5355 17.5355C18.5979 18.4732 17.3261 19 16 19C14.6739 19 13.4021 18.4732 12.4645 17.5355C11.5268 16.5979 11 15.3261 11 14"
+          stroke="black"
+          stroke-width="2"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+        ></path>
+      </svg>
 
-        <cl-cart-count></cl-cart-count>
-        <cl-cart
-          type=${args.type ?? nothing}
-          open=${args.open ?? nothing}
-          open-on-add=${args['open-on-add'] ?? nothing}
-        ></cl-cart>
-      </cl-cart-link>
-    `
-  )
+      <cl-cart-count></cl-cart-count>
+      <cl-cart
+        type=${args.type ?? nothing}
+        open=${args.open ?? nothing}
+        open-on-add=${args['open-on-add'] ?? nothing}
+      ></cl-cart>
+    </cl-cart-link>
+  `)
 }
 Basic.args = {}