@gusto/embedded-react-sdk 0.37.0-rc.5 → 0.38.0-rc.1

package/CHANGELOG.md

@@ -1,5 +1,50 @@
 # Changelog
 
+## 0.38.0
+
+### Features & Enhancements
+
+- Add date range filter to PayrollList and PayrollHistory
+- Add SDK Dev App for standalone component development
+- Add ManagementEmployeeList component and refactor EmployeeList
+- Add DetailViewLayout and EmployeeTable reusable components
+- Add icon prop to Button component
+- Update payroll breadcrumb labels
+- Disable past dates in Pay Schedule first pay date picker
+- Support prop-based field connection via formHookResult
+
+### Fixes
+
+- Fix breadcrumb navigation guards and post-submit flow
+- Fix off-cycle, dismissal, and transition payroll bugs (breadcrumb display, cancel transitions, date range handling, employee selection, PTO labeling)
+- Keep excluded employees visible in PayrollConfiguration after calculation
+- Fix gross-up modal layout and calculate button alignment
+- Fix payroll history sorting and pagination
+- Treat blank time off fields as zero to prevent raw API error
+- Hide direct deposit banner and ACH deadline messages for check-only payrolls
+- Keep start/end date fields visible for check-only payrolls
+- Sync contractor self-onboarding toggle with API status changes
+- Wire up missing dictionary overrides in Contractor components
+- Scope PaymentMethod loading spinner to the specific row being deleted
+- Respect withReimbursements prop in off-cycle payroll configuration
+- Update gross pay live when editing bonus and fixed compensation amounts
+- Prevent dropdown flicker on rapid blur-focus in MultiSelectComboBox
+- Fix NumberField onBlur value formatting
+- Fix compensation base validators and child support required attributes
+- Ensure all labels display in payroll receipt mobile layout
+- Reduce spacing between input section title and description
+- Clarify tax withholding rates copy
+
+### Chores & Maintenance
+
+- Add tests, Storybook stories, and documentation for new components
+- Add icon assets (umbrella, search-lg, user-02, edit-02)
+- Re-enable e2e tests on ubuntu-latest runners
+- Bump i18next from 25.10.4 to 26.0.3
+- Bump react-i18next from 16.6.6 to 17.0.2
+- Bump Storybook packages to 10.3.4
+- Bump various dev dependencies (sass-embedded, vite-plugin-svgr, @playwright/test, typescript-eslint, and others)
+
 ## 0.37.0
 
 ### Features & Enhancements

package/dist/UNSTABLE_Hooks.d.ts

