@abgov/react-components 5.2.0 → 5.3.0

package/experimental/form/form-summary.d.ts

@@ -0,0 +1,9 @@
+import * as React from "react";
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            "goa-simple-form-summary": React.HTMLAttributes<HTMLElement>;
+        }
+    }
+}
+export declare function GoASimpleFormSummary(): import("react/jsx-runtime").JSX.Element;

package/experimental/form/form.d.ts

@@ -0,0 +1,35 @@
+import { ReactNode } from "react";
+import { Margins } from "../../common/styling";
+export type FormState = {
+    form: Record<string, Record<string, {
+        label: string;
+        value: string;
+    }>>;
+    history: string[];
+    editting: string;
+    lastModified?: Date;
+};
+interface WCProps extends Margins {
+    ref?: React.MutableRefObject<HTMLElement | undefined>;
+    name: string;
+    storage: "none" | "local" | "session";
+}
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            "goa-simple-form": WCProps & React.HTMLAttributes<HTMLElement>;
+        }
+    }
+}
+interface GoAFormProps extends Margins {
+    children: ReactNode;
+    name: string;
+    storage: "none" | "local" | "session";
+    onMount: (fn: (next: string) => void) => void;
+    onStateChange?: (id: string, state: Record<string, Record<string, {
+        label: string;
+        value: string;
+    }>>) => void;
+}
+export declare function GoASimpleForm({ name, storage, onMount, onStateChange, mt, mr, mb, ml, children, }: GoAFormProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/experimental/form/task-list.d.ts

@@ -0,0 +1,18 @@
+import { ReactNode } from "react";
+import { Margins } from "../../common/styling";
+interface WCProps extends Margins {
+    heading: string;
+}
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            "goa-public-form-task-list": WCProps & React.HTMLAttributes<HTMLElement>;
+        }
+    }
+}
+type GoAPublicFormTaskListProps = {
+    heading: string;
+    children: ReactNode;
+};
+export declare function GoAPublicFormTaskList({ heading, children }: GoAPublicFormTaskListProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/experimental/form/task.d.ts

@@ -0,0 +1,18 @@
+import { ReactNode } from "react";
+import { Margins } from "../../common/styling";
+interface WCProps extends Margins {
+    status: "completed" | "not-started" | "cannot-start";
+}
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            "goa-public-form-task": WCProps & React.HTMLAttributes<HTMLElement>;
+        }
+    }
+}
+type GoAPublicFormTaskProps = {
+    status: "completed" | "not-started" | "cannot-start";
+    children: ReactNode;
+};
+export declare function GoAPublicFormTask({ status, children }: GoAPublicFormTaskProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/experimental/form-hook.d.ts

@@ -0,0 +1,8 @@
+type ContinueTo = (next: string) => void;
+type OnMount = (next: ContinueTo) => void;
+type SimpleForm = {
+    onMount: OnMount;
+    continueTo: ContinueTo;
+};
+export declare function useSimpleForm(): SimpleForm;
+export {};

package/experimental/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./resizable-panel/ResizablePanel";
+export * from "../lib/drawer/drawer";

package/experimental/resizable-panel/ResizablePanel.d.ts

@@ -0,0 +1,7 @@
+import { ReactNode } from "react";
+export type ResizableProps = {
+    minWidth?: number;
+    children: ReactNode;
+};
+export declare function ResizablePanel(props: ResizableProps): JSX.Element;
+export default ResizablePanel;

package/experimental/validators.d.ts

@@ -0,0 +1,50 @@
+export type FieldValidator = (value: unknown) => string;
+export declare class FormValidator {
+    private validators;
+    constructor(validators?: Record<string, FieldValidator[]>);
+    add(fieldName: string, ...validators: FieldValidator[]): void;
+    validate(data: Record<string, string>): {
+        errors: Record<string, string>;
+        valid: boolean;
+    };
+}
+export declare function relay<T>(el: HTMLElement | Element | null | undefined, eventName: string, data: T, opts?: {
+    bubbles?: boolean;
+}): void;
+export type RelayedError = {
+    name: string;
+    msg: string;
+};
+export declare function relayErrors(el: HTMLElement, errors: Record<string, string>): void;
+export declare function birthDayValidator(): FieldValidator[];
+export declare function birthMonthValidator(): FieldValidator[];
+export declare function birthYearValidator(): FieldValidator[];
+export declare function requiredValidator(msg?: string): FieldValidator;
+export declare function phoneNumberValidator(msg?: string): FieldValidator;
+export declare function emailValidator(msg?: string): FieldValidator;
+export declare function regexValidator(regex: RegExp, msg: string): FieldValidator;
+interface DateValidatorOptions {
+    invalidMsg?: string;
+    startMsg?: string;
+    endMsg?: string;
+    start?: Date;
+    end?: Date;
+}
+export declare function dateValidator({ invalidMsg, startMsg, endMsg, start, end, }: DateValidatorOptions): FieldValidator;
+interface NumericValidatorOptions {
+    invalidTypeMsg?: string;
+    minMsg?: string;
+    maxMsg?: string;
+    min?: number;
+    max?: number;
+}
+export declare function numericValidator({ invalidTypeMsg, minMsg, maxMsg, min, max, }: NumericValidatorOptions): FieldValidator;
+interface LengthValidatorOptions {
+    invalidTypeMsg?: string;
+    minMsg?: string;
+    maxMsg?: string;
+    max?: number;
+    min?: number;
+}
+export declare function lengthValidator({ invalidTypeMsg, minMsg, maxMsg, min, max, }: LengthValidatorOptions): FieldValidator;
+export {};

package/experimental.js

@@ -0,0 +1,123 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const icon = require("./icon-1IRcN4Uf.js");
+const panel = "_panel_m3z4m_1";
+const panelBackground = "_panelBackground_m3z4m_8";
+const children = "_children_m3z4m_12";
+const handle = "_handle_m3z4m_17";
+const width = "_width_m3z4m_42";
+const Css = {
+  panel,
+  panelBackground,
+  children,
+  handle,
+  width
+};
+function ResizablePanel(props) {
+  const maxWidth = react.useRef(0);
+  const resizeBarState = react.useRef("static");
+  const bgRef = react.useRef(null);
+  const sectionRef = react.useRef(null);
+  const widthRef = react.useRef(null);
+  const handleRef = react.useRef(null);
+  const [width2, setWidth] = react.useState();
+  react.useEffect(() => {
+    var _a;
+    maxWidth.current = ((_a = bgRef.current) == null ? void 0 : _a.getBoundingClientRect().width) ?? 0;
+  }, []);
+  function resetMouseState() {
+    resizeBarState.current = "static";
+  }
+  function onMouseDown(_) {
+    resizeBarState.current = "active";
+    window.addEventListener("mouseup", resetMouseState);
+  }
+  function onMouseUp(_) {
+    resizeBarState.current = "static";
+    window.removeEventListener("mouseup", resetMouseState);
+  }
+  function onMouseMove(e) {
+    var _a, _b;
+    if (resizeBarState.current === "static") {
+      return;
+    }
+    const sectionEl = sectionRef.current;
+    const xOffset = (sectionEl == null ? void 0 : sectionEl.getBoundingClientRect().x) || 0;
+    const mouseX = e.clientX;
+    const minWidth = props.minWidth || 0;
+    if (mouseX <= 0) {
+      return;
+    }
+    const newXPos = ((_a = handleRef.current) == null ? void 0 : _a.getBoundingClientRect().x) ?? 0;
+    const calcWidth = Math.max(
+      newXPos - xOffset,
+      Math.min(mouseX - xOffset, maxWidth.current)
+    );
+    const elementWidth = Math.max(minWidth, calcWidth - 64);
+    if (elementWidth <= minWidth) {
+      return;
+    }
+    sectionEl == null ? void 0 : sectionEl.setAttribute("style", `width: ${calcWidth}px;`);
+    (_b = widthRef.current) == null ? void 0 : _b.setAttribute(
+      "style",
+      `right: ${maxWidth.current - calcWidth + 32}px`
+    );
+    setWidth(`${Math.round(elementWidth)}px`);
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ref: bgRef,
+      className: Css.panelBackground,
+      onMouseDown,
+      onMouseMove,
+      onMouseUp,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("section", { ref: sectionRef, className: Css.panel, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: Css.children, children: props.children }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { ref: handleRef, className: Css.handle, children: /* @__PURE__ */ jsxRuntime.jsx(icon.GoAIcon, { type: "reorder-two" }) })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { ref: widthRef, className: Css.width, children: width2 })
+      ]
+    }
+  );
+}
+function GoADrawer({
+  open,
+  position,
+  heading,
+  maxSize,
+  testId,
+  children: children2,
+  onClose
+}) {
+  const el = react.useRef(null);
+  react.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__ */ jsxRuntime.jsx(
+    "goa-drawer",
+    {
+      ref: el,
+      open: open ? true : void 0,
+      position,
+      heading,
+      maxsize: maxSize,
+      "data-testid": testId,
+      children: children2
+    }
+  );
+}
+exports.GoADrawer = GoADrawer;
+exports.ResizablePanel = ResizablePanel;
+//# sourceMappingURL=experimental.js.map

