@abgov/react-components 4.17.0-alpha.22 → 4.17.0-alpha.24

package/index.js

@@ -18355,7 +18355,7 @@ class bf extends se {
 }
 customElements.define("goa-tab", re(bf, { heading: {}, open: {} }, ["heading", "default"], [], true));
 function pf(t) {
-  de(t, "svelte-1i5xhlu", ":host{overflow-x:auto}.goatable.svelte-1i5xhlu{width:0}table.svelte-1i5xhlu{border-collapse:collapse}");
+  de(t, "svelte-1wrp53x", ".goatable.svelte-1wrp53x{width:0}table.svelte-1wrp53x{border-collapse:collapse}");
 }
 function _f(t) {
   let e, n, l;
@@ -18372,7 +18372,7 @@ function _f(t) {
   return {
     c() {
       e = z("table"), o && o.c(), f(e, "style", n = /*width*/
-      t[0] && "width: 100%;"), f(e, "class", "svelte-1i5xhlu");
+      t[0] && "width: 100%;"), f(e, "class", "svelte-1wrp53x");
     },
     m(r, s) {
       P(r, e, s), o && o.m(e, null), l = true;
@@ -18474,7 +18474,8 @@ function yf(t) {
   return n = c(t), l = a[n] = s[n](t), {
     c() {
       e = z("div"), l.c(), f(e, "class", i = ze(`goatable ${/*variant*/
-      t[1]}`) + " svelte-1i5xhlu"), f(e, "style", o = `
+      t[1]}`) + " svelte-1wrp53x"), f(e, "style", o = `
+    overflow-x: auto;
     ${`width: ${/*width*/
       t[0] || "100%"};`}
     ${fe(
@@ -18503,8 +18504,9 @@ function yf(t) {
         a[m] = null;
       }), Pe(), l = a[n], l ? l.p(d, u) : (l = a[n] = s[n](d), l.c()), N(l, 1), l.m(e, null)), (!r || u & /*variant*/
       2 && i !== (i = ze(`goatable ${/*variant*/
-      d[1]}`) + " svelte-1i5xhlu")) && f(e, "class", i), (!r || u & /*width, mt, mr, mb, ml*/
+      d[1]}`) + " svelte-1wrp53x")) && f(e, "class", i), (!r || u & /*width, mt, mr, mb, ml*/
       61 && o !== (o = `
+    overflow-x: auto;
     ${`width: ${/*width*/
       d[0] || "100%"};`}
     ${fe(
@@ -18673,7 +18675,7 @@ class zf extends se {
     this.$$set({ ml: e }), _();
   }
 }
-customElements.define("goa-table", re(zf, { width: {}, stickyheader: {}, variant: {}, mt: {}, mr: {}, mb: {}, ml: {} }, ["default"], [], true));
+customElements.define("goa-table", re(zf, { width: {}, stickyheader: {}, variant: { reflect: true }, mt: {}, mr: {}, mb: {}, ml: {} }, ["default"], [], true));
 function Cf(t) {
   de(t, "svelte-w89d7d", ":host{display:flex;align-items:flex-end}button.svelte-w89d7d.svelte-w89d7d{border:none;background:none;display:flex;font-family:inherit;font-size:inherit;font-weight:inherit;color:inherit;width:100%;height:3.75rem;padding:0 1rem;justify-content:var(--header-text-align, flex-start);gap:0.25rem;align-items:center}button.svelte-w89d7d.svelte-w89d7d:hover{background-color:var(--goa-color-greyscale-100);cursor:pointer;color:var(--goa-color-interactive-hover)}button.svelte-w89d7d goa-icon.svelte-w89d7d{color:var(--goa-color-interactive-default)}button.svelte-w89d7d:hover goa-icon.svelte-w89d7d{color:var(--goa-color-interactive-hover)}button.svelte-w89d7d .direction--none goa-icon.svelte-w89d7d{color:var(--goa-color-greyscale-400)}button.svelte-w89d7d:hover .direction--none goa-icon.svelte-w89d7d{color:var(--goa-color-greyscale-400)}goa-icon.svelte-w89d7d.svelte-w89d7d{scale:0.8}.direction--none.svelte-w89d7d goa-icon.svelte-w89d7d{height:0.625rem}.direction--none.svelte-w89d7d.svelte-w89d7d{display:inline-flex;flex-direction:column;align-items:center}");
 }
@@ -20311,6 +20313,7 @@ function GoAAppHeaderMenu(props) {
     {
       heading: props.heading,
       leadingicon: props.leadingIcon,
+      "data-testid": props.testId,
       children: props.children
     }
   );
@@ -20537,6 +20540,7 @@ function GoACalendar({
   value,
   min,
   max,
+  testId,
   mt: mt2,
   mr: mr2,
   mb,
@@ -20561,6 +20565,7 @@ function GoACalendar({
       value: value == null ? void 0 : value.toISOString(),
       min: min == null ? void 0 : min.toISOString(),
       max: max == null ? void 0 : max.toISOString(),
+      "data-testid": testId,
       mt: mt2,
       mr: mr2,
       mb,
@@ -20757,6 +20762,7 @@ function GoADatePicker({
   error,
   min,
   max,
+  testId,
   mt: mt2,
   mr: mr2,
   mb,
@@ -20769,10 +20775,14 @@ function GoADatePicker({
       return;
     }
     const current = ref.current;
-    current.addEventListener("_change", (e) => {
+    const handleChange = (e) => {
       onChange(name || "", e.detail.value);
-    });
-  });
+    };
+    current.addEventListener("_change", handleChange);
+    return () => {
+      current.removeEventListener("_change", handleChange);
+    };
+  }, [onChange]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     "goa-date-picker",
     {
@@ -20782,6 +20792,7 @@ function GoADatePicker({
       error,
       min: min == null ? void 0 : min.toISOString(),
       max: max == null ? void 0 : max.toISOString(),
+      "data-testid": testId,
       mt: mt2,
       mr: mr2,
       mb,
@@ -20795,6 +20806,7 @@ function GoADetails(props) {
     {
       heading: props.heading,
       open: props.open,
+      "data-testid": props.testId,
       mt: props.mt,
       mr: props.mr,
       mb: props.mb,
@@ -20892,6 +20904,7 @@ function GoAFileUploadCard({
   type,
   progress,
   error,
+  testId,
   onDelete,
   onCancel
 }) {
@@ -20917,7 +20930,8 @@ function GoAFileUploadCard({
       size,
       type,
       progress,
-      error
+      error,
+      "data-testid": testId
     }
   );
 }
@@ -20925,6 +20939,7 @@ function GoAFileUploadInput({
   variant,
   accept,
   maxFileSize,
+  testId,
   onSelectFile
 }) {
   const el2 = react.useRef(null);
@@ -20946,7 +20961,8 @@ function GoAFileUploadInput({
       ref: el2,
       variant,
       accept,
-      maxfilesize: maxFileSize
+      maxfilesize: maxFileSize,
+      "data-testid": testId
     }
   );
 }
@@ -20957,8 +20973,15 @@ function GoAAppFooter({
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx("goa-app-footer", { maxcontentwidth: maxContentWidth, "data-testid": testId, children });
 }
-function GoAAppFooterMetaSection({ children }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("goa-app-footer-meta-section", { slot: "meta", children });
+function GoAAppFooterMetaSection({ testId, children }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "goa-app-footer-meta-section",
+    {
+      "data-testid": testId,
+      slot: "meta",
+      children
+    }
+  );
 }
 function GoAAppFooterNavSection({
   heading,
@@ -23338,16 +23361,30 @@ function GoARadioGroup({
   );
 }
 function GoASideMenuGroup(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx("goa-side-menu-group", { heading: props.heading, children: props.children });
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "goa-side-menu-group",
+    {
+      heading: props.heading,
+      "data-testid": props.testId,
+      children: props.children
+    }
+  );
 }
 function GoASideMenuHeading(props) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("goa-side-menu-heading", { icon: props.icon, children: [
-    props.children,
-    props.meta && /* @__PURE__ */ jsxRuntime.jsx("span", { slot: "meta", children: props.meta })
-  ] });
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "goa-side-menu-heading",
+    {
+      icon: props.icon,
+      "data-testid": props.testId,
+      children: [
+        props.children,
+        props.meta && /* @__PURE__ */ jsxRuntime.jsx("span", { slot: "meta", children: props.meta })
+      ]
+    }
+  );
 }
 function GoASideMenu(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx("goa-side-menu", { children: props.children });
+  return /* @__PURE__ */ jsxRuntime.jsx("goa-side-menu", { "data-testid": props.testId, children: props.children });
 }
 const GoASkeleton = ({
   maxWidth,
@@ -23442,8 +23479,15 @@ function GoATableSortHeader({
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx("goa-table-sort-header", { name, direction, children });
 }
-function GoATabs({ initialTab, children }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("goa-tabs", { initialtab: initialTab, children });
+function GoATabs({ initialTab, children, testId }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "goa-tabs",
+    {
+      initialtab: initialTab,
+      "data-testid": testId,
+      children
+    }
+  );
 }
 function GoATab({ heading, children }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("goa-tab", { children: [