@@ -1 +1 @@
-export { useCompensationForm, CompensationForm, CompensationErrorCodes, type CompensationFormProps, type CompensationSubmitCallbacks, type CompensationSubmitOptions, type CompensationRequiredFields, type UseCompensationFormProps, type UseCompensationFormResult, type UseCompensationFormReady, type CompensationFieldsMetadata, type CompensationFormFields, type CompensationErrorCode, type CompensationField, type CompensationFormData, type CompensationFormOutputs, type RequiredValidation, type RateValidation, type StartDateFieldProps, type JobTitleFieldProps, type FlsaStatusFieldProps, type RateFieldProps, type PaymentUnitFieldProps, type AdjustForMinimumWageFieldProps, type MinimumWageIdFieldProps, type TwoPercentShareholderFieldProps, type StateWcCoveredFieldProps, type StateWcClassCodeFieldProps, SDKFormProvider, FormFieldsMetadataProvider, composeSubmitHandler, useFieldsMetadata, useFieldErrorMessage, withOptions, deriveFieldsMetadata, collectErrors, TextInputHookField, SelectHookField, CheckboxHookField, NumberInputHookField, DatePickerHookField, RadioGroupHookField, useErrorHandling, type HookFormInternals, type HookLoadingResult, type HookSubmitResult, type HookErrorHandling, type BaseHookReady, type BaseFormHookReady, type FieldMetadata, type FieldMetadataWithOptions, type FieldsMetadata, type FormFieldsMetadataContextValue, type ValidationMessages, type BaseFieldProps, type TextInputHookFieldProps, type SelectHookFieldProps, type CheckboxHookFieldProps, type NumberInputHookFieldProps, type DatePickerHookFieldProps, type RadioGroupHookFieldProps, type TextInputProps, type SelectProps, type SelectOption, type CheckboxProps, type NumberInputProps, type DatePickerProps, type RadioGroupProps, type RadioGroupOption, SwitchHookField, type SwitchHookFieldProps, type SwitchProps, useEmployeeDetailsForm, EmployeeDetailsForm, EmployeeDetailsErrorCodes, type EmployeeDetailsFormProps, type EmployeeDetailsSubmitCallbacks, type EmployeeDetailsRequiredFields, type UseEmployeeDetailsFormProps, type UseEmployeeDetailsFormResult, type UseEmployeeDetailsFormReady, type EmployeeDetailsFieldsMetadata, type EmployeeDetailsFormFields, type EmployeeDetailsErrorCode, type EmployeeDetailsFormData, type EmployeeDetailsFormOutputs, type EmployeeDetailsField, type EmployeeDetailsRequiredValidation, type NameValidation, type EmailValidation, type SsnValidation, type FirstNameFieldProps, type MiddleInitialFieldProps, type LastNameFieldProps, type EmailFieldProps, type DateOfBirthFieldProps, type SsnFieldProps, type SelfOnboardingFieldProps, useWorkAddressForm, WorkAddressForm, WorkAddressErrorCodes, type WorkAddressFormProps, type WorkAddressSubmitCallbacks, type WorkAddressSubmitOptions, type WorkAddressRequiredFields, type UseWorkAddressFormProps, type UseWorkAddressFormResult, type UseWorkAddressFormReady, type WorkAddressFieldsMetadata, type WorkAddressFormFields, type WorkAddressErrorCode, type WorkAddressFormData, type WorkAddressFormOutputs, type WorkAddressField, type WorkAddressRequiredValidation, type LocationFieldProps, type EffectiveDateFieldProps, } from './components/UNSTABLE_Hooks';
+export { useCompensationForm, CompensationForm, CompensationErrorCodes, type CompensationFormProps, type CompensationSubmitCallbacks, type CompensationSubmitOptions, type UseCompensationFormProps, type UseCompensationFormResult, type UseCompensationFormReady, type CompensationFieldsMetadata, type CompensationFormFields, type CompensationErrorCode, type CompensationOptionalFieldsToRequire, type CompensationFormData, type CompensationFormOutputs, type RequiredValidation, type RateValidation, type StartDateFieldProps, type JobTitleFieldProps, type FlsaStatusFieldProps, type RateFieldProps, type PaymentUnitFieldProps, type AdjustForMinimumWageFieldProps, type MinimumWageIdFieldProps, type TwoPercentShareholderFieldProps, type StateWcCoveredFieldProps, type StateWcClassCodeFieldProps, SDKFormProvider, composeSubmitHandler, useFieldErrorMessage, withOptions, deriveFieldsMetadata, collectErrors, TextInputHookField, SelectHookField, CheckboxHookField, NumberInputHookField, DatePickerHookField, RadioGroupHookField, useErrorHandling, type HookFormInternals, type HookLoadingResult, type HookSubmitResult, type HookErrorHandling, type BaseHookReady, type BaseFormHookReady, type FieldMetadata, type FieldMetadataWithOptions, type FieldsMetadata, type FormFieldsMetadataContextValue, type ValidationMessages, type BaseFieldProps, type TextInputHookFieldProps, type SelectHookFieldProps, type CheckboxHookFieldProps, type NumberInputHookFieldProps, type DatePickerHookFieldProps, type RadioGroupHookFieldProps, type TextInputProps, type SelectProps, type SelectOption, type CheckboxProps, type NumberInputProps, type DatePickerProps, type RadioGroupProps, type RadioGroupOption, SwitchHookField, type SwitchHookFieldProps, type SwitchProps, useEmployeeDetailsForm, EmployeeDetailsForm, EmployeeDetailsErrorCodes, type EmployeeDetailsFormProps, type EmployeeDetailsSubmitCallbacks, type EmployeeDetailsOptionalFieldsToRequire, type UseEmployeeDetailsFormProps, type UseEmployeeDetailsFormResult, type UseEmployeeDetailsFormReady, type EmployeeDetailsFieldsMetadata, type EmployeeDetailsFormFields, type EmployeeDetailsErrorCode, type EmployeeDetailsFormData, type EmployeeDetailsFormOutputs, type EmployeeDetailsField, type EmployeeDetailsRequiredValidation, type NameValidation, type EmailValidation, type SsnValidation, type FirstNameFieldProps, type MiddleInitialFieldProps, type LastNameFieldProps, type EmailFieldProps, type DateOfBirthFieldProps, type SsnFieldProps, type SelfOnboardingFieldProps, useWorkAddressForm, WorkAddressForm, WorkAddressErrorCodes, type WorkAddressFormProps, type WorkAddressSubmitCallbacks, type WorkAddressSubmitOptions, type WorkAddressOptionalFieldsToRequire, type UseWorkAddressFormProps, type UseWorkAddressFormResult, type UseWorkAddressFormReady, type WorkAddressFieldsMetadata, type WorkAddressFormFields, type WorkAddressErrorCode, type WorkAddressFormData, type WorkAddressFormOutputs, type WorkAddressField, type WorkAddressRequiredValidation, type LocationFieldProps, type EffectiveDateFieldProps, } from './components/UNSTABLE_Hooks';

