import{type PropertyValues,type TemplateResult}from'lit';import type{LyraEventDetailSnapshot}from'../../../internal/lyra-element.js';import{LyraElement}from'../../../internal/lyra-element.js';import type{LyraSize}from'../../../internal/variants.js';import type{LyraOrientation}from'../../../internal/shared-unions.js';import type{LyraCheckbox}from'../checkbox/checkbox.class.js';import{type FormOwnerValue}from'../../../internal/form-associated.js'; /** The group-level proposal one owned checkbox's pending toggle translates into. */ export interface LyraCheckboxGroupToggleRequestDetail{ /** The group value that would result from the proposed toggle, in DOM order. */ readonly value:readonly string[]; /** The group value as it stands while the request is dispatched. */ readonly previousValue:readonly string[]; /** The checkbox the user acted on. */ readonly option:LyraCheckbox;}export interface LyraCheckboxGroupEventMap{'lr-invalid':CustomEvent;input:CustomEvent>;change:CustomEvent>;'lr-change':CustomEvent>;'lr-checkbox-group-toggle-request':CustomEvent>;}export type CheckboxGroupOrientation=LyraOrientation; /** * `` — a form-associated group of `` elements. * Long label/hint/error content and horizontal option labels remain contained in a 320px LTR or * RTL allocation; options wrap without shrinking their checkbox targets. * Its fieldset owns aggregate `aria-invalid` state and, while required, a localized hidden * requiredness description that composes with existing hint/error relationships without marking * every child checkbox required. A host `aria-describedby` is resolved onto that fieldset before * its own hint/error/required descriptions, preserving external guidance across the shadow * boundary. Host `aria-labelledby` is deliberately not projected: the native legend supplies the * group's visible label relationship. * * @customElement lr-checkbox-group * @slot - `` children. * @slot label - Visible group label. * @slot hint - Supporting text. * @slot error - Custom validation message. * @event input - User selection changed. * @event change - User selection changed. * @event lr-change - User selection changed; detail is `{ value: string[] }`. Not fired for a * toggle a listener refused through `lr-checkbox-group-toggle-request`. * @event lr-checkbox-group-toggle-request - One owned checkbox is about to toggle; * `detail: { value, previousValue, option }` carries the group value that *would* result, the * value as it stands right now, and the checkbox the user acted on. Cancelable: calling * `preventDefault()` keeps the current state, so the option never flips at all rather than * flipping and snapping back -- which is what lets a host refuse "uncheck the last remaining * option" (`detail.value.length === 0`) with no flicker -- and no `input`/`change`/`lr-change` * follows. A listener may instead resolve the request by assigning the group's `value` itself * during the dispatch, which suppresses the option's own write the same way. The owned checkbox's * `lr-checkbox-toggle-request` is consumed and republished as this event, exactly as the group * already translates a child's `input`/`change`/`lr-change` into its own. * @event lr-invalid - The aggregate checkbox group failed a validity check. Cancelable: calling * `preventDefault()` also cancels the native `invalid` event behind it, suppressing the * browser's own validation bubble so an app can present the failure its own way. * @cssstate required - Matches while `required` is set. Style with * `lr-checkbox-group:state(required)`. * @cssstate optional - Matches while `required` is not set — the complement of `required`. * @cssstate valid - Matches while the group satisfies its constraints, including any * `setCustomValidity()` error. * @cssstate invalid - Matches while it does not — from the very first render, before the user has * touched anything. * @cssstate user-valid - `valid`, but only after the user has interacted: toggling one of the * group's checkboxes, a blur, `reportValidity()`, or a submission attempt. Not after a silent * `checkValidity()` alone. * @cssstate user-invalid - `invalid` after that same interaction. Style validation errors with this * rather than `invalid`: a pristine required group is genuinely invalid, but colouring it red * before the user has done anything is hostile. * @csspart form-control - Group wrapper. * @csspart form-control-label - Label. * @csspart options - Checkbox collection. * @csspart form-control-input - WA name for the same checkbox collection. * @csspart hint - Supporting text. * @csspart error - Validation message. * @cssprop [--lr-checkbox-group-row-gap=calc(var(--lr-form-control-height) * 0.1)] - Vertical gap * between the group's label, options and messages, scaled by `size`. * @cssprop [--lr-checkbox-group-option-gap=calc(var(--lr-form-control-height) * 0.2)] - Gap between * adjacent options, scaled by `size`. * @cssprop [--lr-checkbox-group-invalid-border=var(--lr-color-danger)] - Border around the option * collection while invalid chrome is visible. * @cssprop [--gap=var(--lr-checkbox-group-option-gap)] - WA-compatible option gap. * @cssprop [--lr-form-control-required-content=' *'] - The required marker appended to * `form-control-label` while `required` is set. Set it to `''` to suppress the marker, or to any * other quoted string (`' (required)'`, a localized word) to replace it. * @cssprop [--lr-form-control-required-color=var(--lr-color-danger)] - Required-marker color, * themeable independently of error text and invalid borders. * @cssprop [--lr-form-control-required-offset=0] - Inline space between the label text and the * required marker. * @status stable * @since 4.0.0 */ export declare class LyraCheckboxGroup extends LyraElement{protected static readonly immutableEventDetails:readonly string[];protected static readonly identityEventDetailProperties:Readonly<{'lr-checkbox-group-toggle-request':readonly string[];}>;static formAssociated:boolean;static styles:import("lit").CSSResultGroup[];static properties:{customError:{attribute:string;reflect:boolean;noAccessor:boolean;};name:{reflect:boolean;noAccessor:boolean;};required:{type:BooleanConstructor;reflect:boolean;noAccessor:boolean;};disabled:{type:BooleanConstructor;reflect:boolean;noAccessor:boolean;};size:{reflect:boolean;};orientation:{reflect:boolean;};value:{attribute:boolean;noAccessor:boolean;};}; /** * Size of the group's own chrome, on the library's shared ladder. Accepts both spellings of every * tier — `2xs`/`xs`/`s`/`m`/`l`/`xl` and Web Awesome's `small`/`medium`/`large` — so migrating * either way is a tag rename. Scales the group's label type size and the gaps around and between * its options off the same `--lr-form-control-*` values the controls themselves use, and * propagates the selected tier to every owned checkbox so the aggregate control stays coherent. * * When omitted, each checkbox keeps its authored size, matching the mirrored upstream default. * An explicit group size temporarily overrides every owned checkbox; removal/reparenting restores * the latest author value rather than leaving owner state behind. */ size?:LyraSize; /** Option flow and the matching WA public attribute. */ orientation:CheckboxGroupOrientation;label:string;hint:string; /** SSR slot-presence hint for label content unavailable before hydration. */ withLabel:boolean; /** SSR slot-presence hint for hint content unavailable before hydration. */ withHint:boolean;errorText:string;accessibleLabel:string;private touched; /** Whether the user has acted on this group yet, which is what gates the `user-valid`/ * `user-invalid` custom states. Deliberately separate from `touched` (which drives the visible * `data-invalid`/`aria-invalid` pair and is set on blur alone): toggling a child checkbox is an * interaction the instant it happens, and so is interactive validation — `reportValidity()` and * a submission attempt alike, via `installInteractionOnInvalid()` — exactly as it does for * native `:user-invalid`. A silent `checkValidity()` alone never counts. Not `@state`: nothing * in `render()` reads it. */ private hasInteracted;private hasLabelSlot;private hasHintSlot;private hasErrorSlot;private internals;private validityController; /** Consumer-supplied validation message reflected through `custom-error`. */ customError:string|null;private labelId;private hintId;private errorId;private requiredDescriptionId;private externalDescriptionLease?;private requiredDescriptionLease?;private requiredDescriptionTarget?;private _fieldsetDisabled;private _name;private _required;private _disabled;private _value;private pendingRestoreValues?; /** A `value` assignment made before any checkbox child existed; applied on the next slotchange. */ private pendingValues?;private childObserver?;private childObserverDocument?;private childObserverGeneration;private childControllers;private toggleGuard;private authoredChildSizes; /** The form submission key each checked child checkbox's value is grouped under in the group's * own `FormData` entry (see `sync()`). Reflected synchronously for native form APIs; renaming * rebuilds that `FormData` in the same tick -- mirrors ``'s identical `name` setter. */ get name():string;set name(next:string); /** Checked child values, in DOM order. Reading returns a frozen defensive snapshot, so mutating * the returned array never changes the group -- assign a new array instead. * * Assigning mirrors the array onto the owned checkboxes: a child whose `value` (defaulting to * `'on'`) appears in the array becomes checked, every other child becomes unchecked, and * duplicate entries check that many same-valued children. Assignment is controlled input, so it * emits no `lr-change`; only user interaction does. Values naming no child are ignored. * * This used to be a getter with no setter. Reading it was fine, but `.value=${...}` -- the * binding every other form control in this library accepts -- compiles to a plain property * assignment that `readonly` cannot catch at the binding site, so it threw * "Cannot set property value ... which has only a getter" from inside lit-html during a *later* * render, pointing at framework internals rather than the offending line. */ get value():readonly string[];set value(next:readonly string[]|null|undefined);get required():boolean;set required(next:boolean);get disabled():boolean;set disabled(next:boolean);constructor();private markInteracted;private checkboxGroupOwner;private ownsCheckbox;private get boxes(); /** Whether the group is disabled explicitly or by an ancestor fieldset. */ get effectiveDisabled():boolean;private propagateDisabled;private propagateSize;private readValue;private warnOnDuplicateValues;private sync; /** Shared with every other form control: disabled (own or fieldset-cascaded) bars validation. */ private get barredFromValidation(); /** Republishes the six validity custom states (`required`/`optional`, `valid`/`invalid`, * `user-valid`/`user-invalid`) from whatever `ElementInternals` currently holds, and the * `data-invalid` styling hook alongside them. Called from every path that can move either * validity or the interaction flag. */ private reflectValidityStates;private isOwnedCheckbox;private onChildEvent; /** The group value that would result if `option` took `proposed`, in DOM order. */ private projectedValue;private onChildToggleRequest;private reconcileChildControllers;private onChildMutations;private hasDirectSupportSlot;private onSlotChange; /** Checks exactly the children named by `values`, matching duplicates one-for-one, then re-syncs * the owned value/validity. Shared by the `value` setter and by form restore. */ private applyValues; /** Applies a restore only once real option children exist; FACE callbacks may run before them. */ private applyPendingRestore; /** Applies a `value` assignment that arrived before any checkbox child existed. */ private applyPendingValues;connectedCallback():void;private armChildObserver;disconnectedCallback():void;adoptedCallback():void;private resetChildObserver;protected firstUpdated(changed:PropertyValues):void;protected updated(changed:PropertyValues):void; /** Resolves host-owned descriptions ahead of the fieldset's own form-control descriptions. */ private syncExternalDescription;private releaseExternalDescription; /** Owns only the aggregate requiredness text; hint and error remain Lit's baseline relationship. */ private syncRequiredDescription;private releaseRequiredDescription;get form():HTMLFormElement|null;set form(owner:FormOwnerValue);getForm():HTMLFormElement|null;get labels():NodeList;get validity():ValidityState;get validationMessage():string;get willValidate():boolean;checkValidity():boolean;reportValidity():boolean; /** * Sets or clears a consumer-supplied validation error — the standard channel for a server-side * rejection ("that combination of topics is not available") that no client-side constraint can * express. A non-empty `message` raises `customError` and becomes `validationMessage`, so the * group fails `checkValidity()`, blocks form submission, and matches `:state(invalid)`; `''` * clears it. * * Clearing restores the group's own computed validity rather than forcing it valid: a required * group with nothing checked stays `valueMissing`. The custom error also survives every * intrinsic recomputation in between (`sync()` re-runs on each child toggle, slot change and * `name`/`required` change) and a form reset, exactly like a native control — only another * `setCustomValidity('')` clears it. * * The message is caller-supplied content, so it is used verbatim and never localized here. */ setCustomValidity(message:string):void; /** Synchronous disabled truth, including a fieldset cascade not yet reflected by callbacks. */ private get liveDisabled();private firstEnabledBox; /** Moves focus to the first enabled checkbox. */ focus(options?:FocusOptions):void; /** Removes focus from whichever owned checkbox currently contains the deep active element. */ blur():void; /** Activates the first enabled checkbox, matching native `click()` rather than acting as focus. */ click():void;formResetCallback():void;formStateRestoreCallback(state:string|File|FormData|null,_mode?:'restore'|'autocomplete'):void;formDisabledCallback(disabled:boolean):void;render():TemplateResult;}declare global{interface HTMLElementTagNameMap{'lr-checkbox-group':LyraCheckboxGroup;}}