@skdx/web-components 0.27.0 → 0.28.0

package/dist/form/FormMessage.d.cts

@@ -1,12 +1,9 @@
 import { LitElement } from 'lit';
 import type { ValiditySnapshot } from './validity.cjs';
 /**
- * `<skdx-form-message>` — a validation message for a `<skdx-form-field>`,
- * whose `id` matches the field's `aria-describedby`. Hidden until either
- * `force-match` is set, or the field has a validity snapshot that matches:
- * with `match`, only when that specific `ValidityState` flag (e.g.
- * `value-missing`) is true; without it, whenever the field is invalid at
- * all. Must be used inside `<skdx-form-field>`.
+ * `<skdx-form-message>` — validation message for a `<skdx-form-field>`.
+ * Hidden until its `match` condition is true, or `force-match` is set, or
+ * the field is invalid (if no `match` is given).
  *
  * @example
  * ```html
@@ -29,6 +26,7 @@ export declare class SkdxFormMessage extends LitElement {
     refresh(): void;
     private _sync;
     protected updated(): void;
+    private serverErrorText;
     render(): import("lit").TemplateResult<1>;
 }
 declare global {

package/dist/form/FormMessage.d.ts

@@ -1,12 +1,9 @@
 import { LitElement } from 'lit';
 import type { ValiditySnapshot } from './validity.js';
 /**
- * `<skdx-form-message>` — a validation message for a `<skdx-form-field>`,
- * whose `id` matches the field's `aria-describedby`. Hidden until either
- * `force-match` is set, or the field has a validity snapshot that matches:
- * with `match`, only when that specific `ValidityState` flag (e.g.
- * `value-missing`) is true; without it, whenever the field is invalid at
- * all. Must be used inside `<skdx-form-field>`.
+ * `<skdx-form-message>` — validation message for a `<skdx-form-field>`.
+ * Hidden until its `match` condition is true, or `force-match` is set, or
+ * the field is invalid (if no `match` is given).
  *
  * @example
  * ```html
@@ -29,6 +26,7 @@ export declare class SkdxFormMessage extends LitElement {
     refresh(): void;
     private _sync;
     protected updated(): void;
+    private serverErrorText;
     render(): import("lit").TemplateResult<1>;
 }
 declare global {

package/dist/form/FormMessage.js

@@ -1,8 +1,8 @@
-var n=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var r=(d,l,i,t)=>{for(var e=t>1?void 0:t?h(l,i):l,o=d.length-1,a;o>=0;o--)(a=d[o])&&(e=(t?a(l,i,e):a(e))||e);return t&&e&&n(l,i,e),e};import{css as f,html as m,LitElement as p}from"lit";import{property as c}from"lit/decorators.js";import{customElement as y}from"../internal/define.js";var s=class extends p{constructor(){super(...arguments);this.forceMatch=!1;this.fieldEl=null}connectedCallback(){super.connectedCallback(),this.fieldEl=this.closest("skdx-form-field"),this.fieldEl?.registerMessage(this),this._sync()}disconnectedCallback(){this.fieldEl&&this.fieldEl.unregisterMessage(this),super.disconnectedCallback()}refresh(){this._sync()}_sync(){let i=this.fieldEl;if(!i)return;this.id||(this.id=i.messageId);let t=i.validity,e=this.forceMatch;!e&&t&&(e=this.match?t[this.match]===!0:!t.valid),e?this.removeAttribute("hidden"):this.setAttribute("hidden","")}updated(){this._sync()}render(){return m`<slot></slot>`}};s.styles=f`
+var n=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var l=(d,o,t,r)=>{for(var e=r>1?void 0:r?f(o,t):o,s=d.length-1,h;s>=0;s--)(h=d[s])&&(e=(r?h(o,t,e):h(e))||e);return r&&e&&n(o,t,e),e};import{css as m,html as a,LitElement as p}from"lit";import{property as c,state as v}from"lit/decorators.js";import{FORM_MESSAGE_ATTRIBUTE as E}from"../field/field-core.js";import{customElement as y,whenUpgraded as u}from"../internal/define.js";import{formErrorText as b}from"./server-errors.js";var i=class extends p{constructor(){super(...arguments);this.forceMatch=!1;this.fieldEl=null;this.serverErrorText=""}connectedCallback(){super.connectedCallback(),this.setAttribute(E,""),this.fieldEl=this.closest("skdx-form-field"),this.fieldEl&&u(this.fieldEl,()=>{this.fieldEl?.registerMessage(this),this._sync()})}disconnectedCallback(){this.fieldEl&&this.fieldEl.unregisterMessage(this),super.disconnectedCallback()}refresh(){this._sync()}_sync(){let t=this.fieldEl;if(!t)return;this.id||(this.id=t.messageId);let r=this.match?[]:this.closest("skdx-form")?.serverErrors(t.name)??[];this.serverErrorText=b(r);let e=t.validity,s=this.forceMatch||r.length>0;!s&&e&&(s=this.match?e[this.match]===!0:!e.valid),s?this.removeAttribute("hidden"):this.setAttribute("hidden","")}updated(){this._sync()}render(){return this.serverErrorText?a`${this.serverErrorText}`:a`<slot></slot>`}};i.styles=m`
     :host {
       display: block;
     }
     :host([hidden]) {
       display: none;
     }
-  `,r([c({type:String})],s.prototype,"match",2),r([c({type:Boolean,attribute:"force-match"})],s.prototype,"forceMatch",2),s=r([y("skdx-form-message","form","message")],s);export{s as SkdxFormMessage};
+  `,l([c({type:String})],i.prototype,"match",2),l([c({type:Boolean,attribute:"force-match"})],i.prototype,"forceMatch",2),l([v()],i.prototype,"serverErrorText",2),i=l([y("skdx-form-message","form","message")],i);export{i as SkdxFormMessage};

package/dist/form/FormSubmit.d.cts

@@ -1,10 +1,7 @@
 import { LitElement } from 'lit';
 /**
- * `<skdx-form-submit>` — a submit button for a `<skdx-form>`. No native
- * `type="submit"`/form-owner relationship (there is no native `<form>` —
- * see `<skdx-form>`'s docs) — clicking it calls the ancestor `<skdx-form>`'s
- * `trySubmit()`, which runs native constraint validation before dispatching
- * `submit`.
+ * A submit button for `<skdx-form>`: calls `trySubmit()` on the ancestor form,
+ * which runs constraint validation before dispatching `submit`.
  *
  * @csspart submit - The native `<button>` element inside the shadow root.
  */

