@westpac/ui 0.58.0 → 0.59.0

package/dist/components/compacta/compacta.component.d.ts

@@ -1,2 +1,2 @@
 import { type CompactaProps } from './compacta.types.js';
-export declare function Compacta({ className, children, titleTag: Tag, addText, ...props }: CompactaProps): import("react/jsx-runtime").JSX.Element;
+export declare function Compacta({ className, children, titleTag: Tag, addText, initialCompactas, ...props }: CompactaProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/compacta/compacta.component.js

@@ -7,7 +7,7 @@ import { AddCircleIcon, ExpandLessIcon, ExpandMoreIcon, RemoveCircleIcon } from
 import { VisuallyHidden } from '../index.js';
 import { styles as compactaStyles } from './compacta.styles.js';
 const loadAnimations = ()=>import('./compacta.utils.js').then((res)=>res.default);
-export function Compacta({ className, children, titleTag: Tag = 'h3', addText = 'Add another', ...props }) {
+export function Compacta({ className, children, titleTag: Tag = 'h3', addText = 'Add another', initialCompactas, ...props }) {
     const [initial, setInitial] = useState(true);
     const id = useId();
     const [items, setItems] = useState([
@@ -129,6 +129,26 @@ export function Compacta({ className, children, titleTag: Tag = 'h3', addText =
         items.length,
         action
     ]);
+    useEffect(()=>{
+        if (initialCompactas) {
+            const newItems = initialCompactas.map((item, index)=>{
+                var _item_id, _ref, _ref1, _ref2;
+                var _item_title, _item_title1, _item_title2;
+                const itemId = (_item_id = item.id) !== null && _item_id !== void 0 ? _item_id : `${id}-${generateID()}`;
+                return {
+                    id: itemId,
+                    open: index === initialCompactas.length - 1 ? true : false,
+                    delay: false,
+                    title: {
+                        primary: (_ref = (_item_title = item.title) === null || _item_title === void 0 ? void 0 : _item_title.primary) !== null && _ref !== void 0 ? _ref : '',
+                        secondary: (_ref1 = (_item_title1 = item.title) === null || _item_title1 === void 0 ? void 0 : _item_title1.secondary) !== null && _ref1 !== void 0 ? _ref1 : '',
+                        tertiary: (_ref2 = (_item_title2 = item.title) === null || _item_title2 === void 0 ? void 0 : _item_title2.tertiary) !== null && _ref2 !== void 0 ? _ref2 : ''
+                    }
+                };
+            });
+            setItems(newItems);
+        }
+    }, []);
     const styles = compactaStyles({});
     return React.createElement("div", {
         className: styles.base({

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

@@ -8,6 +8,18 @@ export type CompactaProps = {
      * Component to repeat
      */
     children: (...props: ContentProps[]) => ReactNode;
+    /**
+     * The initial compactas to render. Each compacta needs a unique id if you want to pre-fill values.
+     * Each object contained within the array represents a compacta.
+     */
+    initialCompactas?: {
+        id?: string;
+        title?: {
+            primary?: string;
+            secondary?: string;
+            tertiary?: string;
+        };
+    }[];
     /**
      * Tag for primary title
      * @default h3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@westpac/ui",
-  "version": "0.58.0",
+  "version": "0.59.0",
   "license": "MIT",
   "sideEffects": false,
   "type": "module",
@@ -260,8 +260,8 @@
     "vite": "^7.0.8",
     "vitest": "^3.2.4",
     "@westpac/eslint-config": "~1.0.1",
-    "@westpac/ts-config": "~0.0.0",
-    "@westpac/test-config": "~0.0.0"
+    "@westpac/test-config": "~0.0.0",
+    "@westpac/ts-config": "~0.0.0"
   },
   "dependencies": {
     "@duetds/date-picker": "~1.4.0",

package/src/components/compacta/compacta.component.tsx

@@ -24,6 +24,7 @@ export function Compacta({
   children,
   titleTag: Tag = 'h3',
   addText = 'Add another',
+  initialCompactas,
   ...props
 }: CompactaProps) {
   const [initial, setInitial] = useState(true);
@@ -118,6 +119,26 @@ export function Compacta({
     }
   }, [items.length, action]);
 
+  useEffect(() => {
+    if (initialCompactas) {
+      const newItems = initialCompactas.map((item, index) => {
+        const itemId = item.id ?? `${id}-${generateID()}`;
+        return {
+          id: itemId,
+          open: index === initialCompactas.length - 1 ? true : false,
+          delay: false,
+          title: {
+            primary: item.title?.primary ?? '',
+            secondary: item.title?.secondary ?? '',
+            tertiary: item.title?.tertiary ?? '',
+          },
+        };
+      });
+      setItems(newItems);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
   const styles = compactaStyles({});
 
   return (

package/src/components/compacta/compacta.types.ts

@@ -9,6 +9,16 @@ export type CompactaProps = {
    * Component to repeat
    */
   children: (...props: ContentProps[]) => ReactNode;
+  /**
+   * The initial compactas to render. Each compacta needs a unique id if you want to pre-fill values.
+   * Each object contained within the array represents a compacta.
+   */
+  initialCompactas?: {
+    // Compacta id
+    id?: string;
+    // Titles to pre-fill, won't be done automatically
+    title?: { primary?: string; secondary?: string; tertiary?: string };
+  }[];
   /**
    * Tag for primary title
    * @default h3