shimmer 0.0.30 → 0.0.32

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 4daaaa818a13c67e102993a851ca62bde262fb8e29ee6b5edfa356344e2708ef
4
- data.tar.gz: 849d1c53c92617e5186070f62915888b0b6575ba165c3a747a0546e773da7334
3
+ metadata.gz: 3a975bbc3e5b4c49127c435395b76802c7aa67de9ff4395b1fdc7727f3d31d3f
4
+ data.tar.gz: 1795a94caf3cd1464d72b79a91d8f481529adef7451c02d63cff2d7b4468efbd
5
5
  SHA512:
6
- metadata.gz: 990b5dfc75f22a79620a2ea0644c5e87c34486911c3b8ee5def8939aafe84a4c2522dfedff24ac4f4e697fbeca5e6a39a4b43ee0a720990a53a287b972c7bca0
7
- data.tar.gz: 81581da7c7c5a952546771ff6fbecf3b4a0a203db0ffd8c02d4492dca2a1061d46e1a78acb66ab6daf9370e9998e90d6cd1b75a360855d6185d40cf2fb469e05
6
+ metadata.gz: 13e3dec5b12662ea7d96fae419e15395f965936f9a5170bbfa071de7039785c96171a5e1dd78149f5e6035bd38f1119df81fe0292b3539bbb739c12f97b2f40f
7
+ data.tar.gz: 1375b6e3cd93a215f1c52645c5ea5403fb94c5fd8a56878b842811c1b6fef3368fd45dbd35365fc3201a614af7fe056c067720d5e7bbed7e65ea0fdc9483d341
data/Gemfile CHANGED
@@ -19,6 +19,8 @@ gem "dotenv"
19
19
  gem "slim-rails"
20
20
  gem "awesome_print"
21
21
  gem "dotenv-rails"
22
+ gem "image_processing"
23
+ gem "mini_magick"
22
24
 
23
25
  group :development, :test do
24
26
  gem "debug", platforms: [:mri, :mingw, :x64_mingw]
data/Gemfile.lock CHANGED
@@ -135,6 +135,9 @@ GEM
135
135
  rspec (>= 2.99.0, < 4.0)
136
136
  i18n (1.12.0)
137
137
  concurrent-ruby (~> 1.0)
138
+ image_processing (1.12.2)
139
+ mini_magick (>= 4.9.5, < 5)
140
+ ruby-vips (>= 2.0.17, < 3)
138
141
  io-console (0.6.0)
139
142
  irb (1.6.2)
140
143
  reline (>= 0.3.0)
@@ -161,6 +164,7 @@ GEM
161
164
  marcel (1.0.2)
162
165
  matrix (0.4.2)
163
166
  method_source (1.0.0)
167
+ mini_magick (4.12.0)
164
168
  mini_mime (1.1.2)
165
169
  minitest (5.17.0)
166
170
  msgpack (1.6.0)
@@ -294,6 +298,8 @@ GEM
294
298
  rubocop (~> 1.33)
295
299
  rubocop-capybara (~> 2.17)
296
300
  ruby-progressbar (1.13.0)
301
+ ruby-vips (2.1.4)
302
+ ffi (~> 1.12)
297
303
  shellany (0.0.1)
298
304
  slim (4.1.0)
299
305
  temple (>= 0.7.6, < 0.9)
@@ -356,8 +362,10 @@ DEPENDENCIES
356
362
  dotenv-rails
357
363
  guard
358
364
  guard-rspec
365
+ image_processing
359
366
  jbuilder
360
367
  jsbundling-rails
368
+ mini_magick
361
369
  propshaft
362
370
  pry
363
371
  pry-byebug
@@ -383,4 +391,4 @@ DEPENDENCIES
383
391
  web-console
384
392
 
385
393
  BUNDLED WITH
386
- 2.3.26
394
+ 2.4.9
data/README.md CHANGED
@@ -15,7 +15,7 @@ Stack is a reusable typed component that allows you to easily manage the layout
15
15
  To use it in a React project, you can just import and use it as you would in a normal React component:
16
16
 
17
17
  ```js
18
- import { Stack } from "@nerdgeschoss/shimmer/components/stack";
18
+ import { Stack } from "@nerdgeschoss/shimmer/dist/components/stack";
19
19
 
20
20
  <Stack gapTablet={4} gapDesktop={12} line>
21
21
  <div></div>
@@ -24,7 +24,7 @@ import { Stack } from "@nerdgeschoss/shimmer/components/stack";
24
24
  </Stack>;
25
25
  ```
26
26
 
27
- 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:
27
+ 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:
28
28
 
