pageflow 17.1.0 → 17.2.0

data/entry_types/scrolled/lib/pageflow_scrolled/plugin.rb

@@ -1,12 +1,162 @@
 module PageflowScrolled
   # @api private
-  class Plugin < Pageflow::Plugin
+  class Plugin < Pageflow::Plugin # rubocop:disable Metrics/ClassLength
     def configure(config)
       config.features.register('scrolled_entry_type') do |feature_config|
         feature_config.entry_types.register(PageflowScrolled.entry_type)
       end
 
       config.for_entry_type(PageflowScrolled.entry_type) do |c|
+        c.configuration_schema_load_path <<
+          Engine.root.join('config', 'configuration_schemas', '*.json').to_s
+
+        padding_scale = {
+          'none' => '0px',
+          'xxxs' => '1.375em',
+          'xxs' => '3em',
+          'xs' => '4.375em',
+          'sm' => '6em',
+          'md' => 'max(7em, 10svh)',
+          'lg' => 'max(8em, 10svh)',
+          'xl' => 'max(9em, 15svh)',
+          'xxl' => 'max(10em, 20svh)',
+          'xxxl' => 'max(11em, 30svh)'
+        }
+
+        margin_scale = {
+          'xxs' => '2em',
+          'xs' => '3em',
+          'sm' => '4em',
+          'md' => '6em',
+          'lg' => '10em',
+          'xl' => '12em',
+          'xxl' => '16em'
+        }
+
+        box_shadow_scale = {
+          'sm' => '0 1px 3px 0 rgb(0 0 0 / 0.2), 0 1px 2px -1px rgb(0 0 0 / 0.15)',
+          'md' => '0 4px 6px -1px rgb(0 0 0 / 0.2), 0 2px 4px -2px rgb(0 0 0 / 0.15)',
+          'lg' => '0 10px 15px -3px rgb(0 0 0 / 0.2), 0 4px 6px -4px rgb(0 0 0 / 0.12)',
+          'xl' => '0 20px 25px -5px rgb(0 0 0 / 0.2), 0 8px 10px -6px rgb(0 0 0 / 0.12)'
+        }
+
+        c.themes.register_options_transform(
+          ThemeOptionsDefaultScale.new(
+            prefix: 'section_padding_top',
+            values: padding_scale
+          )
+        )
+
+        c.themes.register_options_transform(
+          ThemeOptionsDefaultScale.new(
+            prefix: 'section_padding_bottom',
+            values: padding_scale
+          )
+        )
+
+        c.themes.register_options_transform(
+          ThemeOptionsDefaultScale.new(
+            prefix: 'content_element_margin',
+            values: margin_scale
+          )
+        )
+
+        c.themes.register_options_transform(
+          ThemeOptionsDefaultScale.new(
+            prefix: 'content_element_box_shadow',
+            values: box_shadow_scale
+          )
+        )
+
+        c.themes.register_default_options(
+          properties: {
+            root: {
+              'section_default_padding_top' => 'max(10em, 20svh)',
+              'section_default_padding_bottom' => 'max(10em, 20svh)',
+              'content_element_margin_style_default' => '2em',
+              'content_element_box_shadow_style_default' =>
+                '0 4px 6px -1px rgb(0 0 0 / 0.2), 0 2px 4px -2px rgb(0 0 0 / 0.15)',
+              'box_shadow_clip_margin_bottom' => '3rem',
+              'outline_color' => '#a0a0a080'
+            },
+            cards_appearance_section: {
+              'section_default_padding_top' => 'max(10em, 20svh)',
+              'section_default_padding_bottom' => 'max(10em, 20svh)'
+            }
+          }
+        )
+
+        legacy_paddings = {
+          properties: {
+            root: {
+              'section_default_padding_top' => '1.375em',
+              'section_default_padding_bottom' => '4.375em'
+            },
+            cards_appearance_section: {
+              'section_default_padding_top' => '3em',
+              'section_default_padding_bottom' => '6em'
+            }
+          }
+        }
+
+        c.themes.register_options_transform(lambda { |options, entry:, **|
+          if entry.layout_version
+            options
+          else
+            options.deep_merge(legacy_paddings)
+          end
+        })
+
+        c.themes.register_default_options(
+          typography: {
+            'counterNumber-xxxl' => {
+              font_size: '200px', line_height: '1',
+              sm: {font_size: '350px'}
+            },
+            'counterNumber-xxl' => {
+              font_size: '150px', line_height: '1',
+              sm: {font_size: '265px'}
+            },
+            'counterNumber-xl' => {
+              font_size: '110px', line_height: '1',
+              sm: {font_size: '200px'}
+            },
+            'counterNumber-lg' => {
+              font_size: '86px', line_height: '1',
+              sm: {font_size: '150px'}
+            },
+            'counterNumber-md' => {
+              font_size: '66px', line_height: '1',
+              sm: {font_size: '110px'}
+            },
+            'counterNumber-sm' => {
+              font_size: '52px', line_height: '1',
+              sm: {font_size: '86px'}
+            },
+            'counterNumber-xs' => {
+              font_size: '40px', line_height: '1.1',
+              sm: {font_size: '66px', line_height: '1'}
+            },
+            'counterNumber-xxs' => {
+              font_size: '34px', line_height: '1.1',
+              sm: {font_size: '52px', line_height: '1'}
+            },
+            'counterNumber-xxxs' => {
+              font_size: '28px', line_height: '1.1',
+              sm: {font_size: '40px', line_height: '1'}
+            },
+            'counterUnit-md' => {font_size: '1em'},
+            'counterUnit-sm' => {font_size: '0.7em'},
+            'counterUnit-xs' => {font_size: '0.5em'},
+            'counterDescription-lg' => {
+              font_size: '28px', line_height: '1.1',
+              sm: {font_size: '40px', line_height: '1'}
+            },
+            'counterDescription-md' => {font_size: '22px'},
+            'counterDescription-sm' => {font_size: '18px'}
+          }
+        )
+
         c.file_types.register(Pageflow::BuiltInFileType.image)
         c.file_types.register(Pageflow::BuiltInFileType.video)
         c.file_types.register(Pageflow::BuiltInFileType.audio)