package/dist/form/FormSubmit.d.ts

@@ -1,10 +1,7 @@
 import { LitElement } from 'lit';
 /**
- * `<skdx-form-submit>` — a submit button for a `<skdx-form>`. No native
- * `type="submit"`/form-owner relationship (there is no native `<form>` —
- * see `<skdx-form>`'s docs) — clicking it calls the ancestor `<skdx-form>`'s
- * `trySubmit()`, which runs native constraint validation before dispatching
- * `submit`.
+ * A submit button for `<skdx-form>`: calls `trySubmit()` on the ancestor form,
+ * which runs constraint validation before dispatching `submit`.
  *
  * @csspart submit - The native `<button>` element inside the shadow root.
  */

package/dist/form/described-by.cjs

@@ -0,0 +1 @@
+"use strict";var o=Object.defineProperty;var t=Object.getOwnPropertyDescriptor;var d=Object.getOwnPropertyNames;var f=Object.prototype.hasOwnProperty;var u=(e,n)=>{for(var i in n)o(e,i,{get:n[i],enumerable:!0})},c=(e,n,i,r)=>{if(n&&typeof n=="object"||typeof n=="function")for(let s of d(n))!f.call(e,s)&&s!==i&&o(e,s,{get:()=>n[s],enumerable:!(r=t(n,s))||r.enumerable});return e};var g=e=>c(o({},"__esModule",{value:!0}),e);var p={};u(p,{mergeDescribedBy:()=>l});module.exports=g(p);function l(...e){let n=[];for(let i of e)for(let r of(i??"").split(/\s+/))r&&!n.includes(r)&&n.push(r);return n.length>0?n.join(" "):void 0}0&&(module.exports={mergeDescribedBy});

package/dist/form/described-by.d.cts

@@ -0,0 +1,8 @@
+/**
+ * Merges `aria-describedby` id lists instead of replacing one with another.
+ * Duplicates are dropped; order preserved so consumer descriptions are announced first.
+ *
+ * @param sources id lists (or single ids), most-consumer-owned first
+ * @returns the merged list, or `undefined` when there is nothing to describe with
+ */
+export declare function mergeDescribedBy(...sources: Array<string | null | undefined>): string | undefined;

package/dist/form/described-by.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Merges `aria-describedby` id lists instead of replacing one with another.
+ * Duplicates are dropped; order preserved so consumer descriptions are announced first.
+ *
+ * @param sources id lists (or single ids), most-consumer-owned first
+ * @returns the merged list, or `undefined` when there is nothing to describe with
+ */
+export declare function mergeDescribedBy(...sources: Array<string | null | undefined>): string | undefined;

package/dist/form/described-by.js

@@ -0,0 +1 @@
+function s(...i){let n=[];for(let r of i)for(let e of(r??"").split(/\s+/))e&&!n.includes(e)&&n.push(e);return n.length>0?n.join(" "):void 0}export{s as mergeDescribedBy};

package/dist/form/index.cjs

