@nnc-digital/nnc-design-system 0.4.39 → 1.0.0-alpha10

package/build/src/library/slices/Image/Image.types.d.ts

@@ -0,0 +1,26 @@
+export interface ImageProps {
+    /**
+     * The large image url
+     */
+    imageLarge: string;
+    /**
+     * The small image url
+     */
+    imageSmall: string;
+    /**
+     * The image alt text to describe the image
+     */
+    imageAltText?: string | null;
+    /**
+     * The image ratio, either '4by3' or '16by9'
+     */
+    ratio: string;
+    /**
+     * The optional image caption that goes under the image
+     */
+    caption?: string | null;
+    /**
+     * Set to true to have following text wrap against image
+     */
+    wrapText?: boolean;
+}

package/build/src/library/slices/ImageAndText/ImageAndText.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { ImageAndTextProps } from './ImageAndText.types';
+/**
+ * A container for an image and text content, with an optional heading
+ */
+declare const ImageAndText: React.FunctionComponent<ImageAndTextProps>;
+export default ImageAndText;

package/build/src/library/slices/ImageAndText/ImageAndText.storydata.d.ts

@@ -0,0 +1,2 @@
+import { ImageAndTextProps } from './ImageAndText.types';
+export declare const ImageAndTextWithHeading: ImageAndTextProps;

package/build/src/library/slices/ImageAndText/ImageAndText.test.d.ts

@@ -0,0 +1 @@
+export {};

package/build/src/library/slices/ImageAndText/ImageAndText.types.d.ts

@@ -0,0 +1,15 @@
+import { ImageProps } from '../Image/Image.types';
+export interface ImageAndTextProps {
+    /**
+     * An optional heading
+     */
+    heading?: string | null;
+    /**
+     * The string of html text content
+     */
+    textContent: string;
+    /**
+     * The image, containing the paths, alt text and caption
+     */
+    image?: ImageProps | null;
+}

package/build/src/library/slices/InquestSchedule/InquestSchedule.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { InquestScheduleProps } from './InquestSchedule.types';
+/**
+ * A table displaying a schedule of inquests
+ */
+declare const InquestSchedule: React.FunctionComponent<InquestScheduleProps>;
+export default InquestSchedule;

package/build/src/library/slices/InquestSchedule/InquestSchedule.storydata.d.ts

@@ -0,0 +1,2 @@
+import { CaseAppointmentProps } from './InquestSchedule.types';
+export declare const ExampleInquestScheduleData: CaseAppointmentProps;

package/build/src/library/slices/InquestSchedule/InquestSchedule.test.d.ts

@@ -0,0 +1 @@
+export {};

package/build/src/library/slices/InquestSchedule/InquestSchedule.types.d.ts

@@ -0,0 +1,24 @@
+export interface InquestScheduleProps {
+    /**
+     * An array of Case Appointments
+     */
+    caseAppointments: CaseAppointmentProps[];
+    /**
+     * The table title or caption
+     */
+    title: string;
+    /**
+     * Was there an error fetching results
+     */
+    error?: boolean;
+}
+export interface CaseAppointmentProps {
+    fullName: string;
+    age: number;
+    placeOfDeath?: string | null;
+    dateTimeOfDeath: string;
+    coroner: string;
+    courtroomFullAddress: string;
+    appointmentType: string;
+    startDateTime: string;
+}

package/build/src/library/slices/Promotions/Promotions.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { PromoBlockProps } from '../../structure/PromoBlock/PromoBlock.types';
+/**
+ * Combined promotional banner and promotional block for use as a slice on any page
+ */
+declare const Promotions: React.FunctionComponent<PromoBlockProps>;
+export default Promotions;

package/build/src/library/slices/SearchBox/SearchBox.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { SearchBoxProps } from './SearchBox.types';
+declare const SearchBox: React.FunctionComponent<SearchBoxProps>;
+export default SearchBox;

package/build/src/library/slices/SearchBox/SearchBox.storydata.d.ts

