@mono-lit/helper 0.0.2 → 0.0.3

package/dist/src/components/tooltip/tooltip-types.d.ts

@@ -1,4 +1,5 @@
-import { MaybeReactive } from '../../composables/reactive';
+import { MaybeReactive } from "../../composables/reactive.js";
+//#region src/components/tooltip/tooltip-types.d.ts
 type Side = 'top' | 'right' | 'bottom' | 'left';
 export type MonoTooltipPlacement = Side | `${Side}-start` | `${Side}-end`;
 /** What opens the tooltip. `manual` = only `show()` / `hide()` do. */
@@ -23,49 +24,49 @@ export type MonoTooltipTargetValue = string | Element | null | undefined | Array
  */
 export type MonoTooltipTarget = MaybeReactive<MonoTooltipTargetValue>;
 export interface MonoTooltipOptions {
-    /**
-     * The text (or node) to show. When omitted the anchor supplies it:
-     * `mono-tooltip-content` → `mono-tooltip-message` → `title` → `aria-label`.
-     */
-    content?: MonoTooltipContent;
-    /** Treat string content as HTML. Default `false` (set as text). */
-    allowHTML?: boolean;
-    /** Preferred side (+ alignment). Default `'top'`. Flipped when there is no room. */
-    placement?: MonoTooltipPlacement;
-    /** Gap between the anchor and the tooltip, px. Default `6`. */
-    offset?: number;
-    /** Viewport padding kept by flip/shift, px. Default `8`. */
-    padding?: number;
-    /** Flip to the opposite side when the preferred one overflows. Default `true`. */
-    flip?: boolean;
-    /** Slide along the anchor to stay inside the viewport. Default `true`. */
-    shift?: boolean;
-    /** Draw the pointer arrow. Default `true`. */
-    arrow?: boolean;
-    /** What opens it. Default `['hover', 'focus']`. */
-    trigger?: MonoTooltipTrigger | MonoTooltipTrigger[];
-    /** Open / close delay in ms — one number for both, or `[show, hide]`. Default `[100, 0]`. */
-    delay?: number | [number, number];
-    /** Keep it open while the pointer is over the tooltip itself (links, buttons inside). Default `false`. */
-    interactive?: boolean;
-    /** CSS `max-width` of the bubble. Default: `--mono-tooltip-max-width`, else `20rem`. */
-    maxWidth?: string;
-    variant?: MonoTooltipVariant;
-    /** Paint the bubble in a palette colour instead of the variant's surface. */
-    color?: MonoTooltipColor;
-    size?: MonoTooltipSize;
-    /** Extra class(es) on the floating element. */
-    class?: string;
-    /** Where the floating element is appended. Default `document.body`. */
-    appendTo?: Element | (() => Element | null);
-    /** Stop opening (an open one closes). Default `false`. */
-    disabled?: boolean;
-    /** Close a hover/focus tooltip when its anchor is clicked. Default `true`. */
-    hideOnClick?: boolean;
-    /** Before it opens — return `false` to cancel. */
-    onShow?: (anchor: Element, tooltip: HTMLElement) => void | boolean;
-    /** Before it closes — return `false` to keep it. */
-    onHide?: (anchor: Element, tooltip: HTMLElement) => void | boolean;
+  /**
+   * The text (or node) to show. When omitted the anchor supplies it:
+   * `mono-tooltip-content` → `mono-tooltip-message` → `title` → `aria-label`.
+   */
+  content?: MonoTooltipContent;
+  /** Treat string content as HTML. Default `false` (set as text). */
+  allowHTML?: boolean;
+  /** Preferred side (+ alignment). Default `'top'`. Flipped when there is no room. */
+  placement?: MonoTooltipPlacement;
+  /** Gap between the anchor and the tooltip, px. Default `6`. */
+  offset?: number;
+  /** Viewport padding kept by flip/shift, px. Default `8`. */
+  padding?: number;
+  /** Flip to the opposite side when the preferred one overflows. Default `true`. */
+  flip?: boolean;
+  /** Slide along the anchor to stay inside the viewport. Default `true`. */
+  shift?: boolean;
+  /** Draw the pointer arrow. Default `true`. */
+  arrow?: boolean;
+  /** What opens it. Default `['hover', 'focus']`. */
+  trigger?: MonoTooltipTrigger | MonoTooltipTrigger[];
+  /** Open / close delay in ms — one number for both, or `[show, hide]`. Default `[100, 0]`. */
+  delay?: number | [number, number];
+  /** Keep it open while the pointer is over the tooltip itself (links, buttons inside). Default `false`. */
+  interactive?: boolean;
+  /** CSS `max-width` of the bubble. Default: `--mono-tooltip-max-width`, else `20rem`. */
+  maxWidth?: string;
+  variant?: MonoTooltipVariant;
+  /** Paint the bubble in a palette colour instead of the variant's surface. */
+  color?: MonoTooltipColor;
+  size?: MonoTooltipSize;
+  /** Extra class(es) on the floating element. */
+  class?: string;
+  /** Where the floating element is appended. Default `document.body`. */
+  appendTo?: Element | (() => Element | null);
+  /** Stop opening (an open one closes). Default `false`. */
+  disabled?: boolean;
+  /** Close a hover/focus tooltip when its anchor is clicked. Default `true`. */
+  hideOnClick?: boolean;
+  /** Before it opens — return `false` to cancel. */
+  onShow?: (anchor: Element, tooltip: HTMLElement) => void | boolean;
+  /** Before it closes — return `false` to keep it. */
+  onHide?: (anchor: Element, tooltip: HTMLElement) => void | boolean;
 }
 /**
  * What `createMonoTooltip` / Nuxt's `mono.helper.tooltip` take: every tooltip
@@ -73,38 +74,39 @@ export interface MonoTooltipOptions {
  * additionally has to be JSON — no functions, no nodes.
  */
 export interface MonoTooltipGlobalOptions extends MonoTooltipOptions {
-    /**
-     * Turn on the declarative attributes — any element (plain HTML, light or
-     * shadow `<mono-*>`) with `mono-tooltip-content="…"` (or `mono-tooltip-message`)
-     * gets a tooltip, no `controlMonoTooltip` call needed. Default `true`.
-     */
-    attributes?: boolean;
+  /**
+   * Turn on the declarative attributes — any element (plain HTML, light or
+   * shadow `<mono-*>`) with `mono-tooltip-content="…"` (or `mono-tooltip-message`)
+   * gets a tooltip, no `controlMonoTooltip` call needed. Default `true`.
+   */
+  attributes?: boolean;
 }
 /** What `controlMonoTooltip(...)` returns. */
 export interface MonoTooltipController {
-    /** Open on `anchor` (default: the first element the target currently resolves to). */
-    show(anchor?: Element): Promise<void>;
-    hide(): void;
-    toggle(anchor?: Element): Promise<void>;
-    /** Merge into this controller's own options (global options still win). */
-    update(options: Partial<MonoTooltipOptions>): void;
-    /** Replace the content; an open tooltip re-renders in place. */
-    setContent(content: MonoTooltipContent | undefined): void;
-    enable(): void;
-    disable(): void;
-    /** True while the tooltip is on screen. */
-    readonly isOpen: boolean;
-    /** The element it is currently open on, else `null`. */
-    readonly anchor: Element | null;
-    /** The floating element while open, else `null`. */
-    readonly tooltip: HTMLElement | null;
-    /** Close it and stop listening. Call from `onBeforeUnmount`. */
-    destroy(): void;
+  /** Open on `anchor` (default: the first element the target currently resolves to). */
+  show(anchor?: Element): Promise<void>;
+  hide(): void;
+  toggle(anchor?: Element): Promise<void>;
+  /** Merge into this controller's own options (global options still win). */
+  update(options: Partial<MonoTooltipOptions>): void;
+  /** Replace the content; an open tooltip re-renders in place. */
+  setContent(content: MonoTooltipContent | undefined): void;
+  enable(): void;
+  disable(): void;
+  /** True while the tooltip is on screen. */
+  readonly isOpen: boolean;
+  /** The element it is currently open on, else `null`. */
+  readonly anchor: Element | null;
+  /** The floating element while open, else `null`. */
+  readonly tooltip: HTMLElement | null;
+  /** Close it and stop listening. Call from `onBeforeUnmount`. */
+  destroy(): void;
 }
 /** What `createMonoTooltip(...)` returns — also a Vue plugin (`app.use(...)`). */
 export interface MonoTooltipGlobal {
-    readonly options: Readonly<MonoTooltipGlobalOptions>;
-    /** Vue plugin hook — a no-op; the options are already applied by the call. */
-    install(app?: unknown): void;
+  readonly options: Readonly<MonoTooltipGlobalOptions>;
+  /** Vue plugin hook — a no-op; the options are already applied by the call. */
+  install(app?: unknown): void;
 }