@@ -1 +1 @@
-"use strict";var e=Object.defineProperty;var l=Object.getOwnPropertyDescriptor;var b=Object.getOwnPropertyNames;var i=Object.prototype.hasOwnProperty;var s=(o,r)=>{for(var x in r)e(o,x,{get:r[x],enumerable:!0})},u=(o,r,x,t)=>{if(r&&typeof r=="object"||typeof r=="function")for(let m of b(r))!i.call(o,m)&&m!==x&&e(o,m,{get:()=>r[m],enumerable:!(t=l(r,m))||t.enumerable});return o};var g=o=>u(e({},"__esModule",{value:!0}),o);var n={};s(n,{SkdxForm:()=>S.SkdxForm,SkdxFormControl:()=>f.SkdxFormControl,SkdxFormErrorSummary:()=>a.SkdxFormErrorSummary,SkdxFormField:()=>d.SkdxFormField,SkdxFormLabel:()=>F.SkdxFormLabel,SkdxFormMessage:()=>k.SkdxFormMessage,SkdxFormSubmit:()=>p.SkdxFormSubmit});module.exports=g(n);var S=require("./Form.cjs"),d=require("./FormField.cjs"),F=require("./FormLabel.cjs"),f=require("./FormControl.cjs"),k=require("./FormMessage.cjs"),p=require("./FormSubmit.cjs"),a=require("./FormErrorSummary.cjs");0&&(module.exports={SkdxForm,SkdxFormControl,SkdxFormErrorSummary,SkdxFormField,SkdxFormLabel,SkdxFormMessage,SkdxFormSubmit});
+"use strict";var i=Object.defineProperty;var a=Object.getOwnPropertyDescriptor;var F=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var p=(r,o)=>{for(var e in o)i(r,e,{get:o[e],enumerable:!0})},S=(r,o,e,m)=>{if(o&&typeof o=="object"||typeof o=="function")for(let d of F(o))!k.call(r,d)&&d!==e&&i(r,d,{get:()=>o[d],enumerable:!(m=a(o,d))||m.enumerable});return r};var l=r=>S(i({},"__esModule",{value:!0}),r);var f={};p(f,{SkdxForm:()=>t.SkdxForm,SkdxFormField:()=>x.SkdxFormField});module.exports=l(f);var t=require("./Form.cjs"),x=require("./FormField.cjs");0&&(module.exports={SkdxForm,SkdxFormField});

package/dist/form/index.d.cts

@@ -1,7 +1,2 @@
-export { SkdxForm } from './Form.cjs';
+export { SkdxForm, type SkdxFormValidationBehavior, type SkdxFormValidationMode } from './Form.cjs';
 export { SkdxFormField } from './FormField.cjs';
-export { SkdxFormLabel } from './FormLabel.cjs';
-export { SkdxFormControl } from './FormControl.cjs';
-export { SkdxFormMessage } from './FormMessage.cjs';
-export { SkdxFormSubmit } from './FormSubmit.cjs';
-export { SkdxFormErrorSummary } from './FormErrorSummary.cjs';

package/dist/form/index.d.ts

@@ -1,7 +1,2 @@
-export { SkdxForm } from './Form.js';
+export { SkdxForm, type SkdxFormValidationBehavior, type SkdxFormValidationMode } from './Form.js';
 export { SkdxFormField } from './FormField.js';
-export { SkdxFormLabel } from './FormLabel.js';
-export { SkdxFormControl } from './FormControl.js';
-export { SkdxFormMessage } from './FormMessage.js';
-export { SkdxFormSubmit } from './FormSubmit.js';
-export { SkdxFormErrorSummary } from './FormErrorSummary.js';

package/dist/form/index.js

@@ -1 +1 @@
-import{SkdxForm as m}from"./Form.js";import{SkdxFormField as e}from"./FormField.js";import{SkdxFormLabel as S}from"./FormLabel.js";import{SkdxFormControl as F}from"./FormControl.js";import{SkdxFormMessage as k}from"./FormMessage.js";import{SkdxFormSubmit as a}from"./FormSubmit.js";import{SkdxFormErrorSummary as b}from"./FormErrorSummary.js";export{m as SkdxForm,F as SkdxFormControl,b as SkdxFormErrorSummary,e as SkdxFormField,S as SkdxFormLabel,k as SkdxFormMessage,a as SkdxFormSubmit};
+import{SkdxForm as d}from"./Form.js";import{SkdxFormField as i}from"./FormField.js";export{d as SkdxForm,i as SkdxFormField};

package/dist/form/primitives.cjs

@@ -0,0 +1 @@
+"use strict";var e=Object.defineProperty;var F=Object.getOwnPropertyDescriptor;var a=Object.getOwnPropertyNames;var b=Object.prototype.hasOwnProperty;var l=(o,r)=>{for(var x in r)e(o,x,{get:r[x],enumerable:!0})},s=(o,r,x,t)=>{if(r&&typeof r=="object"||typeof r=="function")for(let m of a(r))!b.call(o,m)&&m!==x&&e(o,m,{get:()=>r[m],enumerable:!(t=F(r,m))||t.enumerable});return o};var u=o=>s(e({},"__esModule",{value:!0}),o);var g={};l(g,{SkdxFormControl:()=>d.SkdxFormControl,SkdxFormErrorSummary:()=>p.SkdxFormErrorSummary,SkdxFormLabel:()=>S.SkdxFormLabel,SkdxFormMessage:()=>f.SkdxFormMessage,SkdxFormSubmit:()=>k.SkdxFormSubmit});module.exports=u(g);var S=require("./FormLabel.cjs"),d=require("./FormControl.cjs"),f=require("./FormMessage.cjs"),k=require("./FormSubmit.cjs"),p=require("./FormErrorSummary.cjs");0&&(module.exports={SkdxFormControl,SkdxFormErrorSummary,SkdxFormLabel,SkdxFormMessage,SkdxFormSubmit});