@@ -0,0 +1,2 @@
+import { SearchBoxProps } from './SearchBox.types';
+export declare const ExampleSearchBoxProps: SearchBoxProps;

package/build/src/library/slices/SearchBox/SearchBox.test.d.ts

@@ -0,0 +1 @@
+export {};

package/build/src/library/slices/SearchBox/SearchBox.types.d.ts

@@ -0,0 +1,41 @@
+import { CustomSearchProps } from '../../components/CustomSearch/CustomSearch.types';
+export interface SearchBoxProps {
+    /**
+     * The Custom Search sub-component props
+     */
+    customSearch: CustomSearchProps;
+    /**
+     * URL of the hero image (min 400pix high)
+     */
+    imageLarge?: string | null;
+    /**
+     * URL of the a smaller version of the image for lazy loading
+     */
+    imageSmall?: string | null;
+    /**
+     * Optional alt text for the image - ideally the image should be decorative only and not require a long description
+     */
+    imageAltText?: string | null;
+    /**
+     * Optional call to action link
+     */
+    searchBoxLink?: SearchBoxLinkProps | null;
+    /**
+     * Is the search box link primary (true) or secondary (false)
+     */
+    searchBoxLinkIsPrimary?: boolean;
+    /**
+     * Optional title
+     */
+    title?: string | null;
+}
+export interface SearchBoxLinkProps {
+    /**
+     * The url for the link
+     */
+    url: string;
+    /**
+     * The text for the link
+     */
+    title: string;
+}

package/build/src/library/slices/Video/Video.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { VideoProps } from './Video.types';
+/**
+ * A responsive video embed for YouTube or Vimeo
+ */
+declare const Video: React.FunctionComponent<VideoProps>;
+export default Video;

package/build/src/library/slices/Video/Video.test.d.ts

@@ -0,0 +1 @@
+export {};

package/build/src/library/slices/Video/Video.types.d.ts

@@ -0,0 +1,22 @@
+export interface VideoProps {
+    /**
+     * The unique video id
+     */
+    video_id: string;
+    /**
+     * The video streaming provider
+     */
+    provider: VideoProvider;
+    /**
+     * The description link text displayed when cookies are disabled
+     */
+    description: string;
+    /**
+     * Allow overriding if cookies are allowed
+     */
+    allowCookies?: boolean;
+}
+export declare enum VideoProvider {
+    YouTube = "YouTube",
+    Vimeo = "Vimeo"
+}

package/build/src/library/slices/WarningText/WarningText.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { WarningTextProps } from './WarningText.types';
+/**
+ * Display text as a highlight or warning with a title
+ */
+declare const WarningText: React.FunctionComponent<WarningTextProps>;
+export default WarningText;

package/build/src/library/slices/WarningText/WarningText.test.d.ts

@@ -0,0 +1 @@
+export {};

package/build/src/library/slices/WarningText/WarningText.types.d.ts

@@ -0,0 +1,14 @@
+export interface WarningTextProps {
+    /**
+     * 	The title of the warning
+     */
+    title: string;
+    /**
+     * 	Optional to change the colour from a secondary colour to warning
+     */
+    isWarning?: boolean;
+    /**
+     * The WarningText contents
+     */
+    children?: React.ReactNode;
+}

package/build/src/library/slices/WarningTextDisclaimer/WarningTextDisclaimer.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { WarningTextDisclaimerProps } from './WarningTextDisclaimer.types';
+declare const WarningTextDisclaimer: React.FunctionComponent<WarningTextDisclaimerProps>;
+export default WarningTextDisclaimer;

package/build/src/library/slices/WarningTextDisclaimer/WarningTextDisclaimer.types.d.ts

@@ -0,0 +1,2 @@
+export interface WarningTextDisclaimerProps {
+}

package/build/src/library/structure/AccessibleLinks/AccessibleLinks.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { AccessibleLinkProps } from "./AccessibleLinks.types";
+declare const AccessibleLink: React.FC<AccessibleLinkProps>;
+export default AccessibleLink;

package/build/src/library/structure/AccessibleLinks/AccessibleLinks.types.d.ts

