@gusto/embedded-react-sdk 0.47.0 → 0.47.1

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # Changelog
 
+## [0.47.1](https://github.com/Gusto/embedded-react-sdk/compare/v0.47.0...v0.47.1) (2026-06-09)
+
+### Features & Enhancements
+
+- add create-design-prototype skill ([#2062](https://github.com/Gusto/embedded-react-sdk/issues/2062)) ([6618bfe](https://github.com/Gusto/embedded-react-sdk/commit/6618bfe44a1422706ad251c1674f09c0b546f368))
+- re-export onboarding status constants from public entry ([#2080](https://github.com/Gusto/embedded-react-sdk/issues/2080)) ([64edd32](https://github.com/Gusto/embedded-react-sdk/commit/64edd323f2703a58bf58e61404cf2051c4c6caa6))
+
+### Fixes
+
+- tighten federal taxes form field spacing ([#2063](https://github.com/Gusto/embedded-react-sdk/issues/2063)) ([8644bee](https://github.com/Gusto/embedded-react-sdk/commit/8644bee5d7be93f472201f1066147b6490c1bf3c))
+
+### Chores & Maintenance
+
+- **deps-dev:** bump @microsoft/api-extractor from 7.58.7 to 7.58.8 ([#2070](https://github.com/Gusto/embedded-react-sdk/issues/2070)) ([e8153e5](https://github.com/Gusto/embedded-react-sdk/commit/e8153e53fb8597be925e35ccf90f9332b4c71fa8))
+- **deps-dev:** bump @storybook/addon-docs from 10.4.1 to 10.4.2 ([#2071](https://github.com/Gusto/embedded-react-sdk/issues/2071)) ([1321422](https://github.com/Gusto/embedded-react-sdk/commit/132142240b23631601bc5da9edb6157fafa903fe))
+- **deps-dev:** bump @typescript-eslint/rule-tester from 8.60.1 to 8.61.0 ([#2074](https://github.com/Gusto/embedded-react-sdk/issues/2074)) ([5ea4631](https://github.com/Gusto/embedded-react-sdk/commit/5ea463124eca514a514a44845d4583c1896daa06))
+- **deps-dev:** bump @typescript-eslint/utils from 8.60.1 to 8.61.0 ([#2072](https://github.com/Gusto/embedded-react-sdk/issues/2072)) ([69080d8](https://github.com/Gusto/embedded-react-sdk/commit/69080d883513c5485883635ac39df957d3ce2d43))
+- **deps-dev:** bump shell-quote from 1.8.3 to 1.8.4 in the npm_and_yarn group across 1 directory ([#2075](https://github.com/Gusto/embedded-react-sdk/issues/2075)) ([d8b3a5b](https://github.com/Gusto/embedded-react-sdk/commit/d8b3a5bc12ba829664f58a6e2aaad209ac27e042))
+- **deps-dev:** bump typescript-eslint from 8.60.1 to 8.61.0 ([#2073](https://github.com/Gusto/embedded-react-sdk/issues/2073)) ([0f58397](https://github.com/Gusto/embedded-react-sdk/commit/0f58397965ecbceb74cc4785d2ea415ce0c42f73))
+- move EmployeeDocuments export from EmployeeManagement to EmployeeOnboarding ([#2065](https://github.com/Gusto/embedded-react-sdk/issues/2065)) ([d07bd90](https://github.com/Gusto/embedded-react-sdk/commit/d07bd90b8d5e120d540d7e22a30d3717011b2ad0))
+- **SDK-1010:** backfill phase 5 ([#2061](https://github.com/Gusto/embedded-react-sdk/issues/2061)) ([2a02b30](https://github.com/Gusto/embedded-react-sdk/commit/2a02b30597c37f846576a617330f7e84f7273909))
+- **SDK-1011:** backfill phase 6 ([#2064](https://github.com/Gusto/embedded-react-sdk/issues/2064)) ([7d8a165](https://github.com/Gusto/embedded-react-sdk/commit/7d8a165f5656380f8fe9d0a088b704859b02939c))
+
 ## [0.47.0](https://github.com/Gusto/embedded-react-sdk/compare/v0.46.3...v0.47.0) (2026-06-08)
 
 ### Breaking Changes

package/dist/components/Common/ActionsLayout/ActionsLayout.d.ts

@@ -3,5 +3,6 @@ interface ActionsLayoutProps {
     children: React.ReactNode;
     justifyContent?: GridProps['justifyContent'];
 }
+/** @internal */
 export declare const ActionsLayout: ({ children, justifyContent }: ActionsLayoutProps) => import("react").JSX.Element;
 export {};

package/dist/components/Common/ActionsLayout/ActionsLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionsLayout.js","sources":["../../../../src/components/Common/ActionsLayout/ActionsLayout.tsx"],"sourcesContent":["import { Children } from 'react'\nimport { Grid, type GridProps } from '../Grid/Grid'\n\ninterface ActionsLayoutProps {\n  children: React.ReactNode\n  justifyContent?: GridProps['justifyContent']\n}\n\nexport const ActionsLayout = ({ children, justifyContent = 'end' }: ActionsLayoutProps) => {\n  const childrenArray = Children.toArray(children).filter(Boolean)\n  return (\n    <Grid\n      gridTemplateColumns={{\n        base: '1fr',\n        small: `repeat(${childrenArray.length}, max-content)`,\n      }}\n      justifyContent={justifyContent}\n      gap={12}\n    >\n      {children}\n    </Grid>\n  )\n}\n"],"names":["ActionsLayout","children","justifyContent","childrenArray","Children","jsx","Grid"],"mappings":";;;AAQO,MAAMA,IAAgB,CAAC,EAAE,UAAAC,GAAU,gBAAAC,IAAiB,YAAgC;AACzF,QAAMC,IAAgBC,EAAS,QAAQH,CAAQ,EAAE,OAAO,OAAO;AAC/D,SACE,gBAAAI;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,qBAAqB;AAAA,QACnB,MAAM;AAAA,QACN,OAAO,UAAUH,EAAc,MAAM;AAAA,MAAA;AAAA,MAEvC,gBAAAD;AAAA,MACA,KAAK;AAAA,MAEJ,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"ActionsLayout.js","sources":["../../../../src/components/Common/ActionsLayout/ActionsLayout.tsx"],"sourcesContent":["import { Children } from 'react'\nimport { Grid, type GridProps } from '../Grid/Grid'\n\ninterface ActionsLayoutProps {\n  children: React.ReactNode\n  justifyContent?: GridProps['justifyContent']\n}\n\n/** @internal */\nexport const ActionsLayout = ({ children, justifyContent = 'end' }: ActionsLayoutProps) => {\n  const childrenArray = Children.toArray(children).filter(Boolean)\n  return (\n    <Grid\n      gridTemplateColumns={{\n        base: '1fr',\n        small: `repeat(${childrenArray.length}, max-content)`,\n      }}\n      justifyContent={justifyContent}\n      gap={12}\n    >\n      {children}\n    </Grid>\n  )\n}\n"],"names":["ActionsLayout","children","justifyContent","childrenArray","Children","jsx","Grid"],"mappings":";;;AASO,MAAMA,IAAgB,CAAC,EAAE,UAAAC,GAAU,gBAAAC,IAAiB,YAAgC;AACzF,QAAMC,IAAgBC,EAAS,QAAQH,CAAQ,EAAE,OAAO,OAAO;AAC/D,SACE,gBAAAI;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,qBAAqB;AAAA,QACnB,MAAM;AAAA,QACN,OAAO,UAAUH,EAAc,MAAM;AAAA,MAAA;AAAA,MAEvC,gBAAAD;AAAA,MACA,KAAK;AAAA,MAEJ,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/components/Common/Alert/Alert.d.ts

@@ -1,3 +1,4 @@
+/** @internal */
 export interface AlertProps {
     variant?: 'info' | 'success' | 'warning' | 'error';
     label: string;
@@ -6,4 +7,5 @@ export interface AlertProps {
         title?: string;
     }>;
 }
+/** @internal */
 export declare function Alert({ label, children, variant, icon }: AlertProps): import("react").JSX.Element;

package/dist/components/Common/DataView/DataCards/DataCards.d.ts

@@ -1,5 +1,6 @@
 import { useDataViewPropReturn, SelectionMode } from '../useDataView';
 import { TableProps } from '../../UI/Table/TableTypes';
+/** @internal */
 export type DataCardsProps<T> = {
     label: string;
     columns: useDataViewPropReturn<T>['columns'];
@@ -14,4 +15,5 @@ export type DataCardsProps<T> = {
     selectionMode?: SelectionMode;
     isWithinBox?: TableProps['isWithinBox'];
 };
+/** @internal */
 export declare const DataCards: <T>({ label, data, columns, itemMenu, onSelect, onSelectAll, getIsItemSelected, hideSelectAll, emptyState, footer, selectionMode, isWithinBox, }: DataCardsProps<T>) => import("react").JSX.Element;

package/dist/components/Common/DataView/DataCards/DataCards.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataCards.js","sources":["../../../../../src/components/Common/DataView/DataCards/DataCards.tsx"],"sourcesContent":["import { useId } from 'react'\nimport cn from 'classnames'\nimport { useTranslation } from 'react-i18next'\nimport styles from './DataCards.module.scss'\nimport type { useDataViewPropReturn, SelectionMode } from '@/components/Common/DataView/useDataView'\nimport type { TableProps } from '@/components/Common/UI/Table/TableTypes'\nimport { useSelectionState } from '@/components/Common/DataView/useSelectionState'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\nexport type DataCardsProps<T> = {\n  label: string\n  columns: useDataViewPropReturn<T>['columns']\n  data: useDataViewPropReturn<T>['data']\n  itemMenu?: useDataViewPropReturn<T>['itemMenu']\n  onSelect?: (item: T, checked: boolean) => void\n  onSelectAll?: (checked: boolean, visibleData: T[]) => void\n  getIsItemSelected?: (item: T) => boolean\n  hideSelectAll?: useDataViewPropReturn<T>['hideSelectAll']\n  emptyState?: useDataViewPropReturn<T>['emptyState']\n  footer?: useDataViewPropReturn<T>['footer']\n  selectionMode?: SelectionMode\n  isWithinBox?: TableProps['isWithinBox']\n}\n\nexport const DataCards = <T,>({\n  label,\n  data,\n  columns,\n  itemMenu,\n  onSelect,\n  onSelectAll,\n  getIsItemSelected,\n  hideSelectAll,\n  emptyState,\n  footer,\n  selectionMode = 'multiple',\n  isWithinBox,\n}: DataCardsProps<T>) => {\n  const Components = useComponentContext()\n  const { t } = useTranslation('common')\n  const radioGroupName = useId()\n  const { allSelected } = useSelectionState(data, getIsItemSelected)\n\n  const renderAction = (item: T, index: number) => {\n    if (!onSelect) return undefined\n\n    const isSelected = getIsItemSelected?.(item) ?? false\n\n    if (selectionMode === 'single') {\n      return (\n        <Components.Radio\n          name={radioGroupName}\n          value={isSelected}\n          onChange={() => {\n            onSelect(item, true)\n          }}\n          label={t('card.selectRowLabel')}\n          shouldVisuallyHideLabel\n        />\n      )\n    }\n\n    return (\n      <Components.Checkbox\n        value={isSelected}\n        onChange={(checked: boolean) => {\n          onSelect(item, checked)\n        }}\n        label={t('card.selectRowLabel')}\n        shouldVisuallyHideLabel\n      />\n    )\n  }\n\n  return (\n    <div className={cn(styles.root, isWithinBox && styles.withinBox)} data-testid=\"data-cards\">\n      {onSelect &&\n        getIsItemSelected &&\n        selectionMode === 'multiple' &&\n        !hideSelectAll &&\n        data.length > 0 && (\n          <div className={styles.selectAllRow}>\n            <Components.Checkbox\n              value={allSelected}\n              onChange={(checked: boolean) => onSelectAll?.(checked, data)}\n              label={t('card.selectAllRowsLabel')}\n            />\n          </div>\n        )}\n      <div role=\"list\" aria-label={label}>\n        {data.length === 0 && emptyState && (\n          <div role=\"listitem\">\n            <Components.Card className={isWithinBox ? styles.flushCard : undefined}>\n              {emptyState()}\n            </Components.Card>\n          </div>\n        )}\n        {data.map((item, index) => (\n          <div role=\"listitem\" key={index}>\n            <Components.Card\n              menu={itemMenu && itemMenu(item)}\n              action={renderAction(item, index)}\n              className={isWithinBox ? styles.flushCard : undefined}\n            >\n              {columns.map((column, colIndex) => (\n                <Flex key={colIndex} flexDirection=\"column\" gap={0}>\n                  {column.title && <h5 className={styles.columnTitle}>{column.title}</h5>}\n                  <div className={styles.columnData}>\n                    {' '}\n                    {column.render ? column.render(item) : String(item[column.key as keyof T])}\n                  </div>\n                </Flex>\n              ))}\n            </Components.Card>\n          </div>\n        ))}\n        {footer && (\n          <div role=\"listitem\">\n            <Components.Card className={isWithinBox ? styles.flushCard : undefined}>\n              {(() => {\n                const footerContent = footer()\n\n                return Object.entries(footerContent).map(([key, content]) => {\n                  const columnIndex = key.startsWith('column-')\n                    ? parseInt(key.replace('column-', ''), 10)\n                    : -1\n                  const columnTitle = columnIndex >= 0 ? columns[columnIndex]?.title : undefined\n\n                  return (\n                    <Flex key={key} flexDirection=\"column\" gap={0}>\n                      {columnTitle && <h5 className={styles.columnTitle}>{columnTitle}</h5>}\n                      <div className={styles.footerItem}>{content}</div>\n                    </Flex>\n                  )\n                })\n              })()}\n            </Components.Card>\n          </div>\n        )}\n      </div>\n    </div>\n  )\n}\n"],"names":["DataCards","label","data","columns","itemMenu","onSelect","onSelectAll","getIsItemSelected","hideSelectAll","emptyState","footer","selectionMode","isWithinBox","Components","useComponentContext","t","useTranslation","radioGroupName","useId","allSelected","useSelectionState","renderAction","item","index","isSelected","jsx","checked","jsxs","cn","styles","column","colIndex","Flex","footerContent","key","content","columnIndex","columnTitle"],"mappings":"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"}
+{"version":3,"file":"DataCards.js","sources":["../../../../../src/components/Common/DataView/DataCards/DataCards.tsx"],"sourcesContent":["import { useId } from 'react'\nimport cn from 'classnames'\nimport { useTranslation } from 'react-i18next'\nimport styles from './DataCards.module.scss'\nimport type { useDataViewPropReturn, SelectionMode } from '@/components/Common/DataView/useDataView'\nimport type { TableProps } from '@/components/Common/UI/Table/TableTypes'\nimport { useSelectionState } from '@/components/Common/DataView/useSelectionState'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\n/** @internal */\nexport type DataCardsProps<T> = {\n  label: string\n  columns: useDataViewPropReturn<T>['columns']\n  data: useDataViewPropReturn<T>['data']\n  itemMenu?: useDataViewPropReturn<T>['itemMenu']\n  onSelect?: (item: T, checked: boolean) => void\n  onSelectAll?: (checked: boolean, visibleData: T[]) => void\n  getIsItemSelected?: (item: T) => boolean\n  hideSelectAll?: useDataViewPropReturn<T>['hideSelectAll']\n  emptyState?: useDataViewPropReturn<T>['emptyState']\n  footer?: useDataViewPropReturn<T>['footer']\n  selectionMode?: SelectionMode\n  isWithinBox?: TableProps['isWithinBox']\n}\n\n/** @internal */\nexport const DataCards = <T,>({\n  label,\n  data,\n  columns,\n  itemMenu,\n  onSelect,\n  onSelectAll,\n  getIsItemSelected,\n  hideSelectAll,\n  emptyState,\n  footer,\n  selectionMode = 'multiple',\n  isWithinBox,\n}: DataCardsProps<T>) => {\n  const Components = useComponentContext()\n  const { t } = useTranslation('common')\n  const radioGroupName = useId()\n  const { allSelected } = useSelectionState(data, getIsItemSelected)\n\n  const renderAction = (item: T, index: number) => {\n    if (!onSelect) return undefined\n\n    const isSelected = getIsItemSelected?.(item) ?? false\n\n    if (selectionMode === 'single') {\n      return (\n        <Components.Radio\n          name={radioGroupName}\n          value={isSelected}\n          onChange={() => {\n            onSelect(item, true)\n          }}\n          label={t('card.selectRowLabel')}\n          shouldVisuallyHideLabel\n        />\n      )\n    }\n\n    return (\n      <Components.Checkbox\n        value={isSelected}\n        onChange={(checked: boolean) => {\n          onSelect(item, checked)\n        }}\n        label={t('card.selectRowLabel')}\n        shouldVisuallyHideLabel\n      />\n    )\n  }\n\n  return (\n    <div className={cn(styles.root, isWithinBox && styles.withinBox)} data-testid=\"data-cards\">\n      {onSelect &&\n        getIsItemSelected &&\n        selectionMode === 'multiple' &&\n        !hideSelectAll &&\n        data.length > 0 && (\n          <div className={styles.selectAllRow}>\n            <Components.Checkbox\n              value={allSelected}\n              onChange={(checked: boolean) => onSelectAll?.(checked, data)}\n              label={t('card.selectAllRowsLabel')}\n            />\n          </div>\n        )}\n      <div role=\"list\" aria-label={label}>\n        {data.length === 0 && emptyState && (\n          <div role=\"listitem\">\n            <Components.Card className={isWithinBox ? styles.flushCard : undefined}>\n              {emptyState()}\n            </Components.Card>\n          </div>\n        )}\n        {data.map((item, index) => (\n          <div role=\"listitem\" key={index}>\n            <Components.Card\n              menu={itemMenu && itemMenu(item)}\n              action={renderAction(item, index)}\n              className={isWithinBox ? styles.flushCard : undefined}\n            >\n              {columns.map((column, colIndex) => (\n                <Flex key={colIndex} flexDirection=\"column\" gap={0}>\n                  {column.title && <h5 className={styles.columnTitle}>{column.title}</h5>}\n                  <div className={styles.columnData}>\n                    {' '}\n                    {column.render ? column.render(item) : String(item[column.key as keyof T])}\n                  </div>\n                </Flex>\n              ))}\n            </Components.Card>\n          </div>\n        ))}\n        {footer && (\n          <div role=\"listitem\">\n            <Components.Card className={isWithinBox ? styles.flushCard : undefined}>\n              {(() => {\n                const footerContent = footer()\n\n                return Object.entries(footerContent).map(([key, content]) => {\n                  const columnIndex = key.startsWith('column-')\n                    ? parseInt(key.replace('column-', ''), 10)\n                    : -1\n                  const columnTitle = columnIndex >= 0 ? columns[columnIndex]?.title : undefined\n\n                  return (\n                    <Flex key={key} flexDirection=\"column\" gap={0}>\n                      {columnTitle && <h5 className={styles.columnTitle}>{columnTitle}</h5>}\n                      <div className={styles.footerItem}>{content}</div>\n                    </Flex>\n                  )\n                })\n              })()}\n            </Components.Card>\n          </div>\n        )}\n      </div>\n    </div>\n  )\n}\n"],"names":["DataCards","label","data","columns","itemMenu","onSelect","onSelectAll","getIsItemSelected","hideSelectAll","emptyState","footer","selectionMode","isWithinBox","Components","useComponentContext","t","useTranslation","radioGroupName","useId","allSelected","useSelectionState","renderAction","item","index","isSelected","jsx","checked","jsxs","cn","styles","column","colIndex","Flex","footerContent","key","content","columnIndex","columnTitle"],"mappings":"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"}

package/dist/components/Common/DataView/DataTable/DataTable.d.ts

@@ -1,5 +1,6 @@
 import { useDataViewPropReturn, SelectionMode } from '../useDataView';
 import { TableProps } from '../../UI/Table/TableTypes';
+/** @internal */
 export type DataTableProps<T> = {
     label: string;
     columns: useDataViewPropReturn<T>['columns'];
@@ -14,4 +15,5 @@ export type DataTableProps<T> = {
     isWithinBox?: TableProps['isWithinBox'];
     selectionMode?: SelectionMode;
 };
+/** @internal */
 export declare const DataTable: <T>({ label, data, columns, itemMenu, onSelect, onSelectAll, getIsItemSelected, hideSelectAll, emptyState, footer, isWithinBox, selectionMode, }: DataTableProps<T>) => import("react").JSX.Element;

package/dist/components/Common/DataView/DataTable/DataTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTable.js","sources":["../../../../../src/components/Common/DataView/DataTable/DataTable.tsx"],"sourcesContent":["import { useId, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport type { useDataViewPropReturn, SelectionMode } from '../useDataView'\nimport { useSelectionState } from '../useSelectionState'\nimport type { TableData, TableRow, TableProps } from '../../UI/Table/TableTypes'\nimport { VisuallyHidden } from '../../VisuallyHidden'\nimport styles from './DataTable.module.scss'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\nfunction withJustify(content: React.ReactNode, justify?: 'start' | 'end') {\n  if (!justify || justify === 'start') return content\n  return <div className={styles.cellEnd}>{content}</div>\n}\n\nexport type DataTableProps<T> = {\n  label: string\n  columns: useDataViewPropReturn<T>['columns']\n  data: useDataViewPropReturn<T>['data']\n  itemMenu?: useDataViewPropReturn<T>['itemMenu']\n  onSelect?: useDataViewPropReturn<T>['onSelect']\n  onSelectAll?: (checked: boolean, visibleData: T[]) => void\n  getIsItemSelected?: (item: T) => boolean\n  hideSelectAll?: useDataViewPropReturn<T>['hideSelectAll']\n  emptyState?: useDataViewPropReturn<T>['emptyState']\n  footer?: useDataViewPropReturn<T>['footer']\n  isWithinBox?: TableProps['isWithinBox']\n  selectionMode?: SelectionMode\n}\n\nfunction getCellContent<T>(\n  item: T,\n  column: { key?: string | keyof T; render?: (item: T) => React.ReactNode },\n) {\n  if (column.render) {\n    return column.render(item)\n  }\n\n  if (column.key) {\n    const key = column.key as keyof T\n    return String(item[key] ?? '')\n  }\n\n  return ''\n}\n\nexport const DataTable = <T,>({\n  label,\n  data,\n  columns,\n  itemMenu,\n  onSelect,\n  onSelectAll,\n  getIsItemSelected,\n  hideSelectAll,\n  emptyState,\n  footer,\n  isWithinBox,\n  selectionMode = 'multiple',\n}: DataTableProps<T>) => {\n  const Components = useComponentContext()\n  const { t } = useTranslation('common')\n  const radioGroupName = useId()\n  const [selectedRadioIndex, setSelectedRadioIndex] = useState<number | null>(null)\n  const { allSelected } = useSelectionState(data, getIsItemSelected)\n\n  const headers: TableData[] = [\n    ...(onSelect\n      ? [\n          {\n            key: 'select-header',\n            content:\n              selectionMode === 'multiple' &&\n              getIsItemSelected &&\n              !hideSelectAll &&\n              data.length > 0 ? (\n                // Stop propagation so the surrounding react-aria-components\n                // <Column> press handler doesn't intercept the checkbox click\n                // and desync the controlled DOM state. The inner <input> is\n                // the actual interactive element; this span is a propagation\n                // shield, not a click target itself.\n                // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions\n                <span\n                  onClick={e => {\n                    e.stopPropagation()\n                  }}\n                  onPointerDown={e => {\n                    e.stopPropagation()\n                  }}\n                  onMouseDown={e => {\n                    e.stopPropagation()\n                  }}\n                >\n                  <Components.Checkbox\n                    value={allSelected}\n                    onChange={(checked: boolean) => onSelectAll?.(checked, data)}\n                    label={t('table.selectAllRowsLabel')}\n                    shouldVisuallyHideLabel\n                  />\n                </span>\n              ) : (\n                <VisuallyHidden>{t('table.selectRowHeader')}</VisuallyHidden>\n              ),\n          },\n        ]\n      : []),\n    ...columns.map((column, index) => ({\n      key: typeof column.key === 'string' ? column.key : `header-${index}`,\n      content: withJustify(column.title, column.justify),\n    })),\n    ...(itemMenu\n      ? [\n          {\n            key: 'actions-header',\n            content: <VisuallyHidden>{t('table.actionsColumnHeader')}</VisuallyHidden>,\n          },\n        ]\n      : []),\n  ]\n\n  const handleRadioSelect = (item: T, rowIndex: number) => {\n    setSelectedRadioIndex(rowIndex)\n    onSelect?.(item, true)\n  }\n\n  const renderSelectionControl = (item: T, rowIndex: number) => {\n    if (selectionMode === 'single') {\n      const isSelected = getIsItemSelected?.(item) ?? selectedRadioIndex === rowIndex\n      return (\n        <Components.Radio\n          name={radioGroupName}\n          value={isSelected}\n          onChange={() => {\n            handleRadioSelect(item, rowIndex)\n          }}\n          label={t('table.selectRowLabel')}\n          shouldVisuallyHideLabel\n        />\n      )\n    }\n\n    const isSelected = getIsItemSelected?.(item) ?? false\n    return (\n      <Components.Checkbox\n        value={isSelected}\n        onChange={(checked: boolean) => {\n          onSelect?.(item, checked)\n        }}\n        label={t('table.selectRowLabel')}\n        shouldVisuallyHideLabel\n      />\n    )\n  }\n\n  const rows: TableRow[] = data.map((item, rowIndex) => {\n    const rowData: TableData[] = [\n      ...(onSelect\n        ? [\n            {\n              key: `select-${rowIndex}`,\n              content: renderSelectionControl(item, rowIndex),\n            },\n          ]\n        : []),\n      ...columns.map((column, colIndex) => {\n        return {\n          key: typeof column.key === 'string' ? column.key : `cell-${colIndex}`,\n          content: withJustify(getCellContent(item, column), column.justify),\n        }\n      }),\n      ...(itemMenu\n        ? [\n            {\n              key: `menu-${rowIndex}`,\n              content: itemMenu(item),\n            },\n          ]\n        : []),\n    ]\n\n    return {\n      key: `row-${rowIndex}`,\n      data: rowData,\n    }\n  })\n\n  const buildFooterData = () => {\n    if (!footer) return undefined\n\n    const footerContent = footer()\n    const footerCells: TableData[] = []\n\n    // Add select column footer (empty)\n    if (onSelect) {\n      footerCells.push({\n        key: 'footer-select',\n        content: '',\n      })\n    }\n\n    // Add data column footers\n    columns.forEach((column, index) => {\n      const columnKey = typeof column.key === 'string' ? column.key : `column-${index}`\n      footerCells.push({\n        key: `footer-${columnKey}`,\n        content: footerContent[columnKey] || '',\n      })\n    })\n\n    // Add actions column footer (empty)\n    if (itemMenu) {\n      footerCells.push({\n        key: 'footer-actions',\n        content: '',\n      })\n    }\n\n    return footerCells\n  }\n\n  const footerData = buildFooterData()\n\n  return (\n    <Components.Table\n      aria-label={label}\n      data-testid=\"data-table\"\n      headers={headers}\n      rows={rows}\n      footer={footerData}\n      emptyState={emptyState ? emptyState() : undefined}\n      isWithinBox={isWithinBox}\n      hasCheckboxColumn={!!onSelect}\n    />\n  )\n}\n"],"names":["withJustify","content","justify","jsx","styles","getCellContent","item","column","key","DataTable","label","data","columns","itemMenu","onSelect","onSelectAll","getIsItemSelected","hideSelectAll","emptyState","footer","isWithinBox","selectionMode","Components","useComponentContext","t","useTranslation","radioGroupName","useId","selectedRadioIndex","setSelectedRadioIndex","useState","allSelected","useSelectionState","headers","checked","VisuallyHidden","index","handleRadioSelect","rowIndex","renderSelectionControl","isSelected","rows","rowData","colIndex","footerData","footerContent","footerCells","columnKey"],"mappings":"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"}
+{"version":3,"file":"DataTable.js","sources":["../../../../../src/components/Common/DataView/DataTable/DataTable.tsx"],"sourcesContent":["import { useId, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport type { useDataViewPropReturn, SelectionMode } from '../useDataView'\nimport { useSelectionState } from '../useSelectionState'\nimport type { TableData, TableRow, TableProps } from '../../UI/Table/TableTypes'\nimport { VisuallyHidden } from '../../VisuallyHidden'\nimport styles from './DataTable.module.scss'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\nfunction withJustify(content: React.ReactNode, justify?: 'start' | 'end') {\n  if (!justify || justify === 'start') return content\n  return <div className={styles.cellEnd}>{content}</div>\n}\n\n/** @internal */\nexport type DataTableProps<T> = {\n  label: string\n  columns: useDataViewPropReturn<T>['columns']\n  data: useDataViewPropReturn<T>['data']\n  itemMenu?: useDataViewPropReturn<T>['itemMenu']\n  onSelect?: useDataViewPropReturn<T>['onSelect']\n  onSelectAll?: (checked: boolean, visibleData: T[]) => void\n  getIsItemSelected?: (item: T) => boolean\n  hideSelectAll?: useDataViewPropReturn<T>['hideSelectAll']\n  emptyState?: useDataViewPropReturn<T>['emptyState']\n  footer?: useDataViewPropReturn<T>['footer']\n  isWithinBox?: TableProps['isWithinBox']\n  selectionMode?: SelectionMode\n}\n\nfunction getCellContent<T>(\n  item: T,\n  column: { key?: string | keyof T; render?: (item: T) => React.ReactNode },\n) {\n  if (column.render) {\n    return column.render(item)\n  }\n\n  if (column.key) {\n    const key = column.key as keyof T\n    return String(item[key] ?? '')\n  }\n\n  return ''\n}\n\n/** @internal */\nexport const DataTable = <T,>({\n  label,\n  data,\n  columns,\n  itemMenu,\n  onSelect,\n  onSelectAll,\n  getIsItemSelected,\n  hideSelectAll,\n  emptyState,\n  footer,\n  isWithinBox,\n  selectionMode = 'multiple',\n}: DataTableProps<T>) => {\n  const Components = useComponentContext()\n  const { t } = useTranslation('common')\n  const radioGroupName = useId()\n  const [selectedRadioIndex, setSelectedRadioIndex] = useState<number | null>(null)\n  const { allSelected } = useSelectionState(data, getIsItemSelected)\n\n  const headers: TableData[] = [\n    ...(onSelect\n      ? [\n          {\n            key: 'select-header',\n            content:\n              selectionMode === 'multiple' &&\n              getIsItemSelected &&\n              !hideSelectAll &&\n              data.length > 0 ? (\n                // Stop propagation so the surrounding react-aria-components\n                // <Column> press handler doesn't intercept the checkbox click\n                // and desync the controlled DOM state. The inner <input> is\n                // the actual interactive element; this span is a propagation\n                // shield, not a click target itself.\n                // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions\n                <span\n                  onClick={e => {\n                    e.stopPropagation()\n                  }}\n                  onPointerDown={e => {\n                    e.stopPropagation()\n                  }}\n                  onMouseDown={e => {\n                    e.stopPropagation()\n                  }}\n                >\n                  <Components.Checkbox\n                    value={allSelected}\n                    onChange={(checked: boolean) => onSelectAll?.(checked, data)}\n                    label={t('table.selectAllRowsLabel')}\n                    shouldVisuallyHideLabel\n                  />\n                </span>\n              ) : (\n                <VisuallyHidden>{t('table.selectRowHeader')}</VisuallyHidden>\n              ),\n          },\n        ]\n      : []),\n    ...columns.map((column, index) => ({\n      key: typeof column.key === 'string' ? column.key : `header-${index}`,\n      content: withJustify(column.title, column.justify),\n    })),\n    ...(itemMenu\n      ? [\n          {\n            key: 'actions-header',\n            content: <VisuallyHidden>{t('table.actionsColumnHeader')}</VisuallyHidden>,\n          },\n        ]\n      : []),\n  ]\n\n  const handleRadioSelect = (item: T, rowIndex: number) => {\n    setSelectedRadioIndex(rowIndex)\n    onSelect?.(item, true)\n  }\n\n  const renderSelectionControl = (item: T, rowIndex: number) => {\n    if (selectionMode === 'single') {\n      const isSelected = getIsItemSelected?.(item) ?? selectedRadioIndex === rowIndex\n      return (\n        <Components.Radio\n          name={radioGroupName}\n          value={isSelected}\n          onChange={() => {\n            handleRadioSelect(item, rowIndex)\n          }}\n          label={t('table.selectRowLabel')}\n          shouldVisuallyHideLabel\n        />\n      )\n    }\n\n    const isSelected = getIsItemSelected?.(item) ?? false\n    return (\n      <Components.Checkbox\n        value={isSelected}\n        onChange={(checked: boolean) => {\n          onSelect?.(item, checked)\n        }}\n        label={t('table.selectRowLabel')}\n        shouldVisuallyHideLabel\n      />\n    )\n  }\n\n  const rows: TableRow[] = data.map((item, rowIndex) => {\n    const rowData: TableData[] = [\n      ...(onSelect\n        ? [\n            {\n              key: `select-${rowIndex}`,\n              content: renderSelectionControl(item, rowIndex),\n            },\n          ]\n        : []),\n      ...columns.map((column, colIndex) => {\n        return {\n          key: typeof column.key === 'string' ? column.key : `cell-${colIndex}`,\n          content: withJustify(getCellContent(item, column), column.justify),\n        }\n      }),\n      ...(itemMenu\n        ? [\n            {\n              key: `menu-${rowIndex}`,\n              content: itemMenu(item),\n            },\n          ]\n        : []),\n    ]\n\n    return {\n      key: `row-${rowIndex}`,\n      data: rowData,\n    }\n  })\n\n  const buildFooterData = () => {\n    if (!footer) return undefined\n\n    const footerContent = footer()\n    const footerCells: TableData[] = []\n\n    // Add select column footer (empty)\n    if (onSelect) {\n      footerCells.push({\n        key: 'footer-select',\n        content: '',\n      })\n    }\n\n    // Add data column footers\n    columns.forEach((column, index) => {\n      const columnKey = typeof column.key === 'string' ? column.key : `column-${index}`\n      footerCells.push({\n        key: `footer-${columnKey}`,\n        content: footerContent[columnKey] || '',\n      })\n    })\n\n    // Add actions column footer (empty)\n    if (itemMenu) {\n      footerCells.push({\n        key: 'footer-actions',\n        content: '',\n      })\n    }\n\n    return footerCells\n  }\n\n  const footerData = buildFooterData()\n\n  return (\n    <Components.Table\n      aria-label={label}\n      data-testid=\"data-table\"\n      headers={headers}\n      rows={rows}\n      footer={footerData}\n      emptyState={emptyState ? emptyState() : undefined}\n      isWithinBox={isWithinBox}\n      hasCheckboxColumn={!!onSelect}\n    />\n  )\n}\n"],"names":["withJustify","content","justify","jsx","styles","getCellContent","item","column","key","DataTable","label","data","columns","itemMenu","onSelect","onSelectAll","getIsItemSelected","hideSelectAll","emptyState","footer","isWithinBox","selectionMode","Components","useComponentContext","t","useTranslation","radioGroupName","useId","selectedRadioIndex","setSelectedRadioIndex","useState","allSelected","useSelectionState","headers","checked","VisuallyHidden","index","handleRadioSelect","rowIndex","renderSelectionControl","isSelected","rows","rowData","colIndex","footerData","footerContent","footerCells","columnKey"],"mappings":"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"}

package/dist/components/Common/DataView/DataView.d.ts

@@ -1,6 +1,7 @@
 import { TableProps } from '../UI/Table/TableTypes';
 import { useDataViewPropReturn, SelectionMode } from './useDataView';
 import { useContainerBreakpointsProps } from '../../../hooks/useContainerBreakpoints/useContainerBreakpoints';
+/** @internal */
 export type DataViewProps<T> = {
     columns: useDataViewPropReturn<T>['columns'];
     data: T[];
@@ -19,4 +20,5 @@ export type DataViewProps<T> = {
     emptyState?: useDataViewPropReturn<T>['emptyState'];
     selectionMode?: SelectionMode;
 };
+/** @internal */
 export declare const DataView: <T>({ pagination, isFetching, breakAt, breakpoints: customBreakpoints, footer, isWithinBox, emptyState, selectionMode, onSelectAll, ...dataViewProps }: DataViewProps<T>) => import("react").JSX.Element;

package/dist/components/Common/DataView/DataView.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataView.js","sources":["../../../../src/components/Common/DataView/DataView.tsx"],"sourcesContent":["import { useMemo, useRef } from 'react'\nimport { PaginationControl } from '../PaginationControl/PaginationControl'\nimport type { TableProps } from '../UI/Table/TableTypes'\nimport styles from './DataView.module.scss'\nimport { DataTable } from './DataTable/DataTable'\nimport type { useDataViewPropReturn, SelectionMode } from './useDataView'\nimport { DataCards } from './DataCards/DataCards'\nimport type { useContainerBreakpointsProps } from '@/hooks/useContainerBreakpoints/useContainerBreakpoints'\nimport useContainerBreakpoints from '@/hooks/useContainerBreakpoints/useContainerBreakpoints'\n\nexport type DataViewProps<T> = {\n  columns: useDataViewPropReturn<T>['columns']\n  data: T[]\n  pagination?: useDataViewPropReturn<T>['pagination']\n  label: string\n  itemMenu?: useDataViewPropReturn<T>['itemMenu']\n  onSelect?: useDataViewPropReturn<T>['onSelect']\n  onSelectAll?: useDataViewPropReturn<T>['onSelectAll']\n  getIsItemSelected?: (item: T) => boolean\n  hideSelectAll?: useDataViewPropReturn<T>['hideSelectAll']\n  breakAt?: string\n  breakpoints?: useContainerBreakpointsProps['breakpoints']\n  footer?: useDataViewPropReturn<T>['footer']\n  isFetching?: boolean\n  isWithinBox?: TableProps['isWithinBox']\n  emptyState?: useDataViewPropReturn<T>['emptyState']\n  selectionMode?: SelectionMode\n}\n\nexport const DataView = <T,>({\n  pagination,\n  isFetching,\n  breakAt = 'small',\n  breakpoints: customBreakpoints,\n  footer,\n  isWithinBox,\n  emptyState,\n  selectionMode,\n  onSelectAll,\n  ...dataViewProps\n}: DataViewProps<T>) => {\n  const containerRef = useRef<HTMLElement | null>(null)\n  const breakpoints = useContainerBreakpoints({\n    ref: containerRef,\n    breakpoints: customBreakpoints,\n  })\n\n  // Wait for breakpoints to be detected before rendering\n  const isBreakpointsDetected = breakpoints.length > 0\n  const isMobile = !breakpoints.includes(breakAt)\n\n  const Component = useMemo(() => {\n    return isMobile ? DataCards : DataTable\n  }, [isMobile])\n\n  return (\n    <div\n      data-testid=\"data-view\"\n      className={styles.dataViewContainer}\n      ref={ref => {\n        containerRef.current = ref\n      }}\n    >\n      {isBreakpointsDetected && (\n        <Component\n          {...dataViewProps}\n          onSelectAll={onSelectAll}\n          footer={footer}\n          isWithinBox={isWithinBox}\n          emptyState={emptyState}\n          selectionMode={selectionMode}\n        />\n      )}\n      {pagination && <PaginationControl {...pagination} isFetching={isFetching} />}\n    </div>\n  )\n}\n"],"names":["DataView","pagination","isFetching","breakAt","customBreakpoints","footer","isWithinBox","emptyState","selectionMode","onSelectAll","dataViewProps","containerRef","useRef","breakpoints","useContainerBreakpoints","isBreakpointsDetected","isMobile","Component","useMemo","DataCards","DataTable","jsxs","styles","ref","jsx","PaginationControl"],"mappings":";;;;;;;AA6BO,MAAMA,IAAW,CAAK;AAAA,EAC3B,YAAAC;AAAA,EACA,YAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,aAAaC;AAAA,EACb,QAAAC;AAAA,EACA,aAAAC;AAAA,EACA,YAAAC;AAAA,EACA,eAAAC;AAAA,EACA,aAAAC;AAAA,EACA,GAAGC;AACL,MAAwB;AACtB,QAAMC,IAAeC,EAA2B,IAAI,GAC9CC,IAAcC,EAAwB;AAAA,IAC1C,KAAKH;AAAA,IACL,aAAaP;AAAA,EAAA,CACd,GAGKW,IAAwBF,EAAY,SAAS,GAC7CG,IAAW,CAACH,EAAY,SAASV,CAAO,GAExCc,IAAYC,EAAQ,MACjBF,IAAWG,IAAYC,GAC7B,CAACJ,CAAQ,CAAC;AAEb,SACE,gBAAAK;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,eAAY;AAAA,MACZ,WAAWC,EAAO;AAAA,MAClB,KAAK,CAAAC,MAAO;AACV,QAAAZ,EAAa,UAAUY;AAAA,MACzB;AAAA,MAEC,UAAA;AAAA,QAAAR,KACC,gBAAAS;AAAA,UAACP;AAAA,UAAA;AAAA,YACE,GAAGP;AAAA,YACJ,aAAAD;AAAA,YACA,QAAAJ;AAAA,YACA,aAAAC;AAAA,YACA,YAAAC;AAAA,YACA,eAAAC;AAAA,UAAA;AAAA,QAAA;AAAA,QAGHP,KAAc,gBAAAuB,EAACC,GAAA,EAAmB,GAAGxB,GAAY,YAAAC,EAAA,CAAwB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGhF;"}
+{"version":3,"file":"DataView.js","sources":["../../../../src/components/Common/DataView/DataView.tsx"],"sourcesContent":["import { useMemo, useRef } from 'react'\nimport { PaginationControl } from '../PaginationControl/PaginationControl'\nimport type { TableProps } from '../UI/Table/TableTypes'\nimport styles from './DataView.module.scss'\nimport { DataTable } from './DataTable/DataTable'\nimport type { useDataViewPropReturn, SelectionMode } from './useDataView'\nimport { DataCards } from './DataCards/DataCards'\nimport type { useContainerBreakpointsProps } from '@/hooks/useContainerBreakpoints/useContainerBreakpoints'\nimport useContainerBreakpoints from '@/hooks/useContainerBreakpoints/useContainerBreakpoints'\n\n/** @internal */\nexport type DataViewProps<T> = {\n  columns: useDataViewPropReturn<T>['columns']\n  data: T[]\n  pagination?: useDataViewPropReturn<T>['pagination']\n  label: string\n  itemMenu?: useDataViewPropReturn<T>['itemMenu']\n  onSelect?: useDataViewPropReturn<T>['onSelect']\n  onSelectAll?: useDataViewPropReturn<T>['onSelectAll']\n  getIsItemSelected?: (item: T) => boolean\n  hideSelectAll?: useDataViewPropReturn<T>['hideSelectAll']\n  breakAt?: string\n  breakpoints?: useContainerBreakpointsProps['breakpoints']\n  footer?: useDataViewPropReturn<T>['footer']\n  isFetching?: boolean\n  isWithinBox?: TableProps['isWithinBox']\n  emptyState?: useDataViewPropReturn<T>['emptyState']\n  selectionMode?: SelectionMode\n}\n\n/** @internal */\nexport const DataView = <T,>({\n  pagination,\n  isFetching,\n  breakAt = 'small',\n  breakpoints: customBreakpoints,\n  footer,\n  isWithinBox,\n  emptyState,\n  selectionMode,\n  onSelectAll,\n  ...dataViewProps\n}: DataViewProps<T>) => {\n  const containerRef = useRef<HTMLElement | null>(null)\n  const breakpoints = useContainerBreakpoints({\n    ref: containerRef,\n    breakpoints: customBreakpoints,\n  })\n\n  // Wait for breakpoints to be detected before rendering\n  const isBreakpointsDetected = breakpoints.length > 0\n  const isMobile = !breakpoints.includes(breakAt)\n\n  const Component = useMemo(() => {\n    return isMobile ? DataCards : DataTable\n  }, [isMobile])\n\n  return (\n    <div\n      data-testid=\"data-view\"\n      className={styles.dataViewContainer}\n      ref={ref => {\n        containerRef.current = ref\n      }}\n    >\n      {isBreakpointsDetected && (\n        <Component\n          {...dataViewProps}\n          onSelectAll={onSelectAll}\n          footer={footer}\n          isWithinBox={isWithinBox}\n          emptyState={emptyState}\n          selectionMode={selectionMode}\n        />\n      )}\n      {pagination && <PaginationControl {...pagination} isFetching={isFetching} />}\n    </div>\n  )\n}\n"],"names":["DataView","pagination","isFetching","breakAt","customBreakpoints","footer","isWithinBox","emptyState","selectionMode","onSelectAll","dataViewProps","containerRef","useRef","breakpoints","useContainerBreakpoints","isBreakpointsDetected","isMobile","Component","useMemo","DataCards","DataTable","jsxs","styles","ref","jsx","PaginationControl"],"mappings":";;;;;;;AA+BO,MAAMA,IAAW,CAAK;AAAA,EAC3B,YAAAC;AAAA,EACA,YAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,aAAaC;AAAA,EACb,QAAAC;AAAA,EACA,aAAAC;AAAA,EACA,YAAAC;AAAA,EACA,eAAAC;AAAA,EACA,aAAAC;AAAA,EACA,GAAGC;AACL,MAAwB;AACtB,QAAMC,IAAeC,EAA2B,IAAI,GAC9CC,IAAcC,EAAwB;AAAA,IAC1C,KAAKH;AAAA,IACL,aAAaP;AAAA,EAAA,CACd,GAGKW,IAAwBF,EAAY,SAAS,GAC7CG,IAAW,CAACH,EAAY,SAASV,CAAO,GAExCc,IAAYC,EAAQ,MACjBF,IAAWG,IAAYC,GAC7B,CAACJ,CAAQ,CAAC;AAEb,SACE,gBAAAK;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,eAAY;AAAA,MACZ,WAAWC,EAAO;AAAA,MAClB,KAAK,CAAAC,MAAO;AACV,QAAAZ,EAAa,UAAUY;AAAA,MACzB;AAAA,MAEC,UAAA;AAAA,QAAAR,KACC,gBAAAS;AAAA,UAACP;AAAA,UAAA;AAAA,YACE,GAAGP;AAAA,YACJ,aAAAD;AAAA,YACA,QAAAJ;AAAA,YACA,aAAAC;AAAA,YACA,YAAAC;AAAA,YACA,eAAAC;AAAA,UAAA;AAAA,QAAA;AAAA,QAGHP,KAAc,gBAAAuB,EAACC,GAAA,EAAmB,GAAGxB,GAAY,YAAAC,EAAA,CAAwB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGhF;"}

package/dist/components/Common/DataView/useDataView.d.ts

@@ -1,4 +1,5 @@
 import { PaginationControlProps } from '../PaginationControl/PaginationControlTypes';
+/** @internal */
 export type SelectionMode = 'multiple' | 'single';
 type DataViewColumn<T> = {
     key: keyof T;
@@ -55,7 +56,9 @@ type MultipleSelectionProps<T> = {
      */
     getIsItemSelected: (item: T) => boolean;
 };
+/** @internal */
 export type useDataViewProp<T> = BaseDataViewProps<T> & (NoSelectionProps | SingleSelectionProps<T> | MultipleSelectionProps<T>);
+/** @internal */
 export type useDataViewPropReturn<T> = {
     pagination?: PaginationControlProps;
     data: T[];
@@ -70,5 +73,6 @@ export type useDataViewPropReturn<T> = {
     isFetching?: boolean;
     selectionMode?: SelectionMode;
 };
+/** @internal */
 export declare const useDataView: <T>({ columns, data, itemMenu, onSelect, onSelectAll, getIsItemSelected, hideSelectAll, pagination, emptyState, footer, isFetching, selectionMode, }: useDataViewProp<T>) => useDataViewPropReturn<T>;
 export {};

package/dist/components/Common/DataView/useDataView.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDataView.js","sources":["../../../../src/components/Common/DataView/useDataView.ts"],"sourcesContent":["import { useMemo } from 'react'\nimport type { PaginationControlProps } from '@/components/Common/PaginationControl/PaginationControlTypes'\n\nexport type SelectionMode = 'multiple' | 'single'\n\ntype DataViewColumn<T> =\n  | {\n      key: keyof T\n      title: string | React.ReactNode\n      render?: (item: T) => React.ReactNode\n      justify?: 'start' | 'end'\n    }\n  | {\n      key?: string\n      title: string | React.ReactNode\n      render: (item: T) => React.ReactNode\n      justify?: 'start' | 'end'\n    }\n\ntype FooterKeys<T> = keyof T | string\n\ntype BaseDataViewProps<T> = {\n  columns: DataViewColumn<T>[]\n  data: T[]\n  pagination?: PaginationControlProps\n  itemMenu?: (item: T) => React.ReactNode\n  emptyState?: () => React.ReactNode\n  footer?: () => Partial<Record<FooterKeys<T>, React.ReactNode>>\n  isFetching?: boolean\n  /**\n   * When true, hides the select-all header checkbox (DataTable) and the\n   * select-all row (DataCards). Only meaningful with `selectionMode: 'multiple'`.\n   * Per-row checkboxes are unaffected.\n   */\n  hideSelectAll?: boolean\n}\n\ntype NoSelectionProps = {\n  onSelect?: undefined\n  onSelectAll?: undefined\n  getIsItemSelected?: undefined\n  selectionMode?: undefined\n}\n\ntype SingleSelectionProps<T> = {\n  selectionMode: 'single'\n  onSelect: (item: T, checked: boolean) => void\n  onSelectAll?: undefined\n  getIsItemSelected?: (item: T) => boolean\n}\n\ntype MultipleSelectionProps<T> = {\n  selectionMode?: 'multiple'\n  onSelect: (item: T, checked: boolean) => void\n  /**\n   * Called when the select-all checkbox is toggled.\n   * The header checkbox state reflects only the currently visible `data` array.\n   * With pagination, consumers decide whether to select all data or only the visible page.\n   * `visibleData` is the current page's data array for reference.\n   */\n  onSelectAll?: (checked: boolean, visibleData: T[]) => void\n  /**\n   * Required for multi-select. Returns whether a given item is currently selected.\n   * Use a stable identifier from the item (e.g. item.id) rather than array index.\n   */\n  getIsItemSelected: (item: T) => boolean\n}\n\nexport type useDataViewProp<T> = BaseDataViewProps<T> &\n  (NoSelectionProps | SingleSelectionProps<T> | MultipleSelectionProps<T>)\n\nexport type useDataViewPropReturn<T> = {\n  pagination?: PaginationControlProps\n  data: T[]\n  columns: DataViewColumn<T>[]\n  itemMenu?: (item: T) => React.ReactNode\n  onSelect?: (item: T, checked: boolean) => void\n  onSelectAll?: (checked: boolean, visibleData: T[]) => void\n  getIsItemSelected?: (item: T) => boolean\n  hideSelectAll?: boolean\n  emptyState?: () => React.ReactNode\n  footer?: () => Partial<Record<FooterKeys<T>, React.ReactNode>>\n  isFetching?: boolean\n  selectionMode?: SelectionMode\n}\n\nexport const useDataView = <T>({\n  columns,\n  data,\n  itemMenu,\n  onSelect,\n  onSelectAll,\n  getIsItemSelected,\n  hideSelectAll,\n  pagination,\n  emptyState,\n  footer,\n  isFetching,\n  selectionMode,\n}: useDataViewProp<T>): useDataViewPropReturn<T> => {\n  const dataViewProps = useMemo(() => {\n    return {\n      pagination,\n      data,\n      columns,\n      itemMenu,\n      onSelect,\n      onSelectAll,\n      getIsItemSelected,\n      hideSelectAll,\n      emptyState,\n      footer,\n      isFetching,\n      selectionMode,\n    }\n  }, [\n    pagination,\n    data,\n    columns,\n    itemMenu,\n    onSelect,\n    onSelectAll,\n    getIsItemSelected,\n    hideSelectAll,\n    emptyState,\n    footer,\n    isFetching,\n    selectionMode,\n  ])\n\n  return dataViewProps\n}\n"],"names":["useDataView","columns","data","itemMenu","onSelect","onSelectAll","getIsItemSelected","hideSelectAll","pagination","emptyState","footer","isFetching","selectionMode","useMemo"],"mappings":";AAsFO,MAAMA,IAAc,CAAI;AAAA,EAC7B,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,YAAAC;AAAA,EACA,YAAAC;AAAA,EACA,QAAAC;AAAA,EACA,YAAAC;AAAA,EACA,eAAAC;AACF,MACwBC,EAAQ,OACrB;AAAA,EACL,YAAAL;AAAA,EACA,MAAAN;AAAA,EACA,SAAAD;AAAA,EACA,UAAAE;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,YAAAE;AAAA,EACA,QAAAC;AAAA,EACA,YAAAC;AAAA,EACA,eAAAC;AAAA,IAED;AAAA,EACDJ;AAAA,EACAN;AAAA,EACAD;AAAA,EACAE;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAE;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,CACD;"}
+{"version":3,"file":"useDataView.js","sources":["../../../../src/components/Common/DataView/useDataView.ts"],"sourcesContent":["import { useMemo } from 'react'\nimport type { PaginationControlProps } from '@/components/Common/PaginationControl/PaginationControlTypes'\n\n/** @internal */\nexport type SelectionMode = 'multiple' | 'single'\n\ntype DataViewColumn<T> =\n  | {\n      key: keyof T\n      title: string | React.ReactNode\n      render?: (item: T) => React.ReactNode\n      justify?: 'start' | 'end'\n    }\n  | {\n      key?: string\n      title: string | React.ReactNode\n      render: (item: T) => React.ReactNode\n      justify?: 'start' | 'end'\n    }\n\ntype FooterKeys<T> = keyof T | string\n\ntype BaseDataViewProps<T> = {\n  columns: DataViewColumn<T>[]\n  data: T[]\n  pagination?: PaginationControlProps\n  itemMenu?: (item: T) => React.ReactNode\n  emptyState?: () => React.ReactNode\n  footer?: () => Partial<Record<FooterKeys<T>, React.ReactNode>>\n  isFetching?: boolean\n  /**\n   * When true, hides the select-all header checkbox (DataTable) and the\n   * select-all row (DataCards). Only meaningful with `selectionMode: 'multiple'`.\n   * Per-row checkboxes are unaffected.\n   */\n  hideSelectAll?: boolean\n}\n\ntype NoSelectionProps = {\n  onSelect?: undefined\n  onSelectAll?: undefined\n  getIsItemSelected?: undefined\n  selectionMode?: undefined\n}\n\ntype SingleSelectionProps<T> = {\n  selectionMode: 'single'\n  onSelect: (item: T, checked: boolean) => void\n  onSelectAll?: undefined\n  getIsItemSelected?: (item: T) => boolean\n}\n\ntype MultipleSelectionProps<T> = {\n  selectionMode?: 'multiple'\n  onSelect: (item: T, checked: boolean) => void\n  /**\n   * Called when the select-all checkbox is toggled.\n   * The header checkbox state reflects only the currently visible `data` array.\n   * With pagination, consumers decide whether to select all data or only the visible page.\n   * `visibleData` is the current page's data array for reference.\n   */\n  onSelectAll?: (checked: boolean, visibleData: T[]) => void\n  /**\n   * Required for multi-select. Returns whether a given item is currently selected.\n   * Use a stable identifier from the item (e.g. item.id) rather than array index.\n   */\n  getIsItemSelected: (item: T) => boolean\n}\n\n/** @internal */\nexport type useDataViewProp<T> = BaseDataViewProps<T> &\n  (NoSelectionProps | SingleSelectionProps<T> | MultipleSelectionProps<T>)\n\n/** @internal */\nexport type useDataViewPropReturn<T> = {\n  pagination?: PaginationControlProps\n  data: T[]\n  columns: DataViewColumn<T>[]\n  itemMenu?: (item: T) => React.ReactNode\n  onSelect?: (item: T, checked: boolean) => void\n  onSelectAll?: (checked: boolean, visibleData: T[]) => void\n  getIsItemSelected?: (item: T) => boolean\n  hideSelectAll?: boolean\n  emptyState?: () => React.ReactNode\n  footer?: () => Partial<Record<FooterKeys<T>, React.ReactNode>>\n  isFetching?: boolean\n  selectionMode?: SelectionMode\n}\n\n/** @internal */\nexport const useDataView = <T>({\n  columns,\n  data,\n  itemMenu,\n  onSelect,\n  onSelectAll,\n  getIsItemSelected,\n  hideSelectAll,\n  pagination,\n  emptyState,\n  footer,\n  isFetching,\n  selectionMode,\n}: useDataViewProp<T>): useDataViewPropReturn<T> => {\n  const dataViewProps = useMemo(() => {\n    return {\n      pagination,\n      data,\n      columns,\n      itemMenu,\n      onSelect,\n      onSelectAll,\n      getIsItemSelected,\n      hideSelectAll,\n      emptyState,\n      footer,\n      isFetching,\n      selectionMode,\n    }\n  }, [\n    pagination,\n    data,\n    columns,\n    itemMenu,\n    onSelect,\n    onSelectAll,\n    getIsItemSelected,\n    hideSelectAll,\n    emptyState,\n    footer,\n    isFetching,\n    selectionMode,\n  ])\n\n  return dataViewProps\n}\n"],"names":["useDataView","columns","data","itemMenu","onSelect","onSelectAll","getIsItemSelected","hideSelectAll","pagination","emptyState","footer","isFetching","selectionMode","useMemo"],"mappings":";AA0FO,MAAMA,IAAc,CAAI;AAAA,EAC7B,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,YAAAC;AAAA,EACA,YAAAC;AAAA,EACA,QAAAC;AAAA,EACA,YAAAC;AAAA,EACA,eAAAC;AACF,MACwBC,EAAQ,OACrB;AAAA,EACL,YAAAL;AAAA,EACA,MAAAN;AAAA,EACA,SAAAD;AAAA,EACA,UAAAE;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,YAAAE;AAAA,EACA,QAAAC;AAAA,EACA,YAAAC;AAAA,EACA,eAAAC;AAAA,IAED;AAAA,EACDJ;AAAA,EACAN;AAAA,EACAD;AAAA,EACAE;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,EACAE;AAAA,EACAC;AAAA,EACAC;AAAA,EACAC;AAAA,CACD;"}

package/dist/components/Common/DataView/useSelectionState.d.ts

@@ -1,5 +1,6 @@
 type SelectionState = {
     allSelected: boolean;
 };
+/** @internal */
 export declare function useSelectionState<T>(data: T[], getIsItemSelected?: (item: T) => boolean): SelectionState;
 export {};

package/dist/components/Common/DataView/useSelectionState.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSelectionState.js","sources":["../../../../src/components/Common/DataView/useSelectionState.ts"],"sourcesContent":["import { useMemo } from 'react'\n\ntype SelectionState = {\n  allSelected: boolean\n}\n\nexport function useSelectionState<T>(\n  data: T[],\n  getIsItemSelected?: (item: T) => boolean,\n): SelectionState {\n  return useMemo(() => {\n    if (data.length === 0 || !getIsItemSelected) {\n      return { allSelected: false }\n    }\n\n    const allSelected = data.every(getIsItemSelected)\n\n    return { allSelected }\n  }, [data, getIsItemSelected])\n}\n"],"names":["useSelectionState","data","getIsItemSelected","useMemo"],"mappings":";AAMO,SAASA,EACdC,GACAC,GACgB;AAChB,SAAOC,EAAQ,MACTF,EAAK,WAAW,KAAK,CAACC,IACjB,EAAE,aAAa,GAAA,IAKjB,EAAE,aAFWD,EAAK,MAAMC,CAAiB,EAEvC,GACR,CAACD,GAAMC,CAAiB,CAAC;AAC9B;"}
+{"version":3,"file":"useSelectionState.js","sources":["../../../../src/components/Common/DataView/useSelectionState.ts"],"sourcesContent":["import { useMemo } from 'react'\n\ntype SelectionState = {\n  allSelected: boolean\n}\n\n/** @internal */\nexport function useSelectionState<T>(\n  data: T[],\n  getIsItemSelected?: (item: T) => boolean,\n): SelectionState {\n  return useMemo(() => {\n    if (data.length === 0 || !getIsItemSelected) {\n      return { allSelected: false }\n    }\n\n    const allSelected = data.every(getIsItemSelected)\n\n    return { allSelected }\n  }, [data, getIsItemSelected])\n}\n"],"names":["useSelectionState","data","getIsItemSelected","useMemo"],"mappings":";AAOO,SAASA,EACdC,GACAC,GACgB;AAChB,SAAOC,EAAQ,MACTF,EAAK,WAAW,KAAK,CAACC,IACjB,EAAE,aAAa,GAAA,IAKjB,EAAE,aAFWD,EAAK,MAAMC,CAAiB,EAEvC,GACR,CAACD,GAAMC,CAAiB,CAAC;AAC9B;"}

package/dist/components/Common/DateRangeFilter/DateRangeFilter.d.ts

@@ -15,5 +15,6 @@ interface DateRangeFilterProps {
     maxEndDate?: Date;
     minStartDate?: Date;
 }
+/** @internal */
 export declare const DateRangeFilter: ({ startDate, endDate, onStartDateChange, onEndDateChange, onClear, startDateLabel, endDateLabel, applyLabel, cancelLabel, resetLabel, selectDatesLabel, triggerLabel, isFilterActive, maxEndDate, minStartDate, }: DateRangeFilterProps) => import("react").JSX.Element;
 export {};

package/dist/components/Common/DateRangeFilter/DateRangeFilter.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateRangeFilter.js","sources":["../../../../src/components/Common/DateRangeFilter/DateRangeFilter.tsx"],"sourcesContent":["import { useState, useRef, useCallback, useMemo } from 'react'\nimport { Dialog, Popover } from 'react-aria-components'\nimport styles from './DateRangeFilter.module.scss'\nimport type { DateRange } from '@/components/Common/UI/DateRangePicker/DateRangePickerTypes'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useTheme } from '@/contexts/ThemeProvider'\nimport FilterFunnelIcon from '@/assets/icons/filter-funnel.svg?react'\n\nconst formatFilterDate = (date: Date): string =>\n  date.toLocaleDateString('en-US', { month: 'short', day: 'numeric' })\n\ninterface DateRangeFilterProps {\n  startDate: Date | null\n  endDate: Date | null\n  onStartDateChange: (date: Date | null) => void\n  onEndDateChange: (date: Date | null) => void\n  onClear: () => void\n  startDateLabel: string\n  endDateLabel: string\n  applyLabel: string\n  cancelLabel: string\n  resetLabel: string\n  selectDatesLabel: string\n  triggerLabel: string\n  isFilterActive: boolean\n  maxEndDate?: Date\n  minStartDate?: Date\n}\n\nexport const DateRangeFilter = ({\n  startDate,\n  endDate,\n  onStartDateChange,\n  onEndDateChange,\n  onClear,\n  startDateLabel,\n  endDateLabel,\n  applyLabel,\n  cancelLabel,\n  resetLabel,\n  selectDatesLabel,\n  triggerLabel,\n  isFilterActive,\n  maxEndDate,\n  minStartDate,\n}: DateRangeFilterProps) => {\n  const { Button, DateRangePicker } = useComponentContext()\n  const { container } = useTheme()\n\n  const [isOpen, setIsOpen] = useState(false)\n  const [draftRange, setDraftRange] = useState<DateRange | null>(null)\n  const triggerRef = useRef<HTMLButtonElement>(null)\n\n  const handleOpen = useCallback(() => {\n    const range = startDate && endDate ? { start: startDate, end: endDate } : null\n    setDraftRange(range)\n    setIsOpen(true)\n  }, [startDate, endDate])\n\n  const handleClose = useCallback(() => {\n    setIsOpen(false)\n  }, [])\n\n  const handleApply = useCallback(() => {\n    if (draftRange) {\n      onStartDateChange(draftRange.start)\n      onEndDateChange(draftRange.end)\n    } else {\n      onClear()\n    }\n    setIsOpen(false)\n  }, [draftRange, onStartDateChange, onEndDateChange, onClear])\n\n  const handleReset = useCallback(() => {\n    setDraftRange(null)\n  }, [])\n\n  const handleRangeChange = useCallback((range: DateRange | null) => {\n    setDraftRange(range)\n  }, [])\n\n  const filterDateLabel = useMemo(() => {\n    if (!isFilterActive || !startDate || !endDate) return null\n    return `${formatFilterDate(startDate)} – ${formatFilterDate(endDate)}`\n  }, [isFilterActive, startDate, endDate])\n\n  const triggerButton = (\n    <Button\n      buttonRef={triggerRef}\n      aria-label={triggerLabel}\n      aria-haspopup=\"dialog\"\n      aria-expanded={isOpen}\n      onClick={handleOpen}\n      variant=\"secondary\"\n      icon={<FilterFunnelIcon />}\n      className={styles.triggerButton}\n    >\n      {filterDateLabel ?? selectDatesLabel}\n    </Button>\n  )\n\n  return (\n    <>\n      {triggerButton}\n\n      <Popover\n        UNSTABLE_portalContainer={container.current ?? undefined}\n        isOpen={isOpen}\n        onOpenChange={open => {\n          if (!open) handleClose()\n        }}\n        triggerRef={triggerRef}\n        placement=\"bottom end\"\n        offset={8}\n        shouldUpdatePosition\n      >\n        <Dialog className={styles.dialog} aria-label={`${startDateLabel} – ${endDateLabel}`}>\n          <div className={styles.popoverContent}>\n            <DateRangePicker\n              label={`${startDateLabel} – ${endDateLabel}`}\n              shouldVisuallyHideLabel\n              value={draftRange}\n              onChange={handleRangeChange}\n              startDateLabel={startDateLabel}\n              endDateLabel={endDateLabel}\n              minValue={minStartDate}\n              maxValue={maxEndDate}\n            />\n          </div>\n\n          <div className={styles.popoverFooter}>\n            <Flex gap={8} justifyContent=\"space-between\">\n              <Button variant=\"tertiary\" onClick={handleReset}>\n                {resetLabel}\n              </Button>\n              <Flex gap={8} justifyContent=\"flex-end\">\n                <Button variant=\"secondary\" onClick={handleClose}>\n                  {cancelLabel}\n                </Button>\n                <Button variant=\"primary\" onClick={handleApply}>\n                  {applyLabel}\n                </Button>\n              </Flex>\n            </Flex>\n          </div>\n        </Dialog>\n      </Popover>\n    </>\n  )\n}\n"],"names":["formatFilterDate","date","DateRangeFilter","startDate","endDate","onStartDateChange","onEndDateChange","onClear","startDateLabel","endDateLabel","applyLabel","cancelLabel","resetLabel","selectDatesLabel","triggerLabel","isFilterActive","maxEndDate","minStartDate","Button","DateRangePicker","useComponentContext","container","useTheme","isOpen","setIsOpen","useState","draftRange","setDraftRange","triggerRef","useRef","handleOpen","useCallback","handleClose","handleApply","handleReset","handleRangeChange","range","filterDateLabel","useMemo","triggerButton","jsx","FilterFunnelIcon","styles","jsxs","Fragment","Popover","open","Dialog","Flex"],"mappings":";;;;;;;;;AASA,MAAMA,IAAmB,CAACC,MACxBA,EAAK,mBAAmB,SAAS,EAAE,OAAO,SAAS,KAAK,WAAW,GAoBxDC,KAAkB,CAAC;AAAA,EAC9B,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,SAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC;AAAA,EACA,aAAAC;AAAA,EACA,YAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,cAAAC;AACF,MAA4B;AAC1B,QAAM,EAAE,QAAAC,GAAQ,iBAAAC,EAAA,IAAoBC,EAAA,GAC9B,EAAE,WAAAC,EAAA,IAAcC,EAAA,GAEhB,CAACC,GAAQC,CAAS,IAAIC,EAAS,EAAK,GACpC,CAACC,GAAYC,CAAa,IAAIF,EAA2B,IAAI,GAC7DG,IAAaC,EAA0B,IAAI,GAE3CC,IAAaC,EAAY,MAAM;AAEnC,IAAAJ,EADcxB,KAAaC,IAAU,EAAE,OAAOD,GAAW,KAAKC,MAAY,IACvD,GACnBoB,EAAU,EAAI;AAAA,EAChB,GAAG,CAACrB,GAAWC,CAAO,CAAC,GAEjB4B,IAAcD,EAAY,MAAM;AACpC,IAAAP,EAAU,EAAK;AAAA,EACjB,GAAG,CAAA,CAAE,GAECS,IAAcF,EAAY,MAAM;AACpC,IAAIL,KACFrB,EAAkBqB,EAAW,KAAK,GAClCpB,EAAgBoB,EAAW,GAAG,KAE9BnB,EAAA,GAEFiB,EAAU,EAAK;AAAA,EACjB,GAAG,CAACE,GAAYrB,GAAmBC,GAAiBC,CAAO,CAAC,GAEtD2B,IAAcH,EAAY,MAAM;AACpC,IAAAJ,EAAc,IAAI;AAAA,EACpB,GAAG,CAAA,CAAE,GAECQ,IAAoBJ,EAAY,CAACK,MAA4B;AACjE,IAAAT,EAAcS,CAAK;AAAA,EACrB,GAAG,CAAA,CAAE,GAECC,IAAkBC,EAAQ,MAC1B,CAACvB,KAAkB,CAACZ,KAAa,CAACC,IAAgB,OAC/C,GAAGJ,EAAiBG,CAAS,CAAC,MAAMH,EAAiBI,CAAO,CAAC,IACnE,CAACW,GAAgBZ,GAAWC,CAAO,CAAC,GAEjCmC,IACJ,gBAAAC;AAAA,IAACtB;AAAA,IAAA;AAAA,MACC,WAAWU;AAAA,MACX,cAAYd;AAAA,MACZ,iBAAc;AAAA,MACd,iBAAeS;AAAA,MACf,SAASO;AAAA,MACT,SAAQ;AAAA,MACR,wBAAOW,GAAA,EAAiB;AAAA,MACxB,WAAWC,EAAO;AAAA,MAEjB,UAAAL,KAAmBxB;AAAA,IAAA;AAAA,EAAA;AAIxB,SACE,gBAAA8B,EAAAC,GAAA,EACG,UAAA;AAAA,IAAAL;AAAA,IAED,gBAAAC;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,0BAA0BxB,EAAU,WAAW;AAAA,QAC/C,QAAAE;AAAA,QACA,cAAc,CAAAuB,MAAQ;AACpB,UAAKA,KAAMd,EAAA;AAAA,QACb;AAAA,QACA,YAAAJ;AAAA,QACA,WAAU;AAAA,QACV,QAAQ;AAAA,QACR,sBAAoB;AAAA,QAEpB,UAAA,gBAAAe,EAACI,GAAA,EAAO,WAAWL,EAAO,QAAQ,cAAY,GAAGlC,CAAc,MAAMC,CAAY,IAC/E,UAAA;AAAA,UAAA,gBAAA+B,EAAC,OAAA,EAAI,WAAWE,EAAO,gBACrB,UAAA,gBAAAF;AAAA,YAACrB;AAAA,YAAA;AAAA,cACC,OAAO,GAAGX,CAAc,MAAMC,CAAY;AAAA,cAC1C,yBAAuB;AAAA,cACvB,OAAOiB;AAAA,cACP,UAAUS;AAAA,cACV,gBAAA3B;AAAA,cACA,cAAAC;AAAA,cACA,UAAUQ;AAAA,cACV,UAAUD;AAAA,YAAA;AAAA,UAAA,GAEd;AAAA,UAEA,gBAAAwB,EAAC,OAAA,EAAI,WAAWE,EAAO,eACrB,4BAACM,GAAA,EAAK,KAAK,GAAG,gBAAe,iBAC3B,UAAA;AAAA,YAAA,gBAAAR,EAACtB,GAAA,EAAO,SAAQ,YAAW,SAASgB,GACjC,UAAAtB,GACH;AAAA,YACA,gBAAA+B,EAACK,GAAA,EAAK,KAAK,GAAG,gBAAe,YAC3B,UAAA;AAAA,cAAA,gBAAAR,EAACtB,GAAA,EAAO,SAAQ,aAAY,SAASc,GAClC,UAAArB,GACH;AAAA,gCACCO,GAAA,EAAO,SAAQ,WAAU,SAASe,GAChC,UAAAvB,EAAA,CACH;AAAA,YAAA,EAAA,CACF;AAAA,UAAA,EAAA,CACF,EAAA,CACF;AAAA,QAAA,EAAA,CACF;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,GACF;AAEJ;"}
+{"version":3,"file":"DateRangeFilter.js","sources":["../../../../src/components/Common/DateRangeFilter/DateRangeFilter.tsx"],"sourcesContent":["import { useState, useRef, useCallback, useMemo } from 'react'\nimport { Dialog, Popover } from 'react-aria-components'\nimport styles from './DateRangeFilter.module.scss'\nimport type { DateRange } from '@/components/Common/UI/DateRangePicker/DateRangePickerTypes'\nimport { Flex } from '@/components/Common/Flex/Flex'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useTheme } from '@/contexts/ThemeProvider'\nimport FilterFunnelIcon from '@/assets/icons/filter-funnel.svg?react'\n\nconst formatFilterDate = (date: Date): string =>\n  date.toLocaleDateString('en-US', { month: 'short', day: 'numeric' })\n\ninterface DateRangeFilterProps {\n  startDate: Date | null\n  endDate: Date | null\n  onStartDateChange: (date: Date | null) => void\n  onEndDateChange: (date: Date | null) => void\n  onClear: () => void\n  startDateLabel: string\n  endDateLabel: string\n  applyLabel: string\n  cancelLabel: string\n  resetLabel: string\n  selectDatesLabel: string\n  triggerLabel: string\n  isFilterActive: boolean\n  maxEndDate?: Date\n  minStartDate?: Date\n}\n\n/** @internal */\nexport const DateRangeFilter = ({\n  startDate,\n  endDate,\n  onStartDateChange,\n  onEndDateChange,\n  onClear,\n  startDateLabel,\n  endDateLabel,\n  applyLabel,\n  cancelLabel,\n  resetLabel,\n  selectDatesLabel,\n  triggerLabel,\n  isFilterActive,\n  maxEndDate,\n  minStartDate,\n}: DateRangeFilterProps) => {\n  const { Button, DateRangePicker } = useComponentContext()\n  const { container } = useTheme()\n\n  const [isOpen, setIsOpen] = useState(false)\n  const [draftRange, setDraftRange] = useState<DateRange | null>(null)\n  const triggerRef = useRef<HTMLButtonElement>(null)\n\n  const handleOpen = useCallback(() => {\n    const range = startDate && endDate ? { start: startDate, end: endDate } : null\n    setDraftRange(range)\n    setIsOpen(true)\n  }, [startDate, endDate])\n\n  const handleClose = useCallback(() => {\n    setIsOpen(false)\n  }, [])\n\n  const handleApply = useCallback(() => {\n    if (draftRange) {\n      onStartDateChange(draftRange.start)\n      onEndDateChange(draftRange.end)\n    } else {\n      onClear()\n    }\n    setIsOpen(false)\n  }, [draftRange, onStartDateChange, onEndDateChange, onClear])\n\n  const handleReset = useCallback(() => {\n    setDraftRange(null)\n  }, [])\n\n  const handleRangeChange = useCallback((range: DateRange | null) => {\n    setDraftRange(range)\n  }, [])\n\n  const filterDateLabel = useMemo(() => {\n    if (!isFilterActive || !startDate || !endDate) return null\n    return `${formatFilterDate(startDate)} – ${formatFilterDate(endDate)}`\n  }, [isFilterActive, startDate, endDate])\n\n  const triggerButton = (\n    <Button\n      buttonRef={triggerRef}\n      aria-label={triggerLabel}\n      aria-haspopup=\"dialog\"\n      aria-expanded={isOpen}\n      onClick={handleOpen}\n      variant=\"secondary\"\n      icon={<FilterFunnelIcon />}\n      className={styles.triggerButton}\n    >\n      {filterDateLabel ?? selectDatesLabel}\n    </Button>\n  )\n\n  return (\n    <>\n      {triggerButton}\n\n      <Popover\n        UNSTABLE_portalContainer={container.current ?? undefined}\n        isOpen={isOpen}\n        onOpenChange={open => {\n          if (!open) handleClose()\n        }}\n        triggerRef={triggerRef}\n        placement=\"bottom end\"\n        offset={8}\n        shouldUpdatePosition\n      >\n        <Dialog className={styles.dialog} aria-label={`${startDateLabel} – ${endDateLabel}`}>\n          <div className={styles.popoverContent}>\n            <DateRangePicker\n              label={`${startDateLabel} – ${endDateLabel}`}\n              shouldVisuallyHideLabel\n              value={draftRange}\n              onChange={handleRangeChange}\n              startDateLabel={startDateLabel}\n              endDateLabel={endDateLabel}\n              minValue={minStartDate}\n              maxValue={maxEndDate}\n            />\n          </div>\n\n          <div className={styles.popoverFooter}>\n            <Flex gap={8} justifyContent=\"space-between\">\n              <Button variant=\"tertiary\" onClick={handleReset}>\n                {resetLabel}\n              </Button>\n              <Flex gap={8} justifyContent=\"flex-end\">\n                <Button variant=\"secondary\" onClick={handleClose}>\n                  {cancelLabel}\n                </Button>\n                <Button variant=\"primary\" onClick={handleApply}>\n                  {applyLabel}\n                </Button>\n              </Flex>\n            </Flex>\n          </div>\n        </Dialog>\n      </Popover>\n    </>\n  )\n}\n"],"names":["formatFilterDate","date","DateRangeFilter","startDate","endDate","onStartDateChange","onEndDateChange","onClear","startDateLabel","endDateLabel","applyLabel","cancelLabel","resetLabel","selectDatesLabel","triggerLabel","isFilterActive","maxEndDate","minStartDate","Button","DateRangePicker","useComponentContext","container","useTheme","isOpen","setIsOpen","useState","draftRange","setDraftRange","triggerRef","useRef","handleOpen","useCallback","handleClose","handleApply","handleReset","handleRangeChange","range","filterDateLabel","useMemo","triggerButton","jsx","FilterFunnelIcon","styles","jsxs","Fragment","Popover","open","Dialog","Flex"],"mappings":";;;;;;;;;AASA,MAAMA,IAAmB,CAACC,MACxBA,EAAK,mBAAmB,SAAS,EAAE,OAAO,SAAS,KAAK,WAAW,GAqBxDC,KAAkB,CAAC;AAAA,EAC9B,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,SAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC;AAAA,EACA,aAAAC;AAAA,EACA,YAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,cAAAC;AACF,MAA4B;AAC1B,QAAM,EAAE,QAAAC,GAAQ,iBAAAC,EAAA,IAAoBC,EAAA,GAC9B,EAAE,WAAAC,EAAA,IAAcC,EAAA,GAEhB,CAACC,GAAQC,CAAS,IAAIC,EAAS,EAAK,GACpC,CAACC,GAAYC,CAAa,IAAIF,EAA2B,IAAI,GAC7DG,IAAaC,EAA0B,IAAI,GAE3CC,IAAaC,EAAY,MAAM;AAEnC,IAAAJ,EADcxB,KAAaC,IAAU,EAAE,OAAOD,GAAW,KAAKC,MAAY,IACvD,GACnBoB,EAAU,EAAI;AAAA,EAChB,GAAG,CAACrB,GAAWC,CAAO,CAAC,GAEjB4B,IAAcD,EAAY,MAAM;AACpC,IAAAP,EAAU,EAAK;AAAA,EACjB,GAAG,CAAA,CAAE,GAECS,IAAcF,EAAY,MAAM;AACpC,IAAIL,KACFrB,EAAkBqB,EAAW,KAAK,GAClCpB,EAAgBoB,EAAW,GAAG,KAE9BnB,EAAA,GAEFiB,EAAU,EAAK;AAAA,EACjB,GAAG,CAACE,GAAYrB,GAAmBC,GAAiBC,CAAO,CAAC,GAEtD2B,IAAcH,EAAY,MAAM;AACpC,IAAAJ,EAAc,IAAI;AAAA,EACpB,GAAG,CAAA,CAAE,GAECQ,IAAoBJ,EAAY,CAACK,MAA4B;AACjE,IAAAT,EAAcS,CAAK;AAAA,EACrB,GAAG,CAAA,CAAE,GAECC,IAAkBC,EAAQ,MAC1B,CAACvB,KAAkB,CAACZ,KAAa,CAACC,IAAgB,OAC/C,GAAGJ,EAAiBG,CAAS,CAAC,MAAMH,EAAiBI,CAAO,CAAC,IACnE,CAACW,GAAgBZ,GAAWC,CAAO,CAAC,GAEjCmC,IACJ,gBAAAC;AAAA,IAACtB;AAAA,IAAA;AAAA,MACC,WAAWU;AAAA,MACX,cAAYd;AAAA,MACZ,iBAAc;AAAA,MACd,iBAAeS;AAAA,MACf,SAASO;AAAA,MACT,SAAQ;AAAA,MACR,wBAAOW,GAAA,EAAiB;AAAA,MACxB,WAAWC,EAAO;AAAA,MAEjB,UAAAL,KAAmBxB;AAAA,IAAA;AAAA,EAAA;AAIxB,SACE,gBAAA8B,EAAAC,GAAA,EACG,UAAA;AAAA,IAAAL;AAAA,IAED,gBAAAC;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,0BAA0BxB,EAAU,WAAW;AAAA,QAC/C,QAAAE;AAAA,QACA,cAAc,CAAAuB,MAAQ;AACpB,UAAKA,KAAMd,EAAA;AAAA,QACb;AAAA,QACA,YAAAJ;AAAA,QACA,WAAU;AAAA,QACV,QAAQ;AAAA,QACR,sBAAoB;AAAA,QAEpB,UAAA,gBAAAe,EAACI,GAAA,EAAO,WAAWL,EAAO,QAAQ,cAAY,GAAGlC,CAAc,MAAMC,CAAY,IAC/E,UAAA;AAAA,UAAA,gBAAA+B,EAAC,OAAA,EAAI,WAAWE,EAAO,gBACrB,UAAA,gBAAAF;AAAA,YAACrB;AAAA,YAAA;AAAA,cACC,OAAO,GAAGX,CAAc,MAAMC,CAAY;AAAA,cAC1C,yBAAuB;AAAA,cACvB,OAAOiB;AAAA,cACP,UAAUS;AAAA,cACV,gBAAA3B;AAAA,cACA,cAAAC;AAAA,cACA,UAAUQ;AAAA,cACV,UAAUD;AAAA,YAAA;AAAA,UAAA,GAEd;AAAA,UAEA,gBAAAwB,EAAC,OAAA,EAAI,WAAWE,EAAO,eACrB,4BAACM,GAAA,EAAK,KAAK,GAAG,gBAAe,iBAC3B,UAAA;AAAA,YAAA,gBAAAR,EAACtB,GAAA,EAAO,SAAQ,YAAW,SAASgB,GACjC,UAAAtB,GACH;AAAA,YACA,gBAAA+B,EAACK,GAAA,EAAK,KAAK,GAAG,gBAAe,YAC3B,UAAA;AAAA,cAAA,gBAAAR,EAACtB,GAAA,EAAO,SAAQ,aAAY,SAASc,GAClC,UAAArB,GACH;AAAA,gCACCO,GAAA,EAAO,SAAQ,WAAU,SAASe,GAChC,UAAAvB,EAAA,CACH;AAAA,YAAA,EAAA,CACF;AAAA,UAAA,EAAA,CACF,EAAA,CACF;AAAA,QAAA,EAAA,CACF;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,GACF;AAEJ;"}

package/dist/components/Common/DetailViewLayout/DetailViewLayout.d.ts

@@ -1,2 +1,3 @@
 import { DetailViewLayoutProps } from './DetailViewLayoutTypes';
+/** @internal */
 export declare function DetailViewLayout({ title, subtitle, onBack, backLabel, actions, tabs, selectedTabId, onTabChange, children, className, }: DetailViewLayoutProps): import("react").JSX.Element;

package/dist/components/Common/DetailViewLayout/DetailViewLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"DetailViewLayout.js","sources":["../../../../src/components/Common/DetailViewLayout/DetailViewLayout.tsx"],"sourcesContent":["import { useId } from 'react'\nimport classNames from 'classnames'\nimport type { DetailViewLayoutProps } from './DetailViewLayoutTypes'\nimport styles from './DetailViewLayout.module.scss'\nimport CaretLeftIcon from '@/assets/icons/caret-left.svg?react'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\nexport function DetailViewLayout({\n  title,\n  subtitle,\n  onBack,\n  backLabel,\n  actions,\n  tabs,\n  selectedTabId,\n  onTabChange,\n  children,\n  className,\n}: DetailViewLayoutProps) {\n  const { Button, Heading, Text, Tabs } = useComponentContext()\n  const headingId = useId()\n\n  return (\n    <section className={classNames(styles.root, className)} aria-labelledby={headingId}>\n      {onBack && (\n        <Button\n          variant=\"secondary\"\n          className={styles.backButton}\n          icon={<CaretLeftIcon aria-hidden=\"true\" />}\n          onClick={onBack}\n        >\n          {backLabel}\n        </Button>\n      )}\n\n      <div className={classNames(styles.pageHeader, subtitle && styles.hasSubtitle)}>\n        <div className={styles.titleGroup}>\n          <Heading as=\"h2\" styledAs=\"h2\" id={headingId}>\n            {title}\n          </Heading>\n          {subtitle && <Text variant=\"supporting\">{subtitle}</Text>}\n        </div>\n        {actions && <div className={styles.actions}>{actions}</div>}\n      </div>\n\n      {tabs !== undefined ? (\n        <Tabs\n          tabs={tabs}\n          selectedId={selectedTabId}\n          onSelectionChange={onTabChange}\n          aria-label={title}\n        />\n      ) : (\n        children\n      )}\n    </section>\n  )\n}\n"],"names":["DetailViewLayout","title","subtitle","onBack","backLabel","actions","tabs","selectedTabId","onTabChange","children","className","Button","Heading","Text","Tabs","useComponentContext","headingId","useId","jsxs","classNames","styles","jsx","CaretLeftIcon"],"mappings":";;;;;;AAOO,SAASA,EAAiB;AAAA,EAC/B,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,eAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AACF,GAA0B;AACxB,QAAM,EAAE,QAAAC,GAAQ,SAAAC,GAAS,MAAAC,GAAM,MAAAC,EAAA,IAASC,EAAA,GAClCC,IAAYC,EAAA;AAElB,SACE,gBAAAC,EAAC,aAAQ,WAAWC,EAAWC,EAAO,MAAMV,CAAS,GAAG,mBAAiBM,GACtE,UAAA;AAAA,IAAAb,KACC,gBAAAkB;AAAA,MAACV;AAAA,MAAA;AAAA,QACC,SAAQ;AAAA,QACR,WAAWS,EAAO;AAAA,QAClB,MAAM,gBAAAC,EAACC,GAAA,EAAc,eAAY,OAAA,CAAO;AAAA,QACxC,SAASnB;AAAA,QAER,UAAAC;AAAA,MAAA;AAAA,IAAA;AAAA,IAIL,gBAAAc,EAAC,SAAI,WAAWC,EAAWC,EAAO,YAAYlB,KAAYkB,EAAO,WAAW,GAC1E,UAAA;AAAA,MAAA,gBAAAF,EAAC,OAAA,EAAI,WAAWE,EAAO,YACrB,UAAA;AAAA,QAAA,gBAAAC,EAACT,KAAQ,IAAG,MAAK,UAAS,MAAK,IAAII,GAChC,UAAAf,EAAA,CACH;AAAA,QACCC,KAAY,gBAAAmB,EAACR,GAAA,EAAK,SAAQ,cAAc,UAAAX,EAAA,CAAS;AAAA,MAAA,GACpD;AAAA,MACCG,KAAW,gBAAAgB,EAAC,OAAA,EAAI,WAAWD,EAAO,SAAU,UAAAf,EAAA,CAAQ;AAAA,IAAA,GACvD;AAAA,IAECC,MAAS,SACR,gBAAAe;AAAA,MAACP;AAAA,MAAA;AAAA,QACC,MAAAR;AAAA,QACA,YAAYC;AAAA,QACZ,mBAAmBC;AAAA,QACnB,cAAYP;AAAA,MAAA;AAAA,IAAA,IAGdQ;AAAA,EAAA,GAEJ;AAEJ;"}
+{"version":3,"file":"DetailViewLayout.js","sources":["../../../../src/components/Common/DetailViewLayout/DetailViewLayout.tsx"],"sourcesContent":["import { useId } from 'react'\nimport classNames from 'classnames'\nimport type { DetailViewLayoutProps } from './DetailViewLayoutTypes'\nimport styles from './DetailViewLayout.module.scss'\nimport CaretLeftIcon from '@/assets/icons/caret-left.svg?react'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\n/** @internal */\nexport function DetailViewLayout({\n  title,\n  subtitle,\n  onBack,\n  backLabel,\n  actions,\n  tabs,\n  selectedTabId,\n  onTabChange,\n  children,\n  className,\n}: DetailViewLayoutProps) {\n  const { Button, Heading, Text, Tabs } = useComponentContext()\n  const headingId = useId()\n\n  return (\n    <section className={classNames(styles.root, className)} aria-labelledby={headingId}>\n      {onBack && (\n        <Button\n          variant=\"secondary\"\n          className={styles.backButton}\n          icon={<CaretLeftIcon aria-hidden=\"true\" />}\n          onClick={onBack}\n        >\n          {backLabel}\n        </Button>\n      )}\n\n      <div className={classNames(styles.pageHeader, subtitle && styles.hasSubtitle)}>\n        <div className={styles.titleGroup}>\n          <Heading as=\"h2\" styledAs=\"h2\" id={headingId}>\n            {title}\n          </Heading>\n          {subtitle && <Text variant=\"supporting\">{subtitle}</Text>}\n        </div>\n        {actions && <div className={styles.actions}>{actions}</div>}\n      </div>\n\n      {tabs !== undefined ? (\n        <Tabs\n          tabs={tabs}\n          selectedId={selectedTabId}\n          onSelectionChange={onTabChange}\n          aria-label={title}\n        />\n      ) : (\n        children\n      )}\n    </section>\n  )\n}\n"],"names":["DetailViewLayout","title","subtitle","onBack","backLabel","actions","tabs","selectedTabId","onTabChange","children","className","Button","Heading","Text","Tabs","useComponentContext","headingId","useId","jsxs","classNames","styles","jsx","CaretLeftIcon"],"mappings":";;;;;;AAQO,SAASA,EAAiB;AAAA,EAC/B,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,eAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AACF,GAA0B;AACxB,QAAM,EAAE,QAAAC,GAAQ,SAAAC,GAAS,MAAAC,GAAM,MAAAC,EAAA,IAASC,EAAA,GAClCC,IAAYC,EAAA;AAElB,SACE,gBAAAC,EAAC,aAAQ,WAAWC,EAAWC,EAAO,MAAMV,CAAS,GAAG,mBAAiBM,GACtE,UAAA;AAAA,IAAAb,KACC,gBAAAkB;AAAA,MAACV;AAAA,MAAA;AAAA,QACC,SAAQ;AAAA,QACR,WAAWS,EAAO;AAAA,QAClB,MAAM,gBAAAC,EAACC,GAAA,EAAc,eAAY,OAAA,CAAO;AAAA,QACxC,SAASnB;AAAA,QAER,UAAAC;AAAA,MAAA;AAAA,IAAA;AAAA,IAIL,gBAAAc,EAAC,SAAI,WAAWC,EAAWC,EAAO,YAAYlB,KAAYkB,EAAO,WAAW,GAC1E,UAAA;AAAA,MAAA,gBAAAF,EAAC,OAAA,EAAI,WAAWE,EAAO,YACrB,UAAA;AAAA,QAAA,gBAAAC,EAACT,KAAQ,IAAG,MAAK,UAAS,MAAK,IAAII,GAChC,UAAAf,EAAA,CACH;AAAA,QACCC,KAAY,gBAAAmB,EAACR,GAAA,EAAK,SAAQ,cAAc,UAAAX,EAAA,CAAS;AAAA,MAAA,GACpD;AAAA,MACCG,KAAW,gBAAAgB,EAAC,OAAA,EAAI,WAAWD,EAAO,SAAU,UAAAf,EAAA,CAAQ;AAAA,IAAA,GACvD;AAAA,IAECC,MAAS,SACR,gBAAAe;AAAA,MAACP;AAAA,MAAA;AAAA,QACC,MAAAR;AAAA,QACA,YAAYC;AAAA,QACZ,mBAAmBC;AAAA,QACnB,cAAYP;AAAA,MAAA;AAAA,IAAA,IAGdQ;AAAA,EAAA,GAEJ;AAEJ;"}

package/dist/components/Common/DetailViewLayout/DetailViewLayoutTypes.d.ts

@@ -36,5 +36,6 @@ type BaseDetailViewLayoutProps = {
      */
     className?: string;
 };
+/** @internal */
 export type DetailViewLayoutProps = BaseDetailViewLayoutProps & BackNavigation & TabbedContent;
 export {};

package/dist/components/Common/DocumentList/DocumentList.d.ts

@@ -1,7 +1,12 @@
+/** @internal */
 export interface FormData {
+    /** Unique identifier for the form. */
     uuid: string;
+    /** Display title shown in the list row. */
     title?: string;
+    /** Secondary description shown beneath the title. */
     description?: string;
+    /** Whether the form still requires a signature. */
     requires_signing?: boolean;
 }
 interface DocumentListProps {
@@ -22,5 +27,6 @@ interface DocumentListProps {
     emptyStateLabel: string;
     errorLabel: string;
 }
+/** @internal */
 declare function DocumentList({ forms, canSign, onRequestSign, withError, label, columnLabels, statusLabels, emptyStateLabel, errorLabel, }: DocumentListProps): import("react").JSX.Element;
 export { DocumentList };

package/dist/components/Common/DocumentList/DocumentList.js.map

@@ -1 +1 @@
-{"version":3,"file":"DocumentList.js","sources":["../../../../src/components/Common/DocumentList/DocumentList.tsx"],"sourcesContent":["import { DataView, useDataView } from '../DataView'\nimport { EmptyData } from '../EmptyData/EmptyData'\nimport styles from './DocumentList.module.scss'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\nexport interface FormData {\n  uuid: string\n  title?: string\n  description?: string\n  requires_signing?: boolean\n}\n\ninterface DocumentListProps {\n  forms: FormData[]\n  canSign?: boolean\n  onRequestSign?: (form: FormData) => void\n  withError?: boolean\n  label: string\n  columnLabels: {\n    form: string\n    action: string\n  }\n  statusLabels: {\n    signCta: string\n    notSigned: string\n    complete: string\n  }\n  emptyStateLabel: string\n  errorLabel: string\n}\n\nfunction DocumentList({\n  forms,\n  canSign = true,\n  onRequestSign,\n  withError = false,\n  label,\n  columnLabels,\n  statusLabels,\n  emptyStateLabel,\n  errorLabel,\n}: DocumentListProps) {\n  const Components = useComponentContext()\n  const { ...dataViewProps } = useDataView({\n    data: forms,\n    columns: [\n      {\n        title: columnLabels.form,\n        render: (form: FormData) => (\n          <>\n            <Components.Text weight=\"medium\" size=\"sm\">\n              {form.title}\n            </Components.Text>\n            <Components.Text variant=\"supporting\" size=\"sm\">\n              {form.description}\n            </Components.Text>\n          </>\n        ),\n      },\n      {\n        title: columnLabels.action,\n        render: (form: FormData) => (\n          <div className={styles.statusCell}>\n            {form.requires_signing ? (\n              canSign ? (\n                <Components.Button variant=\"secondary\" onClick={() => onRequestSign?.(form)}>\n                  {statusLabels.signCta}\n                </Components.Button>\n              ) : (\n                <Components.Badge status=\"warning\">{statusLabels.notSigned}</Components.Badge>\n              )\n            ) : (\n              <Components.Badge status=\"success\">{statusLabels.complete}</Components.Badge>\n            )}\n          </div>\n        ),\n      },\n    ],\n    emptyState: () =>\n      withError ? (\n        <Components.Text className={styles.documentListError}>{errorLabel}</Components.Text>\n      ) : (\n        <EmptyData title={emptyStateLabel} />\n      ),\n  })\n\n  return (\n    <div className={styles.documentList}>\n      <DataView label={label} {...dataViewProps} />\n    </div>\n  )\n}\n\nexport { DocumentList }\n"],"names":["DocumentList","forms","canSign","onRequestSign","withError","label","columnLabels","statusLabels","emptyStateLabel","errorLabel","Components","useComponentContext","dataViewProps","useDataView","form","jsxs","Fragment","jsx","styles","EmptyData","DataView"],"mappings":";;;;;;AA+BA,SAASA,EAAa;AAAA,EACpB,OAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,eAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,cAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,YAAAC;AACF,GAAsB;AACpB,QAAMC,IAAaC,EAAA,GACb,EAAE,GAAGC,EAAA,IAAkBC,EAAY;AAAA,IACvC,MAAMZ;AAAA,IACN,SAAS;AAAA,MACP;AAAA,QACE,OAAOK,EAAa;AAAA,QACpB,QAAQ,CAACQ,MACP,gBAAAC,EAAAC,GAAA,EACE,UAAA;AAAA,UAAA,gBAAAC,EAACP,EAAW,MAAX,EAAgB,QAAO,UAAS,MAAK,MACnC,YAAK,MAAA,CACR;AAAA,UACA,gBAAAO,EAACP,EAAW,MAAX,EAAgB,SAAQ,cAAa,MAAK,MACxC,UAAAI,EAAK,YAAA,CACR;AAAA,QAAA,EAAA,CACF;AAAA,MAAA;AAAA,MAGJ;AAAA,QACE,OAAOR,EAAa;AAAA,QACpB,QAAQ,CAACQ,wBACN,OAAA,EAAI,WAAWI,EAAO,YACpB,UAAAJ,EAAK,mBACJZ,IACE,gBAAAe,EAACP,EAAW,QAAX,EAAkB,SAAQ,aAAY,SAAS,MAAMP,IAAgBW,CAAI,GACvE,UAAAP,EAAa,SAChB,IAEA,gBAAAU,EAACP,EAAW,OAAX,EAAiB,QAAO,WAAW,UAAAH,EAAa,WAAU,IAG7D,gBAAAU,EAACP,EAAW,OAAX,EAAiB,QAAO,WAAW,UAAAH,EAAa,UAAS,EAAA,CAE9D;AAAA,MAAA;AAAA,IAEJ;AAAA,IAEF,YAAY,MACVH,IACE,gBAAAa,EAACP,EAAW,MAAX,EAAgB,WAAWQ,EAAO,mBAAoB,UAAAT,EAAA,CAAW,IAElE,gBAAAQ,EAACE,GAAA,EAAU,OAAOX,EAAA,CAAiB;AAAA,EAAA,CAExC;AAED,SACE,gBAAAS,EAAC,OAAA,EAAI,WAAWC,EAAO,cACrB,4BAACE,GAAA,EAAS,OAAAf,GAAe,GAAGO,EAAA,CAAe,EAAA,CAC7C;AAEJ;"}
+{"version":3,"file":"DocumentList.js","sources":["../../../../src/components/Common/DocumentList/DocumentList.tsx"],"sourcesContent":["import { DataView, useDataView } from '../DataView'\nimport { EmptyData } from '../EmptyData/EmptyData'\nimport styles from './DocumentList.module.scss'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\n/** @internal */\nexport interface FormData {\n  /** Unique identifier for the form. */\n  uuid: string\n  /** Display title shown in the list row. */\n  title?: string\n  /** Secondary description shown beneath the title. */\n  description?: string\n  /** Whether the form still requires a signature. */\n  requires_signing?: boolean\n}\n\ninterface DocumentListProps {\n  forms: FormData[]\n  canSign?: boolean\n  onRequestSign?: (form: FormData) => void\n  withError?: boolean\n  label: string\n  columnLabels: {\n    form: string\n    action: string\n  }\n  statusLabels: {\n    signCta: string\n    notSigned: string\n    complete: string\n  }\n  emptyStateLabel: string\n  errorLabel: string\n}\n\n/** @internal */\nfunction DocumentList({\n  forms,\n  canSign = true,\n  onRequestSign,\n  withError = false,\n  label,\n  columnLabels,\n  statusLabels,\n  emptyStateLabel,\n  errorLabel,\n}: DocumentListProps) {\n  const Components = useComponentContext()\n  const { ...dataViewProps } = useDataView({\n    data: forms,\n    columns: [\n      {\n        title: columnLabels.form,\n        render: (form: FormData) => (\n          <>\n            <Components.Text weight=\"medium\" size=\"sm\">\n              {form.title}\n            </Components.Text>\n            <Components.Text variant=\"supporting\" size=\"sm\">\n              {form.description}\n            </Components.Text>\n          </>\n        ),\n      },\n      {\n        title: columnLabels.action,\n        render: (form: FormData) => (\n          <div className={styles.statusCell}>\n            {form.requires_signing ? (\n              canSign ? (\n                <Components.Button variant=\"secondary\" onClick={() => onRequestSign?.(form)}>\n                  {statusLabels.signCta}\n                </Components.Button>\n              ) : (\n                <Components.Badge status=\"warning\">{statusLabels.notSigned}</Components.Badge>\n              )\n            ) : (\n              <Components.Badge status=\"success\">{statusLabels.complete}</Components.Badge>\n            )}\n          </div>\n        ),\n      },\n    ],\n    emptyState: () =>\n      withError ? (\n        <Components.Text className={styles.documentListError}>{errorLabel}</Components.Text>\n      ) : (\n        <EmptyData title={emptyStateLabel} />\n      ),\n  })\n\n  return (\n    <div className={styles.documentList}>\n      <DataView label={label} {...dataViewProps} />\n    </div>\n  )\n}\n\nexport { DocumentList }\n"],"names":["DocumentList","forms","canSign","onRequestSign","withError","label","columnLabels","statusLabels","emptyStateLabel","errorLabel","Components","useComponentContext","dataViewProps","useDataView","form","jsxs","Fragment","jsx","styles","EmptyData","DataView"],"mappings":";;;;;;AAqCA,SAASA,EAAa;AAAA,EACpB,OAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,eAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,cAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,YAAAC;AACF,GAAsB;AACpB,QAAMC,IAAaC,EAAA,GACb,EAAE,GAAGC,EAAA,IAAkBC,EAAY;AAAA,IACvC,MAAMZ;AAAA,IACN,SAAS;AAAA,MACP;AAAA,QACE,OAAOK,EAAa;AAAA,QACpB,QAAQ,CAACQ,MACP,gBAAAC,EAAAC,GAAA,EACE,UAAA;AAAA,UAAA,gBAAAC,EAACP,EAAW,MAAX,EAAgB,QAAO,UAAS,MAAK,MACnC,YAAK,MAAA,CACR;AAAA,UACA,gBAAAO,EAACP,EAAW,MAAX,EAAgB,SAAQ,cAAa,MAAK,MACxC,UAAAI,EAAK,YAAA,CACR;AAAA,QAAA,EAAA,CACF;AAAA,MAAA;AAAA,MAGJ;AAAA,QACE,OAAOR,EAAa;AAAA,QACpB,QAAQ,CAACQ,wBACN,OAAA,EAAI,WAAWI,EAAO,YACpB,UAAAJ,EAAK,mBACJZ,IACE,gBAAAe,EAACP,EAAW,QAAX,EAAkB,SAAQ,aAAY,SAAS,MAAMP,IAAgBW,CAAI,GACvE,UAAAP,EAAa,SAChB,IAEA,gBAAAU,EAACP,EAAW,OAAX,EAAiB,QAAO,WAAW,UAAAH,EAAa,WAAU,IAG7D,gBAAAU,EAACP,EAAW,OAAX,EAAiB,QAAO,WAAW,UAAAH,EAAa,UAAS,EAAA,CAE9D;AAAA,MAAA;AAAA,IAEJ;AAAA,IAEF,YAAY,MACVH,IACE,gBAAAa,EAACP,EAAW,MAAX,EAAgB,WAAWQ,EAAO,mBAAoB,UAAAT,EAAA,CAAW,IAElE,gBAAAQ,EAACE,GAAA,EAAU,OAAOX,EAAA,CAAiB;AAAA,EAAA,CAExC;AAED,SACE,gBAAAS,EAAC,OAAA,EAAI,WAAWC,EAAO,cACrB,4BAACE,GAAA,EAAS,OAAAf,GAAe,GAAGO,EAAA,CAAe,EAAA,CAC7C;AAEJ;"}

package/dist/components/Common/DocumentViewer/DocumentViewer.d.ts

@@ -5,5 +5,6 @@ interface DocumentViewerProps {
     viewDocumentLabel: string;
     headingLevel?: 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
 }
+/** @internal */
 export declare function DocumentViewer({ url, title, downloadInstructions, viewDocumentLabel, headingLevel, }: DocumentViewerProps): import("react").JSX.Element | null;
 export {};

package/dist/components/Common/DocumentViewer/DocumentViewer.js.map

@@ -1 +1 @@
-{"version":3,"file":"DocumentViewer.js","sources":["../../../../src/components/Common/DocumentViewer/DocumentViewer.tsx"],"sourcesContent":["import { useRef } from 'react'\nimport { Flex } from '../Flex/Flex'\nimport styles from './DocumentViewer.module.scss'\nimport { useContainerBreakpoints } from '@/hooks/useContainerBreakpoints/useContainerBreakpoints'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\ninterface DocumentViewerProps {\n  url?: string | null\n  title?: string\n  downloadInstructions?: string\n  viewDocumentLabel: string\n  headingLevel?: 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n}\n\nexport function DocumentViewer({\n  url,\n  title,\n  downloadInstructions,\n  viewDocumentLabel,\n  headingLevel = 'h3',\n}: DocumentViewerProps) {\n  const Components = useComponentContext()\n  const containerRef = useRef<HTMLDivElement>(null)\n  const matches = useContainerBreakpoints({\n    ref: containerRef,\n  })\n\n  const isContainerWidthSmallOrGreater = matches.includes('small')\n\n  if (!url) return null\n\n  const commonEmbeddedPdfProps = {\n    src: `${url}#toolbar=0&navpanes=0`,\n    title,\n    type: 'application/pdf',\n  }\n\n  // Keying the `<embed>` on the URL forces React to remount the element when\n  // the URL changes (e.g. after signing replaces an unsigned PDF). Without\n  // this, React reuses the existing DOM node, the browser's PDF plugin\n  // doesn't reload the new src, and the viewer renders blank until a manual\n  // reload.\n  return (\n    <div className={styles.container} ref={containerRef}>\n      {isContainerWidthSmallOrGreater ? (\n        <embed key={url} {...commonEmbeddedPdfProps} className={styles.embedPdf} />\n      ) : (\n        <div className={styles.smallEmbedPdfContainer}>\n          <Flex gap={20}>\n            <embed key={url} {...commonEmbeddedPdfProps} className={styles.smallEmbedPdf} />\n            <Flex flexDirection=\"column\" gap={8}>\n              <div>\n                {title && (\n                  <Components.Heading as={headingLevel} className={styles.heading}>\n                    {title}\n                  </Components.Heading>\n                )}\n                {downloadInstructions && (\n                  <Components.Text className={styles.downloadInstructions}>\n                    {downloadInstructions}\n                  </Components.Text>\n                )}\n              </div>\n              <Components.Link\n                className=\"react-aria-Button\"\n                data-variant=\"secondary\"\n                href={url}\n                target=\"_blank\"\n                rel=\"noopener noreferrer\"\n                download={`${title || 'document'}.pdf`}\n              >\n                {viewDocumentLabel}\n              </Components.Link>\n            </Flex>\n          </Flex>\n        </div>\n      )}\n    </div>\n  )\n}\n"],"names":["DocumentViewer","url","title","downloadInstructions","viewDocumentLabel","headingLevel","Components","useComponentContext","containerRef","useRef","isContainerWidthSmallOrGreater","useContainerBreakpoints","commonEmbeddedPdfProps","jsx","styles","jsxs","Flex"],"mappings":";;;;;;AAaO,SAASA,EAAe;AAAA,EAC7B,KAAAC;AAAA,EACA,OAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,cAAAC,IAAe;AACjB,GAAwB;AACtB,QAAMC,IAAaC,EAAA,GACbC,IAAeC,EAAuB,IAAI,GAK1CC,IAJUC,EAAwB;AAAA,IACtC,KAAKH;AAAA,EAAA,CACN,EAE8C,SAAS,OAAO;AAE/D,MAAI,CAACP,EAAK,QAAO;AAEjB,QAAMW,IAAyB;AAAA,IAC7B,KAAK,GAAGX,CAAG;AAAA,IACX,OAAAC;AAAA,IACA,MAAM;AAAA,EAAA;AAQR,SACE,gBAAAW,EAAC,OAAA,EAAI,WAAWC,EAAO,WAAW,KAAKN,GACpC,UAAAE,IACC,gBAAAG,EAAC,SAAA,EAAiB,GAAGD,GAAwB,WAAWE,EAAO,SAAA,GAAnDb,CAA6D,IAEzE,gBAAAY,EAAC,OAAA,EAAI,WAAWC,EAAO,wBACrB,UAAA,gBAAAC,EAACC,GAAA,EAAK,KAAK,IACT,UAAA;AAAA,IAAA,gBAAAH,EAAC,WAAiB,GAAGD,GAAwB,WAAWE,EAAO,iBAAnDb,CAAkE;AAAA,IAC9E,gBAAAc,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,MAAA,gBAAAD,EAAC,OAAA,EACE,UAAA;AAAA,QAAAb,KACC,gBAAAW,EAACP,EAAW,SAAX,EAAmB,IAAID,GAAc,WAAWS,EAAO,SACrD,UAAAZ,EAAA,CACH;AAAA,QAEDC,uBACEG,EAAW,MAAX,EAAgB,WAAWQ,EAAO,sBAChC,UAAAX,EAAA,CACH;AAAA,MAAA,GAEJ;AAAA,MACA,gBAAAU;AAAA,QAACP,EAAW;AAAA,QAAX;AAAA,UACC,WAAU;AAAA,UACV,gBAAa;AAAA,UACb,MAAML;AAAA,UACN,QAAO;AAAA,UACP,KAAI;AAAA,UACJ,UAAU,GAAGC,KAAS,UAAU;AAAA,UAE/B,UAAAE;AAAA,QAAA;AAAA,MAAA;AAAA,IACH,EAAA,CACF;AAAA,EAAA,EAAA,CACF,GACF,GAEJ;AAEJ;"}
+{"version":3,"file":"DocumentViewer.js","sources":["../../../../src/components/Common/DocumentViewer/DocumentViewer.tsx"],"sourcesContent":["import { useRef } from 'react'\nimport { Flex } from '../Flex/Flex'\nimport styles from './DocumentViewer.module.scss'\nimport { useContainerBreakpoints } from '@/hooks/useContainerBreakpoints/useContainerBreakpoints'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\ninterface DocumentViewerProps {\n  url?: string | null\n  title?: string\n  downloadInstructions?: string\n  viewDocumentLabel: string\n  headingLevel?: 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n}\n\n/** @internal */\nexport function DocumentViewer({\n  url,\n  title,\n  downloadInstructions,\n  viewDocumentLabel,\n  headingLevel = 'h3',\n}: DocumentViewerProps) {\n  const Components = useComponentContext()\n  const containerRef = useRef<HTMLDivElement>(null)\n  const matches = useContainerBreakpoints({\n    ref: containerRef,\n  })\n\n  const isContainerWidthSmallOrGreater = matches.includes('small')\n\n  if (!url) return null\n\n  const commonEmbeddedPdfProps = {\n    src: `${url}#toolbar=0&navpanes=0`,\n    title,\n    type: 'application/pdf',\n  }\n\n  // Keying the `<embed>` on the URL forces React to remount the element when\n  // the URL changes (e.g. after signing replaces an unsigned PDF). Without\n  // this, React reuses the existing DOM node, the browser's PDF plugin\n  // doesn't reload the new src, and the viewer renders blank until a manual\n  // reload.\n  return (\n    <div className={styles.container} ref={containerRef}>\n      {isContainerWidthSmallOrGreater ? (\n        <embed key={url} {...commonEmbeddedPdfProps} className={styles.embedPdf} />\n      ) : (\n        <div className={styles.smallEmbedPdfContainer}>\n          <Flex gap={20}>\n            <embed key={url} {...commonEmbeddedPdfProps} className={styles.smallEmbedPdf} />\n            <Flex flexDirection=\"column\" gap={8}>\n              <div>\n                {title && (\n                  <Components.Heading as={headingLevel} className={styles.heading}>\n                    {title}\n                  </Components.Heading>\n                )}\n                {downloadInstructions && (\n                  <Components.Text className={styles.downloadInstructions}>\n                    {downloadInstructions}\n                  </Components.Text>\n                )}\n              </div>\n              <Components.Link\n                className=\"react-aria-Button\"\n                data-variant=\"secondary\"\n                href={url}\n                target=\"_blank\"\n                rel=\"noopener noreferrer\"\n                download={`${title || 'document'}.pdf`}\n              >\n                {viewDocumentLabel}\n              </Components.Link>\n            </Flex>\n          </Flex>\n        </div>\n      )}\n    </div>\n  )\n}\n"],"names":["DocumentViewer","url","title","downloadInstructions","viewDocumentLabel","headingLevel","Components","useComponentContext","containerRef","useRef","isContainerWidthSmallOrGreater","useContainerBreakpoints","commonEmbeddedPdfProps","jsx","styles","jsxs","Flex"],"mappings":";;;;;;AAcO,SAASA,EAAe;AAAA,EAC7B,KAAAC;AAAA,EACA,OAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,cAAAC,IAAe;AACjB,GAAwB;AACtB,QAAMC,IAAaC,EAAA,GACbC,IAAeC,EAAuB,IAAI,GAK1CC,IAJUC,EAAwB;AAAA,IACtC,KAAKH;AAAA,EAAA,CACN,EAE8C,SAAS,OAAO;AAE/D,MAAI,CAACP,EAAK,QAAO;AAEjB,QAAMW,IAAyB;AAAA,IAC7B,KAAK,GAAGX,CAAG;AAAA,IACX,OAAAC;AAAA,IACA,MAAM;AAAA,EAAA;AAQR,SACE,gBAAAW,EAAC,OAAA,EAAI,WAAWC,EAAO,WAAW,KAAKN,GACpC,UAAAE,IACC,gBAAAG,EAAC,SAAA,EAAiB,GAAGD,GAAwB,WAAWE,EAAO,SAAA,GAAnDb,CAA6D,IAEzE,gBAAAY,EAAC,OAAA,EAAI,WAAWC,EAAO,wBACrB,UAAA,gBAAAC,EAACC,GAAA,EAAK,KAAK,IACT,UAAA;AAAA,IAAA,gBAAAH,EAAC,WAAiB,GAAGD,GAAwB,WAAWE,EAAO,iBAAnDb,CAAkE;AAAA,IAC9E,gBAAAc,EAACC,GAAA,EAAK,eAAc,UAAS,KAAK,GAChC,UAAA;AAAA,MAAA,gBAAAD,EAAC,OAAA,EACE,UAAA;AAAA,QAAAb,KACC,gBAAAW,EAACP,EAAW,SAAX,EAAmB,IAAID,GAAc,WAAWS,EAAO,SACrD,UAAAZ,EAAA,CACH;AAAA,QAEDC,uBACEG,EAAW,MAAX,EAAgB,WAAWQ,EAAO,sBAChC,UAAAX,EAAA,CACH;AAAA,MAAA,GAEJ;AAAA,MACA,gBAAAU;AAAA,QAACP,EAAW;AAAA,QAAX;AAAA,UACC,WAAU;AAAA,UACV,gBAAa;AAAA,UACb,MAAML;AAAA,UACN,QAAO;AAAA,UACP,KAAI;AAAA,UACJ,UAAU,GAAGC,KAAS,UAAU;AAAA,UAE/B,UAAAE;AAAA,QAAA;AAAA,MAAA;AAAA,IACH,EAAA,CACF;AAAA,EAAA,EAAA,CACF,GACF,GAEJ;AAEJ;"}

package/dist/components/Common/EmptyData/EmptyData.d.ts

@@ -7,5 +7,6 @@ type EmptyDataProps = {
      */
     icon?: React.ReactNode;
 };
+/** @internal */
 export declare function EmptyData({ title, description, children, icon }: EmptyDataProps): import("react").JSX.Element;
 export {};

package/dist/components/Common/EmptyData/EmptyData.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyData.js","sources":["../../../../src/components/Common/EmptyData/EmptyData.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { Flex } from '../Flex/Flex'\nimport styles from './EmptyData.module.scss'\nimport magnifyingGlass from '@/assets/icons/magnifyingGlass.png'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\ntype EmptyDataProps = {\n  title?: string\n  description?: string\n  children?: React.ReactNode\n  /**\n   * When set, replaces the default search (magnifying glass) illustration.\n   */\n  icon?: React.ReactNode\n}\nexport function EmptyData({ title, description, children, icon }: EmptyDataProps) {\n  const { t } = useTranslation()\n  const { Text } = useComponentContext()\n  return (\n    <div className={styles.emptyData} data-testid=\"emptydata\">\n      <Flex flexDirection=\"column\" alignItems=\"center\">\n        {icon ? (\n          <span className={styles.iconSlot}>{icon}</span>\n        ) : (\n          <img src={magnifyingGlass} alt={t('icons.magnifyingGlass')} className={styles.image} />\n        )}\n        <div className={styles.textContent}>\n          {title && (\n            <Text weight=\"bold\" className={styles.title}>\n              {title}\n            </Text>\n          )}\n          {description && <Text>{description}</Text>}\n        </div>\n        {children && children}\n      </Flex>\n    </div>\n  )\n}\n"],"names":["EmptyData","title","description","children","icon","t","useTranslation","Text","useComponentContext","jsx","styles","jsxs","Flex","magnifyingGlass"],"mappings":";;;;;;AAeO,SAASA,EAAU,EAAE,OAAAC,GAAO,aAAAC,GAAa,UAAAC,GAAU,MAAAC,KAAwB;AAChF,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAA,GACR,EAAE,MAAAC,EAAA,IAASC,EAAA;AACjB,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAO,WAAW,eAAY,aAC5C,UAAA,gBAAAC,EAACC,GAAA,EAAK,eAAc,UAAS,YAAW,UACrC,UAAA;AAAA,IAAAR,sBACE,QAAA,EAAK,WAAWM,EAAO,UAAW,aAAK,IAExC,gBAAAD,EAAC,OAAA,EAAI,KAAKI,GAAiB,KAAKR,EAAE,uBAAuB,GAAG,WAAWK,EAAO,OAAO;AAAA,IAEvF,gBAAAC,EAAC,OAAA,EAAI,WAAWD,EAAO,aACpB,UAAA;AAAA,MAAAT,uBACEM,GAAA,EAAK,QAAO,QAAO,WAAWG,EAAO,OACnC,UAAAT,EAAA,CACH;AAAA,MAEDC,KAAe,gBAAAO,EAACF,GAAA,EAAM,UAAAL,EAAA,CAAY;AAAA,IAAA,GACrC;AAAA,IACCC,KAAYA;AAAA,EAAA,EAAA,CACf,EAAA,CACF;AAEJ;"}
+{"version":3,"file":"EmptyData.js","sources":["../../../../src/components/Common/EmptyData/EmptyData.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { Flex } from '../Flex/Flex'\nimport styles from './EmptyData.module.scss'\nimport magnifyingGlass from '@/assets/icons/magnifyingGlass.png'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\ntype EmptyDataProps = {\n  title?: string\n  description?: string\n  children?: React.ReactNode\n  /**\n   * When set, replaces the default search (magnifying glass) illustration.\n   */\n  icon?: React.ReactNode\n}\n/** @internal */\nexport function EmptyData({ title, description, children, icon }: EmptyDataProps) {\n  const { t } = useTranslation()\n  const { Text } = useComponentContext()\n  return (\n    <div className={styles.emptyData} data-testid=\"emptydata\">\n      <Flex flexDirection=\"column\" alignItems=\"center\">\n        {icon ? (\n          <span className={styles.iconSlot}>{icon}</span>\n        ) : (\n          <img src={magnifyingGlass} alt={t('icons.magnifyingGlass')} className={styles.image} />\n        )}\n        <div className={styles.textContent}>\n          {title && (\n            <Text weight=\"bold\" className={styles.title}>\n              {title}\n            </Text>\n          )}\n          {description && <Text>{description}</Text>}\n        </div>\n        {children && children}\n      </Flex>\n    </div>\n  )\n}\n"],"names":["EmptyData","title","description","children","icon","t","useTranslation","Text","useComponentContext","jsx","styles","jsxs","Flex","magnifyingGlass"],"mappings":";;;;;;AAgBO,SAASA,EAAU,EAAE,OAAAC,GAAO,aAAAC,GAAa,UAAAC,GAAU,MAAAC,KAAwB;AAChF,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAA,GACR,EAAE,MAAAC,EAAA,IAASC,EAAA;AACjB,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAO,WAAW,eAAY,aAC5C,UAAA,gBAAAC,EAACC,GAAA,EAAK,eAAc,UAAS,YAAW,UACrC,UAAA;AAAA,IAAAR,sBACE,QAAA,EAAK,WAAWM,EAAO,UAAW,aAAK,IAExC,gBAAAD,EAAC,OAAA,EAAI,KAAKI,GAAiB,KAAKR,EAAE,uBAAuB,GAAG,WAAWK,EAAO,OAAO;AAAA,IAEvF,gBAAAC,EAAC,OAAA,EAAI,WAAWD,EAAO,aACpB,UAAA;AAAA,MAAAT,uBACEM,GAAA,EAAK,QAAO,QAAO,WAAWG,EAAO,OACnC,UAAAT,EAAA,CACH;AAAA,MAEDC,KAAe,gBAAAO,EAACF,GAAA,EAAM,UAAAL,EAAA,CAAY;AAAA,IAAA,GACrC;AAAA,IACCC,KAAYA;AAAA,EAAA,EAAA,CACf,EAAA,CACF;AAEJ;"}

package/dist/components/Common/FadeIn/FadeIn.d.ts

@@ -1,4 +1,5 @@
 import { FC, ReactNode } from 'react';
+/** @internal */
 export declare const FadeIn: FC<{
     children: ReactNode;
 }>;

package/dist/components/Common/FadeIn/FadeIn.js.map

@@ -1 +1 @@
-{"version":3,"file":"FadeIn.js","sources":["../../../../src/components/Common/FadeIn/FadeIn.tsx"],"sourcesContent":["import type { FC, ReactNode } from 'react'\nimport { useState, useEffect } from 'react'\nimport styles from './FadeIn.module.scss'\n\nexport const FadeIn: FC<{ children: ReactNode }> = ({ children }) => {\n  const [visible, setVisible] = useState(false)\n\n  useEffect(() => {\n    const timeout = requestAnimationFrame(() => {\n      setVisible(true)\n    })\n    return () => {\n      cancelAnimationFrame(timeout)\n    }\n  }, [])\n\n  return <div className={`${styles.fade} ${visible ? styles.fadeIn : ''}`}>{children}</div>\n}\n"],"names":["FadeIn","children","visible","setVisible","useState","useEffect","timeout","jsx","styles"],"mappings":";;;AAIO,MAAMA,IAAsC,CAAC,EAAE,UAAAC,QAAe;AACnE,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAS,EAAK;AAE5C,SAAAC,EAAU,MAAM;AACd,UAAMC,IAAU,sBAAsB,MAAM;AAC1C,MAAAH,EAAW,EAAI;AAAA,IACjB,CAAC;AACD,WAAO,MAAM;AACX,2BAAqBG,CAAO;AAAA,IAC9B;AAAA,EACF,GAAG,CAAA,CAAE,GAEE,gBAAAC,EAAC,OAAA,EAAI,WAAW,GAAGC,EAAO,IAAI,IAAIN,IAAUM,EAAO,SAAS,EAAE,IAAK,UAAAP,EAAA,CAAS;AACrF;"}
+{"version":3,"file":"FadeIn.js","sources":["../../../../src/components/Common/FadeIn/FadeIn.tsx"],"sourcesContent":["import type { FC, ReactNode } from 'react'\nimport { useState, useEffect } from 'react'\nimport styles from './FadeIn.module.scss'\n\n/** @internal */\nexport const FadeIn: FC<{ children: ReactNode }> = ({ children }) => {\n  const [visible, setVisible] = useState(false)\n\n  useEffect(() => {\n    const timeout = requestAnimationFrame(() => {\n      setVisible(true)\n    })\n    return () => {\n      cancelAnimationFrame(timeout)\n    }\n  }, [])\n\n  return <div className={`${styles.fade} ${visible ? styles.fadeIn : ''}`}>{children}</div>\n}\n"],"names":["FadeIn","children","visible","setVisible","useState","useEffect","timeout","jsx","styles"],"mappings":";;;AAKO,MAAMA,IAAsC,CAAC,EAAE,UAAAC,QAAe;AACnE,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAS,EAAK;AAE5C,SAAAC,EAAU,MAAM;AACd,UAAMC,IAAU,sBAAsB,MAAM;AAC1C,MAAAH,EAAW,EAAI;AAAA,IACjB,CAAC;AACD,WAAO,MAAM;AACX,2BAAqBG,CAAO;AAAA,IAC9B;AAAA,EACF,GAAG,CAAA,CAAE,GAEE,gBAAAC,EAAC,OAAA,EAAI,WAAW,GAAGC,EAAO,IAAI,IAAIN,IAAUM,EAAO,SAAS,EAAE,IAAK,UAAAP,EAAA,CAAS;AACrF;"}

package/dist/components/Common/FieldCaption/FieldCaption.d.ts

@@ -1,9 +1,17 @@
+/** @internal */
 export interface FieldCaptionProps {
+    /** Caption content rendered inside the label or legend element. */
     children: React.ReactNode;
+    /** HTML element to render as — `label` for individual inputs, `legend` for fieldsets. */
     as?: 'label' | 'legend';
+    /** Associates a `label` with an input by id. Ignored when `as` is `legend`. */
     htmlFor?: string;
+    /** When false, appends a localized optional indicator after the caption. */
     isRequired?: boolean;
+    /** Visually hides the caption while keeping it available to assistive technology. */
     isVisuallyHidden?: boolean;
+    /** Additional class names appended to the root element. */
     className?: string;
 }
+/** @internal */
 export declare const FieldCaption: React.FC<FieldCaptionProps>;

package/dist/components/Common/FieldCaption/FieldCaption.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldCaption.js","sources":["../../../../src/components/Common/FieldCaption/FieldCaption.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport classNames from 'classnames'\nimport { VisuallyHidden } from '../VisuallyHidden'\nimport styles from './FieldCaption.module.scss'\n\nexport interface FieldCaptionProps {\n  children: React.ReactNode\n  as?: 'label' | 'legend'\n  htmlFor?: string\n  isRequired?: boolean\n  isVisuallyHidden?: boolean\n  className?: string\n}\n\nexport const FieldCaption: React.FC<FieldCaptionProps> = ({\n  children,\n  as = 'label',\n  htmlFor,\n  isRequired = false,\n  isVisuallyHidden = false,\n  className,\n}: FieldCaptionProps) => {\n  const { t } = useTranslation('common')\n  const Component = as\n\n  const content = (\n    <Component\n      className={classNames(styles.root, className)}\n      htmlFor={as === 'label' ? htmlFor : undefined}\n    >\n      {children}\n      {!isRequired && <span className={styles.optionalLabel}> {t('optionalLabel')}</span>}\n    </Component>\n  )\n\n  return isVisuallyHidden ? <VisuallyHidden>{content}</VisuallyHidden> : content\n}\n"],"names":["FieldCaption","children","as","htmlFor","isRequired","isVisuallyHidden","className","t","useTranslation","content","jsxs","classNames","styles","jsx","VisuallyHidden"],"mappings":";;;;;AAcO,MAAMA,IAA4C,CAAC;AAAA,EACxD,UAAAC;AAAA,EACA,IAAAC,IAAK;AAAA,EACL,SAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,kBAAAC,IAAmB;AAAA,EACnB,WAAAC;AACF,MAAyB;AACvB,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,QAAQ,GAG/BC,IACJ,gBAAAC;AAAA,IAHgBR;AAAA,IAGf;AAAA,MACC,WAAWS,EAAWC,EAAO,MAAMN,CAAS;AAAA,MAC5C,SAASJ,MAAO,UAAUC,IAAU;AAAA,MAEnC,UAAA;AAAA,QAAAF;AAAA,QACA,CAACG,KAAc,gBAAAM,EAAC,QAAA,EAAK,WAAWE,EAAO,eAAe,UAAA;AAAA,UAAA;AAAA,UAAEL,EAAE,eAAe;AAAA,QAAA,EAAA,CAAE;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIhF,SAAOF,IAAmB,gBAAAQ,EAACC,GAAA,EAAgB,UAAAL,EAAA,CAAQ,IAAoBA;AACzE;"}
+{"version":3,"file":"FieldCaption.js","sources":["../../../../src/components/Common/FieldCaption/FieldCaption.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport classNames from 'classnames'\nimport { VisuallyHidden } from '../VisuallyHidden'\nimport styles from './FieldCaption.module.scss'\n\n/** @internal */\nexport interface FieldCaptionProps {\n  /** Caption content rendered inside the label or legend element. */\n  children: React.ReactNode\n  /** HTML element to render as — `label` for individual inputs, `legend` for fieldsets. */\n  as?: 'label' | 'legend'\n  /** Associates a `label` with an input by id. Ignored when `as` is `legend`. */\n  htmlFor?: string\n  /** When false, appends a localized optional indicator after the caption. */\n  isRequired?: boolean\n  /** Visually hides the caption while keeping it available to assistive technology. */\n  isVisuallyHidden?: boolean\n  /** Additional class names appended to the root element. */\n  className?: string\n}\n\n/** @internal */\nexport const FieldCaption: React.FC<FieldCaptionProps> = ({\n  children,\n  as = 'label',\n  htmlFor,\n  isRequired = false,\n  isVisuallyHidden = false,\n  className,\n}: FieldCaptionProps) => {\n  const { t } = useTranslation('common')\n  const Component = as\n\n  const content = (\n    <Component\n      className={classNames(styles.root, className)}\n      htmlFor={as === 'label' ? htmlFor : undefined}\n    >\n      {children}\n      {!isRequired && <span className={styles.optionalLabel}> {t('optionalLabel')}</span>}\n    </Component>\n  )\n\n  return isVisuallyHidden ? <VisuallyHidden>{content}</VisuallyHidden> : content\n}\n"],"names":["FieldCaption","children","as","htmlFor","isRequired","isVisuallyHidden","className","t","useTranslation","content","jsxs","classNames","styles","jsx","VisuallyHidden"],"mappings":";;;;;AAsBO,MAAMA,IAA4C,CAAC;AAAA,EACxD,UAAAC;AAAA,EACA,IAAAC,IAAK;AAAA,EACL,SAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,kBAAAC,IAAmB;AAAA,EACnB,WAAAC;AACF,MAAyB;AACvB,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAe,QAAQ,GAG/BC,IACJ,gBAAAC;AAAA,IAHgBR;AAAA,IAGf;AAAA,MACC,WAAWS,EAAWC,EAAO,MAAMN,CAAS;AAAA,MAC5C,SAASJ,MAAO,UAAUC,IAAU;AAAA,MAEnC,UAAA;AAAA,QAAAF;AAAA,QACA,CAACG,KAAc,gBAAAM,EAAC,QAAA,EAAK,WAAWE,EAAO,eAAe,UAAA;AAAA,UAAA;AAAA,UAAEL,EAAE,eAAe;AAAA,QAAA,EAAA,CAAE;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIhF,SAAOF,IAAmB,gBAAAQ,EAACC,GAAA,EAAgB,UAAAL,EAAA,CAAQ,IAAoBA;AACzE;"}

package/dist/components/Common/FieldDescription/FieldDescription.d.ts

@@ -3,5 +3,10 @@ interface FieldDescriptionProps {
     className?: string;
     id?: string;
 }
+/**
+ * Renders a field's helper description text beneath its label.
+ *
+ * @internal
+ */
 export declare const FieldDescription: React.FC<FieldDescriptionProps>;
 export {};

package/dist/components/Common/FieldDescription/FieldDescription.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldDescription.js","sources":["../../../../src/components/Common/FieldDescription/FieldDescription.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport styles from './FieldDescription.module.scss'\n\ninterface FieldDescriptionProps {\n  children: React.ReactNode\n  className?: string\n  id?: string\n}\n\nexport const FieldDescription: React.FC<FieldDescriptionProps> = ({\n  children,\n  className,\n  ...props\n}: FieldDescriptionProps) => {\n  return (\n    children && (\n      <div {...props} className={classNames(styles.root, className)}>\n        {children}\n      </div>\n    )\n  )\n}\n"],"names":["FieldDescription","children","className","props","jsx","classNames","styles"],"mappings":";;;AASO,MAAMA,IAAoD,CAAC;AAAA,EAChE,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,MAEIF,KACE,gBAAAG,EAAC,OAAA,EAAK,GAAGD,GAAO,WAAWE,EAAWC,EAAO,MAAMJ,CAAS,GACzD,UAAAD,EAAA,CACH;"}
+{"version":3,"file":"FieldDescription.js","sources":["../../../../src/components/Common/FieldDescription/FieldDescription.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport styles from './FieldDescription.module.scss'\n\ninterface FieldDescriptionProps {\n  children: React.ReactNode\n  className?: string\n  id?: string\n}\n\n/**\n * Renders a field's helper description text beneath its label.\n *\n * @internal\n */\nexport const FieldDescription: React.FC<FieldDescriptionProps> = ({\n  children,\n  className,\n  ...props\n}: FieldDescriptionProps) => {\n  return (\n    children && (\n      <div {...props} className={classNames(styles.root, className)}>\n        {children}\n      </div>\n    )\n  )\n}\n"],"names":["FieldDescription","children","className","props","jsx","classNames","styles"],"mappings":";;;AAcO,MAAMA,IAAoD,CAAC;AAAA,EAChE,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,MAEIF,KACE,gBAAAG,EAAC,OAAA,EAAK,GAAGD,GAAO,WAAWE,EAAWC,EAAO,MAAMJ,CAAS,GACzD,UAAAD,EAAA,CACH;"}

package/dist/components/Common/FieldErrorMessage/FieldErrorMessage.d.ts

@@ -2,5 +2,10 @@ import { HTMLAttributes } from 'react';
 interface FieldErrorMessageProps extends HTMLAttributes<HTMLParagraphElement> {
     withErrorIcon?: boolean;
 }
+/**
+ * Renders a field's validation error message via the component adapter's `Text` primitive.
+ *
+ * @internal
+ */
 export declare function FieldErrorMessage({ children, id, className, withErrorIcon, ...props }: FieldErrorMessageProps): false | "" | 0 | 0n | import("react").JSX.Element | null | undefined;
 export {};