package/experimental.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"experimental.js","sources":["../../../libs/react-components/src/experimental/resizable-panel/ResizablePanel.tsx","../../../libs/react-components/src/lib/drawer/drawer.tsx"],"sourcesContent":["import { ReactNode, useEffect, useRef, useState } from \"react\";\nimport Css from \"./ResizablePanel.module.css\";\nimport { GoAIcon } from \"../../lib/icon/icon\";\n\nexport type ResizableProps = {\n  minWidth?: number;\n  children: ReactNode;\n};\n\ntype MouseState = \"static\" | \"active\";\n\nexport function ResizablePanel(props: ResizableProps): JSX.Element {\n  // value refs\n  const maxWidth = useRef<number>(0);\n  const resizeBarState = useRef<MouseState>(\"static\");\n\n  // element refs\n  const bgRef = useRef<HTMLDivElement | null>(null);\n  const sectionRef = useRef<HTMLElement | null>(null);\n  const widthRef = useRef<HTMLDivElement | null>(null);\n  const handleRef = useRef<HTMLDivElement | null>(null);\n\n  // state\n  const [width, setWidth] = useState<string>();\n\n  useEffect(() => {\n    maxWidth.current = bgRef.current?.getBoundingClientRect().width ?? 0;\n  }, []);\n\n  function resetMouseState() {\n    resizeBarState.current = \"static\";\n  }\n\n  function onMouseDown(_: React.MouseEvent) {\n    resizeBarState.current = \"active\";\n    window.addEventListener(\"mouseup\", resetMouseState);\n  }\n\n  function onMouseUp(_: React.MouseEvent) {\n    resizeBarState.current = \"static\";\n    window.removeEventListener(\"mouseup\", resetMouseState);\n  }\n\n  function onMouseMove(e: React.MouseEvent) {\n    if (resizeBarState.current === \"static\") {\n      return;\n    }\n\n    const sectionEl = sectionRef.current;\n    const xOffset = sectionEl?.getBoundingClientRect().x || 0;\n    const mouseX = e.clientX;\n    const minWidth = props.minWidth || 0;\n\n    if (mouseX <= 0) {\n      return;\n    }\n\n    // mouse direction\n    const newXPos = handleRef.current?.getBoundingClientRect().x ?? 0;\n\n    // set width of preview area\n    const calcWidth = Math.max(\n      newXPos - xOffset,\n      Math.min(mouseX - xOffset, maxWidth.current),\n    );\n    const elementWidth = Math.max(minWidth, calcWidth - 64); // 4rem padding\n\n    // prevent dragging bar more than allowed\n    if (elementWidth <= minWidth) {\n      return;\n    }\n\n    // set resizable area width\n    sectionEl?.setAttribute(\"style\", `width: ${calcWidth}px;`);\n    // set displayed px width\n    widthRef.current?.setAttribute(\n      \"style\",\n      `right: ${maxWidth.current - calcWidth + 32}px`,\n    );\n    setWidth(`${Math.round(elementWidth)}px`);\n  }\n\n  return (\n    <div\n      ref={bgRef}\n      className={Css.panelBackground}\n      onMouseDown={onMouseDown}\n      onMouseMove={onMouseMove}\n      onMouseUp={onMouseUp}\n    >\n      <section ref={sectionRef} className={Css.panel}>\n        <div className={Css.children}>{props.children}</div>\n        <div ref={handleRef} className={Css.handle}>\n          <GoAIcon type=\"reorder-two\" />\n        </div>\n      </section>\n      <div ref={widthRef} className={Css.width}>\n        {width}\n      </div>\n    </div>\n  );\n}\n\nexport default ResizablePanel;\n","import { ReactNode, useEffect, useRef } from \"react\";\n\ntype DrawerPosition = \"bottom\" | \"left\" | \"right\" | undefined;\ntype DrawerSizeUnit = \"px\" | \"rem\" | \"ch\" | \"vh\" | \"vw\";\ntype DrawerSize = `${number}${DrawerSizeUnit}` | undefined;\n\ninterface WCProps {\n  open: boolean | undefined;\n  position: DrawerPosition;\n  heading?: string;\n  maxsize?: DrawerSize;\n  testid?: string;\n  ref: React.RefObject<HTMLElement>;\n}\n\ndeclare global {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    // eslint-disable-next-line @typescript-eslint/no-empty-interface\n    interface IntrinsicElements {\n      \"goa-drawer\": WCProps & React.HTMLAttributes<HTMLElement>;\n    }\n  }\n}\n\nexport interface GoADrawerProps {\n  open: boolean;\n  position: DrawerPosition;\n  heading?: string;\n  maxSize?: DrawerSize;\n  testId?: string;\n  children: ReactNode;\n  onClose: () => void;\n}\n\nexport function GoADrawer({\n  open,\n  position,\n  heading,\n  maxSize,\n  testId,\n  children,\n  onClose,\n}: GoADrawerProps): JSX.Element {\n  const el = useRef<HTMLElement>(null);\n\n  useEffect(() => {\n    if (!el?.current || !onClose) {\n      return;\n    }\n    el.current?.addEventListener(\"_close\", onClose)\n    return () => {\n      el.current?.removeEventListener(\"_close\", onClose)\n    }\n  }, [el, onClose])\n\n  return (\n    <goa-drawer\n      ref={el}\n      open={open ? true : undefined}\n      position={position}\n      heading={heading}\n      maxsize={maxSize}\n      data-testid={testId}\n    >\n      {children}\n    </goa-drawer>\n  );\n}\n\nexport default GoADrawer;\n"],"names":["useRef","width","useState","useEffect","jsxs","jsx","GoAIcon","children","_a"],"mappings":";;;;;;;;;;;;;;;;;AAWO,SAAS,eAAe,OAAoC;AAE3D,QAAA,WAAWA,aAAe,CAAC;AAC3B,QAAA,iBAAiBA,aAAmB,QAAQ;AAG5C,QAAA,QAAQA,aAA8B,IAAI;AAC1C,QAAA,aAAaA,aAA2B,IAAI;AAC5C,QAAA,WAAWA,aAA8B,IAAI;AAC7C,QAAA,YAAYA,aAA8B,IAAI;AAGpD,QAAM,CAACC,QAAO,QAAQ,IAAIC,MAAiB,SAAA;AAE3CC,QAAAA,UAAU,MAAM;;AACd,aAAS,YAAU,WAAM,YAAN,mBAAe,wBAAwB,UAAS;AAAA,EACrE,GAAG,CAAE,CAAA;AAEL,WAAS,kBAAkB;AACzB,mBAAe,UAAU;AAAA,EAC3B;AAEA,WAAS,YAAY,GAAqB;AACxC,mBAAe,UAAU;AAClB,WAAA,iBAAiB,WAAW,eAAe;AAAA,EACpD;AAEA,WAAS,UAAU,GAAqB;AACtC,mBAAe,UAAU;AAClB,WAAA,oBAAoB,WAAW,eAAe;AAAA,EACvD;AAEA,WAAS,YAAY,GAAqB;;AACpC,QAAA,eAAe,YAAY,UAAU;AACvC;AAAA,IACF;AAEA,UAAM,YAAY,WAAW;AAC7B,UAAM,WAAU,uCAAW,wBAAwB,MAAK;AACxD,UAAM,SAAS,EAAE;AACX,UAAA,WAAW,MAAM,YAAY;AAEnC,QAAI,UAAU,GAAG;AACf;AAAA,IACF;AAGA,UAAM,YAAU,eAAU,YAAV,mBAAmB,wBAAwB,MAAK;AAGhE,UAAM,YAAY,KAAK;AAAA,MACrB,UAAU;AAAA,MACV,KAAK,IAAI,SAAS,SAAS,SAAS,OAAO;AAAA,IAAA;AAE7C,UAAM,eAAe,KAAK,IAAI,UAAU,YAAY,EAAE;AAGtD,QAAI,gBAAgB,UAAU;AAC5B;AAAA,IACF;AAGA,2CAAW,aAAa,SAAS,UAAU,SAAS;AAEpD,mBAAS,YAAT,mBAAkB;AAAA,MAChB;AAAA,MACA,UAAU,SAAS,UAAU,YAAY,EAAE;AAAA;AAE7C,aAAS,GAAG,KAAK,MAAM,YAAY,CAAC,IAAI;AAAA,EAC1C;AAGE,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAW,IAAI;AAAA,MACf;AAAA,MACA;AAAA,MACA;AAAA,MAEA,UAAA;AAAA,QAAAA,gCAAC,WAAQ,EAAA,KAAK,YAAY,WAAW,IAAI,OACvC,UAAA;AAAA,UAAAC,+BAAC,OAAI,EAAA,WAAW,IAAI,UAAW,gBAAM,UAAS;AAAA,UAC9CA,2BAAA,IAAC,OAAI,EAAA,KAAK,WAAW,WAAW,IAAI,QAClC,UAACA,2BAAAA,IAAAC,KAAAA,SAAA,EAAQ,MAAK,cAAA,CAAc,EAC9B,CAAA;AAAA,QAAA,GACF;AAAA,uCACC,OAAI,EAAA,KAAK,UAAU,WAAW,IAAI,OAChC,UACHL,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;AClEO,SAAS,UAAU;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAAM;AAAA,EACA;AACF,GAAgC;AACxB,QAAA,KAAKP,aAAoB,IAAI;AAEnCG,QAAAA,UAAU,MAAM;;AACd,QAAI,EAAC,yBAAI,YAAW,CAAC,SAAS;AAC5B;AAAA,IACF;AACG,aAAA,YAAA,mBAAS,iBAAiB,UAAU;AACvC,WAAO,MAAM;;AACR,OAAAK,MAAA,GAAA,YAAA,gBAAAA,IAAS,oBAAoB,UAAU;AAAA,IAAO;AAAA,EACnD,GACC,CAAC,IAAI,OAAO,CAAC;AAGd,SAAAH,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,MAAM,OAAO,OAAO;AAAA,MACpB;AAAA,MACA;AAAA,MACA,SAAS;AAAA,MACT,eAAa;AAAA,MAEZ,UAAAE;AAAA,IAAA;AAAA,EAAA;AAGP;;;"}

