@gusto/embedded-react-sdk 0.48.3 → 0.49.0

package/dist/components/Company/OnboardingOverview/OnboardingOverview.d.ts

@@ -1,5 +1,11 @@
-import { BaseComponentInterface, CommonComponentInterface } from '../../Base';
-interface OnboardingOverviewProps extends CommonComponentInterface<'Company.OnboardingOverview'> {
+import { BaseComponentInterface } from '../../Base';
+/**
+ * Props for the {@link OnboardingOverview} component.
+ *
+ * @public
+ */
+export interface OnboardingOverviewProps extends BaseComponentInterface<'Company.OnboardingOverview'> {
+    /** The associated company identifier. */
     companyId: string;
 }
 /**
@@ -11,6 +17,7 @@ interface OnboardingOverviewProps extends CommonComponentInterface<'Company.Onbo
  * steps is rendered with a continue action. Provide `children` to override the default layout while
  * still consuming the onboarding status via context.
  *
+ * @events
  * | Event | Description | Data |
  * | ----- | ----------- | ---- |
  * | `company/overview/continue` | Fired when the user chooses to continue to the next outstanding onboarding requirement | — |
@@ -20,5 +27,4 @@ interface OnboardingOverviewProps extends CommonComponentInterface<'Company.Onbo
  * @returns The rendered onboarding overview section.
  * @public
  */
-export declare function OnboardingOverview(props: OnboardingOverviewProps & BaseComponentInterface): import("react").JSX.Element;
-export {};
+export declare function OnboardingOverview(props: OnboardingOverviewProps): import("react").JSX.Element;

package/dist/components/Company/OnboardingOverview/OnboardingOverview.js.map

@@ -1 +1 @@
-{"version":3,"file":"OnboardingOverview.js","sources":["../../../../src/components/Company/OnboardingOverview/OnboardingOverview.tsx"],"sourcesContent":["import { useCompaniesGetOnboardingStatusSuspense } from '@gusto/embedded-api-v-2025-11-15/react-query/companiesGetOnboardingStatus'\nimport { OnboardingOverviewProvider } from './context'\nimport { MissingRequirements } from './MissingRequirements'\nimport { Completed } from './Completed'\nimport {\n  BaseComponent,\n  useBase,\n  type BaseComponentInterface,\n  type CommonComponentInterface,\n} from '@/components/Base'\nimport { useI18n } from '@/i18n'\nimport { Flex } from '@/components/Common'\nimport { componentEvents } from '@/shared/constants'\nimport { useComponentDictionary } from '@/i18n/I18n'\n\ninterface OnboardingOverviewProps extends CommonComponentInterface<'Company.OnboardingOverview'> {\n  companyId: string\n}\n\n/**\n * Displays the company's overall onboarding status, showing completed steps alongside any remaining requirements.\n *\n * @remarks\n * Renders as the landing or summary screen of a company onboarding flow. When `onboardingCompleted`\n * is true, a completion message and \"done\" action are shown; otherwise a checklist of outstanding\n * steps is rendered with a continue action. Provide `children` to override the default layout while\n * still consuming the onboarding status via context.\n *\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `company/overview/continue` | Fired when the user chooses to continue to the next outstanding onboarding requirement | — |\n * | `company/overview/done` | Fired when the user signals they are done with the overview screen, typically after onboarding ends | — |\n *\n * @param props - Component props including the target `companyId` and standard base/common component options.\n * @returns The rendered onboarding overview section.\n * @public\n */\nexport function OnboardingOverview(props: OnboardingOverviewProps & BaseComponentInterface) {\n  useI18n('Company.OnboardingOverview')\n  useComponentDictionary('Company.OnboardingOverview', props.dictionary)\n  return (\n    <BaseComponent {...props}>\n      <Root {...props}>{props.children}</Root>\n    </BaseComponent>\n  )\n}\n\nconst Root = ({ companyId, className, children }: OnboardingOverviewProps) => {\n  const { onEvent } = useBase()\n\n  const { data } = useCompaniesGetOnboardingStatusSuspense({ companyUuid: companyId })\n  const { onboardingCompleted, onboardingSteps } = data.companyOnboardingStatus!\n\n  const handleDone = () => {\n    onEvent(componentEvents.COMPANY_OVERVIEW_DONE)\n  }\n  const handleContinue = () => {\n    onEvent(componentEvents.COMPANY_OVERVIEW_CONTINUE)\n  }\n\n  return (\n    <section className={className}>\n      <OnboardingOverviewProvider\n        value={{\n          onboardingCompleted,\n          onboardingSteps,\n          handleDone,\n          handleContinue,\n        }}\n      >\n        <Flex flexDirection=\"column\" gap={32}>\n          {children ? (\n            children\n          ) : (\n            <>\n              <Completed />\n              <MissingRequirements />\n            </>\n          )}\n        </Flex>\n      </OnboardingOverviewProvider>\n    </section>\n  )\n}\n"],"names":["OnboardingOverview","props","useI18n","useComponentDictionary","jsx","BaseComponent","Root","companyId","className","children","onEvent","useBase","data","useCompaniesGetOnboardingStatusSuspense","onboardingCompleted","onboardingSteps","OnboardingOverviewProvider","componentEvents","Flex","jsxs","Fragment","Completed","MissingRequirements"],"mappings":";;;;;;;;;;;;;AAqCO,SAASA,EAAmBC,GAAyD;AAC1F,SAAAC,EAAQ,4BAA4B,GACpCC,EAAuB,8BAA8BF,EAAM,UAAU,GAEnE,gBAAAG,EAACC,GAAA,EAAe,GAAGJ,GACjB,UAAA,gBAAAG,EAACE,KAAM,GAAGL,GAAQ,UAAAA,EAAM,SAAA,CAAS,EAAA,CACnC;AAEJ;AAEA,MAAMK,IAAO,CAAC,EAAE,WAAAC,GAAW,WAAAC,GAAW,UAAAC,QAAwC;AAC5E,QAAM,EAAE,SAAAC,EAAA,IAAYC,EAAA,GAEd,EAAE,MAAAC,EAAA,IAASC,EAAwC,EAAE,aAAaN,GAAW,GAC7E,EAAE,qBAAAO,GAAqB,iBAAAC,EAAA,IAAoBH,EAAK;AAStD,SACE,gBAAAR,EAAC,aAAQ,WAAAI,GACP,UAAA,gBAAAJ;AAAA,IAACY;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,QACL,qBAAAF;AAAA,QACA,iBAAAC;AAAA,QACA,YAbW,MAAM;AACvB,UAAAL,EAAQO,EAAgB,qBAAqB;AAAA,QAC/C;AAAA,QAYQ,gBAXe,MAAM;AAC3B,UAAAP,EAAQO,EAAgB,yBAAyB;AAAA,QACnD;AAAA,MASQ;AAAA,MAGF,UAAA,gBAAAb,EAACc,KAAK,eAAc,UAAS,KAAK,IAC/B,UAAAT,KAGC,gBAAAU,EAAAC,GAAA,EACE,UAAA;AAAA,QAAA,gBAAAhB,EAACiB,GAAA,EAAU;AAAA,0BACVC,GAAA,CAAA,CAAoB;AAAA,MAAA,EAAA,CACvB,EAAA,CAEJ;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;"}
+{"version":3,"file":"OnboardingOverview.js","sources":["../../../../src/components/Company/OnboardingOverview/OnboardingOverview.tsx"],"sourcesContent":["import { useCompaniesGetOnboardingStatusSuspense } from '@gusto/embedded-api-v-2025-11-15/react-query/companiesGetOnboardingStatus'\nimport { OnboardingOverviewProvider } from './context'\nimport { MissingRequirements } from './MissingRequirements'\nimport { Completed } from './Completed'\nimport { BaseComponent, useBase, type BaseComponentInterface } from '@/components/Base'\nimport { useI18n } from '@/i18n'\nimport { Flex } from '@/components/Common'\nimport { componentEvents } from '@/shared/constants'\nimport { useComponentDictionary } from '@/i18n/I18n'\n\n/**\n * Props for the {@link OnboardingOverview} component.\n *\n * @public\n */\nexport interface OnboardingOverviewProps extends BaseComponentInterface<'Company.OnboardingOverview'> {\n  /** The associated company identifier. */\n  companyId: string\n}\n\n/**\n * Displays the company's overall onboarding status, showing completed steps alongside any remaining requirements.\n *\n * @remarks\n * Renders as the landing or summary screen of a company onboarding flow. When `onboardingCompleted`\n * is true, a completion message and \"done\" action are shown; otherwise a checklist of outstanding\n * steps is rendered with a continue action. Provide `children` to override the default layout while\n * still consuming the onboarding status via context.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `company/overview/continue` | Fired when the user chooses to continue to the next outstanding onboarding requirement | — |\n * | `company/overview/done` | Fired when the user signals they are done with the overview screen, typically after onboarding ends | — |\n *\n * @param props - Component props including the target `companyId` and standard base/common component options.\n * @returns The rendered onboarding overview section.\n * @public\n */\nexport function OnboardingOverview(props: OnboardingOverviewProps) {\n  useI18n('Company.OnboardingOverview')\n  useComponentDictionary('Company.OnboardingOverview', props.dictionary)\n  return (\n    <BaseComponent {...props}>\n      <Root {...props}>{props.children}</Root>\n    </BaseComponent>\n  )\n}\n\nconst Root = ({ companyId, className, children }: OnboardingOverviewProps) => {\n  const { onEvent } = useBase()\n\n  const { data } = useCompaniesGetOnboardingStatusSuspense({ companyUuid: companyId })\n  const { onboardingCompleted, onboardingSteps } = data.companyOnboardingStatus!\n\n  const handleDone = () => {\n    onEvent(componentEvents.COMPANY_OVERVIEW_DONE)\n  }\n  const handleContinue = () => {\n    onEvent(componentEvents.COMPANY_OVERVIEW_CONTINUE)\n  }\n\n  return (\n    <section className={className}>\n      <OnboardingOverviewProvider\n        value={{\n          onboardingCompleted,\n          onboardingSteps,\n          handleDone,\n          handleContinue,\n        }}\n      >\n        <Flex flexDirection=\"column\" gap={32}>\n          {children ? (\n            children\n          ) : (\n            <>\n              <Completed />\n              <MissingRequirements />\n            </>\n          )}\n        </Flex>\n      </OnboardingOverviewProvider>\n    </section>\n  )\n}\n"],"names":["OnboardingOverview","props","useI18n","useComponentDictionary","jsx","BaseComponent","Root","companyId","className","children","onEvent","useBase","data","useCompaniesGetOnboardingStatusSuspense","onboardingCompleted","onboardingSteps","OnboardingOverviewProvider","componentEvents","Flex","jsxs","Fragment","Completed","MissingRequirements"],"mappings":";;;;;;;;;;;;;AAuCO,SAASA,EAAmBC,GAAgC;AACjE,SAAAC,EAAQ,4BAA4B,GACpCC,EAAuB,8BAA8BF,EAAM,UAAU,GAEnE,gBAAAG,EAACC,GAAA,EAAe,GAAGJ,GACjB,UAAA,gBAAAG,EAACE,KAAM,GAAGL,GAAQ,UAAAA,EAAM,SAAA,CAAS,EAAA,CACnC;AAEJ;AAEA,MAAMK,IAAO,CAAC,EAAE,WAAAC,GAAW,WAAAC,GAAW,UAAAC,QAAwC;AAC5E,QAAM,EAAE,SAAAC,EAAA,IAAYC,EAAA,GAEd,EAAE,MAAAC,EAAA,IAASC,EAAwC,EAAE,aAAaN,GAAW,GAC7E,EAAE,qBAAAO,GAAqB,iBAAAC,EAAA,IAAoBH,EAAK;AAStD,SACE,gBAAAR,EAAC,aAAQ,WAAAI,GACP,UAAA,gBAAAJ;AAAA,IAACY;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,QACL,qBAAAF;AAAA,QACA,iBAAAC;AAAA,QACA,YAbW,MAAM;AACvB,UAAAL,EAAQO,EAAgB,qBAAqB;AAAA,QAC/C;AAAA,QAYQ,gBAXe,MAAM;AAC3B,UAAAP,EAAQO,EAAgB,yBAAyB;AAAA,QACnD;AAAA,MASQ;AAAA,MAGF,UAAA,gBAAAb,EAACc,KAAK,eAAc,UAAS,KAAK,IAC/B,UAAAT,KAGC,gBAAAU,EAAAC,GAAA,EACE,UAAA;AAAA,QAAA,gBAAAhB,EAACiB,GAAA,EAAU;AAAA,0BACVC,GAAA,CAAA,CAAoB;AAAA,MAAA,EAAA,CACvB,EAAA,CAEJ;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;"}

package/dist/components/Company/OnboardingOverview/context.js

@@ -11,11 +11,10 @@ import "@gusto/embedded-api-v-2025-11-15/models/errors/unprocessableentityerror"
 import "@gusto/embedded-api-v-2025-11-15/models/errors/httpclienterrors";
 import "../../../shared/constants.js";
 import "../../../contexts/ComponentAdapter/useComponentContext.js";
-import "../../../contexts/LoadingIndicatorProvider/useLoadingIndicator.js";
 import { createCompoundContext as o } from "../../Base/createCompoundContext.js";
-const [C, c] = o("OnboardingOverviewContext");
+const [x, C] = o("OnboardingOverviewContext");
 export {
-  c as OnboardingOverviewProvider,
-  C as useOnboardingOverview
+  C as OnboardingOverviewProvider,
+  x as useOnboardingOverview
 };
 //# sourceMappingURL=context.js.map

package/dist/components/Company/OnboardingOverview/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","sources":["../../../../src/components/Company/OnboardingOverview/context.ts"],"sourcesContent":["import type { OnboardingStep } from '@gusto/embedded-api-v-2025-11-15/models/components/companyonboardingstatus'\nimport { createCompoundContext } from '@/components/Base'\n\ntype OnboardingOverviewContextType = {\n  onboardingCompleted?: boolean\n  onboardingSteps?: OnboardingStep[]\n  handleDone: () => void\n  handleContinue: () => void\n}\n\nconst [useOnboardingOverview, OnboardingOverviewProvider] =\n  createCompoundContext<OnboardingOverviewContextType>('OnboardingOverviewContext')\n\nexport { useOnboardingOverview, OnboardingOverviewProvider }\n"],"names":["useOnboardingOverview","OnboardingOverviewProvider","createCompoundContext"],"mappings":";;;;;;;;;;;;;;;AAUA,MAAM,CAACA,GAAuBC,CAA0B,IACtDC,EAAqD,2BAA2B;"}
+{"version":3,"file":"context.js","sources":["../../../../src/components/Company/OnboardingOverview/context.ts"],"sourcesContent":["import type { OnboardingStep } from '@gusto/embedded-api-v-2025-11-15/models/components/companyonboardingstatus'\nimport { createCompoundContext } from '@/components/Base'\n\ntype OnboardingOverviewContextType = {\n  onboardingCompleted?: boolean\n  onboardingSteps?: OnboardingStep[]\n  handleDone: () => void\n  handleContinue: () => void\n}\n\nconst [useOnboardingOverview, OnboardingOverviewProvider] =\n  createCompoundContext<OnboardingOverviewContextType>('OnboardingOverviewContext')\n\nexport { useOnboardingOverview, OnboardingOverviewProvider }\n"],"names":["useOnboardingOverview","OnboardingOverviewProvider","createCompoundContext"],"mappings":";;;;;;;;;;;;;;AAUA,MAAM,CAACA,GAAuBC,CAA0B,IACtDC,EAAqD,2BAA2B;"}

package/dist/components/Company/PaySchedule/PaySchedule.d.ts

@@ -1,5 +1,5 @@
 import { PayScheduleFormData } from './shared/usePayScheduleForm/payScheduleSchema';
-import { BaseComponentInterface, CommonComponentInterface } from '../../Base';
+import { BaseComponentInterface } from '../../Base';
 import { RequireAtLeastOne } from '../../../types/Helpers';
 /**
  * The full set of fields that may be pre-filled on the {@link PaySchedule} create form.
@@ -21,7 +21,7 @@ export type PayScheduleDefaultValues = RequireAtLeastOne<Partial<PayScheduleDefa
  *
  * @public
  */
-export interface PayScheduleProps extends CommonComponentInterface<'Company.PaySchedule'> {
+export interface PayScheduleProps extends BaseComponentInterface<'Company.PaySchedule'> {
     /** Identifier of the company whose pay schedules are managed. */
     companyId: string;
     /** Default values used to pre-fill the create form. Ignored fields not listed in {@link PayScheduleDefaultValues}. */
@@ -34,6 +34,7 @@ export interface PayScheduleProps extends CommonComponentInterface<'Company.PayS
  * Renders the schedule list when at least one pay schedule exists and the create form otherwise.
  * Emits the following events through `onEvent`:
  *
+ * @events
  * | Event | Description | Data |
  * | ----- | ----------- | ---- |
  * | `paySchedule/created` | A new pay schedule was created | The created pay schedule entity |
@@ -43,4 +44,4 @@ export interface PayScheduleProps extends CommonComponentInterface<'Company.PayS
  * @returns The pay schedule list or form depending on whether any schedules exist.
  * @public
  */
-export declare const PaySchedule: ({ companyId, defaultValues, dictionary, ...props }: PayScheduleProps & BaseComponentInterface) => import("react").JSX.Element;
+export declare const PaySchedule: ({ companyId, defaultValues, dictionary, ...props }: PayScheduleProps) => import("react").JSX.Element;

package/dist/components/Company/PaySchedule/PaySchedule.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaySchedule.js","sources":["../../../../src/components/Company/PaySchedule/PaySchedule.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { createMachine } from 'robot3'\nimport { usePaySchedulesGetAllSuspense } from '@gusto/embedded-api-v-2025-11-15/react-query/paySchedulesGetAll'\nimport { payScheduleStateMachine } from './payScheduleStateMachine'\nimport type { PayScheduleContextInterface } from './PayScheduleComponents'\nimport { PayScheduleFormContextual, PayScheduleListContextual } from './PayScheduleComponents'\nimport type { PayScheduleFormData } from './shared/usePayScheduleForm/payScheduleSchema'\nimport type { BaseComponentInterface, CommonComponentInterface } from '@/components/Base'\nimport { BaseComponent, useBase } from '@/components/Base'\nimport { useI18n } from '@/i18n'\nimport { useComponentDictionary } from '@/i18n/I18n'\nimport { Flow } from '@/components/Flow/Flow'\nimport type { RequireAtLeastOne } from '@/types/Helpers'\n\n/**\n * The full set of fields that may be pre-filled on the {@link PaySchedule} create form.\n *\n * @public\n */\nexport type PayScheduleDefaultFields = {\n  [K in keyof Pick<\n    PayScheduleFormData,\n    'anchorPayDate' | 'anchorEndOfPayPeriod' | 'day1' | 'day2' | 'customName' | 'frequency'\n  >]: NonNullable<PayScheduleFormData[K]>\n}\n\n/**\n * Default values for the {@link PaySchedule} form fields. Server data for an existing pay schedule\n * takes precedence over these defaults when editing.\n *\n * @public\n */\nexport type PayScheduleDefaultValues = RequireAtLeastOne<Partial<PayScheduleDefaultFields>>\n\n/**\n * Props for the {@link PaySchedule} component.\n *\n * @public\n */\nexport interface PayScheduleProps extends CommonComponentInterface<'Company.PaySchedule'> {\n  /** Identifier of the company whose pay schedules are managed. */\n  companyId: string\n  /** Default values used to pre-fill the create form. Ignored fields not listed in {@link PayScheduleDefaultValues}. */\n  defaultValues?: PayScheduleDefaultValues\n}\n\n/**\n * Manages a company's pay schedules, including listing existing schedules and creating or editing one.\n *\n * @remarks\n * Renders the schedule list when at least one pay schedule exists and the create form otherwise.\n * Emits the following events through `onEvent`:\n *\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `paySchedule/created` | A new pay schedule was created | The created pay schedule entity |\n * | `paySchedule/updated` | An existing pay schedule was updated | The updated pay schedule entity |\n *\n * @param props - {@link PayScheduleProps} plus the standard base component props.\n * @returns The pay schedule list or form depending on whether any schedules exist.\n * @public\n */\nexport const PaySchedule = ({\n  companyId,\n  defaultValues,\n  dictionary,\n  ...props\n}: PayScheduleProps & BaseComponentInterface) => {\n  useI18n('Company.PaySchedule')\n  useComponentDictionary('Company.PaySchedule', dictionary)\n  return (\n    <BaseComponent {...props}>\n      <Root companyId={companyId} defaultValues={defaultValues} />\n    </BaseComponent>\n  )\n}\n\nfunction Root({ companyId, defaultValues }: PayScheduleProps) {\n  const { onEvent } = useBase()\n  const { data: paySchedules } = usePaySchedulesGetAllSuspense({ companyId })\n\n  const hasSchedules = (paySchedules.payScheduleShowResponse?.length ?? 0) > 0\n  const initialState = hasSchedules ? 'listSchedules' : 'addSchedule'\n  const initialComponent = hasSchedules ? PayScheduleListContextual : PayScheduleFormContextual\n\n  const machine = useMemo(\n    () =>\n      createMachine(\n        initialState,\n        payScheduleStateMachine,\n        (initialContext: PayScheduleContextInterface) => ({\n          ...initialContext,\n          component: initialComponent,\n          companyId,\n          defaultValues,\n        }),\n      ),\n    [companyId, defaultValues, initialState, initialComponent],\n  )\n\n  return <Flow machine={machine} onEvent={onEvent} />\n}\n"],"names":["PaySchedule","companyId","defaultValues","dictionary","props","useI18n","useComponentDictionary","jsx","BaseComponent","Root","onEvent","useBase","paySchedules","usePaySchedulesGetAllSuspense","hasSchedules","initialState","initialComponent","PayScheduleListContextual","PayScheduleFormContextual","machine","useMemo","createMachine","payScheduleStateMachine","initialContext","Flow"],"mappings":";;;;;;;;;;AA8DO,MAAMA,IAAc,CAAC;AAAA,EAC1B,WAAAC;AAAA,EACA,eAAAC;AAAA,EACA,YAAAC;AAAA,EACA,GAAGC;AACL,OACEC,EAAQ,qBAAqB,GAC7BC,EAAuB,uBAAuBH,CAAU,GAEtD,gBAAAI,EAACC,KAAe,GAAGJ,GACjB,4BAACK,GAAA,EAAK,WAAAR,GAAsB,eAAAC,GAA8B,EAAA,CAC5D;AAIJ,SAASO,EAAK,EAAE,WAAAR,GAAW,eAAAC,KAAmC;AAC5D,QAAM,EAAE,SAAAQ,EAAA,IAAYC,EAAA,GACd,EAAE,MAAMC,EAAA,IAAiBC,EAA8B,EAAE,WAAAZ,GAAW,GAEpEa,KAAgBF,EAAa,yBAAyB,UAAU,KAAK,GACrEG,IAAeD,IAAe,kBAAkB,eAChDE,IAAmBF,IAAeG,IAA4BC,GAE9DC,IAAUC;AAAA,IACd,MACEC;AAAA,MACEN;AAAA,MACAO;AAAA,MACA,CAACC,OAAiD;AAAA,QAChD,GAAGA;AAAA,QACH,WAAWP;AAAA,QACX,WAAAf;AAAA,QACA,eAAAC;AAAA,MAAA;AAAA,IACF;AAAA,IAEJ,CAACD,GAAWC,GAAea,GAAcC,CAAgB;AAAA,EAAA;AAG3D,SAAO,gBAAAT,EAACiB,GAAA,EAAK,SAAAL,GAAkB,SAAAT,EAAA,CAAkB;AACnD;"}
+{"version":3,"file":"PaySchedule.js","sources":["../../../../src/components/Company/PaySchedule/PaySchedule.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { createMachine } from 'robot3'\nimport { usePaySchedulesGetAllSuspense } from '@gusto/embedded-api-v-2025-11-15/react-query/paySchedulesGetAll'\nimport { payScheduleStateMachine } from './payScheduleStateMachine'\nimport type { PayScheduleContextInterface } from './PayScheduleComponents'\nimport { PayScheduleFormContextual, PayScheduleListContextual } from './PayScheduleComponents'\nimport type { PayScheduleFormData } from './shared/usePayScheduleForm/payScheduleSchema'\nimport type { BaseComponentInterface } from '@/components/Base'\nimport { BaseComponent, useBase } from '@/components/Base'\nimport type { BaseComponentKeys } from '@/components/Base/Base'\nimport { useI18n } from '@/i18n'\nimport { useComponentDictionary } from '@/i18n/I18n'\nimport { Flow } from '@/components/Flow/Flow'\nimport type { RequireAtLeastOne } from '@/types/Helpers'\n\n/**\n * The full set of fields that may be pre-filled on the {@link PaySchedule} create form.\n *\n * @public\n */\nexport type PayScheduleDefaultFields = {\n  [\n    K in keyof Pick<\n      PayScheduleFormData,\n      'anchorPayDate' | 'anchorEndOfPayPeriod' | 'day1' | 'day2' | 'customName' | 'frequency'\n    >\n  ]: NonNullable<PayScheduleFormData[K]>\n}\n\n/**\n * Default values for the {@link PaySchedule} form fields. Server data for an existing pay schedule\n * takes precedence over these defaults when editing.\n *\n * @public\n */\nexport type PayScheduleDefaultValues = RequireAtLeastOne<Partial<PayScheduleDefaultFields>>\n\n/**\n * Props for the {@link PaySchedule} component.\n *\n * @public\n */\nexport interface PayScheduleProps extends BaseComponentInterface<'Company.PaySchedule'> {\n  /** Identifier of the company whose pay schedules are managed. */\n  companyId: string\n  /** Default values used to pre-fill the create form. Ignored fields not listed in {@link PayScheduleDefaultValues}. */\n  defaultValues?: PayScheduleDefaultValues\n}\n\n/**\n * Manages a company's pay schedules, including listing existing schedules and creating or editing one.\n *\n * @remarks\n * Renders the schedule list when at least one pay schedule exists and the create form otherwise.\n * Emits the following events through `onEvent`:\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `paySchedule/created` | A new pay schedule was created | The created pay schedule entity |\n * | `paySchedule/updated` | An existing pay schedule was updated | The updated pay schedule entity |\n *\n * @param props - {@link PayScheduleProps} plus the standard base component props.\n * @returns The pay schedule list or form depending on whether any schedules exist.\n * @public\n */\nexport const PaySchedule = ({\n  companyId,\n  defaultValues,\n  dictionary,\n  ...props\n}: PayScheduleProps) => {\n  useI18n('Company.PaySchedule')\n  useComponentDictionary('Company.PaySchedule', dictionary)\n  return (\n    <BaseComponent {...props}>\n      <Root companyId={companyId} defaultValues={defaultValues} />\n    </BaseComponent>\n  )\n}\n\nfunction Root({ companyId, defaultValues }: Omit<PayScheduleProps, BaseComponentKeys>) {\n  const { onEvent } = useBase()\n  const { data: paySchedules } = usePaySchedulesGetAllSuspense({ companyId })\n\n  const hasSchedules = (paySchedules.payScheduleShowResponse?.length ?? 0) > 0\n  const initialState = hasSchedules ? 'listSchedules' : 'addSchedule'\n  const initialComponent = hasSchedules ? PayScheduleListContextual : PayScheduleFormContextual\n\n  const machine = useMemo(\n    () =>\n      createMachine(\n        initialState,\n        payScheduleStateMachine,\n        (initialContext: PayScheduleContextInterface) => ({\n          ...initialContext,\n          component: initialComponent,\n          companyId,\n          defaultValues,\n        }),\n      ),\n    [companyId, defaultValues, initialState, initialComponent],\n  )\n\n  return <Flow machine={machine} onEvent={onEvent} />\n}\n"],"names":["PaySchedule","companyId","defaultValues","dictionary","props","useI18n","useComponentDictionary","jsx","BaseComponent","Root","onEvent","useBase","paySchedules","usePaySchedulesGetAllSuspense","hasSchedules","initialState","initialComponent","PayScheduleListContextual","PayScheduleFormContextual","machine","useMemo","createMachine","payScheduleStateMachine","initialContext","Flow"],"mappings":";;;;;;;;;;AAkEO,MAAMA,IAAc,CAAC;AAAA,EAC1B,WAAAC;AAAA,EACA,eAAAC;AAAA,EACA,YAAAC;AAAA,EACA,GAAGC;AACL,OACEC,EAAQ,qBAAqB,GAC7BC,EAAuB,uBAAuBH,CAAU,GAEtD,gBAAAI,EAACC,KAAe,GAAGJ,GACjB,4BAACK,GAAA,EAAK,WAAAR,GAAsB,eAAAC,GAA8B,EAAA,CAC5D;AAIJ,SAASO,EAAK,EAAE,WAAAR,GAAW,eAAAC,KAA4D;AACrF,QAAM,EAAE,SAAAQ,EAAA,IAAYC,EAAA,GACd,EAAE,MAAMC,EAAA,IAAiBC,EAA8B,EAAE,WAAAZ,GAAW,GAEpEa,KAAgBF,EAAa,yBAAyB,UAAU,KAAK,GACrEG,IAAeD,IAAe,kBAAkB,eAChDE,IAAmBF,IAAeG,IAA4BC,GAE9DC,IAAUC;AAAA,IACd,MACEC;AAAA,MACEN;AAAA,MACAO;AAAA,MACA,CAACC,OAAiD;AAAA,QAChD,GAAGA;AAAA,QACH,WAAWP;AAAA,QACX,WAAAf;AAAA,QACA,eAAAC;AAAA,MAAA;AAAA,IACF;AAAA,IAEJ,CAACD,GAAWC,GAAea,GAAcC,CAAgB;AAAA,EAAA;AAG3D,SAAO,gBAAAT,EAACiB,GAAA,EAAK,SAAAL,GAAkB,SAAAT,EAAA,CAAkB;AACnD;"}

package/dist/components/Company/PaySchedule/PayScheduleForm.js

@@ -6,9 +6,9 @@ import m from "./PayScheduleForm.module.scss.js";
 import { BaseBoundaries as R, BaseLayout as p } from "../../Base/Base.js";
 import "../../Base/useBase.js";
 import { SDKFormProvider as A } from "../../../partner-hook-utils/form/SDKFormProvider.js";
-import { Form as M } from "../../Common/Form/Form.js";
+import { Form as q } from "../../Common/Form/Form.js";
 import { Flex as y } from "../../Common/Flex/Flex.js";
-import { Grid as q } from "../../Common/Grid/Grid.js";
+import { Grid as M } from "../../Common/Grid/Grid.js";
 import { ActionsLayout as L } from "../../Common/ActionsLayout/ActionsLayout.js";
 import { useComponentContext as O } from "../../../contexts/ComponentAdapter/useComponentContext.js";
 import { useDateFormatter as x } from "../../../hooks/useDateFormatter.js";
@@ -35,11 +35,11 @@ function F({ onEvent: d, ...h }) {
     "1st15th": e("frequencyOptions.15thAndLast"),
     custom: e("frequencyOptions.custom")
   };
-  return /* @__PURE__ */ a(p, { error: r.errorHandling.errors, children: /* @__PURE__ */ a(A, { formHookResult: r, children: /* @__PURE__ */ a(M, { onSubmit: () => {
+  return /* @__PURE__ */ a(p, { error: r.errorHandling.errors, children: /* @__PURE__ */ a(A, { formHookResult: r, children: /* @__PURE__ */ a(q, { onSubmit: () => {
     D();
   }, children: /* @__PURE__ */ s(y, { flexDirection: "column", children: [
     /* @__PURE__ */ a(y, { justifyContent: "space-between", flexDirection: "column", gap: 4, children: /* @__PURE__ */ a("header", { children: /* @__PURE__ */ a(n.Heading, { as: "h2", children: r.status.mode === "create" ? e("headings.addPaySchedule") : e("headings.editPaySchedule") }) }) }),
-    /* @__PURE__ */ a("div", { className: m.payScheduleContainer, children: /* @__PURE__ */ s(q, { gap: 32, gridTemplateColumns: { base: "1fr", small: "1fr 1fr" }, children: [
+    /* @__PURE__ */ a("div", { className: m.payScheduleContainer, children: /* @__PURE__ */ s(M, { gap: 32, gridTemplateColumns: { base: "1fr", small: "1fr 1fr" }, children: [
       /* @__PURE__ */ a("div", { className: m.payScheduleForm, children: /* @__PURE__ */ s(y, { flexDirection: "column", children: [
         /* @__PURE__ */ a(
           i.CustomName,
@@ -52,6 +52,7 @@ function F({ onEvent: d, ...h }) {
           i.Frequency,
           {
             label: e("labels.frequency"),
+            placeholder: e("labels.frequencyPlaceholder"),
             getOptionLabel: (t) => b[t],
             validationMessages: { REQUIRED: e("validations.frequency") }
           }
@@ -109,6 +110,7 @@ function F({ onEvent: d, ...h }) {
           n.Select,
           {
             label: e("labels.preview"),
+            placeholder: "",
             isRequired: !0,
             options: l.map((t, c) => ({
               value: String(c),

package/dist/components/Company/PaySchedule/PayScheduleForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"PayScheduleForm.js","sources":["../../../../src/components/Company/PaySchedule/PayScheduleForm.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { usePayScheduleForm } from './shared/usePayScheduleForm'\nimport type { UsePayScheduleFormProps, PayScheduleFrequency } from './shared/usePayScheduleForm'\nimport style from './PayScheduleForm.module.scss'\nimport { BaseBoundaries, BaseLayout } from '@/components/Base'\nimport { SDKFormProvider } from '@/partner-hook-utils/form/SDKFormProvider'\nimport { Form } from '@/components/Common/Form'\nimport { Flex, Grid, ActionsLayout } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport { componentEvents, type EventType } from '@/shared/constants'\nimport type { OnEventType } from '@/components/Base/useBase'\n\ninterface PayScheduleFormProps extends UsePayScheduleFormProps {\n  onEvent: OnEventType<EventType, unknown>\n}\n\n/** @internal */\nexport function PayScheduleForm({ onEvent, ...hookProps }: PayScheduleFormProps) {\n  return (\n    <BaseBoundaries componentName=\"Company.PayScheduleForm\">\n      <PayScheduleFormRoot onEvent={onEvent} {...hookProps} />\n    </BaseBoundaries>\n  )\n}\n\nfunction PayScheduleFormRoot({ onEvent, ...hookProps }: PayScheduleFormProps) {\n  const { t } = useTranslation('Company.PaySchedule')\n  const Components = useComponentContext()\n  const dateFormatter = useDateFormatter()\n  const paySchedule = usePayScheduleForm(hookProps)\n  const [selectedPayPeriodIndex, setSelectedPayPeriodIndex] = useState(0)\n\n  if (paySchedule.isLoading) {\n    return <BaseLayout isLoading error={paySchedule.errorHandling.errors} />\n  }\n\n  const handleSubmit = async () => {\n    const result = await paySchedule.actions.onSubmit()\n    if (result) {\n      onEvent(\n        result.mode === 'create'\n          ? componentEvents.PAY_SCHEDULE_CREATED\n          : componentEvents.PAY_SCHEDULE_UPDATED,\n        { paySchedule: result.data },\n      )\n    }\n  }\n\n  const { Fields } = paySchedule.form\n  const { paymentSpeedDays, payPreviewLoading } = paySchedule.data\n  const payPeriodPreview = paySchedule.data.payPeriodPreview\n\n  const frequencyLabels: Record<PayScheduleFrequency, string> = {\n    'Every week': t('frequencies.everyWeek'),\n    'Every other week': t('frequencies.everyOtherWeek'),\n    'Twice per month': t('frequencies.twicePerMonth'),\n    Monthly: t('frequencies.monthly'),\n  }\n\n  const twicePerMonthLabels: Record<string, string> = {\n    '1st15th': t('frequencyOptions.15thAndLast'),\n    custom: t('frequencyOptions.custom'),\n  }\n\n  return (\n    <BaseLayout error={paySchedule.errorHandling.errors}>\n      <SDKFormProvider formHookResult={paySchedule}>\n        <Form onSubmit={() => void handleSubmit()}>\n          <Flex flexDirection=\"column\">\n            <Flex justifyContent=\"space-between\" flexDirection=\"column\" gap={4}>\n              <header>\n                <Components.Heading as=\"h2\">\n                  {paySchedule.status.mode === 'create'\n                    ? t('headings.addPaySchedule')\n                    : t('headings.editPaySchedule')}\n                </Components.Heading>\n              </header>\n            </Flex>\n            <div className={style.payScheduleContainer}>\n              <Grid gap={32} gridTemplateColumns={{ base: '1fr', small: '1fr 1fr' }}>\n                <div className={style.payScheduleForm}>\n                  <Flex flexDirection=\"column\">\n                    <Fields.CustomName\n                      label={t('labels.name')}\n                      validationMessages={{ REQUIRED: t('validations.name') }}\n                    />\n                    <Fields.Frequency\n                      label={t('labels.frequency')}\n                      getOptionLabel={(entry: PayScheduleFrequency) => frequencyLabels[entry]}\n                      validationMessages={{ REQUIRED: t('validations.frequency') }}\n                    />\n                    {Fields.CustomTwicePerMonth && (\n                      <Fields.CustomTwicePerMonth\n                        label={t('labels.frequencyOptions')}\n                        description={t('descriptions.frequencyOptionsDescription')}\n                        getOptionLabel={(entry: string) => twicePerMonthLabels[entry] ?? entry}\n                      />\n                    )}\n                    <Fields.AnchorPayDate\n                      label={t('labels.firstPayDate')}\n                      description={t('descriptions.anchorPayDateDescription', {\n                        count: paymentSpeedDays,\n                      })}\n                      validationMessages={{ REQUIRED: t('validations.firstPayDate') }}\n                      minDate={new Date()}\n                    />\n                    <Fields.AnchorEndOfPayPeriod\n                      label={t('labels.firstPayPeriodEndDate')}\n                      description={t('descriptions.anchorEndOfPayPeriodDescription')}\n                      validationMessages={{ REQUIRED: t('validations.firstPayPeriodEndDate') }}\n                    />\n                    {Fields.Day1 && (\n                      <Fields.Day1\n                        label={t('labels.firstPayDayOfTheMonth')}\n                        validationMessages={{\n                          REQUIRED: t('validations.firstPayDayOfTheMonth'),\n                          DAY_RANGE: t('validations.dayRange'),\n                        }}\n                      />\n                    )}\n                    {Fields.Day2 && (\n                      <Fields.Day2\n                        label={t('labels.lastPayDayOfTheMonth')}\n                        validationMessages={{\n                          REQUIRED: t('validations.lastPayDayOfTheMonth'),\n                          DAY_RANGE: t('validations.dayRange'),\n                        }}\n                      />\n                    )}\n                  </Flex>\n                </div>\n                <Flex flexDirection=\"column\" gap={4} justifyContent=\"center\" alignItems=\"center\">\n                  {payPeriodPreview && payPeriodPreview[selectedPayPeriodIndex] ? (\n                    <div className={style.calendarContainer}>\n                      {!payPreviewLoading && (\n                        <Components.Select\n                          label={t('labels.preview')}\n                          isRequired\n                          options={payPeriodPreview.map((period, index) => ({\n                            value: String(index),\n                            label: dateFormatter.formatPayPeriodRange(\n                              period.startDate.toString(),\n                              period.endDate.toString(),\n                            ),\n                          }))}\n                          value={String(selectedPayPeriodIndex)}\n                          onChange={(value: string) => {\n                            const numericValue = Number(value)\n                            if (!isNaN(numericValue)) {\n                              setSelectedPayPeriodIndex(numericValue)\n                            }\n                          }}\n                        />\n                      )}\n                      <Components.CalendarPreview\n                        key={selectedPayPeriodIndex}\n                        dateRange={{\n                          start: new Date(\n                            payPeriodPreview[selectedPayPeriodIndex].startDate.toString(),\n                          ),\n                          end: new Date(\n                            payPeriodPreview[selectedPayPeriodIndex].endDate.toString(),\n                          ),\n                          label: t('payPreview.payPeriod') || 'Pay Period',\n                        }}\n                        highlightDates={[\n                          {\n                            date: new Date(\n                              payPeriodPreview[selectedPayPeriodIndex].checkDate.toString(),\n                            ),\n                            highlightColor: 'primary',\n                            label: t('payPreview.payday') || 'Payday',\n                          },\n                          {\n                            date: new Date(\n                              payPeriodPreview[selectedPayPeriodIndex].runPayrollBy.toString(),\n                            ),\n                            highlightColor: 'secondary',\n                            label: t('payPreview.payrollDeadline') || 'Payroll Deadline',\n                          },\n                        ]}\n                      />\n                    </div>\n                  ) : (\n                    <div className={style.calendarContainer}>\n                      <Components.Alert\n                        status=\"info\"\n                        label={t('previewAlert.title', 'Pay Schedule Preview')}\n                      >\n                        <Components.Text>\n                          {t(\n                            'previewAlert.description',\n                            'Complete all the required fields on the left to see a preview of your pay schedule.',\n                          )}\n                        </Components.Text>\n                      </Components.Alert>\n                    </div>\n                  )}\n                </Flex>\n              </Grid>\n            </div>\n            <ActionsLayout>\n              <Components.Button\n                variant=\"secondary\"\n                onClick={() => {\n                  onEvent(componentEvents.CANCEL)\n                }}\n              >\n                {t('actions.cancel')}\n              </Components.Button>\n              <Components.Button type=\"submit\" isLoading={paySchedule.status.isPending}>\n                {t('actions.save')}\n              </Components.Button>\n            </ActionsLayout>\n          </Flex>\n        </Form>\n      </SDKFormProvider>\n    </BaseLayout>\n  )\n}\n"],"names":["PayScheduleForm","onEvent","hookProps","jsx","BaseBoundaries","PayScheduleFormRoot","t","useTranslation","Components","useComponentContext","dateFormatter","useDateFormatter","paySchedule","usePayScheduleForm","selectedPayPeriodIndex","setSelectedPayPeriodIndex","useState","BaseLayout","handleSubmit","result","componentEvents","Fields","paymentSpeedDays","payPreviewLoading","payPeriodPreview","frequencyLabels","twicePerMonthLabels","SDKFormProvider","Form","jsxs","Flex","style","Grid","entry","period","index","value","numericValue","ActionsLayout"],"mappings":"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"}
+{"version":3,"file":"PayScheduleForm.js","sources":["../../../../src/components/Company/PaySchedule/PayScheduleForm.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { usePayScheduleForm } from './shared/usePayScheduleForm'\nimport type { UsePayScheduleFormProps, PayScheduleFrequency } from './shared/usePayScheduleForm'\nimport style from './PayScheduleForm.module.scss'\nimport { BaseBoundaries, BaseLayout } from '@/components/Base'\nimport { SDKFormProvider } from '@/partner-hook-utils/form/SDKFormProvider'\nimport { Form } from '@/components/Common/Form'\nimport { Flex, Grid, ActionsLayout } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useDateFormatter } from '@/hooks/useDateFormatter'\nimport { componentEvents, type EventType } from '@/shared/constants'\nimport type { OnEventType } from '@/components/Base/useBase'\n\ninterface PayScheduleFormProps extends UsePayScheduleFormProps {\n  onEvent: OnEventType<EventType, unknown>\n}\n\n/** @internal */\nexport function PayScheduleForm({ onEvent, ...hookProps }: PayScheduleFormProps) {\n  return (\n    <BaseBoundaries componentName=\"Company.PayScheduleForm\">\n      <PayScheduleFormRoot onEvent={onEvent} {...hookProps} />\n    </BaseBoundaries>\n  )\n}\n\nfunction PayScheduleFormRoot({ onEvent, ...hookProps }: PayScheduleFormProps) {\n  const { t } = useTranslation('Company.PaySchedule')\n  const Components = useComponentContext()\n  const dateFormatter = useDateFormatter()\n  const paySchedule = usePayScheduleForm(hookProps)\n  const [selectedPayPeriodIndex, setSelectedPayPeriodIndex] = useState(0)\n\n  if (paySchedule.isLoading) {\n    return <BaseLayout isLoading error={paySchedule.errorHandling.errors} />\n  }\n\n  const handleSubmit = async () => {\n    const result = await paySchedule.actions.onSubmit()\n    if (result) {\n      onEvent(\n        result.mode === 'create'\n          ? componentEvents.PAY_SCHEDULE_CREATED\n          : componentEvents.PAY_SCHEDULE_UPDATED,\n        { paySchedule: result.data },\n      )\n    }\n  }\n\n  const { Fields } = paySchedule.form\n  const { paymentSpeedDays, payPreviewLoading } = paySchedule.data\n  const payPeriodPreview = paySchedule.data.payPeriodPreview\n\n  const frequencyLabels: Record<PayScheduleFrequency, string> = {\n    'Every week': t('frequencies.everyWeek'),\n    'Every other week': t('frequencies.everyOtherWeek'),\n    'Twice per month': t('frequencies.twicePerMonth'),\n    Monthly: t('frequencies.monthly'),\n  }\n\n  const twicePerMonthLabels: Record<string, string> = {\n    '1st15th': t('frequencyOptions.15thAndLast'),\n    custom: t('frequencyOptions.custom'),\n  }\n\n  return (\n    <BaseLayout error={paySchedule.errorHandling.errors}>\n      <SDKFormProvider formHookResult={paySchedule}>\n        <Form onSubmit={() => void handleSubmit()}>\n          <Flex flexDirection=\"column\">\n            <Flex justifyContent=\"space-between\" flexDirection=\"column\" gap={4}>\n              <header>\n                <Components.Heading as=\"h2\">\n                  {paySchedule.status.mode === 'create'\n                    ? t('headings.addPaySchedule')\n                    : t('headings.editPaySchedule')}\n                </Components.Heading>\n              </header>\n            </Flex>\n            <div className={style.payScheduleContainer}>\n              <Grid gap={32} gridTemplateColumns={{ base: '1fr', small: '1fr 1fr' }}>\n                <div className={style.payScheduleForm}>\n                  <Flex flexDirection=\"column\">\n                    <Fields.CustomName\n                      label={t('labels.name')}\n                      validationMessages={{ REQUIRED: t('validations.name') }}\n                    />\n                    <Fields.Frequency\n                      label={t('labels.frequency')}\n                      placeholder={t('labels.frequencyPlaceholder')}\n                      getOptionLabel={(entry: PayScheduleFrequency) => frequencyLabels[entry]}\n                      validationMessages={{ REQUIRED: t('validations.frequency') }}\n                    />\n                    {Fields.CustomTwicePerMonth && (\n                      <Fields.CustomTwicePerMonth\n                        label={t('labels.frequencyOptions')}\n                        description={t('descriptions.frequencyOptionsDescription')}\n                        getOptionLabel={(entry: string) => twicePerMonthLabels[entry] ?? entry}\n                      />\n                    )}\n                    <Fields.AnchorPayDate\n                      label={t('labels.firstPayDate')}\n                      description={t('descriptions.anchorPayDateDescription', {\n                        count: paymentSpeedDays,\n                      })}\n                      validationMessages={{ REQUIRED: t('validations.firstPayDate') }}\n                      minDate={new Date()}\n                    />\n                    <Fields.AnchorEndOfPayPeriod\n                      label={t('labels.firstPayPeriodEndDate')}\n                      description={t('descriptions.anchorEndOfPayPeriodDescription')}\n                      validationMessages={{ REQUIRED: t('validations.firstPayPeriodEndDate') }}\n                    />\n                    {Fields.Day1 && (\n                      <Fields.Day1\n                        label={t('labels.firstPayDayOfTheMonth')}\n                        validationMessages={{\n                          REQUIRED: t('validations.firstPayDayOfTheMonth'),\n                          DAY_RANGE: t('validations.dayRange'),\n                        }}\n                      />\n                    )}\n                    {Fields.Day2 && (\n                      <Fields.Day2\n                        label={t('labels.lastPayDayOfTheMonth')}\n                        validationMessages={{\n                          REQUIRED: t('validations.lastPayDayOfTheMonth'),\n                          DAY_RANGE: t('validations.dayRange'),\n                        }}\n                      />\n                    )}\n                  </Flex>\n                </div>\n                <Flex flexDirection=\"column\" gap={4} justifyContent=\"center\" alignItems=\"center\">\n                  {payPeriodPreview && payPeriodPreview[selectedPayPeriodIndex] ? (\n                    <div className={style.calendarContainer}>\n                      {!payPreviewLoading && (\n                        <Components.Select\n                          label={t('labels.preview')}\n                          placeholder=\"\"\n                          isRequired\n                          options={payPeriodPreview.map((period, index) => ({\n                            value: String(index),\n                            label: dateFormatter.formatPayPeriodRange(\n                              period.startDate.toString(),\n                              period.endDate.toString(),\n                            ),\n                          }))}\n                          value={String(selectedPayPeriodIndex)}\n                          onChange={(value: string) => {\n                            const numericValue = Number(value)\n                            if (!isNaN(numericValue)) {\n                              setSelectedPayPeriodIndex(numericValue)\n                            }\n                          }}\n                        />\n                      )}\n                      <Components.CalendarPreview\n                        key={selectedPayPeriodIndex}\n                        dateRange={{\n                          start: new Date(\n                            payPeriodPreview[selectedPayPeriodIndex].startDate.toString(),\n                          ),\n                          end: new Date(\n                            payPeriodPreview[selectedPayPeriodIndex].endDate.toString(),\n                          ),\n                          label: t('payPreview.payPeriod') || 'Pay Period',\n                        }}\n                        highlightDates={[\n                          {\n                            date: new Date(\n                              payPeriodPreview[selectedPayPeriodIndex].checkDate.toString(),\n                            ),\n                            highlightColor: 'primary',\n                            label: t('payPreview.payday') || 'Payday',\n                          },\n                          {\n                            date: new Date(\n                              payPeriodPreview[selectedPayPeriodIndex].runPayrollBy.toString(),\n                            ),\n                            highlightColor: 'secondary',\n                            label: t('payPreview.payrollDeadline') || 'Payroll Deadline',\n                          },\n                        ]}\n                      />\n                    </div>\n                  ) : (\n                    <div className={style.calendarContainer}>\n                      <Components.Alert\n                        status=\"info\"\n                        label={t('previewAlert.title', 'Pay Schedule Preview')}\n                      >\n                        <Components.Text>\n                          {t(\n                            'previewAlert.description',\n                            'Complete all the required fields on the left to see a preview of your pay schedule.',\n                          )}\n                        </Components.Text>\n                      </Components.Alert>\n                    </div>\n                  )}\n                </Flex>\n              </Grid>\n            </div>\n            <ActionsLayout>\n              <Components.Button\n                variant=\"secondary\"\n                onClick={() => {\n                  onEvent(componentEvents.CANCEL)\n                }}\n              >\n                {t('actions.cancel')}\n              </Components.Button>\n              <Components.Button type=\"submit\" isLoading={paySchedule.status.isPending}>\n                {t('actions.save')}\n              </Components.Button>\n            </ActionsLayout>\n          </Flex>\n        </Form>\n      </SDKFormProvider>\n    </BaseLayout>\n  )\n}\n"],"names":["PayScheduleForm","onEvent","hookProps","jsx","BaseBoundaries","PayScheduleFormRoot","t","useTranslation","Components","useComponentContext","dateFormatter","useDateFormatter","paySchedule","usePayScheduleForm","selectedPayPeriodIndex","setSelectedPayPeriodIndex","useState","BaseLayout","handleSubmit","result","componentEvents","Fields","paymentSpeedDays","payPreviewLoading","payPeriodPreview","frequencyLabels","twicePerMonthLabels","SDKFormProvider","Form","jsxs","Flex","style","Grid","entry","period","index","value","numericValue","ActionsLayout"],"mappings":"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"}

package/dist/components/Company/PaySchedule/payScheduleStateMachine.js

@@ -1,24 +1,20 @@
 import { state as o, transition as e, reduce as l } from "robot3";
 import { PayScheduleFormContextual as S, PayScheduleListContextual as E } from "./PayScheduleComponents.js";
 import { componentEvents as d } from "../../../shared/constants.js";
-const c = l(
-  (t) => ({
-    ...t,
-    component: E,
-    payScheduleId: void 0
-  })
-), a = {
+const c = l((t) => ({
+  ...t,
+  component: E,
+  payScheduleId: void 0
+})), a = {
   listSchedules: o(
     e(
       d.PAY_SCHEDULE_CREATE,
       "addSchedule",
-      l(
-        (t) => ({
-          ...t,
-          component: S,
-          payScheduleId: void 0
-        })
-      )
+      l((t) => ({
+        ...t,
+        component: S,
+        payScheduleId: void 0
+      }))
     ),
     e(
       d.PAY_SCHEDULE_UPDATE,

package/dist/components/Company/PaySchedule/payScheduleStateMachine.js.map

@@ -1 +1 @@
-{"version":3,"file":"payScheduleStateMachine.js","sources":["../../../../src/components/Company/PaySchedule/payScheduleStateMachine.ts"],"sourcesContent":["import { reduce, state, state as final, transition } from 'robot3'\nimport type { ComponentType } from 'react'\nimport type { PayScheduleContextInterface } from './PayScheduleComponents'\nimport { PayScheduleFormContextual, PayScheduleListContextual } from './PayScheduleComponents'\nimport { componentEvents } from '@/shared/constants'\nimport type { MachineEventType, MachineTransition } from '@/types/Helpers'\n\ntype EventPayloads = {\n  [componentEvents.PAY_SCHEDULE_UPDATE]: { uuid: string }\n  [componentEvents.PAY_SCHEDULE_CREATED]: undefined\n  [componentEvents.PAY_SCHEDULE_UPDATED]: undefined\n}\n\nconst toList = reduce(\n  (ctx: PayScheduleContextInterface): PayScheduleContextInterface => ({\n    ...ctx,\n    component: PayScheduleListContextual as ComponentType,\n    payScheduleId: undefined,\n  }),\n)\n\n/** @internal */\nexport const payScheduleStateMachine = {\n  listSchedules: state<MachineTransition>(\n    transition(\n      componentEvents.PAY_SCHEDULE_CREATE,\n      'addSchedule',\n      reduce(\n        (ctx: PayScheduleContextInterface): PayScheduleContextInterface => ({\n          ...ctx,\n          component: PayScheduleFormContextual as ComponentType,\n          payScheduleId: undefined,\n        }),\n      ),\n    ),\n    transition(\n      componentEvents.PAY_SCHEDULE_UPDATE,\n      'editSchedule',\n      reduce(\n        (\n          ctx: PayScheduleContextInterface,\n          ev: MachineEventType<EventPayloads, typeof componentEvents.PAY_SCHEDULE_UPDATE>,\n        ): PayScheduleContextInterface => ({\n          ...ctx,\n          component: PayScheduleFormContextual as ComponentType,\n          payScheduleId: ev.payload.uuid,\n        }),\n      ),\n    ),\n    transition(componentEvents.PAY_SCHEDULE_DONE, 'done'),\n  ),\n  addSchedule: state<MachineTransition>(\n    transition(componentEvents.PAY_SCHEDULE_CREATED, 'listSchedules', toList),\n    transition(componentEvents.CANCEL, 'listSchedules', toList),\n  ),\n  editSchedule: state<MachineTransition>(\n    transition(componentEvents.PAY_SCHEDULE_UPDATED, 'listSchedules', toList),\n    transition(componentEvents.CANCEL, 'listSchedules', toList),\n  ),\n  done: final(),\n}\n"],"names":["toList","reduce","ctx","PayScheduleListContextual","payScheduleStateMachine","state","transition","componentEvents","PayScheduleFormContextual","ev","final"],"mappings":";;;AAaA,MAAMA,IAASC;AAAA,EACb,CAACC,OAAmE;AAAA,IAClE,GAAGA;AAAA,IACH,WAAWC;AAAA,IACX,eAAe;AAAA,EAAA;AAEnB,GAGaC,IAA0B;AAAA,EACrC,eAAeC;AAAA,IACbC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAN;AAAA,QACE,CAACC,OAAmE;AAAA,UAClE,GAAGA;AAAA,UACH,WAAWM;AAAA,UACX,eAAe;AAAA,QAAA;AAAA,MACjB;AAAA,IACF;AAAA,IAEFF;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAN;AAAA,QACE,CACEC,GACAO,OACiC;AAAA,UACjC,GAAGP;AAAA,UACH,WAAWM;AAAA,UACX,eAAeC,EAAG,QAAQ;AAAA,QAAA;AAAA,MAC5B;AAAA,IACF;AAAA,IAEFH,EAAWC,EAAgB,mBAAmB,MAAM;AAAA,EAAA;AAAA,EAEtD,aAAaF;AAAA,IACXC,EAAWC,EAAgB,sBAAsB,iBAAiBP,CAAM;AAAA,IACxEM,EAAWC,EAAgB,QAAQ,iBAAiBP,CAAM;AAAA,EAAA;AAAA,EAE5D,cAAcK;AAAA,IACZC,EAAWC,EAAgB,sBAAsB,iBAAiBP,CAAM;AAAA,IACxEM,EAAWC,EAAgB,QAAQ,iBAAiBP,CAAM;AAAA,EAAA;AAAA,EAE5D,MAAMU,EAAA;AACR;"}
+{"version":3,"file":"payScheduleStateMachine.js","sources":["../../../../src/components/Company/PaySchedule/payScheduleStateMachine.ts"],"sourcesContent":["import { reduce, state, state as final, transition } from 'robot3'\nimport type { ComponentType } from 'react'\nimport type { PayScheduleContextInterface } from './PayScheduleComponents'\nimport { PayScheduleFormContextual, PayScheduleListContextual } from './PayScheduleComponents'\nimport { componentEvents } from '@/shared/constants'\nimport type { MachineEventType, MachineTransition } from '@/types/Helpers'\n\ntype EventPayloads = {\n  [componentEvents.PAY_SCHEDULE_UPDATE]: { uuid: string }\n  [componentEvents.PAY_SCHEDULE_CREATED]: undefined\n  [componentEvents.PAY_SCHEDULE_UPDATED]: undefined\n}\n\nconst toList = reduce((ctx: PayScheduleContextInterface): PayScheduleContextInterface => ({\n  ...ctx,\n  component: PayScheduleListContextual as ComponentType,\n  payScheduleId: undefined,\n}))\n\n/** @internal */\nexport const payScheduleStateMachine = {\n  listSchedules: state<MachineTransition>(\n    transition(\n      componentEvents.PAY_SCHEDULE_CREATE,\n      'addSchedule',\n      reduce((ctx: PayScheduleContextInterface): PayScheduleContextInterface => ({\n        ...ctx,\n        component: PayScheduleFormContextual as ComponentType,\n        payScheduleId: undefined,\n      })),\n    ),\n    transition(\n      componentEvents.PAY_SCHEDULE_UPDATE,\n      'editSchedule',\n      reduce(\n        (\n          ctx: PayScheduleContextInterface,\n          ev: MachineEventType<EventPayloads, typeof componentEvents.PAY_SCHEDULE_UPDATE>,\n        ): PayScheduleContextInterface => ({\n          ...ctx,\n          component: PayScheduleFormContextual as ComponentType,\n          payScheduleId: ev.payload.uuid,\n        }),\n      ),\n    ),\n    transition(componentEvents.PAY_SCHEDULE_DONE, 'done'),\n  ),\n  addSchedule: state<MachineTransition>(\n    transition(componentEvents.PAY_SCHEDULE_CREATED, 'listSchedules', toList),\n    transition(componentEvents.CANCEL, 'listSchedules', toList),\n  ),\n  editSchedule: state<MachineTransition>(\n    transition(componentEvents.PAY_SCHEDULE_UPDATED, 'listSchedules', toList),\n    transition(componentEvents.CANCEL, 'listSchedules', toList),\n  ),\n  done: final(),\n}\n"],"names":["toList","reduce","ctx","PayScheduleListContextual","payScheduleStateMachine","state","transition","componentEvents","PayScheduleFormContextual","ev","final"],"mappings":";;;AAaA,MAAMA,IAASC,EAAO,CAACC,OAAmE;AAAA,EACxF,GAAGA;AAAA,EACH,WAAWC;AAAA,EACX,eAAe;AACjB,EAAE,GAGWC,IAA0B;AAAA,EACrC,eAAeC;AAAA,IACbC;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAN,EAAO,CAACC,OAAmE;AAAA,QACzE,GAAGA;AAAA,QACH,WAAWM;AAAA,QACX,eAAe;AAAA,MAAA,EACf;AAAA,IAAA;AAAA,IAEJF;AAAA,MACEC,EAAgB;AAAA,MAChB;AAAA,MACAN;AAAA,QACE,CACEC,GACAO,OACiC;AAAA,UACjC,GAAGP;AAAA,UACH,WAAWM;AAAA,UACX,eAAeC,EAAG,QAAQ;AAAA,QAAA;AAAA,MAC5B;AAAA,IACF;AAAA,IAEFH,EAAWC,EAAgB,mBAAmB,MAAM;AAAA,EAAA;AAAA,EAEtD,aAAaF;AAAA,IACXC,EAAWC,EAAgB,sBAAsB,iBAAiBP,CAAM;AAAA,IACxEM,EAAWC,EAAgB,QAAQ,iBAAiBP,CAAM;AAAA,EAAA;AAAA,EAE5D,cAAcK;AAAA,IACZC,EAAWC,EAAgB,sBAAsB,iBAAiBP,CAAM;AAAA,IACxEM,EAAWC,EAAgB,QAAQ,iBAAiBP,CAAM;AAAA,EAAA;AAAA,EAE5D,MAAMU,EAAA;AACR;"}

package/dist/components/Company/StateTaxes/StateTaxes.d.ts

@@ -16,6 +16,7 @@ export interface StateTaxesProps extends BaseComponentInterface<'Company.StateTa
  * For finer-grained control over navigation, use the standalone {@link StateTaxesList} and
  * {@link StateTaxesForm} building blocks directly.
  *
+ * @events
  * | Event | Description | Data |
  * | ----- | ----------- | ---- |
  * | `company/stateTaxes/edit` | A state row was selected for editing | `{ state: string }` |

package/dist/components/Company/StateTaxes/StateTaxes.js.map

@@ -1 +1 @@
-{"version":3,"file":"StateTaxes.js","sources":["../../../../src/components/Company/StateTaxes/StateTaxes.tsx"],"sourcesContent":["import { createMachine } from 'robot3'\nimport { useMemo } from 'react'\nimport { stateTaxesStateMachine } from './stateTaxesStateMachine'\nimport type { StateTaxesContextInterface } from './StateTaxesComponents'\nimport { StateTaxesListContextual } from './StateTaxesComponents'\nimport { Flow } from '@/components/Flow/Flow'\nimport type { BaseComponentInterface } from '@/components/Base'\nimport { useComponentDictionary } from '@/i18n/I18n'\n\n/**\n * Props for the {@link StateTaxes} flow.\n *\n * @public\n */\nexport interface StateTaxesProps extends BaseComponentInterface<'Company.StateTaxes'> {\n  /** UUID of the company whose state taxes are being managed. */\n  companyId: string\n}\n\n/**\n * Orchestrated flow for managing a company's state tax setup.\n *\n * @remarks\n * Switches internally between a list of states with tax requirements and a per-state edit form.\n * For finer-grained control over navigation, use the standalone {@link StateTaxesList} and\n * {@link StateTaxesForm} building blocks directly.\n *\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `company/stateTaxes/edit` | A state row was selected for editing | `{ state: string }` |\n * | `company/stateTaxes/updated` | State tax requirements were saved | — |\n * | `company/stateTaxes/done` | The list view was completed | — |\n * | `CANCEL` | Editing was cancelled and the form was closed | — |\n *\n * @param props - {@link StateTaxesProps}\n * @returns The rendered state taxes flow.\n * @public\n */\nexport function StateTaxes({ companyId, onEvent, dictionary }: StateTaxesProps) {\n  useComponentDictionary('Company.StateTaxes', dictionary)\n  const manageStateTaxes = useMemo(\n    () =>\n      createMachine(\n        'viewStateTaxes',\n        stateTaxesStateMachine,\n        (initialContext: StateTaxesContextInterface) => ({\n          ...initialContext,\n          component: StateTaxesListContextual,\n          companyId,\n        }),\n      ),\n    [companyId],\n  )\n  return <Flow machine={manageStateTaxes} onEvent={onEvent} />\n}\n"],"names":["StateTaxes","companyId","onEvent","dictionary","useComponentDictionary","manageStateTaxes","useMemo","createMachine","stateTaxesStateMachine","initialContext","StateTaxesListContextual","jsx","Flow"],"mappings":";;;;;;;AAsCO,SAASA,EAAW,EAAE,WAAAC,GAAW,SAAAC,GAAS,YAAAC,KAA+B;AAC9E,EAAAC,EAAuB,sBAAsBD,CAAU;AACvD,QAAME,IAAmBC;AAAA,IACvB,MACEC;AAAA,MACE;AAAA,MACAC;AAAA,MACA,CAACC,OAAgD;AAAA,QAC/C,GAAGA;AAAA,QACH,WAAWC;AAAA,QACX,WAAAT;AAAA,MAAA;AAAA,IACF;AAAA,IAEJ,CAACA,CAAS;AAAA,EAAA;AAEZ,SAAO,gBAAAU,EAACC,GAAA,EAAK,SAASP,GAAkB,SAAAH,EAAA,CAAkB;AAC5D;"}
+{"version":3,"file":"StateTaxes.js","sources":["../../../../src/components/Company/StateTaxes/StateTaxes.tsx"],"sourcesContent":["import { createMachine } from 'robot3'\nimport { useMemo } from 'react'\nimport { stateTaxesStateMachine } from './stateTaxesStateMachine'\nimport type { StateTaxesContextInterface } from './StateTaxesComponents'\nimport { StateTaxesListContextual } from './StateTaxesComponents'\nimport { Flow } from '@/components/Flow/Flow'\nimport type { BaseComponentInterface } from '@/components/Base'\nimport { useComponentDictionary } from '@/i18n/I18n'\n\n/**\n * Props for the {@link StateTaxes} flow.\n *\n * @public\n */\nexport interface StateTaxesProps extends BaseComponentInterface<'Company.StateTaxes'> {\n  /** UUID of the company whose state taxes are being managed. */\n  companyId: string\n}\n\n/**\n * Orchestrated flow for managing a company's state tax setup.\n *\n * @remarks\n * Switches internally between a list of states with tax requirements and a per-state edit form.\n * For finer-grained control over navigation, use the standalone {@link StateTaxesList} and\n * {@link StateTaxesForm} building blocks directly.\n *\n * @events\n * | Event | Description | Data |\n * | ----- | ----------- | ---- |\n * | `company/stateTaxes/edit` | A state row was selected for editing | `{ state: string }` |\n * | `company/stateTaxes/updated` | State tax requirements were saved | — |\n * | `company/stateTaxes/done` | The list view was completed | — |\n * | `CANCEL` | Editing was cancelled and the form was closed | — |\n *\n * @param props - {@link StateTaxesProps}\n * @returns The rendered state taxes flow.\n * @public\n */\nexport function StateTaxes({ companyId, onEvent, dictionary }: StateTaxesProps) {\n  useComponentDictionary('Company.StateTaxes', dictionary)\n  const manageStateTaxes = useMemo(\n    () =>\n      createMachine(\n        'viewStateTaxes',\n        stateTaxesStateMachine,\n        (initialContext: StateTaxesContextInterface) => ({\n          ...initialContext,\n          component: StateTaxesListContextual,\n          companyId,\n        }),\n      ),\n    [companyId],\n  )\n  return <Flow machine={manageStateTaxes} onEvent={onEvent} />\n}\n"],"names":["StateTaxes","companyId","onEvent","dictionary","useComponentDictionary","manageStateTaxes","useMemo","createMachine","stateTaxesStateMachine","initialContext","StateTaxesListContextual","jsx","Flow"],"mappings":";;;;;;;AAuCO,SAASA,EAAW,EAAE,WAAAC,GAAW,SAAAC,GAAS,YAAAC,KAA+B;AAC9E,EAAAC,EAAuB,sBAAsBD,CAAU;AACvD,QAAME,IAAmBC;AAAA,IACvB,MACEC;AAAA,MACE;AAAA,MACAC;AAAA,MACA,CAACC,OAAgD;AAAA,QAC/C,GAAGA;AAAA,QACH,WAAWC;AAAA,QACX,WAAAT;AAAA,MAAA;AAAA,IACF;AAAA,IAEJ,CAACA,CAAS;AAAA,EAAA;AAEZ,SAAO,gBAAAU,EAACC,GAAA,EAAK,SAASP,GAAkB,SAAAH,EAAA,CAAkB;AAC5D;"}

package/dist/components/Company/StateTaxes/StateTaxesForm/Form.js

@@ -1,33 +1,37 @@
-import { jsxs as a, Fragment as c, jsx as e } from "react/jsx-runtime";
-import { useTranslation as u } from "react-i18next";
-import { useStateTaxesForm as x } from "./context.js";
-import { toRhfKey as d } from "./rhfKey.js";
-import { QuestionInput as l } from "../../../Common/TaxInputs/TaxInputs.js";
-import { useLocaleDateFormatter as y } from "../../../../contexts/LocaleProvider/useLocale.js";
-import { useComponentContext as T } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
-function D() {
-  const { t: n } = u("Company.StateTaxes", { keyPrefix: "form" }), s = y(), { stateTaxRequirements: i } = x(), o = T();
+import { jsxs as m, Fragment as u, jsx as o } from "react/jsx-runtime";
+import { useTranslation as d } from "react-i18next";
+import { useFormContext as x, useWatch as h } from "react-hook-form";
+import { useStateTaxesForm as T } from "./context.js";
+import { toRhfKey as F } from "./rhfKey.js";
+import { isRequirementApplicable as y } from "./applicableIf.js";
+import { QuestionInput as C } from "../../../Common/TaxInputs/TaxInputs.js";
+import { useLocaleDateFormatter as b } from "../../../../contexts/LocaleProvider/useLocale.js";
+import { useComponentContext as R } from "../../../../contexts/ComponentAdapter/useComponentContext.js";
+function z() {
+  const { t: n } = d("Company.StateTaxes", { keyPrefix: "form" }), s = b(), { stateTaxRequirements: i } = T(), r = R(), { control: p } = x(), f = h({ control: p });
   return i.requirementSets?.map(
-    ({ requirements: p, label: f, effectiveFrom: r, key: m }) => /* @__PURE__ */ a(c, { children: [
-      /* @__PURE__ */ a("div", { children: [
-        /* @__PURE__ */ e(o.Heading, { as: "h3", children: f }),
-        r && /* @__PURE__ */ e(o.Text, { size: "sm", children: n("effectiveFromLabel", { date: s.format(new Date(r)) }) })
+    ({ requirements: c, label: l, effectiveFrom: a, key: e }) => /* @__PURE__ */ m(u, { children: [
+      /* @__PURE__ */ m("div", { children: [
+        /* @__PURE__ */ o(r.Heading, { as: "h3", children: l }),
+        a && /* @__PURE__ */ o(r.Text, { size: "sm", children: n("effectiveFromLabel", { date: s.format(new Date(a)) }) })
       ] }),
-      p?.map((t) => /* @__PURE__ */ e(
-        l,
-        {
-          requirement: {
-            ...t,
-            key: `${m}.${d(t.key)}`
+      c?.flatMap((t) => t.editable === !1 ? [] : !e || !y(t, e, f) ? [] : [
+        /* @__PURE__ */ o(
+          C,
+          {
+            requirement: {
+              ...t,
+              key: `${e}.${F(t.key)}`
+            },
+            questionType: t.metadata?.type ?? "Text"
           },
-          questionType: t.metadata?.type ?? "Text"
-        },
-        t.key
-      ))
-    ] }, m)
+          t.key
+        )
+      ])
+    ] }, e)
   );
 }
 export {
-  D as Form
+  z as Form
 };
 //# sourceMappingURL=Form.js.map

package/dist/components/Company/StateTaxes/StateTaxesForm/Form.js.map

@@ -1 +1 @@
-{"version":3,"file":"Form.js","sources":["../../../../../src/components/Company/StateTaxes/StateTaxesForm/Form.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { Fragment } from 'react/jsx-runtime'\nimport { useStateTaxesForm } from './context'\nimport { toRhfKey } from './rhfKey'\nimport { QuestionInput } from '@/components/Common/TaxInputs/TaxInputs'\nimport { useLocaleDateFormatter } from '@/contexts/LocaleProvider/useLocale'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\n/** @internal */\nexport function Form() {\n  const { t } = useTranslation('Company.StateTaxes', { keyPrefix: 'form' })\n  const dateFormatter = useLocaleDateFormatter()\n  const { stateTaxRequirements } = useStateTaxesForm()\n  const Components = useComponentContext()\n\n  return stateTaxRequirements.requirementSets?.map(\n    ({ requirements, label, effectiveFrom, key }) => (\n      <Fragment key={key}>\n        <div>\n          <Components.Heading as=\"h3\">{label}</Components.Heading>\n          {effectiveFrom && (\n            <Components.Text size=\"sm\">\n              {t('effectiveFromLabel', { date: dateFormatter.format(new Date(effectiveFrom)) })}\n            </Components.Text>\n          )}\n        </div>\n        {requirements?.map(requirement => {\n          return (\n            <QuestionInput\n              requirement={{\n                ...requirement,\n                key: `${key}.${toRhfKey(requirement.key as string)}`,\n              }}\n              questionType={requirement.metadata?.type ?? 'Text'}\n              key={requirement.key}\n            />\n          )\n        })}\n      </Fragment>\n    ),\n  )\n}\n"],"names":["Form","t","useTranslation","dateFormatter","useLocaleDateFormatter","stateTaxRequirements","useStateTaxesForm","Components","useComponentContext","requirements","label","effectiveFrom","key","Fragment","jsxs","jsx","requirement","QuestionInput","toRhfKey"],"mappings":";;;;;;;AASO,SAASA,IAAO;AACrB,QAAM,EAAE,GAAAC,MAAMC,EAAe,sBAAsB,EAAE,WAAW,QAAQ,GAClEC,IAAgBC,EAAA,GAChB,EAAE,sBAAAC,EAAA,IAAyBC,EAAA,GAC3BC,IAAaC,EAAA;AAEnB,SAAOH,EAAqB,iBAAiB;AAAA,IAC3C,CAAC,EAAE,cAAAI,GAAc,OAAAC,GAAO,eAAAC,GAAe,KAAAC,EAAA,wBACpCC,GAAA,EACC,UAAA;AAAA,MAAA,gBAAAC,EAAC,OAAA,EACC,UAAA;AAAA,QAAA,gBAAAC,EAACR,EAAW,SAAX,EAAmB,IAAG,MAAM,UAAAG,GAAM;AAAA,QAClCC,KACC,gBAAAI,EAACR,EAAW,MAAX,EAAgB,MAAK,MACnB,UAAAN,EAAE,sBAAsB,EAAE,MAAME,EAAc,OAAO,IAAI,KAAKQ,CAAa,CAAC,EAAA,CAAG,EAAA,CAClF;AAAA,MAAA,GAEJ;AAAA,MACCF,GAAc,IAAI,CAAAO,MAEf,gBAAAD;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,aAAa;AAAA,YACX,GAAGD;AAAA,YACH,KAAK,GAAGJ,CAAG,IAAIM,EAASF,EAAY,GAAa,CAAC;AAAA,UAAA;AAAA,UAEpD,cAAcA,EAAY,UAAU,QAAQ;AAAA,QAAA;AAAA,QACvCA,EAAY;AAAA,MAAA,CAGtB;AAAA,IAAA,EAAA,GApBYJ,CAqBf;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"Form.js","sources":["../../../../../src/components/Company/StateTaxes/StateTaxesForm/Form.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport { Fragment } from 'react/jsx-runtime'\nimport { useFormContext, useWatch } from 'react-hook-form'\nimport { useStateTaxesForm } from './context'\nimport { toRhfKey } from './rhfKey'\nimport { isRequirementApplicable, type StateTaxesFormValues } from './applicableIf'\nimport { QuestionInput } from '@/components/Common/TaxInputs/TaxInputs'\nimport { useLocaleDateFormatter } from '@/contexts/LocaleProvider/useLocale'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\n\n/** @internal */\nexport function Form() {\n  const { t } = useTranslation('Company.StateTaxes', { keyPrefix: 'form' })\n  const dateFormatter = useLocaleDateFormatter()\n  const { stateTaxRequirements } = useStateTaxesForm()\n  const Components = useComponentContext()\n  const { control } = useFormContext()\n  const watchedValues = useWatch({ control }) as StateTaxesFormValues\n\n  return stateTaxRequirements.requirementSets?.map(\n    ({ requirements, label, effectiveFrom, key }) => (\n      <Fragment key={key}>\n        <div>\n          <Components.Heading as=\"h3\">{label}</Components.Heading>\n          {effectiveFrom && (\n            <Components.Text size=\"sm\">\n              {t('effectiveFromLabel', { date: dateFormatter.format(new Date(effectiveFrom)) })}\n            </Components.Text>\n          )}\n        </div>\n        {requirements?.flatMap(requirement => {\n          if (requirement.editable === false) return []\n          if (!key || !isRequirementApplicable(requirement, key, watchedValues)) return []\n          return [\n            <QuestionInput\n              requirement={{\n                ...requirement,\n                key: `${key}.${toRhfKey(requirement.key as string)}`,\n              }}\n              questionType={requirement.metadata?.type ?? 'Text'}\n              key={requirement.key}\n            />,\n          ]\n        })}\n      </Fragment>\n    ),\n  )\n}\n"],"names":["Form","t","useTranslation","dateFormatter","useLocaleDateFormatter","stateTaxRequirements","useStateTaxesForm","Components","useComponentContext","control","useFormContext","watchedValues","useWatch","requirements","label","effectiveFrom","key","Fragment","jsxs","jsx","requirement","isRequirementApplicable","QuestionInput","toRhfKey"],"mappings":";;;;;;;;;AAWO,SAASA,IAAO;AACrB,QAAM,EAAE,GAAAC,MAAMC,EAAe,sBAAsB,EAAE,WAAW,QAAQ,GAClEC,IAAgBC,EAAA,GAChB,EAAE,sBAAAC,EAAA,IAAyBC,EAAA,GAC3BC,IAAaC,EAAA,GACb,EAAE,SAAAC,EAAA,IAAYC,EAAA,GACdC,IAAgBC,EAAS,EAAE,SAAAH,GAAS;AAE1C,SAAOJ,EAAqB,iBAAiB;AAAA,IAC3C,CAAC,EAAE,cAAAQ,GAAc,OAAAC,GAAO,eAAAC,GAAe,KAAAC,EAAA,wBACpCC,GAAA,EACC,UAAA;AAAA,MAAA,gBAAAC,EAAC,OAAA,EACC,UAAA;AAAA,QAAA,gBAAAC,EAACZ,EAAW,SAAX,EAAmB,IAAG,MAAM,UAAAO,GAAM;AAAA,QAClCC,KACC,gBAAAI,EAACZ,EAAW,MAAX,EAAgB,MAAK,MACnB,UAAAN,EAAE,sBAAsB,EAAE,MAAME,EAAc,OAAO,IAAI,KAAKY,CAAa,CAAC,EAAA,CAAG,EAAA,CAClF;AAAA,MAAA,GAEJ;AAAA,MACCF,GAAc,QAAQ,CAAAO,MACjBA,EAAY,aAAa,KAAc,CAAA,IACvC,CAACJ,KAAO,CAACK,EAAwBD,GAAaJ,GAAKL,CAAa,IAAU,CAAA,IACvE;AAAA,QACL,gBAAAQ;AAAA,UAACG;AAAA,UAAA;AAAA,YACC,aAAa;AAAA,cACX,GAAGF;AAAA,cACH,KAAK,GAAGJ,CAAG,IAAIO,EAASH,EAAY,GAAa,CAAC;AAAA,YAAA;AAAA,YAEpD,cAAcA,EAAY,UAAU,QAAQ;AAAA,UAAA;AAAA,UACvCA,EAAY;AAAA,QAAA;AAAA,MACnB,CAEH;AAAA,IAAA,EAAA,GAtBYJ,CAuBf;AAAA,EAAA;AAGN;"}

package/dist/components/Company/StateTaxes/StateTaxesForm/StateTaxesForm.d.ts

@@ -1,6 +1,13 @@
-import { BaseComponentInterface, CommonComponentInterface } from '../../../Base/Base';
-interface StateTaxesFormProps extends CommonComponentInterface {
+import { BaseComponentInterface } from '../../../Base/Base';
+/**
+ * Props for {@link StateTaxesForm}.
+ *
+ * @public
+ */
+export interface StateTaxesFormProps extends BaseComponentInterface<'Company.StateTaxes'> {
+    /** The associated company identifier. */
     companyId: string;
+    /** Two-letter code of the state whose tax requirements are edited. */
     state: string;
 }
 /**
@@ -10,6 +17,7 @@ interface StateTaxesFormProps extends CommonComponentInterface {
  * Lower-level building block used by {@link StateTaxes} for its edit view. Use directly when
  * you need full control over navigation between the list and edit views.
  *
+ * @events
  * | Event | Description | Data |
  * | ----- | ----------- | ---- |
  * | `company/stateTaxes/updated` | State tax requirements were saved successfully | Response from the update state tax requirements API |
@@ -34,5 +42,4 @@ interface StateTaxesFormProps extends CommonComponentInterface {
  * }
  * ```
  */
-export declare function StateTaxesForm(props: StateTaxesFormProps & BaseComponentInterface): import("react").JSX.Element;
-export {};
+export declare function StateTaxesForm(props: StateTaxesFormProps): import("react").JSX.Element;