package/dist/form/primitives.d.cts

@@ -0,0 +1,28 @@
+/**
+ * Advanced primitives for `<skdx-form>` — the parts the recipe composes.
+ * `<skdx-form-field>` is on the main entry (placing it defines a field).
+ * These derive the rest, plus submit button label and error summary heading
+ * (which consumers supply).
+ *
+ * @example
+ * ```ts
+ * import * as Form from '@skdx/web-components/primitives/form';
+ * ```
+ * ```html
+ * <skdx-form>
+ *   <skdx-form-error-summary><h2>Problem</h2></skdx-form-error-summary>
+ *   <skdx-form-field name="email">
+ *     <skdx-form-label>Email</skdx-form-label>
+ *     <skdx-form-control><input type="email" required /></skdx-form-control>
+ *     <skdx-form-message match="valueMissing">Email is required.</skdx-form-message>
+ *     <skdx-form-message match="typeMismatch">Not an email.</skdx-form-message>
+ *   </skdx-form-field>
+ *   <skdx-form-submit>Submit</skdx-form-submit>
+ * </skdx-form>
+ * ```
+ */
+export { SkdxFormLabel } from './FormLabel.cjs';
+export { SkdxFormControl } from './FormControl.cjs';
+export { SkdxFormMessage } from './FormMessage.cjs';
+export { SkdxFormSubmit } from './FormSubmit.cjs';
+export { SkdxFormErrorSummary } from './FormErrorSummary.cjs';

package/dist/form/primitives.d.ts

@@ -0,0 +1,28 @@
+/**
+ * Advanced primitives for `<skdx-form>` — the parts the recipe composes.
+ * `<skdx-form-field>` is on the main entry (placing it defines a field).
+ * These derive the rest, plus submit button label and error summary heading
+ * (which consumers supply).
+ *
+ * @example
+ * ```ts
+ * import * as Form from '@skdx/web-components/primitives/form';
+ * ```
+ * ```html
+ * <skdx-form>
+ *   <skdx-form-error-summary><h2>Problem</h2></skdx-form-error-summary>
+ *   <skdx-form-field name="email">
+ *     <skdx-form-label>Email</skdx-form-label>
+ *     <skdx-form-control><input type="email" required /></skdx-form-control>
+ *     <skdx-form-message match="valueMissing">Email is required.</skdx-form-message>
+ *     <skdx-form-message match="typeMismatch">Not an email.</skdx-form-message>
+ *   </skdx-form-field>
+ *   <skdx-form-submit>Submit</skdx-form-submit>
+ * </skdx-form>
+ * ```
+ */
+export { SkdxFormLabel } from './FormLabel.js';
+export { SkdxFormControl } from './FormControl.js';
+export { SkdxFormMessage } from './FormMessage.js';
+export { SkdxFormSubmit } from './FormSubmit.js';
+export { SkdxFormErrorSummary } from './FormErrorSummary.js';

package/dist/form/primitives.js

@@ -0,0 +1 @@
+import{SkdxFormLabel as m}from"./FormLabel.js";import{SkdxFormControl as e}from"./FormControl.js";import{SkdxFormMessage as S}from"./FormMessage.js";import{SkdxFormSubmit as f}from"./FormSubmit.js";import{SkdxFormErrorSummary as p}from"./FormErrorSummary.js";export{e as SkdxFormControl,p as SkdxFormErrorSummary,m as SkdxFormLabel,S as SkdxFormMessage,f as SkdxFormSubmit};

package/dist/form/server-errors.cjs

@@ -0,0 +1 @@
+"use strict";var o=Object.defineProperty;var e=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var u=(r,t)=>{for(var i in t)o(r,i,{get:t[i],enumerable:!0})},d=(r,t,i,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of f(t))!g.call(r,n)&&n!==i&&o(r,n,{get:()=>t[n],enumerable:!(s=e(t,n))||s.enumerable});return r};var l=r=>d(o({},"__esModule",{value:!0}),r);var m={};u(m,{formErrorText:()=>c,normalizeFormErrors:()=>p});module.exports=l(m);function p(r){return r===void 0?[]:(Array.isArray(r)?r:[r]).filter(i=>typeof i=="string"&&i.trim()!=="")}function c(r){return r.join(" ")}0&&(module.exports={formErrorText,normalizeFormErrors});

package/dist/form/server-errors.d.cts