package/experimental.mjs

@@ -0,0 +1,123 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useRef, useState, useEffect } from "react";
+import { G as GoAIcon } from "./icon-DgSW1II3.mjs";
+const panel = "_panel_m3z4m_1";
+const panelBackground = "_panelBackground_m3z4m_8";
+const children = "_children_m3z4m_12";
+const handle = "_handle_m3z4m_17";
+const width = "_width_m3z4m_42";
+const Css = {
+  panel,
+  panelBackground,
+  children,
+  handle,
+  width
+};
+function ResizablePanel(props) {
+  const maxWidth = useRef(0);
+  const resizeBarState = useRef("static");
+  const bgRef = useRef(null);
+  const sectionRef = useRef(null);
+  const widthRef = useRef(null);
+  const handleRef = useRef(null);
+  const [width2, setWidth] = useState();
+  useEffect(() => {
+    var _a;
+    maxWidth.current = ((_a = bgRef.current) == null ? void 0 : _a.getBoundingClientRect().width) ?? 0;
+  }, []);
+  function resetMouseState() {
+    resizeBarState.current = "static";
+  }
+  function onMouseDown(_) {
+    resizeBarState.current = "active";
+    window.addEventListener("mouseup", resetMouseState);
+  }
+  function onMouseUp(_) {
+    resizeBarState.current = "static";
+    window.removeEventListener("mouseup", resetMouseState);
+  }
+  function onMouseMove(e) {
+    var _a, _b;
+    if (resizeBarState.current === "static") {
+      return;
+    }
+    const sectionEl = sectionRef.current;
+    const xOffset = (sectionEl == null ? void 0 : sectionEl.getBoundingClientRect().x) || 0;
+    const mouseX = e.clientX;
+    const minWidth = props.minWidth || 0;
+    if (mouseX <= 0) {
+      return;
+    }
+    const newXPos = ((_a = handleRef.current) == null ? void 0 : _a.getBoundingClientRect().x) ?? 0;
+    const calcWidth = Math.max(
+      newXPos - xOffset,
+      Math.min(mouseX - xOffset, maxWidth.current)
+    );
+    const elementWidth = Math.max(minWidth, calcWidth - 64);
+    if (elementWidth <= minWidth) {
+      return;
+    }
+    sectionEl == null ? void 0 : sectionEl.setAttribute("style", `width: ${calcWidth}px;`);
+    (_b = widthRef.current) == null ? void 0 : _b.setAttribute(
+      "style",
+      `right: ${maxWidth.current - calcWidth + 32}px`
+    );
+    setWidth(`${Math.round(elementWidth)}px`);
+  }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: bgRef,
+      className: Css.panelBackground,
+      onMouseDown,
+      onMouseMove,
+      onMouseUp,
+      children: [
+        /* @__PURE__ */ jsxs("section", { ref: sectionRef, className: Css.panel, children: [
+          /* @__PURE__ */ jsx("div", { className: Css.children, children: props.children }),
+          /* @__PURE__ */ jsx("div", { ref: handleRef, className: Css.handle, children: /* @__PURE__ */ jsx(GoAIcon, { type: "reorder-two" }) })
+        ] }),
+        /* @__PURE__ */ jsx("div", { ref: widthRef, className: Css.width, children: width2 })
+      ]
+    }
+  );
+}
+function GoADrawer({
+  open,
+  position,
+  heading,
+  maxSize,
+  testId,
+  children: children2,
+  onClose
+}) {
+  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__ */ jsx(
+    "goa-drawer",
+    {
+      ref: el,
+      open: open ? true : void 0,
+      position,
+      heading,
+      maxsize: maxSize,
+      "data-testid": testId,
+      children: children2
+    }
+  );
+}
+export {
+  GoADrawer,
+  ResizablePanel
+};
+//# sourceMappingURL=experimental.mjs.map

