shimmer 0.0.30 → 0.0.32

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 4daaaa818a13c67e102993a851ca62bde262fb8e29ee6b5edfa356344e2708ef
-  data.tar.gz: 849d1c53c92617e5186070f62915888b0b6575ba165c3a747a0546e773da7334
+  metadata.gz: 3a975bbc3e5b4c49127c435395b76802c7aa67de9ff4395b1fdc7727f3d31d3f
+  data.tar.gz: 1795a94caf3cd1464d72b79a91d8f481529adef7451c02d63cff2d7b4468efbd
 SHA512:
-  metadata.gz: 990b5dfc75f22a79620a2ea0644c5e87c34486911c3b8ee5def8939aafe84a4c2522dfedff24ac4f4e697fbeca5e6a39a4b43ee0a720990a53a287b972c7bca0
-  data.tar.gz: 81581da7c7c5a952546771ff6fbecf3b4a0a203db0ffd8c02d4492dca2a1061d46e1a78acb66ab6daf9370e9998e90d6cd1b75a360855d6185d40cf2fb469e05
+  metadata.gz: 13e3dec5b12662ea7d96fae419e15395f965936f9a5170bbfa071de7039785c96171a5e1dd78149f5e6035bd38f1119df81fe0292b3539bbb739c12f97b2f40f
+  data.tar.gz: 1375b6e3cd93a215f1c52645c5ea5403fb94c5fd8a56878b842811c1b6fef3368fd45dbd35365fc3201a614af7fe056c067720d5e7bbed7e65ea0fdc9483d341

data/Gemfile

@@ -19,6 +19,8 @@ gem "dotenv"
 gem "slim-rails"
 gem "awesome_print"
 gem "dotenv-rails"
+gem "image_processing"
+gem "mini_magick"
 
 group :development, :test do
   gem "debug", platforms: [:mri, :mingw, :x64_mingw]

data/Gemfile.lock

@@ -135,6 +135,9 @@ GEM
       rspec (>= 2.99.0, < 4.0)
     i18n (1.12.0)
       concurrent-ruby (~> 1.0)
+    image_processing (1.12.2)
+      mini_magick (>= 4.9.5, < 5)
+      ruby-vips (>= 2.0.17, < 3)
     io-console (0.6.0)
     irb (1.6.2)
       reline (>= 0.3.0)
@@ -161,6 +164,7 @@ GEM
     marcel (1.0.2)
     matrix (0.4.2)
     method_source (1.0.0)
+    mini_magick (4.12.0)
     mini_mime (1.1.2)
     minitest (5.17.0)
     msgpack (1.6.0)
@@ -294,6 +298,8 @@ GEM
       rubocop (~> 1.33)
       rubocop-capybara (~> 2.17)
     ruby-progressbar (1.13.0)
+    ruby-vips (2.1.4)
+      ffi (~> 1.12)
     shellany (0.0.1)
     slim (4.1.0)
       temple (>= 0.7.6, < 0.9)
@@ -356,8 +362,10 @@ DEPENDENCIES
   dotenv-rails
   guard
   guard-rspec
+  image_processing
   jbuilder
   jsbundling-rails
+  mini_magick
   propshaft
   pry
   pry-byebug
@@ -383,4 +391,4 @@ DEPENDENCIES
   web-console
 
 BUNDLED WITH
-   2.3.26
+   2.4.9

data/README.md

@@ -15,7 +15,7 @@ Stack is a reusable typed component that allows you to easily manage the layout
 To use it in a React project, you can just import and use it as you would in a normal React component:
 
 ```js
-import { Stack } from "@nerdgeschoss/shimmer/components/stack";
+import { Stack } from "@nerdgeschoss/shimmer/dist/components/stack";
 
 <Stack gapTablet={4} gapDesktop={12} line>
   <div></div>
@@ -24,7 +24,7 @@ import { Stack } from "@nerdgeschoss/shimmer/components/stack";
 </Stack>;
 ```
 
