@iqual/nuxt-icms 1.6.1 → 1.6.2-rc.2

package/assets/css/ckeditor.css

@@ -1,14 +1,13 @@
 /* Vendor stuff */
 @import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
 
-@import "tailwindcss";
+@import 'tailwindcss';
 @import './theme/theme.css';
-@import "./base/typography.css";
-@import "./components/ck-content.css";
+@import './base/typography.css';
+@import './components/ck-content.css';
 
 .ck.ck-editor {
   a {
     text-decoration-style: inherit;
   }
 }
-

package/assets/css/components/decorations.css

@@ -8,4 +8,4 @@
       rgba(0, 0, 0, 0) 40.3%
     );
   }
-}
+}

package/assets/css/components/editor.css

@@ -14,4 +14,4 @@
     transparent 3px,
     transparent 9px
   );
-}
+}

package/assets/css/components/grid-container.css

@@ -1,4 +1,3 @@
-
 :root {
   --container-max-width: 1380px;
   --container-max-width-bk: calc(1380px * 0.8); /* 80vw coming from blokkli */
@@ -25,16 +24,17 @@
 
   --container-columns-width-xl: calc(
     calc(
-        var(--container-max-width) -
-          calc(11 * var(--container-gutter-width-xl))
-      ) / 12
+        var(--container-max-width) - calc(11 * var(--container-gutter-width-xl))
+      ) /
+      12
   );
 
   --container-columns-width-xl-bk: calc(
     calc(
         var(--container-max-width-bk) -
           calc(11 * var(--container-gutter-width-xl))
-      ) / 12
+      ) /
+      12
   );
 
   /* Repeat doesn't work with grid-template, hence we simply repeat by copy-pasting. */
@@ -309,12 +309,12 @@
   }
 
   &:has(
-      > *:first-child:not(
-          :nth-last-child(1),
-          :nth-last-child(2),
-          :nth-last-child(3)
-        )
-    ) {
+    > *:first-child:not(
+        :nth-last-child(1),
+        :nth-last-child(2),
+        :nth-last-child(3)
+      )
+  ) {
     @apply lg:!grid-cols-3;
   }
 }
@@ -334,13 +334,13 @@
   }
 
   &:has(
-      > *:first-child:not(
-          :nth-last-child(1),
-          :nth-last-child(2),
-          :nth-last-child(3),
-          :nth-last-child(4)
-        )
-    ) {
+    > *:first-child:not(
+        :nth-last-child(1),
+        :nth-last-child(2),
+        :nth-last-child(3),
+        :nth-last-child(4)
+      )
+  ) {
     @apply lg:!grid-cols-4;
   }
-}
+}

package/assets/css/fe-fixes.css