package/experimental.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"experimental.mjs","sources":["../../../libs/react-components/src/experimental/resizable-panel/ResizablePanel.tsx","../../../libs/react-components/src/lib/drawer/drawer.tsx"],"sourcesContent":["import { ReactNode, useEffect, useRef, useState } from \"react\";\nimport Css from \"./ResizablePanel.module.css\";\nimport { GoAIcon } from \"../../lib/icon/icon\";\n\nexport type ResizableProps = {\n  minWidth?: number;\n  children: ReactNode;\n};\n\ntype MouseState = \"static\" | \"active\";\n\nexport function ResizablePanel(props: ResizableProps): JSX.Element {\n  // value refs\n  const maxWidth = useRef<number>(0);\n  const resizeBarState = useRef<MouseState>(\"static\");\n\n  // element refs\n  const bgRef = useRef<HTMLDivElement | null>(null);\n  const sectionRef = useRef<HTMLElement | null>(null);\n  const widthRef = useRef<HTMLDivElement | null>(null);\n  const handleRef = useRef<HTMLDivElement | null>(null);\n\n  // state\n  const [width, setWidth] = useState<string>();\n\n  useEffect(() => {\n    maxWidth.current = bgRef.current?.getBoundingClientRect().width ?? 0;\n  }, []);\n\n  function resetMouseState() {\n    resizeBarState.current = \"static\";\n  }\n\n  function onMouseDown(_: React.MouseEvent) {\n    resizeBarState.current = \"active\";\n    window.addEventListener(\"mouseup\", resetMouseState);\n  }\n\n  function onMouseUp(_: React.MouseEvent) {\n    resizeBarState.current = \"static\";\n    window.removeEventListener(\"mouseup\", resetMouseState);\n  }\n\n  function onMouseMove(e: React.MouseEvent) {\n    if (resizeBarState.current === \"static\") {\n      return;\n    }\n\n    const sectionEl = sectionRef.current;\n    const xOffset = sectionEl?.getBoundingClientRect().x || 0;\n    const mouseX = e.clientX;\n    const minWidth = props.minWidth || 0;\n\n    if (mouseX <= 0) {\n      return;\n    }\n\n    // mouse direction\n    const newXPos = handleRef.current?.getBoundingClientRect().x ?? 0;\n\n    // set width of preview area\n    const calcWidth = Math.max(\n      newXPos - xOffset,\n      Math.min(mouseX - xOffset, maxWidth.current),\n    );\n    const elementWidth = Math.max(minWidth, calcWidth - 64); // 4rem padding\n\n    // prevent dragging bar more than allowed\n    if (elementWidth <= minWidth) {\n      return;\n    }\n\n    // set resizable area width\n    sectionEl?.setAttribute(\"style\", `width: ${calcWidth}px;`);\n    // set displayed px width\n    widthRef.current?.setAttribute(\n      \"style\",\n      `right: ${maxWidth.current - calcWidth + 32}px`,\n    );\n    setWidth(`${Math.round(elementWidth)}px`);\n  }\n\n  return (\n    <div\n      ref={bgRef}\n      className={Css.panelBackground}\n      onMouseDown={onMouseDown}\n      onMouseMove={onMouseMove}\n      onMouseUp={onMouseUp}\n    >\n      <section ref={sectionRef} className={Css.panel}>\n        <div className={Css.children}>{props.children}</div>\n        <div ref={handleRef} className={Css.handle}>\n          <GoAIcon type=\"reorder-two\" />\n        </div>\n      </section>\n      <div ref={widthRef} className={Css.width}>\n        {width}\n      </div>\n    </div>\n  );\n}\n\nexport default ResizablePanel;\n","import { ReactNode, useEffect, useRef } from \"react\";\n\ntype DrawerPosition = \"bottom\" | \"left\" | \"right\" | undefined;\ntype DrawerSizeUnit = \"px\" | \"rem\" | \"ch\" | \"vh\" | \"vw\";\ntype DrawerSize = `${number}${DrawerSizeUnit}` | undefined;\n\ninterface WCProps {\n  open: boolean | undefined;\n  position: DrawerPosition;\n  heading?: string;\n  maxsize?: DrawerSize;\n  testid?: string;\n  ref: React.RefObject<HTMLElement>;\n}\n\ndeclare global {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    // eslint-disable-next-line @typescript-eslint/no-empty-interface\n    interface IntrinsicElements {\n      \"goa-drawer\": WCProps & React.HTMLAttributes<HTMLElement>;\n    }\n  }\n}\n\nexport interface GoADrawerProps {\n  open: boolean;\n  position: DrawerPosition;\n  heading?: string;\n  maxSize?: DrawerSize;\n  testId?: string;\n  children: ReactNode;\n  onClose: () => void;\n}\n\nexport function GoADrawer({\n  open,\n  position,\n  heading,\n  maxSize,\n  testId,\n  children,\n  onClose,\n}: GoADrawerProps): JSX.Element {\n  const el = useRef<HTMLElement>(null);\n\n  useEffect(() => {\n    if (!el?.current || !onClose) {\n      return;\n    }\n    el.current?.addEventListener(\"_close\", onClose)\n    return () => {\n      el.current?.removeEventListener(\"_close\", onClose)\n    }\n  }, [el, onClose])\n\n  return (\n    <goa-drawer\n      ref={el}\n      open={open ? true : undefined}\n      position={position}\n      heading={heading}\n      maxsize={maxSize}\n      data-testid={testId}\n    >\n      {children}\n    </goa-drawer>\n  );\n}\n\nexport default GoADrawer;\n"],"names":["width","children","_a"],"mappings":"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"}

package/icon-1IRcN4Uf.js

@@ -0,0 +1,38 @@
+"use strict";
+const jsxRuntime = require("react/jsx-runtime");
+function GoAIcon({
+  type,
+  theme,
+  size,
+  inverted,
+  fillColor,
+  opacity,
+  title,
+  ariaLabel,
+  mt,
+  mr,
+  mb,
+  ml,
+  testId
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "goa-icon",
+    {
+      type,
+      theme,
+      size,
+      inverted,
+      fillcolor: fillColor,
+      opacity,
+      title,
+      arialabel: ariaLabel,
+      mt,
+      mr,
+      mb,
+      ml,
+      testid: testId
+    }
+  );
+}
+exports.GoAIcon = GoAIcon;
+//# sourceMappingURL=icon-1IRcN4Uf.js.map