package/dist/UNSTABLE_Hooks.js

@@ -1,53 +1,49 @@
-import { useErrorHandling as e } from "./components/UNSTABLE_Hooks/useErrorHandling.js";
-import { collectErrors as m } from "./components/UNSTABLE_Hooks/collectErrors.js";
-import { CheckboxHookField as d } from "./components/UNSTABLE_Hooks/form/fields/CheckboxHookField.js";
-import { CompensationErrorCodes as i } from "./components/UNSTABLE_Hooks/hooks/useCompensationForm/compensationSchema.js";
+import { useErrorHandling as e } from "./hooks/useErrorHandling.js";
+import { collectErrors as m } from "./helpers/collectErrors.js";
+import { CheckboxHookField as s } from "./components/UNSTABLE_Hooks/form/fields/CheckboxHookField.js";
+import { CompensationErrorCodes as d } from "./components/UNSTABLE_Hooks/hooks/useCompensationForm/compensationSchema.js";
 import { CompensationForm as f } from "./components/UNSTABLE_Hooks/hooks/useCompensationForm/CompensationForm.js";
-import { DatePickerHookField as a } from "./components/UNSTABLE_Hooks/form/fields/DatePickerHookField.js";
+import { DatePickerHookField as F } from "./components/UNSTABLE_Hooks/form/fields/DatePickerHookField.js";
 import { EmployeeDetailsErrorCodes as k } from "./components/UNSTABLE_Hooks/hooks/useEmployeeDetailsForm/employeeDetailsSchema.js";
 import { EmployeeDetailsForm as u } from "./components/UNSTABLE_Hooks/hooks/useEmployeeDetailsForm/EmployeeDetailsForm.js";
-import { FormFieldsMetadataProvider as H } from "./components/UNSTABLE_Hooks/form/FormFieldsMetadataProvider.js";
-import { NumberInputHookField as C } from "./components/UNSTABLE_Hooks/form/fields/NumberInputHookField.js";
-import { RadioGroupHookField as M } from "./components/UNSTABLE_Hooks/form/fields/RadioGroupHookField.js";
-import { SDKFormProvider as b } from "./components/UNSTABLE_Hooks/form/SDKFormProvider.js";
-import { SelectHookField as v } from "./components/UNSTABLE_Hooks/form/fields/SelectHookField.js";
+import { NumberInputHookField as H } from "./components/UNSTABLE_Hooks/form/fields/NumberInputHookField.js";
+import { RadioGroupHookField as C } from "./components/UNSTABLE_Hooks/form/fields/RadioGroupHookField.js";
+import { SDKFormProvider as S } from "./components/UNSTABLE_Hooks/form/SDKFormProvider.js";
+import { SelectHookField as h } from "./components/UNSTABLE_Hooks/form/fields/SelectHookField.js";
 import { SwitchHookField as A } from "./components/UNSTABLE_Hooks/form/fields/SwitchHookField.js";
-import { TextInputHookField as W } from "./components/UNSTABLE_Hooks/form/fields/TextInputHookField.js";
+import { TextInputHookField as g } from "./components/UNSTABLE_Hooks/form/fields/TextInputHookField.js";
 import { WorkAddressErrorCodes as w } from "./components/UNSTABLE_Hooks/hooks/useWorkAddressForm/workAddressSchema.js";
