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

package/build/src/library/structure/SearchResultsList/NoResultsMessage.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const NoResultsMessage: React.FunctionComponent;
+export default NoResultsMessage;

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

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

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

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

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

@@ -0,0 +1,46 @@
+import { SignpostLinkProp } from '../../components/SignpostLinksList/SignpostLinksList.types';
+export interface SearchResultsListProps {
+    /**
+     * What you searched for
+     */
+    searchTerm: string;
+    /**
+     * Array of results
+     */
+    results: Array<SearchResultProps>;
+    /**
+     * The total number of results
+     */
+    totalResults?: number;
+    /**
+     * The current page number
+     */
+    pageNumber?: number;
+}
+export interface SearchResultProps {
+    /**
+     * Search result title
+     */
+    title: string;
+    /**
+     * Link to page
+     */
+    link: string;
+    /**
+     * Summary of page
+     */
+    summary: string;
+    /**
+     * If it contains signposting links include them here
+     */
+    signpostLinksArray?: Array<SignpostLinkProp>;
+    /**
+     * Optional override for the top line of text
+     */
+    TopLineText?: string;
+    /**
+     * If there is a service area tied to the result
+     */
+    service?: string;
+    promoted?: boolean;
+}

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

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

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

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

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

@@ -0,0 +1,48 @@
+export interface SearchbarProps {
+    /**
+     * ID passed to the Autocomplete component
+     */
+    id?: string;
+    /**
+     * The searched for term
+     */
+    searchTerm?: string;
+    /**
+     * Placeholder text
+     */
+    placeholder?: string;
+    /**
+     * Whether or not this is the light version of the search
+     */
+    isLight?: boolean;
+    /**
+     * If used on it's own (eg search results page) then will be slightly larger
+     */
+    isLarge?: boolean;
+    /**
+     * Array of suggestion strings for autocomplete input
+     */
+    suggestions?: string[];
+    /**
+     * The minimum number of characters that need to be typed before matches in the suggestions list are looked for
+     */
+    minimumMatchLength?: number;
+    /**
+     * The maximum number of matched suggestions shown in the dropdown list
+     */
+    maximumMatchesShown?: number;
+    /**
+    * Where to post the form submission to and what params to use
+    */
+    submitInfo?: SubmitInfoProps;
+}
+export interface SubmitInfoProps {
+    /**
+     * Where we're posting the form to eg /search or /news
+     */
+    postTo: string;
+    /**
+     * Any additional parameters to send
+     */
+    params: object;
+}

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

@@ -0,0 +1,7 @@
+import React from 'react';
+import { SectionLinksProps } from './SectionLinks.types';
+/**
+ * Display a list of links for a section with optional images
+ */
+declare const SectionLinks: React.FunctionComponent<SectionLinksProps>;
+export default SectionLinks;

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

@@ -0,0 +1,2 @@
+import { PageLinkProp } from './SectionLinks.types';
+export declare const pageLinksArray: PageLinkProp[];

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

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

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

@@ -0,0 +1,52 @@
+export interface SectionLinksProps {
+    /**
+     * The title of the section
+     */
+    sectionTitle: string;
+    /**
+     * If there is only one section then do not display the title
+     */
+    displayTitle?: boolean;
+    /**
+     * A url slug for the section title
+     */
+    sectionSlug: string;
+    /**
+     * An array of page links that sit under this section
+     */
+    pageLinksArray: Array<PageLinkProp>;
+    /**
+     * Should the section links have images
+     */
+    hasImages?: boolean;
+}
+export interface PageLinkProp {
+    /**
+     * Title of the page
+     */
+    title: string;
+    /**
+     * Summary of the page
+     */
+    summary: string;
+    /**
+     * URL of the page
+     */
+    url: string;
+    /**
+     * Is the link to an external website?
+     */
+    isExternal?: boolean;
+    /**
+     * The small image url
+     */
+    imageSmall?: string | null;
+    /**
+     * The large image url
+     */
+    imageLarge?: string | null;
+    /**
+     * The image alt text
+     */
+    imageAltText?: string | null;
+}

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

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

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