@@ -0,0 +1,22 @@
+export interface AccessibleLinkProps {
+    /**
+     * An array of links for the accessible links section at the top of the page, for things like accessibility message and feedback form
+     */
+    AccessibleLinksArray?: Array<AccessibleLinkProp>;
+    includeSkipToMainContent?: boolean;
+    listItem?: boolean;
+}
+export interface AccessibleLinkProp {
+    /**
+    * Title of the link
+    */
+    title: string;
+    /**
+    * URL of the link
+    */
+    url: string;
+    /**
+    * Is the link to an external website?
+    */
+    isExternal?: boolean;
+}

package/build/src/library/structure/AlertBanner/AlertBanner.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { AlertBannerProps } from './AlertBanner.types';
+/**
+ * A site wide alert banner, once dismissed it won't be shown again
+ */
+declare const AlertBanner: React.FunctionComponent<AlertBannerProps>;
+export default AlertBanner;

package/build/src/library/structure/AlertBanner/AlertBanner.test.d.ts

@@ -0,0 +1 @@
+export {};

package/build/src/library/structure/AlertBanner/AlertBanner.types.d.ts

@@ -0,0 +1,18 @@
+export interface AlertBannerProps {
+    /**
+     * Title of the alert
+     */
+    title: string;
+    /**
+     * A unique idenification for the alert banner to store the localstorage for the hide button
+     */
+    uid: string;
+    /**
+     * The type of alert
+     */
+    alertType?: 'alert' | 'warning' | 'positive' | 'london_bridge';
+    /**
+     * All children content for the banner
+     */
+    children: React.ReactNode;
+}

package/build/src/library/structure/AlertBannerService/AlertBannerService.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { AlertBannerServiceProps } from './AlertBannerService.types';
+/**
+ * A banner to be displayed at the top of a page before the main content
+ * to draw the viewer's attention to an alert notice
+ */
+declare const AlertBannerService: React.FunctionComponent<AlertBannerServiceProps>;
+export default AlertBannerService;

package/build/src/library/structure/AlertBannerService/AlertBannerService.test.d.ts

@@ -0,0 +1 @@
+export {};

package/build/src/library/structure/AlertBannerService/AlertBannerService.types.d.ts

@@ -0,0 +1,18 @@
+export interface AlertBannerServiceProps {
+    /**
+     * The optional title of this alert banner
+     */
+    title?: string;
+    /**
+     * Set to true for additional margin above the alert banner
+     */
+    hasTopSpacing?: boolean;
+    /**
+     * The type of alert banner
+     */
+    alertType?: 'alert' | 'warning' | 'positive' | 'london_bridge';
+    /**
+     * All child content for the alert banner
+     */
+    children: React.ReactNode;
+}

package/build/src/library/structure/BackLink/BackLink.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { BackLinkProps } from './BackLink.types';
+/**
+ * A back link or a back button when using history
+ */
+declare const BackLink: React.FunctionComponent<BackLinkProps>;
+export default BackLink;

package/build/src/library/structure/BackLink/BackLink.test.d.ts

@@ -0,0 +1 @@
+export {};

package/build/src/library/structure/BackLink/BackLink.types.d.ts

@@ -0,0 +1,10 @@
+export interface BackLinkProps {
+    /**
+     * The optional uri to navigate back to
+     */
+    link?: string;
+    /**
+     * Should the browser history be used instead of the link?
+     */
+    useHistory?: boolean;
+}

package/build/src/library/structure/Breadcrumbs/Breadcrumbs.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { BreadcrumbsProps } from './Breadcrumbs.types';
+declare const Breadcrumbs: React.FunctionComponent<BreadcrumbsProps>;
+export default Breadcrumbs;

package/build/src/library/structure/Breadcrumbs/Breadcrumbs.test.d.ts

@@ -0,0 +1 @@
+export {};

package/build/src/library/structure/Breadcrumbs/Breadcrumbs.types.d.ts