@@ -14,7 +164,8 @@ module PageflowScrolled
 
         c.revision_components.register(Storyline, create_defaults: true)
 
-        ['tikTokEmbed', 'hotspots'].each do |name|
+        ['tikTokEmbed', 'twitterEmbed', 'hotspots', 'socialEmbed',
+         'videoEmbed', 'inlineBeforeAfter'].each do |name|
           c.additional_frontend_packs.register(
             "pageflow-scrolled/contentElements/#{name}-frontend",
             content_element_type_names: [name]
@@ -27,42 +178,75 @@ module PageflowScrolled
         c.widget_types.register(ReactWidgetType.new(name: 'consentBar',
                                                     role: 'consent'),
                                 default: true)
-
         c.widget_types.register(ReactWidgetType.new(name: 'iconInlineFileRights',
                                                     role: 'inlineFileRights'),
                                 default: true)
         c.widget_types.register(ReactWidgetType.new(name: 'textInlineFileRights',
                                                     role: 'inlineFileRights'))
 
+        c.features.register('excursion_sheets') do |feature_config|
+          feature_config.widget_types.register(
+            ReactWidgetType.new(name: 'excursionSheet',
+                                role: 'excursion'),
+            default: true
+          )
+
+          feature_config.widget_types.register(
+            ReactWidgetType.new(name: 'mainStorylineSheet',
+                                role: 'mainStoryline'),
+            default: true
+          )
+        end
+
+        c.features.enable_by_default('excursion_sheets')
+
         c.features.register('icon_scroll_indicator') do |feature_config|
           feature_config.widget_types.register(
             ReactWidgetType.new(name: 'iconScrollIndicator',
-                                role: 'scrollIndicator'),
-            default: true
+                                role: 'scrollIndicator')
+          )
+        end
+
+        c.features.register('lottie_animation_content_element') do |feature_config|
+          feature_config.file_types.register(PageflowScrolled.lottie_file_type)
+
+          feature_config.additional_frontend_packs.register(
+            'pageflow-scrolled/contentElements/lottieAnimation-frontend',
+            content_element_type_names: ['lottieAnimation']
           )
         end
 
         c.features.register('datawrapper_chart_embed_opt_in')
         c.features.enable_by_default('datawrapper_chart_embed_opt_in')
         c.features.register('iframe_embed_content_element')
