@scottish-government/designsystem-react 0.13.0 → 1.0.1

package/dist/components/SummaryList/types.d.ts

@@ -0,0 +1,6 @@
+export interface SummaryListItemProps extends React.LiHTMLAttributes<HTMLLIElement> {
+    title: string;
+}
+export interface SummaryListProps extends React.OlHTMLAttributes<HTMLOListElement> {
+    isBorderless?: boolean;
+}

package/dist/components/SummaryList/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/components/Table/Table.d.ts

@@ -1,5 +1,6 @@
+import { TableProps } from './types';
 declare const Table: {
-    ({ children, className, smallscreen, ...props }: SGDS.Component.Table): import("react").JSX.Element;
+    ({ children, className, smallscreen, ...props }: TableProps): import("react").JSX.Element;
     displayName: string;
 };
 export default Table;

package/dist/components/Table/Table.jsx

@@ -4,19 +4,20 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = require("react");
-// @ts-ignore
 const table_1 = __importDefault(require("@scottish-government/design-system/src/components/table/table"));
+const clsx_1 = __importDefault(require("clsx"));
 const Table = ({ children, className, smallscreen, ...props }) => {
     const ref = (0, react_1.useRef)(null);
     (0, react_1.useEffect)(() => {
+        /* istanbul ignore else */
         if (ref.current) {
-            new table_1.default().init();
+            new table_1.default(ref.current).init();
         }
     }, [ref]);
-    return (<table className={[
+    return (<table className={(0, clsx_1.default)([
             'ds_table',
             className
-        ].join(' ')} data-smallscreen={smallscreen} ref={ref} {...props}>
+        ])} data-smallscreen={smallscreen} ref={ref} {...props}>
             {children}
         </table>);
 };

package/dist/components/Table/types.d.ts

@@ -0,0 +1,6 @@
+type SmallScreen = 'scrolling' | 'boxes';
+export interface TableProps extends React.AllHTMLAttributes<HTMLTableElement> {
+    className?: string;
+    smallscreen?: SmallScreen;
+}
+export {};

package/dist/components/Table/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/components/Tabs/Tabs.d.ts

@@ -1,9 +1,10 @@
 import React from 'react';
+import { TabsItemProps, TabsProps } from './types';
 declare const Tabs: {
-    ({ baseId, children, className, headingLevel, isBorderless, isManual, title, ...props }: SGDS.Component.Tabs): React.JSX.Element;
+    ({ baseId, children, className, headingLevel, isBorderless, isManual, title, ...props }: TabsProps): React.JSX.Element;
     displayName: string;
     Item: {
-        ({ isBorderless, children, className, id, tabLabel, ...props }: SGDS.Component.Tabs.Item): React.JSX.Element;
+        ({ isBorderless, children, className, id, tabLabel, ...props }: TabsItemProps): React.JSX.Element;
         displayName: string;
     };
 };

package/dist/components/Tabs/Tabs.jsx

@@ -38,14 +38,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
 const WrapperTag_1 = __importDefault(require("../../common/WrapperTag"));
-// @ts-ignore
 const tabs_1 = __importDefault(require("@scottish-government/design-system/src/components/tabs/tabs"));
+const clsx_1 = __importDefault(require("clsx"));
 const TabItem = ({ isBorderless, children, className, id, tabLabel, ...props }) => {
-    return (<div className={[
+    return (<div className={(0, clsx_1.default)([
             'ds_tabs__content',
             !isBorderless && 'ds_tabs__content--bordered',
             className
-        ].join(' ')} id={id} {...props}>
+        ])} data-label={tabLabel} id={id} {...props}>
             {children}
         </div>);
 };
@@ -58,6 +58,7 @@ const Tabs = ({ baseId = 'tabs', children, className, headingLevel = 'h2', isBor
     const ref = (0, react_1.useRef)(null);
     const headingId = `${baseId}-heading`;
     (0, react_1.useEffect)(() => {
+        /* istanbul ignore else */
         if (ref.current) {
             new tabs_1.default(ref.current).init();
         }
@@ -76,11 +77,11 @@ const Tabs = ({ baseId = 'tabs', children, className, headingLevel = 'h2', isBor
             return <TabListItem href={`#${child.props.id}`}>{child.props.tabLabel}</TabListItem>;
         }
     });
-    return (<div className={[
+    return (<div className={(0, clsx_1.default)([
             'ds_tabs',
             isManual && 'ds_tabs--manual',
             className
-        ].join(' ')} ref={ref} {...props}>
+        ])} ref={ref} {...props}>
             <WrapperTag_1.default id={headingId} className="ds_tabs__title" tagName={headingLevel}>
                 {title}
             </WrapperTag_1.default>

package/dist/components/Tabs/types.d.ts

@@ -0,0 +1,16 @@
+import { HeadingLevel } from '../../shared-types';
+export interface TabsItemProps extends React.AllHTMLAttributes<HTMLElement> {
+    isBorderless?: boolean;
+    id: string;
+    tabLabel: string;
+}
+export interface TabListItemProps extends React.AllHTMLAttributes<HTMLLIElement> {
+    href: string;
+}
+export interface TabsProps extends React.AllHTMLAttributes<HTMLElement> {
+    baseId: string;
+    isBorderless?: boolean;
+    headingLevel?: HeadingLevel;
+    isManual?: boolean;
+    title: string;
+}

package/dist/components/Tabs/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/components/Tag/Tag.d.ts

@@ -1,5 +1,6 @@
+import { TagProps } from "./types";
 declare const Tag: {
-    ({ children, className, colour, ...props }: SGDS.Component.Tag): import("react").JSX.Element;
+    ({ children, className, colour, ...props }: TagProps): import("react").JSX.Element;
     displayName: string;
 };
 export default Tag;

package/dist/components/Tag/Tag.jsx

@@ -1,11 +1,15 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
+const clsx_1 = __importDefault(require("clsx"));
 const Tag = ({ children, className, colour, ...props }) => {
-    return (<span className={[
+    return (<span className={(0, clsx_1.default)([
             'ds_tag',
             className,
-            colour && `ds_tag--${colour}`,
-        ].join(' ')} {...props}>
+            colour && `ds_tag--${colour}`
+        ])} {...props}>
             {children}
         </span>);
 };

package/dist/components/Tag/types.d.ts

@@ -0,0 +1,4 @@
+import { TagColour } from '../../shared-types';
+export interface TagProps extends React.AllHTMLAttributes<HTMLElement> {
+    colour?: TagColour;
+}

package/dist/components/Tag/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/components/TaskList/TaskList.d.ts

@@ -1,12 +1,13 @@
+import { TaskListGroupProps, TaskListItemProps, TaskListProps } from './types';
 declare const TaskList: {
-    ({ children, className, headingId, title, ...props }: SGDS.Component.TaskList): import("react").JSX.Element;
+    ({ children, className, headingId, title, ...props }: TaskListProps): import("react").JSX.Element;
     displayName: string;
     Item: {
-        ({ children, className, href, id, isComplete, linkComponent, statusText, tagColour, title, ...props }: SGDS.Component.TaskList.Item): import("react").JSX.Element;
+        ({ children, className, href, id, isComplete, linkComponent, statusText, tagColour, title, ...props }: TaskListItemProps): import("react").JSX.Element;
         displayName: string;
     };
     Group: {
-        ({ children, className, intro, title, ...props }: SGDS.Component.TaskList.Group): import("react").JSX.Element;
+        ({ children, className, intro, title, ...props }: TaskListGroupProps): import("react").JSX.Element;
         displayName: string;
     };
 };

package/dist/components/TaskList/TaskList.jsx

@@ -8,6 +8,7 @@ const ConditionalWrapper_1 = __importDefault(require("../../common/ConditionalWr
 const HintText_1 = __importDefault(require("../../common/HintText"));
 const ScreenReaderText_1 = __importDefault(require("../../common/ScreenReaderText"));
 const Tag_1 = __importDefault(require("../Tag"));
+const clsx_1 = __importDefault(require("clsx"));
 const TaskItem = ({ children, className, href, id, isComplete = false, linkComponent, statusText, tagColour = 'grey', title, ...props }) => {
     if (isComplete) {
         tagColour = 'green';
@@ -15,17 +16,19 @@ const TaskItem = ({ children, className, href, id, isComplete = false, linkCompo
     }
     const LINK_CLASS = 'ds_task-list__task-link';
     function getLinkElement(children) {
+        let linkElement;
         if (linkComponent) {
-            return linkComponent({ className: LINK_CLASS, href, children });
+            linkElement = linkComponent({ className: LINK_CLASS, href, children });
         }
-        else if (href) {
-            return <a href={href} className={LINK_CLASS}>{children}</a>;
+        else {
+            linkElement = <a href={href} className={LINK_CLASS}>{children}</a>;
         }
+        return linkElement;
     }
-    return (<li className={[
+    return (<li className={(0, clsx_1.default)([
             'ds_task-list__task',
             className
-        ].join(' ')} id={id} {...props}>
+        ])} id={id} {...props}>
             <div className="ds_task-list__task-details">
                 <h3 className="ds_task-list__task-heading">
                 <ConditionalWrapper_1.default condition={typeof href !== 'undefined'} wrapper={(children) => getLinkElement(children)}>
@@ -49,10 +52,10 @@ const TaskItem = ({ children, className, href, id, isComplete = false, linkCompo
  * @returns {JSX.Element} - The element
  */
 const TaskGroup = ({ children, className, intro, title, ...props }) => {
-    return (<li className={[
+    return (<li className={(0, clsx_1.default)([
             'ds_task-list-group__section',
             className
-        ].join(' ')} {...props}>
+        ])} {...props}>
             <h2 className="ds_task-list-heading">{title}</h2>
             {intro && <p className="ds_task-list-intro">{intro}</p>}
             <ul className="ds_task-list">
@@ -62,7 +65,7 @@ const TaskGroup = ({ children, className, intro, title, ...props }) => {
 };
 const TaskList = ({ children, className, headingId = 'task-list', title, ...props }) => {
     let taskCount = 0;
-    let incompleteTaskIds = [];
+    const incompleteTaskIds = [];
     let completedTasksCount = 0;
     function processChild(item) {
         if (item.type.displayName === 'TaskList.Item') {

package/dist/components/TaskList/types.d.ts

@@ -0,0 +1,17 @@
+import { LinkComponent, TagColour } from '../../shared-types';
+export interface TaskListGroupProps extends React.AllHTMLAttributes<HTMLElement> {
+    intro?: string;
+    title: string;
+}
+export interface TaskListItemProps extends React.AllHTMLAttributes<HTMLElement> {
+    href?: string;
+    id?: string;
+    isComplete?: boolean;
+    linkComponent?: LinkComponent;
+    statusText?: string;
+    tagColour?: TagColour;
+    title: string;
+}
+export interface TaskListProps extends React.AllHTMLAttributes<HTMLElement> {
+    headingId?: string;
+}

package/dist/components/TaskList/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/components/TextInput/TextInput.d.ts

@@ -1,5 +1,6 @@
+import { TextInputProps } from './types';
 declare const TextInput: {
-    ({ buttonIcon, buttonText, children, className, countThreshold, width, isCurrency, currencySymbol, errorMessage, hasButton, hasError, hintText, id, label, maxlength, name, onBlur, onChange, placeholder, type, value, ...props }: SGDS.Component.TextInput): import("react").JSX.Element;
+    ({ buttonIcon, buttonText, className, countThreshold, width, isCurrency, currencySymbol, errorMessage, hasButton, hasError, hintText, id, label, maxlength, name, onBlur, onChange, placeholder, type, value, ...props }: TextInputProps): import("react").JSX.Element;
     displayName: string;
 };
 export default TextInput;

package/dist/components/TextInput/TextInput.jsx

@@ -4,17 +4,17 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = require("react");
-// @ts-ignore
-const character_count_1 = __importDefault(require("@scottish-government/design-system/src/forms/character-count/character-count"));
+const character_count_1 = __importDefault(require("@scottish-government/design-system/src/components/character-count/character-count"));
 const Button_1 = __importDefault(require("../Button"));
 const ConditionalWrapper_1 = __importDefault(require("../../common/ConditionalWrapper"));
 const ErrorMessage_1 = __importDefault(require("../ErrorMessage"));
 const HintText_1 = __importDefault(require("../../common/HintText"));
-const TextInput = ({ buttonIcon, buttonText, children, className, countThreshold, width, isCurrency, currencySymbol, errorMessage, hasButton = false, hasError, hintText, id, label, maxlength, name, onBlur, onChange, placeholder, type = 'text', value, ...props }) => {
+const clsx_1 = __importDefault(require("clsx"));
+const TextInput = ({ buttonIcon, buttonText, className, countThreshold, width, isCurrency, currencySymbol, errorMessage, hasButton = false, hasError, hintText, id, label, maxlength, name, onBlur, onChange, placeholder, type = 'text', value, ...props }) => {
     const errorMessageId = `error-message-${id}`;
     const hintTextId = `hint-text-${id}`;
     const ref = (0, react_1.useRef)(null);
-    const inputWrapperClasses = `${hasButton ? 'ds_input__wrapper  ds_input__wrapper--has-icon' : ''} ${isCurrency ? 'ds_currency-wrapper' : ''}`;
+    const inputWrapperClasses = (0, clsx_1.default)(hasButton && 'ds_input__wrapper', hasButton && 'ds_input__wrapper--has-icon', isCurrency && 'ds_currency-wrapper');
     const describedbys = [];
     if (hintText) {
         describedbys.push(hintTextId);
@@ -25,6 +25,7 @@ const TextInput = ({ buttonIcon, buttonText, children, className, countThreshold
     }
     ;
     (0, react_1.useEffect)(() => {
+        /* istanbul ignore else */
         if (ref.current) {
             new character_count_1.default(ref.current).init();
         }
@@ -41,15 +42,15 @@ const TextInput = ({ buttonIcon, buttonText, children, className, countThreshold
     }
     return (<ConditionalWrapper_1.default condition={typeof maxlength !== 'undefined' && maxlength > 0} wrapper={(children) => <div ref={ref} data-threshold={countThreshold} data-module="ds-character-count">{children}</div>}>
             <label className="ds_label" htmlFor={id}>{label}</label>
-            {hintText && <HintText_1.default id={hintTextId} text={hintText}/>}
+            {hintText && <HintText_1.default id={hintTextId}>{hintText}</HintText_1.default>}
             {errorMessage && <ErrorMessage_1.default id={errorMessageId}>{errorMessage}</ErrorMessage_1.default>}
             <ConditionalWrapper_1.default condition={hasButton || typeof isCurrency !== 'undefined' && isCurrency} wrapper={(children) => <div className={inputWrapperClasses} data-symbol={currencySymbol}>{children}</div>}>
-                <input aria-describedby={describedbys.join(' ')} aria-invalid={hasError} className={[
+                <input aria-describedby={describedbys.join(' ')} aria-invalid={hasError} className={(0, clsx_1.default)([
             'ds_input',
             className,
-            hasError ? 'ds_input--error' : '',
-            width ? `ds_input--${width}` : '',
-        ].join(' ')} defaultValue={value} id={id} maxLength={maxlength} name={name || id} onBlur={handleBlur} onChange={handleChange} placeholder={placeholder} type={type} {...props}/>
+            hasError && 'ds_input--error',
+            width && `ds_input--${width}`,
+        ])} defaultValue={value} id={id} maxLength={maxlength} name={name || id} onBlur={handleBlur} onChange={handleChange} placeholder={placeholder} type={type} {...props}/>
                 {hasButton && (buttonText || buttonIcon) && <Button_1.default isIconOnly icon={buttonIcon}>{buttonText}</Button_1.default>}
             </ConditionalWrapper_1.default>
         </ConditionalWrapper_1.default>);

package/dist/components/TextInput/types.d.ts

@@ -0,0 +1,11 @@
+import { IconName, InputWidth, TextInputBase } from '../../shared-types';
+export interface TextInputProps extends TextInputBase<HTMLInputElement> {
+    buttonIcon?: IconName;
+    buttonText?: string;
+    className?: string;
+    currencySymbol?: string;
+    hasButton?: boolean;
+    isCurrency?: boolean;
+    type?: string;
+    width?: InputWidth;
+}

package/dist/components/TextInput/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/components/Textarea/Textarea.d.ts

@@ -1,5 +1,6 @@
+import { TextInputBase } from '../../shared-types';
 declare const Textarea: {
-    ({ className, countThreshold, errorMessage, hasError, hintText, id, label, maxlength, name, onBlur, onChange, placeholder, rows, value, ...props }: SGDS.Component.Textarea): import("react").JSX.Element;
+    ({ className, countThreshold, errorMessage, hasError, hintText, id, label, maxlength, name, onBlur, onChange, placeholder, rows, value, ...props }: TextInputBase<HTMLTextAreaElement>): import("react").JSX.Element;
     displayName: string;
 };
 export default Textarea;

package/dist/components/Textarea/Textarea.jsx

@@ -4,11 +4,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = require("react");
-// @ts-ignore
-const character_count_1 = __importDefault(require("@scottish-government/design-system/src/forms/character-count/character-count"));
+const character_count_1 = __importDefault(require("@scottish-government/design-system/src/components/character-count/character-count"));
 const ConditionalWrapper_1 = __importDefault(require("../../common/ConditionalWrapper"));
 const ErrorMessage_1 = __importDefault(require("../ErrorMessage"));
 const HintText_1 = __importDefault(require("../../common/HintText"));
+const clsx_1 = __importDefault(require("clsx"));
 const Textarea = ({ className, countThreshold, errorMessage, hasError, hintText, id, label, maxlength, name, onBlur, onChange, placeholder, rows = 4, value, ...props }) => {
     const errorMessageId = `error-message-${id}`;
     const hintTextId = `hint-text-${id}`;
@@ -23,6 +23,7 @@ const Textarea = ({ className, countThreshold, errorMessage, hasError, hintText,
     }
     ;
     (0, react_1.useEffect)(() => {
+        /* istanbul ignore else */
         if (ref.current) {
             new character_count_1.default(ref.current).init();
         }
@@ -39,14 +40,14 @@ const Textarea = ({ className, countThreshold, errorMessage, hasError, hintText,
     }
     return (<ConditionalWrapper_1.default condition={typeof maxlength !== 'undefined' && maxlength > 0} wrapper={(children) => <div ref={ref} data-threshold={countThreshold} data-module="ds-character-count">{children}</div>}>
             <label className="ds_label" htmlFor={id}>{label}</label>
-            {hintText && <HintText_1.default id={hintTextId} text={hintText}/>}
+            {hintText && <HintText_1.default id={hintTextId}>{hintText}</HintText_1.default>}
             {errorMessage && <ErrorMessage_1.default id={errorMessageId}>{errorMessage}</ErrorMessage_1.default>}
 
-            <textarea aria-describedby={describedbys.join(' ')} aria-invalid={hasError} className={[
+            <textarea aria-describedby={describedbys.join(' ')} aria-invalid={hasError} className={(0, clsx_1.default)([
             'ds_input',
             hasError && 'ds_input--error',
             className
-        ].join(' ')} defaultValue={value} id={id} maxLength={maxlength} name={name || id} onBlur={handleBlur} onChange={handleChange} placeholder={placeholder} rows={rows} {...props}/>
+        ])} defaultValue={value} id={id} maxLength={maxlength} name={name || id} onBlur={handleBlur} onChange={handleChange} placeholder={placeholder} rows={rows} {...props}/>
 
         </ConditionalWrapper_1.default>);
 };

package/dist/components/WarningText/WarningText.d.ts

@@ -1,5 +1,5 @@
 declare const WarningText: {
-    ({ children, className, ...props }: SGDS.Component.WarningText): import("react").JSX.Element;
+    ({ children, className, ...props }: React.AllHTMLAttributes<HTMLElement>): import("react").JSX.Element;
     displayName: string;
 };
 export default WarningText;

package/dist/components/WarningText/WarningText.jsx

@@ -1,10 +1,14 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
+const clsx_1 = __importDefault(require("clsx"));
 const WarningText = ({ children, className, ...props }) => {
-    return (<div className={[
+    return (<div className={(0, clsx_1.default)([
             'ds_warning-text',
             className
-        ].join(' ')} {...props}>
+        ])} {...props}>
             <strong className="ds_warning-text__icon" aria-hidden="true"></strong>
             <strong className="visually-hidden">Warning</strong>
             <div className="ds_warning-text__text">

package/dist/hooks/useTracking/useTracking.js

@@ -5,7 +5,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = default_1;
 const react_1 = require("react");
-//@ts-ignore
 const tracking_1 = __importDefault(require("@scottish-government/design-system/src/base/tools/tracking/tracking"));
 function default_1() {
     (0, react_1.useEffect)(() => {

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+export * as common from './common';
+export * as components from './components';
+export * as hooks from './hooks';
+export * as images from './images';

package/dist/index.js

@@ -0,0 +1,40 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.images = exports.hooks = exports.components = exports.common = void 0;
+exports.common = __importStar(require("./common"));
+exports.components = __importStar(require("./components"));
+exports.hooks = __importStar(require("./hooks"));
+exports.images = __importStar(require("./images"));

package/dist/shared-types.d.ts

@@ -0,0 +1,35 @@
+export type HeadingLevel = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+export type IconName = 'ArrowUpward' | 'CalendarToday' | 'Cancel' | 'CheckCircle' | 'ChevronLeft' | 'ChevronRight' | 'Close' | 'Description' | 'DoubleChevronLeft' | 'DoubleChevronRight' | 'Error' | 'ExpandLess' | 'ExpandMore' | 'List' | 'Menu' | 'PriorityHigh' | 'Search';
+export type DocumentIconName = 'Audio' | 'Csv' | 'Excel' | 'File' | 'Generic' | 'Geodata' | 'Ical' | 'Ico' | 'Image' | 'Odf' | 'Odg' | 'Odp' | 'Ods' | 'Odt' | 'Pdf' | 'Ppt' | 'Rtf' | 'Text' | 'Video' | 'Word' | 'Xml' | 'Zip';
+export type InputWidth = 'fixed-20' | 'fixed-10' | 'fixed-5' | 'fixed-4' | 'fixed-3' | 'fixed-2' | 'fluid-three-quarters' | 'fluid-two-thirds' | 'fluid-half' | 'fluid-one-third' | 'fluid-one-quarter';
+export type TagColour = 'grey' | 'green' | 'teal' | 'blue' | 'purple' | 'pink' | 'red' | 'orange' | 'yellow';
+export type TextInputType = 'date' | 'datetime-local' | 'email' | 'month' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'time' | 'url' | 'week';
+export type LinkComponentProps = {
+    'aria-label'?: React.AriaAttributes['aria-label'];
+    'aria-current'?: React.AriaAttributes['aria-current'];
+    'aria-describedby'?: React.AriaAttributes['aria-describedby'];
+    children?: React.ReactNode;
+    className?: string;
+    href?: string;
+    onClick?: React.EventHandler<React.MouseEvent>;
+};
+export type LinkComponent = (linkComponent: LinkComponentProps) => React.ReactNode;
+export interface CheckboxRadioBase<T> extends React.InputHTMLAttributes<T> {
+    hintText?: string | React.ReactNode;
+    label: string;
+    onBlur?: React.FocusEventHandler<T>;
+    onChange?: React.ChangeEventHandler<T>;
+    isSmall?: boolean;
+}
+export interface FormFieldBase<T> extends React.AllHTMLAttributes<T> {
+    errorMessage?: string | React.ReactNode;
+    hasError?: boolean;
+    hintText?: string | React.ReactNode;
+    label: string;
+    onBlur?: React.FocusEventHandler<T>;
+    onChange?: React.ChangeEventHandler<T>;
+}
+export interface TextInputBase<T> extends FormFieldBase<T> {
+    countThreshold?: number;
+    maxlength?: number;
+}

package/dist/shared-types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });