Skip to content

Releases: witchcraftjs/layout

v0.3.1

02 Jun 22:41

Choose a tag to compare

0.3.1 (2026-06-02)

v0.3.0

01 Jun 16:19

Choose a tag to compare

0.3.0 (2026-06-01)

⚠️ BREAKING CHANGES

fixed injection keys issue once and for all (264dfa6)

While downstream users should be deduping deps, sometimes it can be complicated
and pnpm's peer deps resolution can cause duplicate packages creating duplicate
symbols.

Refactored exported symbols to use Symbol.for instead so they always grab the
same reference. This is breaking because the key names have been changed to be
prefixed by the package name.

v0.2.1

28 May 04:51

Choose a tag to compare

0.2.1 (2026-05-28)

🐛 Fixes

fixed docked/collapsed types (9d3ac95)

Removed the false value from both. Made LayoutFrame type match the zod type to
avoid errors.

Regarding the removal of false, I think it's just better to just set the
properties to undefined when frames are undocked/uncollasped so as not to have
to add the properties to all frames or have them added on some but not others.

collapsed should never be a 0 value so we can check it like a truthy value if
needed. This was already true, but now it's part of the zod type.

v0.2.0

21 May 12:10

Choose a tag to compare

0.2.0 (2026-05-21)

⭐ New Features

added getEdgeLength helper (3709166)

added frame dragging with swapping/rearrangement/docking + collapsing (c1c7d05)

  • Drag frames onto other frame zones (left, top, right, bottom, center) to swap
    their positions and rearrange frames. Remaining empty space is automatically
    handled (frames will expand into it).
  • Frames can also now be docked and collapsed to the window edges.
  • A drag ghost is teleported to a configurable location (ghostTeleportTo).
  • You can customize the teleport slot (frame-drag-ghost) but be careful putting
    a full frame instance, that's very heavy if it loads stuff, better off
    deepcloning the html and removing any js handlers if they exist.
  • Added getFramesRedistributeInfo for expanding/shrinking many frames at once.
  • Added getFillEmptySpaceInfo for filling a space where a frame was removed by
    expanding other frames into it.
  • Added applyFrameChanges for applying all changes lists returned by get*
    functions. This makes it easier to check a function can be applied and to chain
    them to construct new functions.
  • Added createZoneSideClipPath for creating the css polygon for zones.
  • To actually get the general zone positions and size you can use
    getFrameDragZones, getWindowDragZones.
  • Added getDockBoundaries to help find the inner area of non-docked frames.
  • Added rotateFrames helper (mainly for testing).

made doEdgesOverlap more flexible with inclusive option (f3d0f0f)

🐛 Fixes

fixed isEdgeEqual (8bebf5f)

⚠️ BREAKING CHANGES

large refactor + new frame drag possibilities (3b754fb)

  • New component FrameDragHandle provided as a quick wrapper to wrap any area
    that makes a frame fraggable
  • Renamed export: createSplitDecoEdge → createSplitDecoShapes
  • New getFrameSwapInfo function.
  • Removed closeFrame and closeFrames and changed signatures of get*Info
    function.
    • All actions now follow the new get*Info => applyFrameChanges flow. See
      README.md.
  • usageInstructions have been reworked into textHints,
    usageInstructionsTeleportTo => textHintsTeleportTo
    • The new system allows customizing the text and handling KnownErrors as
      well.
    • LayoutWindow's textHints now looks like { text: string, classes?: string[]
      }[] allowing easier styling.

LayoutWindow.vue:

  • actionHandlers prop replaces additionalDragActions, splitKeyHandler,
    closeKeyHandler - pass your own drag actions set with overriden handlers if you
    need to override them
  • added ghostTeleportTo prop for controlling where the frame drag ghost render
  • Internal drag context is now provided via dragContextInjectionKey for child
    components so any component can trigger drag

LayoutDecos.vue:

  • Shapes now allow specifying attributes to attach to the shapes to make them
    easier to style.
  • Now takes a single shapes array instead of "decos" Decos are now a per action
    specific object, how it looks depends on the action.

useFrames

  • dragStart changed signature here and in components that emitted it - params
    are now e, type, opts instead of (e, { edge, intersection })
  • isDragging is now false | "frame" | "edge" instead of boolean
  • Return new showDragging and frameDragFrameId refs (showDragging has been
    integrated into the refs returned instead of being passed in)

DragActionHandler:

  • defaultOnDragChange is now optional - uses sensible default if not provided
  • cancel() now receives event and state instead of being a no-arg function
  • Exposes shapes ref with all action deco shapes merged
  • actions should now return the new ActionDragChangeResult ({ updateEdges,
    shapes, showDragging }) instead of a boolean

SplitAction / CloseAction:

  • handleEvent and modifyDecos are now optional

createSplitDecoFromDrag:

  • Now accepts optional classes object with splitEdge and splitNewFrame class
    overrides

renamed isPointInFrame to isPointInRect (7c8a853)

replaced globalOptions and setter functions with Settings class instance (3134d0c)

  • Remove globalOptions object and seperate setters in favor of one settings
    instance.
  • The class now stores the original value and *Scaled the scaled version. Only
    the unscaled version can be set and it will set both.
  • The same rules about re-fetching inside functions apply, do not import then
    set a variable to the constant as it will get outdated.

Changes:

  • globalOptions.SCALE => settings.scale
  • globalOptions.maxInt => settings.maxInt
  • setScale(n) => settings.scale = n
  • getMaxInt() => settings.maxInt
  • setSnapPercentage(v: number | Point) => settings.snapPoint = v
  • getSnapPoint() => settings.snapPoint
  • getSnapPoint() => settings.snapPointScaled (scaled version)
  • setMarginPercentage(v: Size | number) => settings.minSize = v
  • getMarginSize() => settings.minSize
  • setCollapseSize(v: Size | number) => settings.collapseSize = v
  • getCollapseSize() => settings.collapseSize
  • setMaxPerpendicularLength(n) => settings.maxPerpendicularLength = n
  • getMaxPerpendicularLength() => settings.maxPerpendicularLength
  • getMaxPerpendicularLength() => settings.maxPerpendicularLengthScaled (scaled version)

v0.1.3

19 Apr 22:30

Choose a tag to compare

0.1.3 (2026-04-19)

🐛 Fixes

small visual fix in demo (7217fb5)

fixed edges not being selectable (1798f07)

class props weren't getting passed down properly

v0.1.2

14 Apr 21:25

Choose a tag to compare

0.1.2 (2026-04-14)

⭐ New Features

better types (0c10e0d)

  • Improved component types.
  • Also, small change, technically breaking, but half of it wasn't even working.
    LayoutWindow now takes edgesProps and frameProps instead of prefixed attributes
    (e.g. edges-class). Also there is no decosProps, they weren't actually passed
    down before anyways.

v0.1.1

17 Dec 16:25

Choose a tag to compare

0.1.1 (2025-12-17)

📖 Documentation

clarified that zFrameId and zWinId contain additional constants (5c8b540)

v0.1.0

07 Dec 22:54

Choose a tag to compare

0.1.0 (2025-12-07)

⚠️ BREAKING CHANGES

refactored *Passthrough to *Loose (0074b54)

v0.0.7

29 Oct 00:05

Choose a tag to compare

0.0.7 (2025-10-29)

🐛 Fixes

fixed type issue (c0a6e1d)

v0.0.6

27 Oct 22:46

Choose a tag to compare

0.0.6 (2025-10-27)

🐛 Fixes

fixed some exported .d.ts files being empty (9cb71d7)