@@ -1,23 +1,17 @@
-/* Vuepal toolbar logo */
-.vuepal-admin-toolbar-link[data-route-name='<front>']
-  .vuepal-admin-toolbar-icon {
-  background: var(--vuepal-environment-color);
-  mask-image: url(/modules/contrib/icms_admin/img/iqual-logo-q.svg) !important;
-}
-
 /**
  *
  * BLÖKKLI EDIT PAGE BUTTON
  *
+ * Editors open the editor from Drupal ("Edit page content" in the site
+ * shell); blökkli offers no option to drop its indicator, so it is hidden.
+ *
  **/
 body {
   position: relative;
 
-  .bk .bk-edit-indicator {
-    transform: translate(0) !important;
-    position: fixed;
-    top: 275px;
-    z-index: 1000;
+  .bk .bk-edit-indicator,
+  .bk .bk-edit-indicator-overlay {
+    display: none !important;
   }
 }
 

package/assets/css/theme/colors/color-primary.css

@@ -4,17 +4,39 @@
   --primary-chroma: 0.19;
   --primary-hue: 41;
 
-  --primary-50: oklch(var(--lightness-50) var(--primary-chroma) var(--primary-hue));
-  --primary-100: oklch(var(--lightness-100) var(--primary-chroma) var(--primary-hue));
-  --primary-200: oklch(var(--lightness-200) var(--primary-chroma) var(--primary-hue));
-  --primary-300: oklch(var(--lightness-300) var(--primary-chroma) var(--primary-hue));
-  --primary-400: oklch(var(--lightness-400) var(--primary-chroma) var(--primary-hue));
-  --primary-500: oklch(var(--primary-lightness) var(--primary-chroma) var(--primary-hue));
-  --primary-600: oklch(var(--lightness-600) var(--primary-chroma) var(--primary-hue));
-  --primary-700: oklch(var(--lightness-700) var(--primary-chroma) var(--primary-hue));
-  --primary-800: oklch(var(--lightness-800) var(--primary-chroma) var(--primary-hue));
-  --primary-900: oklch(var(--lightness-900) var(--primary-chroma) var(--primary-hue));
-  --primary-950: oklch(var(--lightness-950) var(--primary-chroma) var(--primary-hue));
+  --primary-50: oklch(
+    var(--lightness-50) var(--primary-chroma) var(--primary-hue)
+  );
+  --primary-100: oklch(
+    var(--lightness-100) var(--primary-chroma) var(--primary-hue)
+  );
+  --primary-200: oklch(
+    var(--lightness-200) var(--primary-chroma) var(--primary-hue)
+  );
+  --primary-300: oklch(
+    var(--lightness-300) var(--primary-chroma) var(--primary-hue)
+  );
+  --primary-400: oklch(
+    var(--lightness-400) var(--primary-chroma) var(--primary-hue)
+  );
+  --primary-500: oklch(
+    var(--primary-lightness) var(--primary-chroma) var(--primary-hue)
+  );
+  --primary-600: oklch(
+    var(--lightness-600) var(--primary-chroma) var(--primary-hue)
+  );
+  --primary-700: oklch(
+    var(--lightness-700) var(--primary-chroma) var(--primary-hue)
+  );
+  --primary-800: oklch(
+    var(--lightness-800) var(--primary-chroma) var(--primary-hue)
+  );
+  --primary-900: oklch(
+    var(--lightness-900) var(--primary-chroma) var(--primary-hue)
+  );
+  --primary-950: oklch(
+    var(--lightness-950) var(--primary-chroma) var(--primary-hue)
+  );
 }
 
 @theme {

package/assets/css/theme/colors/color-secondary.css

@@ -4,17 +4,39 @@
   --secondary-chroma: 0.12;
   --secondary-hue: 243;
 
-  --secondary-50: oklch(var(--lightness-50) var(--secondary-chroma) var(--secondary-hue));
-  --secondary-100: oklch(var(--lightness-100) var(--secondary-chroma) var(--secondary-hue));
-  --secondary-200: oklch(var(--lightness-200) var(--secondary-chroma) var(--secondary-hue));
-  --secondary-300: oklch(var(--lightness-300) var(--secondary-chroma) var(--secondary-hue));
-  --secondary-400: oklch(var(--lightness-400) var(--secondary-chroma) var(--secondary-hue));
-  --secondary-500: oklch(var(--secondary-lightness) var(--secondary-chroma) var(--secondary-hue));
-  --secondary-600: oklch(var(--lightness-600) var(--secondary-chroma) var(--secondary-hue));
-  --secondary-700: oklch(var(--lightness-700) var(--secondary-chroma) var(--secondary-hue));
-  --secondary-800: oklch(var(--lightness-800) var(--secondary-chroma) var(--secondary-hue));
-  --secondary-900: oklch(var(--lightness-900) var(--secondary-chroma) var(--secondary-hue));
-  --secondary-950: oklch(var(--lightness-950) var(--secondary-chroma) var(--secondary-hue));
+  --secondary-50: oklch(
+    var(--lightness-50) var(--secondary-chroma) var(--secondary-hue)
+  );
+  --secondary-100: oklch(
+    var(--lightness-100) var(--secondary-chroma) var(--secondary-hue)
+  );
+  --secondary-200: oklch(
+    var(--lightness-200) var(--secondary-chroma) var(--secondary-hue)
+  );
+  --secondary-300: oklch(
+    var(--lightness-300) var(--secondary-chroma) var(--secondary-hue)
+  );
+  --secondary-400: oklch(
+    var(--lightness-400) var(--secondary-chroma) var(--secondary-hue)
+  );
+  --secondary-500: oklch(
+    var(--secondary-lightness) var(--secondary-chroma) var(--secondary-hue)
+  );
+  --secondary-600: oklch(
+    var(--lightness-600) var(--secondary-chroma) var(--secondary-hue)
+  );
+  --secondary-700: oklch(
+    var(--lightness-700) var(--secondary-chroma) var(--secondary-hue)
+  );
+  --secondary-800: oklch(
+    var(--lightness-800) var(--secondary-chroma) var(--secondary-hue)
+  );
+  --secondary-900: oklch(
+    var(--lightness-900) var(--secondary-chroma) var(--secondary-hue)
+  );
+  --secondary-950: oklch(
+    var(--lightness-950) var(--secondary-chroma) var(--secondary-hue)
+  );
 }
 
 @theme {

package/assets/css/utilities/utilities.css

@@ -10,4 +10,4 @@
 /* Custom variants */
 @custom-variant mobile-only (@media (max-width: 48rem));
 @custom-variant not-last (&:not(:last-child));
-@custom-variant not-first (&:not(:first-child));
+@custom-variant not-first (&:not(:first-child));

package/assets/symbols/anchor.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 3C14.0083 3 15.6364 4.68781 15.6364 6.76983C15.6364 8.31559 14.7387 9.64347 13.4545 10.2253V16.8313L16.7273 14.8727C16.9522 14.7381 17.0909 14.489 17.0909 14.2197V12.8015C17.0909 11.9687 17.7421 11.2936 18.5455 11.2936C19.3488 11.2936 20 11.9687 20 12.8015V15.961C20 16.2303 19.8613 16.4794 19.6364 16.6141L13.4545 20.314L12.3345 20.9155C12.1247 21.0282 11.8753 21.0282 11.6655 20.9155L10.5455 20.314L4.36364 16.6141C4.13866 16.4794 4.00005 16.2303 4 15.961V12.8015C4 11.9687 4.65122 11.2936 5.45455 11.2936C6.25787 11.2936 6.90909 11.9687 6.90909 12.8015V14.2197C6.90913 14.489 7.04776 14.7381 7.27273 14.8727L10.5455 16.8313V10.2253C9.2613 9.64347 8.36364 8.31559 8.36364 6.76983C8.36364 4.68781 9.99169 3 12 3ZM12 5.2619C11.1967 5.2619 10.5455 5.93702 10.5455 6.76983C10.5455 7.60263 11.1967 8.27776 12 8.27776C12.8033 8.27776 13.4545 7.60263 13.4545 6.76983C13.4545 5.93702 12.8033 5.2619 12 5.2619Z" fill="currentColor"/>
+</svg>

package/blokkli.editAdapter.ts

@@ -0,0 +1,56 @@
+import { defineBlokkliEditAdapter } from '#blokkli/adapter'
+import drupalAdapter from '#blokkli/drupal/adapter'
+import useDrupalUrl from './composables/useDrupalUrl'
+import { withoutTranslationEditUrls } from './shared/blokkliState'
+
+/**
+ * blökkli's Drupal adapter, aware of the Drupal backend on its own domain.
+ *
+ * The editor embeds Drupal forms in iframes and polls a Drupal route; the
+ * backend lives on the "backend." subdomain of the frontend domain (see
+ * docs/routing.md), so those URLs must point there. Creating a translation
+ * opens its form through the same form frame builder as the page settings
+ * (see withoutTranslationEditUrls). Everything else goes through the GraphQL
+ * middleware and needs no change. A project's own
+ * app/blokkli.editAdapter.ts takes precedence over this file and can wrap it
+ * the same way.
+ */
+export default defineBlokkliEditAdapter(async (ctx) => {
+  const adapter = await drupalAdapter(ctx)
+  const withDrupalUrl = useDrupalUrl()
+
+  const { formFrameBuilder, buildEditableFrameUrl, getLibraryItemEditUrl } =
+    adapter
+
+  return {
+    ...adapter,
+    // Every state the editor receives (initial load and mutation results)
+    // passes through here.
+    mapState: (state: Parameters<typeof adapter.mapState>[0]) =>
+      withoutTranslationEditUrls(adapter.mapState(state)),
+    formFrameBuilder: formFrameBuilder
+      ? (e) => {
+          const result = formFrameBuilder(e)
+          return result?.url
+            ? { ...result, url: withDrupalUrl(result.url) }
+            : result
+        }
+      : undefined,
+    buildEditableFrameUrl: buildEditableFrameUrl
+      ? (e) => {
+          const url = buildEditableFrameUrl(e)
+          return url ? withDrupalUrl(url) : url
+        }
+      : undefined,
+    getLibraryItemEditUrl: getLibraryItemEditUrl
+      ? (uuid) => withDrupalUrl(getLibraryItemEditUrl(uuid))
+      : undefined,
+    getLastChanged: () =>
+      $fetch<{ changed: number }>('/api/icms/blokkli/last-changed', {
+        query: {
+          entityType: ctx.value.entityType,
+          entityUuid: ctx.value.entityUuid,
+        },
+      }).then((v) => v.changed),
+  }
+})

package/bundles.ts

@@ -31,12 +31,12 @@ export function collectProjectDeps(): ProjectDeps {
 
   if (existsSync(pkgPath)) {
     try {
-      const {
-        dependencies = {}
-      } = JSON.parse(readFileSync(pkgPath, 'utf8'))
+      const { dependencies = {} } = JSON.parse(readFileSync(pkgPath, 'utf8'))
 
       deps = { ...dependencies }
-    } catch {}
+    } catch {
+      // A malformed package.json simply yields no bundle dependencies.
+    }
   }
 
   cache = deps
@@ -50,5 +50,5 @@ export function collectProjectDeps(): ProjectDeps {
  */
 export function buildBundleStack(): string[] {
   const deps = collectProjectDeps()
-  return ICMS_BUNDLES.filter(layer => deps[layer])
-}
+  return ICMS_BUNDLES.filter((layer) => deps[layer])
+}