@godxjp/ui 33.19.0 → 33.21.0

package/dist/components/layout/editorial.d.ts

@@ -0,0 +1,56 @@
+import * as React from "react";
+import type { CardShowcaseProp, EditorialArticleProp, EditorialArticleSectionProp, EditorialNoteProp, EditorialPanelProp, CatalogCardProp, CatalogCardTagProp, EditorialBannerProp, EditorialBreadcrumbProp, EditorialCardProp, EditorialFilterBarProp, EditorialFooterProp, EditorialMastheadLinkProp, EditorialMastheadProp, EditorialHeroProp, EditorialPageHeaderProp, EditorialPillNavItemProp, EditorialPillNavProp, EditorialSearchProp, EditorialSectionHeadProp, EditorialSectionProp, EditorialTextLinkProp, EyebrowProp } from "../../props/components/layout.prop.js";
+export type { EditorialArticleProp, EditorialArticleProp as EditorialArticleProps, EditorialArticleSectionProp, EditorialNoteProp, EditorialPanelProp, EditorialPanelProp as EditorialPanelProps, EditorialBreadcrumbProp, EditorialBreadcrumbProp as EditorialBreadcrumbProps, EditorialPageHeaderProp, EditorialPageHeaderProp as EditorialPageHeaderProps, CardShowcaseProp, CardShowcaseProp as CardShowcaseProps, CatalogCardProp, CatalogCardProp as CatalogCardProps, CatalogCardTagProp, EditorialBannerProp, EditorialBannerProp as EditorialBannerProps, EditorialCardProp, EditorialCardProp as EditorialCardProps, EditorialHeroProp, EditorialHeroProp as EditorialHeroProps, EditorialPillNavItemProp, EditorialPillNavProp, EditorialPillNavProp as EditorialPillNavProps, EditorialSearchProp, EditorialSearchProp as EditorialSearchProps, EditorialSearchSuggestionFooterProp, EditorialSearchSuggestionGroupProp, EditorialSearchSuggestionProp, EditorialSectionHeadProp, EditorialSectionHeadProp as EditorialSectionHeadProps, EditorialSectionProp, EditorialSectionProp as EditorialSectionProps, EditorialTextLinkProp, EyebrowProp, EyebrowProp as EyebrowProps, EditorialFilterBarProp, EditorialFooterProp, EditorialMastheadActionProp, EditorialMastheadLinkProp, EditorialMastheadProp, } from "../../props/components/layout.prop.js";
+/** One full-width band of a `flow="sections"` page; the content sits in the landing column. */
+export declare function EditorialSection({ children, tone, divider, spacing, as: Tag, className, ...rest }: EditorialSectionProp): React.JSX.Element;
+/** The opening of an editorial page: copy (kicker, h1, lead, search, suggestions) beside media. */
+export declare function EditorialHero({ eyebrow, title, description, search, footer, media, className, }: EditorialHeroProp): React.JSX.Element;
+/** The small uppercase kicker above an editorial heading, led by a short ornament rule. */
+export declare function Eyebrow({ children, variant, as: Tag, className }: EyebrowProp): React.JSX.Element;
+/** A section's head: kicker, an editorial title, one line of description and a trailing action. */
+export declare function EditorialSectionHead({ eyebrow, title, description, action, level, scale, titleId, className, }: EditorialSectionHeadProp): React.JSX.Element;
+/** The trail at the top of an editorial page: `Breadcrumb` with the editorial rhythm (gh#1437). */
+export declare function EditorialBreadcrumb({ items, linkComponent, ariaLabel, className, }: EditorialBreadcrumbProp): React.JSX.Element;
+/** The intro of an editorial listing page: trail, kicker, the page's h1, a lead and an action. */
+export declare function EditorialPageHeader({ breadcrumb, linkComponent, breadcrumbLabel, eyebrow, title, description, actions, search, titleId, eyebrowTone, className, }: EditorialPageHeaderProp): React.JSX.Element;
+/** The reading column of a long-form editorial page: kicker, the page's h1, intro, sections. */
+export declare function EditorialArticle({ eyebrow, title, intro, children, titleId, className, }: EditorialArticleProp): React.JSX.Element;
+/** One titled section of an `EditorialArticle`: an h2, paragraphs of prose, then anything else. */
+export declare function EditorialArticleSection({ title, paragraphs, children, titleId, className, }: EditorialArticleSectionProp): React.JSX.Element;
+/** A note block in an editorial article, set off by an ornament rule on its start edge. */
+export declare function EditorialNote({ children, className }: EditorialNoteProp): React.JSX.Element;
+/** A bordered panel: a tag, a heading and a list (a roadmap group). */
+export declare function EditorialPanel({ tag, title, items, children, level, className, }: EditorialPanelProp): React.JSX.Element;
+/** An inline call to action with a trailing arrow. `asChild` wraps a router link. */
+export declare function EditorialTextLink({ children, asChild, className, ...rest }: EditorialTextLinkProp): React.JSX.Element;
+/** The site search: `inset` (glyph, field and submit in one box) or `inline` (gh#1439). */
+export declare function EditorialSearch(props: EditorialSearchProp): React.JSX.Element;
+/** A horizontal band of section links, scrolling sideways when it overflows. */
+export declare function EditorialPillNav({ label, children, className, ...rest }: EditorialPillNavProp): React.JSX.Element;
+/** One pill of an `EditorialPillNav`; `aria-current="page"` marks the current one. */
+export declare function EditorialPillNavItem({ children, asChild, icon, className, ...rest }: EditorialPillNavItemProp): React.JSX.Element;
+/** A staged composition of product pictures: a fan of three cards, or a tilted binder page. */
+export declare function CardShowcase({ preset, items, label, caption, className }: CardShowcaseProp): React.JSX.Element;
+/** A rounded brand panel: kicker, title, description and a call to action beside a media slot. */
+export declare function EditorialBanner({ eyebrow, title, description, action, media, level, className, }: EditorialBannerProp): React.JSX.Element;
+/** A catalog tile: framed picture with an overlaid favourite, then overline, title, meta, price. */
+export declare function CatalogCard({ variant, media, favorite, overline, title, level, meta, priceLabel, price, change, footer, className, }: CatalogCardProp): React.JSX.Element;
+/** A small outlined tag in a `CatalogCard` metadata row. */
+export declare function CatalogCardTag({ children, className }: CatalogCardTagProp): React.JSX.Element;
+/** A whole-card link: a journal card (cover, category, title, lines, arrow) or a spotlight row. */
+export declare function EditorialCard({ variant, link, media, overline, title, description, action, level, titleId, className, }: EditorialCardProp): React.JSX.Element;
+/** A public site's header row: logo, primary navigation, actions, and the phone-only menu trigger. */
+export declare function EditorialMasthead({ brand, nav, navLabel, actions, menu, className, }: EditorialMastheadProp): React.JSX.Element;
+/** One primary navigation link of an `EditorialMasthead`; `aria-current="page"` underlines it. */
+export declare function EditorialMastheadLink({ children, asChild, className, ...rest }: EditorialMastheadLinkProp): React.JSX.Element;
+/** A 44px icon control of an `EditorialMasthead` (theme toggle, account). */
+export declare const EditorialMastheadAction: React.ForwardRefExoticComponent<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "color"> & {
+    children: import("../../props/index.js").ChildrenProp;
+    asChild?: boolean;
+    variant?: "ghost" | "outline";
+    collapse?: boolean;
+} & React.RefAttributes<HTMLButtonElement>>;
+/** A public site's footer content: brand and tagline, link groups, and a bottom row. */
+export declare function EditorialFooter({ brand, tagline, groups, level, legal, note, className, }: EditorialFooterProp): React.JSX.Element;
+/** A row of underlined filter toggles (one pressed at a time) with a trailing note. */
+export declare function EditorialFilterBar({ options, value, onValueChange, extra, className, ...rest }: EditorialFilterBarProp): React.JSX.Element;