@blokkli/editor 2.0.0-alpha.35 → 2.0.0-alpha.37

package/dist/global/types/blockOptions.d.ts

@@ -344,7 +344,15 @@ type DefinitionOptionRadiosBase<Icon extends string = string> = {
      */
     group?: string;
 } & (DefinitionOptionRadiosColors | DefinitionOptionRadiosGrid | DefinitionOptionRadiosRadios | DefinitionOptionRadiosIconsBase<Icon>);
-export type BlockOptionDefinitionBase<Icon extends string = string> = DefinitionOptionColor | DefinitionOptionCheckbox | DefinitionOptionCheckboxes | DefinitionOptionRadiosBase<Icon> | DefinitionOptionText | DefinitionOptionRange | DefinitionOptionNumber | DefinitionOptionDateTimeLocal;
+type DefinitionOptionJsonBase<DataType extends string = string> = {
+    type: 'json';
+    label: string;
+    default: string;
+    dataType?: DataType;
+    description?: string;
+    group?: string;
+};
+export type BlockOptionDefinitionBase<Icon extends string = string, DataType extends string = string> = DefinitionOptionJsonBase<DataType> | DefinitionOptionColor | DefinitionOptionCheckbox | DefinitionOptionCheckboxes | DefinitionOptionRadiosBase<Icon> | DefinitionOptionText | DefinitionOptionRange | DefinitionOptionNumber | DefinitionOptionDateTimeLocal;
 /**
  * Runtime block option array with validation data.
  * The third element varies by option type:
@@ -353,7 +361,7 @@ export type BlockOptionDefinitionBase<Icon extends string = string> = Definition
  * - datetime-local: optional [min?, max?] tuple
  * - other types: no third element
  */