@@ -0,0 +1,12 @@
+/**
+ * The Form root's `errors` map — a form-level, name-keyed channel for errors
+ * the browser cannot derive: a server response, a cross-field rule, an async uniqueness check.
+ */
+export type FormErrors = Record<string, string | string[]>;
+/** Coerces one field's entry into a message list, dropping blanks. */
+export declare function normalizeFormErrors(entry: string | string[] | undefined): string[];
+/**
+ * One field's server errors as a single message.
+ * Multiple messages for one field are joined; `FormField` has exactly one `messageId`.
+ */
+export declare function formErrorText(messages: readonly string[]): string;

package/dist/form/server-errors.d.ts

@@ -0,0 +1,12 @@
+/**
+ * The Form root's `errors` map — a form-level, name-keyed channel for errors
+ * the browser cannot derive: a server response, a cross-field rule, an async uniqueness check.
+ */
+export type FormErrors = Record<string, string | string[]>;
+/** Coerces one field's entry into a message list, dropping blanks. */
+export declare function normalizeFormErrors(entry: string | string[] | undefined): string[];
+/**
+ * One field's server errors as a single message.
+ * Multiple messages for one field are joined; `FormField` has exactly one `messageId`.
+ */
+export declare function formErrorText(messages: readonly string[]): string;

package/dist/form/server-errors.js

@@ -0,0 +1 @@
+function n(r){return r===void 0?[]:(Array.isArray(r)?r:[r]).filter(t=>typeof t=="string"&&t.trim()!=="")}function o(r){return r.join(" ")}export{o as formErrorText,n as normalizeFormErrors};

package/dist/form/validity.d.cts

@@ -1,8 +1,6 @@
 /**
- * A plain-object mirror of the native `ValidityState` for one field, as
- * captured by `<skdx-form-control>` after a `checkValidity()`/`invalid`/
- * `blur`/`change` pass. Used by `<skdx-form-message>`'s `match` attribute to
- * target a specific failure reason.
+ * A plain-object snapshot of the native `ValidityState` for one field.
+ * Used by `<skdx-form-message>`'s `match` attribute to target failure reasons.
  */
 export interface ValiditySnapshot {
     badInput: boolean;

package/dist/form/validity.d.ts

@@ -1,8 +1,6 @@
 /**
- * A plain-object mirror of the native `ValidityState` for one field, as
- * captured by `<skdx-form-control>` after a `checkValidity()`/`invalid`/
- * `blur`/`change` pass. Used by `<skdx-form-message>`'s `match` attribute to
- * target a specific failure reason.
+ * A plain-object snapshot of the native `ValidityState` for one field.
+ * Used by `<skdx-form-message>`'s `match` attribute to target failure reasons.
  */
 export interface ValiditySnapshot {
     badInput: boolean;

package/dist/heading/Heading.cjs

@@ -0,0 +1,5 @@
+"use strict";var i=Object.defineProperty;var n=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var b=(r,e)=>{for(var o in e)i(r,o,{get:e[o],enumerable:!0})},E=(r,e,o,l)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of v(e))!g.call(r,t)&&t!==o&&i(r,t,{get:()=>e[t],enumerable:!(l=n(e,t))||l.enumerable});return r};var L=r=>E(i({},"__esModule",{value:!0}),r),a=(r,e,o,l)=>{for(var t=l>1?void 0:l?n(e,o):e,d=r.length-1,m;d>=0;d--)(m=r[d])&&(t=(l?m(e,o,t):m(t))||t);return l&&t&&i(e,o,t),t};var T={};b(T,{SkdxHeading:()=>s});module.exports=L(T);var h=require("lit"),p=require("lit/decorators.js"),c=require("lit/static-html.js"),f=require("../internal/define.cjs"),u=require("../internal/styles.cjs"),y=require("../utils/polymorphic.cjs");var s=class extends h.LitElement{constructor(){super(...arguments);this.visuallyHidden=!1}updated(){this.classList.toggle("skdx-visually-hidden",this.visuallyHidden)}render(){let o=(0,y.resolveTag)(this.as,"h2");return c.html`<${o} part="heading"><slot></slot></${o}>`}};s.styles=[u.hiddenHostStyles,h.css`
+      :host {
+        display: block;
+      }
+    `],a([(0,p.property)({type:String,reflect:!0})],s.prototype,"as",2),a([(0,p.property)({type:Boolean,reflect:!0,attribute:"visually-hidden"})],s.prototype,"visuallyHidden",2),s=a([(0,f.customElement)("skdx-heading","heading","root")],s);0&&(module.exports={SkdxHeading});

package/dist/heading/Heading.d.cts

@@ -0,0 +1,34 @@
+import { LitElement } from 'lit';
+/**
+ * Renders an `<h1>`–`<h6>` named by `as`. Outline level and visual size are
+ * separate: `as` sets the outline level, `data-size` sets the visual size.
+ * No default for `as`: a default would recreate the heading-level-skip bug
+ * this component prevents.
+ *
+ * @example
+ * ```html
+ * <skdx-heading as="h2" data-size="lg">Revenue</skdx-heading>
+ * ```
+ *
+ * @csspart heading - The rendered heading element.
+ */
+export declare class SkdxHeading extends LitElement {
+    static styles: import("lit").CSSResult[];
+    /**
+     * Which heading element to render. Required: the document outline level
+     * is set here, not determined by the library.
+     */
+    as: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+    /**
+     * Hides the heading visually while keeping it in the accessibility tree.
+     * @default false
+     */
+    visuallyHidden: boolean;
+    protected updated(): void;
+    render(): import("lit").TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-heading': SkdxHeading;
+    }
+}