@@ -0,0 +1,20 @@
+export interface BreadcrumbsProps {
+    /**
+     * An array of the breadcrumbs, each with a title and a URL not including the current page users are on
+     */
+    breadcrumbsArray: Array<BreadcrumbProp>;
+    /**
+     * Should the breadcrumbs have bottom margin
+     */
+    hasMargin?: boolean;
+}
+export interface BreadcrumbProp {
+    /**
+     * Title of the page
+     */
+    title: string;
+    /**
+     * URL of the page
+     */
+    url: string;
+}

package/build/src/library/structure/Contents/Contents.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { ContentsProps } from './Contents.types';
+declare const Contents: React.FunctionComponent<ContentsProps>;
+export default Contents;

package/build/src/library/structure/Contents/Contents.storydata.d.ts

@@ -0,0 +1,2 @@
+import { ContentLink } from './Contents.types';
+export declare const ContentsExampleData: ContentLink[];

package/build/src/library/structure/Contents/Contents.test.d.ts

@@ -0,0 +1 @@
+export {};

package/build/src/library/structure/Contents/Contents.types.d.ts

@@ -0,0 +1,24 @@
+export interface ContentsProps {
+    /**
+     * An array of content links
+     */
+    contents: ContentLink[];
+    /**
+     * The optional current path
+     */
+    currentPath?: string;
+    /**
+     * The optional contents title, defaults to 'Contents'
+     */
+    title?: string;
+}
+export interface ContentLink {
+    /**
+     * Title of the page
+     */
+    title: string;
+    /**
+     * URL of the page
+     */
+    url: string;
+}

package/build/src/library/structure/ContentsNavigation/ContentsNavigation.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { ContentsProps } from '../Contents/Contents.types';
+declare const ContentsNavigation: React.FunctionComponent<ContentsProps>;
+export default ContentsNavigation;

package/build/src/library/structure/ContentsNavigation/ContentsNavigation.test.d.ts

@@ -0,0 +1 @@
+export {};

package/build/src/library/structure/CookieBanner/CookieBanner.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { CookieBannerProps } from './CookieBanner.types';
+export declare const AcceptCookies: () => void;
+export declare const RejectCookies: () => void;
+declare const CookieBanner: React.FunctionComponent<CookieBannerProps>;
+export default CookieBanner;

package/build/src/library/structure/CookieBanner/CookieBanner.types.d.ts

@@ -0,0 +1,30 @@
+export interface CookieBannerProps {
+    /**
+     * Title of cookie banner
+     */
+    title: string;
+    /**
+     * Paragraph about cookies
+     */
+    paragraph: React.ReactNode;
+    /**
+     * Accept all button text
+     */
+    acceptButtonText: string;
+    /**
+     * Confirmation of acceptance text
+     */
+    acceptConfirmationText?: string;
+    /**
+     * Reject all button text
+     */
+    rejectButtonText: string;
+    /**
+     * Confirmation of rejection text
+     */
+    rejectConfirmationText?: string;
+    /**
+     * gets called on accept - lets you do extra things - like set the 🍪
+     */
+    acceptCallback?: Function;
+}

package/build/src/library/structure/CookieBanner/CookieClear.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+interface CookieClearProps {
+}
+declare const CookieBanner: React.FunctionComponent<CookieClearProps>;
+export default CookieBanner;

package/build/src/library/structure/DisplayDate/DisplayDate.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { DisplayDateProps } from './DisplayDate.types';
+/**
+ * Display the date
+ */
+declare const DisplayDate: React.FunctionComponent<DisplayDateProps>;
+export default DisplayDate;

package/build/src/library/structure/DisplayDate/DisplayDate.types.d.ts

@@ -0,0 +1,18 @@
+export interface DisplayDateProps {
+    /**
+     * The text in the hint
+     */
+    text: string;
+    /**
+     * The format for the date - default it timestamp
+     */
+    format: string;
+    /**
+     * Text before the date (no spaces included on render in case you need a colon: before the date)
+     */
+    preText?: string;
+    /**
+     * Text after the date
+     */
+    postText?: string;
+}

package/build/src/library/structure/Footer/Footer.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { FooterProps } from './Footer.types';
+declare const Footer: React.FunctionComponent<FooterProps>;
+export default Footer;

