@mono-lit/helper 0.0.4 → 0.0.6

package/dist/src/components/slider/slider-math.d.ts

@@ -0,0 +1,102 @@
+import { SliderFill } from "./slider-types.js";
+//#region src/components/slider/slider-math.d.ts
+export interface SliderScale {
+  min: number;
+  max: number;
+  /** Snap interval; 0 = continuous. Ignored when `stops` is set. */
+  step: number;
+  /** Sorted, de-duplicated, inside [min, max]; null when the slider snaps to `step`. */
+  stops: number[] | null;
+  minGap: number;
+}
+export interface SliderScaleInput {
+  min?: unknown;
+  max?: unknown;
+  step?: unknown;
+  stops?: unknown;
+  minGap?: unknown;
+}
+/** One stretch of track between two boundaries (the ends, or a thumb). */
+export interface SliderPiece {
+  /** Start / end along the track, 0–100. */
+  from: number;
+  to: number;
+  /** True when that end is a THUMB (so a `track-gap` cuts it back), false at the track's ends. */
+  cutStart: boolean;
+  cutEnd: boolean;
+  filled: boolean;
+}
+export interface SliderMarkPoint {
+  value: number;
+  /** 0–100 along the track. */
+  pct: number;
+  /** The mark's own label; undefined means "format the value" (when labels are shown at all). */
+  label?: string;
+  /** True when the mark carried a label (or was given as an object). */
+  labelled: boolean;
+}
+/** Strip float noise (0.1 + 0.2) without losing a fractional step. */
+export declare function stripNoise(n: number): number;
+/**
+ * Anything a consumer (or a framework) might hand over as a value — a number, an array, a JSON
+ * string (`"[20,80]"`, what an SSR attribute carries), a comma list (`"20,80"`), a numeric string —
+ * as a list of finite numbers. Non-numbers are dropped. `null` when nothing usable is left.
+ */
+export declare function coerceNumbers(value: unknown): number[] | null;
+/** The scale from raw props: defaults 0 / 100 / 1, `max` never below `min`, stops cleaned. */
+export declare function resolveScale(input: SliderScaleInput): SliderScale;
+/** The allowed value nearest to `v` (a stop, a grid point, or `v` itself when continuous). */
+export declare function snap(v: number, scale: SliderScale): number;
+/** The smallest allowed value ≥ x (or `max` when none is). */
+export declare function ceilTo(x: number, scale: SliderScale): number;
+/** The largest allowed value ≤ x (or `min` when none is). */
+export declare function floorTo(x: number, scale: SliderScale): number;
+/**
+ * The values, made valid: each clamped and snapped, sorted, then spread so neighbours are at least
+ * `minGap` apart. Thumbs are never dropped — when the gap cannot fit every thumb, they pack
+ * against the ends (the forward pass pushes right, the backward pass pulls back under `max`).
+ */
+export declare function normalise(values: number[], scale: SliderScale): number[];
+/** The range thumb `i` may move in: its neighbours ± `minGap` (the BLOCK rule). */
+export declare function thumbBounds(values: number[], i: number, scale: SliderScale): {
+  lo: number;
+  hi: number;
+};
+/**
+ * Move thumb `i` toward `v`: snap, then stop at the neighbours (± gap). Returns a NEW array when
+ * the thumb actually moved, the SAME array otherwise — callers use identity to skip no-op events.
+ */
+export declare function moveThumb(values: number[], i: number, v: number, scale: SliderScale): number[];
+/**
+ * Shift a whole run of thumbs `[from..to]` by `delta`, keeping their spacing — the drag of a filled
+ * segment between two thumbs. The run stops at the track ends and at the thumbs outside it.
+ */
+export declare function moveRun(values: number[], from: number, to: number, delta: number, scale: SliderScale): number[];
+/**
+ * The thumb a press at `v` should grab: the nearest one. Thumbs sitting on the same spot (`[2, 2,
+ * 3]`) tie — then the press picks by SIDE: a press above the stack takes its LAST thumb, below it
+ * the FIRST, so stacked thumbs can always be pulled apart. `dir` (+1 / -1) breaks an exact hit,
+ * once the drag has shown which way it is heading.
+ */
+export declare function nearestThumb(values: number[], v: number, dir?: number): number;
+/** True when several thumbs share position `values[i]` (a stack the next drag must split). */
+export declare function isStacked(values: number[], i: number): boolean;
+/** `v` as a 0–100 position along the track. */
+export declare function toPercent(v: number, scale: SliderScale): number;
+/** A 0–1 position along the track as a raw (unsnapped) value. */
+export declare function fromRatio(ratio: number, scale: SliderScale): number;
+/**
+ * The track as pieces between its boundaries (the two ends and every thumb), each flagged filled
+ * or not by the `fill` mode. Rendering every stretch as its own piece is what lets `track-gap` cut
+ * the track back around each thumb, and lets a consumer colour segments one by one.
+ */
+export declare function trackPieces(values: number[], scale: SliderScale, fill: SliderFill): SliderPiece[];
+/** The marks to draw. `true` = one per stop, or per step (only the two ends past ~26 — denser is a texture, not ticks). */
+export declare function markPoints(marks: unknown, scale: SliderScale): SliderMarkPoint[];
+/**
+ * One keyboard step from `v`: `dir` ±1, `big` for PageUp/PageDown. With stops it walks the list
+ * (big = a tenth of it, at least one); with a grid it moves a step (big = ten); continuous moves
+ * 1% (big = 10%).
+ */
+export declare function stepFrom(v: number, dir: 1 | -1, big: boolean, scale: SliderScale): number;
+//#endregion

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

@@ -0,0 +1,188 @@
+import { VisibilityProps } from "../../composables/visibility.js";
+import { MonoTooltipOptions } from "../tooltip/tooltip-types.js";
+import { InputFormat, InputFormatCtx } from "../input/input-format.js";
+//#region src/components/slider/slider-types.d.ts
+export type SliderSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
+export type SliderColor = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'teal' | 'purple' | 'neutral' | 'dark';
+/** Which way the track runs. Vertical puts `min` at the bottom. */
+export type SliderType = 'horizontal' | 'vertical';
+/**
+ * What the coloured part of the track covers.
+ * - `auto`: from `min` to the thumb with one thumb; between the first and last thumb with several.
+ * - `start`: from `min` to the FIRST thumb.
+ * - `end`: from the LAST thumb to `max`.
+ * - `none`: no fill.
+ */
+export type SliderFill = 'auto' | 'start' | 'end' | 'none';
+/** When each thumb shows its value bubble. */
+export type SliderValueTooltip = 'auto' | 'always' | 'never';
+export type SliderValidationState = 'default' | 'valid' | 'invalid' | 'warning';
+/** A slider value: one thumb is a number, several thumbs are an array (its length = the thumb count). */
+export type SliderValue = number | number[];
+/** One tick on the track. A bare number is a tick without a label. */
+export type SliderMark = number | {
+  value: number;
+  label?: string;
+};
+export type SliderModelEventDetail = {
+  /** The value in the shape it came in: a number for a single-number model, an array otherwise. */
+  modelValue: SliderValue;
+  currentValue: SliderValue;
+  oldValue: SliderValue;
+  value: SliderValue;
+  /** Always an array, whatever the model's shape. */
+  values: number[];
+  /** The thumb that moved (-1 when the whole value was replaced, e.g. a segment drag moves two). */
+  index: number;
+  name?: string;
+  sourceEvent?: Event;
+};
+export type SliderModelEvent = CustomEvent<SliderModelEventDetail>;
+export interface SliderCssClass {
+  root?: string;
+  label?: string;
+  required?: string;
+  value?: string;
+  control?: string;
+  track?: string;
+  fill?: string;
+  thumb?: string;
+  tooltip?: string;
+  marks?: string;
+  mark?: string;
+  markLabel?: string;
+  messageWrap?: string;
+  message?: string;
+}
+export interface SliderProps extends VisibilityProps {
+  /**
+   * The value: a number for one thumb, an array for several (`[20, 80]` is a range, `[2, 2, 3]`
+   * is three thumbs). The shape you pass is the shape you get back. A JSON string is accepted.
+   */
+  modelValue?: SliderValue | string;
+  'model-value'?: SliderValue | string;
+  modelvalue?: SliderValue | string;
+  /** The same as `modelValue`. */
+  value?: SliderValue | string;
+  /** Lowest value. Default 0. */
+  min?: number | string;
+  /** Highest value. Default 100. */
+  max?: number | string;
+  /** Snap interval. Default 1; `0` slides continuously. Ignored when `stops` is set. */
+  step?: number | string;
+  /**
+   * Discrete snap points: the thumb can only land on these values (`[0, 10, 25, 50, 100]`).
+   * Replaces `step`. A JSON string is accepted.
+   */
+  stops?: number[] | string;
+  /** Smallest distance kept between neighbouring thumbs. Default 0 (thumbs may stack). */
+  minGap?: number | string;
+  'min-gap'?: number | string;
+  mingap?: number | string;
+  /** `vertical` runs the track bottom (min) to top (max). Give it a `height`. */
+  type?: SliderType;
+  /**
+   * Tick marks: `true` for one at every step (or every stop), or a list of values / `{ value, label }`.
+   * Labels render under the track (beside it when vertical), drawn through `format-display` when
+   * a mark has no label of its own. A JSON string is accepted.
+   */
+  marks?: boolean | SliderMark[] | string;
+  /** What the coloured part of the track covers. Default `auto`. */
+  fill?: SliderFill;
+  /** Empty space cut out of the track around each thumb, in px (Material 3 style). Default 0. */
+  trackGap?: number | string;
+  'track-gap'?: number | string;
+  trackgap?: number | string;
+  /** When each thumb shows its value bubble. Default `auto` (hover, focus or drag). */
+  valueTooltip?: SliderValueTooltip;
+  'value-tooltip'?: SliderValueTooltip;
+  valuetooltip?: SliderValueTooltip;
+  /** Show the value at the end of the label row. Default `true`; `show-value="false"` hides it. */
+  showValue?: boolean;
+  'show-value'?: boolean;
+  showvalue?: boolean;
+  /** Joins the values in the label-row readout. Default `" – "`. */
+  valueSeparator?: string;
+  'value-separator'?: string;
+  valueseparator?: string;
+  /**
+   * How a value is DISPLAYED (readout, bubbles, mark labels, `aria-valuetext`): a pattern
+   * (`"{}%"`, `'"Rp "#,##0'`) or a function `({ value }) => string`. The model stays a number.
+   */
+  formatDisplay?: InputFormat;
+  'format-display'?: InputFormat;
+  formatdisplay?: InputFormat;
+  /** Locale a numeric `format-display` pattern is drawn with. */
+  formatLocale?: string;
+  'format-locale'?: string;
+  formatlocale?: string;
+  /** Visual size: scales the track, thumb and type. */
+  size?: SliderSize;
+  /** Accent colour of the fill and thumb. */
+  color?: SliderColor;
+  /** Label text above the slider. */
+  label?: string;
+  /** Helper text under the slider. */
+  helperText?: string;
+  'helper-text'?: string;
+  helpertext?: string;
+  /**
+   * Info icon at the end of the label; hovering, focusing or tapping it shows this text.
+   * Plain text → a small built-in bubble (no dependency). Full tooltip options
+   * (`:tooltip.prop="{ content, placement, color }"`) → a `mono-tooltip`, which needs the
+   * optional `@floating-ui/dom` + `@floating-ui/core` peers (without them that form renders
+   * no icon). Shown only beside a label.
+   * This is NOT the thumb's value bubble — that is `value-tooltip`.
+   */
+  tooltip?: string | MonoTooltipOptions;
+  validationState?: SliderValidationState;
+  'validation-state'?: SliderValidationState;
+  validationstate?: SliderValidationState;
+  validationMessage?: string;
+  'validation-message'?: string;
+  validationmessage?: string;
+  error?: boolean;
+  errorMessage?: string;
+  'error-message'?: string;
+  errormessage?: string;
+  success?: boolean;
+  successMessage?: string;
+  'success-message'?: string;
+  successmessage?: string;
+  /** Disables interaction and dims the slider. */
+  disabled?: boolean;
+  /** Focusable, but the value cannot be changed. */
+  readonly?: boolean;
+  /** Marks the field required (asterisk + `aria-required`). */
+  required?: boolean;
+  /**
+   * Form field name. The element writes one hidden `<input>` per thumb, so a native `<form>`
+   * submits it (`name` for one thumb, `name[]` repeated for several).
+   */
+  name?: string;
+  /** Accessible label (each thumb adds "minimum" / "maximum" / its position). */
+  ariaLabelText?: string;
+  ariaLabel?: string;
+  'aria-label'?: string;
+  arialabel?: string;
+  /** Track length when vertical (CSS length or px number). Default 200px. */
+  height?: string | number;
+  /** Width of the whole field (CSS length or px number). */
+  width?: string | number;
+  /** Per-part class overrides for internal elements. */
+  cssClass?: SliderCssClass;
+  /** Simple root class. */
+  'css-class'?: string;
+}
+export interface SliderEvents {
+  /** While dragging / on every key press. */
+  input: SliderModelEvent;
+  /** On release / when keyboard interaction ends. */
+  change: SliderModelEvent;
+  'mno-input': SliderModelEvent;
+  mnoInput: SliderModelEvent;
+  'mno-change': SliderModelEvent;
+  mnoChange: SliderModelEvent;
+}
+//#endregion
+export type { InputFormat as SliderFormat, InputFormatCtx as SliderFormatCtx };