@@ -0,0 +1,16 @@
+export interface SectionLinksMobileContentsProps {
+    /**
+    * An array of the SectionLinksMobileContents, each with a title and a URL not including the current page users are on
+    */
+    sectionLinksArray: Array<SectionProp>;
+}
+export interface SectionProp {
+    /**
+    * Title of the section
+    */
+    title: string;
+    /**
+    * ID slug of the section
+    */
+    id: string;
+}

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

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

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

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

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

@@ -0,0 +1,34 @@
+export interface SectionLinksSidebarProps {
+    /**
+     * Title
+     */
+    Title: string;
+    /**
+     * An array of sections
+     */
+    Sections: Array<SectionsProps>;
+}
+export interface SectionsProps {
+    /**
+     * The optional section title
+     */
+    SectionTitle?: string;
+    /**
+     * The array of section links
+     */
+    SectionLinks: Array<LinksProp>;
+}
+export interface LinksProp {
+    /**
+     * Title of the page
+     */
+    title: string;
+    /**
+     * URL of the page
+     */
+    url: string;
+    /**
+     * Is this the current page
+     */
+    isCurrent?: boolean;
+}

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

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

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

@@ -0,0 +1,9 @@
+export declare const serviceLinksArray: {
+    title: string;
+    url: string;
+    iconKey: string;
+    quickLinksArray: {
+        title: string;
+        url: string;
+    }[];
+}[];

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

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

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

@@ -0,0 +1,53 @@
+export interface ServiceLinksBoxedProps {
+    /**
+     * An array of all the top level service landing pages
+     */
+    serviceLinksArray: Array<PageLinkProp>;
+    /**
+     * Id of container
+     */
+    serviceId?: string;
+}
+export interface PageLinkProp {
+    /**
+     * Title of the page
+     */
+    title: string;
+    /**
+     * URL of the page
+     */
+    url: string;
+    /**
+     * The key of the icon
+     */
+    iconKey?: string;
+    /**
+     * Array of quick links for the service
+     */
+    quickLinksArray?: Array<QuickLinkProp>;
+    quickLinksShow?: boolean;
+}
+export interface QuickLinkProp {
+    /**
+     * Title of the page
+     */
+    title: string;
+    /**
+     * URL of the page
+     */
+    url: string;
+}
+export interface MemorialQuickLinkProp {
+    /**
+     * The key of the icon
+     */
+    iconKey?: string;
+    /**
+     * An array of Quick Links
+     */
+    link: Array<QuickLinkProp>;
+    /**
+     * Some summary text
+     */
+    summary: string;
+}

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

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

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

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

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

@@ -0,0 +1,68 @@
+export interface ServicesLinksListProps {
+    /**
+     * An array of all the top level service landing pages
+     */
+    serviceLinksArray: Array<PageLinkProp>;
+    /**
+     * Display a white background on each block
+     */
+    hasBackground?: boolean;
+    /**
+     * Hide the header
+     */
+    hideHeader?: boolean;
+    /**
+     * Show everything in a single column
+     */
+    oneCol?: boolean;
+    /**
+     * Id of container
+     */
+    serviceId?: string;
+    /**
+     * Should the view be boxed
+     */
+    isBoxed?: boolean;
+}
+export interface PageLinkProp {
+    /**
+     * Title of the page
+     */
+    title: string;
+    /**
+     * URL of the page
+     */
+    url: string;
+    /**
+     * The key of the icon
+     */
+    iconKey?: string;
+    /**
+     * Array of quick links for the service
+     */
+    quickLinksArray?: Array<QuickLinkProp>;
+}
+export interface QuickLinkProp {
+    /**
+     * Title of the page
+     */
+    title: string;
+    /**
+     * URL of the page
+     */
+    url: string;
+}
+export interface MemorialQuickLinkProp {
+    /**
+     * The key of the icon
+     */
+    iconKey?: string;
+    /**
+     * An array of Quick Links
+     */
+    link: Array<QuickLinkProp>;
+    /**
+     * Some summary text
+     */
+    summary: string;
+}

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

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

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

