@sankhyatronics/sankhya-cms 0.2.0 → 0.3.0

package/dist/index.js

@@ -1,119 +1,171 @@
-import {
-  Stats
-} from "./chunk-YVTFQHVY.js";
-import {
-  Steps
-} from "./chunk-ZRC5BVDX.js";
 import {
   TagStrip
-} from "./chunk-5MY6OWMK.js";
+} from "./chunk-XP6DI3VY.js";
 import {
   Testimonials
-} from "./chunk-DH53HZPB.js";
+} from "./chunk-37KFBKPD.js";
 import {
   Tooltip
-} from "./chunk-FML6AG2V.js";
-import {
-  MenuItem
-} from "./chunk-2FJDNJ7R.js";
+} from "./chunk-RANC3OI6.js";
 import {
-  PromoBanner
-} from "./chunk-HMUZON6I.js";
+  ScreenshotTour
+} from "./chunk-535QAZ6A.js";
 import {
   Section
-} from "./chunk-5F5PTVWR.js";
+} from "./chunk-GOFSMD6W.js";
 import {
   SegmentedControl
-} from "./chunk-MG2VTZA4.js";
+} from "./chunk-QS3ANOWN.js";
 import {
   Select
-} from "./chunk-BLQV2YMO.js";
+} from "./chunk-EZOKT7NJ.js";
+import {
+  Stats
+} from "./chunk-TEAZZPDQ.js";
+import {
+  Steps
+} from "./chunk-JURCF4OD.js";
+import {
+  MenuGrid
+} from "./chunk-PV6OCXXN.js";
+import {
+  MenuGridItem
+} from "./chunk-2GTR37PU.js";
+import {
+  MenuItem
+} from "./chunk-NXKDZWS7.js";
+import {
+  PlanCards
+} from "./chunk-FF2LWEF3.js";
+import {
+  ProductNav
+} from "./chunk-OEOE6IFY.js";
+import {
+  PromoBanner
+} from "./chunk-EW2RK5Y6.js";
+import {
+  DEFAULT_MAILTO_BODY_LIMIT,
+  QuoteDialog,
+  buildMailto,
+  buildQuoteMailto,
+  fillTemplate
+} from "./chunk-AYNT7G3J.js";
+import {
+  QUOTE_OPEN_EVENT
+} from "./chunk-FOUK3NHR.js";
+import {
+  Footer
+} from "./chunk-OCPGOLVF.js";
+import {
+  Header
+} from "./chunk-WAYHHL4J.js";
 import {
   Hero
-} from "./chunk-SQ3OZO32.js";
+} from "./chunk-MFRGAT6D.js";
 import {
   IconButton
-} from "./chunk-PHEGSCOM.js";
+} from "./chunk-WH6HE6SY.js";
 import {
   ItemsAccordion
-} from "./chunk-EE6PAN3B.js";
+} from "./chunk-4XPKKYVZ.js";
 import {
   KpiCard
-} from "./chunk-6D6ROU7X.js";
+} from "./chunk-IGMVF3KK.js";
 import {
   MegaMenu,
   MegaMenuColumn,
   MegaMenuFeature
-} from "./chunk-J6EO4R73.js";
+} from "./chunk-MIBVQXRU.js";
 import {
-  MenuGrid
-} from "./chunk-OELI3IWC.js";
+  CONTACT_FORM_ERROR_EVENT,
+  CONTACT_FORM_SENT_EVENT,
+  CONTACT_FORM_SUBMIT_EVENT,
+  ContactForm
+} from "./chunk-V4R7PYP5.js";
 import {
-  MenuGridItem
-} from "./chunk-OLA35A2O.js";
+  ContentBlock
+} from "./chunk-6OZKZG5J.js";
+import "./chunk-BEWX3E6P.js";
+import "./chunk-T4BIN37Q.js";
 import {
   CookieConsent
-} from "./chunk-MSSH3HFK.js";
+} from "./chunk-EKZFFY45.js";
+import "./chunk-WAMOAAMN.js";
 import {
   DateTile
-} from "./chunk-INMSEYT6.js";
+} from "./chunk-IVPVYVWG.js";
 import {
   Dropdown
-} from "./chunk-2DXHPEB5.js";
+} from "./chunk-DJFWZOZM.js";
 import {
-  FeatureSplit
-} from "./chunk-WT4OATGP.js";
+  MEGA_MENU_LAYOUT_EVENT
+} from "./chunk-ER7MCPDV.js";
+import "./chunk-UKIVLF7S.js";
+import "./chunk-WTD2YIAA.js";
 import {
   FeatureItem,
   FeaturesSection
-} from "./chunk-7NIWQWTA.js";
+} from "./chunk-2HMOX253.js";
 import {
-  Flow
-} from "./chunk-O4FCRKDX.js";
+  FeatureSplit
+} from "./chunk-ZKFCDVB4.js";
 import {
-  Footer
-} from "./chunk-GJO3RGOB.js";
+  Markdown
+} from "./chunk-XS6LNTSH.js";
 import {
-  Header
-} from "./chunk-XUGEXERO.js";
-import "./chunk-WTD2YIAA.js";
+  Flow
+} from "./chunk-GB4NGCZI.js";
 import {
   AttentionPanel
-} from "./chunk-35TX3AOA.js";
+} from "./chunk-NABSRUXG.js";
 import {
   BarChart
-} from "./chunk-AG2COC64.js";
-import {
-  Card
-} from "./chunk-3OEEOBHB.js";
+} from "./chunk-VVYQ2DDS.js";
 import {
   BentoGrid
-} from "./chunk-5C6C6K5U.js";
+} from "./chunk-Q66CJO3P.js";
+import "./chunk-TJK55CJ2.js";
+import {
+  BOOKING_CANCELLED_EVENT,
+  BOOKING_CREATED_EVENT,
+  BOOKING_ERROR_EVENT,
+  BOOKING_RESCHEDULED_EVENT,
+  Booking,
+  DEFAULT_BOOKING_LABELS
+} from "./chunk-DPANTC3O.js";
+import "./chunk-CZUGPKXV.js";
+import {
+  Card
+} from "./chunk-QSJ543V2.js";
 import {
   Carousel
-} from "./chunk-EMCQBT3S.js";
+} from "./chunk-LO6TZBGD.js";
+import "./chunk-KZ7PMFWS.js";
 import {
   Chip
-} from "./chunk-AKJQ345O.js";
-import {
-  ContentBlock
-} from "./chunk-4AFOKKSU.js";
-import {
-  Markdown
-} from "./chunk-QLA4BH2B.js";
-import "./chunk-UAIUBPDN.js";
-import "./chunk-FZ36KL73.js";
-import "./chunk-KMU6ABQF.js";
+} from "./chunk-5AWGZQWU.js";
+import "./chunk-NXUS2CH7.js";
 import "./chunk-EUXUH3YW.js";
 export {
   AttentionPanel,
+  BOOKING_CANCELLED_EVENT,
+  BOOKING_CREATED_EVENT,
+  BOOKING_ERROR_EVENT,
+  BOOKING_RESCHEDULED_EVENT,
   BarChart,
   BentoGrid,
+  Booking,
+  CONTACT_FORM_ERROR_EVENT,
+  CONTACT_FORM_SENT_EVENT,
+  CONTACT_FORM_SUBMIT_EVENT,
   Card,
   Carousel,
   Chip,
+  ContactForm,
   ContentBlock,
   CookieConsent,
+  DEFAULT_BOOKING_LABELS,
+  DEFAULT_MAILTO_BODY_LIMIT,
   DateTile,
   Dropdown,
   FeatureItem,
@@ -126,6 +178,7 @@ export {
   IconButton,
   ItemsAccordion,
   KpiCard,
+  MEGA_MENU_LAYOUT_EVENT,
   Markdown,
   MegaMenu,
   MegaMenuColumn,
@@ -133,7 +186,12 @@ export {
   MenuGrid,
   MenuGridItem,
   MenuItem,
+  PlanCards,
+  ProductNav,
   PromoBanner,
+  QUOTE_OPEN_EVENT,
+  QuoteDialog,
+  ScreenshotTour,
   Section,
   SegmentedControl,
   Select,
@@ -141,6 +199,9 @@ export {
   Steps,
   TagStrip,
   Testimonials,
-  Tooltip
+  Tooltip,
+  buildMailto,
+  buildQuoteMailto,
+  fillTemplate
 };
 //# sourceMappingURL=index.js.map

package/dist/items-accordion/index.d.ts

@@ -9,9 +9,13 @@ interface AccordionItem {
 }
 /**
  * A vertical list of collapsible title/content rows; one open at a time unless `allow-multiple`.
- * Each row's `content` is Markdown, sanitized. `open-first` starts with the first row open.
+ * Each row's `content` is Markdown, sanitized. `open-first` starts with the first row open. The
+ * section title is an `<h2>` and each row title an `<h3>` wrapping its toggle button, which
+ * exposes `aria-expanded` and `aria-controls` for the row's panel.
  *
  * @cssprop --st-items-accordion-padding - Overrides the block's padding.
+ * @csspart trigger - The button that opens and closes a row.
+ * @csspart heading - The `<h3>` wrapping each trigger.
  */
 declare class ItemsAccordion extends LitElement {
     static styles: lit.CSSResult;

package/dist/items-accordion/index.js

@@ -1,9 +1,9 @@
 import {
   ItemsAccordion
-} from "../chunk-EE6PAN3B.js";
-import "../chunk-UAIUBPDN.js";
-import "../chunk-FZ36KL73.js";
-import "../chunk-KMU6ABQF.js";
+} from "../chunk-4XPKKYVZ.js";
+import "../chunk-TJK55CJ2.js";
+import "../chunk-KZ7PMFWS.js";
+import "../chunk-NXUS2CH7.js";
 import "../chunk-EUXUH3YW.js";
 export {
   ItemsAccordion

package/dist/kpi-card/index.js

@@ -1,7 +1,7 @@
 import {
   KpiCard
-} from "../chunk-6D6ROU7X.js";
-import "../chunk-KMU6ABQF.js";
+} from "../chunk-IGMVF3KK.js";
+import "../chunk-NXUS2CH7.js";
 import "../chunk-EUXUH3YW.js";
 export {
   KpiCard

package/dist/markdown/index.d.ts

@@ -8,6 +8,22 @@ import { LitElement, nothing } from 'lit';
  * a `markdown-error` event (detail: `{ error }`).
  *
  * Text color is inherited from the parent so inverted containers just work.
+ *
+ * `list-style="check"` replaces the bullets of unordered lists with a check mark, in the colour of
+ * `--st-markdown-list-check-color` (navy by default).
+ *
+ * Code blocks are a dark navy panel (14px monospace, 20px padding, 12px corners) that scrolls
+ * sideways only when a line is wider than the block; ```json fences get syntax colours. Inline
+ * `code` is a chip tinted from the surrounding text colour.
+ *
+ * @cssprop --st-markdown-list-check-color - Colour of the check marks (`list-style="check"`).
+ * @cssprop --st-markdown-code-bg - Code block background (default `#011d41`).
+ * @cssprop --st-markdown-code-color - Code block text (default `#e4ebff`).
+ * @cssprop --st-markdown-code-border - Code block hairline (default `#e4ebff` at 14%).
+ * @cssprop --st-markdown-code-key - JSON keys (default `#8eaffe`).
+ * @cssprop --st-markdown-code-string - JSON strings (default `#49cce0`).
+ * @cssprop --st-markdown-code-number - JSON numbers, `true`, `false`, `null` (default `#fbbf77`).
+ * @cssprop --st-markdown-code-punct - JSON punctuation (default `#c9d7fe`).
  */
 declare class Markdown extends LitElement {
     static styles: lit.CSSResult;
@@ -15,6 +31,8 @@ declare class Markdown extends LitElement {
     content: string;
     /** URL of a Markdown file to fetch. */
     src: string;
+    /** `default` keeps bullets; `check` shows a check mark on each unordered item. */
+    listStyle: 'default' | 'check';
     private fetched;
     private loading;
     private error;

package/dist/markdown/index.js

@@ -1,8 +1,8 @@
 import {
   Markdown
-} from "../chunk-QLA4BH2B.js";
-import "../chunk-UAIUBPDN.js";
-import "../chunk-KMU6ABQF.js";
+} from "../chunk-XS6LNTSH.js";
+import "../chunk-TJK55CJ2.js";
+import "../chunk-NXUS2CH7.js";
 import "../chunk-EUXUH3YW.js";
 export {
   Markdown

package/dist/mega-menu/index.d.ts

@@ -1,5 +1,5 @@
 import * as lit from 'lit';
-import { LitElement } from 'lit';
+import { LitElement, PropertyValues, TemplateResult } from 'lit';
 
 /**
  * The rich layout of a mega-menu panel, after okta.com: an optional intro column on the left (a
@@ -13,11 +13,15 @@ import { LitElement } from 'lit';
  * everything stacked in the narrow drill-down panel `st-header` shows on a phone (where the intro
  * heading is left out — the drill-down already shows the section's name).
  *
+ * `cta-label` + `cta-href` add a call-to-action pill pinned to the foot of the intro column, so the
+ * column ends level with the featured cards instead of leaving an empty gap under the text.
+ *
  * @slot - The link columns (`st-mega-menu-column`s, or any blocks).
  * @slot intro - Quick links under the intro text, e.g. `st-menu-item`s with an icon.
  * @slot featured - Promo cards (`st-mega-menu-feature`s), stacked.
  * @csspart inner - The grid holding every area.
  * @csspart intro - The intro column.
+ * @csspart cta - The intro column's call-to-action pill.
  * @csspart columns - The grid holding the link columns.
  * @csspart featured - The featured column.
  */
@@ -31,12 +35,21 @@ declare class MegaMenu extends LitElement {
     featuredHeading: string;
     /** Number of link columns side by side at full width. `0` (the default) uses one per slotted column. */
     columns: number;
+    /** Label of the call-to-action pill at the foot of the intro column. Needs `cta-href`. */
+    ctaLabel: string;
+    /** Target of the intro column's call to action. */
+    ctaHref: string;
+    /** Whether the menu panel is shown. Set to `false` to hide it entirely (it keeps its slotted content). */
+    visible: boolean;
     private columnCount;
     private hasIntroLinks;
     private hasFeatured;
     private onColumnsSlotChange;
     private onIntroSlotChange;
     private onFeaturedSlotChange;
+    private get layout();
+    private lastTracks;
+    protected updated(_changed: PropertyValues): void;
     render(): lit.TemplateResult<1>;
 }
 
@@ -47,19 +60,45 @@ declare class MegaMenu extends LitElement {
  *
  * `variant="card"` puts the column on a tinted rounded tile and `variant="accent"` on a solid
  * accent tile with light text; both suit a row of equal columns without intro or featured area.
- * `cta-label` + `cta-href` add a pill button at the bottom of the column.
+ *
+ * `variant="product"` makes a product card for a row of products: an icon tile and a `tag` pill on a
+ * top row, the heading and description, the links as rows
+ * with a `→` arrow (a new-tab link keeps its `↗` icon), and a full-width `cta-label` + `cta-href`
+ * button pinned to the bottom. The icon tile shows `icon` (an iconify name), or, when `icon-src` is set,
+ * that image at 28px on the same tinted tile (`icon-src-dark`, if set, replaces it on the dark theme). The
+ * card lifts and gets an accent border on hover or focus. Set
+ * `accent` (any CSS colour) to tint it; it defaults to the theme accent. A card whose link is the
+ * page being shown (see `st-header`'s `current-path`) becomes the "You are here" card: a 2px accent
+ * border, a faint accent wash, a `currentLabel` pill and a solid button. Inside an `inline`
+ * (hamburger) header panel the card does not lift.
+ *
+ * `decoration` (`none` default, `flow`, `orbit`, `waves` or `ribbon`) draws faint curvy line art in
+ * the card's accent behind its top-right corner. It is `product`-only and sits under the content;
+ * it drifts on hover or focus, but not in the `inline` panel or with reduced motion.
+ *
+ * `cta-label` + `cta-href` add a pill button at the bottom of any variant's column.
  *
  * The heading (when `href` is set) and the button fire a *cancelable* `mega-menu-select` event
  * (detail: `{ href }`) before navigating; a host doing client-side routing calls
- * `event.preventDefault()` on it.
+ * `event.preventDefault()` on it. A link whose `href` is the page being shown (see `st-header`'s
+ * `current-path`) gets `aria-current="page"`.
  *
  * @slot - The column's links, or nested `st-mega-menu-column` groups.
  * @fires mega-menu-select - The heading link or the button was clicked (cancelable; detail `{ href }`).
+ * @csspart top - The product card's top row (icon tile and pills).
+ * @csspart icon - The product card's icon tile. With `icon-src` it holds the image (one, or two with `icon-src-dark`) at 28px, on the same tinted tile.
+ * @csspart tag - The product card's tag pill.
+ * @csspart current - The product card's "You are here" pill.
  * @csspart heading - The heading text or link.
  * @csspart description - The line under the heading.
  * @csspart items - The box holding the links.
  * @csspart cta - The pill button.
+ * @csspart decoration - The decorative line art of a `product` card (`decoration` other than `none`).
  * @cssprop --st-mega-menu-column-padding - Overrides the padding of a `card`/`accent` column.
+ * @cssprop --st-mega-menu-column-accent - The accent of a `product` card (default `--st-color-accent`); `accent` sets it.
+ * @cssprop --st-mega-menu-column-lift - The hover/focus lift of a `product` card (default `-3px`); `st-dropdown` sets it to `0px` while `inline`.
+ * @cssprop --st-mega-menu-column-deco-opacity - The resting opacity of the `decoration` line art (default `0.28`); raise or lower it per theme, e.g. on dark surfaces.
+ * @cssprop --st-mega-menu-column-deco-transform - The hover/focus shift of the `decoration` line art (default `translate(-6px, 4px)`); `st-dropdown` sets it to `none` while `inline`.
  */
 declare class MegaMenuColumn extends LitElement {
     static styles: lit.CSSResult;
@@ -67,15 +106,53 @@ declare class MegaMenuColumn extends LitElement {
     /** Makes the heading a link (e.g. to the section's overview page). */
     href: string;
     description: string;
-    /** `plain` (default), `card` (tinted tile) or `accent` (solid accent tile, light text). */
-    variant: 'plain' | 'card' | 'accent';
+    /** `plain` (default), `card` (tinted tile), `accent` (solid accent tile, light text) or `product` (a product card). */
+    variant: 'plain' | 'card' | 'accent' | 'product';
     /** Text of a pill button at the bottom of the column; needs `cta-href`. */
     ctaLabel: string;
     ctaHref: string;
+    /**
+     * Variant the column takes while its heading or button links to the page being shown, e.g. a card
+     * that turns accent on its own product page. Empty (default) keeps `variant` at all times.
+     */
+    currentVariant: '' | 'plain' | 'card' | 'accent';
+    /** Small icon tile on a `product` card: an iconify icon name, e.g. `heroicons:book-open`. */
+    icon: string;
+    /** Image icon of a `product` card (28px inside the 44px tile), e.g. a product logo. Replaces the iconify `icon` when set. */
+    iconSrc: string;
+    /** Dark-theme variant of `icon-src`, shown on the site's dark theme (`:root.dark`) in place of it. Needs `icon-src`. */
+    iconSrcDark: string;
+    /** Short label pill on the top row of a `product` card, e.g. `Open source`. */
+    tag: string;
+    /** Accent of a `product` card, any CSS colour (sets `--st-mega-menu-column-accent`). */
+    accent: string;
+    /**
+     * Decorative curvy line art behind a `product` card's top-right corner: `flow` (lines fanning down-left),
+     * `orbit` (concentric arcs), `waves` (parallel waves across the top) or `ribbon` (crossing loops).
+     * `none` (default) draws nothing. Other variants ignore it.
+     */
+    decoration: 'none' | 'flow' | 'orbit' | 'waves' | 'ribbon';
+    /** "You are here" marker on the `product` card of the page being shown. */
+    currentLabel: string;
+    /** Page path the header is showing; set by `st-header`. A link whose href matches gets `aria-current="page"`. */
+    currentPath: string;
+    /**
+     * True while the column is the page being shown: while `current-variant` applies, or always for a
+     * `product` card. Set by the column, never from outside.
+     */
+    current: boolean;
+    /** Whether the links slot has any links, so a `product` card draws its divider only above them. */
+    private hasLinks;
+    private onLinksSlotChange;
+    protected willUpdate(changed: Map<string, unknown>): void;
     private select;
     private renderHeading;
+    private renderDecoration;
+    /** The tile's content: the `icon-src` image (light, plus the dark one when `icon-src-dark` is set), else the iconify `icon`. */
+    private renderTileIcon;
+    private renderTop;
     private renderCta;
-    render(): lit.TemplateResult<1>;
+    render(): TemplateResult<1>;
 }
 
 /**
@@ -130,6 +207,8 @@ declare class MegaMenuFeature extends LitElement {
     logoAlt: string;
     /** Call-to-action text at the bottom of the card; empty hides it. */
     ctaLabel: string;
+    /** Page path the header is showing; set by `st-header`. A card whose `href` matches gets `aria-current="page"`. */
+    currentPath: string;
     private get isExternal();
     private onClick;
     render(): lit.TemplateResult<1>;
@@ -138,5 +217,14 @@ declare class MegaMenuFeature extends LitElement {
 interface MegaMenuSelectEventDetail {
     href: string;
 }
+/**
+ * Fired on `st-mega-menu` (bubbles, composed) when the number of grid tracks it lays out changes: the intro
+ * column, each link column and the featured column. The `mega` dropdown around it uses this to keep a panel
+ * with few columns from stretching to the full width.
+ */
+declare const MEGA_MENU_LAYOUT_EVENT = "st-mega-menu-layout";
+interface MegaMenuLayoutEventDetail {
+    tracks: number;
+}
 
-export { MegaMenu, MegaMenuColumn, MegaMenuFeature, type MegaMenuSelectEventDetail };
+export { MEGA_MENU_LAYOUT_EVENT, MegaMenu, MegaMenuColumn, MegaMenuFeature, type MegaMenuLayoutEventDetail, type MegaMenuSelectEventDetail };

package/dist/mega-menu/index.js

@@ -2,11 +2,16 @@ import {
   MegaMenu,
   MegaMenuColumn,
   MegaMenuFeature
-} from "../chunk-J6EO4R73.js";
+} from "../chunk-MIBVQXRU.js";
+import {
+  MEGA_MENU_LAYOUT_EVENT
+} from "../chunk-ER7MCPDV.js";
+import "../chunk-UKIVLF7S.js";
 import "../chunk-WTD2YIAA.js";
-import "../chunk-KMU6ABQF.js";
+import "../chunk-NXUS2CH7.js";
 import "../chunk-EUXUH3YW.js";
 export {
+  MEGA_MENU_LAYOUT_EVENT,
   MegaMenu,
   MegaMenuColumn,
   MegaMenuFeature

package/dist/menu-grid/index.js

@@ -1,7 +1,7 @@
 import {
   MenuGrid
-} from "../chunk-OELI3IWC.js";
-import "../chunk-KMU6ABQF.js";
+} from "../chunk-PV6OCXXN.js";
+import "../chunk-NXUS2CH7.js";
 import "../chunk-EUXUH3YW.js";
 export {
   MenuGrid

package/dist/menu-grid-item/index.js

@@ -1,7 +1,7 @@
 import {
   MenuGridItem
-} from "../chunk-OLA35A2O.js";
-import "../chunk-KMU6ABQF.js";
+} from "../chunk-2GTR37PU.js";
+import "../chunk-NXUS2CH7.js";
 import "../chunk-EUXUH3YW.js";
 export {
   MenuGridItem

package/dist/menu-item/index.d.ts

@@ -11,8 +11,12 @@ import { LitElement } from 'lit';
  * Renders a real `<a href>` but fires a *cancelable* `menu-item-select` event (detail: `{ href }`)
  * before navigating — a host doing client-side routing calls `event.preventDefault()` on it.
  *
+ * It is the current page (`aria-current="page"`, shown as active) when `active` is set, or when the
+ * `href` matches `currentPath`, which an enclosing `st-header` sets from its `current-path`.
+ *
  * @slot icon - The row's icon, sized to `icon-size` (16px, or 14px when `compact`).
  * @cssprop --st-menu-item-icon-size - Width and height of the slotted icon; `icon-size` sets it.
+ * @cssprop --st-menu-item-arrow - A trailing glyph (e.g. `'→'`) drawn after a `link` variant's title; none by default, and not drawn on a link that opens a new tab.
  */
 declare class MenuItem extends LitElement {
     /** `focus()` on the element focuses its link, so `st-dropdown` can arrow-key between items. */
@@ -32,6 +36,8 @@ declare class MenuItem extends LitElement {
     badge: string;
     /** Highlights this row as the current page (source: `isActive`). */
     active: boolean;
+    /** Page path the header is showing; set by `st-header` (from its `current-path`), so this row can compare its `href` with it. */
+    currentPath: string;
     compact: boolean;
     /** Suppresses the description even when `description` is set (source: `showDescription`, default `true`). */
     showDescription: boolean;

package/dist/menu-item/index.js

@@ -1,8 +1,9 @@
 import {
   MenuItem
-} from "../chunk-2FJDNJ7R.js";
+} from "../chunk-NXKDZWS7.js";
+import "../chunk-UKIVLF7S.js";
 import "../chunk-WTD2YIAA.js";
-import "../chunk-KMU6ABQF.js";
+import "../chunk-NXUS2CH7.js";
 import "../chunk-EUXUH3YW.js";
 export {
   MenuItem

package/dist/plan-cards/index.d.ts

@@ -0,0 +1,69 @@
+import * as lit from 'lit';
+import { LitElement } from 'lit';
+
+interface PlanCardItem {
+    id: string;
+    /** Iconify icon name, e.g. `mdi:rocket-launch`. */
+    icon?: string;
+    title: string;
+    /** Small pill beside the title, e.g. "Most popular". */
+    badge?: string;
+    /** `highlight` (cyan, navy text) or `primary` (navy, white text). Default `primary`. */
+    badgeTone?: 'highlight' | 'primary';
+    description?: string;
+    bullets?: string[];
+    /** Label of the card's button. */
+    actionLabel: string;
+    /** Target of the button when the cards have no `quoteDialog`. */
+    href?: string;
+    /** The highlighted card: white with a 2px navy border and a navy button. */
+    featured?: boolean;
+}
+/**
+ * A row of plan or offer cards with a header above them. Each card has an icon, a title with an
+ * optional badge, a description, check-marked bullets and a button at the foot of the card.
+ *
+ * A button opens a `st-quote-dialog` when `quote-dialog` names its `id`: it fires a window
+ * `st-quote-open` event with `{ dialog, option: item.id, trigger }` and does not navigate. Without
+ * `quote-dialog`, the button is a link to `href`. The footnote's action (`footnote-action-label`)
+ * opens the same dialog with the option `unsure`. Put `{action}` in `footnote` to place that button
+ * inside the sentence (the text around it is then plain text, not Markdown); without the token the
+ * button follows the footnote.
+ *
+ * @cssprop --st-plan-cards-padding - Overrides the block's padding.
+ * @cssprop --st-plan-cards-lead-color - Colour of the line under the title (default `--st-cms-text`).
+ * @csspart header - The eyebrow, title and lead block.
+ * @csspart grid - The grid of cards.
+ * @csspart card - One plan card.
+ * @csspart icon - The icon tile.
+ * @csspart badge - The pill beside a card title.
+ * @csspart action - The card button (a `<button>` with `quote-dialog`, otherwise a link with `href`).
+ * @csspart footnote - The footnote under the cards.
+ * @csspart footnote-action - The text button in the footnote.
+ */
+declare class PlanCards extends LitElement {
+    static styles: lit.CSSResult;
+    /** Small uppercase label above the title. */
+    eyebrow: string;
+    title: string;
+    /** The line under the title. */
+    subtitle: string;
+    /** The cards, in order. */
+    items: PlanCardItem[];
+    /** Markdown under the cards, centred. Put `{action}` where the footnote's text button goes. */
+    footnote: string;
+    /** Label of a text button after the footnote. Opens the quote dialog with the option `unsure`. */
+    footnoteActionLabel: string;
+    /** `id` of a `st-quote-dialog`. Set, the card buttons open that dialog instead of linking. */
+    quoteDialog: string;
+    /** Fires the window `st-quote-open` event for the dialog. The page does not navigate. */
+    private openQuote;
+    private renderFootnoteAction;
+    private renderAction;
+    private renderCard;
+    /** `{action}` in the footnote becomes the inline text button; otherwise Markdown, then the button. */
+    private renderFootnote;
+    render(): lit.TemplateResult<1>;
+}
+
+export { type PlanCardItem, PlanCards };