@abgov/react-components 6.11.0-next.1 → 7.0.0-dev.1

package/experimental.mjs

@@ -1,1245 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { t as transformProps, l as lowercase, f as format, p as parseISO, i as isValid } from "./parseISO-BHUUf1QW.mjs";
-import { useRef, useEffect } from "react";
-function getIconValue(icon, iconType) {
-  if (icon !== void 0) {
-    return icon ? "true" : "false";
-  }
-  return iconType ? "true" : "false";
-}
-function GoabxBadge({
-  icon,
-  iconType,
-  size = "medium",
-  emphasis = "strong",
-  version = "2",
-  ...rest
-}) {
-  const _props = transformProps({ size, emphasis, ...rest }, lowercase);
-  return /* @__PURE__ */ jsx(
-    "goa-badge",
-    {
-      icon: getIconValue(icon, iconType),
-      icontype: iconType,
-      ..._props,
-      version,
-      size,
-      emphasis
-    }
-  );
-}
-function GoabxButton({
-  disabled,
-  onClick,
-  actionArgs,
-  actionArg,
-  children,
-  version = "2",
-  ...rest
-}) {
-  const el = useRef(null);
-  const _props = transformProps(rest, lowercase);
-  useEffect(() => {
-    if (!el.current) {
-      return;
-    }
-    if (!onClick) {
-      return;
-    }
-    const current = el.current;
-    const listener = () => {
-      onClick == null ? void 0 : onClick();
-    };
-    current.addEventListener("_click", listener);
-    return () => {
-      current.removeEventListener("_click", listener);
-    };
-  }, [el, onClick]);
-  return /* @__PURE__ */ jsx(
-    "goa-button",
-    {
-      ref: el,
-      disabled: disabled ? "true" : void 0,
-      "action-arg": actionArg,
-      "action-args": JSON.stringify(actionArgs),
-      ..._props,
-      version,
-      children
-    }
-  );
-}
-function GoabxCalendar({
-  min,
-  max,
-  onChange,
-  name,
-  version = "2",
-  ...rest
-}) {
-  const ref = useRef(null);
-  const _props = transformProps(rest, lowercase);
-  useEffect(() => {
-    if (!ref.current) {
-      return;
-    }
-    const current = ref.current;
-    const listener = (e) => {
-      onChange({
-        name: name || "",
-        value: e.detail.value
-      });
-    };
-    current.addEventListener("_change", listener);
-    return () => {
-      current.removeEventListener("_change", listener);
-    };
-  }, []);
-  return /* @__PURE__ */ jsx(
-    "goa-calendar",
-    {
-      ref,
-      name,
-      min: min || void 0,
-      max: max || void 0,
-      version,
-      ..._props
-    }
-  );
-}
-const GoabxCallout = ({
-  type = "information",
-  iconTheme = "outline",
-  size = "large",
-  ariaLive = "off",
-  emphasis = "medium",
-  children,
-  version = "2",
-  ...rest
-}) => {
-  const _props = transformProps(
-    { type, icontheme: iconTheme, size, arialive: ariaLive, emphasis, ...rest },
-    lowercase
-  );
-  return /* @__PURE__ */ jsx("goa-callout", { ..._props, version, children });
-};
-function GoabxCheckbox({
-  error,
-  checked,
-  indeterminate,
-  disabled,
-  value,
-  description,
-  reveal,
-  onChange,
-  name,
-  children,
-  size = "default",
-  version = "2",
-  ...rest
-}) {
-  const el = useRef(null);
-  const _props = transformProps({ size, ...rest }, lowercase);
-  useEffect(() => {
-    if (!el.current) {
-      return;
-    }
-    const current = el.current;
-    const listener = (e) => {
-      const detail = e.detail;
-      onChange == null ? void 0 : onChange({ ...detail, event: e });
-    };
-    current.addEventListener("_change", listener);
-    return () => {
-      current.removeEventListener("_change", listener);
-    };
-  }, [name, onChange]);
-  return /* @__PURE__ */ jsxs(
-    "goa-checkbox",
-    {
-      ref: el,
-      ..._props,
-      name,
-      error: error ? "true" : void 0,
-      checked: checked ? "true" : void 0,
-      indeterminate: indeterminate ? "true" : void 0,
-      disabled: disabled ? "true" : void 0,
-      value: typeof value === "boolean" ? value ? "true" : void 0 : value,
-      description: typeof description === "string" ? description : void 0,
-      version,
-      children: [
-        children,
-        typeof description !== "string" && description && /* @__PURE__ */ jsx("div", { slot: "description", children: description }),
-        reveal && /* @__PURE__ */ jsx("div", { slot: "reveal", children: reveal })
-      ]
-    }
-  );
-}
-function GoabxDatePicker({
-  value,
-  error,
-  min,
-  max,
-  disabled,
-  relative,
-  version = "2",
-  onChange,
-  ...rest
-}) {
-  const ref = useRef(null);
-  const _props = transformProps(rest, lowercase);
-  useEffect(() => {
-    if (value && typeof value !== "string") {
-      console.warn(
-        "Using a `Date` type for value is deprecated. Instead use a string of the format `yyyy-mm-dd`"
-      );
-    }
-  }, []);
-  useEffect(() => {
-    if (!ref.current) {
-      return;
-    }
-    const current = ref.current;
-    const handleChange = (e) => {
-      const detail = e.detail;
-      onChange == null ? void 0 : onChange({ ...detail, event: e });
-    };
-    if (onChange) {
-      current.addEventListener("_change", handleChange);
-    }
-    return () => {
-      if (onChange) {
-        current.removeEventListener("_change", handleChange);
-      }
-    };
-  }, [onChange]);
-  const formatValue = (val) => {
-    if (!val) return "";
-    if (val instanceof Date) {
-      return val.toISOString();
-    }
-    return val;
-  };
-  return /* @__PURE__ */ jsx(
-    "goa-date-picker",
-    {
-      ref,
-      value: formatValue(value) || void 0,
-      error: error ? "true" : void 0,
-      disabled: disabled ? "true" : void 0,
-      min: formatValue(min) || void 0,
-      max: formatValue(max) || void 0,
-      relative: relative ? "true" : void 0,
-      version,
-      ..._props
-    }
-  );
-}
-function GoabxDrawer({
-  position,
-  open,
-  heading,
-  maxSize,
-  testId,
-  actions,
-  children,
-  onClose,
-  version = "2"
-}) {
-  const el = useRef(null);
-  useEffect(() => {
-    var _a;
-    if (!(el == null ? void 0 : el.current) || !onClose) {
-      return;
-    }
-    (_a = el.current) == null ? void 0 : _a.addEventListener("_close", onClose);
-    return () => {
-      var _a2;
-      (_a2 = el.current) == null ? void 0 : _a2.removeEventListener("_close", onClose);
-    };
-  }, [el, onClose]);
-  return /* @__PURE__ */ jsxs(
-    "goa-drawer",
-    {
-      ref: el,
-      position,
-      open: open ? true : void 0,
-      heading: typeof heading === "string" ? heading : void 0,
-      maxsize: maxSize,
-      testid: testId,
-      version,
-      children: [
-        heading && typeof heading !== "string" && /* @__PURE__ */ jsx("div", { slot: "heading", children: heading }),
-        actions && /* @__PURE__ */ jsx("div", { slot: "actions", children: actions }),
-        children
-      ]
-    }
-  );
-}
-function stringify(value) {
-  if (typeof value === "undefined") {
-    return "";
-  }
-  if (typeof value === "string") {
-    return value;
-  }
-  return JSON.stringify(value);
-}
-function GoabxDropdown({
-  value,
-  onChange,
-  disabled,
-  error,
-  filterable,
-  multiselect,
-  native,
-  relative,
-  children,
-  size = "default",
-  version = "2",
-  ...rest
-}) {
-  const el = useRef(null);
-  const _props = transformProps({ size, ...rest }, lowercase);
-  useEffect(() => {
-    if (!el.current) {
-      return;
-    }
-    const current = el.current;
-    const handler = (e) => {
-      const detail = e.detail;
-      onChange == null ? void 0 : onChange({ ...detail, event: e });
-    };
-    if (onChange) {
-      current.addEventListener("_change", handler);
-    }
-    return () => {
-      if (onChange) {
-        current.removeEventListener("_change", handler);
-      }
-    };
-  }, [el, onChange]);
-  return /* @__PURE__ */ jsx(
-    "goa-dropdown",
-    {
-      ref: el,
-      value: stringify(value),
-      disabled: disabled ? "true" : void 0,
-      error: error ? "true" : void 0,
-      filterable: filterable ? "true" : void 0,
-      multiselect: multiselect ? "true" : void 0,
-      native: native ? "true" : void 0,
-      relative: relative ? "true" : void 0,
-      ..._props,
-      version,
-      children
-    }
-  );
-}
-function GoabxDropdownOption(props) {
-  useEffect(() => {
-    console.warn("GoabxDropdownOption is deprecated. Please use GoabxDropdownItem");
-  }, []);
-  return /* @__PURE__ */ jsx(GoabxDropdownItem, { ...props });
-}
-function GoabxDropdownItem({
-  value,
-  label,
-  filter,
-  name,
-  mountType = "append"
-}) {
-  return /* @__PURE__ */ jsx(
-    "goa-dropdown-item",
-    {
-      value,
-      label,
-      filter,
-      name,
-      mount: mountType
-    }
-  );
-}
-function GoabxFileUploadCard({
-  onDelete,
-  onCancel,
-  filename,
-  version = "2",
-  ...rest
-}) {
-  const el = useRef(null);
-  const _props = transformProps({ filename, ...rest }, lowercase);
-  useEffect(() => {
-    if (!el.current) return;
-    const current = el.current;
-    const deleteHandler = (event) => onDelete == null ? void 0 : onDelete({ filename, event });
-    const cancelHandler = (event) => onCancel == null ? void 0 : onCancel({ filename, event });
-    current.addEventListener("_delete", deleteHandler);
-    current.addEventListener("_cancel", cancelHandler);
-    return () => {
-      current.removeEventListener("_delete", deleteHandler);
-      current.removeEventListener("_cancel", cancelHandler);
-    };
-  }, [el, onDelete, onCancel, filename]);
-  return /* @__PURE__ */ jsx("goa-file-upload-card", { ref: el, ..._props, version });
-}
-function GoabxFileUploadInput({
-  onSelectFile,
-  version = "2",
-  ...rest
-}) {
-  const el = useRef(null);
-  const _props = transformProps(rest, lowercase);
-  useEffect(() => {
-    if (!el.current) return;
-    const current = el.current;
-    const handler = (e) => {
-      const detail = e.detail;
-      onSelectFile({ ...detail, event: e });
-    };
-    current.addEventListener("_selectFile", handler);
-    return () => {
-      current.removeEventListener("_selectFile", handler);
-    };
-  }, [el, onSelectFile]);
-  return /* @__PURE__ */ jsx("goa-file-upload-input", { ref: el, ..._props, version });
-}
-const GoabxFilterChip = ({
-  iconTheme = "outline",
-  error,
-  onClick,
-  version = "2",
-  ...rest
-}) => {
-  const el = useRef(null);
-  const _props = transformProps(
-    { icontheme: iconTheme, ...rest },
-    lowercase
-  );
-  useEffect(() => {
-    if (!el.current) return;
-    if (!onClick) return;
-    const current = el.current;
-    current.addEventListener("_click", onClick);
-    return () => {
-      current.removeEventListener("_click", onClick);
-    };
-  }, [el, onClick]);
-  return /* @__PURE__ */ jsx(
-    "goa-filter-chip",
-    {
-      ref: el,
-      error: error ? "true" : void 0,
-      version,
-      ..._props
-    }
-  );
-};
-function GoabxFormItem({
-  error,
-  helpText,
-  publicFormSummaryOrder,
-  children,
-  type = "",
-  version = "2",
-  ...rest
-}) {
-  const _props = transformProps({ type, ...rest }, lowercase);
-  return /* @__PURE__ */ jsxs(
-    "goa-form-item",
-    {
-      error: typeof error === "string" ? error : void 0,
-      helptext: typeof helpText === "string" ? helpText : void 0,
-      "public-form-summary-order": publicFormSummaryOrder,
-      ..._props,
-      version,
-      children: [
-        error && typeof error !== "string" && /* @__PURE__ */ jsx("div", { slot: "error", children: error }),
-        helpText && typeof helpText !== "string" && /* @__PURE__ */ jsx("div", { slot: "helptext", children: helpText }),
-        children
-      ]
-    }
-  );
-}
-function GoabxAppFooter({ children, ...rest }) {
-  const _props = transformProps(rest, lowercase);
-  return /* @__PURE__ */ jsx("goa-app-footer", { ..._props, version: "2", children });
-}
-function GoabxAppFooterMetaSection({
-  children,
-  ...rest
-}) {
-  const _props = transformProps(rest, lowercase);
-  return /* @__PURE__ */ jsx("goa-app-footer-meta-section", { slot: "meta", ..._props, children });
-}
-function GoabxAppFooterNavSection({
-  children,
-  ...rest
-}) {
-  const _props = transformProps(rest, lowercase);
-  return /* @__PURE__ */ jsx("goa-app-footer-nav-section", { slot: "nav", ..._props, children });
-}
-function GoabxInput({
-  variant = "goa",
-  textAlign = "left",
-  size = "default",
-  focused,
-  disabled,
-  readonly,
-  error,
-  leadingContent,
-  trailingContent,
-  onTrailingIconClick,
-  onChange,
-  onFocus,
-  onBlur,
-  onKeyPress,
-  version = "2",
-  ...rest
-}) {
-  const ref = useRef(null);
-  const _props = transformProps(
-    { variant, textalign: textAlign, size, ...rest },
-    lowercase
-  );
-  useEffect(() => {
-    if (!ref.current) {
-      return;
-    }
-    const current = ref.current;
-    const changeListener = (e) => {
-      const detail = e.detail;
-      onChange == null ? void 0 : onChange({ ...detail, event: e });
-    };
-    const clickListener = () => {
-      onTrailingIconClick == null ? void 0 : onTrailingIconClick();
-    };
-    const focusListener = (e) => {
-      const detail = e.detail;
-      onFocus == null ? void 0 : onFocus({ ...detail, event: e });
-    };
-    const blurListener = (e) => {
-      const detail = e.detail;
-      onBlur == null ? void 0 : onBlur({ ...detail, event: e });
-    };
-    const keypressListener = (e) => {
-      const detail = e.detail;
-      onKeyPress == null ? void 0 : onKeyPress({ ...detail, event: e });
-    };
-    current.addEventListener("_change", changeListener);
-    current.addEventListener("_trailingIconClick", clickListener);
-    current.addEventListener("_focus", focusListener);
-    current.addEventListener("_blur", blurListener);
-    current.addEventListener("_keyPress", keypressListener);
-    return () => {
-      current.removeEventListener("_change", changeListener);
-      current.removeEventListener("_trailingIconClick", clickListener);
-      current.removeEventListener("_focus", focusListener);
-      current.removeEventListener("_blur", blurListener);
-      current.removeEventListener("_keyPress", keypressListener);
-    };
-  }, [ref, onChange, onTrailingIconClick, onFocus, onBlur, onKeyPress]);
-  return /* @__PURE__ */ jsxs(
-    "goa-input",
-    {
-      ref,
-      ..._props,
-      focused: focused ? "true" : void 0,
-      disabled: disabled ? "true" : void 0,
-      readonly: readonly ? "true" : void 0,
-      error: error ? "true" : void 0,
-      handletrailingiconclick: onTrailingIconClick ? "true" : "false",
-      version,
-      children: [
-        leadingContent && /* @__PURE__ */ jsx("div", { slot: "leadingContent", children: leadingContent }),
-        trailingContent && /* @__PURE__ */ jsx("div", { slot: "trailingContent", children: trailingContent })
-      ]
-    }
-  );
-}
-const onDateChangeHandler = (onChange) => {
-  return ({ name, value, event }) => {
-    if (!value) {
-      onChange == null ? void 0 : onChange({ name, value: "", event });
-      return;
-    }
-    if (typeof value === "string" && isValid(new Date(value))) {
-      onChange == null ? void 0 : onChange({ name, value: parseISO(value), event });
-      return;
-    }
-    if (isValid(value)) {
-      onChange == null ? void 0 : onChange({ name, value, event });
-      return;
-    }
-  };
-};
-const onTimeChangeHandler = (onChange) => {
-  return ({ name, value, event }) => {
-    if (!value) {
-      onChange == null ? void 0 : onChange({ name, value: "", event });
-      return;
-    }
-    onChange == null ? void 0 : onChange({ name, value, event });
-  };
-};
-function toString(value, tmpl = "yyyy-MM-dd") {
-  if (!value) {
-    return "";
-  }
-  if (typeof value === "string") {
-    return format(parseISO(value), tmpl);
-  }
-  if (value.toISOString() === (/* @__PURE__ */ new Date(0)).toISOString()) {
-    return "";
-  }
-  return format(value, tmpl);
-}
-function GoabxInputText(props) {
-  return /* @__PURE__ */ jsx(GoabxInput, { ...props, type: "text" });
-}
-function GoabxInputPassword(props) {
-  return /* @__PURE__ */ jsx(GoabxInput, { ...props, type: "password" });
-}
-function GoabxInputDate({
-  value,
-  min = "",
-  max = "",
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    GoabxInput,
-    {
-      ...props,
-      type: "date",
-      onChange: onDateChangeHandler(props.onChange),
-      min: toString(min),
-      max: toString(max),
-      value: toString(value)
-    }
-  );
-}
-function GoabxInputTime({
-  value,
-  min = "",
-  max = "",
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    GoabxInput,
-    {
-      ...props,
-      onChange: onTimeChangeHandler(props.onChange),
-      value,
-      type: "time"
-    }
-  );
-}
-function GoabxInputDateTime({
-  value,
-  min = "",
-  max = "",
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    GoabxInput,
-    {
-      ...props,
-      onChange: onDateChangeHandler(props.onChange),
-      value: toString(value, "yyyy-MM-dd'T'HH:mm"),
-      type: "datetime-local"
-    }
-  );
-}
-function GoabxInputEmail(props) {
-  return /* @__PURE__ */ jsx(GoabxInput, { ...props, type: "email" });
-}
-function GoabxInputSearch(props) {
-  return /* @__PURE__ */ jsx(GoabxInput, { ...props, type: "search", trailingIcon: "search" });
-}
-function GoabxInputUrl(props) {
-  return /* @__PURE__ */ jsx(GoabxInput, { ...props, type: "url" });
-}
-function GoabxInputTel(props) {
-  return /* @__PURE__ */ jsx(GoabxInput, { ...props, type: "tel" });
-}
-function GoabxInputFile(props) {
-  return /* @__PURE__ */ jsx(
-    "input",
-    {
-      id: props.id,
-      name: props.name,
-      type: "file",
-      onChange: (e) => {
-        var _a;
-        return (_a = props.onChange) == null ? void 0 : _a.call(props, {
-          name: e.target.name,
-          value: e.target.value,
-          event: e.nativeEvent
-        });
-      },
-      style: { backgroundColor: "revert" }
-    }
-  );
-}
-function GoabxInputMonth(props) {
-  return /* @__PURE__ */ jsx(GoabxInput, { ...props, type: "month" });
-}
-function GoabxInputNumber({
-  min = Number.MIN_VALUE,
-  max = Number.MAX_VALUE,
-  value,
-  textAlign = "right",
-  ...props
-}) {
-  const onNumberChange = ({ name, value: value2, event }) => {
-    var _a;
-    (_a = props.onChange) == null ? void 0 : _a.call(props, { name, value: parseFloat(value2), event });
-  };
-  const onFocus = ({ name, value: value2, event }) => {
-    var _a;
-    (_a = props.onFocus) == null ? void 0 : _a.call(props, { name, value: parseFloat(value2), event });
-  };
-  const onBlur = ({ name, value: value2, event }) => {
-    var _a;
-    (_a = props.onBlur) == null ? void 0 : _a.call(props, { name, value: parseFloat(value2), event });
-  };
-  const onKeyPress = ({ name, value: value2, key, event }) => {
-    var _a;
-    (_a = props.onKeyPress) == null ? void 0 : _a.call(props, { name, value: parseFloat(value2), key: parseInt(key), event });
-  };
-  return /* @__PURE__ */ jsx(
-    GoabxInput,
-    {
-      ...props,
-      onChange: onNumberChange,
-      min: min == null ? void 0 : min.toString(),
-      max: max == null ? void 0 : max.toString(),
-      value: value == null ? void 0 : value.toString(),
-      onFocus,
-      onBlur,
-      type: "number",
-      onKeyPress,
-      textAlign
-    }
-  );
-}
-function GoabxInputRange(props) {
-  return /* @__PURE__ */ jsx(GoabxInput, { ...props, type: "range" });
-}
-function GoabxLink({
-  actionArgs,
-  actionArg,
-  color = "interactive",
-  size = "medium",
-  children,
-  ...rest
-}) {
-  const _props = transformProps({ color, size, ...rest }, lowercase);
-  return /* @__PURE__ */ jsx(
-    "goa-link",
-    {
-      "action-arg": actionArg,
-      "action-args": JSON.stringify(actionArgs),
-      ..._props,
-      children
-    }
-  );
-}
-function GoabxModal({
-  heading,
-  children,
-  maxWidth,
-  open,
-  actions,
-  transition,
-  calloutVariant,
-  onClose,
-  testId,
-  version = "2"
-}) {
-  const el = useRef(null);
-  useEffect(() => {
-    if (!el.current) {
-      return;
-    }
-    const current = el.current;
-    const listener = () => {
-      onClose == null ? void 0 : onClose();
-    };
-    current.addEventListener("_close", listener);
-    return () => {
-      current.removeEventListener("_close", listener);
-    };
-  }, [el, onClose]);
-  return /* @__PURE__ */ jsxs(
-    "goa-modal",
-    {
-      ref: el,
-      open: open ? "true" : void 0,
-      closable: onClose ? "true" : "false",
-      heading: typeof heading === "string" ? heading : void 0,
-      maxwidth: maxWidth,
-      transition,
-      calloutvariant: calloutVariant,
-      testid: testId,
-      version,
-      children: [
-        heading && typeof heading !== "string" && /* @__PURE__ */ jsx("div", { slot: "heading", children: heading }),
-        actions && /* @__PURE__ */ jsx("div", { slot: "actions", children: actions }),
-        children
-      ]
-    }
-  );
-}
-const GoabxNotification = ({
-  type = "information",
-  emphasis = "high",
-  compact,
-  ariaLive,
-  maxContentWidth,
-  children,
-  testId,
-  onDismiss,
-  version = "2"
-}) => {
-  const el = useRef(null);
-  useEffect(() => {
-    if (!el.current) {
-      return;
-    }
-    const current = el.current;
-    const listener = () => {
-      onDismiss == null ? void 0 : onDismiss();
-    };
-    current.addEventListener("_dismiss", listener);
-    return () => {
-      current.removeEventListener("_dismiss", listener);
-    };
-  }, [el, onDismiss]);
-  return /* @__PURE__ */ jsx(
-    "goa-notification",
-    {
-      ref: el,
-      type,
-      testid: testId,
-      maxcontentwidth: maxContentWidth,
-      arialive: ariaLive,
-      emphasis,
-      compact: compact ? "true" : void 0,
-      version,
-      children
-    }
-  );
-};
-function GoabxPagination({
-  onChange,
-  version = "2",
-  ...props
-}) {
-  const ref = useRef(null);
-  useEffect(() => {
-    if (!ref.current) {
-      return;
-    }
-    const current = ref.current;
-    const changeListener = (e) => {
-      const detail = e.detail;
-      onChange(detail);
-    };
-    current.addEventListener("_change", changeListener);
-    return () => {
-      current.removeEventListener("_change", changeListener);
-    };
-  }, [ref, onChange]);
-  return /* @__PURE__ */ jsx(
-    "goa-pagination",
-    {
-      ref,
-      itemcount: props.itemCount,
-      perpagecount: props.perPageCount,
-      pagenumber: props.pageNumber,
-      variant: props.variant,
-      mt: props.mt,
-      mb: props.mb,
-      ml: props.ml,
-      mr: props.mr,
-      testid: props.testId,
-      version
-    }
-  );
-}
-function GoabxRadioItem({
-  name,
-  label,
-  value,
-  description,
-  reveal,
-  revealAriaLabel,
-  maxWidth,
-  disabled,
-  checked,
-  error,
-  compact,
-  ariaLabel,
-  children,
-  version = "2",
-  mt,
-  mr,
-  mb,
-  ml
-}) {
-  return /* @__PURE__ */ jsxs(
-    "goa-radio-item",
-    {
-      name,
-      label,
-      value,
-      description: typeof description === "string" ? description : void 0,
-      maxwidth: maxWidth,
-      error: error ? "true" : void 0,
-      disabled: disabled ? "true" : void 0,
-      checked: checked ? "true" : void 0,
-      compact: compact ? "true" : void 0,
-      arialabel: ariaLabel,
-      revealarialabel: revealAriaLabel,
-      mt,
-      mr,
-      mb,
-      ml,
-      version,
-      children: [
-        description && typeof description !== "string" && /* @__PURE__ */ jsx("div", { slot: "description", children: description }),
-        reveal && /* @__PURE__ */ jsx("div", { slot: "reveal", children: reveal }),
-        children
-      ]
-    }
-  );
-}
-function GoabxRadioGroup({
-  disabled,
-  error,
-  onChange,
-  name,
-  children,
-  size = "default",
-  version = "2",
-  ...rest
-}) {
-  const el = useRef(null);
-  const _props = transformProps({ size, ...rest }, lowercase);
-  useEffect(() => {
-    if (!el.current) return;
-    const listener = (e) => {
-      const detail = e.detail;
-      onChange == null ? void 0 : onChange({ ...detail, event: e });
-    };
-    const currentEl = el.current;
-    if (onChange) {
-      currentEl.addEventListener("_change", listener);
-    }
-    return () => {
-      if (onChange) {
-        currentEl.removeEventListener("_change", listener);
-      }
-    };
-  }, [name, onChange]);
-  return /* @__PURE__ */ jsx(
-    "goa-radio-group",
-    {
-      ref: el,
-      ..._props,
-      name,
-      disabled: disabled ? "true" : void 0,
-      error: error ? "true" : void 0,
-      version,
-      children
-    }
-  );
-}
-function GoabxSideMenu({
-  testId,
-  children,
-  version = "2"
-}) {
-  return /* @__PURE__ */ jsx("goa-side-menu", { testid: testId, version, children });
-}
-function GoabxSideMenuGroup({
-  heading,
-  icon,
-  testId,
-  children,
-  mt,
-  mr,
-  mb,
-  ml,
-  version = "2"
-}) {
-  return /* @__PURE__ */ jsx(
-    "goa-side-menu-group",
-    {
-      heading,
-      icon,
-      testid: testId,
-      mt,
-      mr,
-      mb,
-      ml,
-      version,
-      children
-    }
-  );
-}
-function GoabxSideMenuHeading({
-  meta,
-  testId,
-  icon,
-  children,
-  version = "2"
-}) {
-  return /* @__PURE__ */ jsxs("goa-side-menu-heading", { icon, testid: testId, version, children: [
-    children,
-    meta && /* @__PURE__ */ jsx("span", { slot: "meta", children: meta })
-  ] });
-}
-function GoabxTable({ onSort, version = "2", ...props }) {
-  const ref = useRef(null);
-  useEffect(() => {
-    if (!ref.current) {
-      return;
-    }
-    const current = ref.current;
-    const sortListener = (e) => {
-      const detail = e.detail;
-      onSort == null ? void 0 : onSort(detail);
-    };
-    current.addEventListener("_sort", sortListener);
-    return () => {
-      current.removeEventListener("_sort", sortListener);
-    };
-  }, [ref, onSort]);
-  return /* @__PURE__ */ jsx(
-    "goa-table",
-    {
-      ref,
-      width: props.width,
-      variant: props.variant,
-      striped: props.striped ? "true" : void 0,
-      testid: props.testId,
-      mt: props.mt,
-      mb: props.mb,
-      ml: props.ml,
-      mr: props.mr,
-      version,
-      children: /* @__PURE__ */ jsx("table", { style: { width: "100%" }, children: props.children })
-    }
-  );
-}
-function GoabxTableSortHeader({
-  children,
-  ...rest
-}) {
-  const _props = transformProps(rest, lowercase);
-  return /* @__PURE__ */ jsx("goa-table-sort-header", { ..._props, children });
-}
-function GoabxTabs({
-  initialTab,
-  children,
-  testId,
-  onChange,
-  variant,
-  version = "2"
-}) {
-  const ref = useRef(null);
-  useEffect(() => {
-    const element = ref.current;
-    if (element && onChange) {
-      const handler = (event) => {
-        const detail = event.detail;
-        onChange(detail);
-      };
-      element.addEventListener("_change", handler);
-      return () => {
-        element.removeEventListener("_change", handler);
-      };
-    }
-  }, [onChange]);
-  return /* @__PURE__ */ jsx(
-    "goa-tabs",
-    {
-      ref,
-      initialtab: initialTab,
-      testid: testId,
-      variant,
-      version,
-      children
-    }
-  );
-}
-function GoabxTextArea({
-  readOnly,
-  disabled,
-  error,
-  onChange,
-  onKeyPress,
-  onBlur,
-  version = "2",
-  ...rest
-}) {
-  const el = useRef(null);
-  const _props = transformProps(rest, lowercase);
-  useEffect(() => {
-    if (!el.current) {
-      return;
-    }
-    const current = el.current;
-    const changeListener = (e) => {
-      const detail = e.detail;
-      onChange == null ? void 0 : onChange({ ...detail, event: e });
-    };
-    const keypressListener = (e) => {
-      const detail = e.detail;
-      onKeyPress == null ? void 0 : onKeyPress({ ...detail, event: e });
-    };
-    const blurListener = (e) => {
-      const detail = e.detail;
-      onBlur == null ? void 0 : onBlur({ ...detail, event: e });
-    };
-    current.addEventListener("_change", changeListener);
-    current.addEventListener("_keyPress", keypressListener);
-    current.addEventListener("_blur", blurListener);
-    return () => {
-      current.removeEventListener("_change", changeListener);
-      current.removeEventListener("_keyPress", keypressListener);
-      current.removeEventListener("_blur", blurListener);
-    };
-  }, [el, onChange, onKeyPress, onBlur]);
-  return /* @__PURE__ */ jsx(
-    "goa-textarea",
-    {
-      ref: el,
-      readOnly: readOnly ? "true" : void 0,
-      disabled: disabled ? "true" : void 0,
-      error: error ? "true" : void 0,
-      version,
-      ..._props
-    }
-  );
-}
-function GoabxWorkSideMenu({
-  heading,
-  url,
-  userName,
-  userSecondaryText,
-  testId,
-  primaryContent,
-  secondaryContent,
-  accountContent,
-  open,
-  onToggle
-}) {
-  const el = useRef(null);
-  useEffect(() => {
-    var _a;
-    if (!(el == null ? void 0 : el.current) || !onToggle) {
-      return;
-    }
-    (_a = el.current) == null ? void 0 : _a.addEventListener("_toggle", onToggle);
-    return () => {
-      var _a2;
-      (_a2 = el.current) == null ? void 0 : _a2.removeEventListener("_toggle", onToggle);
-    };
-  }, [el, onToggle]);
-  return /* @__PURE__ */ jsxs(
-    "goa-work-side-menu",
-    {
-      ref: el,
-      heading,
-      url,
-      "user-name": userName,
-      "user-secondary-text": userSecondaryText,
-      open: open ? true : false,
-      testid: testId,
-      children: [
-        primaryContent && /* @__PURE__ */ jsx("div", { slot: "primary", children: primaryContent }),
-        secondaryContent && /* @__PURE__ */ jsx("div", { slot: "secondary", children: secondaryContent }),
-        accountContent && /* @__PURE__ */ jsx("div", { slot: "account", children: accountContent })
-      ]
-    }
-  );
-}
-function GoabxWorkSideMenuItem(props) {
-  return /* @__PURE__ */ jsx(
-    "goa-work-side-menu-item",
-    {
-      label: props.label,
-      url: props.url,
-      badge: props.badge,
-      current: props.current ? "true" : void 0,
-      divider: props.divider ? "true" : void 0,
-      icon: props.icon,
-      testid: props.testId,
-      type: props.type,
-      children: props.children
-    }
-  );
-}
-function GoabxWorkSideMenuGroup(props) {
-  return /* @__PURE__ */ jsx(
-    "goa-work-side-menu-group",
-    {
-      heading: props.heading,
-      icon: props.icon,
-      testid: props.testId,
-      children: props.children
-    }
-  );
-}
-export {
-  GoabxAppFooter,
-  GoabxAppFooterMetaSection,
-  GoabxAppFooterNavSection,
-  GoabxBadge,
-  GoabxButton,
-  GoabxCalendar,
-  GoabxCallout,
-  GoabxCheckbox,
-  GoabxDatePicker,
-  GoabxDrawer,
-  GoabxDropdown,
-  GoabxDropdownItem,
-  GoabxDropdownOption,
-  GoabxFileUploadCard,
-  GoabxFileUploadInput,
-  GoabxFilterChip,
-  GoabxFormItem,
-  GoabxInput,
-  GoabxInputDate,
-  GoabxInputDateTime,
-  GoabxInputEmail,
-  GoabxInputFile,
-  GoabxInputMonth,
-  GoabxInputNumber,
-  GoabxInputPassword,
-  GoabxInputRange,
-  GoabxInputSearch,
-  GoabxInputTel,
-  GoabxInputText,
-  GoabxInputTime,
-  GoabxInputUrl,
-  GoabxLink,
-  GoabxModal,
-  GoabxNotification,
-  GoabxPagination,
-  GoabxRadioGroup,
-  GoabxRadioItem,
-  GoabxSideMenu,
-  GoabxSideMenuGroup,
-  GoabxSideMenuHeading,
-  GoabxTable,
-  GoabxTableSortHeader,
-  GoabxTabs,
-  GoabxTextArea,
-  GoabxWorkSideMenu,
-  GoabxWorkSideMenuGroup,
-  GoabxWorkSideMenuItem
-};
-//# sourceMappingURL=experimental.mjs.map