-import { WorkAddressForm as G } from "./components/UNSTABLE_Hooks/hooks/useWorkAddressForm/WorkAddressForm.js";
-import { composeSubmitHandler as N } from "./components/UNSTABLE_Hooks/form/composeSubmitHandler.js";
-import { deriveFieldsMetadata as R } from "./components/UNSTABLE_Hooks/form/deriveFieldsMetadata.js";
-import { useCompensationForm as j } from "./components/UNSTABLE_Hooks/hooks/useCompensationForm/useCompensationForm.js";
-import { useEmployeeDetailsForm as z } from "./components/UNSTABLE_Hooks/hooks/useEmployeeDetailsForm/useEmployeeDetailsForm.js";
-import { useFieldErrorMessage as J } from "./components/UNSTABLE_Hooks/form/useFieldErrorMessage.js";
-import { useFieldsMetadata as Q } from "./components/UNSTABLE_Hooks/form/useFieldsMetadata.js";
-import { useWorkAddressForm as V } from "./components/UNSTABLE_Hooks/hooks/useWorkAddressForm/useWorkAddressForm.js";
-import { withOptions as Y } from "./components/UNSTABLE_Hooks/form/withOptions.js";
+import { WorkAddressForm as M } from "./components/UNSTABLE_Hooks/hooks/useWorkAddressForm/WorkAddressForm.js";
+import { composeSubmitHandler as G } from "./components/UNSTABLE_Hooks/form/composeSubmitHandler.js";
+import { deriveFieldsMetadata as N } from "./components/UNSTABLE_Hooks/form/deriveFieldsMetadata.js";
+import { useCompensationForm as R } from "./components/UNSTABLE_Hooks/hooks/useCompensationForm/useCompensationForm.js";
+import { useEmployeeDetailsForm as j } from "./components/UNSTABLE_Hooks/hooks/useEmployeeDetailsForm/useEmployeeDetailsForm.js";
+import { useFieldErrorMessage as z } from "./components/UNSTABLE_Hooks/form/useFieldErrorMessage.js";
+import { useWorkAddressForm as J } from "./components/UNSTABLE_Hooks/hooks/useWorkAddressForm/useWorkAddressForm.js";
+import { withOptions as Q } from "./components/UNSTABLE_Hooks/form/withOptions.js";
 export {
-  d as CheckboxHookField,
-  i as CompensationErrorCodes,
+  s as CheckboxHookField,
+  d as CompensationErrorCodes,
   f as CompensationForm,
-  a as DatePickerHookField,
+  F as DatePickerHookField,
   k as EmployeeDetailsErrorCodes,
   u as EmployeeDetailsForm,
-  H as FormFieldsMetadataProvider,
-  C as NumberInputHookField,
-  M as RadioGroupHookField,
-  b as SDKFormProvider,
-  v as SelectHookField,
+  H as NumberInputHookField,
+  C as RadioGroupHookField,
+  S as SDKFormProvider,
+  h as SelectHookField,
   A as SwitchHookField,
-  W as TextInputHookField,
+  g as TextInputHookField,
   w as WorkAddressErrorCodes,
-  G as WorkAddressForm,
+  M as WorkAddressForm,
   m as collectErrors,
-  N as composeSubmitHandler,
-  R as deriveFieldsMetadata,
-  j as useCompensationForm,
-  z as useEmployeeDetailsForm,
+  G as composeSubmitHandler,
+  N as deriveFieldsMetadata,
+  R as useCompensationForm,
+  j as useEmployeeDetailsForm,
   e as useErrorHandling,
-  J as useFieldErrorMessage,
-  Q as useFieldsMetadata,
-  V as useWorkAddressForm,
-  Y as withOptions
+  z as useFieldErrorMessage,
+  J as useWorkAddressForm,
+  Q as withOptions
 };
 //# sourceMappingURL=UNSTABLE_Hooks.js.map

package/dist/UNSTABLE_Hooks.js.map

