@cratis/components 2.9.1 → 3.1.0

package/dist/cjs/TimeMachine/index.js

@@ -1,15 +0,0 @@
-'use strict';
-
-var TimeMachine = require('./TimeMachine.js');
-var ReadModelView = require('./ReadModelView.js');
-var EventsView = require('./EventsView.js');
-var Properties = require('./Properties.js');
-
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-exports.TimeMachine = TimeMachine.TimeMachine;
-exports.ReadModelView = ReadModelView.ReadModelView;
-exports.EventsView = EventsView.EventsView;
-exports.Properties = Properties.Properties;
-//# sourceMappingURL=index.js.map

package/dist/cjs/TimeMachine/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../../TimeMachine/index.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;AAAA;AACA;;;;;;;"}

package/dist/cjs/TimeMachine/propertiesHelpers.js

@@ -1,16 +0,0 @@
-'use strict';
-
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-/**
- * Converts a camelCase property key to a human-readable Title Case label with spaces.
- */
-function formatPropertyName(key) {
-    return key
-        .replace(/([A-Z])/g, ' $1')
-        .replace(/^./, str => str.toUpperCase())
-        .trim();
-}
-
-exports.formatPropertyName = formatPropertyName;
-//# sourceMappingURL=propertiesHelpers.js.map

package/dist/cjs/TimeMachine/propertiesHelpers.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"propertiesHelpers.js","sources":["../../../TimeMachine/propertiesHelpers.ts"],"sourcesContent":[null],"names":[],"mappings":";;AAAA;AACA;AAEA;;AAEG;AACG,SAAU,kBAAkB,CAAC,GAAW,EAAA;AAC1C,IAAA,OAAO;AACF,SAAA,OAAO,CAAC,UAAU,EAAE,KAAK;SACzB,OAAO,CAAC,IAAI,EAAE,GAAG,IAAI,GAAG,CAAC,WAAW,EAAE;AACtC,SAAA,IAAI,EAAE;AACf;;;;"}

package/dist/cjs/Toolbar/Toolbar.css