package/dist/heading/Heading.d.ts

@@ -0,0 +1,34 @@
+import { LitElement } from 'lit';
+/**
+ * Renders an `<h1>`–`<h6>` named by `as`. Outline level and visual size are
+ * separate: `as` sets the outline level, `data-size` sets the visual size.
+ * No default for `as`: a default would recreate the heading-level-skip bug
+ * this component prevents.
+ *
+ * @example
+ * ```html
+ * <skdx-heading as="h2" data-size="lg">Revenue</skdx-heading>
+ * ```
+ *
+ * @csspart heading - The rendered heading element.
+ */
+export declare class SkdxHeading extends LitElement {
+    static styles: import("lit").CSSResult[];
+    /**
+     * Which heading element to render. Required: the document outline level
+     * is set here, not determined by the library.
+     */
+    as: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+    /**
+     * Hides the heading visually while keeping it in the accessibility tree.
+     * @default false
+     */
+    visuallyHidden: boolean;
+    protected updated(): void;
+    render(): import("lit").TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'skdx-heading': SkdxHeading;
+    }
+}

package/dist/heading/Heading.js

@@ -0,0 +1,5 @@
+var m=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var l=(i,o,r,s)=>{for(var e=s>1?void 0:s?p(o,r):o,a=i.length-1,h;a>=0;a--)(h=i[a])&&(e=(s?h(o,r,e):h(e))||e);return s&&e&&m(o,r,e),e};import{css as n,LitElement as c}from"lit";import{property as d}from"lit/decorators.js";import{html as f}from"lit/static-html.js";import{customElement as u}from"../internal/define.js";import{hiddenHostStyles as y}from"../internal/styles.js";import{resolveTag as v}from"../utils/polymorphic.js";var t=class extends c{constructor(){super(...arguments);this.visuallyHidden=!1}updated(){this.classList.toggle("skdx-visually-hidden",this.visuallyHidden)}render(){let r=v(this.as,"h2");return f`<${r} part="heading"><slot></slot></${r}>`}};t.styles=[y,n`
+      :host {
+        display: block;
+      }
+    `],l([d({type:String,reflect:!0})],t.prototype,"as",2),l([d({type:Boolean,reflect:!0,attribute:"visually-hidden"})],t.prototype,"visuallyHidden",2),t=l([u("skdx-heading","heading","root")],t);export{t as SkdxHeading};

package/dist/heading/index.cjs

@@ -0,0 +1 @@
+"use strict";var x=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var i=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var m=(e,d)=>{for(var r in d)x(e,r,{get:d[r],enumerable:!0})},n=(e,d,r,a)=>{if(d&&typeof d=="object"||typeof d=="function")for(let o of i(d))!k.call(e,o)&&o!==r&&x(e,o,{get:()=>d[o],enumerable:!(a=g(d,o))||a.enumerable});return e};var p=e=>n(x({},"__esModule",{value:!0}),e);var t={};m(t,{SkdxHeading:()=>f.SkdxHeading});module.exports=p(t);var f=require("./Heading.cjs");0&&(module.exports={SkdxHeading});

package/dist/heading/index.d.cts

@@ -0,0 +1 @@
+export { SkdxHeading } from './Heading.cjs';

package/dist/heading/index.d.ts

@@ -0,0 +1 @@
+export { SkdxHeading } from './Heading.js';

package/dist/heading/index.js

@@ -0,0 +1 @@
+import{SkdxHeading as o}from"./Heading.js";export{o as SkdxHeading};

package/dist/hover-card/HoverCard.cjs