-export {};
+//#endregion
+export {};

package/dist/src/composables/breakpoints.d.ts

@@ -1,3 +1,4 @@
+//#region src/composables/breakpoints.d.ts
 /**
  * Shared viewport breakpoints — Tailwind's values, so `auto-fullscreen="lg"` in a
  * mono component and `lg:` in the consumer's utility classes agree on where the
@@ -12,11 +13,11 @@
  * re-pointing it here would silently change the sidebar's auto-temporary threshold.
  */
 export declare const MONO_BREAKPOINTS: {
-    readonly sm: 640;
-    readonly md: 768;
-    readonly lg: 1024;
-    readonly xl: 1280;
-    readonly '2xl': 1536;
+  readonly sm: 640;
+  readonly md: 768;
+  readonly lg: 1024;
+  readonly xl: 1280;
+  readonly '2xl': 1536;
 };
 export type MonoBreakpoint = keyof typeof MONO_BREAKPOINTS;
 /**
@@ -41,8 +42,8 @@ export declare function resolveAutoFullscreen(value: MonoAutoFullscreen | string
  * `fromAttribute`, so a real boolean can arrive here instead of a string.
  */
 export declare const autoFullscreenConverter: {
-    fromAttribute(value: unknown): MonoAutoFullscreen;
-    toAttribute(value: MonoAutoFullscreen): string | null;
+  fromAttribute(value: unknown): MonoAutoFullscreen;
+  toAttribute(value: MonoAutoFullscreen): string | null;
 };
 /**
  * Is the viewport currently at or below `bp`?
@@ -57,3 +58,4 @@ export declare const autoFullscreenConverter: {
  * the `@media` blocks in modal.css / drawer.css, which have no SSR surface at all.
  */
 export declare function isBelowBreakpoint(bp: MonoBreakpoint): boolean;
