@qssolutions/ssas-registration-form 2.0.0 → 2.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"LowerFormSection.d.ts","sourceRoot":"","sources":["../../src/components/LowerFormSection.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAY,MAAM,OAAO,CAAA;AAC3C,OAAO,EAEH,KAAK,EACL,oBAAoB,EACpB,aAAa,EAChB,MAAM,iBAAiB,CAAA;AACxB,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAI9D,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAMpD,KAAK,qBAAqB,GAAG;IACzB,QAAQ,EAAE,eAAe,CAAC,KAAK,CAAC,CAAA;IAChC,aAAa,EAAE,OAAO,CAAA;IACtB,MAAM,EAAE,WAAW,CAAC,KAAK,CAAC,CAAA;IAC1B,WAAW,EAAE,oBAAoB,CAAA;IACjC,MAAM,EAAE,iBAAiB,CAAA;IACzB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,WAAW,CAAC,EAAE,aAAa,CAAA;CAC9B,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CA0ItD,CAAA"}
1
+ {"version":3,"file":"LowerFormSection.d.ts","sourceRoot":"","sources":["../../src/components/LowerFormSection.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAY,MAAM,OAAO,CAAA;AAC3C,OAAO,EAEH,KAAK,EACL,oBAAoB,EACpB,aAAa,EAChB,MAAM,iBAAiB,CAAA;AACxB,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAI9D,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAMpD,KAAK,qBAAqB,GAAG;IACzB,QAAQ,EAAE,eAAe,CAAC,KAAK,CAAC,CAAA;IAChC,aAAa,EAAE,OAAO,CAAA;IACtB,MAAM,EAAE,WAAW,CAAC,KAAK,CAAC,CAAA;IAC1B,WAAW,EAAE,oBAAoB,CAAA;IACjC,MAAM,EAAE,iBAAiB,CAAA;IACzB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,WAAW,CAAC,EAAE,aAAa,CAAA;CAC9B,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CA4ItD,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"SSASRegistrationForm.d.ts","sourceRoot":"","sources":["../../src/components/SSASRegistrationForm.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAgC,MAAM,OAAO,CAAA;AAY/D,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAapD,eAAO,MAAM,WAAW;;;;;CAKvB,CAAA;AAED,UAAU,yBAAyB;IAC/B,MAAM,EAAE,iBAAiB,CAAA;CAC5B;AAED;;;GAGG;AACH,eAAO,MAAM,oBAAoB,EAAE,EAAE,CAAC,yBAAyB,CA4jB9D,CAAA"}
1
+ {"version":3,"file":"SSASRegistrationForm.d.ts","sourceRoot":"","sources":["../../src/components/SSASRegistrationForm.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAgC,MAAM,OAAO,CAAA;AAY/D,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAcpD,eAAO,MAAM,WAAW;;;;;CAKvB,CAAA;AAED,UAAU,yBAAyB;IAC/B,MAAM,EAAE,iBAAiB,CAAA;CAC5B;AAED;;;GAGG;AACH,eAAO,MAAM,oBAAoB,EAAE,EAAE,CAAC,yBAAyB,CAmkB9D,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"UpperFormSection.d.ts","sourceRoot":"","sources":["../../src/components/UpperFormSection.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAE/C,OAAO,EACH,OAAO,EACP,WAAW,EACX,kBAAkB,EAClB,eAAe,EACf,eAAe,EACf,cAAc,EACd,YAAY,EACf,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,KAAK,EAAa,oBAAoB,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AACxF,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AACrD,OAAO,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAIpD,KAAK,qBAAqB,GAAG;IACzB,aAAa,EAAE,OAAO,CAAC;IACvB,gBAAgB,EAAE,OAAO,CAAC;IAC1B,mBAAmB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACnE,QAAQ,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC;IACjC,QAAQ,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC;IACjC,WAAW,EAAE,kBAAkB,CAAC,KAAK,CAAC,CAAC;IACvC,OAAO,EAAE,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;IAC7B,MAAM,EAAE,WAAW,CAAC,KAAK,CAAC,CAAC;IAC3B,OAAO,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC;IAC/B,KAAK,EAAE,YAAY,CAAC,KAAK,CAAC,CAAC;IAC3B,WAAW,EAAE,oBAAoB,CAAC;IAClC,MAAM,EAAE,iBAAiB,CAAC;IAC1B,UAAU,EAAE,UAAU,CAAC;IACvB,MAAM,EAAE,GAAG,CAAC;IACZ,cAAc,CAAC,EAAE,UAAU,EAAE,CAAC;IAC9B,gBAAgB,CAAC,EAAE,UAAU,EAAE,CAAC;IAChC,kBAAkB,CAAC,EAAE,UAAU,EAAE,CAAC;IAClC,gBAAgB,CAAC,EAAE,UAAU,EAAE,CAAC;IAChC,WAAW,CAAC,EAAE,aAAa,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AASF,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CAwGtD,CAAC"}
1
+ {"version":3,"file":"UpperFormSection.d.ts","sourceRoot":"","sources":["../../src/components/UpperFormSection.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAE/C,OAAO,EACH,OAAO,EACP,WAAW,EACX,kBAAkB,EAClB,eAAe,EACf,eAAe,EACf,cAAc,EACd,YAAY,EACf,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,KAAK,EAAa,oBAAoB,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AACxF,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AACrD,OAAO,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAGpD,KAAK,qBAAqB,GAAG;IACzB,aAAa,EAAE,OAAO,CAAC;IACvB,gBAAgB,EAAE,OAAO,CAAC;IAC1B,mBAAmB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACnE,QAAQ,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC;IACjC,QAAQ,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC;IACjC,WAAW,EAAE,kBAAkB,CAAC,KAAK,CAAC,CAAC;IACvC,OAAO,EAAE,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;IAC7B,MAAM,EAAE,WAAW,CAAC,KAAK,CAAC,CAAC;IAC3B,OAAO,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC;IAC/B,KAAK,EAAE,YAAY,CAAC,KAAK,CAAC,CAAC;IAC3B,WAAW,EAAE,oBAAoB,CAAC;IAClC,MAAM,EAAE,iBAAiB,CAAC;IAC1B,UAAU,EAAE,UAAU,CAAC;IACvB,MAAM,EAAE,GAAG,CAAC;IACZ,cAAc,CAAC,EAAE,UAAU,EAAE,CAAC;IAC9B,gBAAgB,CAAC,EAAE,UAAU,EAAE,CAAC;IAChC,kBAAkB,CAAC,EAAE,UAAU,EAAE,CAAC;IAClC,gBAAgB,CAAC,EAAE,UAAU,EAAE,CAAC;IAChC,WAAW,CAAC,EAAE,aAAa,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AASF,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CAqGtD,CAAC"}
@@ -3,6 +3,8 @@ import type { FontConfig } from "../../styles/defaultStyles";
3
3
  interface FormThemeProviderProps {
4
4
  primaryColor?: string;
5
5
  fonts?: FontConfig;
6
+ /** Text direction for the whole form; v9 controls (radios, icons, dropdowns) mirror from it. */
7
+ dir?: "ltr" | "rtl";
6
8
  children: ReactNode;
7
9
  }
8
10
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"FormThemeProvider.d.ts","sourceRoot":"","sources":["../../../src/components/common/FormThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,SAAS,EAAW,MAAM,OAAO,CAAA;AAGrD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAA;AAE5D,UAAU,sBAAsB;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,KAAK,CAAC,EAAE,UAAU,CAAA;IAClB,QAAQ,EAAE,SAAS,CAAA;CACtB;AAED;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,CAQxD,CAAA"}
1
+ {"version":3,"file":"FormThemeProvider.d.ts","sourceRoot":"","sources":["../../../src/components/common/FormThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,SAAS,EAAW,MAAM,OAAO,CAAA;AAGrD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAA;AAE5D,UAAU,sBAAsB;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,KAAK,CAAC,EAAE,UAAU,CAAA;IAClB,gGAAgG;IAChG,GAAG,CAAC,EAAE,KAAK,GAAG,KAAK,CAAA;IACnB,QAAQ,EAAE,SAAS,CAAA;CACtB;AAED;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,CAQxD,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"SSASPrimaryButton.d.ts","sourceRoot":"","sources":["../../../src/components/common/SSASPrimaryButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,aAAa,EAAE,UAAU,EAAgB,SAAS,EAAE,MAAM,OAAO,CAAA;AAM1E;;;;;;;;GAQG;AACH,MAAM,WAAW,uBAAuB;IACpC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,qDAAqD;IACrD,MAAM,CAAC,EAAE;QAAE,IAAI,CAAC,EAAE,aAAa,CAAA;KAAE,CAAA;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAA;IACpC,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAA;IACrD,0FAA0F;IAC1F,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,sEAAsE;IACtE,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,EAAE,aAAa,EAAE,MAAM,SAAS,KAAK,SAAS,CAAA;IAChG,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,mGAAmG;IACnG,QAAQ,CAAC,EAAE,MAAM,CAAA;CACpB;AAiDD,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAkE/D,CAAA"}
1
+ {"version":3,"file":"SSASPrimaryButton.d.ts","sourceRoot":"","sources":["../../../src/components/common/SSASPrimaryButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,aAAa,EAAE,UAAU,EAAgB,SAAS,EAAE,MAAM,OAAO,CAAA;AAK1E;;;;;;;;GAQG;AACH,MAAM,WAAW,uBAAuB;IACpC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,qDAAqD;IACrD,MAAM,CAAC,EAAE;QAAE,IAAI,CAAC,EAAE,aAAa,CAAA;KAAE,CAAA;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAA;IACpC,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAA;IACrD,0FAA0F;IAC1F,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,sEAAsE;IACtE,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,EAAE,aAAa,EAAE,MAAM,SAAS,KAAK,SAAS,CAAA;IAChG,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,mGAAmG;IACnG,QAAQ,CAAC,EAAE,MAAM,CAAA;CACpB;AA0DD,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAyE/D,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"SSASTextInput.d.ts","sourceRoot":"","sources":["../../../src/components/common/SSASTextInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAA;AACzC,OAAO,EAAS,UAAU,EAAS,UAAU,EAAgB,MAAM,4BAA4B,CAAA;AAE/F,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAA;AAE5D,MAAM,WAAW,kBAAmB,SAAQ,UAAU;IAClD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,8EAA8E;IAC9E,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,oFAAoF;IACpF,IAAI,CAAC,EAAE,UAAU,CAAC,MAAM,CAAC,CAAA;IACzB,KAAK,CAAC,EAAE,UAAU,CAAA;CACrB;AAED;;;;;GAKG;AACH,eAAO,MAAM,aAAa,6FAezB,CAAA"}
1
+ {"version":3,"file":"SSASTextInput.d.ts","sourceRoot":"","sources":["../../../src/components/common/SSASTextInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAA;AACzC,OAAO,EAAS,UAAU,EAAS,UAAU,EAAgB,MAAM,4BAA4B,CAAA;AAE/F,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAA;AAE5D,MAAM,WAAW,kBAAmB,SAAQ,UAAU;IAClD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,8EAA8E;IAC9E,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,oFAAoF;IACpF,IAAI,CAAC,EAAE,UAAU,CAAC,MAAM,CAAC,CAAA;IACzB,KAAK,CAAC,EAAE,UAAU,CAAA;CACrB;AAED;;;;;GAKG;AACH,eAAO,MAAM,aAAa,6FAgBzB,CAAA"}
@@ -13,11 +13,6 @@ export interface ControlledComboboxProps extends HookFormProps {
13
13
  className?: string;
14
14
  fonts?: FontConfig;
15
15
  }
16
- /**
17
- * Ported from SharedPortal's `ControlledComboBox` (`Field` + `Combobox freeform`). v8's `allowFreeInput`
18
- * had no per-call-site toggle, so `freeform` stays unconditional. The form value is `option.key` when it
19
- * is a string, else `option.text`, as before; the country list has string keys.
20
- */
21
16
  export declare const ControlledCombobox: FC<ControlledComboboxProps>;
22
17
  export default ControlledCombobox;
23
18
  //# sourceMappingURL=ControlledComboBox.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ControlledComboBox.d.ts","sourceRoot":"","sources":["../../../src/components/form-fields/ControlledComboBox.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,aAAa,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AAGhD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAA;AAEjD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAA;AAE5D,MAAM,WAAW,uBAAwB,SAAQ,aAAa;IAC1D,OAAO,EAAE,UAAU,EAAE,CAAA;IACrB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,UAAU,CAAA;CACrB;AAED;;;;GAIG;AACH,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC,uBAAuB,CA2D1D,CAAA;AAED,eAAe,kBAAkB,CAAA"}
1
+ {"version":3,"file":"ControlledComboBox.d.ts","sourceRoot":"","sources":["../../../src/components/form-fields/ControlledComboBox.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,aAAa,EAAE,EAAE,EAAoB,MAAM,OAAO,CAAA;AAGlE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAA;AAEjD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAA;AAE5D,MAAM,WAAW,uBAAwB,SAAQ,aAAa;IAC1D,OAAO,EAAE,UAAU,EAAE,CAAA;IACrB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,UAAU,CAAA;CACrB;AAuFD,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC,uBAAuB,CAwB1D,CAAA;AAED,eAAe,kBAAkB,CAAA"}
package/dist/index.esm.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as React from 'react';
2
- import React__default, { useMemo, forwardRef, useState, useCallback, useEffect } from 'react';
2
+ import React__default, { useMemo, forwardRef, useState, useCallback, useRef, useEffect } from 'react';
3
3
  import { Controller, useForm, useWatch } from 'react-hook-form';
4
- import { makeStyles, shorthands, createLightTheme, FluentProvider, Field, Input, mergeClasses, Checkbox, Dropdown, Option, Combobox, Spinner, RadioGroup, Radio, Button } from '@fluentui/react-components';
4
+ import { makeStyles, shorthands, createLightTheme, FluentProvider, tokens, Field, Input, mergeClasses, Checkbox, Dropdown, Option, Combobox, Spinner, RadioGroup, Radio, useFluent, Button } from '@fluentui/react-components';
5
5
  import ReCAPTCHA from 'react-google-recaptcha';
6
6
  import { ChevronLeftRegular, ChevronRightRegular } from '@fluentui/react-icons';
7
7
  import ReactDOM from 'react-dom/client';
@@ -23294,24 +23294,72 @@ const createFormTheme = (primaryColor = DEFAULT_PRIMARY_COLOR, fonts) => {
23294
23294
  * `primaryColor`/`fonts` props. The library is embedded in pages we don't control, so the provider
23295
23295
  * lives here rather than relying on a host one. `display: contents` keeps it out of the layout.
23296
23296
  */
23297
- const FormThemeProvider = ({ primaryColor, fonts, children }) => {
23297
+ const FormThemeProvider = ({ primaryColor, fonts, dir = "ltr", children }) => {
23298
23298
  const fontFamily = fonts?.family;
23299
23299
  const theme = useMemo(() => createFormTheme(primaryColor, { family: fontFamily }), [primaryColor, fontFamily]);
23300
- return (React__default.createElement(FluentProvider, { theme: theme, style: { display: "contents" } }, children));
23300
+ return (React__default.createElement(FluentProvider, { theme: theme, dir: dir, style: { display: "contents" } }, children));
23301
23301
  };
23302
23302
 
23303
+ /**
23304
+ * Deep merge utility
23305
+ */
23306
+ /**
23307
+ * Check if current language is RTL
23308
+ */
23309
+ function isRTLContent(languageCode) {
23310
+ const rtlLanguages = ['ar', 'he'];
23311
+ if (languageCode) {
23312
+ return rtlLanguages.includes(languageCode.toLowerCase());
23313
+ }
23314
+ // Try to detect from document or i18n
23315
+ return false;
23316
+ }
23317
+
23318
+ const INVALID = "[aria-invalid='true']";
23303
23319
  /**
23304
23320
  * v9 replacements for the v8 `textFieldStyles` / `dropdownStyles` / `comboboxStyles` objects
23305
23321
  * (`defaultStyles.ts`). The font family now comes from the `FluentProvider` theme
23306
23322
  * (`createFormTheme`), so only the box styling lives here.
23307
23323
  */
23308
23324
  const useFieldStyles = makeStyles({
23309
- // v8 `fieldGroup`: grey fill, 1px #DDD border, 5px radius, 50px high.
23325
+ // Mirrors SharedPortal's `inputRoot` (`form-screen.styles.ts`): a near-white fill with a #8A8A8A edge
23326
+ // (over 3:1, WCAG's minimum for a control's boundary), 5px radius, 50px high. The old #F5F5F5 fill
23327
+ // and #DDDDDD edge read as disabled, so that look is kept for real disabled fields only.
23310
23328
  input: {
23311
- backgroundColor: "#F5F5F5",
23312
- ...shorthands.border("1px", "solid", "#DDDDDD"),
23329
+ backgroundColor: "#FCFCFF",
23330
+ ...shorthands.border("1px", "solid", "#8A8A8A"),
23313
23331
  ...shorthands.borderRadius("5px"),
23314
23332
  height: "50px",
23333
+ transitionProperty: "border-color, background-color",
23334
+ transitionDuration: "0.15s",
23335
+ // Text and placeholder at 16px. The `<input>` and the Dropdown's button carry v9's own 14px
23336
+ // class, which a font size on the root does not reach.
23337
+ "& input, & .fui-Dropdown__button": {
23338
+ fontSize: "16px",
23339
+ },
23340
+ // The field being typed in turns white, so it stands out from the rest.
23341
+ ":focus-within": {
23342
+ backgroundColor: "#fff",
23343
+ },
23344
+ // Hover and focus are skipped on an invalid field, so its red edge always shows. `aria-invalid`
23345
+ // is what Field puts on the control when its `validationState` is "error": on the input, or
23346
+ // on the button for Dropdown. Hover also skips the focused field: Griffel emits `:hover` rules
23347
+ // after `:focus-within` ones, so the brand edge would otherwise turn grey under the pointer.
23348
+ [`:hover:not(:focus-within):not(${INVALID}):not(:has(${INVALID})):not(:has(:disabled))`]: {
23349
+ ...shorthands.borderColor("#424242"),
23350
+ },
23351
+ [`:focus-within:not(${INVALID}):not(:has(${INVALID}))`]: {
23352
+ ...shorthands.borderColor(tokens.colorBrandStroke1),
23353
+ },
23354
+ // v9 only draws its red edge while the field is not focused, and its own `:focus-within` grey
23355
+ // outranks a plain rule here; `!important` (as in SharedPortal) keeps the red on focus too.
23356
+ [`&${INVALID}, &:has(${INVALID})`]: {
23357
+ ...shorthands.borderColor(`${tokens.colorPaletteRedBorder2} !important`),
23358
+ },
23359
+ "&:has(:disabled)": {
23360
+ backgroundColor: "#F5F5F5",
23361
+ ...shorthands.borderColor("#DDDDDD"),
23362
+ },
23315
23363
  },
23316
23364
  // v9 Dropdown/Combobox roots are inline-block with a 250-400px width window; v8's filled its column.
23317
23365
  fill: {
@@ -23466,7 +23514,7 @@ const FormComponentList = (translation, performByPartner, model) => {
23466
23514
  const SSASTextInput = forwardRef(({ label, errorMessage, hint, fonts, required, className, ...props }, ref) => {
23467
23515
  const styles = useFieldStyles();
23468
23516
  return (React__default.createElement(Field, { label: label ? { children: label, style: fieldLabelStyle(fonts) } : undefined, hint: hint, required: !!required, validationState: errorMessage ? "error" : "none", validationMessage: errorMessage },
23469
- React__default.createElement(Input, { ref: ref, className: mergeClasses(styles.input, className), ...props })));
23517
+ React__default.createElement(Input, { ref: ref, className: mergeClasses(styles.input, styles.fill, className), ...props })));
23470
23518
  });
23471
23519
  SSASTextInput.displayName = "SSASTextInput";
23472
23520
 
@@ -23578,21 +23626,43 @@ const ControlledDropdown = ({ name, control, rules, defaultValue, options, ...pr
23578
23626
  };
23579
23627
 
23580
23628
  /**
23581
- * Ported from SharedPortal's `ControlledComboBox` (`Field` + `Combobox freeform`). v8's `allowFreeInput`
23582
- * had no per-call-site toggle, so `freeform` stays unconditional. The form value is `option.key` when it
23583
- * is a string, else `option.text`, as before; the country list has string keys.
23629
+ * Ported from SharedPortal's `ControlledComboBox` (`Field` + `Combobox freeform`). Typed text is kept
23630
+ * apart from the field (`typedText`) and resolved on blur: an exact (case-insensitive) option match
23631
+ * selects that option, anything else clears both, so only a listed option can ever reach the form and
23632
+ * the `required` rule still fails on unmatched text. The form value is `option.key` when it is a string,
23633
+ * else `option.text`; the country list has string keys.
23584
23634
  */
23585
- const ControlledCombobox = ({ name, control, rules, defaultValue, options, label, placeholder, required, disabled, autoComplete, style, className, fonts, }) => {
23635
+ const ComboboxField = ({ value, onChange, onBlur, errorMessage, options, label, placeholder, required, disabled, autoComplete, style, className, fonts, }) => {
23586
23636
  const styles = useFieldStyles();
23587
- return (React__default.createElement(Controller, { name: name, control: control, rules: rules, defaultValue: defaultValue || "", render: ({ field: { onChange, onBlur, value }, fieldState: { error } }) => {
23588
- const matchedOption = options.find((o) => String(o.key) === String(value));
23589
- return (React__default.createElement(Field, { label: label ? { children: label, style: fieldLabelStyle(fonts) } : undefined, required: required, validationState: error ? "error" : "none", validationMessage: error?.message },
23590
- React__default.createElement(Combobox, { freeform: true, value: matchedOption ? matchedOption.text : value ?? "", selectedOptions: matchedOption ? [String(matchedOption.key)] : [], placeholder: placeholder, disabled: disabled, autoComplete: autoComplete, style: style, className: mergeClasses(styles.input, styles.fill, className), onOptionSelect: (_, data) => {
23591
- const option = options.find((o) => String(o.key) === data.optionValue);
23592
- if (option)
23593
- onChange(typeof option.key === "string" ? option.key : option.text);
23594
- }, onChange: (e) => onChange(e.target.value), onBlur: onBlur }, options.map((option) => (React__default.createElement(Option, { key: option.key, value: String(option.key), text: option.text }, option.text))))));
23595
- } }));
23637
+ const matchedOption = options.find((o) => String(o.key) === String(value));
23638
+ // `null` while not typing, so the input shows the selected option's text. A ref, because Tab both
23639
+ // selects the highlighted option and blurs in one go — the blur handler must see that selection.
23640
+ const typedTextRef = useRef(null);
23641
+ const [typedText, setTypedText] = useState(null);
23642
+ const updateTypedText = (text) => {
23643
+ typedTextRef.current = text;
23644
+ setTypedText(text);
23645
+ };
23646
+ const commit = (option) => {
23647
+ onChange(option ? (typeof option.key === "string" ? option.key : option.text) : "");
23648
+ updateTypedText(null);
23649
+ };
23650
+ return (React__default.createElement(Field, { label: label ? { children: label, style: fieldLabelStyle(fonts) } : undefined, required: required, validationState: errorMessage ? "error" : "none", validationMessage: errorMessage },
23651
+ React__default.createElement(Combobox, { freeform: true, value: typedText ?? matchedOption?.text ?? "", selectedOptions: matchedOption ? [String(matchedOption.key)] : [], placeholder: placeholder, disabled: disabled, autoComplete: autoComplete, style: style, className: mergeClasses(styles.input, styles.fill, className), onOptionSelect: (_, data) => {
23652
+ const option = options.find((o) => String(o.key) === data.optionValue);
23653
+ if (option)
23654
+ commit(option);
23655
+ }, onChange: (e) => updateTypedText(e.target.value), onBlur: () => {
23656
+ const text = typedTextRef.current;
23657
+ if (text !== null) {
23658
+ const search = text.trim().toLowerCase();
23659
+ commit(search ? options.find((o) => o.text.toLowerCase() === search) : undefined);
23660
+ }
23661
+ onBlur();
23662
+ } }, options.map((option) => (React__default.createElement(Option, { key: option.key, value: String(option.key), text: option.text }, option.text))))));
23663
+ };
23664
+ const ControlledCombobox = ({ name, control, rules, defaultValue, ...props }) => {
23665
+ return (React__default.createElement(Controller, { name: name, control: control, rules: rules, defaultValue: defaultValue || "", render: ({ field: { onChange, onBlur, value }, fieldState: { error } }) => (React__default.createElement(ComboboxField, { ...props, value: value, onChange: onChange, onBlur: onBlur, errorMessage: error?.message })) }));
23596
23666
  };
23597
23667
 
23598
23668
  // eslint-disable-next-line @typescript-eslint/no-namespace
@@ -23736,21 +23806,6 @@ const FormComponentRenderer = ({ formModels, isRegistering, control, setValue, s
23736
23806
  return (React__default.createElement(React__default.Fragment, null, renderList.map((component) => renderByType(component, component.name))));
23737
23807
  };
23738
23808
 
23739
- /**
23740
- * Deep merge utility
23741
- */
23742
- /**
23743
- * Check if current language is RTL
23744
- */
23745
- function isRTLContent(languageCode) {
23746
- const rtlLanguages = ['ar', 'he'];
23747
- if (languageCode) {
23748
- return rtlLanguages.includes(languageCode.toLowerCase());
23749
- }
23750
- // Try to detect from document or i18n
23751
- return false;
23752
- }
23753
-
23754
23809
  // v8 ChoiceGroup root: 30px under the group.
23755
23810
  const useRadioStyles = makeStyles({
23756
23811
  root: {
@@ -23760,7 +23815,6 @@ const useRadioStyles = makeStyles({
23760
23815
  const UpperFormSection = ({ isRegistering, performByPartner, setPerformByPartner, setValue, setError, clearErrors, control, errors, trigger, watch, translation, config, apiService, styles, countryOptions, orgSizingOptions, orgIndustryOptions, hearAboutOptions, partnerData, primaryColor: primaryColorProp, }) => {
23761
23816
  const primaryColor = primaryColorProp || "#00BAE4";
23762
23817
  const radioStyles = useRadioStyles();
23763
- const isRTL = isRTLContent(partnerData?.languageCode);
23764
23818
  const choiceGroupOptions = [
23765
23819
  { key: "ByCustomer", text: translation.ByCustomer },
23766
23820
  { key: "ByPartner", text: translation.ByPartner },
@@ -23786,9 +23840,7 @@ const UpperFormSection = ({ isRegistering, performByPartner, setPerformByPartner
23786
23840
  isHearAbout ? FormModel.HearAbout : false,
23787
23841
  ];
23788
23842
  return (React__default.createElement(React__default.Fragment, null,
23789
- React__default.createElement(RadioGroup, { defaultValue: "ByCustomer", className: radioStyles.root,
23790
- // v8's `flexDirection: row-reverse` pushed the options to the right edge for RTL
23791
- style: isRTL ? { alignItems: "flex-end" } : undefined, onChange: (_e, data) => {
23843
+ React__default.createElement(RadioGroup, { defaultValue: "ByCustomer", className: radioStyles.root, onChange: (_e, data) => {
23792
23844
  // Reset the partner fields
23793
23845
  setValue(FormModel.CustomerPartnerMail, "");
23794
23846
  setValue(FormModel.CustomerPartnerName, "");
@@ -23831,6 +23883,15 @@ const useStyles = makeStyles({
23831
23883
  ":active:where(:not(:disabled, [aria-disabled='true']))": {
23832
23884
  backgroundColor: `color-mix(in srgb, var(${BRAND_VAR}), #000 15%) !important`,
23833
23885
  },
23886
+ // v9 draws its keyboard focus ring with `border` and `box-shadow`, and the inline `border: none`
23887
+ // and drop shadow here overwrite both, so a focused button showed no ring at all. Redrawn as an
23888
+ // outline (which nothing inline sets) plus an inner white ring, readable on light and dark
23889
+ // backgrounds alike.
23890
+ ":focus-visible": {
23891
+ outline: "2px solid #000 !important",
23892
+ outlineOffset: "2px",
23893
+ boxShadow: "inset 0 0 0 2px #fff !important",
23894
+ },
23834
23895
  },
23835
23896
  });
23836
23897
  const baseStyle = (noShadow, disabled) => ({
@@ -23863,20 +23924,26 @@ const iconFor = (name, disabled) => {
23863
23924
  };
23864
23925
  const SSASPrimaryButton = (props) => {
23865
23926
  const classes = useStyles();
23927
+ // From `FormThemeProvider`, which sets it from the form's language.
23928
+ const { dir } = useFluent();
23866
23929
  const { styles, primaryColor, noShadow, iconProps, noIcon, iconName, loadingIcon, onRenderMenuIcon, text, className, style, disabled, type, onClick, children, } = props;
23867
23930
  const color = primaryColor || DEFAULT_PRIMARY_COLOR;
23868
23931
  const isDisabled = disabled || loadingIcon;
23932
+ // While loading the button is blocked but stays focusable (`aria-disabled`, not `disabled`): a truly
23933
+ // disabled button drops keyboard focus to the page body, so a visitor who pressed Enter on it
23934
+ // would be thrown back to the top of the tab order.
23935
+ const isBlockedWhileLoading = !!loadingIcon && !disabled;
23869
23936
  const brandStyle = {
23870
23937
  [BRAND_VAR]: color,
23871
23938
  ...(isDisabled ? {} : { backgroundColor: `var(${BRAND_VAR})`, color: "#fff" }),
23872
23939
  };
23873
23940
  const mergedStyle = { ...brandStyle, ...baseStyle(noShadow, isDisabled), ...styles?.root, ...style };
23874
23941
  // v8 rendered a trailing chevron by default, direction-aware, unless noIcon was set.
23875
- const defaultIconName = isRTLContent() ? "ChevronLeft" : "ChevronRight";
23942
+ const defaultIconName = dir === "rtl" ? "ChevronLeft" : "ChevronRight";
23876
23943
  const defaultIcon = iconFor(iconName ?? defaultIconName, isDisabled);
23877
23944
  // `onRenderMenuIcon` is checked first: the caller implements its own loading-spinner-vs-default
23878
23945
  // logic and calls `defaultRender()` on the non-loading branch.
23879
- const icon = onRenderMenuIcon ? (onRenderMenuIcon(props, () => defaultIcon ?? null) ?? undefined) : loadingIcon ? (React.createElement(Spinner, { size: "tiny" })) : noIcon ? undefined : (defaultIcon);
23946
+ const icon = onRenderMenuIcon ? (onRenderMenuIcon(props, () => defaultIcon ?? null) ?? undefined) : loadingIcon ? (React.createElement(Spinner, { "aria-label": "Loading", size: "tiny" })) : noIcon ? undefined : (defaultIcon);
23880
23947
  const iconPosition = iconProps ? "before" : "after";
23881
23948
  // A trailing icon makes the content lopsided; extra start padding rebalances it, and
23882
23949
  // `mergedStyle` goes last so a call site's own padding still wins.
@@ -23884,7 +23951,7 @@ const SSASPrimaryButton = (props) => {
23884
23951
  ...(icon && iconPosition === "after" ? { paddingInlineStart: 20 } : {}),
23885
23952
  ...mergedStyle,
23886
23953
  };
23887
- return (React.createElement(Button, { appearance: "primary", className: mergeClasses(classes.interactive, className), style: balancedStyle, icon: icon, iconPosition: iconPosition, disabled: isDisabled, type: type, onClick: onClick }, text ?? children));
23954
+ return (React.createElement(Button, { appearance: "primary", className: mergeClasses(classes.interactive, className), style: balancedStyle, icon: icon, iconPosition: iconPosition, disabled: disabled, disabledFocusable: isBlockedWhileLoading, type: type, onClick: onClick }, text ?? children));
23888
23955
  };
23889
23956
 
23890
23957
  const LowerFormSection = ({ setValue, isRegistering, errors, translation, submissionError, primaryColor: primaryColorProp, partnerData, }) => {
@@ -23929,7 +23996,7 @@ const LowerFormSection = ({ setValue, isRegistering, errors, translation, submis
23929
23996
  const renderLoadingIcon = (_props, defaultRender) => {
23930
23997
  // v8 `SpinnerSize.medium` (20px) maps to v9 "tiny"
23931
23998
  if (isRegistering)
23932
- return React__default.createElement(Spinner, { size: "tiny" });
23999
+ return React__default.createElement(Spinner, { "aria-label": "Submitting", size: "tiny" });
23933
24000
  else
23934
24001
  return defaultRender ? defaultRender() : null;
23935
24002
  };
@@ -23955,7 +24022,9 @@ const LowerFormSection = ({ setValue, isRegistering, errors, translation, submis
23955
24022
  React__default.createElement("span", { style: { fontSize: 16, fontWeight: 600 } }, "\u26A0"),
23956
24023
  React__default.createElement("span", null, submissionError))),
23957
24024
  React__default.createElement(SSASPrimaryButton, { text: translation.SubmitRequest, primaryColor: primaryColor, styles: {
23958
- root: { display: "block", width: "100%" },
24025
+ // `flex`, not `block`: v9 Button centres its icon and label as flex items, and
24026
+ // `block` dropped the icon onto the text baseline, a few px above the label.
24027
+ root: { display: "flex", width: "100%" },
23959
24028
  }, type: "submit", disabled: Object.keys(errors).length > 0 ||
23960
24029
  isRegistering ||
23961
24030
  !termAcceptance ||
@@ -24026,6 +24095,8 @@ const SSASRegistrationForm = ({ config, }) => {
24026
24095
  return (languageOptions.find((x) => x.data.code === currentLang)?.text ||
24027
24096
  "English");
24028
24097
  }, [mergedConfig.languageCode, partnerData?.languageCode, languageOptions]);
24098
+ // Same language the translations are loaded in (`getFormScreenLocalization` below).
24099
+ const formDir = isRTLContent(mergedConfig.languageCode || partnerData?.languageCode) ? "rtl" : "ltr";
24029
24100
  const { handleSubmit, setValue, setError, control, watch, clearErrors, trigger, formState: { errors }, } = useForm({
24030
24101
  defaultValues: {
24031
24102
  orgSizingId: 1,
@@ -24264,7 +24335,7 @@ const SSASRegistrationForm = ({ config, }) => {
24264
24335
  // Show success screen if registration completed
24265
24336
  if (finalStep) {
24266
24337
  // Default success screen
24267
- return (React__default.createElement(FormThemeProvider, { primaryColor: mergedConfig.theme?.primaryColor || colorWidget?.column1, fonts: mergedConfig.theme?.fonts },
24338
+ return (React__default.createElement(FormThemeProvider, { primaryColor: mergedConfig.theme?.primaryColor || colorWidget?.column1, fonts: mergedConfig.theme?.fonts, dir: formDir },
24268
24339
  React__default.createElement("div", { className: styles.mainContainer, style: mainContainerStyle },
24269
24340
  React__default.createElement("div", { className: styles.thankyouTopWrapper },
24270
24341
  React__default.createElement("div", { className: styles.finalStepContainer },
@@ -24273,6 +24344,7 @@ const SSASRegistrationForm = ({ config, }) => {
24273
24344
  fontSize: mergedConfig.theme?.fonts?.sizes
24274
24345
  ?.heading,
24275
24346
  fontWeight: 700,
24347
+ lineHeight: 1.2,
24276
24348
  } }, translation.ThankYou),
24277
24349
  React__default.createElement("div", { style: {
24278
24350
  fontSize: mergedConfig.theme?.fonts?.sizes
@@ -24289,7 +24361,7 @@ const SSASRegistrationForm = ({ config, }) => {
24289
24361
  textUnderlinePosition: "under",
24290
24362
  } }, finalStep)))))));
24291
24363
  }
24292
- return (React__default.createElement(FormThemeProvider, { primaryColor: mergedConfig.theme?.primaryColor || colorWidget?.column1, fonts: mergedConfig.theme?.fonts },
24364
+ return (React__default.createElement(FormThemeProvider, { primaryColor: mergedConfig.theme?.primaryColor || colorWidget?.column1, fonts: mergedConfig.theme?.fonts, dir: formDir },
24293
24365
  React__default.createElement("div", { className: styles.mainContainer, style: mainContainerStyle },
24294
24366
  React__default.createElement("div", { className: styles.topWrapper, style: mergedConfig.customStyles?.topWrapper }, isLoadingData ? (React__default.createElement(Spinner, { size: "tiny", labelPosition: "below", label: "Loading form data...", style: { marginBottom: "20px" } })) : partnerLoadFailed ? (React__default.createElement("div", { style: {
24295
24367
  textAlign: "center",
@@ -24300,6 +24372,7 @@ const SSASRegistrationForm = ({ config, }) => {
24300
24372
  fontSize: mergedConfig.theme?.fonts?.sizes?.heading ||
24301
24373
  24,
24302
24374
  fontWeight: 700,
24375
+ lineHeight: 1.2,
24303
24376
  marginBottom: 16,
24304
24377
  } }, "Access Not Available"),
24305
24378
  React__default.createElement("div", { style: {
@@ -24315,6 +24388,7 @@ const SSASRegistrationForm = ({ config, }) => {
24315
24388
  fontSize: mergedConfig.theme?.fonts?.sizes?.heading ||
24316
24389
  24,
24317
24390
  fontWeight: 700,
24391
+ lineHeight: 1.2,
24318
24392
  marginBottom: 16,
24319
24393
  } }, "Domain Not Whitelisted"),
24320
24394
  React__default.createElement("div", { style: {
@@ -24327,6 +24401,7 @@ const SSASRegistrationForm = ({ config, }) => {
24327
24401
  fontSize: mergedConfig.theme?.fonts?.sizes
24328
24402
  ?.heading,
24329
24403
  fontWeight: 700,
24404
+ lineHeight: 1.2,
24330
24405
  } }, translation.AppForm),
24331
24406
  React__default.createElement("div", { style: {
24332
24407
  fontSize: mergedConfig.theme?.fonts?.sizes