@@ -1,5 +1 @@
-"use strict";var p=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var T=Object.getOwnPropertyNames;var y=Object.prototype.hasOwnProperty;var b=(i,e)=>{for(var t in e)p(i,t,{get:e[t],enumerable:!0})},O=(i,e,t,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of T(e))!y.call(i,s)&&s!==t&&p(i,s,{get:()=>e[s],enumerable:!(o=d(e,s))||o.enumerable});return i};var g=i=>O(p({},"__esModule",{value:!0}),i),r=(i,e,t,o)=>{for(var s=o>1?void 0:o?d(e,t):e,c=i.length-1,h;c>=0;c--)(h=i[c])&&(s=(o?h(e,t,s):h(s))||s);return o&&s&&p(e,t,s),s};var C={};b(C,{SkdxHoverCard:()=>n});module.exports=g(C);var l=require("lit"),a=require("lit/decorators.js"),m=require("../internal/define.cjs"),u=require("../internal/ids.cjs"),f=require("../internal/open-change-complete.cjs"),v=require("../internal/styles.cjs");var n=class extends l.LitElement{constructor(){super(...arguments);this.open=!1;this.defaultOpen=!1;this.openDelay=700;this.closeDelay=300;this.contentId=(0,u.nextId)("skdx-hover-card-content");this.triggerEl=null;this.ignoreNextFocus=!1;this.hasUpdatedOnce=!1}connectedCallback(){super.connectedCallback(),this.defaultOpen&&!this.hasAttribute("open")&&(this.open=!0)}disconnectedCallback(){this.clearTimers(),this.teardownOpenChangeComplete?.(),super.disconnectedCallback()}updated(t){let o=!this.hasUpdatedOnce;this.hasUpdatedOnce=!0,t.has("open")&&!o&&this.dispatchEvent(new CustomEvent("open-change",{detail:this.open,bubbles:!0,composed:!0})),t.size>0&&this.dispatchEvent(new CustomEvent("skdx-hover-card-internal-update")),t.has("open")&&!o&&(this.teardownOpenChangeComplete?.(),this.teardownOpenChangeComplete=(0,f.notifyOpenChangeComplete)(()=>this.querySelector("skdx-hover-card-content"),this.open,s=>this.dispatchEvent(new CustomEvent("open-change-complete",{detail:s,bubbles:!0,composed:!0}))))}setOpen(t){this.open!==t&&(this.open=t)}clearTimers(){clearTimeout(this.openTimer),clearTimeout(this.closeTimer)}openNow(){this.clearTimers(),this.setOpen(!0)}close(){this.clearTimers(),this.setOpen(!1)}scheduleOpen(){this.clearTimers(),this.openTimer=setTimeout(()=>this.setOpen(!0),this.openDelay)}scheduleClose(){this.clearTimers(),this.closeTimer=setTimeout(()=>this.setOpen(!1),this.closeDelay)}cancelClose(){this.clearTimers()}focusTrigger(){this.triggerEl?.focus()}render(){return l.html`<slot></slot>`}};n.styles=[v.hiddenHostStyles,l.css`
-      :host {
-        display: contents;
-      }
-    `],r([(0,a.property)({type:Boolean,reflect:!0})],n.prototype,"open",2),r([(0,a.property)({type:Boolean,attribute:"default-open"})],n.prototype,"defaultOpen",2),r([(0,a.property)({type:Number,attribute:"open-delay"})],n.prototype,"openDelay",2),r([(0,a.property)({type:Number,attribute:"close-delay"})],n.prototype,"closeDelay",2),n=r([(0,m.customElement)("skdx-hover-card")],n);0&&(module.exports={SkdxHoverCard});
+"use strict";var m=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var u=Object.prototype.hasOwnProperty;var w=(r,t)=>{for(var e in t)m(r,e,{get:t[e],enumerable:!0})},v=(r,t,e,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of g(t))!u.call(r,o)&&o!==e&&m(r,o,{get:()=>t[o],enumerable:!(n=h(t,o))||n.enumerable});return r};var E=r=>v(m({},"__esModule",{value:!0}),r),a=(r,t,e,n)=>{for(var o=n>1?void 0:n?h(t,e):t,p=r.length-1,d;p>=0;p--)(d=r[p])&&(o=(n?d(t,e,o):d(o))||o);return n&&o&&m(t,e,o),o};var F={};w(F,{SkdxHoverCard:()=>i});module.exports=E(F);var c=require("lit"),s=require("lit/decorators.js"),f=require("../internal/authored.cjs"),y=require("../internal/define.cjs"),l=require("./HoverCardAnatomy.cjs"),A=require("./HoverCardRoot.cjs");var i=class extends A.SkdxHoverCardRoot{constructor(){super(...arguments);this.side="bottom";this.align="center";this.showArrow=!1;this._anatomyFilledFor="";this.fillAnatomy=()=>{let e=String(this.showArrow);e!==this._anatomyFilledFor||!(0,f.hasGeneratedContent)(this,l.HOVER_CARD_ANATOMY_GENERATED)?(this._anatomyFilledFor=e,(0,l.fillHoverCardAnatomy)(this)):(0,l.refreshHoverCardAnatomy)(this)}}connectedCallback(){super.connectedCallback(),queueMicrotask(this.fillAnatomy)}updated(e){this.fillAnatomy(),super.updated(e)}render(){return c.html`<slot @slotchange=${this.fillAnatomy}></slot>`}};a([(0,s.property)({type:String})],i.prototype,"href",2),a([(0,s.property)({type:String})],i.prototype,"side",2),a([(0,s.property)({type:String})],i.prototype,"align",2),a([(0,s.property)({type:Boolean,attribute:"show-arrow"})],i.prototype,"showArrow",2),i=a([(0,y.customElement)("skdx-hover-card")],i);0&&(module.exports={SkdxHoverCard});

package/dist/hover-card/HoverCard.d.cts