+//#endregion

package/dist/src/composables/chip-limits.d.ts

@@ -1,3 +1,4 @@
+//#region src/composables/chip-limits.d.ts
 /**
  * Selection limits and display caps shared by `<mono-tag-input>` and
  * `<mono-dropdown-table>`.
@@ -22,16 +23,16 @@
 export type ChipLimitKey = 'max' | 'min' | 'maxVisible' | 'minVisible';
 /** The limit keys the `chip` object accepts, in both spellings. */
 export interface ChipLimitProps {
-    /** Most chips the user can select (unset = unlimited). Pins the element's `max`. */
-    max?: number;
-    /** Fewest chips the user can leave (unset = 0). Pins the element's `min`. */
-    min?: number;
-    /** Chips drawn before "+N more" (unset = all). Pins the element's `max-visible`. */
-    maxVisible?: number;
-    'max-visible'?: number;
-    /** Never collapse while the total is at or under this. Pins `min-visible`. */
-    minVisible?: number;
-    'min-visible'?: number;
+  /** Most chips the user can select (unset = unlimited). Pins the element's `max`. */
+  max?: number;
+  /** Fewest chips the user can leave (unset = 0). Pins the element's `min`. */
+  min?: number;
+  /** Chips drawn before "+N more" (unset = all). Pins the element's `max-visible`. */
+  maxVisible?: number;
+  'max-visible'?: number;
+  /** Never collapse while the total is at or under this. Pins `min-visible`. */
+  minVisible?: number;
+  'min-visible'?: number;
 }
 /** A non-negative integer, or undefined for anything that is not one (`''`, null, NaN, -1). */
 export declare function limitNumber(value: unknown): number | undefined;
