@abgov/react-components 6.5.0-alpha.1 → 6.5.0-alpha.3

package/experimental/form/form.d.ts

@@ -1,6 +1,5 @@
-import { Margins, GoabFormStorageType, GoabFormOnMountDetail, GoabFormOnStateChange } from '@abgov/ui-components-common';
 import { ReactNode } from 'react';
-
+import { Margins, GoabFormStorageType, GoabFormOnMountDetail, GoabFormOnStateChange } from '@abgov/ui-components-common';
 interface WCProps extends Margins {
     ref?: React.RefObject<HTMLElement | null>;
     name: string;

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

@@ -1,6 +1,5 @@
-import { Margins } from '@abgov/ui-components-common';
 import { ReactNode } from 'react';
-
+import { Margins } from '@abgov/ui-components-common';
 interface WCProps extends Margins {
     heading: string;
 }

package/experimental/form/task.d.ts

@@ -1,6 +1,5 @@
-import { Margins } from '@abgov/ui-components-common';
 import { ReactNode } from 'react';
-
+import { Margins } from '@abgov/ui-components-common';
 interface WCProps extends Margins {
     status: "completed" | "not-started" | "cannot-start";
 }

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

@@ -1,5 +1,4 @@
 import { ReactNode, JSX } from 'react';
-
 export type ResizableProps = {
     minWidth?: number;
     children: ReactNode;

package/experimental.js.map

@@ -1 +1 @@
-{"version":3,"file":"experimental.js","sources":["../../../libs/react-components/src/experimental/resizable-panel/ResizablePanel.tsx"],"sourcesContent":["import { ReactNode, useEffect, useRef, useState, type JSX } from \"react\";\nimport Css from \"./ResizablePanel.module.css\";\nimport { GoabIcon } 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  // 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  // value refs\n  const maxWidth = useRef<number>(0);\n  const resizeBarState = useRef<MouseState>(\"static\");\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          <GoabIcon 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"],"names":["useRef","width","useState","useEffect","jsxs","jsx","GoabIcon"],"mappings":";;;;;;;;;;;;;;;;;AAWO,SAAS,eAAe,OAAoC;AAE3D,QAAA,QAAQA,aAA8B,IAAI;AAC1C,QAAA,aAAaA,aAA2B,IAAI;AAC5C,QAAA,WAAWA,aAA8B,IAAI;AAC7C,QAAA,YAAYA,aAA8B,IAAI;AAG9C,QAAA,WAAWA,aAAe,CAAC;AAC3B,QAAA,iBAAiBA,aAAmB,QAAQ;AAGlD,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,UAAA,EAAS,MAAK,cAAA,CAAc,EAC/B,CAAA;AAAA,QAAA,GACF;AAAA,uCACC,OAAI,EAAA,KAAK,UAAU,WAAW,IAAI,OAChC,UACHL,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;;;"}
+{"version":3,"file":"experimental.js","sources":["../../../libs/react-components/src/experimental/resizable-panel/ResizablePanel.tsx"],"sourcesContent":["import { ReactNode, useEffect, useRef, useState, type JSX } from \"react\";\nimport Css from \"./ResizablePanel.module.css\";\nimport { GoabIcon } 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  // 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  // value refs\n  const maxWidth = useRef<number>(0);\n  const resizeBarState = useRef<MouseState>(\"static\");\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          <GoabIcon 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"],"names":["useRef","width","useState","useEffect","jsxs","jsx","GoabIcon"],"mappings":";;;;;;;;;;;;;;;;;AAWO,SAAS,eAAe,OAAoC;AAE3D,QAAA,QAAQA,aAA8B,IAAI;AAC1C,QAAA,aAAaA,aAA2B,IAAI;AAC5C,QAAA,WAAWA,aAA8B,IAAI;AAC7C,QAAA,YAAYA,aAA8B,IAAI;AAG9C,QAAA,WAAWA,aAAe,CAAC;AAC3B,QAAA,iBAAiBA,aAAmB,QAAQ;AAGlD,QAAM,CAACC,QAAO,QAAQ,IAAIC,eAAiB;AAE3CC,QAAAA,UAAU,MAAM;;AACd,aAAS,YAAU,WAAM,YAAN,mBAAe,wBAAwB,UAAS;AAAA,EACrE,GAAG,EAAE;AAEL,WAAS,kBAAkB;AACzB,mBAAe,UAAU;AAAA,EAAA;AAG3B,WAAS,YAAY,GAAqB;AACxC,mBAAe,UAAU;AAClB,WAAA,iBAAiB,WAAW,eAAe;AAAA,EAAA;AAGpD,WAAS,UAAU,GAAqB;AACtC,mBAAe,UAAU;AAClB,WAAA,oBAAoB,WAAW,eAAe;AAAA,EAAA;AAGvD,WAAS,YAAY,GAAqB;;AACpC,QAAA,eAAe,YAAY,UAAU;AACvC;AAAA,IAAA;AAGF,UAAM,YAAY,WAAW;AAC7B,UAAM,WAAU,uCAAW,wBAAwB,MAAK;AACxD,UAAM,SAAS,EAAE;AACX,UAAA,WAAW,MAAM,YAAY;AAEnC,QAAI,UAAU,GAAG;AACf;AAAA,IAAA;AAIF,UAAM,YAAU,eAAU,YAAV,mBAAmB,wBAAwB,MAAK;AAGhE,UAAM,YAAY,KAAK;AAAA,MACrB,UAAU;AAAA,MACV,KAAK,IAAI,SAAS,SAAS,SAAS,OAAO;AAAA,IAC7C;AACA,UAAM,eAAe,KAAK,IAAI,UAAU,YAAY,EAAE;AAGtD,QAAI,gBAAgB,UAAU;AAC5B;AAAA,IAAA;AAIF,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,EAAA;AAIxC,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,2BAAAA,IAAC,OAAI,EAAA,KAAK,WAAW,WAAW,IAAI,QAClC,UAACA,2BAAA,IAAAC,KAAA,UAAA,EAAS,MAAK,cAAc,CAAA,EAC/B,CAAA;AAAA,QAAA,GACF;AAAA,uCACC,OAAI,EAAA,KAAK,UAAU,WAAW,IAAI,OAChC,UACHL,OAAA,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACF;AAEJ;;;"}

package/experimental.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"experimental.mjs","sources":["../../../libs/react-components/src/experimental/resizable-panel/ResizablePanel.tsx"],"sourcesContent":["import { ReactNode, useEffect, useRef, useState, type JSX } from \"react\";\nimport Css from \"./ResizablePanel.module.css\";\nimport { GoabIcon } 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  // 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  // value refs\n  const maxWidth = useRef<number>(0);\n  const resizeBarState = useRef<MouseState>(\"static\");\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          <GoabIcon 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"],"names":["width"],"mappings":";;;;;;;;;;;;;;;;AAWO,SAAS,eAAe,OAAoC;AAE3D,QAAA,QAAQ,OAA8B,IAAI;AAC1C,QAAA,aAAa,OAA2B,IAAI;AAC5C,QAAA,WAAW,OAA8B,IAAI;AAC7C,QAAA,YAAY,OAA8B,IAAI;AAG9C,QAAA,WAAW,OAAe,CAAC;AAC3B,QAAA,iBAAiB,OAAmB,QAAQ;AAGlD,QAAM,CAACA,QAAO,QAAQ,IAAI,SAAiB;AAE3C,YAAU,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,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAW,IAAI;AAAA,MACf;AAAA,MACA;AAAA,MACA;AAAA,MAEA,UAAA;AAAA,QAAA,qBAAC,WAAQ,EAAA,KAAK,YAAY,WAAW,IAAI,OACvC,UAAA;AAAA,UAAA,oBAAC,OAAI,EAAA,WAAW,IAAI,UAAW,gBAAM,UAAS;AAAA,UAC9C,oBAAC,OAAI,EAAA,KAAK,WAAW,WAAW,IAAI,QAClC,UAAC,oBAAA,UAAA,EAAS,MAAK,cAAA,CAAc,EAC/B,CAAA;AAAA,QAAA,GACF;AAAA,4BACC,OAAI,EAAA,KAAK,UAAU,WAAW,IAAI,OAChC,UACHA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"experimental.mjs","sources":["../../../libs/react-components/src/experimental/resizable-panel/ResizablePanel.tsx"],"sourcesContent":["import { ReactNode, useEffect, useRef, useState, type JSX } from \"react\";\nimport Css from \"./ResizablePanel.module.css\";\nimport { GoabIcon } 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  // 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  // value refs\n  const maxWidth = useRef<number>(0);\n  const resizeBarState = useRef<MouseState>(\"static\");\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          <GoabIcon 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"],"names":["width"],"mappings":";;;;;;;;;;;;;;;;AAWO,SAAS,eAAe,OAAoC;AAE3D,QAAA,QAAQ,OAA8B,IAAI;AAC1C,QAAA,aAAa,OAA2B,IAAI;AAC5C,QAAA,WAAW,OAA8B,IAAI;AAC7C,QAAA,YAAY,OAA8B,IAAI;AAG9C,QAAA,WAAW,OAAe,CAAC;AAC3B,QAAA,iBAAiB,OAAmB,QAAQ;AAGlD,QAAM,CAACA,QAAO,QAAQ,IAAI,SAAiB;AAE3C,YAAU,MAAM;;AACd,aAAS,YAAU,WAAM,YAAN,mBAAe,wBAAwB,UAAS;AAAA,EACrE,GAAG,EAAE;AAEL,WAAS,kBAAkB;AACzB,mBAAe,UAAU;AAAA,EAAA;AAG3B,WAAS,YAAY,GAAqB;AACxC,mBAAe,UAAU;AAClB,WAAA,iBAAiB,WAAW,eAAe;AAAA,EAAA;AAGpD,WAAS,UAAU,GAAqB;AACtC,mBAAe,UAAU;AAClB,WAAA,oBAAoB,WAAW,eAAe;AAAA,EAAA;AAGvD,WAAS,YAAY,GAAqB;;AACpC,QAAA,eAAe,YAAY,UAAU;AACvC;AAAA,IAAA;AAGF,UAAM,YAAY,WAAW;AAC7B,UAAM,WAAU,uCAAW,wBAAwB,MAAK;AACxD,UAAM,SAAS,EAAE;AACX,UAAA,WAAW,MAAM,YAAY;AAEnC,QAAI,UAAU,GAAG;AACf;AAAA,IAAA;AAIF,UAAM,YAAU,eAAU,YAAV,mBAAmB,wBAAwB,MAAK;AAGhE,UAAM,YAAY,KAAK;AAAA,MACrB,UAAU;AAAA,MACV,KAAK,IAAI,SAAS,SAAS,SAAS,OAAO;AAAA,IAC7C;AACA,UAAM,eAAe,KAAK,IAAI,UAAU,YAAY,EAAE;AAGtD,QAAI,gBAAgB,UAAU;AAC5B;AAAA,IAAA;AAIF,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,EAAA;AAIxC,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAW,IAAI;AAAA,MACf;AAAA,MACA;AAAA,MACA;AAAA,MAEA,UAAA;AAAA,QAAA,qBAAC,WAAQ,EAAA,KAAK,YAAY,WAAW,IAAI,OACvC,UAAA;AAAA,UAAA,oBAAC,OAAI,EAAA,WAAW,IAAI,UAAW,gBAAM,UAAS;AAAA,UAC9C,oBAAC,OAAI,EAAA,KAAK,WAAW,WAAW,IAAI,QAClC,UAAC,oBAAA,UAAA,EAAS,MAAK,cAAc,CAAA,EAC/B,CAAA;AAAA,QAAA,GACF;AAAA,4BACC,OAAI,EAAA,KAAK,UAAU,WAAW,IAAI,OAChC,UACHA,OAAA,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACF;AAEJ;"}