@@ -1,357 +0,0 @@
-/* Copyright (c) Cratis. All rights reserved. */
-/* Licensed under the MIT license. See LICENSE file in the project root for full license information. */
-
-/* ── Toolbar container ───────────────────────────────────────────────────── */
-.toolbar {
-    background: var(--cratis-surface-card);
-    border: 1px solid var(--cratis-surface-border);
-    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
-}
-
-/* ── Toolbar button ──────────────────────────────────────────────────────── */
-.toolbar-button {
-    color: var(--cratis-text-color-secondary);
-    background: transparent;
-    border: none;
-    transition: background 0.15s, color 0.15s;
-}
-
-.toolbar-button:hover {
-    background: var(--cratis-surface-100);
-    color: var(--cratis-text-color);
-}
-
-.toolbar-button--active {
-    background: var(--cratis-primary-color);
-    color: var(--cratis-primary-color-text);
-}
-
-.toolbar-button--active:hover {
-    background: var(--cratis-primary-color);
-    color: var(--cratis-primary-color-text);
-}
-
-.toolbar-button--draggable {
-    cursor: grab;
-}
-
-.toolbar-button--draggable:active {
-    cursor: grabbing;
-}
-
-.toolbar-button__text {
-    font-size: 0.875rem;
-    font-weight: 600;
-    line-height: 1;
-    white-space: nowrap;
-}
-
-/* ── Toolbar project name label ──────────────────────────────────────────── */
-.toolbar-project-name {
-    padding: 0 8px;
-    font-size: 0.875rem;
-    font-weight: 500;
-    color: var(--cratis-text-color);
-    white-space: nowrap;
-}
-
-/* ── Toolbar section (context switching) ────────────────────────────────── */
-
-/*
- * The section is a fixed-size container that transitions smoothly between
- * the dimensions required by each context.
- * Overflow stays visible in the settled state so absolutely-positioned
- * children (e.g. fan-out panels) can extend beyond the section's bounds.
- * During a context resize transition, a temporary modifier clips incoming
- * content so buttons do not float outside the current toolbar bounds.
- */
-.toolbar-section {
-    position: relative;
-    transition:
-        width 0.35s cubic-bezier(0.4, 0, 0.2, 1),
-        height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
-}
-
-.toolbar-section--transitioning {
-    overflow: hidden;
-}
-
-/*
- * Every context is absolutely stacked at the top-left of the section.
- * Only the active one is visible; the others fade out and lose pointer events.
- */
-.toolbar-context {
-    position: absolute;
-    top: 0;
-    left: 0;
-    transition: opacity 0.2s ease;
-}
-
-.toolbar-context--active {
-    opacity: 1;
-    pointer-events: auto;
-}
-
-.toolbar-context--inactive {
-    opacity: 0;
-    pointer-events: none;
-}
-
-/* ── Toolbar separator ───────────────────────────────────────────────────── */
-
-.toolbar-separator {
-    background: var(--cratis-surface-border);
-    flex-shrink: 0;
-    align-self: stretch;
-}
-
-/* Separator inside a vertical toolbar — renders as a horizontal rule */
-.toolbar-separator--in-vertical {
-    height: 1px;
-    margin: 0.125rem 0.25rem;
-}
-
-/* Separator inside a horizontal toolbar — renders as a vertical rule */
-.toolbar-separator--in-horizontal {
-    width: 1px;
-    margin: 0.25rem 0.125rem;
-}
-
-/* ── Toolbar fan-out item ────────────────────────────────────────────────── */
-
-/*
- * The wrapper provides the positioning context for the absolutely-placed panel.
- */
-.toolbar-fanout-item {
-    position: relative;
-}
-
-/*
- * The fan-out panel is a floating pill that mirrors the Toolbar container style.
- * When collapsed, it's hidden. When expanded, it appears elevated at the same
- * position as the trigger button, with the trigger button as the first item.
- * Vertically centered with where the collapsed button would be.
- */
-.toolbar-fanout-panel {
-    position: absolute;
-    top: 50%;
-    left: calc(-0.5rem - 1px);
-    transform: translateY(-50%);
-    display: inline-flex;
-    flex-direction: row;
-    align-items: center;
-    gap: 0.25rem;
-    padding: 0.5rem;
-    background: var(--cratis-surface-card);
-    border: 1px solid var(--cratis-surface-border);
-    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
-    border-radius: 1rem;
-    white-space: nowrap;
-    z-index: 10;
-    pointer-events: none;
-    opacity: 0;
-    clip-path: inset(0 100% 0 0 round 1rem);
-    transition:
-        clip-path 0.35s cubic-bezier(0.4, 0, 0.2, 1),
-        opacity 0.2s ease;
-}
-
-/* Panel fans out to the left — reveal animates right → left */
-.toolbar-fanout-panel--left {
-    left: auto;
-    right: calc(-0.5rem - 1px);
-    clip-path: inset(0 0 0 100% round 1rem);
-}
-
-.toolbar-fanout-panel--up {
-    top: auto;
-    right: auto;
-    bottom: calc(100% + 0.5rem);
-    left: 50%;
-    transform: translateX(-50%);
-    clip-path: inset(100% 0 0 0 round 1rem);
-}
-
-.toolbar-fanout-panel--down {
-    top: calc(100% + 0.5rem);
-    right: auto;
-    left: 50%;
-    transform: translateX(-50%);
-    clip-path: inset(0 0 100% 0 round 1rem);
-}
-
-/* Expanded state — fully visible, pointer events restored */
-.toolbar-fanout-panel--visible {
-    clip-path: inset(0 0 0 0 round 1rem);
-    opacity: 1;
-    pointer-events: auto;
-}
-
-/*
- * Reveal complete. The clip-path did its job — the wipe cannot run without it,
- * because `clip-path: none` is a discrete value that snaps instead of
- * interpolating. But clip-path also clips every descendant, so leaving a zero
- * inset in place slices off the hover tooltips of the outermost buttons, which
- * paint outside the panel by design.
- *
- * ToolbarFanOutItem therefore adds this class once the reveal transition ends,
- * and takes it off again (restoring an interpolable inset) before the close
- * transition starts — so both wipes keep their exact timing and a settled panel
- * clips nothing.
- */
-.toolbar-fanout-panel--settled {
-    clip-path: none;
-}
-
-/* ── Toolbar folder ──────────────────────────────────────────────────────── */
-
-.toolbar-folder-item {
-    position: relative;
-}
-
-/*
- * Folder panel is a floating grid that grows naturally with item count.
- * The trigger stays in place while the panel animates in/out.
- */
-.toolbar-folder-panel {
-    position: absolute;
-    top: 50%;
-    left: calc(100% + 0.75rem);
-    transform: translateY(-50%) scale(0.92);
-    transform-origin: left center;
-    display: grid;
-    grid-auto-rows: minmax(2.5rem, auto);
-    gap: 0.25rem;
-    padding: 0.5rem;
-    background: var(--cratis-surface-card);
-    border: 1px solid var(--cratis-surface-border);
-    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
-    border-radius: 1rem;
-    z-index: 10;
-    pointer-events: none;
-    opacity: 0;
-    clip-path: inset(0 100% 0 0 round 1rem);
-    transition:
-        clip-path 0.35s cubic-bezier(0.4, 0, 0.2, 1),
-        transform 0.35s cubic-bezier(0.4, 0, 0.2, 1),
-        opacity 0.2s ease;
-}
-
-.toolbar-folder-panel--left {
-    left: auto;
-    right: calc(100% + 0.75rem);
-    transform-origin: right center;
-    clip-path: inset(0 0 0 100% round 1rem);
-}
-
-.toolbar-folder-panel--visible {
-    clip-path: none;
-    transform: translateY(-50%) scale(1);
-    opacity: 1;
-    pointer-events: auto;
-}
-
-/* List-mode folder panel — vertical stack instead of a grid */
-.toolbar-folder-panel--list {
-    display: flex;
-    flex-direction: column;
-    min-width: 10rem;
-}
-
-/* ── Toolbar button — list mode ──────────────────────────────────────────── */
-
-/*
- * Inside a list-mode folder the button fills the available width and renders
- * its icon and title label side by side, left-aligned.
- */
-.toolbar-button--list {
-    width: 100%;
-    justify-content: flex-start;
-}
-
-.toolbar-button__label {
-    font-size: 0.875rem;
-    font-weight: 500;
-    color: inherit;
-    white-space: nowrap;
-}
-
-/* ── Toolbar group ───────────────────────────────────────────────────────── */
-
-/*
- * When a Toolbar contains ToolbarGroup children it becomes a transparent
- * layout wrapper — each group renders as its own pill.
- */
-.toolbar:has(.toolbar-group) {
-    background: transparent;
-    border: none;
-    box-shadow: none;
-    padding: 0;
-    gap: 0.5rem;
-}
-
-/*
- * Each ToolbarGroup is a self-contained pill that matches the visual style
- * of a standalone Toolbar.
- */
-.toolbar-group {
-    background: var(--cratis-surface-card);
-    border: 1px solid var(--cratis-surface-border);
-    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
-}
-
-
-/* ── Toolbar slot transition (ToolbarGroup slot content) ─────────────────── */
-
-/*
- * Size-morphing container for slot content inside a ToolbarGroup or ToolbarLayout.
- * Mirrors the .toolbar-section transition parameters for visual consistency —
- * the container resizes smoothly while content cross-fades.
- * Overflow stays visible in the settled state so absolutely-positioned children
- * (fan-out and folder panels, and the hover tooltips inside them) can escape the
- * section's bounds; it is only clipped while outgoing content is fading out, so
- * that content does not bleed past the container mid-transition.
- */
-.toolbar-slot-section {
-    position: relative;
-    transition:
-        width 0.35s cubic-bezier(0.4, 0, 0.2, 1),
-        height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
-}
-
-.toolbar-slot-section--transitioning {
-    overflow: hidden;
-}
-
-@keyframes toolbar-slot-fade-in {
-    from { opacity: 0; }
-    to   { opacity: 1; }
-}
-
-@keyframes toolbar-slot-fade-out {
-    from { opacity: 1; }
-    to   { opacity: 0; }
-}
-
-/*
- * Incoming slot content — fades in on mount.
- * Duration matches the toolbar-context opacity transition (0.2s ease).
- */
-.toolbar-slot-incoming {
-    position: absolute;
-    top: 0;
-    left: 0;
-    animation: toolbar-slot-fade-in 0.2s ease forwards;
-}
-
-/*
- * Outgoing slot content — fades out, then React unmounts it after
- * the animation completes.
- */
-.toolbar-slot-outgoing {
-    position: absolute;
-    top: 0;
-    left: 0;
-    animation: toolbar-slot-fade-out 0.2s ease forwards;
-    pointer-events: none;
-}