package/build/src/library/structure/Footer/Footer.test.d.ts

@@ -0,0 +1 @@
+export {};

package/build/src/library/structure/Footer/Footer.types.d.ts

@@ -0,0 +1,24 @@
+export interface FooterProps {
+    /**
+     * An array of links for the bottom of the footer, for things like cookie and privacy policies
+     */
+    footerLinksArray?: Array<FooterLinkProp>;
+    /**
+     * The year for the copyright
+     */
+    year?: string;
+}
+export interface FooterLinkProp {
+    /**
+    * Title of the link
+    */
+    title: string;
+    /**
+    * URL of the link
+    */
+    url: string;
+    /**
+    * Is the link to an external website?
+    */
+    isExternal?: boolean;
+}

package/build/src/library/structure/FullWidthContainer/FullWidthContainer.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { FullWidthContainerProps } from './FullWidthContainer.types';
+/**
+ * A Full Width Container with optional padding and background
+ */
+declare const FullWidthContainer: React.FunctionComponent<FullWidthContainerProps>;
+export default FullWidthContainer;

package/build/src/library/structure/FullWidthContainer/FullWidthContainer.test.d.ts

@@ -0,0 +1 @@
+export {};

package/build/src/library/structure/FullWidthContainer/FullWidthContainer.types.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+export interface FullWidthContainerProps {
+    /**
+     * Show background colour when true
+     */
+    hasBackground?: boolean;
+    /**
+     * Show top and bottom padding when true
+     */
+    hasPadding?: boolean;
+    /**
+     * The FullWidthContainer contents
+     */
+    children?: React.ReactNode;
+}

package/build/src/library/structure/Header/Header.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { HeaderProps } from './Header.types';
+/**
+ * The header that should appear at the top of every page.
+ */
+declare const Header: React.FunctionComponent<HeaderProps>;
+export default Header;

package/build/src/library/structure/Header/Header.test.d.ts

@@ -0,0 +1 @@
+export {};

package/build/src/library/structure/Header/Header.types.d.ts

@@ -0,0 +1,30 @@
+export interface HeaderProps {
+    /**
+     * Hide the searchbar, set to true on the search page so there aren't two search inputs.
+     */
+    hideSearchBar?: boolean;
+    /**
+     * Link to the root of the website that will be used on the logo
+     */
+    homeLink?: string;
+    /**
+     * Set to true to include a link to /news in the header
+     */
+    hasNewsLink?: boolean;
+    /**
+     * Link to the list of all services displayed at top right (#all-services anchor added to this)
+     */
+    allServicesLink?: string;
+    /**
+     * This flag is used to alter the all-services link to an in-page anchor if true
+     */
+    isHomepage?: boolean;
+    /**
+     * Array of suggestions for the autocomplete input in the search bar
+     */
+    searchSuggestions?: string[];
+    /**
+     * The Header contents
+     */
+    children?: React.ReactNode;
+}

package/build/src/library/structure/HeroImage/HeroImage.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { HeroImageProps } from './HeroImage.types';
+/**
+ * Hero image banner with optional text and call to action with varying presentation of text area.
+ * For optional use at the top of a service landing page, if set in the CMS.
+ */
+declare const HeroImage: React.FunctionComponent<HeroImageProps>;
+export default HeroImage;

package/build/src/library/structure/HeroImage/HeroImage.storydata.d.ts

@@ -0,0 +1,6 @@
+import { HeroImageProps } from './HeroImage.types';
+export declare const HeroImageExampleBoxedData: HeroImageProps;
+export declare const HeroImageExampleGradientData: HeroImageProps;
+export declare const HeroImageExampleMicroSiteData: HeroImageProps;
+export declare const HeroImageExampleBoxedWithBreadcrumbData: HeroImageProps;
+export declare const HeroImageExampleBoxedWithCustomSearch: HeroImageProps;

package/build/src/library/structure/HeroImage/HeroImage.test.d.ts

@@ -0,0 +1 @@
+export {};