@i-dot-ai-npm/component-library-react 0.0.1 → 0.0.3

package/src/summary-list/SummaryListActions.tsx

@@ -1,8 +1,8 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 
 type SummaryListActionsProps = {
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/summary-list/SummaryListKey.tsx

@@ -1,8 +1,8 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 
 type SummaryListKeyProps = {
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/summary-list/SummaryListRow.tsx

@@ -1,9 +1,9 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 
 type SummaryListRowProps = {
     noActions?: boolean;
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/summary-list/SummaryListValue.tsx

@@ -1,8 +1,8 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 
 type SummaryListValueProps = {
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/table/Table.tsx

@@ -1,18 +1,21 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+/** @jsxImportSource react */
+import { ReactNode } from 'react';
 
 type TableProps = {
     smallTextUntilTablet?: boolean;
     subtle?: boolean;
+    summary?: boolean;
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 
-export default function Table({ smallTextUntilTablet, subtle, class: className, children, ...rest }: TableProps) {
+export default function Table({ smallTextUntilTablet, subtle, summary, class: className, children, ...rest }: TableProps) {
     const classes = [
         "govuk-table",
         smallTextUntilTablet ? "govuk-table--small-text-until-tablet" : "",
         subtle ? "govuk-table--subtle" : "",
+        summary ? "govuk-table--summary" : "",
         className ?? "",
     ]
         .filter(Boolean)

package/src/table/TableBody.tsx

@@ -1,8 +1,10 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+/** @jsxImportSource react */
+
+import { ReactNode } from 'react';
 
 type TableBodyProps = {
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/table/TableCaption.tsx

@@ -1,9 +1,11 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+/** @jsxImportSource react */
+
+import { ReactNode } from 'react';
 
 type TableCaptionProps = {
     size?: "small" | "medium" | "large" | "xl";
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/table/TableCell.tsx

@@ -1,16 +1,24 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+/** @jsxImportSource react */
+
+import { ReactNode } from 'react';
 
 type TableCellProps = {
     numeric?: boolean;
+    stretch?: boolean;
+    noWrap?: boolean;
+    small?: boolean;
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 
-export default function TableCell({ numeric, class: className, children, ...rest }: TableCellProps) {
+export default function TableCell({ numeric, stretch, noWrap, small, class: className, children, ...rest }: TableCellProps) {
     const classes = [
         "govuk-table__cell",
         numeric ? "govuk-table__cell--numeric" : "",
+        stretch ? "govuk-table__cell--stretch" : "",
+        noWrap ? "govuk-table__cell--no-wrap" : "",
+        small ? "govuk-table__cell--small" : "",
         className ?? "",
     ]
         .filter(Boolean)

package/src/table/TableHead.tsx

@@ -1,8 +1,10 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+/** @jsxImportSource react */
+
+import { ReactNode } from 'react';
 
 type TableHeadProps = {
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/table/TableHeader.tsx

@@ -1,9 +1,11 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+/** @jsxImportSource react */
+
+import { ReactNode } from 'react';
 
 type TableHeaderProps = {
     numeric?: boolean;
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/table/TableRow.tsx

@@ -1,8 +1,10 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+/** @jsxImportSource react */
+
+import { ReactNode } from 'react';
 
 type TableRowProps = {
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/tabs/Tab.tsx

@@ -1,9 +1,9 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 
 type TabProps = {
     selected?: boolean;
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/tabs/TabPanel.tsx

@@ -1,9 +1,9 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 
 type TabPanelProps = {
     hidden?: boolean;
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/tabs/Tabs.tsx

@@ -1,14 +1,14 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 import { useEffect, useRef } from "react";
 
 type TabsProps = {
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 
 export default function Tabs({ class: className, children, ...rest }: TabsProps) {
-    const ref = useRef<HTMLElement>(null);
+    const ref = useRef<HTMLDivElement>(null);
     const classes = ["govuk-tabs", className ?? ""].filter(Boolean).join(" ");
     useEffect(() => {
         const el = ref.current;

package/src/tabs/TabsList.tsx

@@ -1,8 +1,8 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 
 type TabsListProps = {
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/tabs/TabsTitle.tsx

@@ -1,8 +1,8 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 
 type TabsTitleProps = {
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/tag/Tag.tsx

@@ -1,16 +1,16 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 
 type TagProps = {
-    colour?: "grey" | "green" | "turquoise" | "blue" | "light-blue" | "purple" | "pink" | "red" | "orange" | "yellow";
+    colour?: "grey" | "green" | "teal" | "turquoise" | "blue" | "light-blue" | "purple" | "magenta" | "pink" | "red" | "orange" | "yellow";
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 
 export default function Tag({ colour, class: className, children, ...rest }: TagProps) {
     const classes = [
         "govuk-tag",
-        ({ "grey": "govuk-tag--grey", "green": "govuk-tag--green", "turquoise": "govuk-tag--turquoise", "blue": "govuk-tag--blue", "light-blue": "govuk-tag--light-blue", "purple": "govuk-tag--purple", "pink": "govuk-tag--pink", "red": "govuk-tag--red", "orange": "govuk-tag--orange", "yellow": "govuk-tag--yellow" }[colour] ?? ""),
+        ({ "grey": "govuk-tag--grey", "green": "govuk-tag--green", "teal": "govuk-tag--teal", "turquoise": "govuk-tag--turquoise", "blue": "govuk-tag--blue", "light-blue": "govuk-tag--light-blue", "purple": "govuk-tag--purple", "magenta": "govuk-tag--magenta", "pink": "govuk-tag--pink", "red": "govuk-tag--red", "orange": "govuk-tag--orange", "yellow": "govuk-tag--yellow" }[colour] ?? ""),
         className ?? "",
     ]
         .filter(Boolean)

package/src/task-list/TaskList.tsx

@@ -1,8 +1,8 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 
 type TaskListProps = {
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/task-list/TaskListHint.tsx

@@ -1,8 +1,8 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 
 type TaskListHintProps = {
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/task-list/TaskListItem.tsx

@@ -1,9 +1,9 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 
 type TaskListItemProps = {
     withLink?: boolean;
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/task-list/TaskListLink.tsx

@@ -1,8 +1,8 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 
 type TaskListLinkProps = {
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/task-list/TaskListNameAndHint.tsx

@@ -1,8 +1,8 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 
 type TaskListNameAndHintProps = {
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/task-list/TaskListStatus.tsx

@@ -1,8 +1,8 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 
 type TaskListStatusProps = {
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/textarea/Textarea.tsx

@@ -1,13 +1,12 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
-
 type TextareaProps = {
     error?: boolean;
     subtle?: boolean;
+    value?: string;
     class?: string;
     [key: string]: unknown;
 };
 
-export default function Textarea({ error, subtle, class: className, ...rest }: TextareaProps) {
+export default function Textarea({ error, subtle, value, class: className, ...rest }: TextareaProps) {
     const classes = [
         "govuk-textarea",
         error ? "govuk-textarea--error" : "",
@@ -18,6 +17,6 @@ export default function Textarea({ error, subtle, class: className, ...rest }: T
         .join(" ");
 
     return (
-        <textarea className={classes} {...rest}></textarea>
+        <textarea className={classes} defaultValue={value} {...rest}></textarea>
     );
 }

package/src/toggle/Toggle.tsx

@@ -1,5 +1,3 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
-
 type ToggleProps = {
     class?: string;
     [key: string]: unknown;

package/src/toggle/ToggleItem.tsx

@@ -1,8 +1,8 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 
 type ToggleItemProps = {
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/toggle/ToggleLabel.tsx

@@ -1,8 +1,8 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 
 type ToggleLabelProps = {
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };
 

package/src/warning-text/WarningText.tsx

@@ -1,8 +1,8 @@
-// AUTO-GENERATED from HTML spec. Do not edit by hand.
+import { ReactNode } from 'react';
 
 type WarningTextProps = {
     class?: string;
-    children?: React.ReactNode;
+    children?: ReactNode;
     [key: string]: unknown;
 };