@@ -46,3 +47,4 @@ export declare function resolveChipLimit(chip: ChipLimitProps | null | undefined
  * the total sits at or under the collapse floor.
  */
 export declare function visibleChipCap(total: number, maxVisible: number | undefined, minVisible: number | undefined): number;
+//#endregion

package/dist/src/composables/chip-strip.d.ts

@@ -1,93 +1,95 @@
-import { ReactiveController, ReactiveControllerHost } from 'lit';
+import { ReactiveController, ReactiveControllerHost } from "lit";
+//#region src/composables/chip-strip.d.ts
 export interface ChipStripOptions {
-    /** The scrolling strip, or `null` when the host is not rendering one. */
-    strip: () => HTMLElement | null;
-    /**
-     * Whether inline behaviour is active. False means the host renders no strip,
-     * so the controller stays completely inert — no observer, no queries, no
-     * layout reads. This is what keeps `flex` mode free.
-     */
-    enabled: () => boolean;
+  /** The scrolling strip, or `null` when the host is not rendering one. */
+  strip: () => HTMLElement | null;
+  /**
+   * Whether inline behaviour is active. False means the host renders no strip,
+   * so the controller stays completely inert — no observer, no queries, no
+   * layout reads. This is what keeps `flex` mode free.
+   */
+  enabled: () => boolean;
 }
 export declare class ChipStripController implements ReactiveController {
-    private readonly host;
-    private readonly opts;
-    private _canScrollStart;
-    private _canScrollEnd;
-    private _observer;
-    /** The element the observer is attached to, so a re-render can re-target it. */
-    private _observed;
-    constructor(host: ReactiveControllerHost, opts: ChipStripOptions);
-    /** True once the strip is scrolled away from its start — render `‹`. */
-    get canScrollStart(): boolean;
-    /** True while content remains past the right edge — render `›`. */
-    get canScrollEnd(): boolean;
-    /** True when either button should show — i.e. the chips overflow the strip. */
-    get overflowing(): boolean;
-    hostConnected(): void;
-    hostDisconnected(): void;
-    /**
-     * Only re-target the observer — deliberately does NOT measure. Measuring here
-     * would force a layout on every render of every host, and its `requestUpdate`
-     * would schedule an update from inside `updated()`. `invalidate()` and the
-     * ResizeObserver cover the cases that can actually change the answer.
-     */
-    hostUpdated(): void;
-    /**
-     * Re-measure because the CONTENT changed — a chip added, removed or relabelled.
-     * The host calls this from `updated()` when such state actually changed, which
-     * is far rarer than "every update".
-     */
-    invalidate(): void;
-    /**
-     * Recompute both flags from the live geometry and re-render only when one
-     * actually flipped.
-     */
-    sync(): void;
-    /**
-     * Scroll one "page" toward `dir`, aligned to a chip boundary so a chip is
-     * never left half-cut at the leading edge.
-     *
-     * Forward: the first chip whose right edge passes the visible right edge
-     * becomes the new leftmost chip. Backward: the chip that would end at the
-     * current left edge becomes the new leftmost chip. If no chip qualifies
-     * (one chip wider than the strip), fall back to a plain viewport-width step
-     * so the button is never a no-op.
-     */
-    page(dir: -1 | 1): void;
-    /** Pin the strip to its end — used after a chip is added, to reveal it. */
-    scrollToEnd(): void;
-    /**
-     * Move the strip and republish from the CLAMPED TARGET rather than by reading
-     * `scrollLeft` back.
-     *
-     * Scrolling is instant (no `scroll-behavior: smooth`), so the read would agree
-     * — but not reading avoids a second forced layout, and more importantly the
-     * strip's scroll events are expensive well beyond this controller: the shared
-     * popup controller listens for `scroll` on `window` in the CAPTURE phase, so
-     * every scroll event the strip emits repositions any open dropdown, forcing a
-     * layout and a `getComputedStyle` ancestor walk. One event per click is the
-     * budget; a smooth animation's ~30 was what made the page crawl.
-     */
-    private _scrollTo;
-    /**
-     * Store the flags and re-render only on a real change.
-     *
-     * The request is deferred a microtask: `invalidate()` / `scrollToEnd()` are
-     * called from the host's `updated()` (a chip landed, a preset value arrived),
-     * and a synchronous `requestUpdate()` there is Lit's change-in-update warning
-     * on every such edge. The flags are already stored, so the deferred render
-     * reads the same answer — it just doesn't get scheduled from inside the
-     * render that asked for it.
-     */
-    private _publish;
-    /**
-     * Observe the strip so the buttons re-evaluate when the FIELD is resized —
-     * a window resize changes `clientWidth` without any render or scroll event.
-     *
-     * Only the strip is observed, not the chips: a chip add/remove always comes
-     * with a host render, and the host calls `invalidate()` for those.
-     */
-    private _attach;
-    private _teardown;
+  private readonly host;
+  private readonly opts;
+  private _canScrollStart;
+  private _canScrollEnd;
+  private _observer;
+  /** The element the observer is attached to, so a re-render can re-target it. */
+  private _observed;
+  constructor(host: ReactiveControllerHost, opts: ChipStripOptions);
+  /** True once the strip is scrolled away from its start — render `‹`. */
+  get canScrollStart(): boolean;
+  /** True while content remains past the right edge — render `›`. */
+  get canScrollEnd(): boolean;
+  /** True when either button should show — i.e. the chips overflow the strip. */
+  get overflowing(): boolean;
+  hostConnected(): void;
+  hostDisconnected(): void;
+  /**
+   * Only re-target the observer — deliberately does NOT measure. Measuring here
+   * would force a layout on every render of every host, and its `requestUpdate`
+   * would schedule an update from inside `updated()`. `invalidate()` and the
+   * ResizeObserver cover the cases that can actually change the answer.
+   */
+  hostUpdated(): void;
+  /**
+   * Re-measure because the CONTENT changed — a chip added, removed or relabelled.
+   * The host calls this from `updated()` when such state actually changed, which
+   * is far rarer than "every update".
+   */
+  invalidate(): void;
+  /**
+   * Recompute both flags from the live geometry and re-render only when one
+   * actually flipped.
+   */
+  sync(): void;
+  /**
+   * Scroll one "page" toward `dir`, aligned to a chip boundary so a chip is
+   * never left half-cut at the leading edge.
+   *
+   * Forward: the first chip whose right edge passes the visible right edge
+   * becomes the new leftmost chip. Backward: the chip that would end at the
+   * current left edge becomes the new leftmost chip. If no chip qualifies
+   * (one chip wider than the strip), fall back to a plain viewport-width step
+   * so the button is never a no-op.
+   */
+  page(dir: -1 | 1): void;
+  /** Pin the strip to its end — used after a chip is added, to reveal it. */
+  scrollToEnd(): void;
+  /**
+   * Move the strip and republish from the CLAMPED TARGET rather than by reading
+   * `scrollLeft` back.
+   *
+   * Scrolling is instant (no `scroll-behavior: smooth`), so the read would agree
+   * — but not reading avoids a second forced layout, and more importantly the
+   * strip's scroll events are expensive well beyond this controller: the shared
+   * popup controller listens for `scroll` on `window` in the CAPTURE phase, so
+   * every scroll event the strip emits repositions any open dropdown, forcing a
+   * layout and a `getComputedStyle` ancestor walk. One event per click is the
+   * budget; a smooth animation's ~30 was what made the page crawl.
+   */
+  private _scrollTo;
+  /**
+   * Store the flags and re-render only on a real change.
+   *
+   * The request is deferred a microtask: `invalidate()` / `scrollToEnd()` are
+   * called from the host's `updated()` (a chip landed, a preset value arrived),
+   * and a synchronous `requestUpdate()` there is Lit's change-in-update warning
+   * on every such edge. The flags are already stored, so the deferred render
+   * reads the same answer — it just doesn't get scheduled from inside the
+   * render that asked for it.
+   */
+  private _publish;
+  /**
+   * Observe the strip so the buttons re-evaluate when the FIELD is resized —
+   * a window resize changes `clientWidth` without any render or scroll event.
+   *
+   * Only the strip is observed, not the chips: a chip add/remove always comes
+   * with a host render, and the host calls `invalidate()` for those.
+   */
+  private _attach;
+  private _teardown;
 }
+//#endregion

package/dist/src/composables/color.d.ts

@@ -1,3 +1,4 @@
+//#region src/composables/color.d.ts
 /**
  * Colour parsing and contrast, for props that accept a raw CSS colour.
  *
@@ -17,10 +18,10 @@
  * `var()` and has different needs.
  */
 export interface Rgba {
-    r: number;
-    g: number;
-    b: number;
-    a: number;
+  r: number;
+  g: number;
+  b: number;
+  a: number;
 }
 /** The two inks the theme uses on a filled surface (`index.css` `--theme-*-contrast`). */
 export declare const INK_LIGHT = "#ffffff";
@@ -101,3 +102,4 @@ export declare function customColorStyle(value: string | undefined | null, compo
  * reads as a CSS colour. Returns an error string, or null when the value is fine.
  */
 export declare function validateColorProp(value: unknown): string | null;
+//#endregion

package/dist/src/composables/css-class.d.ts

@@ -1,3 +1,4 @@
+//#region src/composables/css-class.d.ts
 /**
  * Append a per-part class override (if present) to a base class string.
  *
@@ -17,11 +18,12 @@ export declare function cssPart<T extends object>(cssClass: T | undefined, base:
  * change). Used by each component's `_setCssClass`.
  */
 export declare function applyCssClass<T extends object>(target: {
-    cssClass: T;
-    cssClassName: string;
+  cssClass: T;
+  cssClassName: string;
 }, value: unknown): void;
 /**
  * Define `css-class` and `cssclass` instance aliases (Vue interop) that route to
  * `set`. Lets consumers write `<el :css-class="…">` / `:cssclass` / `:cssClass`.
  */
 export declare function defineCssClassAliases(target: object, set: (value: unknown) => void): void;
+//#endregion

package/dist/src/composables/css-size.d.ts

@@ -1,4 +1,5 @@
-import { StyleInfo } from 'lit/directives/style-map.js';
+import { StyleInfo } from "lit/directives/style-map.js";
+//#region src/composables/css-size.d.ts
 /** A sizing prop value: a CSS length string, or a number (interpreted as px). */
 export type CssSizeValue = string | number | undefined;
 /**
@@ -10,12 +11,12 @@ export type CssSizeValue = string | number | undefined;
 export declare function toCssSize(value: CssSizeValue): string | undefined;
 /** The six sizing props shared by sizing-driven components. */
 export interface SizeProps {
-    width?: CssSizeValue;
-    height?: CssSizeValue;
-    minWidth?: CssSizeValue;
-    maxWidth?: CssSizeValue;
-    minHeight?: CssSizeValue;
-    maxHeight?: CssSizeValue;
+  width?: CssSizeValue;
+  height?: CssSizeValue;
+  minWidth?: CssSizeValue;
+  maxWidth?: CssSizeValue;
+  minHeight?: CssSizeValue;
+  maxHeight?: CssSizeValue;
 }
 /**
  * The popup-PANEL sizing object shared by `mono-select`, `mono-tag-input` and
@@ -38,3 +39,4 @@ export type PanelSizeProps = SizeProps;
  * `toCssSize` and omitting the ones that aren't set.
  */
 export declare function buildSizeStyle(src: SizeProps): StyleInfo;
+//#endregion