package/icon-1IRcN4Uf.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-1IRcN4Uf.js","sources":["../../../libs/react-components/src/lib/icon/icon.tsx"],"sourcesContent":["import { Margins } from \"../../common/styling\";\n\nexport type GoAIconFilledType = `${GoAIconType}-${GoAIconTheme}`;\n\ninterface IonIconProps {\n  name: GoAIconType | GoAIconFilledType;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\ninterface IonIconElement extends HTMLElement {}\n\ndeclare global {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    // eslint-disable-next-line @typescript-eslint/no-empty-interface\n    interface IntrinsicElements {\n      \"ion-icon\": IonIconProps & React.HTMLAttributes<IonIconElement>;\n    }\n  }\n}\n\ndeclare global {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    // eslint-disable-next-line @typescript-eslint/no-empty-interface\n    interface IntrinsicElements {\n      \"goa-icon\": WCProps & React.HTMLAttributes<IonIconElement>;\n    }\n  }\n}\n\nexport type GoAIconType =\n  | \"accessibility\"\n  | \"add-circle\"\n  | \"add\"\n  | \"airplane\"\n  | \"alarm\"\n  | \"albums\"\n  | \"alert-circle\"\n  | \"alert\"\n  | \"american-football\"\n  | \"analytics\"\n  | \"aperture\"\n  | \"apps\"\n  | \"archive\"\n  | \"arrow-back-circle\"\n  | \"arrow-back\"\n  | \"arrow-down-circle\"\n  | \"arrow-down\"\n  | \"arrow-forward-circle\"\n  | \"arrow-forward\"\n  | \"arrow-redo-circle\"\n  | \"arrow-redo\"\n  | \"arrow-undo-circle\"\n  | \"arrow-undo\"\n  | \"arrow-up-circle\"\n  | \"arrow-up\"\n  | \"at-circle\"\n  | \"at\"\n  | \"attach\"\n  | \"backspace\"\n  | \"bag-add\"\n  | \"bag-check\"\n  | \"bag-handle\"\n  | \"bag\"\n  | \"bag-remove\"\n  | \"balloon\"\n  | \"ban\"\n  | \"bandage\"\n  | \"bar-chart\"\n  | \"barbell\"\n  | \"barcode\"\n  | \"baseball\"\n  | \"basket\"\n  | \"basketball\"\n  | \"battery-charging\"\n  | \"battery-dead\"\n  | \"battery-full\"\n  | \"battery-half\"\n  | \"beaker\"\n  | \"bed\"\n  | \"beer\"\n  | \"bicycle\"\n  | \"bluetooth\"\n  | \"boat\"\n  | \"body\"\n  | \"bonfire\"\n  | \"book\"\n  | \"bookmark\"\n  | \"bookmarks\"\n  | \"bowling-ball\"\n  | \"briefcase\"\n  | \"browsers\"\n  | \"brush\"\n  | \"bug\"\n  | \"build\"\n  | \"bulb\"\n  | \"bus\"\n  | \"business\"\n  | \"cafe\"\n  | \"calculator\"\n  | \"calendar-clear\"\n  | \"calendar-number\"\n  | \"calendar\"\n  | \"call\"\n  | \"camera\"\n  | \"camera-reverse\"\n  | \"car\"\n  | \"car-sport\"\n  | \"card\"\n  | \"caret-back-circle\"\n  | \"caret-back\"\n  | \"caret-down-circle\"\n  | \"caret-down\"\n  | \"caret-forward-circle\"\n  | \"caret-forward\"\n  | \"caret-up-circle\"\n  | \"caret-up\"\n  | \"cart\"\n  | \"cash\"\n  | \"cellular\"\n  | \"chatbox-ellipses\"\n  | \"chatbox\"\n  | \"chatbubble-ellipses\"\n  | \"chatbubble\"\n  | \"chatbubbles\"\n  | \"checkbox\"\n  | \"checkmark-circle\"\n  | \"checkmark-done-circle\"\n  | \"checkmark-done\"\n  | \"checkmark\"\n  | \"chevron-back-circle\"\n  | \"chevron-back\"\n  | \"chevron-down-circle\"\n  | \"chevron-down\"\n  | \"chevron-forward-circle\"\n  | \"chevron-forward\"\n  | \"chevron-up-circle\"\n  | \"chevron-up\"\n  | \"clipboard\"\n  | \"close-circle\"\n  | \"close\"\n  | \"cloud-circle\"\n  | \"cloud-done\"\n  | \"cloud-download\"\n  | \"cloud-offline\"\n  | \"cloud\"\n  | \"cloud-upload\"\n  | \"cloudy-night\"\n  | \"cloudy\"\n  | \"code-download\"\n  | \"code\"\n  | \"code-slash\"\n  | \"code-working\"\n  | \"cog\"\n  | \"color-fill\"\n  | \"color-filter\"\n  | \"color-palette\"\n  | \"color-wand\"\n  | \"compass\"\n  | \"construct\"\n  | \"contract\"\n  | \"contrast\"\n  | \"copy\"\n  | \"create\"\n  | \"crop\"\n  | \"cube\"\n  | \"cut\"\n  | \"desktop\"\n  | \"diamond\"\n  | \"dice\"\n  | \"disc\"\n  | \"document-attach\"\n  | \"document-lock\"\n  | \"document\"\n  | \"document-text\"\n  | \"documents\"\n  | \"download\"\n  | \"duplicate\"\n  | \"ear\"\n  | \"earth\"\n  | \"easel\"\n  | \"egg\"\n  | \"ellipse\"\n  | \"ellipsis-horizontal-circle\"\n  | \"ellipsis-horizontal\"\n  | \"ellipsis-vertical-circle\"\n  | \"ellipsis-vertical\"\n  | \"enter\"\n  | \"exit\"\n  | \"expand\"\n  | \"extension-puzzle\"\n  | \"eye-off\"\n  | \"eye\"\n  | \"eyedrop\"\n  | \"fast-food\"\n  | \"female\"\n  | \"file-tray-full\"\n  | \"file-tray\"\n  | \"file-tray-stacked\"\n  | \"filenames.ps1\"\n  | \"film\"\n  | \"filter-circle\"\n  | \"filter\"\n  | \"finger-print\"\n  | \"fish\"\n  | \"fitness\"\n  | \"flag\"\n  | \"flame\"\n  | \"flash-off\"\n  | \"flash\"\n  | \"flashlight\"\n  | \"flask\"\n  | \"flower\"\n  | \"folder-open\"\n  | \"folder\"\n  | \"football\"\n  | \"footsteps\"\n  | \"funnel\"\n  | \"game-controller\"\n  | \"gift\"\n  | \"git-branch\"\n  | \"git-commit\"\n  | \"git-compare\"\n  | \"git-merge\"\n  | \"git-network\"\n  | \"git-pull-request\"\n  | \"glasses\"\n  | \"globe\"\n  | \"golf\"\n  | \"grid\"\n  | \"hammer\"\n  | \"hand-left\"\n  | \"hand-right\"\n  | \"happy\"\n  | \"hardware-chip\"\n  | \"headset\"\n  | \"heart-circle\"\n  | \"heart-dislike-circle\"\n  | \"heart-dislike\"\n  | \"heart-half\"\n  | \"heart\"\n  | \"help-buoy\"\n  | \"help-circle\"\n  | \"help\"\n  | \"home\"\n  | \"hourglass\"\n  | \"ice-cream\"\n  | \"id-card\"\n  | \"image\"\n  | \"images\"\n  | \"infinite\"\n  | \"information-circle\"\n  | \"information\"\n  | \"invert-mode\"\n  | \"journal\"\n  | \"key\"\n  | \"keypad\"\n  | \"language\"\n  | \"laptop\"\n  | \"layers\"\n  | \"leaf\"\n  | \"library\"\n  | \"link\"\n  | \"list-circle\"\n  | \"list\"\n  | \"locate\"\n  | \"location\"\n  | \"lock-closed\"\n  | \"lock-open\"\n  | \"log-in\"\n  | \"log-out\"\n  | \"magnet\"\n  | \"mail-open\"\n  | \"mail\"\n  | \"mail-unread\"\n  | \"male-female\"\n  | \"male\"\n  | \"man\"\n  | \"map\"\n  | \"medal\"\n  | \"medical\"\n  | \"medkit\"\n  | \"megaphone\"\n  | \"menu\"\n  | \"mic-circle\"\n  | \"mic-off-circle\"\n  | \"mic-off\"\n  | \"mic\"\n  | \"moon\"\n  | \"move\"\n  | \"musical-note\"\n  | \"musical-notes\"\n  | \"navigate-circle\"\n  | \"navigate\"\n  | \"newspaper\"\n  | \"notifications-circle\"\n  | \"notifications-off-circle\"\n  | \"notifications-off\"\n  | \"notifications\"\n  | \"nuclear\"\n  | \"nutrition\"\n  | \"open\"\n  | \"options\"\n  | \"paper-plane\"\n  | \"partly-sunny\"\n  | \"pause-circle\"\n  | \"pause\"\n  | \"paw\"\n  | \"pencil\"\n  | \"people-circle\"\n  | \"people\"\n  | \"person-add\"\n  | \"person-circle\"\n  | \"person\"\n  | \"person-remove\"\n  | \"phone-landscape\"\n  | \"phone-portrait\"\n  | \"pie-chart\"\n  | \"pin\"\n  | \"pint\"\n  | \"pizza\"\n  | \"planet\"\n  | \"play-back-circle\"\n  | \"play-back\"\n  | \"play-circle\"\n  | \"play-forward-circle\"\n  | \"play-forward\"\n  | \"play\"\n  | \"play-skip-back-circle\"\n  | \"play-skip-back\"\n  | \"play-skip-forward-circle\"\n  | \"play-skip-forward\"\n  | \"podium\"\n  | \"power\"\n  | \"pricetag\"\n  | \"pricetags\"\n  | \"print\"\n  | \"prism\"\n  | \"pulse\"\n  | \"push\"\n  | \"qr-code\"\n  | \"radio-button-off\"\n  | \"radio-button-on\"\n  | \"radio\"\n  | \"rainy\"\n  | \"reader\"\n  | \"receipt\"\n  | \"recording\"\n  | \"refresh-circle\"\n  | \"refresh\"\n  | \"reload-circle\"\n  | \"reload\"\n  | \"remove-circle\"\n  | \"remove\"\n  | \"reorder-four\"\n  | \"reorder-three\"\n  | \"reorder-two\"\n  | \"repeat\"\n  | \"resize\"\n  | \"restaurant\"\n  | \"return-down-back\"\n  | \"return-down-forward\"\n  | \"return-up-back\"\n  | \"return-up-forward\"\n  | \"ribbon\"\n  | \"rocket\"\n  | \"rose\"\n  | \"sad\"\n  | \"save\"\n  | \"scale\"\n  | \"scan-circle\"\n  | \"scan\"\n  | \"school\"\n  | \"search-circle\"\n  | \"search\"\n  | \"send\"\n  | \"server\"\n  | \"settings\"\n  | \"shapes\"\n  | \"share\"\n  | \"share-social\"\n  | \"shield-checkmark\"\n  | \"shield-half\"\n  | \"shield\"\n  | \"shirt\"\n  | \"shuffle\"\n  | \"skull\"\n  | \"snow\"\n  | \"sparkles\"\n  | \"speedometer\"\n  | \"square\"\n  | \"star-half\"\n  | \"star\"\n  | \"stats-chart\"\n  | \"stop-circle\"\n  | \"stop\"\n  | \"stopwatch\"\n  | \"storefront\"\n  | \"subway\"\n  | \"sunny\"\n  | \"swap-horizontal\"\n  | \"swap-vertical\"\n  | \"sync-circle\"\n  | \"sync\"\n  | \"tablet-landscape\"\n  | \"tablet-portrait\"\n  | \"telescope\"\n  | \"tennisball\"\n  | \"terminal\"\n  | \"text\"\n  | \"thermometer\"\n  | \"thumbs-down\"\n  | \"thumbs-up\"\n  | \"thunderstorm\"\n  | \"ticket\"\n  | \"time\"\n  | \"timer\"\n  | \"today\"\n  | \"toggle\"\n  | \"trail-sign\"\n  | \"train\"\n  | \"transgender\"\n  | \"trash-bin\"\n  | \"trash\"\n  | \"trending-down\"\n  | \"trending-up\"\n  | \"triangle\"\n  | \"trophy\"\n  | \"tv\"\n  | \"umbrella\"\n  | \"unlink\"\n  | \"videocam-off\"\n  | \"videocam\"\n  | \"volume-high\"\n  | \"volume-low\"\n  | \"volume-medium\"\n  | \"volume-mute\"\n  | \"volume-off\"\n  | \"walk\"\n  | \"wallet\"\n  | \"warning\"\n  | \"watch\"\n  | \"water\"\n  | \"wifi\"\n  | \"wine\"\n  | \"woman\"\n  | \"logo-alipay\"\n  | \"logo-amazon\"\n  | \"logo-amplify\"\n  | \"logo-android\"\n  | \"logo-angular\"\n  | \"logo-apple\"\n  | \"logo-apple-appstore\"\n  | \"logo-apple-ar\"\n  | \"logo-behance\"\n  | \"logo-bitbucket\"\n  | \"logo-bitcoin\"\n  | \"logo-buffer\"\n  | \"logo-capacitor\"\n  | \"logo-chrome\"\n  | \"logo-closed-captioning\"\n  | \"logo-codepen\"\n  | \"logo-css3\"\n  | \"logo-designernews\"\n  | \"logo-deviantart\"\n  | \"logo-discord\"\n  | \"logo-docker\"\n  | \"logo-dribbble\"\n  | \"logo-dropbox\"\n  | \"logo-edge\"\n  | \"logo-electron\"\n  | \"logo-euro\"\n  | \"logo-facebook\"\n  | \"logo-figma\"\n  | \"logo-firebase\"\n  | \"logo-firefox\"\n  | \"logo-flickr\"\n  | \"logo-foursquare\"\n  | \"logo-github\"\n  | \"logo-gitlab\"\n  | \"logo-google\"\n  | \"logo-google-playstore\"\n  | \"logo-hackernews\"\n  | \"logo-html5\"\n  | \"logo-instagram\"\n  | \"logo-ionic\"\n  | \"logo-ionitron\"\n  | \"logo-javascript\"\n  | \"logo-laravel\"\n  | \"logo-linkedin\"\n  | \"logo-markdown\"\n  | \"logo-mastodon\"\n  | \"logo-medium\"\n  | \"logo-microsoft\"\n  | \"logo-no-smoking\"\n  | \"logo-nodejs\"\n  | \"logo-npm\"\n  | \"logo-octocat\"\n  | \"logo-paypal\"\n  | \"logo-pinterest\"\n  | \"logo-playstation\"\n  | \"logo-pwa\"\n  | \"logo-python\"\n  | \"logo-react\"\n  | \"logo-reddit\"\n  | \"logo-rss\"\n  | \"logo-sass\"\n  | \"logo-skype\"\n  | \"logo-slack\"\n  | \"logo-snapchat\"\n  | \"logo-soundcloud\"\n  | \"logo-stackoverflow\"\n  | \"logo-steam\"\n  | \"logo-stencil\"\n  | \"logo-tableau\"\n  | \"logo-tiktok\"\n  | \"logo-tumblr\"\n  | \"logo-tux\"\n  | \"logo-twitch\"\n  | \"logo-twitter\"\n  | \"logo-usd\"\n  | \"logo-venmo\"\n  | \"logo-vercel\"\n  | \"logo-vimeo\"\n  | \"logo-vk\"\n  | \"logo-vue\"\n  | \"logo-web-component\"\n  | \"logo-wechat\"\n  | \"logo-whatsapp\"\n  | \"logo-windows\"\n  | \"logo-wordpress\"\n  | \"logo-xbox\"\n  | \"logo-xing\"\n  | \"logo-yahoo\"\n  | \"logo-yen\"\n  | \"logo-youtube\";\n\nexport type GoAIconSize = \"small\" | \"medium\" | \"large\" | \"xlarge\";\nexport type GoAIconVariant = \"primary\" | \"secondary\" | \"tertiary\";\nexport type GoAIconTheme = \"outline\" | \"filled\" | \"sharp\";\n\n// legacy naming\nexport type IconSize = GoAIconSize;\nexport type IconVariant = GoAIconVariant;\nexport type IconTheme = GoAIconTheme;\n\nexport interface GoAIconProps extends Margins {\n  type: GoAIconType;\n  size?: GoAIconSize;\n  theme?: GoAIconTheme;\n  inverted?: string;\n  fillColor?: string;\n  opacity?: number;\n  title?: string;\n  ariaLabel?: string;\n  testId?: string;\n}\n\ninterface WCProps extends Margins {\n  type: GoAIconType;\n  theme?: GoAIconTheme;\n  size?: GoAIconSize;\n  inverted?: string;\n  fillcolor?: string;\n  opacity?: number;\n  title?: string;\n  arialabel?: string;\n  testid?: string;\n}\n\nexport function GoAIcon({\n  type,\n  theme,\n  size,\n  inverted,\n  fillColor,\n  opacity,\n  title,\n  ariaLabel,\n  mt,\n  mr,\n  mb,\n  ml,\n  testId,\n}: GoAIconProps): JSX.Element {\n  return (\n    <goa-icon\n      type={type}\n      theme={theme}\n      size={size}\n      inverted={inverted}\n      fillcolor={fillColor}\n      opacity={opacity}\n      title={title}\n      arialabel={ariaLabel}\n      mt={mt}\n      mr={mr}\n      mb={mb}\n      ml={ml}\n      testid={testId}\n    />\n  );\n}\n"],"names":["jsx"],"mappings":";;AA2jBO,SAAS,QAAQ;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA8B;AAE1B,SAAAA,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,IAAA;AAAA,EAAA;AAGd;;"}

