@sankhyatronics/sankhya-cms 0.2.0 → 0.3.0

package/dist/cms-theme.css

@@ -25,6 +25,28 @@
   --st-cms-navy: #011d41;
   --st-cms-highlight: #49cce0;
   --st-cms-on-dark: #ffffff;
+
+  /* Sankhyatronics brand blues for the design-system options (pill buttons, title highlights,
+     plan cards). Fixed like the navy/cyan above; each has a fallback so the tokens work unthemed. */
+  --st-cms-brand-navy: #2144aa;
+  --st-cms-brand-azure: #1b91dd;
+  /* A second, lighter navy for panels on the dark band, and its hairline border and muted text. */
+  --st-cms-navy-2: #03346b;
+  --st-cms-navy-2-border: #0c64c5;
+  --st-cms-on-navy-muted: #c9d7fe;
+  /* Light blue ramp: 100 for soft tiles and chips, 200 for hairline borders, 400 for outlines on
+     brand fills. */
+  --st-cms-primary-100: #eaf0ff;
+  --st-cms-primary-200: #cbd9fb;
+  --st-cms-primary-400: #8eaffe;
+  /* The page-level tint behind the step cards of a band and the plan-card surfaces. */
+  --st-cms-surface-soft: #f0f3ff;
+  /* Text colours for light surfaces, split from the fills above: a navy fill and navy text share one
+     value today, and a dark theme needs them apart. */
+  --st-cms-text: #03346b;          /* body text on light surfaces */
+  --st-cms-text-strong: #011d41;   /* headings / strong text on light surfaces */
+  --st-cms-eyebrow: #0c64c5;       /* small uppercase labels */
+  --st-cms-accent-text: #2144aa;   /* navy used as text or outline (outlined buttons, links, icons) */
 }
 
 :root.dark {

package/dist/contact-form/index.d.ts

@@ -0,0 +1,220 @@
+import * as lit from 'lit';
+import { LitElement } from 'lit';
+
+/**
+ * The DOM-free logic behind `st-contact-form`: the client-side checks, the request body, the call itself
+ * and the reading of its answer. The server's rules stay authoritative; the checks here only give the
+ * visitor an answer before a request is made. Kept apart from `ContactForm.ts` so every rule and every
+ * response case can be unit-tested without a browser.
+ */
+/** The fields, in the order the form shows them. Focus moves through them in this order. */
+declare const CONTACT_FIELD_NAMES: readonly ["name", "email", "company", "phone", "topic", "message", "consent"];
+type ContactFieldName = (typeof CONTACT_FIELD_NAMES)[number];
+/** One choice in the topic list. `group` puts it under an `<optgroup>` with that label. */
+interface ContactTopic {
+    value: string;
+    label: string;
+    group?: string;
+}
+/**
+ * The client-side messages. `{field}`, `{max}`, `{min}` are filled in. The server's messages are shown
+ * as the server sends them, so these are the only text the component writes itself.
+ */
+interface ContactErrorMessages {
+    required: string;
+    tooLong: string;
+    invalidEmail: string;
+    invalidPhone: string;
+    unknownTopic: string;
+    messageTooShort: string;
+    messageTooLong: string;
+    consentRequired: string;
+}
+/** Field name to message, for the fields that have one. */
+type ContactErrors = Partial<Record<ContactFieldName, string>>;
+/** What a submission came back with, already interpreted. */
+type ContactSubmitResult = {
+    kind: 'sent';
+    reference?: string;
+} | {
+    kind: 'validation';
+    errors: ContactErrors;
+    formMessage?: string;
+} | {
+    kind: 'rate_limited';
+    retryAfterSeconds?: number;
+} | {
+    kind: 'unavailable';
+};
+
+/**
+ * A contact form for a website: name, work e-mail, company, an optional phone, a topic, a message and a
+ * required consent box. It posts the answers as JSON to `endpoint` and shows what came back: a success
+ * note (with the reference, when the API gives one), field messages from the server, or a short note when
+ * the message could not be sent. The text the server sends is never shown. Only the component's own
+ * labels and messages, plus the server's per-field messages, appear on the page.
+ *
+ * Every rule is checked in the browser first, the same rules the server applies, so a visitor sees the
+ * problem before anything is sent. The server still decides, and a field it rejects is shown with its
+ * message while the visitor's input is kept. A hidden honeypot field (`website`) must stay empty.
+ *
+ * `topics` lists the choices, grouped by each item's `group`. The topic is preselected from the page URL:
+ * `?product=` wins, then `?topic=`, each when it names one of the topics. `default-topic` is the fallback.
+ * An "About:" pill shows when the URL chose the topic.
+ *
+ * The form does not clear the message on an error, and the button is disabled while a request is in
+ * flight. Removing the element aborts a request that has not finished.
+ *
+ * When three or more fields fail, a summary (`role="alert"`) at the top of the form lists each error as a link
+ * to its field, and focus moves to the summary. With one or two failing fields, focus goes to the first one.
+ *
+ * The notes for a network failure or a rate limit may contain `{mailto}`; it becomes a `mailto:` link to the
+ * `mailto` address. A message the server sends is shown as plain text and is never given a link.
+ *
+ * The message counter appears from 80% of the limit. Screen readers are told when it passes 80%, 90% and the limit.
+ *
+ * None of the events carries personal data (no name, e-mail, company, phone or message text).
+ *
+ * @fires st-contact-form-submit - Bubbles and is composed. Detail `{ topic: string }` (the chosen topic's value). The checks passed and the request is about to be sent.
+ * @fires st-contact-form-sent - Bubbles and is composed. Detail `{ reference?: string }`. The form has been cleared.
+ * @fires st-contact-form-error - Bubbles and is composed. Detail `{ kind: 'validation' | 'rate_limited' | 'unavailable' }`. The input is kept.
+ * @csspart form - The form.
+ * @csspart field - Each field's wrapper (label, control and error).
+ * @csspart label - Each field's label.
+ * @csspart input - Each text input, the topic select and the message textarea.
+ * @csspart error - Each field's error message.
+ * @csspart summary - The error summary shown when three or more fields fail.
+ * @csspart required-note - The "* Required" note.
+ * @csspart submit - The submit button.
+ * @csspart success - The success note.
+ * @csspart alert - The form-level alert (rate limit, unavailable, or a server message that is not on one field).
+ * @csspart about - The "About:" pill.
+ * @csspart consent - The consent label.
+ */
+declare class ContactForm extends LitElement {
+    static styles: lit.CSSResult;
+    /** Absolute `http(s)` URL of the contact API. Empty: the form still renders, and submitting shows the error note without sending. */
+    endpoint: string;
+    /** The choices for the topic select. Also set as the JSON attribute `topics`. Items with a `group` are put under that `<optgroup>`. */
+    topics: ContactTopic[];
+    /** The topic to preselect when the page URL does not choose one. Ignored unless it is one of `topics`. */
+    defaultTopic: string;
+    /** Shows the optional phone field. Set `show-phone="false"` to hide it. */
+    showPhone: boolean;
+    /** Language sent with the message. Empty uses the page's `lang`, or `en`. */
+    locale: string;
+    /** Page sent with the message. Empty uses the page's path. */
+    page: string;
+    nameLabel: string;
+    emailLabel: string;
+    companyLabel: string;
+    phoneLabel: string;
+    topicLabel: string;
+    topicPlaceholder: string;
+    messageLabel: string;
+    namePlaceholder: string;
+    emailPlaceholder: string;
+    companyPlaceholder: string;
+    messagePlaceholder: string;
+    /** The message counter. `{count}` and `{max}` are filled in. */
+    messageCounter: string;
+    submitLabel: string;
+    sendingLabel: string;
+    /** Shown in brackets after each required label, for screen readers. */
+    requiredLabel: string;
+    /** The text before the topic in the "About:" pill. */
+    aboutLabel: string;
+    consentLabel: string;
+    /** A line of privacy text above the submit button. Empty hides it. */
+    privacyNote: string;
+    privacyLinkLabel: string;
+    privacyHref: string;
+    sentNote: string;
+    referenceLabel: string;
+    errorNote: string;
+    /** Rate-limit note. `{seconds}` is filled in when the server says how long to wait. */
+    rateLimitedNote: string;
+    rateLimitedGenericNote: string;
+    /** The field-error summary for screen readers, when several fields fail. `{count}` is filled in. */
+    errorSummary: string;
+    /** The summary when one field fails. */
+    errorSummaryOne: string;
+    /** The note above the fields. The form's `aria-describedby` points at it. Empty hides it. */
+    requiredNote: string;
+    /** Address for `{mailto}` in the error and rate-limit notes. Empty, or not an address, leaves the placeholder out. */
+    mailto: string;
+    /** Replaces the English validation messages (`required`, `tooLong`, ...). Only the keys given are replaced. */
+    errorMessages: Partial<ContactErrorMessages>;
+    private errors;
+    private alertText;
+    /** True when `alertText` is one of the component's own notes, so `{mailto}` in it becomes a link. */
+    private alertOwn;
+    private outcome;
+    private sending;
+    private messageLength;
+    /** What screen readers last heard about the counter; changes only when the band changes. */
+    private counterAnnouncement;
+    private counterBandValue;
+    private submitEl?;
+    /** `product` and `topic` from the page URL, read once on connect. */
+    private queryParams;
+    private inflight;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private get topicList();
+    private get preselect();
+    private labels;
+    /** The defaults, with each key replaced by the override when it is a string. */
+    private messages;
+    private readText;
+    private readValues;
+    private onSubmit;
+    private applyResult;
+    private focusField;
+    /** Many failing fields: focus the summary, which links to each. One or two: the first field. */
+    private focusProblem;
+    private failingFields;
+    private onSummaryLink;
+    private dispatchError;
+    private onMessageInput;
+    private errorSummaryText;
+    /** The alert's text. Only the component's own notes get a link for `{mailto}`; server text stays plain. */
+    private renderAlertText;
+    private renderSummary;
+    private requiredMark;
+    private renderInput;
+    /** Not `renderOptions`: LitElement already has that instance property. */
+    private renderChoices;
+    private renderTopic;
+    private renderMessage;
+    private renderConsent;
+    render(): lit.TemplateResult<1>;
+}
+
+/**
+ * Fired on `st-contact-form` once the fields pass the checks and the request is about to be sent.
+ * Detail `{ topic }`. Bubbles and is composed.
+ */
+declare const CONTACT_FORM_SUBMIT_EVENT = "st-contact-form-submit";
+/** Fired on `st-contact-form` when the API accepted the message. Bubbles and is composed. */
+declare const CONTACT_FORM_SENT_EVENT = "st-contact-form-sent";
+/** Fired on `st-contact-form` when a submission was not accepted. Bubbles and is composed. */
+declare const CONTACT_FORM_ERROR_EVENT = "st-contact-form-error";
+/**
+ * Why a submission was not accepted: `validation` (the server rejected a field), `rate_limited` (too many
+ * messages in a short time) or `unavailable` (the form could not reach the API, or the API failed).
+ */
+type ContactFormErrorKind = 'validation' | 'rate_limited' | 'unavailable';
+interface ContactFormSubmitEventDetail {
+    /** The chosen topic's `value` (a configured key, not typed by the visitor). */
+    topic: string;
+}
+interface ContactFormSentEventDetail {
+    /** The reference the API gave the message, when it gave one. */
+    reference?: string;
+}
+interface ContactFormErrorEventDetail {
+    kind: ContactFormErrorKind;
+}
+
+export { CONTACT_FORM_ERROR_EVENT, CONTACT_FORM_SENT_EVENT, CONTACT_FORM_SUBMIT_EVENT, type ContactErrorMessages, type ContactErrors, type ContactFieldName, ContactForm, type ContactFormErrorEventDetail, type ContactFormErrorKind, type ContactFormSentEventDetail, type ContactFormSubmitEventDetail, type ContactSubmitResult, type ContactTopic };

package/dist/contact-form/index.js

@@ -0,0 +1,16 @@
+import {
+  CONTACT_FORM_ERROR_EVENT,
+  CONTACT_FORM_SENT_EVENT,
+  CONTACT_FORM_SUBMIT_EVENT,
+  ContactForm
+} from "../chunk-V4R7PYP5.js";
+import "../chunk-CZUGPKXV.js";
+import "../chunk-NXUS2CH7.js";
+import "../chunk-EUXUH3YW.js";
+export {
+  CONTACT_FORM_ERROR_EVENT,
+  CONTACT_FORM_SENT_EVENT,
+  CONTACT_FORM_SUBMIT_EVENT,
+  ContactForm
+};
+//# sourceMappingURL=index.js.map

package/dist/contact-form/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/content-block/index.d.ts

@@ -2,16 +2,38 @@ import * as lit from 'lit';
 import { LitElement } from 'lit';
 
 /**
- * A long-form article section: centered title/subtitle, an optional featured image with caption,
- * then Markdown body text. The body comes from `content-src` (a Markdown URL) or an inline
- * `content` string (so the block works without a fetch); `content-src` wins when both are set.
+ * A long-form article section: an optional eyebrow, a title, a subtitle, an optional featured image
+ * with caption, then Markdown body text. The body comes from `content-src` (a Markdown URL) or an
+ * inline `content` string (so the block works without a fetch); `content-src` wins when both are set.
+ *
+ * `list-style="check"` shows check marks instead of bullets on the body's lists. `action-label` with
+ * an `href` adds a pill link under the body, styled by `action-variant`. `max-width="prose"` narrows
+ * the body to a 720px reading column.
+ *
+ * The title is a real heading: `<h2>` by default, `<h3>` with `heading-level="3"` for a sub-section
+ * inside a larger page (smaller, lighter type, so it never outweighs a section title). Eyebrow,
+ * title, subtitle and body share one alignment: left by default, centred with `text-alignment="center"`.
  *
  * @cssprop --st-content-block-padding - Overrides the block's padding.
+ * @csspart container - The width-limited content box.
+ * @csspart header - The eyebrow, title and subtitle block.
+ * @csspart eyebrow - The small uppercase label above the title.
+ * @csspart title - The heading (`<h2>` or `<h3>`).
+ * @csspart subtitle - The line under the title.
+ * @csspart image - The featured image and its caption.
+ * @csspart body - The Markdown body.
+ * @csspart action - The pill link under the body (when `action-label` and `href` are set).
  */
 declare class ContentBlock extends LitElement {
     static styles: lit.CSSResult;
+    /** Small uppercase label above the title (e.g. "Our story"). */
+    eyebrow: string;
     title: string;
     subtitle: string;
+    /** `2` (default) renders the title as `<h2>`; `3` as a smaller `<h3>` for a sub-section. */
+    headingLevel: 2 | 3;
+    /** Alignment of the eyebrow, title, subtitle and body. `left` (default) or `center`. */
+    textAlignment: 'left' | 'center';
     /** URL of a Markdown file. */
     contentSrc: string;
     /** Inline Markdown, used when `content-src` is not set. */
@@ -20,6 +42,20 @@ declare class ContentBlock extends LitElement {
     imageAlt: string;
     imageCaption: string;
     inverted: boolean;
+    /** `default` keeps bullets; `check` shows a check mark on each bullet of the body's lists. */
+    listStyle: 'default' | 'check';
+    /** Label of a pill link under the body. Shown only together with `href`. */
+    actionLabel: string;
+    /** Shorter `action-label` for phones (< 480px); the full label stays the accessible name. */
+    actionLabelShort: string;
+    /** Target of the pill link under the body. */
+    href: string;
+    /** Colour of the pill link: `primary` (navy), `highlight` (cyan) or `light` (white). */
+    actionVariant: 'primary' | 'highlight' | 'light';
+    /** `none` (default) uses the full container width; `prose` limits the block to a 720px column. */
+    maxWidth: 'none' | 'prose';
+    private renderAction;
+    private renderTitle;
     render(): lit.TemplateResult<1>;
 }
 

package/dist/content-block/index.js

@@ -1,10 +1,13 @@
 import {
   ContentBlock
-} from "../chunk-4AFOKKSU.js";
-import "../chunk-QLA4BH2B.js";
-import "../chunk-UAIUBPDN.js";
-import "../chunk-FZ36KL73.js";
-import "../chunk-KMU6ABQF.js";
+} from "../chunk-6OZKZG5J.js";
+import "../chunk-BEWX3E6P.js";
+import "../chunk-T4BIN37Q.js";
+import "../chunk-WTD2YIAA.js";
+import "../chunk-XS6LNTSH.js";
+import "../chunk-TJK55CJ2.js";
+import "../chunk-KZ7PMFWS.js";
+import "../chunk-NXUS2CH7.js";
 import "../chunk-EUXUH3YW.js";
 export {
   ContentBlock

package/dist/cookie-consent/index.d.ts

@@ -1,35 +1,83 @@
 import * as lit from 'lit';
 import { LitElement, nothing } from 'lit';
 
+/** `accepted`: every category on. `refused`: only required categories. `custom`: picked in the settings. */
+type CookieConsentStatus = 'accepted' | 'refused' | 'custom';
+/** One group of cookies the visitor can allow or block in the settings panel. */
+interface CookieCategory {
+    id: string;
+    label: string;
+    description?: string;
+    /** Always on (e.g. strictly necessary cookies); shown checked and disabled. */
+    required?: boolean;
+}
+/**
+ * Detail of `cookie-consent-accept` / `cookie-consent-refuse` / `cookie-consent-save`.
+ * `categories` maps every category id to whether it is allowed (required ones are always `true`).
+ */
+interface CookieConsentEventDetail {
+    status: CookieConsentStatus;
+    categories: Record<string, boolean>;
+}
+
 /**
- * Fixed bottom consent bar. The source read/wrote consent through a React `UserContext`; here the
- * element persists the choice itself in localStorage (`storage-key`, default the source's
- * `sankhya_ui_cookie_consent`; storage errors are ignored) and renders nothing once a choice
- * exists. Fires `cookie-consent-accept` / `cookie-consent-refuse` (detail `{ status }`). The
- * default slot replaces the message text.
+ * Fixed bottom consent bar with explicit choices: accept all, reject all optional cookies, or (with
+ * `categories` and a `settings-button-text`) open a settings panel to allow categories one by one.
+ * Optional categories are off until the visitor turns them on. The choice is kept in localStorage
+ * (`storage-key`, default `sankhya_ui_cookie_consent`; storage errors are ignored) and the bar renders
+ * nothing once a choice exists. Fires `cookie-consent-accept`, `cookie-consent-refuse` or
+ * `cookie-consent-save` (detail `{ status, categories }`). The default slot replaces the message
+ * text. `privacy-policy-link` opens in the same tab for a site path, in a new tab for an external URL.
  *
+ * While a modal is open (`<html data-st-modal-open>`, set by st-quote-dialog) the bar is hidden
+ * (`visibility: hidden`) and inert, and it reappears unchanged when the modal closes. While the mobile
+ * nav drawer is open (`<html data-st-drawer-open>`, set by st-header) the bar is not displayed.
+ *
+ * While the bar is shown its height is published as `--st-cookie-banner-height` on `<html>` (removed
+ * when it is dismissed), so a page's footer can pad its last row above the bar.
+ *
+ * @fires cookie-consent-accept - Every category allowed.
+ * @fires cookie-consent-refuse - Only required categories allowed.
+ * @fires cookie-consent-save - The categories picked in the settings panel.
  * @cssprop --st-cookie-consent-padding - Overrides the bar's padding.
+ * @csspart settings - The settings panel.
  */
 declare class CookieConsent extends LitElement {
     static styles: lit.CSSResult;
     message: string;
     acceptButtonText: string;
     refuseButtonText: string;
+    /** Label of the button that opens the settings panel. Shown only with `categories`. */
+    settingsButtonText: string;
+    saveButtonText: string;
+    settingsHeading: string;
+    /** Cookie groups for the settings panel. Without any, the bar only offers accept and reject. */
+    categories: CookieCategory[];
     privacyPolicyLink: string;
     privacyPolicyText: string;
     storageKey: string;
     /** The stored choice, or `null` while undecided (the bar is only shown then). */
     private consent;
+    private settingsOpen;
+    /** Optional categories ticked in the settings panel (all off until the visitor ticks them). */
+    private picked;
+    private pageObserver?;
+    private sizeObserver?;
     connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected updated(): void;
+    /** Follows the page: a modal hides and disables the bar, an open nav drawer hides it (the stored choice is untouched). */
+    private syncPageState;
+    /** Publishes the bar's height on <html> while it is shown; removes it once dismissed or hidden. */
+    private publishBannerHeight;
     private readStored;
+    /** Every category id mapped to whether it is allowed under `status`. */
+    private allowedFor;
     private choose;
+    private toggleSettings;
+    private renderLink;
+    private renderSettings;
     render(): lit.TemplateResult<1> | typeof nothing;
 }
 
-type CookieConsentStatus = 'accepted' | 'refused';
-/** Detail of `cookie-consent-accept` / `cookie-consent-refuse` (source: `onAccept` / `onRefuse`). */
-interface CookieConsentEventDetail {
-    status: CookieConsentStatus;
-}
-
-export { CookieConsent, type CookieConsentEventDetail, type CookieConsentStatus };
+export { type CookieCategory, CookieConsent, type CookieConsentEventDetail, type CookieConsentStatus };

package/dist/cookie-consent/index.js

@@ -1,7 +1,8 @@
 import {
   CookieConsent
-} from "../chunk-MSSH3HFK.js";
-import "../chunk-KMU6ABQF.js";
+} from "../chunk-EKZFFY45.js";
+import "../chunk-WAMOAAMN.js";
+import "../chunk-NXUS2CH7.js";
 import "../chunk-EUXUH3YW.js";
 export {
   CookieConsent

package/dist/date-tile/index.js

@@ -1,7 +1,7 @@
 import {
   DateTile
-} from "../chunk-INMSEYT6.js";
-import "../chunk-KMU6ABQF.js";
+} from "../chunk-IVPVYVWG.js";
+import "../chunk-NXUS2CH7.js";
 import "../chunk-EUXUH3YW.js";
 export {
   DateTile

package/dist/dropdown/index.d.ts

@@ -16,7 +16,11 @@ import { LitElement } from 'lit';
  * <=768px (it would overflow the screen from wherever the trigger sits; use `inline` in headers
  * instead), and slotted children are not clipped with `overflow: hidden` (that would cut off their
  * focus rings). Other attributes: `align`, `active`, `disabled`, `inline`, the `dropdown-toggle`
- * event, and `mega` plus `open-on-hover` for a mega menu (see `st-mega-menu`).
+ * event, `trigger-style` (`item` for a desktop-bar trigger that matches `st-menu-item`), and `mega`
+ * plus `open-on-hover` for a mega menu (see `st-mega-menu`).
+ *
+ * `current` is set when the trigger's own `href` or a nav item inside the panel is the current page
+ * (see `st-header`'s `current-path`); the trigger then shows as active, like `active`.
  *
  * @cssprop --st-mega-menu-max-width - Maximum width of a `mega` panel (default `1400px`).
  * @cssprop --st-mega-menu-inset - Minimum space between a `mega` panel and the header's sides (default `1rem`).
@@ -51,6 +55,10 @@ declare class Dropdown extends LitElement {
     disabled: boolean;
     /** Highlights the trigger as the current section (e.g. the current page is one of its items). */
     active: boolean;
+    /** Page path the header is showing; set by `st-header`. */
+    currentPath: string;
+    /** Computed from `href` and the nav items in the panel against `currentPath`; reflected for styling. */
+    current: boolean;
     /** Opens the panel in the flow under the trigger instead of floating over the page (see the
      * styles). `st-header` sets this on its own menu's dropdowns while its hamburger panel shows. */
     inline: boolean;
@@ -67,6 +75,15 @@ declare class Dropdown extends LitElement {
     /** Styles a non-`mega` trigger like a mega one — a pill that turns solid accent while open — so
      * a plain dropdown (e.g. "+ New") lines up with mega triggers in the same header bar. */
     bar: boolean;
+    /**
+     * `default` keeps the trigger as it has always looked. `item` lays it out like an `st-menu-item`
+     * row, so it matches a Home-style link beside it in `st-header`'s desktop bar: the same padding,
+     * type and 6px corners, the hover fill, the current-page look with the accent left bar, and a
+     * chevron caret in place of the ▼ glyph. Open shows the hover fill, not the solid accent pill.
+     * The item look applies only while not `inline` (the hamburger layout keeps its own look).
+     * Set it from JSON as `triggerStyle`.
+     */
+    triggerStyle: 'default' | 'item';
     /** Opens the panel while a mouse hovers the trigger or panel (touch and keyboard still click). Off while `inline`. */
     openOnHover: boolean;
     /** Text of the Back button in the `mega` + `inline` drill-down panel. */
@@ -76,10 +93,14 @@ declare class Dropdown extends LitElement {
     private hoverOpenedAt;
     /** Whether the default slot has content — the source's `children` check. */
     private hasContent;
+    /** Grid tracks of the `st-mega-menu` inside the panel, as it reports them; 0 until it does. */
+    private megaTracks;
+    private onMegaLayout;
     /** Whether `slot="icon"` has content. */
     private hasIcon;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    protected willUpdate(): void;
     protected updated(changed: Map<string, unknown>): void;
     private setOpen;
     private hovers;

package/dist/dropdown/index.js

@@ -1,8 +1,10 @@
 import {
   Dropdown
-} from "../chunk-2DXHPEB5.js";
+} from "../chunk-DJFWZOZM.js";
+import "../chunk-ER7MCPDV.js";
+import "../chunk-UKIVLF7S.js";
 import "../chunk-WTD2YIAA.js";
-import "../chunk-KMU6ABQF.js";
+import "../chunk-NXUS2CH7.js";
 import "../chunk-EUXUH3YW.js";
 export {
   Dropdown

package/dist/feature-split/index.d.ts

@@ -10,9 +10,13 @@ interface FeatureSplitItem {
 }
 type FeatureSplitImagePosition = 'left' | 'right' | 'top';
 /**
- * A title/markdown-subtitle/feature-list block beside (or under) an image.
+ * A title/markdown-subtitle/feature-list block beside (or under) an image. The `action-label` button
+ * is a real link to `href`: the browser follows it unless the cancelable `feature-split-action`
+ * event is cancelled (a router does this to navigate client-side).
  *
+ * @fires feature-split-action - Cancelable, before following the action link. Detail `{ href }`.
  * @cssprop --st-feature-split-padding - Overrides the block's padding.
+ * @csspart action - The action link.
  */
 declare class FeatureSplit extends LitElement {
     static styles: lit.CSSResult;
@@ -26,6 +30,7 @@ declare class FeatureSplit extends LitElement {
     imagePosition: FeatureSplitImagePosition;
     actionLabel: string;
     href: string;
+    /** Fires the cancelable `feature-split-action`; the link is followed unless it is cancelled. */
     private onAction;
     render(): lit.TemplateResult<1>;
 }

package/dist/feature-split/index.js

@@ -1,10 +1,10 @@
 import {
   FeatureSplit
-} from "../chunk-WT4OATGP.js";
-import "../chunk-QLA4BH2B.js";
-import "../chunk-UAIUBPDN.js";
-import "../chunk-FZ36KL73.js";
-import "../chunk-KMU6ABQF.js";
+} from "../chunk-ZKFCDVB4.js";
+import "../chunk-XS6LNTSH.js";
+import "../chunk-TJK55CJ2.js";
+import "../chunk-KZ7PMFWS.js";
+import "../chunk-NXUS2CH7.js";
 import "../chunk-EUXUH3YW.js";
 export {
   FeatureSplit