package/dist/src/components/table/column-autosize.d.ts

@@ -0,0 +1,74 @@
+import { CssSizeValue } from "../../composables/css-size.js";
+//#region src/components/table/column-autosize.d.ts
+/**
+ * Content-sized columns — what `mono-table-th`'s `width="auto"` drives.
+ *
+ * Under `mono-table-fixed` (`table-layout: fixed`) CSS cannot do this: an `auto` column takes
+ * the WHOLE surplus instead of fitting its content, and `min-width` / `max-width` on a cell are
+ * ignored by the table algorithm. So the column is measured here and handed a concrete px width,
+ * clamped to `minWidth` / `maxWidth`, written to its `<col>` (which wins under fixed layout) and
+ * to the header cell.
+ *
+ * Text is measured with a canvas, not read back from the cell: reading the cell's own width would
+ * return the width last written, and a column could then never shrink. Measuring text also keeps
+ * the pass free of layout reads, so re-running it on every change is cheap.
+ *
+ * What is measured: the header (caption + its icons), every body cell and every FOOTER cell of
+ * the column. The footer matters — a `<mono-table-summary>` total covers the whole set, so a
+ * virtual-scroll window that only shows small figures still sizes for the largest one.
+ *
+ * Cell content is treated as one line (what a money column is). An editor (`<input>`, including
+ * the one inside `mono-input`) counts with its value and its own padding / border.
+ */
+/** The text measurer — swappable so tests can run where there is no canvas (jsdom). */
+export declare const autosizeEnv: {
+  measure: (text: string, font: string) => number;
+};
+/**
+ * `text` as the element renders it: its `text-transform`, its `letter-spacing` (canvas ignores
+ * both) and its `font-variant-numeric: tabular-nums` (every digit at the widest digit's advance —
+ * a safe upper bound; tabular figures are wider than the proportional ones canvas measures).
+ */
+export declare function measureStyled(text: string, style: CSSStyleDeclaration): number;
+/**
+ * A size prop as px: a number / bare numeric string / `px` → px, `rem` → × the root font size,
+ * `em` → × `el`'s font size. Anything else (`%`, `auto`, a var) → `undefined`: not a bound.
+ */
+export declare function cssLengthToPx(value: CssSizeValue | null, el?: Element): number | undefined;
+/** `w` clamped to `[min, max]`; an unset bound does not clamp. `min` wins over a smaller `max`. */
+export declare function clampWidth(w: number, min?: number, max?: number): number;
+/**
+ * The grid column a header cell STARTS at — a walk over its section's rows honouring `rowspan`
+ * and `colspan`, so a leaf header under a band row (`<th colspan>` above it) maps to its real
+ * column. `cellIndex` alone would count only the cells of its own row.
+ */
+export declare function headerColumnIndex(cell: HTMLTableCellElement): number;
+/** The one-line width a cell's content needs, padding included. */
+export declare function contentWidth(cell: HTMLElement): number;
+/**
+ * One auto-sized column, owned by its `mono-table-th`. `schedule()` coalesces every trigger (a
+ * controller notify, a body mutation, typing in an editor) into one measurement per frame.
+ */
+export declare class ColumnAutoSize {
+  private readonly host;
+  min?: number;
+  max?: number;
+  private _raf;
+  private _table?;
+  private _observer?;
+  private _wrote?;
+  private readonly _onInput;
+  /**
+   * A web font that finished loading after a measurement: canvas measured the FALLBACK face, so
+   * the width (and the cached digit advances) are stale — usually too narrow for the real font.
+   */
+  private readonly _onFonts;
+  constructor(host: HTMLElement);
+  schedule(): void;
+  /** Stop watching, and hand the column back to whatever width it is given next. */
+  stop(clear?: boolean): void;
+  private _watch;
+  private _unwatch;
+  private _run;
+}
+//#endregion