-To use it in an HTML file, you can just import the css file directly from `@nerdgeschoss/shimmer/components/stack.css` and just implement the classes as they are in the stylesheet:
+To use it in an HTML file, you can just import the css file directly from `@nerdgeschoss/shimmer/dist/components/stack.css` and just implement the classes as they are in the stylesheet:
 
 ```html
 <div class="stack stack--line stack--tablet-4 stack--desktop-12">
@@ -283,6 +283,34 @@ before_action :check_locale
 
 Trying to figure out which key a certain translation on the page has? Append `?debug` to the url and `I18n.debug?` will be set - which leads to keys being printed on the page.
 
+### 🍪 Cookies
+
+Integrate cookie consent and add tracking capabilities such as Google Tag Manager and Google Analytics to your application with the following steps:
+
+**Include Shimmer's Consent Module**: Add the following line to your `application_controller.rb`:
+
+```ruby
+class ApplicationController < ActionController::Base
+  include Shimmer::Consent
+end
+```
+
+**Add Google Tag Manager and Google Analytics**:
+
+*   If you wish to include Google Tag Manager or Google Analytics, insert either of the following lines to your `application.js`:
+
+```typescript
+ui.consent.enableGoogleTagManager(GOOGLE_TAG_MANAGER_ID);
+```
+
+```typescript
+ui.consent.enableGoogleAnalytics(GOOGLE_ANALYTICS_ID);
+```
+
+Replace `GOOGLE_TAG_MANAGER_ID` with your Google Tag Manager ID or `GOOGLE_ANALYTICS_ID` with your Google Analytics ID.
+
+**User Consent**: `Shimmer::Consent` provides a [stimulus controller](src/controllers/consent.ts) for creating a cookie banner. When the 'statistic' option is submitted to the controller, the necessary tracking scripts are added to the page's head.
+
 ## Installation
 
 Add this line to your application's Gemfile:

data/gemfiles/Gemfile-rails-7-0

@@ -19,6 +19,8 @@ gem "dotenv"
 gem "slim-rails"
 gem "awesome_print"
 gem "dotenv-rails"
+gem "image_processing"
+gem "mini_magick"
 
 group :development, :test do
   gem "debug", platforms: %i[mri mingw x64_mingw]

data/lib/shimmer/form.rb

@@ -5,8 +5,8 @@ module Shimmer
   end
 end
 
-require_relative "./form/builder"
-require_relative "./form/field"
+require_relative "form/builder"
+require_relative "form/field"
 
 Dir["#{File.expand_path("./form", __dir__)}/*"].sort.each do |e|
   require e

data/lib/shimmer/utils/file_helper.rb

@@ -20,7 +20,7 @@ module Shimmer
         width = options[:width]
         height = options[:height]
         source = image_file_path(source, width: width, height: height)
-        options[:loading] = :lazy
+        options[:loading] ||= :lazy
         options[:srcset] = "#{source} 1x, #{image_file_path(attachment, width: width.to_i * 2, height: height ? height.to_i * 2 : nil)} 2x" if options[:width].present?
       end
       super source, options

data/lib/shimmer/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module Shimmer
-  VERSION = "0.0.30"
+  VERSION = "0.0.32"
 end

data/src/consent.ts

@@ -1,7 +1,7 @@
 import { getCookie, setCookie } from "./util";
 
 const consentCategories = ["essential", "targeting", "statistic"] as const;
-export type ConsentCategory = typeof consentCategories[number];
+export type ConsentCategory = (typeof consentCategories)[number];
 
 export class Consent {
   #consentListeners: Record<ConsentCategory, Array<() => void>> = {
@@ -63,4 +63,38 @@ export class Consent {
     );
     document.head.prepend(script);
   }
+
+  async enableGoogleTagManager(
+    id: string,
+    role: ConsentCategory = "statistic"
+  ): Promise<void> {
+    await this.consentFor(role);
+    window.gtag({
+      "gtm.start": new Date(),
+      event: "gtm.js",
+    });
+    window.gtag("config", id, { send_page_view: false }); // page view is disabled because it's tracked via the analytics stimulus controller already
+    const script = document.createElement("script");
+    script.async = true;
+    script.setAttribute(
+      "src",
+      `https://www.googletagmanager.com/gtm.js?id=${id}`
+    );
+    document.head.prepend(script);
+
+    // The following 'noscript' tag inclusion is primarily for compliance
+    // with Google's recommended installation procedure, its
+    // not technically necessary for functionality.
+    const noscript = document.createElement("noscript");
+    const iframe = document.createElement("iframe");
+    iframe.setAttribute(
+      "src",
+      `https://www.googletagmanager.com/ns.html?id=${id}`
+    );
+    iframe.setAttribute("height", "0");
+    iframe.setAttribute("width", "0");
+    iframe.setAttribute("style", "display:none;visibility:hidden");
+    noscript.appendChild(iframe);
+    document.body.prepend(noscript);
+  }
 }

data/src/modal.ts

@@ -66,7 +66,11 @@ export class Modal {
     closeButton.style.display = close ?? true ? "block" : "none";
     root.classList.add("modal--open");
     root.classList.add("modal--loading");
-    root.classList.toggle("modal--small", size === "small");
+
+    if (size) {
+      root.classList.add(`modal--${size}`);
+    }
+
     frame.innerHTML = await getHTML(url);
     root.classList.remove("modal--loading");
   }

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: shimmer
 version: !ruby/object:Gem::Version
-  version: 0.0.30
+  version: 0.0.32
 platform: ruby
 authors:
 - Jens Ravens
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2023-06-23 00:00:00.000000000 Z
+date: 2023-10-25 00:00:00.000000000 Z
 dependencies: []
 description: 
 email: