@revolist/ui 4.0.3-rc → 4.0.3

package/distribution-chart/_distribution-chart.scss

@@ -15,7 +15,9 @@
   height: 100%;
 }
 
-.rv-distribution-chart__plot { overflow: visible; }
+.rv-distribution-chart__plot {
+  overflow: visible;
+}
 
 .rv-distribution-chart__series {
   fill: none;
@@ -23,7 +25,8 @@
   stroke-linecap: round;
   stroke-linejoin: round;
   stroke-width: 2.25px;
-  transition: stroke var(--rv-ui-motion-fast, 120ms) var(--rv-ui-motion-ease, cubic-bezier(.2, 0, 0, 1));
+  transition: stroke var(--rv-ui-motion-fast, 120ms)
+    var(--rv-ui-motion-ease, cubic-bezier(0.2, 0, 0, 1));
 }
 
 .rv-distribution-chart__series.is-selected {
@@ -31,13 +34,22 @@
 }
 
 .rv-distribution-chart__area {
-  fill: color-mix(in srgb, var(--rv-distribution-muted, var(--rv-ui-border)) 22%, transparent);
+  fill: color-mix(
+    in srgb,
+    var(--rv-distribution-muted, var(--rv-ui-border)) 22%,
+    transparent
+  );
   stroke: none;
-  transition: fill var(--rv-ui-motion-fast, 120ms) var(--rv-ui-motion-ease, cubic-bezier(.2, 0, 0, 1));
+  transition: fill var(--rv-ui-motion-fast, 120ms)
+    var(--rv-ui-motion-ease, cubic-bezier(0.2, 0, 0, 1));
 }
 
 .rv-distribution-chart__area.is-selected {
-  fill: color-mix(in srgb, var(--rv-distribution-accent, var(--rv-ui-accent)) 22%, transparent);
+  fill: color-mix(
+    in srgb,
+    var(--rv-distribution-accent, var(--rv-ui-accent)) 22%,
+    transparent
+  );
 }
 
 .rv-distribution-chart__data {
@@ -55,7 +67,9 @@
 // A datum's tooltip is contained by its stacking context. Raise the active datum,
 // rather than only the tooltip, so it can paint above later bar siblings.
 .rv-distribution-chart__datum:hover,
-.rv-distribution-chart__datum:focus-visible { z-index: 2; }
+.rv-distribution-chart__datum:focus-visible {
+  z-index: 2;
+}
 
 .rv-distribution-chart__datum.is-bar {
   display: flex;
@@ -76,7 +90,11 @@
   min-height: 3px;
   border-radius: 2px 2px 0 0;
   background: var(--rv-distribution-muted, var(--rv-ui-border));
-  transition: background-color var(--rv-ui-motion-fast, 120ms) var(--rv-ui-motion-ease, cubic-bezier(.2, 0, 0, 1)), opacity var(--rv-ui-motion-fast, 120ms) var(--rv-ui-motion-ease, cubic-bezier(.2, 0, 0, 1));
+  transition:
+    background-color var(--rv-ui-motion-fast, 120ms)
+      var(--rv-ui-motion-ease, cubic-bezier(0.2, 0, 0, 1)),
+    opacity var(--rv-ui-motion-fast, 120ms)
+      var(--rv-ui-motion-ease, cubic-bezier(0.2, 0, 0, 1));
 }
 
 .rv-distribution-chart__datum.is-selected .rv-distribution-chart__bar {
@@ -94,7 +112,11 @@
   border: 2px solid var(--rv-distribution-muted, var(--rv-ui-border));
   border-radius: 50%;
   background: var(--rv-distribution-surface, var(--rv-ui-surface));
-  transition: border-color var(--rv-ui-motion-fast, 120ms) var(--rv-ui-motion-ease, cubic-bezier(.2, 0, 0, 1)), background-color var(--rv-ui-motion-fast, 120ms) var(--rv-ui-motion-ease, cubic-bezier(.2, 0, 0, 1));
+  transition:
+    border-color var(--rv-ui-motion-fast, 120ms)
+      var(--rv-ui-motion-ease, cubic-bezier(0.2, 0, 0, 1)),
+    background-color var(--rv-ui-motion-fast, 120ms)
+      var(--rv-ui-motion-ease, cubic-bezier(0.2, 0, 0, 1));
 }
 
 .rv-distribution-chart__datum.is-selected .rv-distribution-chart__point {
@@ -108,89 +130,103 @@
   outline-offset: 2px;
 }
 
-.rv-distribution-chart__tooltip {
-  position: absolute;
-  z-index: 3;
-  top: 4px;
-  bottom: auto;
-  left: 50%;
-  display: none;
-  width: max-content;
-  max-width: 220px;
-  padding: 7px 9px;
-  transform: translateX(-50%);
-  border: 1px solid var(--rv-distribution-border, var(--rv-ui-border));
-  border-radius: 7px;
-  background: var(--tooltip-bg, var(--rv-ui-text));
-  box-shadow: 0 8px 24px var(--rv-ui-shadow);
-  color: var(--tooltip-color, var(--rv-ui-surface));
-  font: 11px/1.35 system-ui, sans-serif;
-  pointer-events: none;
-  white-space: nowrap;
-}
-
-.rv-distribution-chart__datum.is-point .rv-distribution-chart__tooltip {
-  top: calc(100% + 7px);
-}
-
-.rv-distribution-chart__tooltip strong,
-.rv-distribution-chart__tooltip span { display: block; }
-.rv-distribution-chart__tooltip strong { font-weight: 600; }
-.rv-distribution-chart__tooltip span { opacity: 0.82; }
-
-.rv-distribution-chart__datum:first-child .rv-distribution-chart__tooltip {
-  left: 0;
-  transform: none;
-}
-
-.rv-distribution-chart__datum:last-child .rv-distribution-chart__tooltip {
-  right: 0;
-  left: auto;
-  transform: none;
-}
-
-.rv-distribution-chart__datum:hover .rv-distribution-chart__tooltip,
-.rv-distribution-chart__datum:focus-visible .rv-distribution-chart__tooltip {
-  display: block;
-}
-
 @media (prefers-reduced-motion: reduce) {
-  .rv-distribution-chart__bar { transition: none; }
+  .rv-distribution-chart__bar {
+    transition: none;
+  }
 }
 
-.rv-distribution-chart__region { position: relative; min-width: 0; }
+.rv-distribution-chart__region {
+  position: relative;
+  min-width: 0;
+}
 .rv-distribution-chart__grid {
-  position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: space-between;
+  position: absolute;
+  inset: 0;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
   pointer-events: none;
-  span { border-top: 1px dashed var(--rv-ui-border); }
+  span {
+    border-top: 1px dashed var(--rv-ui-border);
+  }
 }
 .rv-distribution-chart__labels {
-  display: flex; justify-content: space-between; gap: 8px; margin-top: 10px;
-  color: var(--rv-ui-text-muted); font-size: 11px;
-  span { min-width: 0; max-width: 22%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-  &.is-bar span { flex: 1; text-align: center; }
+  display: flex;
+  justify-content: space-between;
+  gap: 8px;
+  margin-top: 10px;
+  color: var(--rv-ui-text-muted);
+  font-size: 11px;
+  span {
+    min-width: 0;
+    max-width: 22%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+  &.is-bar span {
+    flex: 1;
+    text-align: center;
+  }
 }
 .rv-distribution-chart__value {
-  position: absolute; top: 0; left: 50%; transform: translateX(-50%);
-  font-size: 11px; font-variant-numeric: tabular-nums; color: var(--rv-ui-text);
+  position: absolute;
+  top: 0;
+  left: 50%;
+  transform: translateX(-50%);
+  font-size: 11px;
+  font-variant-numeric: tabular-nums;
+  color: var(--rv-ui-text);
+}
+.rv-distribution-chart__datum.is-point .rv-distribution-chart__value {
+  top: -20px;
 }
-.rv-distribution-chart__datum.is-point .rv-distribution-chart__value { top: -20px; }
 .rv-distribution-chart__legend {
-  display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: 16px;
-  font-size: 12px; color: var(--rv-ui-text-muted);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 7px;
+  margin-top: 16px;
+  font-size: 12px;
+  color: var(--rv-ui-text-muted);
+}
+.rv-distribution-chart__legend i {
+  display: block;
+  width: 8px;
+  height: 8px;
+  border-radius: 2px;
+  background: var(--rv-distribution-accent, var(--rv-ui-accent));
 }
-.rv-distribution-chart__legend i,
-.rv-distribution-chart__tooltip i { display: block; width: 8px; height: 8px; border-radius: 2px; background: var(--rv-distribution-accent, var(--rv-ui-accent)); }
 .rv-distribution-chart__tooltip {
-  background: var(--rv-ui-surface); color: var(--rv-ui-text);
-  border-color: var(--rv-ui-border); box-shadow: 0 4px 12px var(--rv-ui-shadow);
-  white-space: normal; overflow-wrap: anywhere;
-  i { float: inline-start; margin-inline-end: 7px; margin-block-start: 3px; }
-  &--line i { width: 3px; height: 22px; }
-  &--dashed i { width: 8px; height: 0; background: transparent; border-top: 2px dashed var(--rv-ui-accent); margin-block-start: 7px; }
+  strong,
+  span {
+    display: block;
+  }
+  i {
+    display: block;
+    float: inline-start;
+    width: 8px;
+    height: 8px;
+    margin-inline-end: 7px;
+    margin-block-start: 3px;
+    border-radius: 2px;
+    background: var(--rv-distribution-accent, var(--rv-ui-accent));
+  }
+  &--line i {
+    width: 3px;
+    height: 22px;
+  }
+  &--dashed i {
+    height: 0;
+    background: transparent;
+    border-top: 2px dashed var(--rv-distribution-accent, var(--rv-ui-accent));
+    margin-block-start: 7px;
+  }
 }
-
 // Numeric/category progression stays left-to-right, including on RTL pages.
 // Keep SVG points, flex bars, labels and arrow-key order on the same axis.
 .rv-distribution-chart__region,
-.rv-distribution-chart__labels { direction: ltr; }
+.rv-distribution-chart__labels {
+  direction: ltr;
+}

package/distribution-chart/area-chart.js

@@ -1,6 +1,6 @@
 import { a as e } from "../_chunks/hooks.module-CG3gN83z.js";
 import { t } from "../_chunks/jsxRuntime.module-F6UFnpT-.js";
-import { i as n, n as r, r as i, t as a } from "../_chunks/chart-frame-Cmc7xU1i.js";
+import { i as n, n as r, r as i, t as a } from "../_chunks/chart-frame-hcOlnQ1K.js";
 //#region src/distribution-chart/area-chart.tsx
 function o(o) {
 	let s = `rv-area-${e().replace(/[^a-zA-Z0-9_-]/g, "")}`, { points: c } = i(o.data), l = o.data.some((e) => e.selected !== void 0), u = c.slice(1).map((e, t) => {

package/distribution-chart/bar-chart.js

@@ -1,5 +1,5 @@
 import { t as e } from "../_chunks/jsxRuntime.module-F6UFnpT-.js";
-import { r as t, t as n } from "../_chunks/chart-frame-Cmc7xU1i.js";
+import { r as t, t as n } from "../_chunks/chart-frame-hcOlnQ1K.js";
 //#region src/distribution-chart/bar-chart.tsx
 function r(r) {
 	let { values: i, max: a } = t(r.data), o = r.data.map((e, t) => typeof r.barColor == "function" ? r.barColor(e, t) : r.barColor);

package/distribution-chart/chart-frame.d.ts

@@ -5,7 +5,7 @@ export interface ChartPoint {
     readonly y: number;
 }
 /** Shared accessibility, focus and tooltip lifecycle for the chart primitives. */
-export declare function ChartFrame({ data, ariaLabel, variant, height, className, showGrid, showLabels, showValues, legend, formatValue, tooltip, tooltipIndicator, renderTooltip, positions, datumColors, renderDatum, children }: StandaloneChartProps & {
+export declare function ChartFrame({ data, ariaLabel, variant, height, className, showGrid, showLabels, showValues, legend, formatValue, tooltip, tooltipIndicator, renderTooltip, positions, datumColors, renderDatum, children, }: StandaloneChartProps & {
     variant: DistributionChartType;
     positions?: readonly ChartPoint[];
     datumColors?: readonly (string | undefined)[];

package/distribution-chart/index.d.ts

@@ -4,5 +4,5 @@ export * from './types';
 export { BarChart, type BarChartProps } from './bar-chart';
 export { LineChart, type LineChartProps } from './line-chart';
 export { AreaChart, type AreaChartProps } from './area-chart';
-/** Compatibility composition; each presentation has its own standalone owner. */
+/** Chart-type composition; each presentation has its own standalone owner. */
 export declare function DistributionChart({ type, ...props }: DistributionChartProps): h.JSX.Element;

package/distribution-chart/line-chart.js

@@ -1,5 +1,5 @@
 import { t as e } from "../_chunks/jsxRuntime.module-F6UFnpT-.js";
-import { i as t, n, r, t as i } from "../_chunks/chart-frame-Cmc7xU1i.js";
+import { i as t, n, r, t as i } from "../_chunks/chart-frame-hcOlnQ1K.js";
 //#region src/distribution-chart/line-chart.tsx
 function a(a) {
 	let { points: o } = r(a.data);

package/dropdown/content.js

@@ -1 +1 @@
-export { f as DropdownContent, p as DropdownPopupContent } from "../_chunks/native-control-C_yok8_-.js";
+export { f as DropdownContent, p as DropdownPopupContent } from "../_chunks/native-control-B_fVA5bL.js";

package/dropdown/control.js

@@ -1 +1 @@
-export { t as createDropdownControl, n as renderDropdownControl } from "../_chunks/control-AHKXD5Eu.js";
+export { t as createDropdownControl, n as renderDropdownControl } from "../_chunks/control-Dcrjsunl.js";

package/dropdown/dropdown.types.d.ts

@@ -1,6 +1,6 @@
 import { JSX } from '../_vendor/preact/src/index';
 import { DropdownDataSource, DropdownRemoteText } from './remote';
-export type { DropdownDataSource, DropdownRemoteText, LookupId, LookupCursor } from './remote';
+export type { DropdownDataSource, DropdownRemoteText, LookupId, LookupCursor, } from './remote';
 export type DropdownRenderable = any;
 export type DropdownVNode = any;
 export type DropdownStyle = string | Record<string, string | number | undefined>;

package/dropdown/editor-dropdown.style.scss

@@ -2,7 +2,6 @@
 @use '../styles/palette';
 @use '../styles/control';
 
-
 // Mixins
 @mixin focus-style {
   outline: none;
@@ -16,11 +15,11 @@
 
 revo-grid,
 .rv-formula-bar,
+.rv-native-controls,
 :root {
   --rv-dropdown-container-tag-background: #{palette.$gray-eeeeee};
   --rv-dropdown-placeholder-color: var(--rv-ui-text-muted);
 
-
   &[theme*='dark'] {
     --rv-dropdown-container-tag-background: #{palette.$gray-2b2b2b};
     --rv-dropdown-placeholder-color: var(--rv-ui-text-muted);
@@ -52,7 +51,8 @@ revo-grid,
     --rv-dropdown-arrow-right: 5px;
     --rv-dropdown-arrow-gap: 4px;
     --rv-dropdown-value-right-space: calc(
-      var(--rv-dropdown-arrow-size) + var(--rv-dropdown-arrow-right) + var(--rv-dropdown-arrow-gap)
+      var(--rv-dropdown-arrow-size) + var(--rv-dropdown-arrow-right) +
+        var(--rv-dropdown-arrow-gap)
     );
 
     @include flex-center;
@@ -90,7 +90,8 @@ revo-grid,
     inset-inline-end: var(--rv-dropdown-arrow-right);
     top: 50%;
     transform: translateY(-50%);
-    transition: transform var(--rv-ui-motion-normal, 160ms) var(--rv-ui-motion-ease, ease-out);
+    transition: transform var(--rv-ui-motion-normal, 160ms)
+      var(--rv-ui-motion-ease, ease-out);
     z-index: 1;
 
     svg {
@@ -150,6 +151,10 @@ revo-grid,
     padding-inline-end: 0;
     font-size: 14px;
 
+    // Custom tag palettes also own the remove glyph's foreground.
+    > button.rv-remove-button {
+      color: inherit;
+    }
   }
 
   .placeholder {
@@ -208,7 +213,8 @@ revo-grid,
   padding: 6px;
   flex-direction: column;
   transform-origin: top left;
-  animation: revoDropdownMenuIn var(--rv-ui-motion-enter, 180ms) var(--rv-ui-motion-ease, ease-out);
+  animation: revoDropdownMenuIn var(--rv-ui-motion-enter, 180ms)
+    var(--rv-ui-motion-ease, ease-out);
 
   .dropdown-listbox {
     display: flex;
@@ -262,7 +268,8 @@ revo-grid,
       user-select: none;
       margin: 1px 0;
       transition:
-        background-color var(--rv-ui-motion-fast, 120ms) var(--rv-ui-motion-ease, ease-out),
+        background-color var(--rv-ui-motion-fast, 120ms)
+          var(--rv-ui-motion-ease, ease-out),
         color var(--rv-ui-motion-fast, 120ms) var(--rv-ui-motion-ease, ease-out);
 
       &[class*='theme-dark'] {
@@ -284,7 +291,6 @@ revo-grid,
         opacity: 0.5;
         cursor: not-allowed;
       }
-
     }
 
     .option-content {
@@ -320,12 +326,16 @@ revo-grid,
     border-radius: var(--rv-control-radius, 8px);
     background: var(--rv-ui-surface-sunken);
     color: var(--rv-ui-text);
-    &:focus-visible { outline: 2px solid var(--rv-ui-accent); outline-offset: 1px; }
+    &:focus-visible {
+      outline: 2px solid var(--rv-ui-accent);
+      outline-offset: 1px;
+    }
   }
 }
 
 // Standalone controls own the padding once; grid editors retain their compact insets.
-.dropdown-container:is(.rv-select, .rv-combobox, .rv-multi-select) .dropdown-trigger {
+.dropdown-container:is(.rv-select, .rv-combobox, .rv-multi-select)
+  .dropdown-trigger {
   --rv-dropdown-arrow-size: 9px;
   --rv-dropdown-arrow-right: 12px;
   padding-inline-end: 32px;

package/dropdown/index.js

@@ -1,3 +1,3 @@
-import { d as e, l as t, p as n, u as r } from "../_chunks/native-control-C_yok8_-.js";
-import { t as i } from "../_chunks/popup-CT2uD3go.js";
+import { d as e, l as t, p as n, u as r } from "../_chunks/native-control-B_fVA5bL.js";
+import { t as i } from "../_chunks/popup-C35Isk7p.js";
 export { t as Dropdown, i as DropdownPopup, n as DropdownPopupContent, r as defineDropdown, e as destroyDropdown };

package/dropdown/lookup-field.d.ts

@@ -21,9 +21,14 @@ export interface LookupFieldOptions extends EditorCommitOptions {
     renderValue?: import('./dropdown.types').DropdownProps<LookupId>['renderValue'];
 }
 export declare function LookupField({ initial, options, context, apply, cancel, }: {
+    /** Initial selected record ID, multiple IDs, or null for an empty selection. */
     initial: LookupId | LookupId[] | null;
+    /** Remote data source, selection mode, validation, text and commit behavior. */
     options: LookupFieldOptions;
+    /** Application context forwarded to the remote data source as dataContext. */
     context: unknown;
+    /** Commits the selected record IDs. Update application state and close the editor. */
     apply: (value: LookupId | LookupId[] | null) => void;
+    /** Closes the editor without applying the current draft. */
     cancel: () => void;
 }): import("../_vendor/preact/src/index").JSX.Element;

package/dropdown/lookup-field.js

@@ -1,6 +1,6 @@
 import { i as e, t } from "../_chunks/hooks.module-CG3gN83z.js";
 import { t as n } from "../_chunks/jsxRuntime.module-F6UFnpT-.js";
-import { l as r } from "../_chunks/native-control-C_yok8_-.js";
+import { l as r } from "../_chunks/native-control-B_fVA5bL.js";
 import { n as i } from "../_chunks/editor-commit-Bq3wSgvr.js";
 import { EditorActions as a } from "../editor-actions.js";
 //#region src/dropdown/lookup-field.tsx
@@ -17,6 +17,7 @@ function o({ initial: o, options: s, context: c, apply: l, cancel: u }) {
 		},
 		children: [
 			/* @__PURE__ */ n(r, {
+				className: "rv-select",
 				source: s.source ?? [],
 				dataSource: s.dataSource,
 				dataContext: c,

package/dropdown/popup.d.ts

@@ -1,4 +1,4 @@
-import { h, ComponentChildren, RefObject } from '../_vendor/preact/src/index';
+import { ComponentChildren, RefObject } from '../_vendor/preact/src/index';
 export type DropdownPopupProps = {
     onPointerRelease?: (event: MouseEvent | TouchEvent) => void;
     triggerRef: RefObject<HTMLDivElement>;
@@ -24,4 +24,4 @@ export type DropdownPopupProps = {
  * @param theme - The theme of the dropdown
  * @param dropdownMenuId - The id of the dropdown menu
  */
-export declare function DropdownPopup({ onPointerRelease, triggerRef, children, portalTarget, theme, dropdownMenuId, popupClassName, closeOnClickOutside, onClose, align, matchTriggerWidth, maxHeight, observePopupResize, topLayer, }: DropdownPopupProps): h.JSX.Element;
+export declare function DropdownPopup({ onPointerRelease, triggerRef, children, portalTarget, theme, dropdownMenuId, popupClassName, closeOnClickOutside, onClose, align, matchTriggerWidth, maxHeight, observePopupResize, topLayer, }: DropdownPopupProps): import('../_vendor/preact/src/index').VNode<any>;

package/dropdown/popup.js

@@ -1 +1 @@
-export { t as DropdownPopup } from "../_chunks/popup-CT2uD3go.js";
+export { t as DropdownPopup } from "../_chunks/popup-C35Isk7p.js";

package/duration/index.js

@@ -1 +1 @@
-export { t as DurationDraft, n as DurationField } from "../_chunks/duration-CL68Em0o.js";
+export { t as DurationDraft, n as DurationField } from "../_chunks/duration-Bf2OS1V5.js";

package/editor-actions.js

@@ -1,6 +1,6 @@
 import { i as e } from "./_chunks/preact.module-BBM36DnO.js";
 import { t } from "./_chunks/jsxRuntime.module-F6UFnpT-.js";
-import { n } from "./_chunks/controls-DsNi8V8I.js";
+import { t as n } from "./_chunks/controls-B_6NJarZ.js";
 //#region src/editor-actions.tsx
 var r = {
 	apply: "Apply",

package/editor-layout/index.d.ts

@@ -5,7 +5,7 @@ type ShellProps = {
 };
 /** Shared editor geometry. Consumers supply column widths and feature policy. */
 export declare function EditorSplitLayout({ children, className }: ShellProps): h.JSX.Element;
-export declare function EditorPane({ children, className, scrollable }: ShellProps & {
+export declare function EditorPane({ children, className, scrollable, }: ShellProps & {
     readonly scrollable?: boolean;
 }): h.JSX.Element;
 export interface EditorListProps extends ShellProps {
@@ -18,7 +18,7 @@ export interface EditorListProps extends ShellProps {
     readonly spacing?: 'default' | 'comfortable';
 }
 /** Single-selection listbox with one keyboard/focus owner across editors. */
-export declare function EditorList({ children, className, label, onSelect, listRef, variant, spacing }: EditorListProps): h.JSX.Element;
+export declare function EditorList({ children, className, label, onSelect, listRef, variant, spacing, }: EditorListProps): h.JSX.Element;
 export type EditorListItemProps = Omit<JSX.IntrinsicElements['button'], 'value' | 'className'> & {
     readonly value: string;
     readonly selected: boolean;
@@ -41,8 +41,8 @@ export interface EditorListItemContentProps {
     };
 }
 /** Reusable row presentation; the enclosing list item owns selection and focus. */
-export declare function EditorListItemContent({ icon, label, description, classNames }: EditorListItemContentProps): h.JSX.Element;
-export declare function EditorListGroup({ label, children, className, labelClassName }: ShellProps & {
+export declare function EditorListItemContent({ icon, label, description, classNames, }: EditorListItemContentProps): h.JSX.Element;
+export declare function EditorListGroup({ label, children, className, labelClassName, }: ShellProps & {
     readonly label: string;
     readonly labelClassName?: string;
 }): h.JSX.Element;

package/editor-layout/index.js

@@ -1,23 +1,28 @@
-import { t as e } from "../_chunks/jsxRuntime.module-F6UFnpT-.js";
+import { o as e } from "../_chunks/hooks.module-CG3gN83z.js";
+import { t } from "../_chunks/jsxRuntime.module-F6UFnpT-.js";
+import { t as n } from "../_chunks/selection-list-tooltips-C5oMJe26.js";
 //#region src/editor-layout/index.tsx
-function t({ children: t, className: n = "" }) {
-	return /* @__PURE__ */ e("div", {
+function r({ children: e, className: n = "" }) {
+	return /* @__PURE__ */ t("div", {
 		class: `rv-editor-split ${n}`,
-		children: t
+		children: e
 	});
 }
-function n({ children: t, className: n = "", scrollable: r = !1 }) {
-	return /* @__PURE__ */ e("section", {
+function i({ children: e, className: n = "", scrollable: r = !1 }) {
+	return /* @__PURE__ */ t("section", {
 		class: `rv-editor-pane${r ? " rv-editor-pane--scrollable" : ""} ${n}`,
-		children: t
+		children: e
 	});
 }
-function r({ children: t, className: n = "", label: r, onSelect: i, listRef: a, variant: o = "default", spacing: s = "default" }) {
-	return /* @__PURE__ */ e("div", {
-		ref: a,
-		class: `rv-editor-list${o === "plain" ? " rv-editor-list--plain" : ""}${s === "comfortable" ? " rv-editor-list--comfortable" : ""} ${n}`,
+function a({ children: r, className: i = "", label: a, onSelect: o, listRef: s, variant: c = "default", spacing: l = "default" }) {
+	let u = n(), d = e((e) => {
+		u(e), typeof s == "function" ? s(e) : s && (s.current = e);
+	}, [u, s]);
+	return /* @__PURE__ */ t("div", {
+		ref: d,
+		class: `rv-editor-list${c === "plain" ? " rv-editor-list--plain" : ""}${l === "comfortable" ? " rv-editor-list--comfortable" : ""} ${i}`,
 		role: "listbox",
-		"aria-label": r,
+		"aria-label": a,
 		onKeyDown: (e) => {
 			if (![
 				"ArrowDown",
@@ -28,57 +33,57 @@ function r({ children: t, className: n = "", label: r, onSelect: i, listRef: a,
 			let t = Array.from(e.currentTarget.querySelectorAll("[data-editor-value]:not(:disabled)"));
 			if (!t.length) return;
 			let n = Math.max(0, t.indexOf(e.target)), r = e.key === "Home" ? 0 : e.key === "End" ? t.length - 1 : (n + (e.key === "ArrowDown" ? 1 : -1) + t.length) % t.length;
-			e.preventDefault(), t[r].focus(), i(t[r].dataset.editorValue);
+			e.preventDefault(), t[r].focus(), o(t[r].dataset.editorValue);
 		},
-		children: t
+		children: r
 	});
 }
-function i({ value: t, selected: n, icon: r, label: i, description: o, contentClassNames: s, children: c, className: l = "", ...u }) {
-	return /* @__PURE__ */ e("button", {
+function o({ value: e, selected: n, icon: r, label: i, description: a, contentClassNames: o, children: c, className: l = "", ...u }) {
+	return /* @__PURE__ */ t("button", {
 		...u,
 		type: "button",
 		role: "option",
-		"data-editor-value": t,
+		"data-editor-value": e,
 		"aria-selected": n,
 		tabIndex: u.tabIndex ?? (n ? 0 : -1),
 		class: `rv-editor-list__item${n ? " rv-editor-list__item--selected" : ""} ${l}`,
-		children: i === void 0 ? c : /* @__PURE__ */ e(a, {
+		children: i === void 0 ? c : /* @__PURE__ */ t(s, {
 			icon: r,
 			label: i,
-			description: o,
-			classNames: s
+			description: a,
+			classNames: o
 		})
 	});
 }
-function a({ icon: t, label: n, description: r, classNames: i = {} }) {
-	return /* @__PURE__ */ e("span", {
-		class: `rv-editor-list__content${t ? "" : " rv-editor-list__content--text"}`,
-		children: [t && /* @__PURE__ */ e("span", {
+function s({ icon: e, label: n, description: r, classNames: i = {} }) {
+	return /* @__PURE__ */ t("span", {
+		class: `rv-editor-list__content${e ? "" : " rv-editor-list__content--text"}`,
+		children: [e && /* @__PURE__ */ t("span", {
 			class: `rv-editor-list__icon ${i.icon ?? ""}`,
 			"aria-hidden": "true",
-			children: t
-		}), /* @__PURE__ */ e("span", {
+			children: e
+		}), /* @__PURE__ */ t("span", {
 			class: `rv-editor-list__copy ${i.copy ?? ""}`,
-			children: [/* @__PURE__ */ e("span", {
+			children: [/* @__PURE__ */ t("span", {
 				class: `rv-editor-list__label ${i.label ?? ""}`,
 				children: n
-			}), r !== void 0 && /* @__PURE__ */ e("span", {
+			}), r !== void 0 && /* @__PURE__ */ t("span", {
 				class: `rv-editor-list__description ${i.description ?? ""}`,
 				children: r
 			})]
 		})]
 	});
 }
-function o({ label: t, children: n, className: r = "", labelClassName: i = "" }) {
-	return /* @__PURE__ */ e("div", {
+function c({ label: e, children: n, className: r = "", labelClassName: i = "" }) {
+	return /* @__PURE__ */ t("div", {
 		class: `rv-editor-list__group ${r}`,
 		role: "group",
-		"aria-label": t,
-		children: [/* @__PURE__ */ e("div", {
+		"aria-label": e,
+		children: [/* @__PURE__ */ t("div", {
 			class: `rv-editor-list__group-label ${i}`,
-			children: t
+			children: e
 		}), n]
 	});
 }
 //#endregion
-export { r as EditorList, o as EditorListGroup, i as EditorListItem, a as EditorListItemContent, n as EditorPane, t as EditorSplitLayout };
+export { a as EditorList, c as EditorListGroup, o as EditorListItem, s as EditorListItemContent, i as EditorPane, r as EditorSplitLayout };