@@ -0,0 +1,32 @@
+export interface SignpostLinksProps {
+    /**
+     * Optional override for the top line of text
+     */
+    TopLineText?: string;
+    /**
+    * An array of the SignpostLinks
+    */
+    signpostLinksArray: Array<SignpostLinkProp>;
+    /**
+     * Optional, but recommended - a link to send the user to the other council's (West or North) specific service page, defaults to the homepage
+     */
+    otherCouncilLink?: string;
+}
+export interface SignpostLinkProp {
+    /**
+    * The number that represents the local area - based on the list of all local areas in alphabetical order
+    */
+    sovereignCode: number;
+    /**
+    * The name of the local area
+    */
+    areaName: string;
+    /**
+     * An optional override for the call to action text
+     */
+    cta_text?: string;
+    /**
+    * URL of this service on the local area's website
+    */
+    url: string;
+}

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

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

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

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

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

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

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

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

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

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

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

@@ -0,0 +1,15 @@
+import React from 'react';
+export interface SummaryProps {
+    /**
+     * Should the summary have padding
+     */
+    hasPadding?: boolean;
+    /**
+     * Should the summary have a background colour
+     */
+    hasBackground?: boolean;
+    /**
+     * The contents of the summary
+     */
+    children?: React.ReactNode;
+}

package/build/src/themes/ThemeVars.types.d.ts