package/dist/cjs/Toolbar/Toolbar.js

@@ -1,15 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var ToolbarDragContext = require('./ToolbarDragContext.js');
-require('./Toolbar.css');
-
-/**
- * A toolbar container that groups icon buttons with a rounded border,
- * mimicking the style of tools panels found in canvas-based applications.
- * Supports both vertical (default) and horizontal orientations.
- */
-const Toolbar = ({ children, orientation = 'vertical', draggable = false, onItemDragStart }) => (jsxRuntime.jsx(ToolbarDragContext.ToolbarDragContext.Provider, { value: { draggable, onItemDragStart }, children: jsxRuntime.jsx("div", { className: `toolbar inline-flex ${orientation === 'horizontal' ? 'flex-row' : 'flex-col'} items-center gap-1 p-2 rounded-2xl`, children: children }) }));
-
-exports.Toolbar = Toolbar;
-//# sourceMappingURL=Toolbar.js.map

package/dist/cjs/Toolbar/Toolbar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Toolbar.js","sources":["../../../Toolbar/Toolbar.tsx"],"sourcesContent":[null],"names":["_jsx","ToolbarDragContext"],"mappings":";;;;;;AA0BA;;;;AAIG;AACI,MAAM,OAAO,GAAG,CAAC,EAAE,QAAQ,EAAE,WAAW,GAAG,UAAU,EAAE,SAAS,GAAG,KAAK,EAAE,eAAe,EAAgB,MAC5GA,cAAA,CAACC,qCAAkB,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAE,EAAE,SAAS,EAAE,eAAe,EAAE,EAAA,QAAA,EAC9DD,cAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAE,CAAA,oBAAA,EACP,WAAW,KAAK,YAAY,GAAG,UAAU,GAAG,UAChD,CAAA,mCAAA,CAAqC,EAAA,QAAA,EAEpC,QAAQ,EAAA,CACP,EAAA,CACoB;;;;"}

package/dist/cjs/Toolbar/ToolbarButton.js

@@ -1,42 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var Icon = require('../Common/Icon.js');
-var Tooltip = require('../Common/Tooltip.js');
-var ToolbarDragContext = require('./ToolbarDragContext.js');
-var ToolbarFolderContext = require('./ToolbarFolderContext.js');
-
-/**
- * An icon button with a tooltip, intended to be placed inside a {@link Toolbar}.
- * Uses the shared {@link Tooltip} component for consistent hover labels.
- */
-const ToolbarButton = ({ icon, text, title, active = false, onClick, tooltipPosition = 'right', draggable, data, onDragStart }) => {
-    const dragContext = ToolbarDragContext.useToolbarDragContext();
-    const folderMode = ToolbarFolderContext.useToolbarFolderMode();
-    const isListMode = folderMode === 'list';
-    const isDraggable = draggable ?? dragContext.draggable;
-    const handleDragStart = (event) => {
-        event.dataTransfer.setData('application/json', JSON.stringify(data ?? null));
-        event.dataTransfer.effectAllowed = 'copy';
-        onDragStart?.(data, event);
-        dragContext.onItemDragStart?.(data, event);
-    };
-    const activeClass = active ? 'toolbar-button--active' : '';
-    const draggableClass = isDraggable ? 'toolbar-button--draggable' : '';
-    const hasText = typeof text === 'string' && text.length > 0;
-    const resolvedIcon = icon !== undefined && icon !== null && (typeof icon !== 'string' || icon.length > 0) ? icon : null;
-    // List mode: icon + title label rendered side by side (no floating tooltip needed).
-    if (isListMode) {
-        return (jsxRuntime.jsxs("button", { type: 'button', "aria-label": title, onClick: onClick, draggable: isDraggable, onDragStart: isDraggable ? handleDragStart : undefined, className: `toolbar-button toolbar-button--list h-10 px-3 w-full flex items-center justify-start gap-2 rounded-lg cursor-pointer ${activeClass} ${draggableClass}`, children: [resolvedIcon !== null && jsxRuntime.jsx(Icon.IconDisplay, { icon: resolvedIcon, className: 'text-lg flex-shrink-0' }), jsxRuntime.jsx("span", { className: 'toolbar-button__label', children: title })] }));
-    }
-    const buttonSizeClass = hasText ? 'h-10 px-3 min-w-[4rem]' : 'w-10 h-10';
-    const buttonContent = hasText
-        ? jsxRuntime.jsx("span", { className: 'toolbar-button__text', children: text })
-        : resolvedIcon !== null
-            ? jsxRuntime.jsx(Icon.IconDisplay, { icon: resolvedIcon, className: 'text-lg' })
-            : null;
-    return (jsxRuntime.jsx(Tooltip.Tooltip, { content: title, position: tooltipPosition, children: jsxRuntime.jsx("button", { type: 'button', "aria-label": title, onClick: onClick, draggable: isDraggable, onDragStart: isDraggable ? handleDragStart : undefined, className: `toolbar-button ${buttonSizeClass} flex items-center justify-center rounded-lg cursor-pointer ${activeClass} ${draggableClass}`, children: buttonContent }) }));
-};
-
-exports.ToolbarButton = ToolbarButton;
-//# sourceMappingURL=ToolbarButton.js.map

