@jackuait/blok 0.4.3-beta.7 → 0.4.3-beta.8

package/dist/chunks/{i18next-loader-BFNg4Ihu.mjs → i18next-loader-D0iIovKH.mjs}

@@ -1,4 +1,4 @@
-import { e as i } from "./blok-B-fFKCc3.mjs";
+import { e as i } from "./blok-JdFwSTgC.mjs";
 const l = async (e, r) => {
   const n = (await import("./i18next-CugVlwWp.mjs")).default.createInstance(), s = {
     lng: e,

package/dist/chunks/{index-DwJjM4zN.mjs → index-y3l95XAF.mjs}

@@ -1,4 +1,4 @@
-import { t as f, q as i } from "./inline-tool-convert-BQzo9tk1.mjs";
+import { t as f, q as i } from "./inline-tool-convert-MJUgGURB.mjs";
 const a = {
   wrapper: i(
     "fixed z-[2] bottom-5 left-5",

package/dist/chunks/{inline-tool-convert-BQzo9tk1.mjs → inline-tool-convert-MJUgGURB.mjs}

@@ -18,7 +18,7 @@ let nt = (o = 21) => {
   return t;
 };
 var ot = /* @__PURE__ */ ((o) => (o.VERBOSE = "VERBOSE", o.INFO = "INFO", o.WARN = "WARN", o.ERROR = "ERROR", o))(ot || {});
-const rt = () => "0.4.3-beta.7", Ct = {
+const rt = () => "0.4.3-beta.8", Ct = {
   BACKSPACE: 8,
   TAB: 9,
   ENTER: 13,

package/dist/full.mjs

@@ -10,10 +10,10 @@ var e = (a, l, o) => l in a ? n(a, l, { enumerable: !0, configurable: !0, writab
       d.call(l, o) && e(a, o, l[o]);
   return a;
 }, r = (a, l) => t(a, c(l));
-import { B as v, v as A } from "./chunks/blok-B-fFKCc3.mjs";
+import { B as v, v as A } from "./chunks/blok-JdFwSTgC.mjs";
 import { List as p, Header as f, Paragraph as I, Link as k, Italic as u, Bold as B } from "./tools.mjs";
 import { defaultBlockTools as H, defaultInlineTools as P } from "./tools.mjs";
-import { D as _ } from "./chunks/inline-tool-convert-BQzo9tk1.mjs";
+import { D as _ } from "./chunks/inline-tool-convert-MJUgGURB.mjs";
 const m = {
   paragraph: {
     class: I,

package/dist/tools.mjs

@@ -10,8 +10,8 @@ var U = (f, t, e) => t in f ? rt(f, t, { enumerable: !0, configurable: !0, writa
       at.call(t, e) && U(f, e, t[e]);
   return f;
 }, P = (f, t) => st(f, ot(t));
-import { t as L, D as g, a9 as nt, aa as lt, ab as G, ac as ct, ad as dt, ae as ut, af as ht, ag as ft, ah as pt, ai as j, aj as $, ak as X, f as A, al as gt, am as mt, S as H, P as Et, an as Tt, l as Ct, J as At } from "./chunks/inline-tool-convert-BQzo9tk1.mjs";
-import { a0 as Ot } from "./chunks/inline-tool-convert-BQzo9tk1.mjs";
+import { t as L, D as g, a9 as nt, aa as lt, ab as G, ac as ct, ad as dt, ae as ut, af as ht, ag as ft, ah as pt, ai as j, aj as $, ak as X, f as A, al as gt, am as mt, S as H, P as Et, an as Tt, l as Ct, J as At } from "./chunks/inline-tool-convert-MJUgGURB.mjs";
+import { a0 as Ot } from "./chunks/inline-tool-convert-MJUgGURB.mjs";
 const W = [
   "empty:before:pointer-events-none",
   "empty:before:text-gray-text",
@@ -3093,9 +3093,9 @@ const D = class D {
 D.isInline = !0, D.title = "Link", D.titleKey = "link", D.shortcut = "CMD+K";
 let et = D;
 const xt = {
-  paragraph: { inlineToolbar: !0, config: { preserveBlank: !0 } },
-  header: { inlineToolbar: !0 },
-  list: { inlineToolbar: !0 }
+  paragraph: { preserveBlank: !0 },
+  header: {},
+  list: {}
 }, vt = {
   bold: {},
   italic: {},

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jackuait/blok",
-  "version": "0.4.3-beta.7",
+  "version": "0.4.3-beta.8",
   "description": "Blok — headless, highly extensible rich text editor built for developers who need to implement a block-based editing experience (similar to Notion) without building it from scratch",
   "module": "dist/blok.mjs",
   "types": "./types/index.d.ts",

package/src/components/modules/dragManager.ts

@@ -35,6 +35,8 @@ const DRAG_CONFIG = {
   autoScrollSpeed: 10,
   /** Throttle delay for drop position announcements (ms) */
   announcementThrottleMs: 300,
+  /** Horizontal distance to the left of blocks where drop is still valid */
+  leftDropZone: 50,
 };
 
 /**
@@ -424,20 +426,10 @@ export class DragManager extends Module {
       return;
     }
 
-    // Find block holder
-    const blockHolder = elementUnderCursor.closest(createSelector(DATA_ATTR.element)) as HTMLElement | null;
+    // Find block holder - first try direct hit, then left drop zone fallback
+    const { block: targetBlock, holder: blockHolder } = this.findDropTargetBlock(elementUnderCursor, clientX, clientY);
 
-    if (!blockHolder) {
-      this.dragState.targetBlock = null;
-      this.dragState.targetEdge = null;
-
-      return;
-    }
-
-    // Find the block instance
-    const targetBlock = this.Blok.BlockManager.blocks.find(b => b.holder === blockHolder);
-
-    if (!targetBlock || targetBlock === this.dragState.sourceBlock) {
+    if (!blockHolder || !targetBlock || targetBlock === this.dragState.sourceBlock) {
       this.dragState.targetBlock = null;
       this.dragState.targetEdge = null;
 
@@ -1132,6 +1124,72 @@ export class DragManager extends Module {
     return collectDescendants(blockIndex + 1, []);
   }
 
+  /**
+   * Finds the drop target block from an element or by checking the left drop zone.
+   * @param elementUnderCursor - Element directly under the cursor
+   * @param clientX - Cursor X position
+   * @param clientY - Cursor Y position
+   * @returns Object with block and holder, or nulls if no valid target found
+   */
+  private findDropTargetBlock(
+    elementUnderCursor: Element,
+    clientX: number,
+    clientY: number
+  ): { block: Block | undefined; holder: HTMLElement | null } {
+    // First try: find block holder directly under cursor
+    const directHolder = elementUnderCursor.closest(createSelector(DATA_ATTR.element)) as HTMLElement | null;
+
+    if (directHolder) {
+      const block = this.Blok.BlockManager.blocks.find(b => b.holder === directHolder);
+
+      return { block, holder: directHolder };
+    }
+
+    // Fallback: check if cursor is in the left drop zone
+    const leftZoneBlock = this.findBlockInLeftDropZone(clientX, clientY);
+
+    if (leftZoneBlock) {
+      return { block: leftZoneBlock, holder: leftZoneBlock.holder };
+    }
+
+    return { block: undefined, holder: null };
+  }
+
+  /**
+   * Finds a block by vertical position when cursor is in the left drop zone.
+   * Used as a fallback when elementFromPoint doesn't find a block directly.
+   * @param clientX - Cursor X position
+   * @param clientY - Cursor Y position
+   * @returns Block at the vertical position, or null if not in left zone or no block found
+   */
+  private findBlockInLeftDropZone(clientX: number, clientY: number): Block | null {
+    const contentRect = this.Blok.UI.contentRect;
+    const leftEdge = contentRect.left;
+
+    // Check if cursor is within left drop zone (between leftEdge - leftDropZone and leftEdge)
+    const distanceFromEdge = leftEdge - clientX;
+
+    if (distanceFromEdge < 0 || distanceFromEdge > DRAG_CONFIG.leftDropZone) {
+      return null;
+    }
+
+    // Find block by Y position
+    for (const block of this.Blok.BlockManager.blocks) {
+      // Skip source blocks
+      if (this.dragState?.sourceBlocks.includes(block)) {
+        continue;
+      }
+
+      const rect = block.holder.getBoundingClientRect();
+
+      if (clientY >= rect.top && clientY <= rect.bottom) {
+        return block;
+      }
+    }
+
+    return null;
+  }
+
   /**
    * Module destruction
    */

package/src/components/modules/tools.ts

@@ -334,18 +334,18 @@ export class Tools extends Module {
       .map(([toolName, settings]): ChainData => {
         const toolData: ToolPrepareData = {
           toolName,
-          config: (settings.config ?? {}) as ToolConfig,
+          config: this.extractToolConfig(settings),
         };
 
         const prepareFunction: ChainData['function'] = async (payload?: unknown) => {
-          const constructable = settings.class;
+          const constructable = settings.class as ToolConstructable | undefined;
 
           if (!constructable || !isFunction(constructable.prepare)) {
             return;
           }
 
           const data = (payload ?? toolData) as ToolPrepareData;
-          const prepareMethod = constructable.prepare as unknown as ToolPrepareFunction;
+          const prepareMethod = constructable.prepare as ToolPrepareFunction;
 
           return prepareMethod.call(constructable, data);
         };
@@ -357,6 +357,42 @@ export class Tools extends Module {
       });
   }
 
+  /**
+   * Keys that are Blok-level settings (not passed to tool constructor)
+   */
+  private static readonly BLOK_SETTINGS_KEYS = new Set([
+    'class',
+    'inlineToolbar',
+    'tunes',
+    'shortcut',
+    'toolbox',
+    'config',
+    'isInternal',
+  ]);
+
+  /**
+   * Extracts tool configuration from settings.
+   * Merges nested config with flat tool-specific options (flat takes precedence).
+   * @param settings - Tool settings from user config
+   * @returns Merged tool configuration
+   */
+  private extractToolConfig(settings: ToolSettings): ToolConfig {
+    // eslint-disable-next-line @typescript-eslint/no-deprecated -- Internal: reading legacy config for backwards compatibility
+    const nestedConfig = (settings.config ?? {}) as ToolConfig;
+
+    // Extract non-Blok keys as tool-specific config
+    const flatConfig: Record<string, unknown> = {};
+
+    for (const key of Object.keys(settings)) {
+      if (!Tools.BLOK_SETTINGS_KEYS.has(key)) {
+        flatConfig[key] = settings[key as keyof typeof settings];
+      }
+    }
+
+    // Merge: nested config first, flat config overrides
+    return { ...nestedConfig, ...flatConfig } as ToolConfig;
+  }
+
   /**
    * Assign enabled Inline Tools and Block Tunes for Block Tool
    */

package/src/components/tools/base.ts

@@ -7,6 +7,19 @@ import type { InlineToolAdapter as InlineToolAdapterInterface } from '@/types/to
 import type { BlockToolAdapter as BlockToolAdapterInterface } from '@/types/tools/adapters/block-tool-adapter';
 import type { BlockTuneAdapter as BlockTuneAdapterInterface } from '@/types/tools/adapters/block-tune-adapter';
 
+/**
+ * Keys that are Blok-level settings (not passed to tool constructor)
+ */
+const BLOK_SETTINGS_KEYS = new Set([
+  'class',
+  'inlineToolbar',
+  'tunes',
+  'shortcut',
+  'toolbox',
+  'config',
+  'isInternal',
+]);
+
 /**
  * Enum of Tool options provided by user
  */
@@ -188,10 +201,24 @@ export abstract class BaseToolAdapter<Type extends ToolType = ToolType, ToolClas
   }
 
   /**
-   * Returns Tool user configuration
+   * Returns Tool user configuration.
+   * Extracts tool-specific options from flat config and merges with nested config.
    */
   public get settings(): ToolConfig {
-    const config = (this.config[UserSettings.Config] ?? {}) as ToolConfig;
+    // eslint-disable-next-line @typescript-eslint/no-deprecated -- Internal: reading legacy config for backwards compatibility
+    const nestedConfig = (this.config[UserSettings.Config] ?? {}) as ToolConfig;
+
+    // Extract non-Blok keys as tool-specific config
+    const flatConfig: Record<string, unknown> = {};
+
+    for (const key of Object.keys(this.config)) {
+      if (!BLOK_SETTINGS_KEYS.has(key)) {
+        flatConfig[key] = this.config[key as keyof typeof this.config];
+      }
+    }
+
+    // Merge: nested config first, flat config overrides
+    const config = { ...nestedConfig, ...flatConfig } as ToolConfig;
 
     if (this.isDefault && !('placeholder' in config) && this.defaultPlaceholder) {
       config.placeholder = this.defaultPlaceholder;

package/src/components/tools/block.ts

@@ -203,10 +203,18 @@ export class BlockToolAdapter extends BaseToolAdapter<ToolType.Block, IBlockTool
   }
 
   /**
-   * Returns enabled inline tools for Tool
+   * Returns enabled inline tools for Tool.
+   * Defaults to true (all inline tools) unless explicitly set to false or array.
    */
   public get enabledInlineTools(): boolean | string[] {
-    return this.config[UserSettings.EnabledInlineTools] || false;
+    const setting = this.config[UserSettings.EnabledInlineTools];
+
+    // Default to true if not specified
+    if (setting === undefined) {
+      return true;
+    }
+
+    return setting;
   }
 
   /**

package/src/tools/header/index.ts

@@ -206,6 +206,7 @@ export class Header implements BlockTool {
     /**
      * If user provided custom toolbox entries, use them to build settings menu.
      * This ensures block settings match the toolbox configuration.
+     * Fall back to levels config only when _toolboxEntries is empty.
      */
     if (toolboxEntries !== undefined && toolboxEntries.length > 0) {
       return this.buildSettingsFromToolboxEntries(toolboxEntries);

package/src/tools/index.ts

@@ -6,10 +6,16 @@
  * // Import specific tools
  * import { Paragraph, Header, List, Bold, Italic, Link } from '@jackuait/blok/tools';
  *
- * // Use in Blok configuration
+ * // Use in Blok configuration (flat config style)
  * new Blok({
- *   tools: { paragraph: Paragraph, header: Header, list: List },
- *   inlineTools: { bold: Bold, italic: Italic, link: Link }
+ *   tools: {
+ *     paragraph: Paragraph,
+ *     header: { class: Header, levels: [1, 2, 3] },
+ *     list: List,
+ *     bold: Bold,
+ *     italic: Italic,
+ *     link: Link,
+ *   }
  * });
  */
 
@@ -25,10 +31,11 @@ export { LinkInlineTool as Link } from '../components/inline-tools/inline-tool-l
 export { ConvertInlineTool as Convert } from '../components/inline-tools/inline-tool-convert';
 
 // Default tools configuration for convenience
+// Note: inlineToolbar defaults to true, so it doesn't need to be specified
 export const defaultBlockTools = {
-  paragraph: { inlineToolbar: true, config: { preserveBlank: true } },
-  header: { inlineToolbar: true },
-  list: { inlineToolbar: true },
+  paragraph: { preserveBlank: true },
+  header: {},
+  list: {},
 } as const;
 
 export const defaultInlineTools = {

package/types/tools/tool-settings.d.ts

@@ -1,6 +1,12 @@
 import { ToolConfig } from './tool-config';
 import { ToolConstructable, BlockToolData, MenuConfig, MenuConfigItem } from './index';
 
+/**
+ * Permissive type for tool class - accepts any constructor.
+ * Runtime validation ensures the tool has required methods.
+ */
+export type ToolClass = new (...args: any[]) => any;
+
 /**
  * Tool may specify its toolbox configuration
  * It may include several entries as well
@@ -49,9 +55,9 @@ export interface ToolboxConfigEntry {
 export interface ExternalToolSettings<Config extends object = any> {
 
   /**
-   * Tool's class
+   * Tool's class - accepts any constructor, validated at runtime
    */
-  class: ToolConstructable;
+  class: ToolConstructable | ToolClass;
 
   /**
    * User configuration object that will be passed to the Tool's constructor
@@ -88,6 +94,58 @@ export interface ExternalToolSettings<Config extends object = any> {
 export type InternalToolSettings<Config extends object = any> = Omit<ExternalToolSettings<Config>, 'class'> & Partial<Pick<ExternalToolSettings<Config>, 'class'>>;
 
 /**
- * Union of external and internal Tools settings
+ * Keys that Blok extracts from tool settings (not passed to tool constructor)
+ */
+export type BlokToolSettingsKeys = 'class' | 'inlineToolbar' | 'tunes' | 'shortcut' | 'toolbox' | 'config';
+
+/**
+ * Flat tool settings - tool-specific options at top level.
+ * Blok extracts known keys and passes the rest as `config` to the tool.
+ */
+export interface FlatToolSettings<Config extends object = any> {
+  /**
+   * Tool's class
+   */
+  class: ToolConstructable | ToolClass;
+
+  /**
+   * Is need to show Inline Toolbar.
+   * Defaults to true for block tools.
+   */
+  inlineToolbar?: boolean | string[];
+
+  /**
+   * BlockTunes for Tool
+   */
+  tunes?: boolean | string[];
+
+  /**
+   * Define shortcut that will render Tool
+   */
+  shortcut?: string;
+
+  /**
+   * Tool's Toolbox settings
+   */
+  toolbox?: ToolboxConfig | false;
+
+  /**
+   * Legacy nested config - merged with top-level tool options
+   * @deprecated Use flat config instead
+   */
+  config?: ToolConfig<Config>;
+
+  /**
+   * Tool-specific options (placeholder, levels, etc.)
+   * These are passed to the tool constructor as `config`
+   */
+  [key: string]: unknown;
+}
+
+/**
+ * Union of all tool settings formats
  */
-export type ToolSettings<Config extends object = any> = InternalToolSettings<Config> | ExternalToolSettings<Config>;
+export type ToolSettings<Config extends object = any> =
+  | InternalToolSettings<Config>
+  | ExternalToolSettings<Config>
+  | FlatToolSettings<Config>;