@@ -1 +1 @@
-{"version":3,"file":"UNSTABLE_Hooks.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"UNSTABLE_Hooks.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/assets/icons/filter-funnel.svg.js

@@ -0,0 +1,10 @@
+import * as e from "react";
+const o = ({
+  title: t,
+  titleId: r,
+  ...n
+}) => /* @__PURE__ */ e.createElement("svg", { width: 20, height: 20, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-labelledby": r, ...n }, t ? /* @__PURE__ */ e.createElement("title", { id: r }, t) : null, /* @__PURE__ */ e.createElement("path", { d: "M5 10H15M2.5 5H17.5M7.5 15H12.5", stroke: "currentColor", strokeWidth: 1.66667, strokeLinecap: "round", strokeLinejoin: "round" }));
+export {
+  o as default
+};
+//# sourceMappingURL=filter-funnel.svg.js.map

package/dist/assets/icons/filter-funnel.svg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"filter-funnel.svg.js","sources":["../../../src/assets/icons/filter-funnel.svg?react"],"sourcesContent":["import * as React from \"react\";\nconst SvgFilterFunnel = ({\n  title,\n  titleId,\n  ...props\n}) => /* @__PURE__ */ React.createElement(\"svg\", { width: 20, height: 20, viewBox: \"0 0 20 20\", fill: \"none\", xmlns: \"http://www.w3.org/2000/svg\", \"aria-labelledby\": titleId, ...props }, title ? /* @__PURE__ */ React.createElement(\"title\", { id: titleId }, title) : null, /* @__PURE__ */ React.createElement(\"path\", { d: \"M5 10H15M2.5 5H17.5M7.5 15H12.5\", stroke: \"currentColor\", strokeWidth: 1.66667, strokeLinecap: \"round\", strokeLinejoin: \"round\" }));\nexport default SvgFilterFunnel;\n"],"names":["SvgFilterFunnel","title","titleId","props","React"],"mappings":";AACK,MAACA,IAAkB,CAAC;AAAA,EACvB,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,GAAGC;AACL,MAAsB,gBAAAC,EAAM,cAAc,OAAO,EAAE,OAAO,IAAI,QAAQ,IAAI,SAAS,aAAa,MAAM,QAAQ,OAAO,8BAA8B,mBAAmBF,GAAS,GAAGC,EAAK,GAAIF,IAAwB,gBAAAG,EAAM,cAAc,SAAS,EAAE,IAAIF,KAAWD,CAAK,IAAI,MAAsB,gBAAAG,EAAM,cAAc,QAAQ,EAAE,GAAG,mCAAmC,QAAQ,gBAAgB,aAAa,SAAS,eAAe,SAAS,gBAAgB,SAAS,CAAC;"}

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

@@ -6,9 +6,10 @@ export type DataTableProps<T> = {
     data: useDataViewPropReturn<T>['data'];
     itemMenu?: useDataViewPropReturn<T>['itemMenu'];
     onSelect?: useDataViewPropReturn<T>['onSelect'];
+    isItemSelected?: useDataViewPropReturn<T>['isItemSelected'];
     emptyState?: useDataViewPropReturn<T>['emptyState'];
     footer?: useDataViewPropReturn<T>['footer'];
     variant?: TableProps['variant'];
     selectionMode?: SelectionMode;
 };
-export declare const DataTable: <T>({ label, data, columns, itemMenu, onSelect, emptyState, footer, variant, selectionMode, }: DataTableProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const DataTable: <T>({ label, data, columns, itemMenu, onSelect, isItemSelected, emptyState, footer, variant, selectionMode, }: DataTableProps<T>) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,83 +1,92 @@
 import { jsx as l } from "react/jsx-runtime";
-import { useId as v, useState as x } from "react";
-import { useTranslation as T } from "react-i18next";
-import { useComponentContext as V } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
-import { VisuallyHidden as p } from "../../VisuallyHidden/VisuallyHidden.js";
-function w(i, o) {
-  if (o.render)
-    return o.render(i);
-  if (o.key) {
-    const a = o.key;
-    return String(i[a] ?? "");
+import { useId as T, useState as V } from "react";
+import { useTranslation as F } from "react-i18next";
+import { useComponentContext as j } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+import { VisuallyHidden as b } from "../../VisuallyHidden/VisuallyHidden.js";
+function x(c, n) {
+  if (n.render)
+    return n.render(c);
+  if (n.key) {
+    const s = n.key;
+    return String(c[s] ?? "");
   }
   return "";
 }
-const q = ({
-  label: i,
-  data: o,
-  columns: a,
-  itemMenu: c,
-  onSelect: n,
-  emptyState: f,
-  footer: k,
-  variant: b,
-  selectionMode: h = "multiple"
+const w = ({
+  label: c,
+  data: n,
+  columns: s,
+  itemMenu: i,
+  onSelect: a,
+  isItemSelected: f,
+  emptyState: k,
+  footer: p,
+  variant: h,
+  selectionMode: C = "multiple"
 }) => {
-  const u = V(), { t: d } = T("common"), C = v(), [g, m] = x(null), R = [
-    ...n ? [
+  const u = j(), { t: d } = F("common"), g = T(), [R, $] = V(null), m = [
+    ...a ? [
       {
         key: "select-header",
-        content: /* @__PURE__ */ l(p, { children: d("table.selectRowHeader") })
+        content: /* @__PURE__ */ l(b, { children: d("table.selectRowHeader") })
       }
     ] : [],
-    ...a.map((t, e) => ({
+    ...s.map((t, e) => ({
       key: typeof t.key == "string" ? t.key : `header-${e}`,
       content: t.title
     })),
-    ...c ? [
+    ...i ? [
       {
         key: "actions-header",
-        content: /* @__PURE__ */ l(p, { children: d("table.actionsColumnHeader") })
+        content: /* @__PURE__ */ l(b, { children: d("table.actionsColumnHeader") })
       }
     ] : []
-  ], $ = (t, e) => {
-    m(e), n?.(t, !0);
-  }, D = (t, e) => h === "single" ? /* @__PURE__ */ l(
-    u.Radio,
-    {
-      name: C,
-      value: g === e,
-      onChange: () => {
-        $(t, e);
-      },
-      label: d("table.selectRowLabel"),
-      shouldVisuallyHideLabel: !0
-    }
-  ) : /* @__PURE__ */ l(
-    u.Checkbox,
-    {
-      onChange: (r) => {
-        n?.(t, r);
-      },
-      label: d("table.selectRowLabel"),
-      shouldVisuallyHideLabel: !0
+  ], D = (t, e) => {
+    $(e), a?.(t, !0);
+  }, H = (t, e) => {
+    if (C === "single") {
+      const o = f?.(t, e) ?? R === e;
+      return /* @__PURE__ */ l(
+        u.Radio,
+        {
+          name: g,
+          value: o,
+          onChange: () => {
+            D(t, e);
+          },
+          label: d("table.selectRowLabel"),
+          shouldVisuallyHideLabel: !0
+        }
+      );
     }
-  ), H = o.map((t, e) => {
+    const r = f?.(t, e) ?? !1;
+    return /* @__PURE__ */ l(
+      u.Checkbox,
+      {
+        value: r,
+        onChange: (o) => {
+          a?.(t, o);
+        },
+        label: d("table.selectRowLabel"),
+        shouldVisuallyHideLabel: !0
+      }
+    );
+  }, v = n.map((t, e) => {
     const r = [
-      ...n ? [
+      ...a ? [
         {
           key: `select-${e}`,
-          content: D(t, e)
+          content: H(t, e)
         }
       ] : [],
-      ...a.map((s, y) => ({
-        key: typeof s.key == "string" ? s.key : `cell-${y}`,
-        content: w(t, s)
+      ...s.map((o, y) => ({
+        key: typeof o.key == "string" ? o.key : `cell-${y}`,
+        content: x(t, o)
       })),
-      ...c ? [
+      ...i ? [
         {
           key: `menu-${e}`,
-          content: c(t)
+          content: i(t)
         }
       ] : []
     ];
@@ -86,18 +95,18 @@ const q = ({
       data: r
     };
   }), L = (() => {
-    if (!k) return;
-    const t = k(), e = [];
-    return n && e.push({
+    if (!p) return;
+    const t = p(), e = [];
+    return a && e.push({
       key: "footer-select",
       content: ""
-    }), a.forEach((r, s) => {
-      const y = typeof r.key == "string" ? r.key : `column-${s}`;
+    }), s.forEach((r, o) => {
+      const y = typeof r.key == "string" ? r.key : `column-${o}`;
       e.push({
         key: `footer-${y}`,
         content: t[y] || ""
       });
-    }), c && e.push({
+    }), i && e.push({
       key: "footer-actions",
       content: ""
     }), e;
@@ -105,18 +114,18 @@ const q = ({
   return /* @__PURE__ */ l(
     u.Table,
     {
-      "aria-label": i,
+      "aria-label": c,
       "data-testid": "data-table",
-      headers: R,
-      rows: H,
+      headers: m,
+      rows: v,
       footer: L,
-      emptyState: f ? f() : void 0,
-      variant: b,
-      hasCheckboxColumn: !!n
+      emptyState: k ? k() : void 0,
+      variant: h,
+      hasCheckboxColumn: !!a
     }
   );
 };
 export {
-  q as DataTable
+  w as DataTable
 };
 //# sourceMappingURL=DataTable.js.map

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 type { TableData, TableRow, TableProps } from '../../UI/Table/TableTypes'\nimport { VisuallyHidden } from '../../VisuallyHidden'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\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  emptyState?: useDataViewPropReturn<T>['emptyState']\n  footer?: useDataViewPropReturn<T>['footer']\n  variant?: TableProps['variant']\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  emptyState,\n  footer,\n  variant,\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\n  const headers: TableData[] = [\n    ...(onSelect\n      ? [\n          {\n            key: 'select-header',\n            content: <VisuallyHidden>{t('table.selectRowHeader')}</VisuallyHidden>,\n          },\n        ]\n      : []),\n    ...columns.map((column, index) => ({\n      key: typeof column.key === 'string' ? column.key : `header-${index}`,\n      content: column.title,\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      return (\n        <Components.Radio\n          name={radioGroupName}\n          value={selectedRadioIndex === rowIndex}\n          onChange={() => {\n            handleRadioSelect(item, rowIndex)\n          }}\n          label={t('table.selectRowLabel')}\n          shouldVisuallyHideLabel\n        />\n      )\n    }\n\n    return (\n      <Components.Checkbox\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: getCellContent(item, column),\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      variant={variant}\n      hasCheckboxColumn={!!onSelect}\n    />\n  )\n}\n"],"names":["getCellContent","item","column","key","DataTable","label","data","columns","itemMenu","onSelect","emptyState","footer","variant","selectionMode","Components","useComponentContext","t","useTranslation","radioGroupName","useId","selectedRadioIndex","setSelectedRadioIndex","useState","headers","jsx","VisuallyHidden","index","handleRadioSelect","rowIndex","renderSelectionControl","checked","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 type { TableData, TableRow, TableProps } from '../../UI/Table/TableTypes'\nimport { VisuallyHidden } from '../../VisuallyHidden'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\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  isItemSelected?: useDataViewPropReturn<T>['isItemSelected']\n  emptyState?: useDataViewPropReturn<T>['emptyState']\n  footer?: useDataViewPropReturn<T>['footer']\n  variant?: TableProps['variant']\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  isItemSelected,\n  emptyState,\n  footer,\n  variant,\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\n  const headers: TableData[] = [\n    ...(onSelect\n      ? [\n          {\n            key: 'select-header',\n            content: <VisuallyHidden>{t('table.selectRowHeader')}</VisuallyHidden>,\n          },\n        ]\n      : []),\n    ...columns.map((column, index) => ({\n      key: typeof column.key === 'string' ? column.key : `header-${index}`,\n      content: column.title,\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 = isItemSelected?.(item, rowIndex) ?? 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 = isItemSelected?.(item, rowIndex) ?? 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: getCellContent(item, column),\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      variant={variant}\n      hasCheckboxColumn={!!onSelect}\n    />\n  )\n}\n"],"names":["getCellContent","item","column","key","DataTable","label","data","columns","itemMenu","onSelect","isItemSelected","emptyState","footer","variant","selectionMode","Components","useComponentContext","t","useTranslation","radioGroupName","useId","selectedRadioIndex","setSelectedRadioIndex","useState","headers","jsx","VisuallyHidden","index","handleRadioSelect","rowIndex","renderSelectionControl","isSelected","checked","rows","rowData","colIndex","footerData","footerContent","footerCells","columnKey"],"mappings":"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"}

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

@@ -0,0 +1,17 @@
+interface DateRangeFilterProps {
+    startDate: Date | null;
+    endDate: Date | null;
+    onStartDateChange: (date: Date | null) => void;
+    onEndDateChange: (date: Date | null) => void;
+    onClear: () => void;
+    startDateLabel: string;
+    endDateLabel: string;
+    applyLabel: string;
+    resetLabel: string;
+    triggerLabel: string;
+    isFilterActive: boolean;
+    maxEndDate?: Date;
+    minStartDate?: Date;
+}
+export declare const DateRangeFilter: ({ startDate, endDate, onStartDateChange, onEndDateChange, onClear, startDateLabel, endDateLabel, applyLabel, resetLabel, triggerLabel, isFilterActive, maxEndDate, minStartDate, }: DateRangeFilterProps) => import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -0,0 +1,100 @@
+import { jsxs as f, Fragment as H, jsx as n } from "react/jsx-runtime";
+import { useState as v, useRef as M, useCallback as t, useMemo as _ } from "react";
+import { Popover as q, Dialog as w } from "react-aria-components";
+import k from "./DateRangeFilter.module.scss.js";
+import { Flex as z } from "../Flex/Flex.js";
+import { useComponentContext as E } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import { useTheme as G } from "../../../contexts/ThemeProvider/useTheme.js";
+/* empty css                       */
+import $ from "../../../assets/icons/filter-funnel.svg.js";
+const b = (e) => e.toLocaleDateString("en-US", { month: "short", day: "numeric" }), nn = ({
+  startDate: e,
+  endDate: o,
+  onStartDateChange: d,
+  onEndDateChange: h,
+  onClear: i,
+  startDateLabel: s,
+  endDateLabel: c,
+  applyLabel: B,
+  resetLabel: F,
+  triggerLabel: g,
+  isFilterActive: R,
+  maxEndDate: O,
+  minStartDate: S
+}) => {
+  const { Button: u, ButtonIcon: j, DateRangePicker: N } = E(), { container: P } = G(), [p, l] = v(!1), [r, x] = v(null), m = M(null), y = t(() => {
+    x(e && o ? { start: e, end: o } : null), l(!0);
+  }, [e, o]), U = t(() => {
+    l(!1);
+  }, []), V = t(() => {
+    r ? (d(r.start), h(r.end)) : i(), l(!1);
+  }, [r, d, h, i]), I = t(() => {
+    i(), l(!1);
+  }, [i]), T = t((a) => {
+    x(a);
+  }, []), C = _(() => !R || !e || !o ? null : `${b(e)} – ${b(o)}`, [R, e, o]), A = C ? /* @__PURE__ */ n(
+    u,
+    {
+      buttonRef: m,
+      "aria-label": g,
+      "aria-haspopup": "dialog",
+      "aria-expanded": p,
+      onClick: y,
+      variant: "secondary",
+      icon: /* @__PURE__ */ n($, {}),
+      className: k.triggerButton,
+      children: C
+    }
+  ) : /* @__PURE__ */ n(
+    j,
+    {
+      buttonRef: m,
+      "aria-label": g,
+      "aria-haspopup": "dialog",
+      "aria-expanded": p,
+      onClick: y,
+      variant: "tertiary",
+      children: /* @__PURE__ */ n($, {})
+    }
+  );
+  return /* @__PURE__ */ f(H, { children: [
+    A,
+    /* @__PURE__ */ n(
+      q,
+      {
+        UNSTABLE_portalContainer: P.current,
+        isOpen: p,
+        onOpenChange: (a) => {
+          a || U();
+        },
+        triggerRef: m,
+        placement: "bottom end",
+        offset: 8,
+        shouldUpdatePosition: !0,
+        children: /* @__PURE__ */ n(w, { "aria-label": `${s} – ${c}`, children: /* @__PURE__ */ f("div", { className: k.popoverContent, children: [
+          /* @__PURE__ */ n(
+            N,
+            {
+              label: `${s} – ${c}`,
+              shouldVisuallyHideLabel: !0,
+              value: r,
+              onChange: T,
+              startDateLabel: s,
+              endDateLabel: c,
+              minValue: S,
+              maxValue: O
+            }
+          ),
+          /* @__PURE__ */ f(z, { gap: 8, justifyContent: "flex-end", children: [
+            /* @__PURE__ */ n(u, { variant: "tertiary", onClick: I, children: F }),
+            /* @__PURE__ */ n(u, { variant: "primary", onClick: V, children: B })
+          ] })
+        ] }) })
+      }
+    )
+  ] });
+};
+export {
+  nn as DateRangeFilter
+};
+//# sourceMappingURL=DateRangeFilter.js.map

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

@@ -0,0 +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  resetLabel: 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  resetLabel,\n  triggerLabel,\n  isFilterActive,\n  maxEndDate,\n  minStartDate,\n}: DateRangeFilterProps) => {\n  const { Button, ButtonIcon, 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    onClear()\n    setIsOpen(false)\n  }, [onClear])\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 = filterDateLabel ? (\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}\n    </Button>\n  ) : (\n    <ButtonIcon\n      buttonRef={triggerRef}\n      aria-label={triggerLabel}\n      aria-haspopup=\"dialog\"\n      aria-expanded={isOpen}\n      onClick={handleOpen}\n      variant=\"tertiary\"\n    >\n      <FilterFunnelIcon />\n    </ButtonIcon>\n  )\n\n  return (\n    <>\n      {triggerButton}\n\n      <Popover\n        UNSTABLE_portalContainer={container.current}\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 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\n            <Flex gap={8} justifyContent=\"flex-end\">\n              <Button variant=\"tertiary\" onClick={handleReset}>\n                {resetLabel}\n              </Button>\n              <Button variant=\"primary\" onClick={handleApply}>\n                {applyLabel}\n              </Button>\n            </Flex>\n          </div>\n        </Dialog>\n      </Popover>\n    </>\n  )\n}\n"],"names":["formatFilterDate","date","DateRangeFilter","startDate","endDate","onStartDateChange","onEndDateChange","onClear","startDateLabel","endDateLabel","applyLabel","resetLabel","triggerLabel","isFilterActive","maxEndDate","minStartDate","Button","ButtonIcon","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":"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"}

package/dist/components/Common/DateRangeFilter/DateRangeFilter.module.scss.js

@@ -0,0 +1,10 @@
+const t = "_triggerButton_151is_1", o = "_popoverContent_151is_6", e = {
+  triggerButton: t,
+  popoverContent: o
+};
+export {
+  e as default,
+  o as popoverContent,
+  t as triggerButton
+};
+//# sourceMappingURL=DateRangeFilter.module.scss.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DateRangeFilter.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

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

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