package/dist/cjs/Toolbar/ToolbarButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ToolbarButton.js","sources":["../../../Toolbar/ToolbarButton.tsx"],"sourcesContent":[null],"names":["useToolbarDragContext","useToolbarFolderMode","_jsxs","_jsx","IconDisplay","Tooltip"],"mappings":"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"}

package/dist/cjs/Toolbar/ToolbarContext.js

@@ -1,14 +0,0 @@
-'use strict';
-
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-/**
- * Defines a named context (a set of toolbar items) within a {@link ToolbarSection}.
- * The section renders only the active context at a time and animates between them.
- *
- * This is a data-only component; its rendering is fully managed by {@link ToolbarSection}.
- */
-const ToolbarContext = () => null;
-
-exports.ToolbarContext = ToolbarContext;
-//# sourceMappingURL=ToolbarContext.js.map

package/dist/cjs/Toolbar/ToolbarContext.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ToolbarContext.js","sources":["../../../Toolbar/ToolbarContext.tsx"],"sourcesContent":[null],"names":[],"mappings":";;AAAA;AACA;AAoBA;;;;;AAKG;MACU,cAAc,GAA4B,MAAM;;;;"}

package/dist/cjs/Toolbar/ToolbarDragContext.js

@@ -1,24 +0,0 @@
-'use strict';
-
-var React = require('react');
-
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-/**
- * React context that propagates drag-and-drop settings from a {@link Toolbar}
- * down to its child {@link ToolbarButton} components without requiring explicit prop
- * threading through intermediate wrappers such as {@link ToolbarSection}.
- */
-const ToolbarDragContext = React.createContext({
-    draggable: false,
-});
-/**
- * Returns the nearest {@link ToolbarDragContext} value.
- * When no provider is present (i.e. the button is used outside a Toolbar),
- * the default value with {@link ToolbarDragContextValue.draggable} set to `false` is returned.
- */
-const useToolbarDragContext = () => React.useContext(ToolbarDragContext);
-
-exports.ToolbarDragContext = ToolbarDragContext;
-exports.useToolbarDragContext = useToolbarDragContext;
-//# sourceMappingURL=ToolbarDragContext.js.map

package/dist/cjs/Toolbar/ToolbarDragContext.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ToolbarDragContext.js","sources":["../../../Toolbar/ToolbarDragContext.ts"],"sourcesContent":[null],"names":["createContext","useContext"],"mappings":";;;;AAAA;AACA;AAeA;;;;AAIG;AACI,MAAM,kBAAkB,GAAGA,mBAAa,CAA0B;AACrE,IAAA,SAAS,EAAE,KAAK;AACnB,CAAA;AAED;;;;AAIG;AACI,MAAM,qBAAqB,GAAG,MAA+BC,gBAAU,CAAC,kBAAkB;;;;;"}