package/dist/src/components/table/mono-data-grid.d.ts

@@ -298,7 +298,17 @@ export interface MonoTableColumnProps {
    * @example map: (v) => formatDateTime(v)
    */
   map?: (value: any, row: any, index: number) => unknown;
+  /**
+   * Column width. Number → px; string used as-is (`'10rem'`). `'auto'` sizes the column to its
+   * content (header, body and footer cells), clamped to `minWidth` / `maxWidth` — also under
+   * `mono-table-fixed`. Money columns are the case: narrow while every figure is `0`, wider
+   * once a large one appears.
+   */
   width?: string | number;
+  /** Lower bound of the column width (px / `rem` / `em`). Clamps `width: 'auto'`. */
+  minWidth?: string | number;
+  /** Upper bound of the column width (px / `rem` / `em`). Clamps `width: 'auto'`. */
+  maxWidth?: string | number;
   height?: string | number;
   /**
    * Header alignment: `'left' | 'center' | 'right'`. Applied to the column's `<th>`.

package/dist/src/components/table/mono-table-th-core.d.ts

@@ -1,4 +1,5 @@
 import { Constructor } from "../../composables/hybird-prop.js";
+import { CssSizeValue } from "../../composables/css-size.js";
 import { MonoColumnSort, MonoDateFilter, MonoEditableTrigger, MonoHeaderFilter, SortOrder } from "./mono-data-grid.js";
 import { MonoTableMenuCoreInterface } from "./table-menu-core.js";
 import { LitElement, TemplateResult } from "lit";
@@ -26,6 +27,8 @@ export declare class MonoTableThCoreInterface extends MonoTableMenuCoreInterface
   dateFilter: boolean | MonoDateFilter;
   align?: TableThAlign;
   width?: string | number;
+  minWidth?: CssSizeValue;
+  maxWidth?: CssSizeValue;
   height?: string | number;
   protected renderSlot(name: TableThSlotName): TemplateResult;
   protected renderIcon(name: TableThIconName): TemplateResult;

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

@@ -305,8 +305,15 @@ export interface TableThProps extends TableControlBase {
    * `<td>` loop so the two sides cannot drift.
    */
   align?: 'left' | 'center' | 'right';
-  /** Column width, applied to the parent `<th>`. Number → px; string used as-is (`'10rem'`, `'40%'`). */
+  /**
+   * Column width, applied to the parent `<th>`. Number → px; string used as-is (`'10rem'`, `'40%'`).
+   * `'auto'` measures the column's content and writes the px to its `<col>` + `<th>`.
+   */
   width?: string | number;
+  /** Lower bound of the column width — clamps `width="auto"`. Number → px; `rem` / `em` too. */
+  minWidth?: string | number;
+  /** Upper bound of the column width — clamps `width="auto"`. */
+  maxWidth?: string | number;
   /** Header-cell height, applied to the parent `<th>`. Number → px; string used as-is. */
   height?: string | number;
 }

