Update to work with Paper 8.1.0

Author: thomaskimura

package-lock.json

@@ -1,10 +1,10 @@
 {
   "name": "paper",
-  "version": "7.6.0",
+  "version": "8.1.0",
   "scripts": {
     "dev": "npm-run-all --parallel vite_dev shopify_dev",
-    "pull": "shopify theme pull --nodelete --store brickspacetestingstore.myshopify.com",
-    "shopify_dev": "shopify theme dev --store brickspacetestingstore.myshopify.com",
+    "pull": "shopify theme pull --nodelete --store high-variant-combined-testing-store.myshopify.com",
+    "shopify_dev": "shopify theme dev --store high-variant-combined-testing-store.myshopify.com",
     "vite_dev": "vite dev",
     "test": "vitest",
     "coverage": "vitest run --coverage",
@@ -42,6 +42,6 @@
     "instant.page": "5.1.1"
   },
   "config": {
-    "store": "brickspacetestingstore.myshopify.com"
+    "store": "high-variant-combined-testing-store.myshopify.com"
   }
 }

package.json

@@ -21,36 +21,42 @@
   h1,
   .h1,
   h1 > * {
+    text-transform: var(--type__header-capitilization);
     @apply type__heading--bold-1;
     @apply leading-none;
   }
   h2,
   .h2,
   h2 > * {
+    text-transform: var(--type__header-capitilization);
     @apply type__heading--bold-2;
     @apply leading-none;
   }
   h3,
   .h3,
   h3 > * {
+    text-transform: var(--type__header-capitilization);
     @apply type__heading--bold-3;
     @apply leading-none;
   }
   h4,
   .h4,
   h4 > * {
+    text-transform: var(--type__header-capitilization);
     @apply type__heading--bold-4;
     @apply leading-tight;
   }
   h5,
   .h5,
   h5 > * {
+    text-transform: var(--type__header-capitilization);
     @apply type__heading--bold-5;
     @apply leading-tight;
   }
   h6,
   .h6,
   h6 > * {
+    text-transform: var(--type__header-capitilization);
     @apply type__heading--bold-6;
     @apply leading-tight;
   }

src/css/base/typography.css

@@ -5,11 +5,11 @@
   /* standard button */
   .btn {
     @apply inline-flex items-center justify-center w-auto px-6 py-2 overflow-hidden text-center no-underline cursor-pointer type__nav border__button--radius color__button-primary border__button animation-500;
-    text-transform: var(--type__button-capiliziation);
+    text-transform: var(--type__button-capitilization);
 
     * {
       @apply type__nav;
-      text-transform: var(--type__button-capiliziation);
+      text-transform: var(--type__button-capitilization);
     }
 
     &__content {

src/css/components/buttons.css

@@ -30,48 +30,55 @@
     font-family: var(--type__font-header-family);
     font-style: var(--type__font-header-style);
     font-weight: var(--type__font-header-weight);
+    text-transform: var(--type__header-capitilization);
     @apply underline-offset-2 tracking-normal;
     @apply leading-tight;
   }
   .type__heading--bold-1 {
     font-family: var(--type__font-header-family);
     font-style: var(--type__font-header-style);
     font-weight: var(--type__font-header-weight);
+    text-transform: var(--type__header-capitilization);
     @apply md:text-5xl underline-offset-2 text-4xl tracking-normal;
     @apply leading-tight;
   }
   .type__heading--bold-2 {
     font-family: var(--type__font-header-family);
     font-style: var(--type__font-header-style);
     font-weight: var(--type__font-header-weight);
+    text-transform: var(--type__header-capitilization);
     @apply md:text-4xl underline-offset-2 text-3xl tracking-normal;
     @apply leading-tight;
   }
   .type__heading--bold-3 {
     font-family: var(--type__font-header-family);
     font-style: var(--type__font-header-style);
     font-weight: var(--type__font-header-weight);
+    text-transform: var(--type__header-capitilization);
     @apply md:text-3xl underline-offset-2 text-2xl tracking-normal;
     @apply leading-tight;
   }
   .type__heading--bold-4 {
     font-family: var(--type__font-header-family);
     font-style: var(--type__font-header-style);
     font-weight: var(--type__font-header-weight);
+    text-transform: var(--type__header-capitilization);
     @apply md:text-2xl underline-offset-2 text-xl tracking-normal;
     @apply leading-tight;
   }
   .type__heading--bold-5 {
     font-family: var(--type__font-header-family);
     font-style: var(--type__font-header-style);
     font-weight: var(--type__font-header-weight);
+    text-transform: var(--type__header-capitilization);
     @apply md:text-xl underline-offset-2 text-lg tracking-normal;
     @apply leading-tight;
   }
   .type__heading--bold-6 {
     font-family: var(--type__font-header-family);
     font-style: var(--type__font-header-style);
     font-weight: var(--type__font-header-weight);
+    text-transform: var(--type__header-capitilization);
     @apply md:text-lg underline-offset-2 text-base tracking-normal;
     @apply leading-tight;
   }

src/css/utilities/typography.css

@@ -45,9 +45,8 @@ export const cart = {
     try {
       const response = await fetch(`${window.Shopify.routes.root}cart.js`, {
         method: "GET",
-        headers: {
-          "Content-Type": "application/json",
-        },
+        credentials: "same-origin",
+        cache: "no-store",
       });
 
       // If response is not OK, throw an error

src/ts/cart/cart.ts

@@ -24,6 +24,7 @@ export const globals = {
   quick_edit_popup: app.quick_edit_popup, // {boolean} To toggle the quick edit popup
   quick_edit_handle: app.quick_edit_handle, // {string} The product handle of the product being edited
   quick_add_handle: app.quick_add_handle, // {string} The product handle of the product being added
+  quick_add_initial_load: app.quick_add_initial_load, // {boolean} To check if the quick add is loaded for the first time
   // Menu
   menu_drawer: app.menu_drawer, // {boolean} To toggle the menu drawer
   menu_nested: app.menu_nested, // {boolean} To check if the menu is nested

src/ts/globals/globals.ts

@@ -16,6 +16,7 @@ export interface AppInterface {
   quick_edit_popup: boolean;
   quick_edit_handle: string;
   quick_add_handle: string;
+  quick_add_initial_load: boolean;
   menu_drawer: boolean;
   menu_nested: boolean;
   hide_header: boolean;