package/dist/cjs/Toolbar/ToolbarFanOutItem.js

@@ -1,75 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
-var Icon = require('../Common/Icon.js');
-var Tooltip = require('../Common/Tooltip.js');
-
-/**
- * A toolbar button that fans out a horizontal panel of sub-tool buttons when clicked.
- *
- * Place this inside a vertical {@link Toolbar}. When the button is clicked, a pill-shaped
- * panel slides out to the side (right by default) containing the provided children.
- * The panel animates in/out using a clip-path reveal transition.
- *
- * - Clicking the button again closes the panel
- * - Clicking anywhere outside the panel also closes it
- */
-const ToolbarFanOutItem = ({ icon, tooltip, tooltipPosition = 'right', fanOutDirection = 'right', children, }) => {
-    const [isExpanded, setIsExpanded] = React.useState(false);
-    const [isSettled, setIsSettled] = React.useState(false);
-    const containerRef = React.useRef(null);
-    const panelRef = React.useRef(null);
-    // A settled panel has `clip-path: none`, which cannot interpolate — closing
-    // straight from it would snap the panel shut instead of wiping it closed.
-    // Put an equivalent inset back and let the browser observe it (the forced
-    // reflow) before React removes the visible class, so the close transition
-    // has an interpolable starting value.
-    const collapse = React.useCallback(() => {
-        const panel = panelRef.current;
-        if (panel && panel.classList.contains('toolbar-fanout-panel--settled')) {
-            panel.style.setProperty('clip-path', 'inset(0 0 0 0 round 1rem)');
-            panel.style.setProperty('transition', 'none');
-            void panel.offsetWidth;
-            panel.style.removeProperty('transition');
-            panel.style.removeProperty('clip-path');
-        }
-        setIsSettled(false);
-        setIsExpanded(false);
-    }, []);
-    const handleToggle = () => {
-        if (isExpanded) {
-            collapse();
-        }
-        else {
-            setIsExpanded(true);
-        }
-    };
-    const handleTransitionEnd = (event) => {
-        if (event.target === panelRef.current && event.propertyName === 'clip-path' && isExpanded) {
-            setIsSettled(true);
-        }
-    };
-    // Close the fan-out when clicking outside
-    React.useEffect(() => {
-        if (!isExpanded)
-            return;
-        const handleClickOutside = (event) => {
-            if (containerRef.current && !containerRef.current.contains(event.target)) {
-                collapse();
-            }
-        };
-        document.addEventListener('mousedown', handleClickOutside);
-        return () => {
-            document.removeEventListener('mousedown', handleClickOutside);
-        };
-    }, [isExpanded, collapse]);
-    const activeClass = isExpanded ? 'toolbar-button--active' : '';
-    const panelVisibleClass = isExpanded ? 'toolbar-fanout-panel--visible' : '';
-    const panelSettledClass = isExpanded && isSettled ? 'toolbar-fanout-panel--settled' : '';
-    const directionClass = `toolbar-fanout-panel--${fanOutDirection}`;
-    return (jsxRuntime.jsxs("div", { className: 'toolbar-fanout-item', ref: containerRef, children: [jsxRuntime.jsx(Tooltip.Tooltip, { content: tooltip, position: tooltipPosition, disabled: isExpanded, children: jsxRuntime.jsx("button", { type: 'button', "aria-label": tooltip, "aria-expanded": isExpanded, onClick: handleToggle, className: `toolbar-button w-10 h-10 flex items-center justify-center rounded-lg cursor-pointer ${activeClass}`, children: jsxRuntime.jsx(Icon.IconDisplay, { icon: icon, className: 'text-lg' }) }) }), jsxRuntime.jsx("div", { ref: panelRef, className: `toolbar-fanout-panel ${directionClass} ${panelVisibleClass} ${panelSettledClass}`, onTransitionEnd: handleTransitionEnd, children: children })] }));
-};
-
-exports.ToolbarFanOutItem = ToolbarFanOutItem;
-//# sourceMappingURL=ToolbarFanOutItem.js.map