package/dist/src/components/tag-input/mono-tag-input.d.ts

@@ -27,6 +27,8 @@ export declare class MonoTagInput extends MonoTagInput_base {
    * `insertBefore(node, anchor)` against the sibling that mono had moved away.
    */
   private _slotList;
+  /** The consumer's `slot="select-all"` wrapper — held and placed as one node, like `_slotList`. */
+  private _slotSelectAll;
   connectedCallback(): void;
   protected updated(changed: Map<string, unknown>): void;
   /**
@@ -46,6 +48,14 @@ export declare class MonoTagInput extends MonoTagInput_base {
    * the consumer's scroll position and focus.
    */
   private _placeListSlot;
+  /**
+   * Move the select-all wrapper into the "All" row, once that row exists.
+   *
+   * The row only renders while the panel is open and has rows to select, so the target comes and
+   * goes. When Lit drops it the wrapper leaves WITH it, still inside the detached placeholder — it
+   * always keeps a parent, which is what the consumer's framework needs to keep patching it.
+   */
+  private _placeSelectAllSlot;
   private _captureSlots;
   /**
    * Adopt a wrapper that appeared after `connectedCallback` — see `LateSlotWatcher`.
@@ -59,6 +69,8 @@ export declare class MonoTagInput extends MonoTagInput_base {
    * anchors that are its OWN children, and those move with it.
    */
   protected _onLateListSlot(): void;
+  /** Adopt a late `slot="select-all"` wrapper — parked out of the host first, as above. */
+  protected _onLateSelectAllSlot(): void;
   private _placeSlot;
 }
 declare global {

package/dist/src/components/tag-input/mono-tag-input.shadow.d.ts

@@ -22,7 +22,9 @@ export declare class MonoTagInputShadow extends MonoTagInputShadow_base {
   private _onSlotChange;
   /** A wrapper appeared after connect — the flag is all this build needs, projection does the rest. */
   protected _onLateListSlot(): void;
-  /** Reconcile the 3 slot-presence flags from their slots' assigned content. */
+  /** Same for `slot="select-all"` — the flag swaps the row to its slotted shape. */
+  protected _onLateSelectAllSlot(): void;
+  /** Reconcile the 4 slot-presence flags from their slots' assigned content. */
   private _scanSlots;
   /**
    * The consumer's list wrapper, PROJECTED rather than moved.
@@ -32,6 +34,12 @@ export declare class MonoTagInputShadow extends MonoTagInputShadow_base {
    * would cut them off from it — the same reason this build inlines SVGs instead of icon classes.
    */
   protected renderListSlot(): TemplateResult;
+  /**
+   * The select-all content, projected — the panel stays in this shadow root, so a native `<slot>`
+   * reaches it and the page's CSS still styles what the consumer put there. Presence is read off
+   * the light child, never `slotchange` — see `_scanSlots`.
+   */
+  protected renderSelectAllSlot(): TemplateResult;
   /** Native `<slot>` carrying the prop fallback as native slot content. */
   protected _slotOutlet(name: TagInputSlotName, fallback?: unknown): TemplateResult;
   /** Inline SVG — the global `.mono-icon`/`i-mdi-close` UnoCSS icon can't reach a

package/dist/src/components/tag-input/tag-input-core.d.ts

@@ -1,12 +1,13 @@
 import { Constructor } from "../../composables/hybird-prop.js";
 import { CssSizeValue } from "../../composables/css-size.js";
 import { MonoSearchValue } from "../../search/data-search.js";
+import { FieldTooltipController, FieldTooltipValue } from "../../composables/field-tooltip.js";
 import { TagInputChipProps, TagInputColor, TagInputCssClass, TagInputDataSource, TagInputDisplayGroup, TagInputDisplayValue, TagInputDropdownOptions, TagInputItem, TagInputLoadMore, TagInputSize, TagInputValidationState, TagInputValue, TagInputVariant } from "./tag-input-types.js";
 import { LateSlotWatcher } from "../../composables/light-slots.js";
 import { LitElement, TemplateResult } from "lit";
 //#region src/components/tag-input/tag-input-core.d.ts
 /** Named slots projected by `mono-tag-input` (light: captured; shadow: native). */
-export type TagInputSlotName = 'label' | 'helper' | 'list';
+export type TagInputSlotName = 'label' | 'helper' | 'list' | 'select-all';
 /**
  * `MonoTagInputCore` — render-mode-agnostic logic for `mono-tag-input` (props,
  * hybrid aliases, array value/model sync, DataSource paging, search, grouping,
@@ -33,6 +34,14 @@ export declare class MonoTagInputCoreInterface {
   protected _onListSlotClick: (event: Event) => void;
   /** The list wrapper's parking spot, portal-aware. */
   protected readonly _listSlotTarget: HTMLElement | null;
+  /** True once a build has found a `slot="select-all"`; swaps the "All" label for it. */
+  protected _hasSelectAllSlotState: boolean;
+  protected _lateSelectAllSlot: LateSlotWatcher;
+  protected _onLateSelectAllSlot(): void;
+  /** Per-build render point for the consumer's select-all content. */
+  protected renderSelectAllSlot(): TemplateResult;
+  /** The select-all wrapper's target inside the "All" row, portal-aware. */
+  protected readonly _selectAllSlotTarget: HTMLElement | null;
   size: TagInputSize;
   color: TagInputColor;
   variant: TagInputVariant;
@@ -43,6 +52,8 @@ export declare class MonoTagInputCoreInterface {
   label: string;
   placeholder: string;
   helperText: string;
+  tooltip: FieldTooltipValue;
+  protected readonly _tooltip: FieldTooltipController;
   validationState: TagInputValidationState;
   validationMessage: string;
   errorMessage: string;

package/dist/src/components/tag-input/tag-input-types.d.ts

@@ -4,11 +4,16 @@ import { LoadMoreMode, MonoDataSource } from "../../composables/data-source-cont
 import { VisibilityProps } from "../../composables/visibility.js";
 import { MonoSearchValue } from "../../search/data-search.js";
 import { ChipBehaviour, ChipColor, ChipCssClass, ChipRounded, ChipSize, ChipVariant } from "../chip/chip-types.js";
+import { MonoTooltipOptions } from "../tooltip/tooltip-types.js";
 import { ChipLimitProps } from "../../composables/chip-limits.js";
 //#region src/components/tag-input/tag-input-types.d.ts
 export type TagInputSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
 export type TagInputColor = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'teal' | 'purple' | 'neutral' | 'dark';
 export type TagInputVariant = 'outlined' | 'filled' | 'underlined';
+/** Where the label sits: above the box (default), notched into its top border (inset for filled / underlined), or beside it. */
+export type TagInputLabelPosition = 'top' | 'notched' | 'left' | 'right';
+/** Where the validation message shows: under the box (default), behind a state icon inside it, or floating under it on hover / focus. */
+export type TagInputValidationPosition = 'bottom' | 'icon' | 'float';
 /**
  * Configuration for the tag chips inside the field, passed as one object:
  * `<mono-tag-input :chip.prop="{ size: 'md', shape: 'rounded', dot: true }">`.
@@ -115,6 +120,8 @@ export interface TagInputCssClass {
   groupLabel?: string;
   /** The leading "All" row. Sits alongside `item`, which it also carries. */
   selectAll?: string;
+  /** The box beside the "All" checkbox holding the consumer's `slot="select-all"` content. */
+  selectAllSlot?: string;
   item?: string;
   itemActive?: string;
   itemSelected?: string;
@@ -270,6 +277,24 @@ export interface TagInputProps extends VisibilityProps {
   color?: TagInputColor;
   /** Visual style of the tag input. */
   variant?: TagInputVariant;
+  /**
+   * Where the label sits: `top` (above the box, default), `notched` (on the top
+   * border for outlined; inset inside the box for filled / underlined), or
+   * `left` / `right` of the box. Knobs: `--mono-tag-input-label-width`, `-label-side-gap`,
+   * `-label-notch-font-size`, `-label-notch-bg`.
+   */
+  labelPosition?: TagInputLabelPosition;
+  'label-position'?: TagInputLabelPosition;
+  labelposition?: TagInputLabelPosition;
+  /**
+   * Where the validation message shows. `bottom` (default): the row under the box.
+   * `icon`: a state icon inside the box; hover / tap / keyboard focus shows the message in
+   * a state-coloured bubble. `float`: the message floats under the box only while the field
+   * is hovered or focused. In `icon` / `float` the row under the box keeps the helper text.
+   */
+  validationPosition?: TagInputValidationPosition;
+  'validation-position'?: TagInputValidationPosition;
+  validationposition?: TagInputValidationPosition;
   /**
    * Tag chip configuration — the `mono-chip` props to apply to every tag.
    * Bind it as a real property (`:chip.prop="{ size: 'md' }"`); a plain
@@ -284,6 +309,14 @@ export interface TagInputProps extends VisibilityProps {
   helperText?: string;
   'helper-text'?: string;
   helpertext?: string;
+  /**
+   * Info icon at the end of the label; hovering, focusing or tapping it shows this text.
+   * Plain text → a small built-in bubble (no dependency). Full tooltip options
+   * (`:tooltip.prop="{ content, placement, color }"`) → a `mono-tooltip`, which needs the
+   * optional `@floating-ui/dom` + `@floating-ui/core` peers (without them that form renders
+   * no icon). Shown only beside a label.
+   */
+  tooltip?: string | MonoTooltipOptions;
   /** Validation state controlling field styling. */
   validationState?: TagInputValidationState;
   'validation-state'?: TagInputValidationState;

package/dist/src/components/textarea/textarea-core.d.ts

@@ -1,5 +1,6 @@
 import { Constructor } from "../../composables/hybird-prop.js";
 import { CssSizeValue } from "../../composables/css-size.js";
+import { FieldTooltipController, FieldTooltipValue } from "../../composables/field-tooltip.js";
 import { TextareaColor, TextareaCssClass, TextareaSize, TextareaValidationState, TextareaVariant } from "./textarea-types.js";
 import { LitElement, TemplateResult } from "lit";
 //#region src/components/textarea/textarea-core.d.ts
@@ -25,6 +26,8 @@ export declare class MonoTextareaCoreInterface {
   placeholder: string;
   label: string;
   helperText: string;
+  tooltip: FieldTooltipValue;
+  protected readonly _tooltip: FieldTooltipController;
   validationState: TextareaValidationState;
   validationMessage: string;
   errorMessage: string;

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

@@ -1,8 +1,13 @@
 import { VisibilityProps } from "../../composables/visibility.js";
+import { MonoTooltipOptions } from "../tooltip/tooltip-types.js";
 //#region src/components/textarea/textarea-types.d.ts
 export type TextareaSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
 export type TextareaColor = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'teal' | 'purple' | 'neutral' | 'dark';
 export type TextareaVariant = 'outlined' | 'filled' | 'underlined';
+/** Where the label sits: above the box (default), notched into its top border (inset for filled / underlined), or beside it. */
+export type TextareaLabelPosition = 'top' | 'notched' | 'left' | 'right';
+/** Where the validation message shows: under the box (default), behind a state icon inside it, or floating under it on hover / focus. */
+export type TextareaValidationPosition = 'bottom' | 'icon' | 'float';
 export type TextareaValidationState = 'default' | 'valid' | 'invalid' | 'warning';
 export interface TextareaCssClass {
   root?: string;
@@ -40,6 +45,14 @@ export interface TextareaProps extends VisibilityProps {
   helperText?: string;
   'helper-text'?: string;
   helpertext?: string;
+  /**
+   * Info icon at the end of the label; hovering, focusing or tapping it shows this text.
+   * Plain text → a small built-in bubble (no dependency). Full tooltip options
+   * (`:tooltip.prop="{ content, placement, color }"`) → a `mono-tooltip`, which needs the
+   * optional `@floating-ui/dom` + `@floating-ui/core` peers (without them that form renders
+   * no icon). Shown only beside a label.
+   */
+  tooltip?: string | MonoTooltipOptions;
   /** Validation state controlling field styling. */
   validationState?: TextareaValidationState;
   'validation-state'?: TextareaValidationState;
@@ -62,6 +75,24 @@ export interface TextareaProps extends VisibilityProps {
   color?: TextareaColor;
   /** Visual style of the textarea. */
   variant?: TextareaVariant;
+  /**
+   * Where the label sits: `top` (above the box, default), `notched` (on the top
+   * border for outlined; inset inside the box for filled / underlined), or
+   * `left` / `right` of the box. Knobs: `--mono-textarea-label-width`, `-label-side-gap`,
+   * `-label-notch-font-size`, `-label-notch-bg`.
+   */
+  labelPosition?: TextareaLabelPosition;
+  'label-position'?: TextareaLabelPosition;
+  labelposition?: TextareaLabelPosition;
+  /**
+   * Where the validation message shows. `bottom` (default): the row under the box.
+   * `icon`: a state icon inside the box; hover / tap / keyboard focus shows the message in
+   * a state-coloured bubble. `float`: the message floats under the box only while the field
+   * is hovered or focused. In `icon` / `float` the row under the box keeps the helper text.
+   */
+  validationPosition?: TextareaValidationPosition;
+  'validation-position'?: TextareaValidationPosition;
+  validationposition?: TextareaValidationPosition;
   /** Disables interaction with the textarea. */
   disabled?: boolean;
   /** Makes the textarea read-only. */