@nexxtmove/ui 1.37.0 → 1.39.0

package/dist/components/editor/molecules/EditorAlignItems/EditorAlignItems.vue.d.ts

@@ -1,8 +1,23 @@
+/**
+ * The options the editor offers, in the order they are shown. `token` is the
+ * class without its fixed `items-` prefix, so the class is `items-` plus the
+ * token. The labels are not in here; they arrive through `messages`, keyed by
+ * token.
+ */
+export declare const EDITOR_ALIGN_ITEMS_OPTIONS: readonly [{
+    readonly token: "start";
+}, {
+    readonly token: "center";
+}, {
+    readonly token: "end";
+}, {
+    readonly token: "stretch";
+}];
 /**
  * The cross-axis alignment as the editor needs it: the Tailwind class itself,
  * so the consumer can put the model value straight on the element it styles.
  */
-export type EditorAlignItemsValue = 'items-start' | 'items-center' | 'items-end' | 'items-stretch';
+export type EditorAlignItemsValue = `items-${(typeof EDITOR_ALIGN_ITEMS_OPTIONS)[number]['token']}`;
 /** Overridable copy for the four options. Every key is optional. */
 export interface EditorAlignItemsMessages {
     /** Accessible name of the `items-start` option. Defaults to `'Begin'`. */
@@ -35,10 +50,10 @@ declare const __VLS_export: import('vue').DefineComponent<NexxtEditorAlignItemsP
     /** The selected alignment, as the Tailwind class to apply. */
     modelValue: EditorAlignItemsValue;
 }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:modelValue": (value: EditorAlignItemsValue) => any;