package/dist/cjs/Toolbar/ToolbarFanOutItem.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ToolbarFanOutItem.js","sources":["../../../Toolbar/ToolbarFanOutItem.tsx"],"sourcesContent":[null],"names":["useState","useRef","useCallback","useEffect","_jsxs","_jsx","Tooltip","IconDisplay"],"mappings":"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"}

package/dist/cjs/Toolbar/ToolbarFolder.js

@@ -1,55 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
-var Icon = require('../Common/Icon.js');
-var Tooltip = require('../Common/Tooltip.js');
-var ToolbarFolderContext = require('./ToolbarFolderContext.js');
-
-/**
- * A toolbar folder that reveals a panel of buttons when clicked.
- *
- * **Grid mode** (default): items are arranged in a balanced grid that grows naturally as
- * more items are added and keeps a compact footprint for small sets.
- *
- * **List mode**: items are stacked vertically with their icon and title label rendered
- * side by side — useful when labels add important context to icon-only buttons.
- */
-const ToolbarFolder = ({ icon, title, tooltipPosition = 'right', folderDirection = 'right', mode = 'grid', maxColumns = 5, children, }) => {
-    const [isExpanded, setIsExpanded] = React.useState(false);
-    const containerRef = React.useRef(null);
-    const items = React.useMemo(() => React.Children.toArray(children).filter(child => child !== null && child !== undefined), [children]);
-    const itemCount = Math.max(1, items.length);
-    const columns = React.useMemo(() => {
-        const upperBound = Math.max(1, maxColumns);
-        const balancedColumns = Math.ceil(Math.sqrt(itemCount));
-        return Math.min(upperBound, balancedColumns);
-    }, [itemCount, maxColumns]);
-    const toggleExpanded = () => {
-        setIsExpanded(current => !current);
-    };
-    React.useEffect(() => {
-        if (!isExpanded) {
-            return;
-        }
-        const handleClickOutside = (event) => {
-            if (containerRef.current && !containerRef.current.contains(event.target)) {
-                setIsExpanded(false);
-            }
-        };
-        document.addEventListener('mousedown', handleClickOutside);
-        return () => {
-            document.removeEventListener('mousedown', handleClickOutside);
-        };
-    }, [isExpanded]);
-    const activeClass = isExpanded ? 'toolbar-button--active' : '';
-    const panelVisibleClass = isExpanded ? 'toolbar-folder-panel--visible' : '';
-    const directionClass = `toolbar-folder-panel--${folderDirection}`;
-    const modeClass = mode === 'list' ? 'toolbar-folder-panel--list' : '';
-    return (jsxRuntime.jsx(ToolbarFolderContext.ToolbarFolderContext.Provider, { value: mode, children: jsxRuntime.jsxs("div", { className: 'toolbar-folder-item', ref: containerRef, children: [jsxRuntime.jsx(Tooltip.Tooltip, { content: title, position: tooltipPosition, disabled: isExpanded, children: jsxRuntime.jsx("button", { type: 'button', "aria-label": title, "aria-expanded": isExpanded, onClick: toggleExpanded, className: `toolbar-button w-10 h-10 flex items-center justify-center rounded-lg cursor-pointer ${activeClass}`, children: jsxRuntime.jsx(Icon.IconDisplay, { icon: icon, className: 'text-lg' }) }) }), jsxRuntime.jsx("div", { className: `toolbar-folder-panel ${directionClass} ${panelVisibleClass} ${modeClass}`, style: mode === 'grid' ? {
-                        gridTemplateColumns: `repeat(${columns}, minmax(2.5rem, 2.5rem))`,
-                    } : undefined, children: items })] }) }));
-};
-
-exports.ToolbarFolder = ToolbarFolder;
-//# sourceMappingURL=ToolbarFolder.js.map

package/dist/cjs/Toolbar/ToolbarFolder.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ToolbarFolder.js","sources":["../../../Toolbar/ToolbarFolder.tsx"],"sourcesContent":[null],"names":["useState","useRef","useMemo","Children","useEffect","_jsx","ToolbarFolderContext","_jsxs","Tooltip","IconDisplay"],"mappings":"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"}