-export type RuntimeBlockOptionArray = ['text', string] | ['checkbox', boolean] | ['color', `#${string}`] | ['radios', string, string[]] | ['checkboxes', string[], string[]] | ['number', number, [number, number]] | ['range', number, [number, number]] | ['datetime-local', string | undefined] | [
+export type RuntimeBlockOptionArray = ['text', string] | ['json', string] | ['json', string, string] | ['checkbox', boolean] | ['color', `#${string}`] | ['radios', string, string[]] | ['checkboxes', string[], string[]] | ['number', number, [number, number]] | ['range', number, [number, number]] | ['datetime-local', string | undefined] | [
     'datetime-local',
     string | undefined,
     [

package/dist/global/types/definitions.d.ts

@@ -15,7 +15,14 @@ export type BlockDefinitionRenderForFieldListBase<FieldListTypes extends string
 export type BlockDefinitionRenderForFieldListTypeBase<FieldListTypes extends string = string> = {
     fieldListType: FieldListTypes;
 };
-export type BlockDefinitionRenderForBase<BundleWithNested extends string = string, FieldListTypes extends string = string> = BlockDefinitionRenderForParentBase<BundleWithNested> | BlockDefinitionRenderForFieldListBase<FieldListTypes> | BlockDefinitionRenderForFieldListTypeBase<FieldListTypes>;
+export type BlockDefinitionRenderForProviderTypeBase<ProviderType extends string = string> = {
+    providerType: ProviderType;
+};
+export type PropsFieldMapping = {
+    type: 'editable' | 'droppable' | 'field';
+    name: string;
+};
+export type BlockDefinitionRenderForBase<BundleWithNested extends string = string, FieldListTypes extends string = string, ProviderType extends string = string> = BlockDefinitionRenderForParentBase<BundleWithNested> | BlockDefinitionRenderForFieldListBase<FieldListTypes> | BlockDefinitionRenderForFieldListTypeBase<FieldListTypes> | BlockDefinitionRenderForProviderTypeBase<ProviderType>;
 export type BlokkliDefinitionInputEditorBase<Options extends BlockDefinitionOptionsInputBase = BlockDefinitionOptionsInputBase, Icon extends string = string, PropsType = Record<string, any>> = {
     /**
      * The icon rendered in the editor.
@@ -152,7 +159,7 @@ export type BlokkliDefinitionInputEditorBase<Options extends BlockDefinitionOpti
      */
     mapDiffProps?: (props?: PropsType) => Record<string, string>;
 };
-export type BlockDefinitionInputBase<Options extends BlockDefinitionOptionsInputBase = BlockDefinitionOptionsInputBase, GlobalOptions extends string[] | undefined = string[], Bundle extends string = string, ChunkNames extends string = string, BundleWithNested extends string = string, FieldListTypes extends string = string, Icon extends string = string, BundlePropsMap extends Record<string, Record<string, any>> = Record<string, Record<string, any>>> = {
+export type BlockDefinitionInputBase<Options extends BlockDefinitionOptionsInputBase = BlockDefinitionOptionsInputBase, GlobalOptions extends string[] | undefined = string[], Bundle extends string = string, ChunkNames extends string = string, BundleWithNested extends string = string, FieldListTypes extends string = string, Icon extends string = string, BundlePropsMap extends Record<string, Record<string, any>> = Record<string, Record<string, any>>, ProviderTypes extends string = string> = {
     /**
      * The bundle ID of the block, e.g. "text" or "section_title".
      */
@@ -162,7 +169,7 @@ export type BlockDefinitionInputBase<Options extends BlockDefinitionOptionsInput
      * If a bundle is defined, then this component will be rendered if the
      * parent matches the given bundle.
      */
-    renderFor?: BlockDefinitionRenderForBase<BundleWithNested, FieldListTypes> | BlockDefinitionRenderForBase<BundleWithNested, FieldListTypes>[];
+    renderFor?: BlockDefinitionRenderForBase<BundleWithNested, FieldListTypes, ProviderTypes> | BlockDefinitionRenderForBase<BundleWithNested, FieldListTypes, ProviderTypes>[];
     /**
      * The name of the chunk group.
      *
@@ -216,7 +223,7 @@ export type BlockDefinitionInputBase<Options extends BlockDefinitionOptionsInput
      * </script>
      * ```
      */
-    propsFieldMapping?: Bundle extends keyof BundlePropsMap ? Partial<Record<keyof BundlePropsMap[Bundle], string>> : never;
+    propsFieldMapping?: Bundle extends keyof BundlePropsMap ? Record<keyof BundlePropsMap[Bundle], PropsFieldMapping | null> : Record<string, PropsFieldMapping | null>;
 };
 export type FragmentDefinitionInputBase<Options extends BlockDefinitionOptionsInputBase = BlockDefinitionOptionsInputBase, GlobalOptions extends string[] | undefined = string[], ChunkNames extends string = string, Icon extends string = string> = {
     /**
@@ -274,5 +281,5 @@ export type ProviderDefinitionInputBase<Options extends BlockDefinitionOptionsIn
      * These options will be merged with the component-specific options.
      */
     globalOptions?: GlobalOptions;
-    propsFieldMapping?: Record<string, string>;
+    propsFieldMapping?: Record<string, PropsFieldMapping | null>;
 };

package/dist/module.d.mts

@@ -1,6 +1,6 @@
 import { NuxtModule } from 'nuxt/schema';
-import { M as ModuleOptions } from './shared/editor.Iax3GCvt.mjs';
-export { a as ModuleHooks } from './shared/editor.Iax3GCvt.mjs';
+import { M as ModuleOptions } from './shared/editor.BdBm1Z7C.mjs';
+export { a as ModuleHooks } from './shared/editor.BdBm1Z7C.mjs';
 import 'consola';
 import '../dist/global/types/definitions.js';
 import '../dist/global/types/theme.js';

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@blokkli/editor",
   "configKey": "blokkli",
-  "version": "2.0.0-alpha.35",
+  "version": "2.0.0-alpha.37",
   "compatibility": {
     "nuxt": ">=3.15.0"
   },

package/dist/module.mjs

@@ -8,16 +8,17 @@ import * as ts from 'typescript';
 import { parseAndWalk } from 'oxc-walker';
 import path__default, { basename, dirname as dirname$1 } from 'node:path';
 import { dirname, resolve, relative } from 'pathe';
-import { C as Collector, a as CollectedFile, d as defineCodeTemplate, b as defineFileTemplate, w as withHelper } from './shared/editor.DMFfaLVE.mjs';
+import { C as Collector, a as CollectedFile } from './shared/editor.BFIzNSQM.mjs';
 import micromatch from 'micromatch';
 import { hash } from 'ohash';
 import fs__default, { readFileSync, existsSync, readdirSync } from 'node:fs';
 import { LANGUAGES, BK_VISIBLE_LANGUAGES, BK_HIDDEN_GLOBALLY } from './global/constants';
 import { createRequire } from 'node:module';
+import { d as defineCodeTemplate, a as defineFileTemplate, w as withHelper } from './shared/editor.6D5vApr0.mjs';
 import { defu, createDefu } from 'defu';
 
 const name = "@blokkli/editor";
-const version = "2.0.0-alpha.35";
+const version = "2.0.0-alpha.37";
 
 function sortObjectKeys(obj) {
   if (Array.isArray(obj)) {
@@ -277,6 +278,8 @@ function getVariations(definition) {
         return `block:${bundle}__p:${v.parentBundle}`;
       } else if ("fieldList" in v) {
         return `block:${bundle}__f:${v.fieldList}`;
+      } else if ("providerType" in v) {
+        return `block:${bundle}__t:${v.providerType}`;
       } else {
         return `block:${bundle}__f:${v.fieldListType}`;
       }
@@ -1140,6 +1143,10 @@ class ModuleHelper {
     if (!fieldListTypes.includes("default")) {
       fieldListTypes.push("default");
     }
+    const providerTypes = providedOptions.providerTypes || [];
+    if (!providerTypes.includes("default")) {
+      providerTypes.push("default");
+    }
     const chunkNames = providedOptions.chunkNames || [];
     if (!chunkNames.includes("global")) {
       chunkNames.push("global");
@@ -1148,6 +1155,7 @@ class ModuleHelper {
       ...providedOptions,
       pattern,
       fieldListTypes: fieldListTypes.filter(onlyUnique),
+      providerTypes: providerTypes.filter(onlyUnique),
       chunkNames: chunkNames.filter(onlyUnique)
     };
     this.paths.editAdapter = this.findEditAdapterPath();
@@ -1261,7 +1269,29 @@ class ModuleContext {
   templates = [];
   templateContents = /* @__PURE__ */ new Map();
   adapterExtensions = [];
+  featureFragments = /* @__PURE__ */ new Set();
+  complexOptionTypes = /* @__PURE__ */ new Map();
   collectors = [];
+  addFeatureFragment(name) {
+    if (this.featureFragments.has(name)) {
+      throw new Error(`A feature fragment with name "${name}" already exists.`);
+    }
+    this.featureFragments.add(name);
+  }
+  getFeatureFragmentNames() {
+    return [...this.featureFragments.values()];
+  }
+  registerComplexOptionType(def) {
+    if (this.complexOptionTypes.has(def.id)) {
+      throw new Error(
+        `A complex option type with id "${def.id}" already exists.`
+      );
+    }
+    this.complexOptionTypes.set(def.id, def);
+  }
+  getComplexOptionTypes() {
+    return [...this.complexOptionTypes.values()];
+  }
   registerAdapterExtension(namespace, path) {
     if (this.adapterExtensions.some((e) => e.namespace === namespace)) {
       throw new Error(`Duplicate adapter extension namespace: ${namespace}`);
@@ -1469,9 +1499,12 @@ function toTypeLiteral(value) {
 const USED_MATERIAL_ICONS = [
   "bk_mdi_account_tree",
   "bk_mdi_add",
+  "bk_mdi_add_column_right",
   "bk_mdi_add_comment",
+  "bk_mdi_add_row_below",
   "bk_mdi_anchor",
   "bk_mdi_architecture",
+  "bk_mdi_area_chart",
   "bk_mdi_arrow_downward",
   "bk_mdi_arrow_drop_down",
   "bk_mdi_arrow_left",
@@ -1495,6 +1528,7 @@ const USED_MATERIAL_ICONS = [
   "bk_mdi_chevron_backward",
   "bk_mdi_chevron_forward",
   "bk_mdi_close",
+  "bk_mdi_collapse_all",
   "bk_mdi_comment",
   "bk_mdi_construction",
   "bk_mdi_content_copy",
@@ -1504,10 +1538,13 @@ const USED_MATERIAL_ICONS = [
   "bk_mdi_dock_to_left",
   "bk_mdi_dock_to_right",
   "bk_mdi_done_all",
+  "bk_mdi_donut_large",
   "bk_mdi_drag_pan",
   "bk_mdi_edit",
   "bk_mdi_exit_to_app",
+  "bk_mdi_expand_all",
   "bk_mdi_extension",
+  "bk_mdi_forum",
   "bk_mdi_function",
   "bk_mdi_grid_view",
   "bk_mdi_grid_view-fill",
@@ -1524,16 +1561,17 @@ const USED_MATERIAL_ICONS = [
   "bk_mdi_menu",
   "bk_mdi_mobile",
   "bk_mdi_mobile_rotate",
-  "bk_mdi_more_horiz",
   "bk_mdi_newspaper",
   "bk_mdi_open_in_new",
   "bk_mdi_palette",
   "bk_mdi_person",
   "bk_mdi_person-fill",
+  "bk_mdi_pie_chart",
   "bk_mdi_priority_high",
   "bk_mdi_publish",
   "bk_mdi_qr_code",
   "bk_mdi_question_mark",
+  "bk_mdi_radar",
   "bk_mdi_radio_button_checked",
   "bk_mdi_redo",
   "bk_mdi_remove",
@@ -1548,6 +1586,7 @@ const USED_MATERIAL_ICONS = [
   "bk_mdi_sentiment_dissatisfied",
   "bk_mdi_sentiment_worried",
   "bk_mdi_settings",
+  "bk_mdi_show_chart",
   "bk_mdi_speed",
   "bk_mdi_stack_group",
   "bk_mdi_stop",
@@ -1557,6 +1596,7 @@ const USED_MATERIAL_ICONS = [
   "bk_mdi_text_select_end",
   "bk_mdi_texture",
   "bk_mdi_title",
+  "bk_mdi_track_changes",
   "bk_mdi_trackpad_input",
   "bk_mdi_translate",
   "bk_mdi_tune",
@@ -2686,6 +2726,7 @@ const editorConfig = defineCodeTemplate(
   "editor-config",
   (ctx) => {
     const settingsOverride = ctx.helper.options.settingsOverride || {};
+    const featureFragmentNames = ctx.getFeatureFragmentNames();
     return `
 export const hasCustomTheme = ${JSON.stringify(ctx.theme.hasCustomTheme)}
 
@@ -2708,6 +2749,8 @@ export const defaultLanguage = ${JSON.stringify(
 export const forceDefaultLanguage = ${JSON.stringify(
       !!ctx.helper.options.forceDefaultLanguage
     )}
+
+export const featureFragmentNames = ${JSON.stringify(featureFragmentNames)}
 `;
   },
   (ctx) => {
@@ -2760,6 +2803,11 @@ export declare const templateEntityType: string | null
  * Whether to always force the default language, even on translation pages.
  */
 export declare const forceDefaultLanguage: boolean
+
+/**
+ * The fragment names provided by features.
+ */
+export declare const featureFragmentNames: string[]
 `;
   }
 );
@@ -2978,6 +3026,11 @@ function toRuntimeOptionArray(option) {
     return [option.type, option.default];
   } else if (option.type === "color") {
     return [option.type, option.default];
+  } else if (option.type === "json") {
+    if (option.dataType) {
+      return [option.type, option.default, option.dataType];
+    }
+    return [option.type, option.default];
   }
   return [option.type, option.default];
 }
@@ -3026,9 +3079,20 @@ const runtimeOptions = defineCodeTemplate(
       });
       if (isBlock(item.definition)) {
         if (item.definition.propsFieldMapping) {
+          const mapping = Object.entries(
+            item.definition.propsFieldMapping
+          ).reduce(
+            (acc, [propName, mapping2]) => {
+              if (mapping2) {
+                acc[propName] = [mapping2.type, mapping2.name];
+              }
+              return acc;
+            },
+            {}
+          );
           FIELD_MAPPING.set(
             item.definition.bundle,
-            JSON.stringify(item.definition.propsFieldMapping, null, 2)
+            JSON.stringify(mapping, null, 2)
           );
         }
       }
@@ -3094,8 +3158,10 @@ export type RuntimeBlockOptions = {
 ${runtimeMappedOptionTypes}
 }
 
+export type PropsFieldMappingType = 'editable' | 'droppable' | 'field'
+
 export declare const OPTIONS: Record<string, Record<string, RuntimeBlockOptionArray>>
-export declare const FIELD_MAPPING: Record<string, Record<string, string>>
+export declare const FIELD_MAPPING: Record<string, Record<string, [PropsFieldMappingType, string]>>
 `;
   },
   {
@@ -3191,6 +3257,7 @@ const generatedTypes = defineCodeTemplate(
     };
     const chunkNames = ctx.helper.options.chunkNames || ["global"];
     const fieldListTypes = ctx.helper.options.fieldListTypes || ["default"];
+    const providerTypes = ctx.helper.options.providerTypes || ["default"];
     const globalOptions = ctx.helper.options.globalOptions || {};
     const validGlobalOptions = Object.keys(globalOptions);
     const blockBundlesWithNested = [];
@@ -3250,6 +3317,8 @@ import type { FieldListItem } from "${ctx.helper.relativePaths.TYPES}"
 
 export type ValidFieldListTypes = ${toStringUnion(fieldListTypes)}
 
+export type ValidProviderTypes = ${toStringUnion(providerTypes)}
+
 export type BlockBundle = ${toStringUnion(validBlockBundles)}
 
 export type BlockBundleWithNested = ${toStringUnion(blockBundlesWithNested)}
@@ -3556,6 +3625,54 @@ ${iconNames.map((name) => `  | '${name}'`).join("\n")}
 `;
 });
 
+const complexOptionTypes = defineCodeTemplate(
+  "complex-option-types",
+  (ctx) => {
+    const types = ctx.getComplexOptionTypes();
+    if (types.length === 0) {
+      return `export const COMPLEX_OPTION_TYPES = {}`;
+    }
+    const entries = types.map(
+      (t) => `  '${t.id}': {
+    editorComponent: defineAsyncComponent(() => import('${ctx.helper.toModuleBuildRelative(t.editorComponentPath)}')),
+    editorButtonLabel: '${t.editorButtonLabel}',
+    editorIcon: '${t.editorIcon}',
+  }`
+    ).join(",\n");
+    return `import { defineAsyncComponent } from 'vue'
+
+export const COMPLEX_OPTION_TYPES = {
+${entries}
+}`;
+  },
+  (ctx) => {
+    const types = ctx.getComplexOptionTypes();
+    if (types.length === 0) {
+      return `export interface ComplexOptionTypeMap {}
+export const COMPLEX_OPTION_TYPES: Record<string, never>`;
+    }
+    const imports = types.map(
+      (t) => `import type { ${t.typeName} } from '${ctx.helper.toModuleBuildRelative(t.typePath)}'`
+    ).join("\n");
+    const entries = types.map((t) => `  '${t.id}': ${t.typeName}`).join("\n");
+    return `${imports}
+import type { BlokkliIcon } from './icons'
+
+export interface ComplexOptionTypeMap {
+${entries}
+}
+
+export const COMPLEX_OPTION_TYPES: Record<string, {
+  editorComponent: import('vue').Component
+  editorButtonLabel: string
+  editorIcon: BlokkliIcon
+}>`;
+  },
+  {
+    write: true
+  }
+);
+
 const TEMPLATES = [
   icons,
   features,
@@ -3577,7 +3694,8 @@ const TEMPLATES = [
   chunkGroup,
   chunkEditing,
   importMeta,
-  materialIcons
+  materialIcons,
+  complexOptionTypes
 ];
 
 class CollectedFeatureFile extends CollectedFile {
@@ -3820,7 +3938,8 @@ const module$1 = defineNuxtModule({
     );
     const app = {
       helper,
-      context
+      context,
+      $t: (key, _defaultText) => key
     };
     for (const module of blokkliModules) {
       await module.init.setup(app, module.options);

package/dist/modules/agent/index.d.mts

@@ -1,4 +1,4 @@
-import { B as BlokkliModule } from '../../shared/editor.Iax3GCvt.mjs';
+import { B as BlokkliModule } from '../../shared/editor.BdBm1Z7C.mjs';
 import 'nuxt/schema';
 import 'consola';
 import '../../../dist/global/types/definitions.js';