@@ -1,81 +1,54 @@
-import { LitElement } from 'lit';
+import type { Align, Side } from '../internal/positioning.cjs';
+import { SkdxHoverCardRoot } from './HoverCardRoot.cjs';
 /**
- * `<skdx-hover-card>` — the Web Components implementation of the shared
- * HoverCard contract (see `@skdx/shared`'s `hoverCardContract`). Owns open
- * state with independent open/close delays and hands it down to
- * `<skdx-hover-card-trigger>` / `<skdx-hover-card-content>`, which look it up
- * via `closest('skdx-hover-card')` and re-render on the
- * `skdx-hover-card-internal-update` event this element dispatches whenever
- * `open` changes — the same shared-state pattern `<skdx-select>`/
- * `<skdx-popover>` use.
+ * Renders canonical hover card anatomy: trigger from `slot="trigger"`
+ * children with optional link target, and content card holding remaining
+ * children with optional arrow. Children are always card body, never parts.
  *
- * Unlike `<skdx-tooltip>`, the pointer can move from the trigger onto the
- * content itself without the card closing — `<skdx-hover-card-content>`
- * cancels the pending close timer on pointer-enter.
- *
- * Renders only a `<slot>`.
+ * For hand composition, use `<skdx-hover-card-root>` from
+ * `@skdx/web-components/primitives/hover-card`.
  *
  * @example
  * ```html
- * <skdx-hover-card>
- *   <skdx-hover-card-trigger href="/users/kent">@kentcdodds</skdx-hover-card-trigger>
- *   <skdx-hover-card-content>Kent C. Dodds</skdx-hover-card-content>
+ * <skdx-hover-card href="/users/kent">
+ *   <span slot="trigger">@kentcdodds</span>
+ *   Kent C. Dodds
  * </skdx-hover-card>
  * ```
  *
  * @fires open-change - Fired with the new open state whenever it changes, controlled or not.
- * @fires open-change-complete - Fired with the new open state after `<skdx-hover-card-content>`'s enter or exit animation has finished — as soon as the content has settled, when it declares no animation at all. Not cancelable: the change has already happened.
+ * @fires open-change-complete - Fired once the content's enter or exit animation finishes, or as soon as it settles when it declares none; not cancelable.
  */
-export declare class SkdxHoverCard extends LitElement {
-    static styles: import("lit").CSSResult[];
+export declare class SkdxHoverCard extends SkdxHoverCardRoot {
     /**
-     * Whether the card is currently open and visible.
-     * @default false
+     * Link target for the derived trigger, and a keyboard or touch user's only route to what the card previews.
+     * @default undefined — a plain, non-navigating trigger.
      */
-    open: boolean;
+    href?: string;
     /**
-     * Initial open state, for uncontrolled usage. Applied once, on connect,
-     * and only if `open` wasn't already set.
-     * @default false
+     * Preferred edge of the trigger the derived content card is placed against.
+     * @default 'bottom'
      */
-    defaultOpen: boolean;
+    side: Side;
     /**
-     * Delay before the card opens on pointer enter (ms).
-     * @default 700
+     * Preferred alignment along the `side` edge; the floating layer may shift it to keep the card in the viewport.
+     * @default 'center'
      */
-    openDelay: number;
+    align: Align;
     /**
-     * Delay before the card closes after the pointer leaves both the trigger
-     * and the content (ms).
-     * @default 300
+     * Whether the derived content includes an arrow pointing back at the trigger.
+     * @default false
      */
-    closeDelay: number;
-    readonly contentId: string;
-    /** @internal Set by `<skdx-hover-card-trigger>` once its native anchor mounts. */
-    triggerEl: HTMLElement | null;
-    /** @internal Set right before refocusing the trigger after a dismiss, so its own focus handler doesn't reopen it. */
-    ignoreNextFocus: boolean;
-    private openTimer?;
-    private closeTimer?;
-    private hasUpdatedOnce;
-    private teardownOpenChangeComplete?;
+    showArrow: boolean;
+    private _anatomyFilledFor;
     connectedCallback(): void;
-    disconnectedCallback(): void;
+    /**
+     * Draws the canonical anatomy into the light DOM. Rebuilding tears down
+     * positioning state, so it's gated on the key that changes the anatomy's
+     * shape; `href`/`side`/`align` refresh in place instead.
+     */
+    private readonly fillAnatomy;
     protected updated(changed: Map<string, unknown>): void;
-    private setOpen;
-    private clearTimers;
-    /** @internal Opens immediately, e.g. on focus. */
-    openNow(): void;
-    /** @internal Closes immediately, cancelling any pending timer, e.g. on Escape. */
-    close(): void;
-    /** @internal Opens after `openDelay`, e.g. on trigger pointer-enter. */
-    scheduleOpen(): void;
-    /** @internal Closes after `closeDelay`, e.g. on trigger/content pointer-leave. */
-    scheduleClose(): void;
-    /** @internal Cancels a pending close, e.g. when the pointer enters the content. */
-    cancelClose(): void;
-    /** @internal */
-    focusTrigger(): void;
     render(): import("lit").TemplateResult<1>;
 }
 declare global {