package/icon-CK55b563.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon-CK55b563.js","sources":["../../../libs/react-components/src/lib/drawer/drawer.tsx","../../../libs/react-components/src/lib/icon/icon.tsx"],"sourcesContent":["import { ReactNode, useEffect, useRef, type JSX } from \"react\";\nimport { GoabDrawerPosition, GoabDrawerSize } from \"@abgov/ui-components-common\";\n\ninterface WCProps {\n  position: GoabDrawerPosition;\n  open?: boolean;\n  heading?: string;\n  maxsize?: GoabDrawerSize;\n  testid?: string;\n  ref: React.RefObject<HTMLElement | null>;\n}\n\ndeclare module \"react\" {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      \"goa-drawer\": WCProps & React.HTMLAttributes<HTMLElement>;\n    }\n  }\n}\n\nexport interface GoabDrawerProps {\n  position: GoabDrawerPosition;\n  open?: boolean;\n  heading?: string | ReactNode;\n  maxSize?: GoabDrawerSize;\n  testId?: string;\n  actions?: ReactNode;\n  children: ReactNode;\n  onClose: () => void;\n}\n\nexport function GoabDrawer({\n  position,\n  open,\n  heading,\n  maxSize,\n  testId,\n  actions,\n  children,\n  onClose,\n}: GoabDrawerProps): 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      position={position}\n      open={open ? true : undefined}\n      heading={typeof heading === \"string\" ? heading : undefined}\n      maxsize={maxSize}\n      testid={testId}\n    >\n      {heading && typeof heading !== \"string\" && <div slot=\"heading\">{heading}</div>}\n      {actions && <div slot=\"actions\">{actions}</div>}\n      {children}\n    </goa-drawer>\n  );\n}\n\nexport default GoabDrawer;\n","import {\n  GoabIconFilledType,\n  GoabIconSize,\n  GoabIconTheme,\n  GoabIconType,\n  Margins,\n} from \"@abgov/ui-components-common\";\n\nimport type { JSX } from \"react\";\n\ninterface IonIconProps {\n  name: GoabIconType | GoabIconFilledType;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\ninterface IonIconElement extends HTMLElement {}\n\ndeclare module \"react\" {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      \"ion-icon\": IonIconProps & React.HTMLAttributes<IonIconElement>;\n    }\n  }\n}\n\ndeclare module \"react\" {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      \"goa-icon\": WCProps & React.HTMLAttributes<IonIconElement>;\n    }\n  }\n}\n\nexport interface GoabIconProps extends Margins {\n  type: GoabIconType;\n  size?: GoabIconSize;\n  theme?: GoabIconTheme;\n  inverted?: string | boolean; // TODO: Change type to only boolean\n  fillColor?: string;\n  opacity?: number;\n  title?: string;\n  ariaLabel?: string;\n  testId?: string;\n}\n\ninterface WCProps extends Margins {\n  type: GoabIconType;\n  theme?: GoabIconTheme;\n  size?: GoabIconSize;\n  inverted?: string;\n  fillcolor?: string;\n  opacity?: number;\n  title?: string;\n  arialabel?: string;\n  testid?: string;\n}\n\nexport function GoabIcon({\n  type,\n  theme,\n  size,\n  inverted, // TODO: change to boolean only\n  fillColor,\n  opacity,\n  title,\n  ariaLabel,\n  mt,\n  mr,\n  mb,\n  ml,\n  testId,\n}: GoabIconProps): JSX.Element {\n  return (\n    <goa-icon\n      type={type}\n      theme={theme}\n      size={size}\n      inverted={\n        typeof inverted === \"boolean\" ? (inverted ? \"true\" : undefined) : inverted\n      }\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":["useRef","useEffect","_a","jsxs","jsx"],"mappings":";;;AAgCO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAiC;AACzB,QAAA,KAAKA,aAAoB,IAAI;AAEnCC,QAAAA,UAAU,MAAM;;AACd,QAAI,EAAC,yBAAI,YAAW,CAAC,SAAS;AAC5B;AAAA,IACF;AACG,aAAA,YAAA,mBAAS,iBAAiB,UAAU;AACvC,WAAO,MAAM;;AACR,OAAAC,MAAA,GAAA,YAAA,gBAAAA,IAAS,oBAAoB,UAAU;AAAA,IAAO;AAAA,EACnD,GACC,CAAC,IAAI,OAAO,CAAC;AAGd,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL;AAAA,MACA,MAAM,OAAO,OAAO;AAAA,MACpB,SAAS,OAAO,YAAY,WAAW,UAAU;AAAA,MACjD,SAAS;AAAA,MACT,QAAQ;AAAA,MAEP,UAAA;AAAA,QAAA,WAAW,OAAO,YAAY,2CAAa,OAAI,EAAA,MAAK,WAAW,UAAQ,SAAA;AAAA,QACvE,WAAWC,2BAAA,IAAC,OAAI,EAAA,MAAK,WAAW,UAAQ,SAAA;AAAA,QACxC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGP;ACTO,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA+B;AAE3B,SAAAA,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,UACE,OAAO,aAAa,YAAa,WAAW,SAAS,SAAa;AAAA,MAEpE,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,IAAA;AAAA,EAAA;AAGd;;;"}
+{"version":3,"file":"icon-CK55b563.js","sources":["../../../libs/react-components/src/lib/drawer/drawer.tsx","../../../libs/react-components/src/lib/icon/icon.tsx"],"sourcesContent":["import { ReactNode, useEffect, useRef, type JSX } from \"react\";\nimport { GoabDrawerPosition, GoabDrawerSize } from \"@abgov/ui-components-common\";\n\ninterface WCProps {\n  position: GoabDrawerPosition;\n  open?: boolean;\n  heading?: string;\n  maxsize?: GoabDrawerSize;\n  testid?: string;\n  ref: React.RefObject<HTMLElement | null>;\n}\n\ndeclare module \"react\" {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      \"goa-drawer\": WCProps & React.HTMLAttributes<HTMLElement>;\n    }\n  }\n}\n\nexport interface GoabDrawerProps {\n  position: GoabDrawerPosition;\n  open?: boolean;\n  heading?: string | ReactNode;\n  maxSize?: GoabDrawerSize;\n  testId?: string;\n  actions?: ReactNode;\n  children: ReactNode;\n  onClose: () => void;\n}\n\nexport function GoabDrawer({\n  position,\n  open,\n  heading,\n  maxSize,\n  testId,\n  actions,\n  children,\n  onClose,\n}: GoabDrawerProps): 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      position={position}\n      open={open ? true : undefined}\n      heading={typeof heading === \"string\" ? heading : undefined}\n      maxsize={maxSize}\n      testid={testId}\n    >\n      {heading && typeof heading !== \"string\" && <div slot=\"heading\">{heading}</div>}\n      {actions && <div slot=\"actions\">{actions}</div>}\n      {children}\n    </goa-drawer>\n  );\n}\n\nexport default GoabDrawer;\n","import {\n  GoabIconFilledType,\n  GoabIconSize,\n  GoabIconTheme,\n  GoabIconType,\n  Margins,\n} from \"@abgov/ui-components-common\";\n\nimport type { JSX } from \"react\";\n\ninterface IonIconProps {\n  name: GoabIconType | GoabIconFilledType;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\ninterface IonIconElement extends HTMLElement {}\n\ndeclare module \"react\" {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      \"ion-icon\": IonIconProps & React.HTMLAttributes<IonIconElement>;\n    }\n  }\n}\n\ndeclare module \"react\" {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      \"goa-icon\": WCProps & React.HTMLAttributes<IonIconElement>;\n    }\n  }\n}\n\nexport interface GoabIconProps extends Margins {\n  type: GoabIconType;\n  size?: GoabIconSize;\n  theme?: GoabIconTheme;\n  inverted?: string | boolean; // TODO: Change type to only boolean\n  fillColor?: string;\n  opacity?: number;\n  title?: string;\n  ariaLabel?: string;\n  testId?: string;\n}\n\ninterface WCProps extends Margins {\n  type: GoabIconType;\n  theme?: GoabIconTheme;\n  size?: GoabIconSize;\n  inverted?: string;\n  fillcolor?: string;\n  opacity?: number;\n  title?: string;\n  arialabel?: string;\n  testid?: string;\n}\n\nexport function GoabIcon({\n  type,\n  theme,\n  size,\n  inverted, // TODO: change to boolean only\n  fillColor,\n  opacity,\n  title,\n  ariaLabel,\n  mt,\n  mr,\n  mb,\n  ml,\n  testId,\n}: GoabIconProps): JSX.Element {\n  return (\n    <goa-icon\n      type={type}\n      theme={theme}\n      size={size}\n      inverted={\n        typeof inverted === \"boolean\" ? (inverted ? \"true\" : undefined) : inverted\n      }\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":["useRef","useEffect","_a","jsxs","jsx"],"mappings":";;;AAgCO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAiC;AACzB,QAAA,KAAKA,aAAoB,IAAI;AAEnCC,QAAAA,UAAU,MAAM;;AACd,QAAI,EAAC,yBAAI,YAAW,CAAC,SAAS;AAC5B;AAAA,IAAA;AAEC,aAAA,YAAA,mBAAS,iBAAiB,UAAU;AACvC,WAAO,MAAM;;AACR,OAAAC,MAAA,GAAA,YAAA,gBAAAA,IAAS,oBAAoB,UAAU;AAAA,IAC5C;AAAA,EAAA,GACC,CAAC,IAAI,OAAO,CAAC;AAGd,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL;AAAA,MACA,MAAM,OAAO,OAAO;AAAA,MACpB,SAAS,OAAO,YAAY,WAAW,UAAU;AAAA,MACjD,SAAS;AAAA,MACT,QAAQ;AAAA,MAEP,UAAA;AAAA,QAAA,WAAW,OAAO,YAAY,2CAAa,OAAI,EAAA,MAAK,WAAW,UAAQ,SAAA;AAAA,QACvE,WAAWC,2BAAA,IAAC,OAAI,EAAA,MAAK,WAAW,UAAQ,SAAA;AAAA,QACxC;AAAA,MAAA;AAAA,IAAA;AAAA,EACH;AAEJ;ACTO,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA+B;AAE3B,SAAAA,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,UACE,OAAO,aAAa,YAAa,WAAW,SAAS,SAAa;AAAA,MAEpE,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,IAAA;AAAA,EACV;AAEJ;;;"}

package/icon-CoYGOp1V.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"icon-CoYGOp1V.mjs","sources":["../../../libs/react-components/src/lib/drawer/drawer.tsx","../../../libs/react-components/src/lib/icon/icon.tsx"],"sourcesContent":["import { ReactNode, useEffect, useRef, type JSX } from \"react\";\nimport { GoabDrawerPosition, GoabDrawerSize } from \"@abgov/ui-components-common\";\n\ninterface WCProps {\n  position: GoabDrawerPosition;\n  open?: boolean;\n  heading?: string;\n  maxsize?: GoabDrawerSize;\n  testid?: string;\n  ref: React.RefObject<HTMLElement | null>;\n}\n\ndeclare module \"react\" {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      \"goa-drawer\": WCProps & React.HTMLAttributes<HTMLElement>;\n    }\n  }\n}\n\nexport interface GoabDrawerProps {\n  position: GoabDrawerPosition;\n  open?: boolean;\n  heading?: string | ReactNode;\n  maxSize?: GoabDrawerSize;\n  testId?: string;\n  actions?: ReactNode;\n  children: ReactNode;\n  onClose: () => void;\n}\n\nexport function GoabDrawer({\n  position,\n  open,\n  heading,\n  maxSize,\n  testId,\n  actions,\n  children,\n  onClose,\n}: GoabDrawerProps): 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      position={position}\n      open={open ? true : undefined}\n      heading={typeof heading === \"string\" ? heading : undefined}\n      maxsize={maxSize}\n      testid={testId}\n    >\n      {heading && typeof heading !== \"string\" && <div slot=\"heading\">{heading}</div>}\n      {actions && <div slot=\"actions\">{actions}</div>}\n      {children}\n    </goa-drawer>\n  );\n}\n\nexport default GoabDrawer;\n","import {\n  GoabIconFilledType,\n  GoabIconSize,\n  GoabIconTheme,\n  GoabIconType,\n  Margins,\n} from \"@abgov/ui-components-common\";\n\nimport type { JSX } from \"react\";\n\ninterface IonIconProps {\n  name: GoabIconType | GoabIconFilledType;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\ninterface IonIconElement extends HTMLElement {}\n\ndeclare module \"react\" {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      \"ion-icon\": IonIconProps & React.HTMLAttributes<IonIconElement>;\n    }\n  }\n}\n\ndeclare module \"react\" {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      \"goa-icon\": WCProps & React.HTMLAttributes<IonIconElement>;\n    }\n  }\n}\n\nexport interface GoabIconProps extends Margins {\n  type: GoabIconType;\n  size?: GoabIconSize;\n  theme?: GoabIconTheme;\n  inverted?: string | boolean; // TODO: Change type to only boolean\n  fillColor?: string;\n  opacity?: number;\n  title?: string;\n  ariaLabel?: string;\n  testId?: string;\n}\n\ninterface WCProps extends Margins {\n  type: GoabIconType;\n  theme?: GoabIconTheme;\n  size?: GoabIconSize;\n  inverted?: string;\n  fillcolor?: string;\n  opacity?: number;\n  title?: string;\n  arialabel?: string;\n  testid?: string;\n}\n\nexport function GoabIcon({\n  type,\n  theme,\n  size,\n  inverted, // TODO: change to boolean only\n  fillColor,\n  opacity,\n  title,\n  ariaLabel,\n  mt,\n  mr,\n  mb,\n  ml,\n  testId,\n}: GoabIconProps): JSX.Element {\n  return (\n    <goa-icon\n      type={type}\n      theme={theme}\n      size={size}\n      inverted={\n        typeof inverted === \"boolean\" ? (inverted ? \"true\" : undefined) : inverted\n      }\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":["_a"],"mappings":";;AAgCO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAiC;AACzB,QAAA,KAAK,OAAoB,IAAI;AAEnC,YAAU,MAAM;;AACd,QAAI,EAAC,yBAAI,YAAW,CAAC,SAAS;AAC5B;AAAA,IACF;AACG,aAAA,YAAA,mBAAS,iBAAiB,UAAU;AACvC,WAAO,MAAM;;AACR,OAAAA,MAAA,GAAA,YAAA,gBAAAA,IAAS,oBAAoB,UAAU;AAAA,IAAO;AAAA,EACnD,GACC,CAAC,IAAI,OAAO,CAAC;AAGd,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL;AAAA,MACA,MAAM,OAAO,OAAO;AAAA,MACpB,SAAS,OAAO,YAAY,WAAW,UAAU;AAAA,MACjD,SAAS;AAAA,MACT,QAAQ;AAAA,MAEP,UAAA;AAAA,QAAA,WAAW,OAAO,YAAY,gCAAa,OAAI,EAAA,MAAK,WAAW,UAAQ,SAAA;AAAA,QACvE,WAAW,oBAAC,OAAI,EAAA,MAAK,WAAW,UAAQ,SAAA;AAAA,QACxC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGP;ACTO,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA+B;AAE3B,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,UACE,OAAO,aAAa,YAAa,WAAW,SAAS,SAAa;AAAA,MAEpE,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,IAAA;AAAA,EAAA;AAGd;"}
+{"version":3,"file":"icon-CoYGOp1V.mjs","sources":["../../../libs/react-components/src/lib/drawer/drawer.tsx","../../../libs/react-components/src/lib/icon/icon.tsx"],"sourcesContent":["import { ReactNode, useEffect, useRef, type JSX } from \"react\";\nimport { GoabDrawerPosition, GoabDrawerSize } from \"@abgov/ui-components-common\";\n\ninterface WCProps {\n  position: GoabDrawerPosition;\n  open?: boolean;\n  heading?: string;\n  maxsize?: GoabDrawerSize;\n  testid?: string;\n  ref: React.RefObject<HTMLElement | null>;\n}\n\ndeclare module \"react\" {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      \"goa-drawer\": WCProps & React.HTMLAttributes<HTMLElement>;\n    }\n  }\n}\n\nexport interface GoabDrawerProps {\n  position: GoabDrawerPosition;\n  open?: boolean;\n  heading?: string | ReactNode;\n  maxSize?: GoabDrawerSize;\n  testId?: string;\n  actions?: ReactNode;\n  children: ReactNode;\n  onClose: () => void;\n}\n\nexport function GoabDrawer({\n  position,\n  open,\n  heading,\n  maxSize,\n  testId,\n  actions,\n  children,\n  onClose,\n}: GoabDrawerProps): 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      position={position}\n      open={open ? true : undefined}\n      heading={typeof heading === \"string\" ? heading : undefined}\n      maxsize={maxSize}\n      testid={testId}\n    >\n      {heading && typeof heading !== \"string\" && <div slot=\"heading\">{heading}</div>}\n      {actions && <div slot=\"actions\">{actions}</div>}\n      {children}\n    </goa-drawer>\n  );\n}\n\nexport default GoabDrawer;\n","import {\n  GoabIconFilledType,\n  GoabIconSize,\n  GoabIconTheme,\n  GoabIconType,\n  Margins,\n} from \"@abgov/ui-components-common\";\n\nimport type { JSX } from \"react\";\n\ninterface IonIconProps {\n  name: GoabIconType | GoabIconFilledType;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\ninterface IonIconElement extends HTMLElement {}\n\ndeclare module \"react\" {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      \"ion-icon\": IonIconProps & React.HTMLAttributes<IonIconElement>;\n    }\n  }\n}\n\ndeclare module \"react\" {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      \"goa-icon\": WCProps & React.HTMLAttributes<IonIconElement>;\n    }\n  }\n}\n\nexport interface GoabIconProps extends Margins {\n  type: GoabIconType;\n  size?: GoabIconSize;\n  theme?: GoabIconTheme;\n  inverted?: string | boolean; // TODO: Change type to only boolean\n  fillColor?: string;\n  opacity?: number;\n  title?: string;\n  ariaLabel?: string;\n  testId?: string;\n}\n\ninterface WCProps extends Margins {\n  type: GoabIconType;\n  theme?: GoabIconTheme;\n  size?: GoabIconSize;\n  inverted?: string;\n  fillcolor?: string;\n  opacity?: number;\n  title?: string;\n  arialabel?: string;\n  testid?: string;\n}\n\nexport function GoabIcon({\n  type,\n  theme,\n  size,\n  inverted, // TODO: change to boolean only\n  fillColor,\n  opacity,\n  title,\n  ariaLabel,\n  mt,\n  mr,\n  mb,\n  ml,\n  testId,\n}: GoabIconProps): JSX.Element {\n  return (\n    <goa-icon\n      type={type}\n      theme={theme}\n      size={size}\n      inverted={\n        typeof inverted === \"boolean\" ? (inverted ? \"true\" : undefined) : inverted\n      }\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":["_a"],"mappings":";;AAgCO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAiC;AACzB,QAAA,KAAK,OAAoB,IAAI;AAEnC,YAAU,MAAM;;AACd,QAAI,EAAC,yBAAI,YAAW,CAAC,SAAS;AAC5B;AAAA,IAAA;AAEC,aAAA,YAAA,mBAAS,iBAAiB,UAAU;AACvC,WAAO,MAAM;;AACR,OAAAA,MAAA,GAAA,YAAA,gBAAAA,IAAS,oBAAoB,UAAU;AAAA,IAC5C;AAAA,EAAA,GACC,CAAC,IAAI,OAAO,CAAC;AAGd,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL;AAAA,MACA,MAAM,OAAO,OAAO;AAAA,MACpB,SAAS,OAAO,YAAY,WAAW,UAAU;AAAA,MACjD,SAAS;AAAA,MACT,QAAQ;AAAA,MAEP,UAAA;AAAA,QAAA,WAAW,OAAO,YAAY,gCAAa,OAAI,EAAA,MAAK,WAAW,UAAQ,SAAA;AAAA,QACvE,WAAW,oBAAC,OAAI,EAAA,MAAK,WAAW,UAAQ,SAAA;AAAA,QACxC;AAAA,MAAA;AAAA,IAAA;AAAA,EACH;AAEJ;ACTO,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA+B;AAE3B,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,UACE,OAAO,aAAa,YAAa,WAAW,SAAS,SAAa;AAAA,MAEpE,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,IAAA;AAAA,EACV;AAEJ;"}

package/index.js

@@ -414,6 +414,8 @@ function GoabCheckbox({
   value,
   text,
   description,
+  reveal,
+  revealAriaLabel,
   maxWidth,
   children,
   onChange,
@@ -451,6 +453,7 @@ function GoabCheckbox({
       text,
       value: typeof value === "boolean" ? value ? "true" : void 0 : value,
       arialabel: ariaLabel,
+      revealarialabel: revealAriaLabel,
       description: typeof description === "string" ? description : void 0,
       maxwidth: maxWidth,
       mt,
@@ -458,8 +461,9 @@ function GoabCheckbox({
       mb,
       ml,
       children: [
-        description && typeof description !== "string" && /* @__PURE__ */ jsxRuntime.jsx("div", { slot: "description", children: description }),
-        children
+        children,
+        typeof description !== "string" && description && /* @__PURE__ */ jsxRuntime.jsx("div", { slot: "description", children: description }),
+        reveal && /* @__PURE__ */ jsxRuntime.jsx("div", { slot: "reveal", children: reveal })
       ]
     }
   );
@@ -575,6 +579,7 @@ function GoabDatePicker({
   max,
   testId,
   disabled,
+  type,
   mt,
   mr,
   mb,
@@ -590,11 +595,15 @@ function GoabDatePicker({
     const current = ref.current;
     const handleChange = (e) => {
       const detail = e.detail;
-      onChange(detail);
+      onChange == null ? void 0 : onChange(detail);
     };
-    current.addEventListener("_change", handleChange);
+    if (onChange) {
+      current.addEventListener("_change", handleChange);
+    }
     return () => {
-      current.removeEventListener("_change", handleChange);
+      if (onChange) {
+        current.removeEventListener("_change", handleChange);
+      }
     };
   }, [onChange]);
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -603,6 +612,7 @@ function GoabDatePicker({
       ref,
       name,
       value: (value == null ? void 0 : value.toISOString()) || "",
+      type,
       error: error ? "true" : void 0,
       disabled: disabled ? "true" : void 0,
       min: min == null ? void 0 : min.toISOString(),
@@ -892,11 +902,10 @@ function GoabPublicFormPage({
     if (!ref.current) return;
     const current = ref.current;
     const continueListener = (e) => {
-      const detail = e.detail;
-      onContinue == null ? void 0 : onContinue(detail);
+      onContinue == null ? void 0 : onContinue(e);
     };
-    const backListener = () => {
-      onBack == null ? void 0 : onBack();
+    const backListener = (e) => {
+      onBack == null ? void 0 : onBack(e);
     };
     const fieldsetChangeListener = (e) => {
       const detail = e.detail;
@@ -982,10 +991,7 @@ function GoabPublicForm({
     if (!ref.current) return;
     const current = ref.current;
     const initListener = (e) => {
-      const detail = e.detail;
-      if (detail == null ? void 0 : detail.el) {
-        onInit == null ? void 0 : onInit(detail);
-      }
+      onInit == null ? void 0 : onInit(e);
     };
     if (onInit && !initialized.current) {
       current.addEventListener("_init", initListener);
@@ -1932,8 +1938,6 @@ const lightFormatters = {
   }
 };
 const dayPeriodEnum = {
-  am: "am",
-  pm: "pm",
   midnight: "midnight",
   noon: "noon",
   morning: "morning",
@@ -2855,6 +2859,7 @@ function GoabInput({
   trailingContent,
   maxLength,
   trailingIconAriaLabel,
+  textAlign = "left",
   onTrailingIconClick,
   onChange,
   onFocus,
@@ -2932,6 +2937,7 @@ function GoabInput({
       ml,
       handletrailingiconclick: onTrailingIconClick ? "true" : "false",
       trailingiconarialabel: trailingIconAriaLabel,
+      textalign: textAlign,
       children: [
         leadingContent && /* @__PURE__ */ jsxRuntime.jsx("div", { slot: "leadingContent", children: leadingContent }),
         trailingContent && /* @__PURE__ */ jsxRuntime.jsx("div", { slot: "trailingContent", children: trailingContent })
@@ -3066,6 +3072,7 @@ function GoabInputNumber({
   min = Number.MIN_VALUE,
   max = Number.MAX_VALUE,
   value,
+  textAlign = "right",
   ...props
 }) {
   const onNumberChange = ({ name, value: value2 }) => {
@@ -3095,7 +3102,8 @@ function GoabInputNumber({
       onFocus,
       onBlur,
       type: "number",
-      onKeyPress
+      onKeyPress,
+      textAlign
     }
   );
 }
@@ -3347,6 +3355,8 @@ function GoabRadioItem({
   label,
   value,
   description,
+  reveal,
+  revealAriaLabel,
   maxWidth,
   disabled,
   checked,
@@ -3370,12 +3380,14 @@ function GoabRadioItem({
       disabled: disabled ? "true" : void 0,
       checked: checked ? "true" : void 0,
       arialabel: ariaLabel,
+      revealarialabel: revealAriaLabel,
       mt,
       mr,
       mb,
       ml,
       children: [
         description && typeof description !== "string" && /* @__PURE__ */ jsxRuntime.jsx("div", { slot: "description", children: description }),
+        reveal && /* @__PURE__ */ jsxRuntime.jsx("div", { slot: "reveal", children: reveal }),
         children
       ]
     }