29
29
  ```html
30
30
  <div class="stack stack--line stack--tablet-4 stack--desktop-12">
@@ -283,6 +283,34 @@ before_action :check_locale
283
283
 
284
284
  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.
285
285
 
286
+ ### 🍪 Cookies
287
+
288
+ Integrate cookie consent and add tracking capabilities such as Google Tag Manager and Google Analytics to your application with the following steps:
289
+
290
+ **Include Shimmer's Consent Module**: Add the following line to your `application_controller.rb`:
291
+
292
+ ```ruby
293
+ class ApplicationController < ActionController::Base
294
+ include Shimmer::Consent
295
+ end
296
+ ```
297
+
298
+ **Add Google Tag Manager and Google Analytics**:
299
+
300
+ * If you wish to include Google Tag Manager or Google Analytics, insert either of the following lines to your `application.js`:
301
+
302
+ ```typescript
303
+ ui.consent.enableGoogleTagManager(GOOGLE_TAG_MANAGER_ID);
304
+ ```
305
+
306
+ ```typescript
307
+ ui.consent.enableGoogleAnalytics(GOOGLE_ANALYTICS_ID);
308
+ ```
309
+
310
+ Replace `GOOGLE_TAG_MANAGER_ID` with your Google Tag Manager ID or `GOOGLE_ANALYTICS_ID` with your Google Analytics ID.
311
+
312
+ **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.
313
+
286
314
  ## Installation
287
315
 
288
316
  Add this line to your application's Gemfile:
@@ -19,6 +19,8 @@ gem "dotenv"
19
19
  gem "slim-rails"
20
20
  gem "awesome_print"
21
21
  gem "dotenv-rails"
22
+ gem "image_processing"
23
+ gem "mini_magick"
22
24
 
23
25
  group :development, :test do
24
26
  gem "debug", platforms: %i[mri mingw x64_mingw]
data/lib/shimmer/form.rb CHANGED
@@ -5,8 +5,8 @@ module Shimmer
5
5
  end
6
6
  end
7
7
 
8
- require_relative "./form/builder"
9
- require_relative "./form/field"
8
+ require_relative "form/builder"
9
+ require_relative "form/field"
10
10
 
11
11
  Dir["#{File.expand_path("./form", __dir__)}/*"].sort.each do |e|
12
12
  require e
@@ -20,7 +20,7 @@ module Shimmer
20
20
  width = options[:width]
21
21
  height = options[:height]
22
22
  source = image_file_path(source, width: width, height: height)
23
- options[:loading] = :lazy
23
+ options[:loading] ||= :lazy
24
24
  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?
25
25
  end
26
26
  super source, options
@@ -1,5 +1,5 @@
1
1
  # frozen_string_literal: true
2
2
 
3
3
  module Shimmer
4
- VERSION = "0.0.30"
4
+ VERSION = "0.0.32"
5
5
  end
data/src/consent.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { getCookie, setCookie } from "./util";
2
2
 
3
3
  const consentCategories = ["essential", "targeting", "statistic"] as const;
4
- export type ConsentCategory = typeof consentCategories[number];
4
+ export type ConsentCategory = (typeof consentCategories)[number];
5
5
 
6
6
  export class Consent {
7
7
  #consentListeners: Record<ConsentCategory, Array<() => void>> = {
@@ -63,4 +63,38 @@ export class Consent {
63
63
  );
64
64
  document.head.prepend(script);
65
65
  }
66
+
67
+ async enableGoogleTagManager(
68
+ id: string,
69
+ role: ConsentCategory = "statistic"
70
+ ): Promise<void> {
71
+ await this.consentFor(role);
72
+ window.gtag({
73
+ "gtm.start": new Date(),
74
+ event: "gtm.js",
75
+ });
76
+ window.gtag("config", id, { send_page_view: false }); // page view is disabled because it's tracked via the analytics stimulus controller already
77
+ const script = document.createElement("script");
78
+ script.async = true;
79
+ script.setAttribute(
80
+ "src",
81
+ `https://www.googletagmanager.com/gtm.js?id=${id}`
82
+ );
83
+ document.head.prepend(script);
84
+
85
+ // The following 'noscript' tag inclusion is primarily for compliance
86
+ // with Google's recommended installation procedure, its
87
+ // not technically necessary for functionality.
88
+ const noscript = document.createElement("noscript");
89
+ const iframe = document.createElement("iframe");
90
+ iframe.setAttribute(
91
+ "src",
92
+ `https://www.googletagmanager.com/ns.html?id=${id}`
93
+ );
94
+ iframe.setAttribute("height", "0");
95
+ iframe.setAttribute("width", "0");
96
+ iframe.setAttribute("style", "display:none;visibility:hidden");
97
+ noscript.appendChild(iframe);
98
+ document.body.prepend(noscript);
99
+ }
66
100
  }
data/src/modal.ts CHANGED
@@ -66,7 +66,11 @@ export class Modal {
66
66
  closeButton.style.display = close ?? true ? "block" : "none";
67
67
  root.classList.add("modal--open");
68
68
  root.classList.add("modal--loading");
69
- root.classList.toggle("modal--small", size === "small");
69
+
70
+ if (size) {
71
+ root.classList.add(`modal--${size}`);
72
+ }
73
+
70
74
  frame.innerHTML = await getHTML(url);
71
75
  root.classList.remove("modal--loading");
72
76
  }
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: shimmer
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.0.30
4
+ version: 0.0.32
5
5
  platform: ruby
6
6
  authors:
7
7
  - Jens Ravens
8
8
  autorequire:
9
9
  bindir: exe
10
10
  cert_chain: []
11
- date: 2023-06-23 00:00:00.000000000 Z
11
+ date: 2023-10-25 00:00:00.000000000 Z
12
12
  dependencies: []
13
13
  description:
14
14
  email: