@blokkli/editor 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 Jan Hug / dulnan
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,64 @@
+# blökkli page builder for Nuxt
+
+**[Live Demo](https://blokk.li)**
+
+blökkli is an interactive page editor that integrates with any backend and
+offers various features to edit content quick and easy.
+
+![Screenshot of the blökkli editor](./playground/public/editor-screenshot.png)
+
+## Features
+
+- Smooth drag and drop editing
+- True WYSIWYG
+- Dynamic options for block apperance
+- Inline text editing (plain or rich text)
+- Multilanguage (both UI and content)
+- Nested blocks (for sections, grids, accordions, etc.)
+- Restrictions (allowed block types, cardinality, max instances)
+- Clipboard integration (paste text, images, links or copy blocks)
+- Comments
+- and many more
+
+## Comparison to other editors
+
+The main difference to other WYSIWYG editors is that blökkli does not manage the
+data - it's just the editor. It provides a single interface (called adapter) to
+integrate any backend or data structure. Actually performing the mutations (like
+add, delete, move, setting options) is left to the adapter. In most cases an
+adapter method performs API calls, but it could as well all be done in the
+browser. In fact, the demo page / playground implements a reference adapter that
+stores mutations in local storage and keeps data in JSON files.
+
+## Integration with Nuxt
+
+One of the main goals of blökkli is to offer a seamless integration with your
+new or existing Nuxt app. Creating new block components is straightforward.
+Options to change the appearance of a block are directly defined in the
+component, so is configuration that defines the behaviour of the block when
+rendered in the editor.
+
+During normal rendering of blocks (not in the editor), the provided blökkli
+components and composables have a minimal overhead, to not have a negative
+impact on performance.
+
+## Backends
+
+Currently blökkli ships with an adapter to integrate it with the paragraphs
+module of Drupal. The
+[Paragraphs blökkli](https://www.drupal.org/project/paragraphs_blokkli) module
+implements all features available in the editor. It provides a new edit state
+entity that stores the applied mutations and implements a GraphQL schema
+extension to integrate the adapter.
+
+## Roadmap
+
+blökkli is currently still in beta and therefore subject to change. If you're
+considering integrating it in production sites you should probably wait until
+the first stable release.
+
+## Acknowledgments
+
+blökkli was developed by [dulnan](https://github.com/dulnan) at
+[Liip](https://www.liip.ch/). The development was supported by the canton of
+Basel-Stadt in Switzerland as part of the relaunch project for WebBS.

package/dist/module.cjs

@@ -0,0 +1,5 @@
+module.exports = function(...args) {
+  return import('./module.mjs').then(m => m.default.call(this, ...args))
+}
+const _meta = module.exports.meta = require('./module.json')
+module.exports.getMeta = () => Promise.resolve(_meta)

package/dist/module.d.mts

@@ -0,0 +1,129 @@
+import * as _nuxt_schema from '@nuxt/schema';
+import { FeatureDefinition, BlockDefinitionOptionsInput } from '../dist/runtime/types/index.js';
+import { AdapterMethods } from '../dist/runtime/adapter/index.js';
+import { ThemeName, Theme } from '../dist/runtime/types/theme.js';
+import { ModuleOptionsSettings } from '#blokkli/types/generatedModuleTypes';
+
+type ExtractedFeatureDefinition = {
+    id: string;
+    componentName: string;
+    componentPath: string;
+    filePath: string;
+    definition: FeatureDefinition<AdapterMethods[]>;
+    source: string;
+};
+
+type AlterFeatures = {
+    features: ExtractedFeatureDefinition[];
+};
+type ModuleOptionsStorageDefaults = {
+    /**
+     * The default favorite block bundles.
+     */
+    blockFavorites?: string[];
+};
+/**
+ * Options for the module.
+ */
+type ModuleOptions = {
+    /**
+     * The pattern of source files to scan for blokkli components.
+     */
+    pattern?: string[];
+    /**
+     * Define reusable options that can be used in blokkli item components by
+     * referencing the option name.
+     */
+    globalOptions?: BlockDefinitionOptionsInput;
+    /**
+     * Define available chunk groups.
+     *
+     * The idea of this feature is to split rarely used components into separate
+     * chunks, so that they are not imported on each page.
+     *
+     * This value should only be set if the component is actually used rarely.
+     * Having too many chunks has the opposite effect, as rendering a page
+     * requires multiple requests.
+     *
+     * If left empty, all components are bundled in a default chunk, which should
+     * contain components that are used for most pages.
+     */
+    chunkNames?: string[];
+    /**
+     * Valid field list types.
+     *
+     * If one or more values are defined, they can be passed to the BlokkliField
+     * component as a prop. The value is made available to all blokkli items inside
+     * this field.
+     */
+    fieldListTypes?: string[];
+    /**
+     * The entity type of blokkli items.
+     *
+     * Using the paragraphs_blokkli integration this value should be set to "paragraph".
+     */
+    itemEntityType?: string;
+    /**
+     * Provide overrides for the translations.
+     */
+    translations?: Record<string, Record<string, string>>;
+    /**
+     * The default/fallback language for the editor.
+     */
+    defaultLanguage?: string;
+    /**
+     * Force the editor to always be in the default language.
+     *
+     * The default behaviour is that the editor is rendered in the same language
+     * as the page entity. Setting this value to true will always render the
+     * editor in the default language.
+     */
+    forceDefaultLanguage?: boolean;
+    /**
+     * Alter features.
+     *
+     * It's also possible to override builtin feature components with custom
+     * implementations.
+     */
+    alterFeatures?: (ctx: AlterFeatures) => Promise<ExtractedFeatureDefinition[]> | ExtractedFeatureDefinition[];
+    /**
+     * Add custom features by defining either a pattern or path to a feature component.
+     */
+    featureImports?: string[];
+    /**
+     * Theme colors for the editor.
+     *
+     * Accent colors are used for selections, highlights, buttons.
+     * Mono colors are used for the UI elements in the editor.
+     */
+    theme?: ThemeName | Partial<Theme>;
+    /**
+     * Enable the theme editor feature.
+     */
+    enableThemeEditor?: boolean;
+    /**
+     * blokkli generates a JSON file that contains all the defined block
+     * options, keyed by block bundle. By default the file is output to
+     * .nuxt/blokkli/options-schema.json, but the path can be overriden here.
+     *
+     * The path can use aliases like ~ or @ and must also contain the file
+     * name including the extension.
+     */
+    schemaOptionsPath?: string;
+    /**
+     * Override the feature settings.
+     */
+    settingsOverride?: ModuleOptionsSettings;
+    /**
+     * The default storage values for non-settings values.
+     *
+     * These values are not visible in the settings dialog, but are still
+     * "settable" by the user through interactions. This option allows you to
+     * define default values for these settings, like default favorite block
+     * bundles.
+     */
+    storageDefaults?: ModuleOptionsStorageDefaults;
+};
+declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;
+
+export { type ModuleOptions, _default as default };

package/dist/module.d.ts

@@ -0,0 +1,129 @@
+import * as _nuxt_schema from '@nuxt/schema';
+import { FeatureDefinition, BlockDefinitionOptionsInput } from '../dist/runtime/types/index.js';
+import { AdapterMethods } from '../dist/runtime/adapter/index.js';
+import { ThemeName, Theme } from '../dist/runtime/types/theme.js';
+import { ModuleOptionsSettings } from '#blokkli/types/generatedModuleTypes';
+
+type ExtractedFeatureDefinition = {
+    id: string;
+    componentName: string;
+    componentPath: string;
+    filePath: string;
+    definition: FeatureDefinition<AdapterMethods[]>;
+    source: string;
+};
+
+type AlterFeatures = {
+    features: ExtractedFeatureDefinition[];
+};
+type ModuleOptionsStorageDefaults = {
+    /**
+     * The default favorite block bundles.
+     */
+    blockFavorites?: string[];
+};
+/**
+ * Options for the module.
+ */
+type ModuleOptions = {
+    /**
+     * The pattern of source files to scan for blokkli components.
+     */
+    pattern?: string[];
+    /**
+     * Define reusable options that can be used in blokkli item components by
+     * referencing the option name.
+     */
+    globalOptions?: BlockDefinitionOptionsInput;
+    /**
+     * Define available chunk groups.
+     *
+     * The idea of this feature is to split rarely used components into separate
+     * chunks, so that they are not imported on each page.
+     *
+     * This value should only be set if the component is actually used rarely.
+     * Having too many chunks has the opposite effect, as rendering a page
+     * requires multiple requests.
+     *
+     * If left empty, all components are bundled in a default chunk, which should
+     * contain components that are used for most pages.
+     */
+    chunkNames?: string[];
+    /**
+     * Valid field list types.
+     *
+     * If one or more values are defined, they can be passed to the BlokkliField
+     * component as a prop. The value is made available to all blokkli items inside
+     * this field.
+     */
+    fieldListTypes?: string[];
+    /**
+     * The entity type of blokkli items.
+     *
+     * Using the paragraphs_blokkli integration this value should be set to "paragraph".
+     */
+    itemEntityType?: string;
+    /**
+     * Provide overrides for the translations.
+     */
+    translations?: Record<string, Record<string, string>>;
+    /**
+     * The default/fallback language for the editor.
+     */
+    defaultLanguage?: string;
+    /**
+     * Force the editor to always be in the default language.
+     *
+     * The default behaviour is that the editor is rendered in the same language
+     * as the page entity. Setting this value to true will always render the
+     * editor in the default language.
+     */
+    forceDefaultLanguage?: boolean;
+    /**
+     * Alter features.
+     *
+     * It's also possible to override builtin feature components with custom
+     * implementations.
+     */
+    alterFeatures?: (ctx: AlterFeatures) => Promise<ExtractedFeatureDefinition[]> | ExtractedFeatureDefinition[];
+    /**
+     * Add custom features by defining either a pattern or path to a feature component.
+     */
+    featureImports?: string[];
+    /**
+     * Theme colors for the editor.
+     *
+     * Accent colors are used for selections, highlights, buttons.
+     * Mono colors are used for the UI elements in the editor.
+     */
+    theme?: ThemeName | Partial<Theme>;
+    /**
+     * Enable the theme editor feature.
+     */
+    enableThemeEditor?: boolean;
+    /**
+     * blokkli generates a JSON file that contains all the defined block
+     * options, keyed by block bundle. By default the file is output to
+     * .nuxt/blokkli/options-schema.json, but the path can be overriden here.
+     *
+     * The path can use aliases like ~ or @ and must also contain the file
+     * name including the extension.
+     */
+    schemaOptionsPath?: string;
+    /**
+     * Override the feature settings.
+     */
+    settingsOverride?: ModuleOptionsSettings;
+    /**
+     * The default storage values for non-settings values.
+     *
+     * These values are not visible in the settings dialog, but are still
+     * "settable" by the user through interactions. This option allows you to
+     * define default values for these settings, like default favorite block
+     * bundles.
+     */
+    storageDefaults?: ModuleOptionsStorageDefaults;
+};
+declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;
+
+export { type ModuleOptions, _default as default };

package/dist/module.json

@@ -0,0 +1,12 @@
+{
+  "name": "blokkli",
+  "configKey": "blokkli",
+  "version": "1.0.0",
+  "compatibility": {
+    "nuxt": "^3.12.0"
+  },
+  "builder": {
+    "@nuxt/module-builder": "0.8.4",
+    "unbuild": "2.0.0"
+  }
+}