@revolist/ui 4.0.6-rc → 4.0.9

package/styles.scss

@@ -21,13 +21,10 @@
 @use './styles/editor-slider';
 @use './styles/editor-counter';
 
-
-
 @use './progress/circular';
 @use './styles/rating.css';
 @use './styles/pagination.css';
 
-
 @use './distribution-chart/distribution-chart';
 @use './brush-range/brush-range';
 @use './styles/filter-controls';
@@ -40,6 +37,7 @@
 @use './styles/activity-message';
 @use './styles/motion';
 
+@use './view-switcher';
 
 @include slider.styles;
 

package/surfaces.d.ts

@@ -15,7 +15,7 @@ export declare class DialogController {
     close(root?: HTMLElement): void;
     destroy(): void;
 }
-export { PopoverController, TooltipController, createTooltipElement, type PopoverOptions } from './core/popover-controller';
+export { PopoverController, TooltipController, createTooltipElement, type PopoverOptions, } from './core/popover-controller';
 /** Keyboard behavior for menu surfaces; activation stays on native buttons. */
 export declare function attachMenuKeyboard(menu: HTMLElement, onClose?: () => void, options?: {
     closeOnEscape?: boolean;
@@ -26,11 +26,13 @@ export interface ResizeOptions {
     max?: number;
     step?: number;
     label: string;
+    /** Rejects a proposed width without changing the handle's current value. */
+    acceptValue?: (value: number) => boolean;
     onChange: (value: number) => void;
     direction?: 'ltr' | 'rtl';
 }
 /** Width resize controller. An options reader keeps controlled updates from interrupting a drag. */
 export declare function attachResizeHandle(handle: HTMLElement, options: ResizeOptions | (() => ResizeOptions)): () => void;
 export { useTooltip, ControlTooltip } from './core/tooltip';
-export { prepareTooltipSurface, ensureTooltipStyles } from './core/tooltip-surface';
+export { prepareTooltipSurface, ensureTooltipStyles, } from './core/tooltip-surface';
 export { TooltipText } from './core/tooltip-text';

package/surfaces.js

@@ -1,12 +1,12 @@
 import { releasePreactElement as e } from "./preact-mount.js";
-import { c as t, s as n } from "./_chunks/top-layer-popup-CNSDdfJV.js";
+import { c as t, s as n } from "./_chunks/top-layer-popup-BHajfliG.js";
 import { inheritUiMotion as r } from "./core/motion.js";
-import { n as i, r as a, t as o } from "./_chunks/popover-controller-D-AvKQ7B.js";
-import { r as s, t as c } from "./_chunks/tooltip-D4xkio5G.js";
+import { PopoverController as i, TooltipController as a, createTooltipElement as o } from "./core/popover-controller.js";
+import { r as s, t as c } from "./_chunks/tooltip-B5ziciEP.js";
 import { createDialogElements as l, getDialogFocusableElements as u, trapDialogFocus as d } from "./dialog/dialog.dom.js";
 import { attachDialogDrag as f } from "./dialog/dialog.drag.js";
-import { t as p } from "./_chunks/tooltip-text-BXsUEmBH.js";
-//#region src/surfaces.tsx
+import { t as p } from "./_chunks/tooltip-text-CH_c2J-J.js";
+//#region package/surfaces.tsx
 var m = /* @__PURE__ */ new WeakMap(), h = class {
 	document;
 	environment;
@@ -70,8 +70,8 @@ function _(e, t) {
 		let e = n();
 		return e.value !== i && (i = e.value, r = e.value), e;
 	}, o = () => {}, s = (t) => {
-		let n = a();
-		r = Math.min(n.max ?? Infinity, Math.max(n.min ?? 0, t)), e.setAttribute("aria-valuenow", String(r)), n.onChange(r);
+		let n = a(), i = Math.min(n.max ?? Infinity, Math.max(n.min ?? 0, t));
+		n.acceptValue?.(i) !== !1 && (r = i, e.setAttribute("aria-valuenow", String(r)), n.onChange(r));
 	}, c = n();
 	e.setAttribute("role", "separator"), e.setAttribute("aria-orientation", "vertical"), e.setAttribute("aria-label", c.label), e.tabIndex = 0, e.setAttribute("aria-valuenow", String(r)), c.min !== void 0 && e.setAttribute("aria-valuemin", String(c.min)), c.max !== void 0 && e.setAttribute("aria-valuemax", String(c.max));
 	let l = (e) => {
@@ -98,4 +98,4 @@ function _(e, t) {
 	};
 }
 //#endregion
-export { c as ControlTooltip, h as DialogController, o as PopoverController, i as TooltipController, p as TooltipText, g as attachMenuKeyboard, _ as attachResizeHandle, a as createTooltipElement, n as ensureTooltipStyles, t as prepareTooltipSurface, s as useTooltip };
+export { c as ControlTooltip, h as DialogController, i as PopoverController, a as TooltipController, p as TooltipText, g as attachMenuKeyboard, _ as attachResizeHandle, o as createTooltipElement, n as ensureTooltipStyles, t as prepareTooltipSurface, s as useTooltip };

package/svelte/UiComponent.svelte

@@ -1,17 +1,35 @@
 <script lang="ts">
   import { onMount, untrack, type Snippet } from 'svelte';
-  import { uiComponents, componentModels, createFrameworkMount, withFrameworkContent, type UiContentTarget, type UiFrameworkMount } from '../framework';
+  import {
+    uiComponents,
+    componentModels,
+    createFrameworkMount,
+    withFrameworkContent,
+    type UiContentTarget,
+    type UiFrameworkMount,
+  } from '../framework';
   import type { SvelteUiProps } from '../svelte-props';
 
-  let { component, props = {}, children, slots = {}, onValueChange, onUiEvent }: SvelteUiProps = $props();
+  let {
+    component,
+    props = {},
+    children,
+    slots = {},
+    onValueChange,
+    onUiEvent,
+  }: SvelteUiProps = $props();
   type Content = Snippet<[Record<string, unknown>]>;
   let host: HTMLSpanElement;
   let targets = $state.raw<UiContentTarget<Content>[]>([]);
   let mount = $state.raw<UiFrameworkMount<Content>>();
   onMount(() => {
-    const current = createFrameworkMount<Content>(host, next => { targets = next; });
+    const current = createFrameworkMount<Content>(host, (next) => {
+      targets = next;
+    });
     mount = current;
-    return () => { current.destroy(); };
+    return () => {
+      current.destroy();
+    };
   });
   $effect(() => {
     const next = { ...props };
@@ -21,8 +39,11 @@
     const event = onUiEvent;
     const renderer = mount;
     const model = componentModels[name];
-    const callbacks = new Set([...Object.keys(next).filter(key => /^on[A-Z]/.test(key)),
-      'onClose', ...(model ? [model.callback] : [])]);
+    const callbacks = new Set([
+      ...Object.keys(next).filter((key) => /^on[A-Z]/.test(key)),
+      'onClose',
+      ...(model ? [model.callback] : []),
+    ]);
     for (const key of callbacks) {
       const original = next[key];
       next[key] = (...args: unknown[]) => {
@@ -32,18 +53,30 @@
         return result;
       };
     }
-    untrack(() => renderer?.render(uiComponents[name], next,
-      (props, content) => withFrameworkContent(name, props, contents, content)));
+    untrack(() =>
+      renderer?.render(uiComponents[name], next, (props, content) =>
+        withFrameworkContent(name, props, contents, content),
+      ),
+    );
   });
   function portal(node: HTMLElement, target: HTMLElement) {
     target.appendChild(node);
-    return { update(next: HTMLElement) { next.appendChild(node); } };
+    return {
+      update(next: HTMLElement) {
+        next.appendChild(node);
+      },
+    };
   }
 </script>
 
-<span bind:this={host} style="display: contents" data-rv-svelte-host={component}></span>
+<span bind:this={host} style="display: contents" data-rv-svelte-host={component}
+></span>
 {#each targets as target (target.id)}
-  <span use:portal={target.element} style="display: contents" data-rv-svelte-content>
+  <span
+    use:portal={target.element}
+    style="display: contents"
+    data-rv-svelte-content
+  >
     {@render target.content(target.scope)}
   </span>
 {/each}

package/svelte-control.js

@@ -1,5 +1,5 @@
 import { controlAttributes as e } from "./control-attributes.js";
-//#region src/svelte-control.ts
+//#region package/svelte-control.ts
 function t(t) {
 	let n = [], r = () => {
 		let r = t.localName, i = e(r, { ...r === "input" ? { type: t.type } : {} }), a = i.class.split(/\s+/).filter(Boolean);

package/svelte.d.ts

@@ -5,5 +5,5 @@ export type { SvelteUiProps } from './svelte-props';
 export type { UiComponentName, UiComponentProps } from './component-catalog';
 export type { PdfViewerProps, PdfViewerText } from './pdf-viewer/component';
 export type { PdfViewerToolbarProps } from './pdf-viewer/toolbar';
-export type { PdfViewerButton, PdfViewerButtonOptions, PdfViewerToolbarOptions, PdfViewerToolbarConfig } from './pdf-viewer/toolbar-options';
+export type { PdfViewerButton, PdfViewerButtonOptions, PdfViewerToolbarOptions, PdfViewerToolbarConfig, } from './pdf-viewer/toolbar-options';
 export { defaultPdfViewerText } from './pdf-viewer/translations';

package/svelte.js

@@ -1,11 +1,11 @@
-import { i as e } from "./_chunks/component-CMkF17YZ.js";
-import { t } from "./_chunks/component-metadata-BKd7U8OW.js";
-import { n, t as r } from "./_chunks/framework-mount-Bk4O_T7T.js";
+import { i as e } from "./_chunks/component-B8SvtSaB.js";
+import { t } from "./_chunks/component-metadata-DlVkpW3h.js";
+import { n, t as r } from "./_chunks/framework-mount-DQ4opSL0.js";
 import { uiComponents as i } from "./framework.js";
 import "svelte/internal/disclose-version";
 import * as a from "svelte/internal/client";
 import { onMount as o, untrack as s } from "svelte";
-//#region src/svelte/UiComponent.svelte
+//#region package/svelte/UiComponent.svelte
 var c = a.from_html("<span style=\"display: contents\" data-rv-svelte-content=\"\"><!></span>"), l = a.from_html("<span style=\"display: contents\"></span> <!>", 1);
 function u(e, u) {
 	a.push(u, !0);
@@ -52,7 +52,7 @@ function u(e, u) {
 	}), a.template_effect(() => a.set_attribute(v, "data-rv-svelte-host", u.component)), a.append(e, _), a.pop();
 }
 //#endregion
-//#region src/svelte.ts
+//#region package/svelte.ts
 var d = u;
 //#endregion
 export { d as UiComponent, e as defaultPdfViewerText };

package/switch/index.js

@@ -1,6 +1,6 @@
-import { t as e } from "../_chunks/jsxRuntime.module-F6UFnpT-.js";
-import { t } from "../_chunks/native-control-pFMuHf3G.js";
-//#region src/switch/index.tsx
+import { t as e } from "../_chunks/jsxRuntime.module-ksX_VSbv.js";
+import { t } from "../_chunks/native-control-xc_B4vfn.js";
+//#region package/switch/index.tsx
 function n({ checked: n, onChange: r, label: i, ariaLabel: a, className: o = "", disabled: s = !1, labelPosition: c = "before", title: l, testId: u }) {
 	let d = /* @__PURE__ */ e("span", {
 		class: "rv-switch-label",

package/time-grid.js

@@ -1,8 +1,8 @@
-import { r as e, t } from "./_chunks/hooks.module-CG3gN83z.js";
-import { t as n } from "./_chunks/jsxRuntime.module-F6UFnpT-.js";
-import { t as r } from "./_chunks/native-control-pFMuHf3G.js";
-import { t as i } from "./_chunks/tooltip-text-BXsUEmBH.js";
-//#region src/time-grid.tsx
+import { r as e, t } from "./_chunks/hooks.module-CXpO2xq6.js";
+import { t as n } from "./_chunks/jsxRuntime.module-ksX_VSbv.js";
+import { t as r } from "./_chunks/native-control-xc_B4vfn.js";
+import { t as i } from "./_chunks/tooltip-text-CH_c2J-J.js";
+//#region package/time-grid.tsx
 var a = (e, t) => `${e}:${t}`;
 function o(e) {
 	return [

package/timeline-track/_style.scss

@@ -6,11 +6,29 @@
   height: 112px;
   margin: 0 0 12px;
   overflow: hidden;
-  border: 1px solid var(--rv-ui-border, var(--rv-dialog-border, var(--rv-ui-border)));
+  border: 1px solid
+    var(--rv-ui-border, var(--rv-dialog-border, var(--rv-ui-border)));
   border-radius: 11px;
   background:
-    repeating-linear-gradient(to right, transparent 0, transparent calc(25% - 1px), color-mix(in srgb, var(--rv-ui-border, var(--rv-dialog-border, var(--rv-ui-border))) 58%, transparent) 25%),
-    var(--rv-ui-surface-sunken, color-mix(in srgb, var(--rv-dialog-bg, var(--rv-ui-surface)) 96%, var(--rv-ui-text-muted, var(--rv-dialog-muted, var(--rv-ui-text-muted)))));
+    repeating-linear-gradient(
+      to right,
+      transparent 0,
+      transparent calc(25% - 1px),
+      color-mix(
+          in srgb,
+          var(--rv-ui-border, var(--rv-dialog-border, var(--rv-ui-border))) 58%,
+          transparent
+        )
+        25%
+    ),
+    var(
+      --rv-ui-surface-sunken,
+      color-mix(
+        in srgb,
+        var(--rv-dialog-bg, var(--rv-ui-surface)) 96%,
+        var(--rv-ui-text-muted, var(--rv-dialog-muted, var(--rv-ui-text-muted)))
+      )
+    );
 }
 .rv-timeline-control__track::before {
   position: absolute;
@@ -18,12 +36,29 @@
   right: 0;
   left: 0;
   height: 1px;
-  background: color-mix(in srgb, var(--rv-ui-border, var(--rv-dialog-border, var(--rv-ui-border))) 82%, transparent);
+  background: color-mix(
+    in srgb,
+    var(--rv-ui-border, var(--rv-dialog-border, var(--rv-ui-border))) 82%,
+    transparent
+  );
   content: '';
 }
-.rv-timeline-control__range { position: absolute; bottom: 8px; color: var(--rv-ui-text-muted, var(--rv-dialog-muted, var(--rv-ui-text-muted))); font-size: 11px; font-variant-numeric: tabular-nums; }
-.rv-timeline-control__range--start { left: 10px; }
-.rv-timeline-control__range--end { right: 10px; }
+.rv-timeline-control__range {
+  position: absolute;
+  bottom: 8px;
+  color: var(
+    --rv-ui-text-muted,
+    var(--rv-dialog-muted, var(--rv-ui-text-muted))
+  );
+  font-size: 11px;
+  font-variant-numeric: tabular-nums;
+}
+.rv-timeline-control__range--start {
+  left: 10px;
+}
+.rv-timeline-control__range--end {
+  right: 10px;
+}
 .rv-timeline-control__bar {
   position: absolute;
   top: 39px;
@@ -37,7 +72,11 @@
   color: var(--timeline-event-text-color, #0f172a);
   box-shadow: 0 1px 2px var(--rv-ui-shadow);
   touch-action: none;
-  transition: border-color var(--rv-ui-motion-fast, 120ms) var(--rv-ui-motion-ease, cubic-bezier(.2, 0, 0, 1)), box-shadow 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)),
+    box-shadow var(--rv-ui-motion-fast, 120ms)
+      var(--rv-ui-motion-ease, cubic-bezier(0.2, 0, 0, 1));
 }
 .rv-timeline-control__bar-move {
   position: absolute;
@@ -55,14 +94,28 @@
   cursor: grab;
   touch-action: none;
 }
-.rv-timeline-control__bar-move:active { cursor: grabbing; }
+.rv-timeline-control__bar-move:active {
+  cursor: grabbing;
+}
 .rv-timeline-control__bar:hover {
   border-color: var(--timeline-event-hover-color-end, #166534);
 }
-.rv-timeline-control__bar--selected { box-shadow: 0 0 0 3px color-mix(in srgb, var(--timeline-event-color, #16a34a) 22%, transparent), 0 1px 2px var(--rv-ui-shadow); }
-.rv-timeline-control__bar--milestone { border-radius: 50%; }
-.rv-timeline-control__bar--milestone .rv-timeline-control__bar-label { display: none; }
-.rv-timeline-control__bar--outside { outline: 2px dashed var(--rv-structured-warning, var(--rv-ui-warning)); outline-offset: 2px; }
+.rv-timeline-control__bar--selected {
+  box-shadow:
+    0 0 0 3px
+      color-mix(in srgb, var(--timeline-event-color, #16a34a) 22%, transparent),
+    0 1px 2px var(--rv-ui-shadow);
+}
+.rv-timeline-control__bar--milestone {
+  border-radius: 50%;
+}
+.rv-timeline-control__bar--milestone .rv-timeline-control__bar-label {
+  display: none;
+}
+.rv-timeline-control__bar--outside {
+  outline: 2px dashed var(--rv-structured-warning, var(--rv-ui-warning));
+  outline-offset: 2px;
+}
 .rv-timeline-control__bar-label {
   display: block;
   overflow: hidden;
@@ -89,16 +142,27 @@
   width: 4px;
   border-radius: 999px;
   background: rgb(255 255 255 / 82%);
-  opacity: .45;
-  transition: opacity var(--rv-ui-motion-fast, 120ms) var(--rv-ui-motion-ease, cubic-bezier(.2, 0, 0, 1));
+  opacity: 0.45;
+  transition: opacity var(--rv-ui-motion-fast, 120ms)
+    var(--rv-ui-motion-ease, cubic-bezier(0.2, 0, 0, 1));
   content: '';
 }
 .rv-timeline-control__bar:hover .rv-timeline-control__handle::after,
-.rv-timeline-control__bar--selected .rv-timeline-control__handle::after { opacity: 1; }
-.rv-timeline-control__handle--start { left: -12px; }
-.rv-timeline-control__handle--start::after { left: 10px; }
-.rv-timeline-control__handle--end { right: -12px; }
-.rv-timeline-control__handle--end::after { right: 10px; }
+.rv-timeline-control__bar--selected .rv-timeline-control__handle::after {
+  opacity: 1;
+}
+.rv-timeline-control__handle--start {
+  left: -12px;
+}
+.rv-timeline-control__handle--start::after {
+  left: 10px;
+}
+.rv-timeline-control__handle--end {
+  right: -12px;
+}
+.rv-timeline-control__handle--end::after {
+  right: 10px;
+}
 
 .rv-timeline-control__track button:focus-visible {
   outline: 0;
@@ -106,16 +170,24 @@
   box-shadow: 0 0 0 3px var(--rv-ui-focus-ring);
 }
 @media (prefers-reduced-motion: reduce) {
-  .rv-timeline-control__bar { transition: none; }
+  .rv-timeline-control__bar {
+    transition: none;
+  }
 }
 @media (forced-colors: active) {
-  .rv-timeline-control__track { border-color: CanvasText; }
+  .rv-timeline-control__track {
+    border-color: CanvasText;
+  }
   .rv-timeline-control__bar {
     border-color: Highlight;
     background: Highlight;
     color: HighlightText;
     forced-color-adjust: auto;
   }
-  .rv-timeline-control__bar--selected { outline: 2px solid Highlight; }
-  .rv-timeline-control__handle::after { background: HighlightText; }
+  .rv-timeline-control__bar--selected {
+    outline: 2px solid Highlight;
+  }
+  .rv-timeline-control__handle::after {
+    background: HighlightText;
+  }
 }

package/timeline-track/index.js

@@ -1,9 +1,9 @@
-import { t as e } from "../_chunks/hooks.module-CG3gN83z.js";
-import { t } from "../_chunks/jsxRuntime.module-F6UFnpT-.js";
-import { t as n } from "../_chunks/native-control-pFMuHf3G.js";
-import { n as r } from "../_chunks/tooltip-D4xkio5G.js";
+import { t as e } from "../_chunks/hooks.module-CXpO2xq6.js";
+import { t } from "../_chunks/jsxRuntime.module-ksX_VSbv.js";
+import { t as n } from "../_chunks/native-control-xc_B4vfn.js";
+import { n as r } from "../_chunks/tooltip-B5ziciEP.js";
 import { eventOutsideRange as i, moveTimelineEvent as a, niceTimelineStep as o, resizeTimelineEvent as s, timelineEventBackground as c, timelineGeometry as l } from "./model.js";
-//#region src/timeline-track/component.tsx
+//#region package/timeline-track/component.tsx
 var u = {
 	preview: "Timeline preview",
 	moveEvent: (e) => `Move event ${e}`,

package/timeline-track/model.js

@@ -1,4 +1,4 @@
-//#region src/timeline-track/model.ts
+//#region package/timeline-track/model.ts
 function e(e, t) {
 	return e.start < t.start || e.end > t.end;
 }