-        c.features.register('frontend_v2')
+        c.features.register('social_embed_content_element')
+        c.features.register('legacy_social_embed_content_elements')
         c.features.register('scrolled_entry_fragment_caching')
         c.features.register('backdrop_content_elements')
         c.features.register('custom_palette_colors')
-        c.features.register('decoration_effects')
-        c.features.register('content_element_margins')
         c.features.register('backdrop_size')
-        c.features.register('section_paddings')
+        c.features.register('commenting')
+        c.features.register('image_srcset')
+        c.features.register('file_rights_from_references')
+        c.features.enable_by_default('image_srcset')
+        c.features.enable_by_default('file_rights_from_references')
 
-        c.additional_frontend_seed_data.register(
-          'frontendVersion',
-          FRONTEND_VERSION_SEED_DATA
-        )
+        c.features.register('faq_page_structured_data') do |feature_config|
+          feature_config.entry_structured_data_types.register(
+            :faq_page,
+            PageflowScrolled::EntryStructuredDataTypes::FaqPage.new
+          )
+        end
 
         c.content_element_consent_vendors.register(
           IFRAME_EMBED_CONSENT_VENDOR,
           content_element_type_name: 'iframeEmbed'
         )
+
+        c.content_element_consent_vendors.register(
+          SOCIAL_EMBED_CONSENT_VENDOR,
+          content_element_type_name: 'socialEmbed'
+        )
       end
     end
 
@@ -70,21 +254,20 @@ module PageflowScrolled
       return unless configuration['requireConsent']
 
       uri = URI.parse(configuration['source'])
-      host_matchers = Pageflow.config_for(entry).consent_vendor_host_matchers
+      url_matchers = Pageflow.config_for(entry).consent_vendor_url_matchers
 