package/icon-DgSW1II3.mjs

@@ -0,0 +1,39 @@
+import { jsx } from "react/jsx-runtime";
+function GoAIcon({
+  type,
+  theme,
+  size,
+  inverted,
+  fillColor,
+  opacity,
+  title,
+  ariaLabel,
+  mt,
+  mr,
+  mb,
+  ml,
+  testId
+}) {
+  return /* @__PURE__ */ jsx(
+    "goa-icon",
+    {
+      type,
+      theme,
+      size,
+      inverted,
+      fillcolor: fillColor,
+      opacity,
+      title,
+      arialabel: ariaLabel,
+      mt,
+      mr,
+      mb,
+      ml,
+      testid: testId
+    }
+  );
+}
+export {
+  GoAIcon as G
+};
+//# sourceMappingURL=icon-DgSW1II3.mjs.map

package/icon-DgSW1II3.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-DgSW1II3.mjs","sources":["../../../libs/react-components/src/lib/icon/icon.tsx"],"sourcesContent":["import { Margins } from \"../../common/styling\";\n\nexport type GoAIconFilledType = `${GoAIconType}-${GoAIconTheme}`;\n\ninterface IonIconProps {\n  name: GoAIconType | GoAIconFilledType;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\ninterface IonIconElement extends HTMLElement {}\n\ndeclare global {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    // eslint-disable-next-line @typescript-eslint/no-empty-interface\n    interface IntrinsicElements {\n      \"ion-icon\": IonIconProps & React.HTMLAttributes<IonIconElement>;\n    }\n  }\n}\n\ndeclare global {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    // eslint-disable-next-line @typescript-eslint/no-empty-interface\n    interface IntrinsicElements {\n      \"goa-icon\": WCProps & React.HTMLAttributes<IonIconElement>;\n    }\n  }\n}\n\nexport type GoAIconType =\n  | \"accessibility\"\n  | \"add-circle\"\n  | \"add\"\n  | \"airplane\"\n  | \"alarm\"\n  | \"albums\"\n  | \"alert-circle\"\n  | \"alert\"\n  | \"american-football\"\n  | \"analytics\"\n  | \"aperture\"\n  | \"apps\"\n  | \"archive\"\n  | \"arrow-back-circle\"\n  | \"arrow-back\"\n  | \"arrow-down-circle\"\n  | \"arrow-down\"\n  | \"arrow-forward-circle\"\n  | \"arrow-forward\"\n  | \"arrow-redo-circle\"\n  | \"arrow-redo\"\n  | \"arrow-undo-circle\"\n  | \"arrow-undo\"\n  | \"arrow-up-circle\"\n  | \"arrow-up\"\n  | \"at-circle\"\n  | \"at\"\n  | \"attach\"\n  | \"backspace\"\n  | \"bag-add\"\n  | \"bag-check\"\n  | \"bag-handle\"\n  | \"bag\"\n  | \"bag-remove\"\n  | \"balloon\"\n  | \"ban\"\n  | \"bandage\"\n  | \"bar-chart\"\n  | \"barbell\"\n  | \"barcode\"\n  | \"baseball\"\n  | \"basket\"\n  | \"basketball\"\n  | \"battery-charging\"\n  | \"battery-dead\"\n  | \"battery-full\"\n  | \"battery-half\"\n  | \"beaker\"\n  | \"bed\"\n  | \"beer\"\n  | \"bicycle\"\n  | \"bluetooth\"\n  | \"boat\"\n  | \"body\"\n  | \"bonfire\"\n  | \"book\"\n  | \"bookmark\"\n  | \"bookmarks\"\n  | \"bowling-ball\"\n  | \"briefcase\"\n  | \"browsers\"\n  | \"brush\"\n  | \"bug\"\n  | \"build\"\n  | \"bulb\"\n  | \"bus\"\n  | \"business\"\n  | \"cafe\"\n  | \"calculator\"\n  | \"calendar-clear\"\n  | \"calendar-number\"\n  | \"calendar\"\n  | \"call\"\n  | \"camera\"\n  | \"camera-reverse\"\n  | \"car\"\n  | \"car-sport\"\n  | \"card\"\n  | \"caret-back-circle\"\n  | \"caret-back\"\n  | \"caret-down-circle\"\n  | \"caret-down\"\n  | \"caret-forward-circle\"\n  | \"caret-forward\"\n  | \"caret-up-circle\"\n  | \"caret-up\"\n  | \"cart\"\n  | \"cash\"\n  | \"cellular\"\n  | \"chatbox-ellipses\"\n  | \"chatbox\"\n  | \"chatbubble-ellipses\"\n  | \"chatbubble\"\n  | \"chatbubbles\"\n  | \"checkbox\"\n  | \"checkmark-circle\"\n  | \"checkmark-done-circle\"\n  | \"checkmark-done\"\n  | \"checkmark\"\n  | \"chevron-back-circle\"\n  | \"chevron-back\"\n  | \"chevron-down-circle\"\n  | \"chevron-down\"\n  | \"chevron-forward-circle\"\n  | \"chevron-forward\"\n  | \"chevron-up-circle\"\n  | \"chevron-up\"\n  | \"clipboard\"\n  | \"close-circle\"\n  | \"close\"\n  | \"cloud-circle\"\n  | \"cloud-done\"\n  | \"cloud-download\"\n  | \"cloud-offline\"\n  | \"cloud\"\n  | \"cloud-upload\"\n  | \"cloudy-night\"\n  | \"cloudy\"\n  | \"code-download\"\n  | \"code\"\n  | \"code-slash\"\n  | \"code-working\"\n  | \"cog\"\n  | \"color-fill\"\n  | \"color-filter\"\n  | \"color-palette\"\n  | \"color-wand\"\n  | \"compass\"\n  | \"construct\"\n  | \"contract\"\n  | \"contrast\"\n  | \"copy\"\n  | \"create\"\n  | \"crop\"\n  | \"cube\"\n  | \"cut\"\n  | \"desktop\"\n  | \"diamond\"\n  | \"dice\"\n  | \"disc\"\n  | \"document-attach\"\n  | \"document-lock\"\n  | \"document\"\n  | \"document-text\"\n  | \"documents\"\n  | \"download\"\n  | \"duplicate\"\n  | \"ear\"\n  | \"earth\"\n  | \"easel\"\n  | \"egg\"\n  | \"ellipse\"\n  | \"ellipsis-horizontal-circle\"\n  | \"ellipsis-horizontal\"\n  | \"ellipsis-vertical-circle\"\n  | \"ellipsis-vertical\"\n  | \"enter\"\n  | \"exit\"\n  | \"expand\"\n  | \"extension-puzzle\"\n  | \"eye-off\"\n  | \"eye\"\n  | \"eyedrop\"\n  | \"fast-food\"\n  | \"female\"\n  | \"file-tray-full\"\n  | \"file-tray\"\n  | \"file-tray-stacked\"\n  | \"filenames.ps1\"\n  | \"film\"\n  | \"filter-circle\"\n  | \"filter\"\n  | \"finger-print\"\n  | \"fish\"\n  | \"fitness\"\n  | \"flag\"\n  | \"flame\"\n  | \"flash-off\"\n  | \"flash\"\n  | \"flashlight\"\n  | \"flask\"\n  | \"flower\"\n  | \"folder-open\"\n  | \"folder\"\n  | \"football\"\n  | \"footsteps\"\n  | \"funnel\"\n  | \"game-controller\"\n  | \"gift\"\n  | \"git-branch\"\n  | \"git-commit\"\n  | \"git-compare\"\n  | \"git-merge\"\n  | \"git-network\"\n  | \"git-pull-request\"\n  | \"glasses\"\n  | \"globe\"\n  | \"golf\"\n  | \"grid\"\n  | \"hammer\"\n  | \"hand-left\"\n  | \"hand-right\"\n  | \"happy\"\n  | \"hardware-chip\"\n  | \"headset\"\n  | \"heart-circle\"\n  | \"heart-dislike-circle\"\n  | \"heart-dislike\"\n  | \"heart-half\"\n  | \"heart\"\n  | \"help-buoy\"\n  | \"help-circle\"\n  | \"help\"\n  | \"home\"\n  | \"hourglass\"\n  | \"ice-cream\"\n  | \"id-card\"\n  | \"image\"\n  | \"images\"\n  | \"infinite\"\n  | \"information-circle\"\n  | \"information\"\n  | \"invert-mode\"\n  | \"journal\"\n  | \"key\"\n  | \"keypad\"\n  | \"language\"\n  | \"laptop\"\n  | \"layers\"\n  | \"leaf\"\n  | \"library\"\n  | \"link\"\n  | \"list-circle\"\n  | \"list\"\n  | \"locate\"\n  | \"location\"\n  | \"lock-closed\"\n  | \"lock-open\"\n  | \"log-in\"\n  | \"log-out\"\n  | \"magnet\"\n  | \"mail-open\"\n  | \"mail\"\n  | \"mail-unread\"\n  | \"male-female\"\n  | \"male\"\n  | \"man\"\n  | \"map\"\n  | \"medal\"\n  | \"medical\"\n  | \"medkit\"\n  | \"megaphone\"\n  | \"menu\"\n  | \"mic-circle\"\n  | \"mic-off-circle\"\n  | \"mic-off\"\n  | \"mic\"\n  | \"moon\"\n  | \"move\"\n  | \"musical-note\"\n  | \"musical-notes\"\n  | \"navigate-circle\"\n  | \"navigate\"\n  | \"newspaper\"\n  | \"notifications-circle\"\n  | \"notifications-off-circle\"\n  | \"notifications-off\"\n  | \"notifications\"\n  | \"nuclear\"\n  | \"nutrition\"\n  | \"open\"\n  | \"options\"\n  | \"paper-plane\"\n  | \"partly-sunny\"\n  | \"pause-circle\"\n  | \"pause\"\n  | \"paw\"\n  | \"pencil\"\n  | \"people-circle\"\n  | \"people\"\n  | \"person-add\"\n  | \"person-circle\"\n  | \"person\"\n  | \"person-remove\"\n  | \"phone-landscape\"\n  | \"phone-portrait\"\n  | \"pie-chart\"\n  | \"pin\"\n  | \"pint\"\n  | \"pizza\"\n  | \"planet\"\n  | \"play-back-circle\"\n  | \"play-back\"\n  | \"play-circle\"\n  | \"play-forward-circle\"\n  | \"play-forward\"\n  | \"play\"\n  | \"play-skip-back-circle\"\n  | \"play-skip-back\"\n  | \"play-skip-forward-circle\"\n  | \"play-skip-forward\"\n  | \"podium\"\n  | \"power\"\n  | \"pricetag\"\n  | \"pricetags\"\n  | \"print\"\n  | \"prism\"\n  | \"pulse\"\n  | \"push\"\n  | \"qr-code\"\n  | \"radio-button-off\"\n  | \"radio-button-on\"\n  | \"radio\"\n  | \"rainy\"\n  | \"reader\"\n  | \"receipt\"\n  | \"recording\"\n  | \"refresh-circle\"\n  | \"refresh\"\n  | \"reload-circle\"\n  | \"reload\"\n  | \"remove-circle\"\n  | \"remove\"\n  | \"reorder-four\"\n  | \"reorder-three\"\n  | \"reorder-two\"\n  | \"repeat\"\n  | \"resize\"\n  | \"restaurant\"\n  | \"return-down-back\"\n  | \"return-down-forward\"\n  | \"return-up-back\"\n  | \"return-up-forward\"\n  | \"ribbon\"\n  | \"rocket\"\n  | \"rose\"\n  | \"sad\"\n  | \"save\"\n  | \"scale\"\n  | \"scan-circle\"\n  | \"scan\"\n  | \"school\"\n  | \"search-circle\"\n  | \"search\"\n  | \"send\"\n  | \"server\"\n  | \"settings\"\n  | \"shapes\"\n  | \"share\"\n  | \"share-social\"\n  | \"shield-checkmark\"\n  | \"shield-half\"\n  | \"shield\"\n  | \"shirt\"\n  | \"shuffle\"\n  | \"skull\"\n  | \"snow\"\n  | \"sparkles\"\n  | \"speedometer\"\n  | \"square\"\n  | \"star-half\"\n  | \"star\"\n  | \"stats-chart\"\n  | \"stop-circle\"\n  | \"stop\"\n  | \"stopwatch\"\n  | \"storefront\"\n  | \"subway\"\n  | \"sunny\"\n  | \"swap-horizontal\"\n  | \"swap-vertical\"\n  | \"sync-circle\"\n  | \"sync\"\n  | \"tablet-landscape\"\n  | \"tablet-portrait\"\n  | \"telescope\"\n  | \"tennisball\"\n  | \"terminal\"\n  | \"text\"\n  | \"thermometer\"\n  | \"thumbs-down\"\n  | \"thumbs-up\"\n  | \"thunderstorm\"\n  | \"ticket\"\n  | \"time\"\n  | \"timer\"\n  | \"today\"\n  | \"toggle\"\n  | \"trail-sign\"\n  | \"train\"\n  | \"transgender\"\n  | \"trash-bin\"\n  | \"trash\"\n  | \"trending-down\"\n  | \"trending-up\"\n  | \"triangle\"\n  | \"trophy\"\n  | \"tv\"\n  | \"umbrella\"\n  | \"unlink\"\n  | \"videocam-off\"\n  | \"videocam\"\n  | \"volume-high\"\n  | \"volume-low\"\n  | \"volume-medium\"\n  | \"volume-mute\"\n  | \"volume-off\"\n  | \"walk\"\n  | \"wallet\"\n  | \"warning\"\n  | \"watch\"\n  | \"water\"\n  | \"wifi\"\n  | \"wine\"\n  | \"woman\"\n  | \"logo-alipay\"\n  | \"logo-amazon\"\n  | \"logo-amplify\"\n  | \"logo-android\"\n  | \"logo-angular\"\n  | \"logo-apple\"\n  | \"logo-apple-appstore\"\n  | \"logo-apple-ar\"\n  | \"logo-behance\"\n  | \"logo-bitbucket\"\n  | \"logo-bitcoin\"\n  | \"logo-buffer\"\n  | \"logo-capacitor\"\n  | \"logo-chrome\"\n  | \"logo-closed-captioning\"\n  | \"logo-codepen\"\n  | \"logo-css3\"\n  | \"logo-designernews\"\n  | \"logo-deviantart\"\n  | \"logo-discord\"\n  | \"logo-docker\"\n  | \"logo-dribbble\"\n  | \"logo-dropbox\"\n  | \"logo-edge\"\n  | \"logo-electron\"\n  | \"logo-euro\"\n  | \"logo-facebook\"\n  | \"logo-figma\"\n  | \"logo-firebase\"\n  | \"logo-firefox\"\n  | \"logo-flickr\"\n  | \"logo-foursquare\"\n  | \"logo-github\"\n  | \"logo-gitlab\"\n  | \"logo-google\"\n  | \"logo-google-playstore\"\n  | \"logo-hackernews\"\n  | \"logo-html5\"\n  | \"logo-instagram\"\n  | \"logo-ionic\"\n  | \"logo-ionitron\"\n  | \"logo-javascript\"\n  | \"logo-laravel\"\n  | \"logo-linkedin\"\n  | \"logo-markdown\"\n  | \"logo-mastodon\"\n  | \"logo-medium\"\n  | \"logo-microsoft\"\n  | \"logo-no-smoking\"\n  | \"logo-nodejs\"\n  | \"logo-npm\"\n  | \"logo-octocat\"\n  | \"logo-paypal\"\n  | \"logo-pinterest\"\n  | \"logo-playstation\"\n  | \"logo-pwa\"\n  | \"logo-python\"\n  | \"logo-react\"\n  | \"logo-reddit\"\n  | \"logo-rss\"\n  | \"logo-sass\"\n  | \"logo-skype\"\n  | \"logo-slack\"\n  | \"logo-snapchat\"\n  | \"logo-soundcloud\"\n  | \"logo-stackoverflow\"\n  | \"logo-steam\"\n  | \"logo-stencil\"\n  | \"logo-tableau\"\n  | \"logo-tiktok\"\n  | \"logo-tumblr\"\n  | \"logo-tux\"\n  | \"logo-twitch\"\n  | \"logo-twitter\"\n  | \"logo-usd\"\n  | \"logo-venmo\"\n  | \"logo-vercel\"\n  | \"logo-vimeo\"\n  | \"logo-vk\"\n  | \"logo-vue\"\n  | \"logo-web-component\"\n  | \"logo-wechat\"\n  | \"logo-whatsapp\"\n  | \"logo-windows\"\n  | \"logo-wordpress\"\n  | \"logo-xbox\"\n  | \"logo-xing\"\n  | \"logo-yahoo\"\n  | \"logo-yen\"\n  | \"logo-youtube\";\n\nexport type GoAIconSize = \"small\" | \"medium\" | \"large\" | \"xlarge\";\nexport type GoAIconVariant = \"primary\" | \"secondary\" | \"tertiary\";\nexport type GoAIconTheme = \"outline\" | \"filled\" | \"sharp\";\n\n// legacy naming\nexport type IconSize = GoAIconSize;\nexport type IconVariant = GoAIconVariant;\nexport type IconTheme = GoAIconTheme;\n\nexport interface GoAIconProps extends Margins {\n  type: GoAIconType;\n  size?: GoAIconSize;\n  theme?: GoAIconTheme;\n  inverted?: string;\n  fillColor?: string;\n  opacity?: number;\n  title?: string;\n  ariaLabel?: string;\n  testId?: string;\n}\n\ninterface WCProps extends Margins {\n  type: GoAIconType;\n  theme?: GoAIconTheme;\n  size?: GoAIconSize;\n  inverted?: string;\n  fillcolor?: string;\n  opacity?: number;\n  title?: string;\n  arialabel?: string;\n  testid?: string;\n}\n\nexport function GoAIcon({\n  type,\n  theme,\n  size,\n  inverted,\n  fillColor,\n  opacity,\n  title,\n  ariaLabel,\n  mt,\n  mr,\n  mb,\n  ml,\n  testId,\n}: GoAIconProps): JSX.Element {\n  return (\n    <goa-icon\n      type={type}\n      theme={theme}\n      size={size}\n      inverted={inverted}\n      fillcolor={fillColor}\n      opacity={opacity}\n      title={title}\n      arialabel={ariaLabel}\n      mt={mt}\n      mr={mr}\n      mb={mb}\n      ml={ml}\n      testid={testId}\n    />\n  );\n}\n"],"names":[],"mappings":";AA2jBO,SAAS,QAAQ;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA8B;AAE1B,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,IAAA;AAAA,EAAA;AAGd;"}