@@ -0,0 +1,60 @@
+export interface ThemeVars {
+    theme_name: string;
+    full_name: string;
+    cardinal_name: string;
+    is_memorial: boolean;
+    council_link?: string;
+    other_council_link?: string;
+    other_council_name?: string;
+    other_council_action?: string;
+    twitter_link?: string;
+    linkedin_link?: string;
+    facebook_link?: string;
+    instagram_link?: string;
+    youtube_link?: string;
+    breakpointsVals: ThemeBreakpointTypes;
+    breakpoints: ThemeBreakpointTypes;
+    fontstack: string;
+    colours: ThemeColourTypes;
+    fontSizes: ThemeSizeTypes;
+    border_width: string;
+    border_width_error: string;
+    border_width_thin: string;
+    border_radius: string;
+    border_radius_large: string;
+    spacingSizes: ThemeSizeTypes;
+    h1: string;
+    h2: string;
+    h3: string;
+    h4: string;
+}
+export interface ThemeBreakpointTypes {
+    s: string;
+    m: string;
+    l: string;
+    xl: string;
+}
+export interface ThemeColourTypes {
+    black: string;
+    grey_darkest: string;
+    grey_dark: string;
+    grey: string;
+    grey_light: string;
+    white: string;
+    action: string;
+    action_light: string;
+    action_dark: string;
+    positive: string;
+    negative: string;
+    visited?: string;
+    focus: string;
+    placeholder: string;
+    secondary?: string;
+}
+export interface ThemeSizeTypes {
+    extra_small: string;
+    small: string;
+    medium: string;
+    large: string;
+    x_large?: string;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nnc-digital/nnc-design-system",
-  "version": "0.4.39",
+  "version": "1.0.0-alpha1",
   "description": "Design system for West & North Northamptonshire Councils, two unitary councils encompassing Wellingborough, Corby, Daventry, East Northants, Kettering, Northampton, Northamptonshire County and South Northants.",
   "main": "build/index.js",
   "repository": {
@@ -13,7 +13,7 @@
     "url": "https://github.com/NNC-Digital/nnc-design-system.git/issues"
   },
   "homepage": "https://northants-design-system.netlify.app/",
-  "module": "build/index.esm.js",
+  "module": "build/index.mjs.js",
   "files": [
     "build"
   ],
@@ -22,8 +22,9 @@
     "build": "rollup -c",
     "test": "jest",
     "test:watch": "jest --watch",
-    "storybook": "start-storybook -s ./public -p 6006",
-    "storybook:export": "build-storybook",
+    "test:coverage": "jest --coverage",
+    "storybook": "storybook dev -p 6006",
+    "storybook:export": "storybook build",
     "generate": "node ./util/create-component",
     "prepublishOnly": "npm run build",
     "dev": "npm run storybook"
@@ -42,7 +43,7 @@
     "axios": "^1",
     "react": ">=18.2.0",
     "react-dom": ">=18.2.0",
-    "styled-components": "^5.3.3"
+    "styled-components": "^6.1.1"
   },
   "resolutions": {
     "@storybook/react/webpack": "^5"
@@ -51,28 +52,25 @@
     "@babel/core": "^7.16.7",
     "@babel/preset-env": "^7.16.11",
     "@babel/preset-typescript": "^7.16.7",
-    "@etchteam/storybook-addon-status": "^4.2.2",
+    "@etchteam/storybook-addon-status": "^4.2.4",
     "@googlemaps/react-wrapper": "^1.1.35",
     "@googlemaps/typescript-guards": "^2.0.3",
-    "@rollup/plugin-commonjs": "^22.0.0",
-    "@rollup/plugin-json": "~4.1.0",
-    "@rollup/plugin-node-resolve": "^13.1.0",
-    "@storybook/addon-a11y": "^6.5.15",
-    "@storybook/addon-essentials": "^6.5.15",
-    "@storybook/addon-ie11": "0.0.6",
-    "@storybook/addon-links": "^6.5.15",
-    "@storybook/builder-webpack5": "^6.5.15",
-    "@storybook/manager-webpack5": "^6.5.15",
-    "@storybook/react": "^6.5.15",
-    "@testing-library/jest-dom": "^5.16.2",
-    "@testing-library/react": "^13.0.0",
+    "@rollup/plugin-commonjs": "^24.0.0",
+    "@rollup/plugin-json": "^6.1.0",
+    "@rollup/plugin-node-resolve": "^15.2.3",
+    "@storybook/addon-a11y": "^7.5.3",
+    "@storybook/addon-essentials": "^7.5.3",
+    "@storybook/addon-links": "^7.5.3",
+    "@storybook/react": "^7.5.3",
+    "@testing-library/jest-dom": "6.0",
+    "@testing-library/react": "^14.0.0",
     "@types/google.maps": "^3.50.5",
     "@types/jest": "^29.2.5",
     "@types/react": "^18.0.26",
     "@types/react-dom": "^18.0.10",
     "@types/styled-components": "^5.1.19",
-    "@typescript-eslint/eslint-plugin": "^5.12.0",
-    "@typescript-eslint/parser": "^5.12.0",
+    "@typescript-eslint/eslint-plugin": "6.0",
+    "@typescript-eslint/parser": "6.0",
     "axios": "^1",
     "babel-jest": "^29.0.0",
     "babel-loader": "^9.0.0",
@@ -85,7 +83,7 @@
     "eslint-plugin-jsx-a11y": "^6.5.1",
     "eslint-plugin-react": "^7.28.0",
     "eslint-plugin-react-hooks": "^4.3.0",
-    "eslint-plugin-storybook": "^0.6.8",
+    "eslint-plugin-storybook": "^0.6.15",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^29",
     "jest-environment-jsdom": "^29.3.1",
@@ -93,24 +91,28 @@
     "node-sass": "^8.0.0",
     "react": "~18",
     "react-dom": "~18",
-    "rollup": "^2.75",
+    "rollup": "^3.29.4",
     "rollup-plugin-copy": "^3.4.0",
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "rollup-plugin-postcss": "^4.0.2",
     "rollup-plugin-svg": "^2.0.0",
     "rollup-plugin-typescript2": "^0.34",
     "sass-loader": "^13.0.0",
-    "styled-components": "^5.3.3",
+    "styled-components": "^6.1.1",
     "ts-jest": "^29",
-    "typescript": "4.9.*",
+    "typescript": "^5.5.2",
     "webpack": "^5.69.0"
   },
   "dependencies": {
+    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
+    "@storybook/react-webpack5": "^7.5.3",
     "core-js": "^3.20.2",
     "downshift": "^6.1.7",
-    "html-react-parser": "^1.4.5",
+    "html-react-parser": "^3.0.16",
     "react-lazy-progressive-image": "^1.5.5",
     "react-qr-code": "^2.0.11",
-    "sanitize-html": "^2.6.1"
+    "sanitize-html": "^2.6.1",
+    "storybook": "^7.5.3",
+    "stylis": "^4.3.0"
   }
 }