-      host_matchers.detect { |matcher, _|
-        uri.host =~ matcher
+      url_matchers.detect { |matcher, _|
+        (uri.host + uri.path) =~ matcher
       }&.last
     rescue URI::InvalidURIError
       nil
     end
 
-    FRONTEND_VERSION_SEED_DATA = lambda do |request:, entry:, **|
-      if request.params[:frontend] == 'v2' || entry.feature_state('frontend_v2')
-        2
-      else
-        1
-      end
+    SOCIAL_EMBED_CONSENT_VENDOR = lambda do |configuration:, **|
+      provider = configuration['provider']
+      valid_providers = ['x', 'instagram', 'bluesky', 'tiktok']
+
+      valid_providers.include?(provider) ? provider : nil
     end
   end
 end

data/entry_types/scrolled/lib/pageflow_scrolled/react_widget_type.rb

@@ -38,10 +38,8 @@ module PageflowScrolled
     end
 
     # @api private
-    def self.all_for(entry)
-      Pageflow.config_for(entry).widget_types.select do |widget_type|
-        widget_type.insert_point == :react
-      end
+    def packs(**)
+      [{path: pack, stylesheet: true}]
     end
   end
 end

data/entry_types/scrolled/lib/pageflow_scrolled/seeds.rb

@@ -24,6 +24,12 @@ module PageflowScrolled
     # @option attributes [Hash] :video_files A hash mapping video
     #   names used in properties like `backdrop.video` to urls.
     # @option attributes [Hash] :text_track_files A hash mapping text track files to urls.
+    #
+    # Any further attribute ending in `_files` is interpreted as the
+    # collection name of a registered file type. Passing `lottie_files`,
+    # for example, creates files of the file type registered with
+    # collection name `lottie_files`.
+    #
     # @yield [entry] a block to be called before the entry is saved
     # @param [Hash] options  options for entry and files creation
     # @option options [Boolean] :skip_encoding
@@ -36,12 +42,10 @@ module PageflowScrolled
                              .first
 
       if entry.nil?
-        entry = Pageflow::Entry.create!(type_name: 'scrolled',
-                                        **attributes.except(:chapters,
-                                                            :image_files,
-                                                            :video_files,
-                                                            :audio_files,
-                                                            :text_track_files)) do |created_entry|
+        entry = Pageflow::Entry.create!(
+          type_name: 'scrolled',
+          **attributes.except(:chapters, *file_collection_names(attributes))
+        ) do |created_entry|
           created_entry.site = attributes.fetch(:account).default_site
 
           say_creating_scrolled_entry(created_entry)
@@ -50,29 +54,8 @@ module PageflowScrolled
 
         draft_entry = Pageflow::DraftEntry.new(entry)
 
-        image_files_by_name = create_files(draft_entry,
-                                           :image,
-                                           attributes.fetch(:image_files, {}))
-
-        video_files_by_name = create_files(draft_entry,
-                                           :video,
-                                           attributes.fetch(:video_files, {}),
-                                           skip_encoding: options.fetch(:skip_encoding, false))
-
-        audio_files_by_name = create_files(draft_entry,
-                                           :audio,
-                                           attributes.fetch(:audio_files, {}),
-                                           skip_encoding: options.fetch(:skip_encoding, false))
-
-        files_by_name = image_files_by_name.merge(video_files_by_name).merge(audio_files_by_name)
-
-        # rewrite parent file references to actual ids
-        text_tracks_by_name = attributes.fetch(:text_track_files, {})
-        text_tracks_by_name.each_value do |text_track_config|
-          parent_file = files_by_name.fetch(text_track_config['parent_file_id'])
-          text_track_config['parent_file_id'] = parent_file.id
-        end
-        create_files(draft_entry, :text_track, text_tracks_by_name)
+        files_by_name = create_top_level_files(draft_entry, attributes, options)
+        create_text_track_files(draft_entry, attributes, files_by_name)
 
         attributes[:chapters].each_with_index do |chapter_config, i|
           create_chapter(entry, chapter_config, i, files_by_name)
@@ -92,24 +75,53 @@ module PageflowScrolled
       say("   sample scrolled entry '#{entry.title}'\n")
     end
 
-    def create_files(draft_entry, file_type, file_data_by_name, skip_encoding: false)
+    def file_collection_names(attributes)
+      attributes.keys.select { |name| name.to_s.end_with?('_files') }
+    end
+
+    def create_top_level_files(draft_entry, attributes, options)
+      collection_names = file_collection_names(attributes) - [:text_track_files]
+
+      collection_names.reduce({}) do |files_by_name, collection_name|
+        files_by_name.merge(
+          create_files(draft_entry,
+                       collection_name.to_s,
+                       attributes.fetch(collection_name),
+                       skip_encoding: options.fetch(:skip_encoding, false))
+        )
+      end
+    end
+
+    def create_text_track_files(draft_entry, attributes, files_by_name)
+      text_tracks_by_name = attributes.fetch(:text_track_files, {})
+
+      text_tracks_by_name.each_value do |text_track_config|
+        parent_file = files_by_name.fetch(text_track_config['parent_file_id'])
+        text_track_config['parent_file_id'] = parent_file.id
+      end
+
+      create_files(draft_entry, 'text_track_files', text_tracks_by_name)
+    end
+
+    def create_files(draft_entry, collection_name, file_data_by_name, skip_encoding: false)
+      file_type = Pageflow.config.file_types.find_by_collection_name!(collection_name)
+
       file_data_by_name.transform_values do |data|
-        say("     creating #{file_type} file from #{data['url']}")
+        say("     creating #{collection_name.delete_suffix('_files')} file from #{data['url']}")
 
-        file_state = %i[image text_track].include?(file_type) ? 'processed' : 'uploading'
         uri = URI.parse(data['url'])
-        file = draft_entry.create_file!(Pageflow::BuiltInFileType.send(file_type),
-                                        state: file_state,
+        file = draft_entry.create_file!(file_type,
+                                        state: initial_file_state(collection_name),
                                         attachment: uri,
                                         display_name: File.basename(uri.path, '*'),
                                         configuration: data['configuration'],
                                         parent_file_model_type: data['parent_file_model_type'],
                                         parent_file_id: data['parent_file_id'],
                                         **data.slice('width', 'height').symbolize_keys)
-        if %i[audio video].include?(file_type)
+        if %w[audio_files video_files].include?(collection_name)
           if skip_encoding
             file.update!(state: 'encoded')
-            if file_type.eql?(:video)
+            if collection_name == 'video_files'
               file.update!(output_presences: {
                              'dash-playlist' => true,
                              'hls-playlist' => true,
@@ -133,6 +145,14 @@ module PageflowScrolled
       end
     end
 
+    def initial_file_state(collection_name)
+      case collection_name
+      when 'image_files', 'text_track_files' then 'processed'
+      when 'audio_files', 'video_files' then 'uploading'
+      else 'uploaded'
+      end
+    end
+
     def create_chapter(entry, chapter_config, position, files_by_name)
       section_configs = chapter_config.delete('sections') || []
       chapter = Chapter.create!(

data/entry_types/scrolled/lib/pageflow_scrolled/theme_options_default_scale.rb

@@ -0,0 +1,35 @@
+module PageflowScrolled
+  # Callable that ensures a scale with the given prefix is defined
+  # in theme options. If the theme already defines any properties
+  # with the prefix, the defaults are not added.
+  #
+  # @api private
+  class ThemeOptionsDefaultScale
+    def initialize(prefix:, values:)
+      @prefix = prefix
+      @values = values
+    end
+
+    def call(options, **)
+      return options if scale_defined?(options)
+
+      options.deep_merge(
+        properties: {
+          root: prefixed_values
+        }
+      )
+    end
+
+    private
+
+    def scale_defined?(options)
+      options.dig(:properties, :root)&.keys&.any? do |key|
+        key.to_s.start_with?("#{@prefix}-")
+      end
+    end
+
+    def prefixed_values
+      @values.transform_keys { |key| "#{@prefix}-#{key}" }
+    end
+  end
+end

data/entry_types/scrolled/lib/pageflow_scrolled.rb

@@ -7,6 +7,13 @@ module PageflowScrolled
       PageflowScrolled::Plugin.new
     end
 
+    def lottie_file_type
+      Pageflow::FileType.new(model: 'PageflowScrolled::LottieFile',
+                             collection_name: 'lottie_files',
+                             url_templates: LottieFileUrlTemplates.new,
+                             top_level_type: true)
+    end
+
     def entry_type
       Pageflow::EntryType.new(name: 'scrolled',
                               frontend_app: PageflowScrolled::EntriesController.action(:show),
@@ -17,6 +24,7 @@ module PageflowScrolled
                               theme_files: {
                                 logo_mobile: LOGO_OPTIONS,
                                 logo_desktop: LOGO_OPTIONS,
+                                font: FONT_OPTIONS,
                                 **FAVICONS
                               })
     end
@@ -40,6 +48,11 @@ module PageflowScrolled
     end
   }.freeze
 
+  FONT_OPTIONS = {
+    content_type: %r{\A(font/woff2?|application/(x-)?font-woff2?)\z},
+    styles: {original: {}}
+  }.freeze
+
   FAVICONS = {
     favicon: {
       content_type: %r{\Aimage/svg\+xml\z},

data/entry_types/scrolled/lib/tasks/pageflow_scrolled/storybook.rake

@@ -26,10 +26,15 @@ namespace :pageflow_scrolled do
           Pageflow.config.paperclip_s3_root = ENV['PAGEFLOW_PAPERCLIP_S3_ROOT']
         end
 
+        # Runs which skip uploads reference the files uploaded by the
+        # last upstream run. Since the storage path contains the file
+        # name, both need to use the original file name instead of the
+        # random one normally generated for uploads.
+        Pageflow::DraftEntry.class_eval { def generate_file_name(file_name) = file_name }
+
         if ENV['PAGEFLOW_SCROLLED_DB_SEED_SKIP_FILES'] == 'true'
           puts 'Skipping file uploads to S3.'
           Paperclip::Storage::S3.class_eval { def flush_writes; end }
-          Pageflow::DraftEntry.class_eval { def generate_file_name(file_name) = file_name }
         end
 
         account = seeds.account(name: 'storybook-seed') do |account_in_progress|
@@ -41,6 +46,11 @@ namespace :pageflow_scrolled do
           attributes: {
             title: 'Storybook seed',
             account:,
+            # File types registered inside a feature are only included in
+            # the seed's model types and url templates if the feature is
+            # enabled. Enabled on the entry, which is recreated on each
+            # run, since the account is only seeded once.
+            features_configuration: {'lottie_animation_content_element' => true},
             chapters: [],
             image_files: {
               turtle: {
@@ -96,6 +106,14 @@ namespace :pageflow_scrolled do
                 }
               }.stringify_keys
             }.stringify_keys,
+            lottie_files: {
+              animation: {
+                url: 'https://s3-eu-west-1.amazonaws.com/de.codevise.pageflow.development/pageflow-next/seed-assets/lottie_animations/animation.lottie',
+                configuration: {
+                  testReferenceName: 'lottieAnimation'
+                }
+              }.stringify_keys
+            },
             text_track_files: {
               sample: {
                 url: 'https://s3-eu-west-1.amazonaws.com/de.codevise.pageflow.development/pageflow-next/seed-assets/text_tracks/sample.vtt',

data/entry_types/scrolled/package/config/configurationSchemas.js

@@ -0,0 +1,70 @@
+const fs = require('fs');
+const path = require('path');
+
+const packageRoot = path.join(__dirname, '..');
+const engineRoot = path.join(packageRoot, '..');
+
+const pageflowScrolledSchemas = {
+  patterns: [
+    path.join(packageRoot, 'src/contentElements/*/schema.json'),
+    path.join(packageRoot, 'src/frontend/schemas/*.json')
+  ],
+  outputFile: path.join(engineRoot, 'config/configuration_schemas/pageflow-scrolled.json')
+};
+
+/**
+ * Merge configuration schemas into a single JSON file, from where the
+ * gem ships them. The authored files live next to the code they
+ * describe.
+ *
+ * @param {Object} options
+ * @param {Array<string>} options.patterns - Paths of schema files. A `*`
+ *   inside a path segment matches entries of the directory.
+ * @param {string} options.outputFile - Path of the merged JSON file.
+ *
+ * @returns {Array<string>} Paths of the merged files.
+ */
+function generateConfigurationSchemas({patterns, outputFile}) {
+  const files = patterns.flatMap(expand).sort();
+  const schemas = files.map(file => JSON.parse(fs.readFileSync(file, 'utf8')));
+
+  fs.mkdirSync(path.dirname(outputFile), {recursive: true});
+  fs.writeFileSync(outputFile, `${JSON.stringify(schemas, null, 2)}\n`);
+
+  return files;
+}
+
+function expand(pattern) {
+  const segments = pattern.split(path.sep);
+  const index = segments.findIndex(segment => segment.includes('*'));
+
+  if (index < 0) {
+    return fs.existsSync(pattern) ? [pattern] : [];
+  }
+
+  const dir = segments.slice(0, index).join(path.sep) || '.';
+
+  if (!fs.existsSync(dir)) {
+    return [];
+  }
+
+  return matchingEntries(dir, segments[index]).flatMap(
+    name => expand([...segments.slice(0, index), name, ...segments.slice(index + 1)].join(path.sep))
+  );
+}
+
+function matchingEntries(dir, segment) {
+  const pattern = new RegExp(`^${segment.split('*').map(escapeRegExp).join('.*')}$`);
+
+  return fs.readdirSync(dir).filter(name => pattern.test(name));
+}
+
+function escapeRegExp(string) {
+  return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+}
+
+module.exports = {pageflowScrolledSchemas, generateConfigurationSchemas};
+
+if (require.main === module) {
+  generateConfigurationSchemas(pageflowScrolledSchemas);
+}

data/entry_types/scrolled/package/config/rollup/configurationSchemas.js

@@ -0,0 +1,19 @@
+const {generateConfigurationSchemas} = require('../configurationSchemas');
+
+/**
+ * Rollup plugin merging configuration schemas into a single JSON file.
+ * Watching the merged files keeps the output up to date in watch mode.
+ *
+ * @param {Object} options - See `generateConfigurationSchemas`.
+ */
+function configurationSchemas(options) {
+  return {
+    name: 'configuration-schemas',
+
+    buildStart() {
+      generateConfigurationSchemas(options).forEach(file => this.addWatchFile(file));
+    }
+  };
+}
+
+module.exports = {configurationSchemas};