+    "update:modelValue": (value: "items-center" | "items-end" | "items-start" | "items-stretch") => any;
 }, string, import('vue').PublicProps, Readonly<NexxtEditorAlignItemsProps & {
     /** The selected alignment, as the Tailwind class to apply. */
     modelValue: EditorAlignItemsValue;
 }> & Readonly<{
-    "onUpdate:modelValue"?: ((value: EditorAlignItemsValue) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: "items-center" | "items-end" | "items-start" | "items-stretch") => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;

package/dist/components/editor/molecules/EditorBackgroundSize/EditorBackgroundSize.vue.d.ts

@@ -1,8 +1,20 @@
+/**
+ * The options the editor offers, in the order they are shown. `token` is the
+ * class without its fixed `bg-` prefix, so the class is `bg-` plus the token.
+ * The labels are not in here; they arrive through `messages`, keyed by token.
+ */
+export declare const EDITOR_BACKGROUND_SIZE_OPTIONS: readonly [{
+    readonly token: "cover";
+}, {
+    readonly token: "contain";
+}, {
+    readonly token: "auto";
+}];
 /**
  * The background size as the editor needs it: the Tailwind class itself, so the
  * consumer can put the model value straight on the element it styles.
  */
-export type EditorBackgroundSizeValue = 'bg-cover' | 'bg-contain' | 'bg-auto';
+export type EditorBackgroundSizeValue = `bg-${(typeof EDITOR_BACKGROUND_SIZE_OPTIONS)[number]['token']}`;
 /** Overridable copy for the three options. Every key is optional. */
 export interface EditorBackgroundSizeMessages {
     /** Accessible name of the `bg-cover` option. Defaults to `'Opvullen'`. */
@@ -33,10 +45,10 @@ declare const __VLS_export: import('vue').DefineComponent<NexxtEditorBackgroundS
     /** The selected background size, as the Tailwind class to apply. */
     modelValue: EditorBackgroundSizeValue;
 }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:modelValue": (value: EditorBackgroundSizeValue) => any;
+    "update:modelValue": (value: "bg-auto" | "bg-cover" | "bg-contain") => any;
 }, string, import('vue').PublicProps, Readonly<NexxtEditorBackgroundSizeProps & {
     /** The selected background size, as the Tailwind class to apply. */
     modelValue: EditorBackgroundSizeValue;
 }> & Readonly<{
-    "onUpdate:modelValue"?: ((value: EditorBackgroundSizeValue) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: "bg-auto" | "bg-cover" | "bg-contain") => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;

package/dist/components/editor/molecules/EditorBorder/EditorBorder.vue.d.ts

@@ -4,22 +4,27 @@
  * rather than theme tokens -- the theme defines no border-width scale, so
  * stepping over arbitrary integers would produce classes with no CSS behind
  * them.
+ *
+ * `token` is the full width class, not a suffix: the 1px step is the bare
+ * `border`, which has none. The model value pairs it with an optional colour
+ * class; a value without a width class on the list puts the slider on the first
+ * step.
  */
-declare const BORDER_STEPS: readonly [{
-    readonly class: "border";
+export declare const EDITOR_BORDER_STEPS: readonly [{
+    readonly token: "border";
     readonly px: 1;
 }, {
-    readonly class: "border-2";
+    readonly token: "border-2";
     readonly px: 2;
 }, {
-    readonly class: "border-4";
+    readonly token: "border-4";
     readonly px: 4;
 }, {
-    readonly class: "border-8";
+    readonly token: "border-8";
     readonly px: 8;
 }];
 /** The width part of the model value, as the Tailwind class itself. */
-export type EditorBorderWidth = (typeof BORDER_STEPS)[number]['class'];
+export type EditorBorderWidth = (typeof EDITOR_BORDER_STEPS)[number]['token'];
 /** Overridable copy of the readout and the picker. Every key is optional. */
 export interface EditorBorderMessages {
     /** Unit shown behind the width. Defaults to `'px'`. */

package/dist/components/editor/molecules/EditorFlexDirection/EditorFlexDirection.vue.d.ts

@@ -1,8 +1,18 @@
+/**
+ * The options the editor offers, in the order they are shown. `token` is the
+ * class without its fixed `flex-` prefix, so the class is `flex-` plus the
+ * token. The labels are not in here; they arrive through `messages`.
+ */
+export declare const EDITOR_FLEX_DIRECTION_OPTIONS: readonly [{
+    readonly token: "row";
+}, {
+    readonly token: "col";
+}];
 /**
  * The flex direction as the editor needs it: the Tailwind class itself, so the
  * consumer can put the model value straight on the element it styles.
  */
-export type EditorFlexDirectionValue = 'flex-row' | 'flex-col';
+export type EditorFlexDirectionValue = `flex-${(typeof EDITOR_FLEX_DIRECTION_OPTIONS)[number]['token']}`;
 /** Overridable copy for the two options. Every key is optional. */
 export interface EditorFlexDirectionMessages {
     /** Label of the `flex-row` option. Defaults to `'Horizontaal'`. */
@@ -30,10 +40,10 @@ declare const __VLS_export: import('vue').DefineComponent<NexxtEditorFlexDirecti
     /** The selected direction, as the Tailwind class to apply. */
     modelValue: EditorFlexDirectionValue;
 }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:modelValue": (value: EditorFlexDirectionValue) => any;
+    "update:modelValue": (value: "flex-col" | "flex-row") => any;
 }, string, import('vue').PublicProps, Readonly<NexxtEditorFlexDirectionProps & {
     /** The selected direction, as the Tailwind class to apply. */
     modelValue: EditorFlexDirectionValue;
 }> & Readonly<{
-    "onUpdate:modelValue"?: ((value: EditorFlexDirectionValue) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: "flex-col" | "flex-row") => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;

package/dist/components/editor/molecules/EditorGap/EditorGap.vue.d.ts

@@ -1,15 +1,64 @@
 /**
- * The steps the slider can land on, as the numeric part of the Tailwind class.
- * 13 and 15 are missing on purpose: the theme defines `--spacing-0` through
- * `--spacing-12` and then only 14 and 16, so stepping over the px value instead
- * of over this list would offer gaps that have no token behind them.
+ * The steps the slider can land on, with the px they render (the spacing scale
+ * is built on 0.25rem, so a step is 4 px). 13 and 15 are missing on purpose:
+ * the theme defines `--spacing-0` through `--spacing-12` and then only 14 and
+ * 16, so stepping over the px value instead of over this list would offer gaps
+ * that have no token behind them.
+ *
+ * `token` is the numeric part of the class; the class is `gap-` plus the token.
+ * A stored value that is not on the list puts the slider on the first step.
  */
-declare const GAP_STEPS: readonly [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 14, 16];
+export declare const EDITOR_GAP_STEPS: readonly [{
+    readonly token: 0;
+    readonly px: 0;
+}, {
+    readonly token: 1;
+    readonly px: 4;
+}, {
+    readonly token: 2;
+    readonly px: 8;
+}, {
+    readonly token: 3;
+    readonly px: 12;
+}, {
+    readonly token: 4;
+    readonly px: 16;
+}, {
+    readonly token: 5;
+    readonly px: 20;
+}, {
+    readonly token: 6;
+    readonly px: 24;
+}, {
+    readonly token: 7;
+    readonly px: 28;
+}, {
+    readonly token: 8;
+    readonly px: 32;
+}, {
+    readonly token: 9;
+    readonly px: 36;
+}, {
+    readonly token: 10;
+    readonly px: 40;
+}, {
+    readonly token: 11;
+    readonly px: 44;
+}, {
+    readonly token: 12;
+    readonly px: 48;
+}, {
+    readonly token: 14;
+    readonly px: 56;
+}, {
+    readonly token: 16;
+    readonly px: 64;
+}];
 /**
  * The gap as the editor needs it: the Tailwind class itself, so the consumer
  * can put the model value straight on the element it styles.
  */
-export type EditorGapValue = `gap-${(typeof GAP_STEPS)[number]}`;
+export type EditorGapValue = `gap-${(typeof EDITOR_GAP_STEPS)[number]['token']}`;
 /** Overridable copy of the value readout. Every key is optional. */
 export interface EditorGapMessages {
     /** Unit shown behind the value. Defaults to `'px'`. */

package/dist/components/editor/molecules/EditorHeadingType/EditorHeadingType.vue.d.ts

@@ -1,35 +1,39 @@
 /**
  * The heading levels the editor offers, in the order they are listed. The level
- * is what the option shows -- its label and its `h1`..`h6` icon -- and the size
- * is what the model carries. The sizes are Tailwind's default scale on purpose,
- * not the theme's `heading-*` utilities: this value is data the editor stores
- * and puts back on an element, so it has to be a class every consumer resolves.
+ * is what the option shows -- its label and its `h1`..`h6` icon -- and the
+ * token is what the model carries. The sizes are Tailwind's default scale on
+ * purpose, not the theme's `heading-*` utilities: this value is data the editor
+ * stores and puts back on an element, so it has to be a class every consumer
+ * resolves.
+ *
+ * `token` is the full font-size class, not a suffix: it is stored as is. The
+ * labels are not in here; they arrive through `messages`, keyed by level.
  */
-declare const HEADING_LEVELS: readonly [{
+export declare const EDITOR_HEADING_TYPE_OPTIONS: readonly [{
+    readonly token: "text-4xl";
     readonly level: 1;
-    readonly size: "text-4xl";
 }, {
+    readonly token: "text-3xl";
     readonly level: 2;
-    readonly size: "text-3xl";
 }, {
+    readonly token: "text-2xl";
     readonly level: 3;
-    readonly size: "text-2xl";
 }, {
+    readonly token: "text-xl";
     readonly level: 4;
-    readonly size: "text-xl";
 }, {
+    readonly token: "text-lg";
     readonly level: 5;
-    readonly size: "text-lg";
 }, {
+    readonly token: "text-base";
     readonly level: 6;
-    readonly size: "text-base";
 }];
 /**
  * The heading as the editor needs it: the Tailwind font-size class itself, so
  * the consumer can put the model value straight on the element it styles.
  * Weight is deliberately not part of it -- that becomes a setting of its own.
  */
-export type EditorHeadingTypeValue = (typeof HEADING_LEVELS)[number]['size'];
+export type EditorHeadingTypeValue = (typeof EDITOR_HEADING_TYPE_OPTIONS)[number]['token'];
 /** Overridable copy for the six options. Every key is optional. */
 export interface EditorHeadingTypeMessages {
     /** Label of the `h1` option. Defaults to `'Heading 1'`. */

package/dist/components/editor/molecules/EditorJustifyContent/EditorJustifyContent.vue.d.ts

@@ -1,8 +1,23 @@
+/**
+ * The options the editor offers, in the order they are shown. `token` is the
+ * class without its fixed `justify-` prefix, so the class is `justify-` plus
+ * the token. The labels are not in here; they arrive through `messages`, keyed
+ * by token.
+ */
+export declare const EDITOR_JUSTIFY_CONTENT_OPTIONS: readonly [{
+    readonly token: "start";
+}, {
+    readonly token: "center";
+}, {
+    readonly token: "end";
+}, {
+    readonly token: "between";
+}];
 /**
  * The justification as the editor needs it: the Tailwind class itself, so the
  * consumer can put the model value straight on the element it styles.
  */
-export type EditorJustifyContentValue = 'justify-start' | 'justify-center' | 'justify-end' | 'justify-between';
+export type EditorJustifyContentValue = `justify-${(typeof EDITOR_JUSTIFY_CONTENT_OPTIONS)[number]['token']}`;
 /** Overridable copy for the four options. Every key is optional. */
 export interface EditorJustifyContentMessages {
     /** Accessible name of the `justify-start` option. Defaults to `'Begin'`. */
@@ -35,10 +50,10 @@ declare const __VLS_export: import('vue').DefineComponent<NexxtEditorJustifyCont
     /** The selected justification, as the Tailwind class to apply. */
     modelValue: EditorJustifyContentValue;
 }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:modelValue": (value: EditorJustifyContentValue) => any;
+    "update:modelValue": (value: "justify-center" | "justify-end" | "justify-start" | "justify-between") => any;
 }, string, import('vue').PublicProps, Readonly<NexxtEditorJustifyContentProps & {
     /** The selected justification, as the Tailwind class to apply. */
     modelValue: EditorJustifyContentValue;
 }> & Readonly<{
-    "onUpdate:modelValue"?: ((value: EditorJustifyContentValue) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: "justify-center" | "justify-end" | "justify-start" | "justify-between") => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;

package/dist/components/editor/molecules/EditorPadding/EditorPadding.vue.d.ts

@@ -1,3 +1,109 @@
+/**
+ * The steps a field can land on: every integer `--spacing-*` token the theme
+ * defines, with the px it renders (the spacing scale is built on 0.25rem, so a
+ * step is 4 px). The list thins out as it climbs -- 13 and 15 are absent, and
+ * past 16 it moves in fours and then eights -- so snapping over this list
+ * rather than over the px value keeps the field off classes that have no token
+ * behind them.
+ *
+ * `token` is the numeric part of the class, without a prefix: one padding value
+ * is written with several of them (`p-`, `px-`, `py-`, `pt-`, `pr-`, `pb-`,
+ * `pl-`), so the full class depends on which sides it covers. A value between
+ * two steps snaps to the nearest one, the lower on a tie.
+ */
+export declare const EDITOR_PADDING_STEPS: readonly [{
+    readonly token: 0;
+    readonly px: 0;
+}, {
+    readonly token: 1;
+    readonly px: 4;
+}, {
+    readonly token: 2;
+    readonly px: 8;
+}, {
+    readonly token: 3;
+    readonly px: 12;
+}, {
+    readonly token: 4;
+    readonly px: 16;
+}, {
+    readonly token: 5;
+    readonly px: 20;
+}, {
+    readonly token: 6;
+    readonly px: 24;
+}, {
+    readonly token: 7;
+    readonly px: 28;
+}, {
+    readonly token: 8;
+    readonly px: 32;
+}, {
+    readonly token: 9;
+    readonly px: 36;
+}, {
+    readonly token: 10;
+    readonly px: 40;
+}, {
+    readonly token: 11;
+    readonly px: 44;
+}, {
+    readonly token: 12;
+    readonly px: 48;
+}, {
+    readonly token: 14;
+    readonly px: 56;
+}, {
+    readonly token: 16;
+    readonly px: 64;
+}, {
+    readonly token: 20;
+    readonly px: 80;
+}, {
+    readonly token: 24;
+    readonly px: 96;
+}, {
+    readonly token: 28;
+    readonly px: 112;
+}, {
+    readonly token: 32;
+    readonly px: 128;
+}, {
+    readonly token: 36;
+    readonly px: 144;
+}, {
+    readonly token: 40;
+    readonly px: 160;
+}, {
+    readonly token: 44;
+    readonly px: 176;
+}, {
+    readonly token: 48;
+    readonly px: 192;
+}, {
+    readonly token: 52;
+    readonly px: 208;
+}, {
+    readonly token: 56;
+    readonly px: 224;
+}, {
+    readonly token: 60;
+    readonly px: 240;
+}, {
+    readonly token: 64;
+    readonly px: 256;
+}, {
+    readonly token: 72;
+    readonly px: 288;
+}, {
+    readonly token: 80;
+    readonly px: 320;
+}, {
+    readonly token: 96;
+    readonly px: 384;
+}];
+/** A padding step as the numeric part of the Tailwind class, as in `p-4`. */
+export type EditorPaddingStep = (typeof EDITOR_PADDING_STEPS)[number]['token'];
 /** Overridable copy of the field and toggle names. Every key is optional. */
 export interface EditorPaddingMessages {
     /** Accessible name of the collapsed left/right field. Defaults to `'Horizontaal'`. */

package/dist/components/editor/molecules/EditorTextAlign/EditorTextAlign.vue.d.ts

@@ -1,8 +1,23 @@
+/**
+ * The options the editor offers, in the order they are shown. `token` is the
+ * class without its fixed `text-` prefix, so the class is `text-` plus the
+ * token. The labels are not in here; they arrive through `messages`, keyed by
+ * token.
+ */
+export declare const EDITOR_TEXT_ALIGN_OPTIONS: readonly [{
+    readonly token: "left";
+}, {
+    readonly token: "center";
+}, {
+    readonly token: "right";
+}, {
+    readonly token: "justify";
+}];
 /**
  * The text alignment as the editor needs it: the Tailwind class itself, so the
  * consumer can put the model value straight on the element it styles.
  */
-export type EditorTextAlignValue = 'text-left' | 'text-center' | 'text-right' | 'text-justify';
+export type EditorTextAlignValue = `text-${(typeof EDITOR_TEXT_ALIGN_OPTIONS)[number]['token']}`;
 /** Overridable copy for the four options. Every key is optional. */
 export interface EditorTextAlignMessages {
     /** Accessible name of the `text-left` option. Defaults to `'Links'`. */
@@ -35,10 +50,10 @@ declare const __VLS_export: import('vue').DefineComponent<NexxtEditorTextAlignPr
     /** The selected text alignment, as the Tailwind class to apply. */
     modelValue: EditorTextAlignValue;
 }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:modelValue": (value: EditorTextAlignValue) => any;
+    "update:modelValue": (value: "text-left" | "text-right" | "text-center" | "text-justify") => any;
 }, string, import('vue').PublicProps, Readonly<NexxtEditorTextAlignProps & {
     /** The selected text alignment, as the Tailwind class to apply. */
     modelValue: EditorTextAlignValue;
 }> & Readonly<{
-    "onUpdate:modelValue"?: ((value: EditorTextAlignValue) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: "text-left" | "text-right" | "text-center" | "text-justify") => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;

package/dist/components/molecules/Tree/Tree.vue.d.ts

@@ -6,12 +6,35 @@ export interface NexxtTreeNode {
     icon?: NexxtIconName;
     /** A node with children gets a chevron and can be folded. */
     children?: NexxtTreeNode[];
+    /** Whether this node accepts drops when it currently has no children. */
+    canHaveChildren?: boolean;
+    /** Whether this node can be dragged when the tree's `draggable` prop is enabled. */
+    draggable?: boolean;
+}
+export interface NexxtTreeMove {
+    /** The node being moved. */
+    id: string;
+    /** The node that will contain the moved node, or `null` for the tree root. */
+    parentId: string | null;
+    /** The zero-based position in the target parent's children. */
+    index: number;
 }
 export interface NexxtTreeProps {
     /** The top-level nodes; nest `children` for deeper levels. */
     nodes: NexxtTreeNode[];
     /** Accessible name for the tree, e.g. the heading above it. */
     label: string;
+    /** Enables native drag-and-drop for rows and emits the intended new position. */
+    draggable?: boolean;
+    /**
+     * Decides per spot whether the dragged node may land there, on top of the built-in rules (no
+     * drop into its own subtree, only into nodes that can have children). Gets the same shape as
+     * the `move` payload. A refused spot shows no ghost row and drops nothing, like letting go
+     * outside the tree. It runs on every `dragover` — which the browser keeps firing while the
+     * pointer rests — and on every touch move, so keep it cheap and pure: the same spot must always
+     * get the same answer.
+     */
+    canDrop?: (target: NexxtTreeMove) => boolean;
 }
 export type NexxtTreeSlots = {
     /** Actions at the end of a row, e.g. a delete button. Hidden until the row is hovered or holds focus, and always shown on a coarse pointer. Clicks and keys inside it never reach the tree, so they neither select the row nor move focus. Put `tabindex` on every focusable element in it: it is `0` only on the row that is the tree's tab stop, which keeps one extra Tab stop for the whole tree. Keep the content at most 24px high, or the rows grow. */
@@ -31,9 +54,11 @@ type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
 declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, {
     focusNode: (id: string) => Promise<boolean>;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    move: (move: NexxtTreeMove) => any;
     "update:selected": (value: string | null) => any;
     "update:collapsed": (value: string[]) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onMove?: ((move: NexxtTreeMove) => any) | undefined;
     "onUpdate:selected"?: ((value: string | null) => any) | undefined;
     "onUpdate:collapsed"?: ((value: string[]) => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;

package/dist/components/molecules/Tree/tree-drop.d.ts

@@ -0,0 +1,81 @@
+import { NexxtTreeNode } from './Tree.vue';
+/** A visible row of the tree, in document order. */
+export interface TreeRow {
+    node: NexxtTreeNode;
+    depth: number;
+    parentId: string | null;
+    expandable: boolean;
+    canHaveChildren: boolean;
+    draggable: boolean;
+    expanded: boolean;
+    /** One-based position among its siblings. */
+    position: number;
+    setSize: number;
+}
+export type DropMarker = 'before' | 'inside' | 'after';
+export interface TreeDrop {
+    /** The row the pointer was over when this spot was picked. */
+    rowId: string;
+    parentId: string | null;
+    index: number;
+    marker: DropMarker;
+}
+/**
+ * Where a row sits with the ghost row taken out, relative to the top of the tree. `bottom` takes
+ * in the gap below the row: a gap belongs to the row above it, so moving across it never reads
+ * as leaving the tree.
+ */
+export interface RestSlot {
+    id: string;
+    top: number;
+    height: number;
+    bottom: number;
+}
+export interface DropLayout {
+    slots: RestSlot[];
+    /** The ghost row as it is laid out now, gap included; `null` while there is none. */
+    ghost: {
+        top: number;
+        bottom: number;
+    } | null;
+}
+/** `keep` leaves the current spot as it is: the pointer is on the ghost row, or there are no rows. */
+export type DropHit = {
+    kind: 'keep';
+} | {
+    kind: 'row';
+    id: string;
+    ratio: number;
+};
+export declare const containsNode: (node: NexxtTreeNode, id: string) => boolean;
+export declare const findNode: (nodes: NexxtTreeNode[], id: string) => NexxtTreeNode | null;
+/**
+ * Reads the pointer against where the rows land without the ghost row, not against what is under
+ * it now. The ghost pushes rows aside, so reading what is under the pointer would find a shifted
+ * row or the ghost itself, pick another spot, move the ghost and flicker. Measured this way the
+ * same pointer always gives the same answer, however the ghost moves.
+ *
+ * @param layout - The rows at rest and the ghost row as it is laid out now.
+ * @param y - The pointer, relative to the top of the tree.
+ */
+export declare const hitTest: ({ slots, ghost }: DropLayout, y: number) => DropHit;
+/**
+ * The spot a pointer at `ratio` of `row` stands for. A group splits into before (top 30%),
+ * inside and after (bottom 30%), a leaf into before and after at the middle. Inside always lands
+ * as the first child, right under the group row, so the ghost shows up next to the pointer. The
+ * dragged node and everything inside it are no target at all.
+ */
+export declare const resolveDrop: (row: TreeRow, ratio: number, moving: NexxtTreeNode) => TreeDrop | null;
+/** A spot where the dragged row already is: dropping there changes nothing, so it is no target. */
+export declare const isNoOp: (drop: TreeDrop, source: TreeRow) => boolean;
+/** Two spots are the same when they land the node in the same place, whichever row picked them. */
+export declare const samePlace: (a: TreeDrop | null, b: TreeDrop | null) => boolean;
+/**
+ * Where the ghost row goes among the visible rows, and how deep. Right before the row of the
+ * sibling now at `index`, or after the last visible row inside the parent when `index` is past
+ * its last child. `null` for a spot inside a collapsed group: that group row marks itself.
+ */
+export declare const ghostSlot: (rows: TreeRow[], nodes: NexxtTreeNode[], drop: TreeDrop | null) => {
+    at: number;
+    depth: number;
+} | null;

package/dist/index.d.ts

@@ -8,18 +8,26 @@ export type { NexxtTabItem } from './components/molecules/Tabs/Tabs.vue';
 export type { NexxtPageCardProps, NexxtPageCardSlots, } from './components/molecules/PageCard/PageCard.vue';
 export type { NexxtPageMockupType } from './components/molecules/PageMockup/PageMockup.vue';
 export type { NexxtPickerGroupData, NexxtPickerItemData, } from './components/molecules/PickerList/PickerList.vue';
-export type { NexxtTreeNode, NexxtTreeProps, NexxtTreeSlots, } from './components/molecules/Tree/Tree.vue';
+export type { NexxtTreeMove, NexxtTreeNode, NexxtTreeProps, NexxtTreeSlots, } from './components/molecules/Tree/Tree.vue';
 export type { NexxtPlaceholderGroup, NexxtPlaceholderInputMessages, NexxtPlaceholderInputProps, } from './components/molecules/PlaceholderInput/PlaceholderInput.vue';
+export { EDITOR_ALIGN_ITEMS_OPTIONS } from './components/editor/molecules/EditorAlignItems/EditorAlignItems.vue';
 export type { EditorAlignItemsMessages, EditorAlignItemsValue, } from './components/editor/molecules/EditorAlignItems/EditorAlignItems.vue';
+export { EDITOR_BACKGROUND_SIZE_OPTIONS } from './components/editor/molecules/EditorBackgroundSize/EditorBackgroundSize.vue';
 export type { EditorBackgroundSizeMessages, EditorBackgroundSizeValue, } from './components/editor/molecules/EditorBackgroundSize/EditorBackgroundSize.vue';
+export { EDITOR_FLEX_DIRECTION_OPTIONS } from './components/editor/molecules/EditorFlexDirection/EditorFlexDirection.vue';
 export type { EditorFlexDirectionMessages, EditorFlexDirectionValue, } from './components/editor/molecules/EditorFlexDirection/EditorFlexDirection.vue';
+export { EDITOR_GAP_STEPS } from './components/editor/molecules/EditorGap/EditorGap.vue';
 export type { EditorGapMessages, EditorGapValue, } from './components/editor/molecules/EditorGap/EditorGap.vue';
 export type { EditorColorLiteralValue, EditorColorMessages, EditorColorProperty, EditorColorRole, EditorColorRoleValue, EditorColorThemeRole, EditorColorValue, } from './components/editor/molecules/EditorColor/EditorColor.vue';
+export { EDITOR_BORDER_STEPS } from './components/editor/molecules/EditorBorder/EditorBorder.vue';
 export type { EditorBorderMessages, EditorBorderWidth, } from './components/editor/molecules/EditorBorder/EditorBorder.vue';
+export { EDITOR_HEADING_TYPE_OPTIONS } from './components/editor/molecules/EditorHeadingType/EditorHeadingType.vue';
 export type { EditorHeadingTypeMessages, EditorHeadingTypeValue, } from './components/editor/molecules/EditorHeadingType/EditorHeadingType.vue';
 export { EDITOR_RADIUS_STEPS } from './components/editor/molecules/EditorRadius/EditorRadius.vue';
 export type { EditorRadiusMessages, EditorRadiusValue, } from './components/editor/molecules/EditorRadius/EditorRadius.vue';
+export { EDITOR_TEXT_ALIGN_OPTIONS } from './components/editor/molecules/EditorTextAlign/EditorTextAlign.vue';
 export type { EditorTextAlignMessages, EditorTextAlignValue, } from './components/editor/molecules/EditorTextAlign/EditorTextAlign.vue';
+export { EDITOR_JUSTIFY_CONTENT_OPTIONS } from './components/editor/molecules/EditorJustifyContent/EditorJustifyContent.vue';
 export type { EditorJustifyContentMessages, EditorJustifyContentValue, } from './components/editor/molecules/EditorJustifyContent/EditorJustifyContent.vue';
 export { EDITOR_MAX_WIDTH_STEPS } from './components/editor/molecules/EditorMaxWidth/EditorMaxWidth.vue';
 export type { EditorMaxWidthMessages, EditorMaxWidthValue, } from './components/editor/molecules/EditorMaxWidth/EditorMaxWidth.vue';
@@ -27,7 +35,8 @@ export { EDITOR_LINE_HEIGHT_STEPS } from './components/editor/molecules/EditorLi
 export type { EditorLineHeightMessages, EditorLineHeightValue, } from './components/editor/molecules/EditorLineHeight/EditorLineHeight.vue';
 export { EDITOR_LETTER_SPACING_STEPS } from './components/editor/molecules/EditorLetterSpacing/EditorLetterSpacing.vue';
 export type { EditorLetterSpacingMessages, EditorLetterSpacingValue, } from './components/editor/molecules/EditorLetterSpacing/EditorLetterSpacing.vue';
-export type { EditorPaddingMessages } from './components/editor/molecules/EditorPadding/EditorPadding.vue';
+export { EDITOR_PADDING_STEPS } from './components/editor/molecules/EditorPadding/EditorPadding.vue';
+export type { EditorPaddingMessages, EditorPaddingStep, } from './components/editor/molecules/EditorPadding/EditorPadding.vue';
 export type { NexxtTemplateCardContentFeature, NexxtTemplateCardProps, NexxtTemplateCardSlots, } from './components/molecules/TemplateCard/TemplateCard.vue';
 export { default as NexxtAnimatedNumber } from './components/atoms/AnimatedNumber/AnimatedNumber.vue';
 export { default as NexxtAnnouncement } from './components/molecules/Announcement/Announcement.vue';