datakeen-session-react 1.1.161 → 1.1.163
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.
- package/dist/cjs/components/selfie/SelfieConfirmation.js +1 -1
- package/dist/cjs/components/selfie/SelfieConfirmation.js.map +1 -1
- package/dist/cjs/components/selfie/Video.js +2 -2
- package/dist/cjs/components/selfie/Video.js.map +1 -1
- package/dist/cjs/components/selfie/hooks/useVideoRecorderStyles.js +2 -2
- package/dist/cjs/components/selfie/hooks/useVideoRecorderStyles.js.map +1 -1
- package/dist/cjs/components/selfie/selfie-flow/SelfieFlow.js +7 -3
- package/dist/cjs/components/selfie/selfie-flow/SelfieFlow.js.map +1 -1
- package/dist/cjs/components/selfie/selfie-flow/SelfieProcessing.js +2 -7
- package/dist/cjs/components/selfie/selfie-flow/SelfieProcessing.js.map +1 -1
- package/dist/cjs/components/selfie/selfie-flow/SelfieRecorder.js +2 -2
- package/dist/cjs/components/selfie/selfie-flow/SelfieRecorder.js.map +1 -1
- package/dist/cjs/components/session/Selfie.js +7 -5
- package/dist/cjs/components/session/Selfie.js.map +1 -1
- package/dist/cjs/components/session/UserInputForm/AddressFields.js +2 -10
- package/dist/cjs/components/session/UserInputForm/AddressFields.js.map +1 -1
- package/dist/cjs/components/session/UserInputForm/NationalityField.js +2 -11
- package/dist/cjs/components/session/UserInputForm/NationalityField.js.map +1 -1
- package/dist/cjs/components/ui/Button.js +5 -3
- package/dist/cjs/components/ui/Button.js.map +1 -1
- package/dist/cjs/constants/userInputForm.js +0 -25
- package/dist/cjs/constants/userInputForm.js.map +1 -1
- package/dist/cjs/hooks/useCountryOptions.js +20 -0
- package/dist/cjs/hooks/useCountryOptions.js.map +1 -0
- package/dist/cjs/i18n/country/country.iso2.fr.json.js +2 -2
- package/dist/cjs/services/documentTemplate.js +1 -1
- package/dist/cjs/services/documentTemplate.js.map +1 -1
- package/dist/esm/components/selfie/SelfieConfirmation.js +1 -1
- package/dist/esm/components/selfie/SelfieConfirmation.js.map +1 -1
- package/dist/esm/components/selfie/Video.js +2 -2
- package/dist/esm/components/selfie/Video.js.map +1 -1
- package/dist/esm/components/selfie/hooks/useVideoRecorderStyles.js +2 -2
- package/dist/esm/components/selfie/hooks/useVideoRecorderStyles.js.map +1 -1
- package/dist/esm/components/selfie/selfie-flow/SelfieFlow.js +7 -3
- package/dist/esm/components/selfie/selfie-flow/SelfieFlow.js.map +1 -1
- package/dist/esm/components/selfie/selfie-flow/SelfieProcessing.js +2 -7
- package/dist/esm/components/selfie/selfie-flow/SelfieProcessing.js.map +1 -1
- package/dist/esm/components/selfie/selfie-flow/SelfieRecorder.js +2 -2
- package/dist/esm/components/selfie/selfie-flow/SelfieRecorder.js.map +1 -1
- package/dist/esm/components/session/Selfie.js +7 -5
- package/dist/esm/components/session/Selfie.js.map +1 -1
- package/dist/esm/components/session/UserInputForm/AddressFields.js +2 -10
- package/dist/esm/components/session/UserInputForm/AddressFields.js.map +1 -1
- package/dist/esm/components/session/UserInputForm/NationalityField.js +3 -12
- package/dist/esm/components/session/UserInputForm/NationalityField.js.map +1 -1
- package/dist/esm/components/ui/Button.js +5 -3
- package/dist/esm/components/ui/Button.js.map +1 -1
- package/dist/esm/constants/userInputForm.js +1 -25
- package/dist/esm/constants/userInputForm.js.map +1 -1
- package/dist/esm/hooks/useCountryOptions.js +18 -0
- package/dist/esm/hooks/useCountryOptions.js.map +1 -0
- package/dist/esm/i18n/country/country.iso2.fr.json.js +2 -2
- package/dist/esm/i18n/index.js +2 -2
- package/dist/esm/i18n/index.js.map +1 -1
- package/dist/esm/services/documentTemplate.js +1 -1
- package/dist/esm/services/documentTemplate.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AddressFields.js","sources":["../../../../../../src/components/session/UserInputForm/AddressFields.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport * as Label from \"@radix-ui/react-label\";\nimport clsx from \"clsx\";\nimport { Select } from \"../../ui/SelectComponent\";\nimport { COUNTRY_OPTIONS } from \"../../../constants/userInputForm\";\nimport type {\n AddressSuggestion,\n RequestedFields,\n UserInputFormErrors,\n UserInputFormState,\n} from \"../../../types/userInputForm\";\nimport { useI18n } from \"../../../hooks/useI18n\";\n\ninterface AddressFieldsProps {\n form: UserInputFormState;\n errors: UserInputFormErrors;\n requestedFields: RequestedFields;\n addressSuggestions: AddressSuggestion[];\n showSuggestions: boolean;\n onFieldChange: (key: keyof UserInputFormState, value: string) => void;\n onAddressChange: (value: string) => void;\n onAddressFocus: () => void;\n onAddressBlur: () => void;\n onApplySuggestion: (suggestion: AddressSuggestion) => void;\n}\n\nconst AddressFields = ({\n form,\n errors,\n requestedFields,\n addressSuggestions,\n showSuggestions,\n onFieldChange,\n onAddressChange,\n onAddressFocus,\n onAddressBlur,\n onApplySuggestion,\n}: AddressFieldsProps) => {\n const { t } = useI18n();\n\n const countryOptions = useMemo(() => {\n if (COUNTRY_OPTIONS.length === 0) {\n return COUNTRY_OPTIONS;\n }\n\n const [first, ...rest] = COUNTRY_OPTIONS;\n return [{ ...first, label: t(\"user_input_form.select.country\") }, ...rest];\n }, [t]);\n\n if (!requestedFields.has(\"adresse\")) {\n return null;\n }\n\n return (\n <>\n <div className=\"relative space-y-2\">\n <Label.Root\n htmlFor=\"addressLine1\"\n className=\"block text-sm md:text-base font-semibold text-gray-900\"\n >\n {t(\"user_input_form.fields.address_line1\")}\n </Label.Root>\n <input\n id=\"addressLine1\"\n type=\"text\"\n value={form.addressLine1 || \"\"}\n onChange={(event) => onAddressChange(event.target.value)}\n onFocus={onAddressFocus}\n onBlur={onAddressBlur}\n placeholder={t(\"user_input_form.placeholders.address_line1\")}\n className={clsx(\n \"w-full px-3 py-3 md:py-4 border rounded-lg text-base transition-colors focus:outline-none focus:ring-2 focus:ring-[#11E5C5] focus:border-transparent\",\n errors.addressLine1\n ? \"border-red-500 bg-red-50\"\n : \"border-gray-300 hover:border-gray-400\"\n )}\n autoComplete=\"street-address\"\n />\n {showSuggestions && addressSuggestions.length > 0 && (\n <div className=\"absolute z-20 mt-1 max-h-48 w-full overflow-auto rounded-lg border border-gray-200 bg-white shadow-lg\">\n {addressSuggestions.map((suggestion) => (\n <button\n key={suggestion.id}\n type=\"button\"\n className=\"w-full px-3 py-2 text-left text-sm hover:bg-gray-100\"\n onMouseDown={(event) => event.preventDefault()}\n onClick={() => onApplySuggestion(suggestion)}\n >\n <div className=\"flex flex-col\">\n <span className=\"text-sm text-gray-900\">\n {suggestion.label}\n </span>\n {(suggestion.city ||\n suggestion.postalCode ||\n suggestion.country ||\n suggestion.countryCode) && (\n <span className=\"text-xs text-gray-500\">\n {[\n [suggestion.postalCode, suggestion.city]\n .filter(Boolean)\n .join(\" \"),\n suggestion.country ||\n suggestion.countryCode?.toUpperCase(),\n ]\n .filter(Boolean)\n .join(\", \")}\n </span>\n )}\n </div>\n </button>\n ))}\n </div>\n )}\n {errors.addressLine1 && (\n <p className=\"flex items-center gap-1 text-sm text-red-600\">\n <span className=\"text-red-500\">⚠</span>\n {t(\"user_input_form.errors.address_line1_required\")}\n </p>\n )}\n </div>\n\n <div className=\"space-y-2\">\n <Label.Root\n htmlFor=\"addressLine2\"\n className=\"block text-sm md:text-base font-semibold text-gray-900\"\n >\n {t(\"user_input_form.fields.address_line2\")}\n </Label.Root>\n <input\n id=\"addressLine2\"\n type=\"text\"\n value={form.addressLine2 || \"\"}\n onChange={(event) =>\n onFieldChange(\"addressLine2\", event.target.value)\n }\n placeholder={t(\"user_input_form.placeholders.address_line2\")}\n className=\"w-full rounded-lg border border-gray-300 px-3 py-3 text-base transition-colors hover:border-gray-400 focus:border-transparent focus:outline-none focus:ring-2 focus:ring-[#11E5C5]\"\n autoComplete=\"address-line2\"\n />\n </div>\n\n <div className=\"grid grid-cols-[140px_minmax(0,1fr)] gap-3 md:grid-cols-[160px_minmax(0,1fr)]\">\n <div className=\"space-y-2\">\n <Label.Root\n htmlFor=\"postalCode\"\n className=\"block text-sm md:text-base font-semibold text-gray-900\"\n >\n {t(\"user_input_form.fields.postal_code\")}\n </Label.Root>\n <input\n id=\"postalCode\"\n type=\"text\"\n value={form.postalCode || \"\"}\n onChange={(event) =>\n onFieldChange(\"postalCode\", event.target.value)\n }\n placeholder={t(\"user_input_form.placeholders.postal_code\")}\n className={clsx(\n \"w-full px-3 py-3 md:py-4 border rounded-lg text-base transition-colors focus:outline-none focus:ring-2 focus:ring-[#11E5C5] focus:border-transparent\",\n errors.postalCode\n ? \"border-red-500 bg-red-50\"\n : \"border-gray-300 hover-border-gray-400\"\n )}\n autoComplete=\"postal-code\"\n />\n {errors.postalCode && (\n <p className=\"flex items-center gap-1 text-sm text-red-600\">\n <span className=\"text-red-500\">⚠</span>\n {t(\"user_input_form.errors.postal_code_required\")}\n </p>\n )}\n </div>\n\n <div className=\"space-y-2\">\n <Label.Root\n htmlFor=\"city\"\n className=\"block text-sm md:text-base font-semibold text-gray-900\"\n >\n {t(\"user_input_form.fields.city\")}\n </Label.Root>\n <input\n id=\"city\"\n type=\"text\"\n value={form.city || \"\"}\n onChange={(event) => onFieldChange(\"city\", event.target.value)}\n placeholder={t(\"user_input_form.placeholders.city\")}\n className={clsx(\n \"w-full px-3 py-3 md:py-4 border rounded-lg text-base transition-colors focus:outline-none focus:ring-2 focus:ring-[#11E5C5] focus:border-transparent\",\n errors.city\n ? \"border-red-500 bg-red-50\"\n : \"border-gray-300 hover-border-gray-400\"\n )}\n autoComplete=\"address-level2\"\n />\n {errors.city && (\n <p className=\"flex items-center gap-1 text-sm text-red-600\">\n <span className=\"text-red-500\">⚠</span>\n {t(\"user_input_form.errors.city_required\")}\n </p>\n )}\n </div>\n </div>\n\n <div className=\"space-y-2\">\n <Label.Root\n htmlFor=\"country\"\n className=\"block text-sm md:text-base font-semibold text-gray-900\"\n >\n {t(\"user_input_form.fields.country\")}\n </Label.Root>\n <Select\n options={countryOptions}\n value={form.countryCode || \"\"}\n onValueChange={(value) => onFieldChange(\"countryCode\", value)}\n placeholder={t(\"user_input_form.select.country\")}\n error={Boolean(errors.country)}\n />\n {errors.country && (\n <p className=\"flex items-center gap-1 text-sm text-red-600\">\n <span className=\"text-red-500\">⚠</span>\n {t(\"user_input_form.errors.country_required\")}\n </p>\n )}\n </div>\n </>\n );\n};\n\nexport default AddressFields;\n"],"names":["useI18n","useMemo","COUNTRY_OPTIONS","__spreadArray","__assign","_jsxs","_Fragment","_jsx","Label","Select"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"AddressFields.js","sources":["../../../../../../src/components/session/UserInputForm/AddressFields.tsx"],"sourcesContent":["import * as Label from \"@radix-ui/react-label\";\nimport clsx from \"clsx\";\nimport { Select } from \"../../ui/SelectComponent\";\nimport type {\n AddressSuggestion,\n RequestedFields,\n UserInputFormErrors,\n UserInputFormState,\n} from \"../../../types/userInputForm\";\nimport { useI18n } from \"../../../hooks/useI18n\";\nimport { useCountryOptions } from \"../../../hooks/useCountryOptions\";\n\ninterface AddressFieldsProps {\n form: UserInputFormState;\n errors: UserInputFormErrors;\n requestedFields: RequestedFields;\n addressSuggestions: AddressSuggestion[];\n showSuggestions: boolean;\n onFieldChange: (key: keyof UserInputFormState, value: string) => void;\n onAddressChange: (value: string) => void;\n onAddressFocus: () => void;\n onAddressBlur: () => void;\n onApplySuggestion: (suggestion: AddressSuggestion) => void;\n}\n\nconst AddressFields = ({\n form,\n errors,\n requestedFields,\n addressSuggestions,\n showSuggestions,\n onFieldChange,\n onAddressChange,\n onAddressFocus,\n onAddressBlur,\n onApplySuggestion,\n}: AddressFieldsProps) => {\n const { t } = useI18n();\n const countryOptions = useCountryOptions(\"user_input_form.select.country\");\n\n if (!requestedFields.has(\"adresse\")) {\n return null;\n }\n\n return (\n <>\n <div className=\"relative space-y-2\">\n <Label.Root\n htmlFor=\"addressLine1\"\n className=\"block text-sm md:text-base font-semibold text-gray-900\"\n >\n {t(\"user_input_form.fields.address_line1\")}\n </Label.Root>\n <input\n id=\"addressLine1\"\n type=\"text\"\n value={form.addressLine1 || \"\"}\n onChange={(event) => onAddressChange(event.target.value)}\n onFocus={onAddressFocus}\n onBlur={onAddressBlur}\n placeholder={t(\"user_input_form.placeholders.address_line1\")}\n className={clsx(\n \"w-full px-3 py-3 md:py-4 border rounded-lg text-base transition-colors focus:outline-none focus:ring-2 focus:ring-[#11E5C5] focus:border-transparent\",\n errors.addressLine1\n ? \"border-red-500 bg-red-50\"\n : \"border-gray-300 hover:border-gray-400\"\n )}\n autoComplete=\"street-address\"\n />\n {showSuggestions && addressSuggestions.length > 0 && (\n <div className=\"absolute z-20 mt-1 max-h-48 w-full overflow-auto rounded-lg border border-gray-200 bg-white shadow-lg\">\n {addressSuggestions.map((suggestion) => (\n <button\n key={suggestion.id}\n type=\"button\"\n className=\"w-full px-3 py-2 text-left text-sm hover:bg-gray-100\"\n onMouseDown={(event) => event.preventDefault()}\n onClick={() => onApplySuggestion(suggestion)}\n >\n <div className=\"flex flex-col\">\n <span className=\"text-sm text-gray-900\">\n {suggestion.label}\n </span>\n {(suggestion.city ||\n suggestion.postalCode ||\n suggestion.country ||\n suggestion.countryCode) && (\n <span className=\"text-xs text-gray-500\">\n {[\n [suggestion.postalCode, suggestion.city]\n .filter(Boolean)\n .join(\" \"),\n suggestion.country ||\n suggestion.countryCode?.toUpperCase(),\n ]\n .filter(Boolean)\n .join(\", \")}\n </span>\n )}\n </div>\n </button>\n ))}\n </div>\n )}\n {errors.addressLine1 && (\n <p className=\"flex items-center gap-1 text-sm text-red-600\">\n <span className=\"text-red-500\">⚠</span>\n {t(\"user_input_form.errors.address_line1_required\")}\n </p>\n )}\n </div>\n\n <div className=\"space-y-2\">\n <Label.Root\n htmlFor=\"addressLine2\"\n className=\"block text-sm md:text-base font-semibold text-gray-900\"\n >\n {t(\"user_input_form.fields.address_line2\")}\n </Label.Root>\n <input\n id=\"addressLine2\"\n type=\"text\"\n value={form.addressLine2 || \"\"}\n onChange={(event) =>\n onFieldChange(\"addressLine2\", event.target.value)\n }\n placeholder={t(\"user_input_form.placeholders.address_line2\")}\n className=\"w-full rounded-lg border border-gray-300 px-3 py-3 text-base transition-colors hover:border-gray-400 focus:border-transparent focus:outline-none focus:ring-2 focus:ring-[#11E5C5]\"\n autoComplete=\"address-line2\"\n />\n </div>\n\n <div className=\"grid grid-cols-[140px_minmax(0,1fr)] gap-3 md:grid-cols-[160px_minmax(0,1fr)]\">\n <div className=\"space-y-2\">\n <Label.Root\n htmlFor=\"postalCode\"\n className=\"block text-sm md:text-base font-semibold text-gray-900\"\n >\n {t(\"user_input_form.fields.postal_code\")}\n </Label.Root>\n <input\n id=\"postalCode\"\n type=\"text\"\n value={form.postalCode || \"\"}\n onChange={(event) =>\n onFieldChange(\"postalCode\", event.target.value)\n }\n placeholder={t(\"user_input_form.placeholders.postal_code\")}\n className={clsx(\n \"w-full px-3 py-3 md:py-4 border rounded-lg text-base transition-colors focus:outline-none focus:ring-2 focus:ring-[#11E5C5] focus:border-transparent\",\n errors.postalCode\n ? \"border-red-500 bg-red-50\"\n : \"border-gray-300 hover-border-gray-400\"\n )}\n autoComplete=\"postal-code\"\n />\n {errors.postalCode && (\n <p className=\"flex items-center gap-1 text-sm text-red-600\">\n <span className=\"text-red-500\">⚠</span>\n {t(\"user_input_form.errors.postal_code_required\")}\n </p>\n )}\n </div>\n\n <div className=\"space-y-2\">\n <Label.Root\n htmlFor=\"city\"\n className=\"block text-sm md:text-base font-semibold text-gray-900\"\n >\n {t(\"user_input_form.fields.city\")}\n </Label.Root>\n <input\n id=\"city\"\n type=\"text\"\n value={form.city || \"\"}\n onChange={(event) => onFieldChange(\"city\", event.target.value)}\n placeholder={t(\"user_input_form.placeholders.city\")}\n className={clsx(\n \"w-full px-3 py-3 md:py-4 border rounded-lg text-base transition-colors focus:outline-none focus:ring-2 focus:ring-[#11E5C5] focus:border-transparent\",\n errors.city\n ? \"border-red-500 bg-red-50\"\n : \"border-gray-300 hover-border-gray-400\"\n )}\n autoComplete=\"address-level2\"\n />\n {errors.city && (\n <p className=\"flex items-center gap-1 text-sm text-red-600\">\n <span className=\"text-red-500\">⚠</span>\n {t(\"user_input_form.errors.city_required\")}\n </p>\n )}\n </div>\n </div>\n\n <div className=\"space-y-2\">\n <Label.Root\n htmlFor=\"country\"\n className=\"block text-sm md:text-base font-semibold text-gray-900\"\n >\n {t(\"user_input_form.fields.country\")}\n </Label.Root>\n <Select\n options={countryOptions}\n value={form.countryCode || \"\"}\n onValueChange={(value) => onFieldChange(\"countryCode\", value)}\n placeholder={t(\"user_input_form.select.country\")}\n error={Boolean(errors.country)}\n />\n {errors.country && (\n <p className=\"flex items-center gap-1 text-sm text-red-600\">\n <span className=\"text-red-500\">⚠</span>\n {t(\"user_input_form.errors.country_required\")}\n </p>\n )}\n </div>\n </>\n );\n};\n\nexport default AddressFields;\n"],"names":["useI18n","useCountryOptions","_jsxs","_Fragment","_jsx","Label","Select"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBA,IAAM,aAAa,GAAG,UAAC,EAWF,EAAA;QAVnB,IAAI,GAAA,EAAA,CAAA,IAAA,EACJ,MAAM,GAAA,EAAA,CAAA,MAAA,EACN,eAAe,GAAA,EAAA,CAAA,eAAA,EACf,kBAAkB,GAAA,EAAA,CAAA,kBAAA,EAClB,eAAe,GAAA,EAAA,CAAA,eAAA,EACf,aAAa,GAAA,EAAA,CAAA,aAAA,EACb,eAAe,GAAA,EAAA,CAAA,eAAA,EACf,cAAc,GAAA,EAAA,CAAA,cAAA,EACd,aAAa,GAAA,EAAA,CAAA,aAAA,EACb,iBAAiB,GAAA,EAAA,CAAA,iBAAA;AAET,IAAA,IAAA,CAAC,GAAKA,eAAO,EAAE,EAAd;AACT,IAAA,IAAM,cAAc,GAAGC,mCAAiB,CAAC,gCAAgC,CAAC;IAE1E,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE;AACnC,QAAA,OAAO,IAAI;IACb;AAEA,IAAA,QACEC,eAAA,CAAAC,mBAAA,EAAA,EAAA,QAAA,EAAA,CACED,eAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,oBAAoB,EAAA,QAAA,EAAA,CACjCE,cAAA,CAACC,gBAAK,CAAC,IAAI,EAAA,EACT,OAAO,EAAC,cAAc,EACtB,SAAS,EAAC,wDAAwD,EAAA,QAAA,EAEjE,CAAC,CAAC,sCAAsC,CAAC,GAC/B,EACbD,cAAA,CAAA,OAAA,EAAA,EACE,EAAE,EAAC,cAAc,EACjB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,CAAC,YAAY,IAAI,EAAE,EAC9B,QAAQ,EAAE,UAAC,KAAK,EAAA,EAAK,OAAA,eAAe,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,EAAnC,CAAmC,EACxD,OAAO,EAAE,cAAc,EACvB,MAAM,EAAE,aAAa,EACrB,WAAW,EAAE,CAAC,CAAC,4CAA4C,CAAC,EAC5D,SAAS,EAAE,IAAI,CACb,sJAAsJ,EACtJ,MAAM,CAAC;AACL,8BAAE;AACF,8BAAE,uCAAuC,CAC5C,EACD,YAAY,EAAC,gBAAgB,EAAA,CAC7B,EACD,eAAe,IAAI,kBAAkB,CAAC,MAAM,GAAG,CAAC,KAC/CA,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,uGAAuG,EAAA,QAAA,EACnH,kBAAkB,CAAC,GAAG,CAAC,UAAC,UAAU,EAAA;;4BAAK,QACtCA,cAAA,CAAA,QAAA,EAAA,EAEE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,sDAAsD,EAChE,WAAW,EAAE,UAAC,KAAK,EAAA,EAAK,OAAA,KAAK,CAAC,cAAc,EAAE,CAAA,CAAtB,CAAsB,EAC9C,OAAO,EAAE,YAAA,EAAM,OAAA,iBAAiB,CAAC,UAAU,CAAC,CAAA,CAA7B,CAA6B,YAE5CF,eAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,eAAe,EAAA,QAAA,EAAA,CAC5BE,cAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,uBAAuB,EAAA,QAAA,EACpC,UAAU,CAAC,KAAK,GACZ,EACN,CAAC,UAAU,CAAC,IAAI;AACf,4CAAA,UAAU,CAAC,UAAU;AACrB,4CAAA,UAAU,CAAC,OAAO;4CAClB,UAAU,CAAC,WAAW,MACpBA,cAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,uBAAuB,EAAA,QAAA,EACpC;AACC,gDAAA,CAAC,UAAU,CAAC,UAAU,EAAE,UAAU,CAAC,IAAI;qDACpC,MAAM,CAAC,OAAO;qDACd,IAAI,CAAC,GAAG,CAAC;AACZ,gDAAA,UAAU,CAAC,OAAO;AAClB,qDAAA,CAAA,EAAA,GAAA,UAAU,CAAC,WAAW,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,WAAW,EAAE,CAAA;AACtC;iDACE,MAAM,CAAC,OAAO;AACd,iDAAA,IAAI,CAAC,IAAI,CAAC,EAAA,CACR,CACR,CAAA,EAAA,CACC,EAAA,EA1BD,UAAU,CAAC,EAAE,CA2BX;AACV,wBAAA,CAAA,CAAC,EAAA,CACE,CACP,EACA,MAAM,CAAC,YAAY,KAClBF,eAAA,CAAA,GAAA,EAAA,EAAG,SAAS,EAAC,8CAA8C,EAAA,QAAA,EAAA,CACzDE,yBAAM,SAAS,EAAC,cAAc,EAAA,QAAA,EAAA,QAAA,EAAA,CAAS,EACtC,CAAC,CAAC,+CAA+C,CAAC,CAAA,EAAA,CACjD,CACL,CAAA,EAAA,CACG,EAENF,yBAAK,SAAS,EAAC,WAAW,EAAA,QAAA,EAAA,CACxBE,eAACC,gBAAK,CAAC,IAAI,EAAA,EACT,OAAO,EAAC,cAAc,EACtB,SAAS,EAAC,wDAAwD,EAAA,QAAA,EAEjE,CAAC,CAAC,sCAAsC,CAAC,EAAA,CAC/B,EACbD,0BACE,EAAE,EAAC,cAAc,EACjB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,CAAC,YAAY,IAAI,EAAE,EAC9B,QAAQ,EAAE,UAAC,KAAK,EAAA;4BACd,OAAA,aAAa,CAAC,cAAc,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;AAAjD,wBAAA,CAAiD,EAEnD,WAAW,EAAE,CAAC,CAAC,4CAA4C,CAAC,EAC5D,SAAS,EAAC,oLAAoL,EAC9L,YAAY,EAAC,eAAe,EAAA,CAC5B,CAAA,EAAA,CACE,EAENF,eAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,+EAA+E,EAAA,QAAA,EAAA,CAC5FA,eAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,WAAW,EAAA,QAAA,EAAA,CACxBE,cAAA,CAACC,gBAAK,CAAC,IAAI,EAAA,EACT,OAAO,EAAC,YAAY,EACpB,SAAS,EAAC,wDAAwD,EAAA,QAAA,EAEjE,CAAC,CAAC,oCAAoC,CAAC,EAAA,CAC7B,EACbD,cAAA,CAAA,OAAA,EAAA,EACE,EAAE,EAAC,YAAY,EACf,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,CAAC,UAAU,IAAI,EAAE,EAC5B,QAAQ,EAAE,UAAC,KAAK,EAAA;oCACd,OAAA,aAAa,CAAC,YAAY,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;AAA/C,gCAAA,CAA+C,EAEjD,WAAW,EAAE,CAAC,CAAC,0CAA0C,CAAC,EAC1D,SAAS,EAAE,IAAI,CACb,sJAAsJ,EACtJ,MAAM,CAAC;AACL,sCAAE;sCACA,uCAAuC,CAC5C,EACD,YAAY,EAAC,aAAa,EAAA,CAC1B,EACD,MAAM,CAAC,UAAU,KAChBF,eAAA,CAAA,GAAA,EAAA,EAAG,SAAS,EAAC,8CAA8C,EAAA,QAAA,EAAA,CACzDE,yBAAM,SAAS,EAAC,cAAc,EAAA,QAAA,EAAA,QAAA,EAAA,CAAS,EACtC,CAAC,CAAC,6CAA6C,CAAC,CAAA,EAAA,CAC/C,CACL,CAAA,EAAA,CACG,EAENF,yBAAK,SAAS,EAAC,WAAW,EAAA,QAAA,EAAA,CACxBE,cAAA,CAACC,gBAAK,CAAC,IAAI,EAAA,EACT,OAAO,EAAC,MAAM,EACd,SAAS,EAAC,wDAAwD,EAAA,QAAA,EAEjE,CAAC,CAAC,6BAA6B,CAAC,EAAA,CACtB,EACbD,cAAA,CAAA,OAAA,EAAA,EACE,EAAE,EAAC,MAAM,EACT,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,CAAC,IAAI,IAAI,EAAE,EACtB,QAAQ,EAAE,UAAC,KAAK,EAAA,EAAK,OAAA,aAAa,CAAC,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA,CAAzC,CAAyC,EAC9D,WAAW,EAAE,CAAC,CAAC,mCAAmC,CAAC,EACnD,SAAS,EAAE,IAAI,CACb,sJAAsJ,EACtJ,MAAM,CAAC;AACL,sCAAE;AACF,sCAAE,uCAAuC,CAC5C,EACD,YAAY,EAAC,gBAAgB,EAAA,CAC7B,EACD,MAAM,CAAC,IAAI,KACVF,eAAA,CAAA,GAAA,EAAA,EAAG,SAAS,EAAC,8CAA8C,EAAA,QAAA,EAAA,CACzDE,cAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,cAAc,EAAA,QAAA,EAAA,QAAA,EAAA,CAAS,EACtC,CAAC,CAAC,sCAAsC,CAAC,CAAA,EAAA,CACxC,CACL,CAAA,EAAA,CACG,CAAA,EAAA,CACF,EAENF,eAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,WAAW,EAAA,QAAA,EAAA,CACxBE,cAAA,CAACC,gBAAK,CAAC,IAAI,EAAA,EACT,OAAO,EAAC,SAAS,EACjB,SAAS,EAAC,wDAAwD,EAAA,QAAA,EAEjE,CAAC,CAAC,gCAAgC,CAAC,EAAA,CACzB,EACbD,cAAA,CAACE,sBAAM,EAAA,EACL,OAAO,EAAE,cAAc,EACvB,KAAK,EAAE,IAAI,CAAC,WAAW,IAAI,EAAE,EAC7B,aAAa,EAAE,UAAC,KAAK,EAAA,EAAK,OAAA,aAAa,CAAC,aAAa,EAAE,KAAK,CAAC,CAAA,CAAnC,CAAmC,EAC7D,WAAW,EAAE,CAAC,CAAC,gCAAgC,CAAC,EAChD,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,OAAO,CAAC,EAAA,CAC9B,EACD,MAAM,CAAC,OAAO,KACbJ,eAAA,CAAA,GAAA,EAAA,EAAG,SAAS,EAAC,8CAA8C,EAAA,QAAA,EAAA,CACzDE,cAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,cAAc,EAAA,QAAA,EAAA,QAAA,EAAA,CAAS,EACtC,CAAC,CAAC,yCAAyC,CAAC,CAAA,EAAA,CAC3C,CACL,CAAA,EAAA,CACG,CAAA,EAAA,CACL;AAEP;;;;"}
|
|
@@ -2,13 +2,12 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var tslib_es6 = require('../../../node_modules/tslib/tslib.es6.js');
|
|
6
5
|
var jsxRuntime = require('react/jsx-runtime');
|
|
7
|
-
var React = require('react');
|
|
8
6
|
var Label = require('@radix-ui/react-label');
|
|
9
7
|
var SelectComponent = require('../../ui/SelectComponent.js');
|
|
10
8
|
var userInputForm = require('../../../constants/userInputForm.js');
|
|
11
9
|
var useI18n = require('../../../hooks/useI18n.js');
|
|
10
|
+
var useCountryOptions = require('../../../hooks/useCountryOptions.js');
|
|
12
11
|
|
|
13
12
|
function _interopNamespaceDefault(e) {
|
|
14
13
|
var n = Object.create(null);
|
|
@@ -32,15 +31,7 @@ var Label__namespace = /*#__PURE__*/_interopNamespaceDefault(Label);
|
|
|
32
31
|
var NationalityField = function (_a) {
|
|
33
32
|
var form = _a.form, errors = _a.errors, requestedFields = _a.requestedFields, onFieldChange = _a.onFieldChange;
|
|
34
33
|
var t = useI18n.useI18n().t;
|
|
35
|
-
var countryOptions =
|
|
36
|
-
if (userInputForm.COUNTRY_OPTIONS.length === 0) {
|
|
37
|
-
return userInputForm.COUNTRY_OPTIONS;
|
|
38
|
-
}
|
|
39
|
-
var first = userInputForm.COUNTRY_OPTIONS[0], rest = userInputForm.COUNTRY_OPTIONS.slice(1);
|
|
40
|
-
return tslib_es6.__spreadArray([
|
|
41
|
-
tslib_es6.__assign(tslib_es6.__assign({}, first), { label: t("user_input_form.select.nationality") })
|
|
42
|
-
], rest, true);
|
|
43
|
-
}, [t]);
|
|
34
|
+
var countryOptions = useCountryOptions.useCountryOptions("user_input_form.select.nationality");
|
|
44
35
|
if (!requestedFields.has("nationalite")) {
|
|
45
36
|
return null;
|
|
46
37
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NationalityField.js","sources":["../../../../../../src/components/session/UserInputForm/NationalityField.tsx"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"file":"NationalityField.js","sources":["../../../../../../src/components/session/UserInputForm/NationalityField.tsx"],"sourcesContent":["import * as Label from \"@radix-ui/react-label\";\nimport { Select } from \"../../ui/SelectComponent\";\nimport { FIELD_LABELS } from \"../../../constants/userInputForm\";\nimport type {\n RequestedFields,\n UserInputFormErrors,\n UserInputFormState,\n} from \"../../../types/userInputForm\";\nimport { useI18n } from \"../../../hooks/useI18n\";\nimport { useCountryOptions } from \"../../../hooks/useCountryOptions\";\n\ninterface NationalityFieldProps {\n form: UserInputFormState;\n errors: UserInputFormErrors;\n requestedFields: RequestedFields;\n onFieldChange: (key: keyof UserInputFormState, value: string) => void;\n}\n\nconst NationalityField = ({\n form,\n errors,\n requestedFields,\n onFieldChange,\n}: NationalityFieldProps) => {\n const { t } = useI18n();\n const countryOptions = useCountryOptions(\"user_input_form.select.nationality\");\n\n if (!requestedFields.has(\"nationalite\")) {\n return null;\n }\n\n return (\n <div className=\"space-y-2\">\n <Label.Root\n htmlFor=\"nationality\"\n className=\"block text-sm md:text-base font-semibold text-gray-900\"\n >\n {t(FIELD_LABELS.nationalite)}\n </Label.Root>\n <Select\n options={countryOptions}\n value={form.nationality || \"\"}\n onValueChange={(value) => onFieldChange(\"nationality\", value)}\n placeholder={t(\"user_input_form.select.nationality\")}\n error={Boolean(errors.nationality)}\n />\n {errors.nationality && (\n <p className=\"text-red-600 text-sm flex items-center gap-1\">\n <span className=\"text-red-500\">⚠</span>\n {t(\"user_input_form.errors.nationality_required\")}\n </p>\n )}\n </div>\n );\n};\n\nexport default NationalityField;\n"],"names":["useI18n","useCountryOptions","_jsxs","_jsx","Label","FIELD_LABELS","Select"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,IAAM,gBAAgB,GAAG,UAAC,EAKF,EAAA;QAJtB,IAAI,GAAA,EAAA,CAAA,IAAA,EACJ,MAAM,GAAA,EAAA,CAAA,MAAA,EACN,eAAe,GAAA,EAAA,CAAA,eAAA,EACf,aAAa,GAAA,EAAA,CAAA,aAAA;AAEL,IAAA,IAAA,CAAC,GAAKA,eAAO,EAAE,EAAd;AACT,IAAA,IAAM,cAAc,GAAGC,mCAAiB,CAAC,oCAAoC,CAAC;IAE9E,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,aAAa,CAAC,EAAE;AACvC,QAAA,OAAO,IAAI;IACb;IAEA,QACEC,yBAAK,SAAS,EAAC,WAAW,EAAA,QAAA,EAAA,CACxBC,cAAA,CAACC,gBAAK,CAAC,IAAI,IACT,OAAO,EAAC,aAAa,EACrB,SAAS,EAAC,wDAAwD,EAAA,QAAA,EAEjE,CAAC,CAACC,0BAAY,CAAC,WAAW,CAAC,EAAA,CACjB,EACbF,cAAA,CAACG,sBAAM,IACL,OAAO,EAAE,cAAc,EACvB,KAAK,EAAE,IAAI,CAAC,WAAW,IAAI,EAAE,EAC7B,aAAa,EAAE,UAAC,KAAK,EAAA,EAAK,OAAA,aAAa,CAAC,aAAa,EAAE,KAAK,CAAC,CAAA,CAAnC,CAAmC,EAC7D,WAAW,EAAE,CAAC,CAAC,oCAAoC,CAAC,EACpD,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,WAAW,CAAC,EAAA,CAClC,EACD,MAAM,CAAC,WAAW,KACjBJ,eAAA,CAAA,GAAA,EAAA,EAAG,SAAS,EAAC,8CAA8C,EAAA,QAAA,EAAA,CACzDC,cAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,cAAc,EAAA,QAAA,EAAA,QAAA,EAAA,CAAS,EACtC,CAAC,CAAC,6CAA6C,CAAC,CAAA,EAAA,CAC/C,CACL,CAAA,EAAA,CACG;AAEV;;;;"}
|
|
@@ -2,11 +2,13 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
var tslib_es6 = require('../../node_modules/tslib/tslib.es6.js');
|
|
5
6
|
var jsxRuntime = require('react/jsx-runtime');
|
|
6
7
|
var useIsMobile = require('../../hooks/useIsMobile.js');
|
|
7
8
|
|
|
8
9
|
var Button = function (_a) {
|
|
9
|
-
var _b
|
|
10
|
+
var _b, _c;
|
|
11
|
+
var _d = _a.variant, variant = _d === void 0 ? "primary" : _d, children = _a.children, _e = _a.className, className = _e === void 0 ? "" : _e, style = _a.style, onClick = _a.onClick, _f = _a.disabled, disabled = _f === void 0 ? false : _f, _g = _a.type, type = _g === void 0 ? "button" : _g;
|
|
10
12
|
var isMobile = useIsMobile.default(768);
|
|
11
13
|
var baseShared = "flex items-center justify-center gap-2 shrink-0 font-poppins text-sm font-medium leading-[110%] transition-filter";
|
|
12
14
|
var base = isMobile
|
|
@@ -20,8 +22,8 @@ var Button = function (_a) {
|
|
|
20
22
|
return (jsxRuntime.jsx("button", { type: type, className: "".concat(base, " ").concat(disabled
|
|
21
23
|
? "bg-gray-200 text-gray-400 cursor-not-allowed opacity-60"
|
|
22
24
|
: "hover:brightness-110 active:brightness-90 cursor-pointer", " ").concat(className), style: disabled
|
|
23
|
-
?
|
|
24
|
-
: { backgroundColor: "var(--dk-btn-bg)", color: "var(--dk-btn-text)" }, onClick: onClick, disabled: disabled, children: children }));
|
|
25
|
+
? style
|
|
26
|
+
: tslib_es6.__assign(tslib_es6.__assign({}, style), { backgroundColor: (_b = style === null || style === void 0 ? void 0 : style.backgroundColor) !== null && _b !== void 0 ? _b : "var(--dk-btn-bg)", color: (_c = style === null || style === void 0 ? void 0 : style.color) !== null && _c !== void 0 ? _c : "var(--dk-btn-text)" }), onClick: onClick, disabled: disabled, children: children }));
|
|
25
27
|
};
|
|
26
28
|
|
|
27
29
|
exports.default = Button;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sources":["../../../../../src/components/ui/Button.tsx"],"sourcesContent":["/**\n * Button component - Unified adaptive button\n *\n * Adapts automatically between mobile and desktop using useIsMobile hook\n * rather than CSS responsive classes, for build compatibility.\n *\n * - Mobile: full width, tall (h-[48px], rounded-[12px])\n * - Desktop: auto width, comfortable (h-10, px-8, min-w-[140px])\n *\n * @param variant - \"primary\" (filled, default) | \"secondary\" (outlined)\n */\nimport useIsMobile from \"../../hooks/useIsMobile\";\n\ninterface ButtonProps {\n variant?: \"primary\" | \"secondary\";\n children: React.ReactNode;\n className?: string;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n disabled?: boolean;\n type?: \"button\" | \"submit\" | \"reset\";\n}\n\nconst Button = ({\n variant = \"primary\",\n children,\n className = \"\",\n onClick,\n disabled = false,\n type = \"button\",\n}: ButtonProps) => {\n const isMobile = useIsMobile(768);\n\n const baseShared = \"flex items-center justify-center gap-2 shrink-0 font-poppins text-sm font-medium leading-[110%] transition-filter\";\n const base = isMobile\n ? `${baseShared} w-full h-[48px] rounded-[12px]`\n : `${baseShared} h-10 rounded-md px-8 min-w-[140px]`;\n\n if (variant === \"secondary\") {\n return (\n <button\n type={type}\n className={`${base} bg-transparent border border-gray-300 text-gray-600 ${\n disabled\n ? \"opacity-60 cursor-not-allowed\"\n : \"hover:bg-black/5 cursor-pointer\"\n } ${className}`}\n onClick={onClick}\n disabled={disabled}\n >\n {children}\n </button>\n );\n }\n\n return (\n <button\n type={type}\n className={`${base} ${\n disabled\n ? \"bg-gray-200 text-gray-400 cursor-not-allowed opacity-60\"\n : \"hover:brightness-110 active:brightness-90 cursor-pointer\"\n } ${className}`}\n style={\n disabled\n ?
|
|
1
|
+
{"version":3,"file":"Button.js","sources":["../../../../../src/components/ui/Button.tsx"],"sourcesContent":["/**\n * Button component - Unified adaptive button\n *\n * Adapts automatically between mobile and desktop using useIsMobile hook\n * rather than CSS responsive classes, for build compatibility.\n *\n * - Mobile: full width, tall (h-[48px], rounded-[12px])\n * - Desktop: auto width, comfortable (h-10, px-8, min-w-[140px])\n *\n * @param variant - \"primary\" (filled, default) | \"secondary\" (outlined)\n */\nimport useIsMobile from \"../../hooks/useIsMobile\";\n\ninterface ButtonProps {\n variant?: \"primary\" | \"secondary\";\n children: React.ReactNode;\n className?: string;\n style?: React.CSSProperties;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n disabled?: boolean;\n type?: \"button\" | \"submit\" | \"reset\";\n}\n\nconst Button = ({\n variant = \"primary\",\n children,\n className = \"\",\n style,\n onClick,\n disabled = false,\n type = \"button\",\n}: ButtonProps) => {\n const isMobile = useIsMobile(768);\n\n const baseShared = \"flex items-center justify-center gap-2 shrink-0 font-poppins text-sm font-medium leading-[110%] transition-filter\";\n const base = isMobile\n ? `${baseShared} w-full h-[48px] rounded-[12px]`\n : `${baseShared} h-10 rounded-md px-8 min-w-[140px]`;\n\n if (variant === \"secondary\") {\n return (\n <button\n type={type}\n className={`${base} bg-transparent border border-gray-300 text-gray-600 ${\n disabled\n ? \"opacity-60 cursor-not-allowed\"\n : \"hover:bg-black/5 cursor-pointer\"\n } ${className}`}\n onClick={onClick}\n disabled={disabled}\n >\n {children}\n </button>\n );\n }\n\n return (\n <button\n type={type}\n className={`${base} ${\n disabled\n ? \"bg-gray-200 text-gray-400 cursor-not-allowed opacity-60\"\n : \"hover:brightness-110 active:brightness-90 cursor-pointer\"\n } ${className}`}\n style={\n disabled\n ? style\n : { ...style, backgroundColor: style?.backgroundColor ?? \"var(--dk-btn-bg)\", color: style?.color ?? \"var(--dk-btn-text)\" }\n }\n onClick={onClick}\n disabled={disabled}\n >\n {children}\n </button>\n );\n};\n\nexport default Button;\n"],"names":["useIsMobile","_jsx"],"mappings":";;;;;;;;AAuBA,IAAM,MAAM,GAAG,UAAC,EAQF,EAAA;;AAPZ,IAAA,IAAA,EAAA,GAAA,EAAA,CAAA,OAAmB,EAAnB,OAAO,GAAA,EAAA,KAAA,MAAA,GAAG,SAAS,KAAA,EACnB,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,iBAAc,EAAd,SAAS,GAAA,EAAA,KAAA,MAAA,GAAG,EAAE,KAAA,EACd,KAAK,GAAA,EAAA,CAAA,KAAA,EACL,OAAO,GAAA,EAAA,CAAA,OAAA,EACP,EAAA,GAAA,EAAA,CAAA,QAAgB,EAAhB,QAAQ,GAAA,EAAA,KAAA,MAAA,GAAG,KAAK,GAAA,EAAA,EAChB,EAAA,GAAA,EAAA,CAAA,IAAe,EAAf,IAAI,GAAA,EAAA,KAAA,MAAA,GAAG,QAAQ,GAAA,EAAA;AAEf,IAAA,IAAM,QAAQ,GAAGA,mBAAW,CAAC,GAAG,CAAC;IAEjC,IAAM,UAAU,GAAG,mHAAmH;IACtI,IAAM,IAAI,GAAG;UACT,EAAA,CAAA,MAAA,CAAG,UAAU,EAAA,iCAAA;AACf,UAAE,EAAA,CAAA,MAAA,CAAG,UAAU,EAAA,qCAAA,CAAqC;AAEtD,IAAA,IAAI,OAAO,KAAK,WAAW,EAAE;QAC3B,QACEC,cAAA,CAAA,QAAA,EAAA,EACE,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,EAAA,CAAA,MAAA,CAAG,IAAI,EAAA,uDAAA,CAAA,CAAA,MAAA,CAChB;AACE,kBAAE;AACF,kBAAE,iCAAiC,EAAA,GAAA,CAAA,CAAA,MAAA,CACnC,SAAS,CAAE,EACf,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,YAEjB,QAAQ,EAAA,CACF;IAEb;IAEA,QACEA,cAAA,CAAA,QAAA,EAAA,EACE,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,EAAA,CAAA,MAAA,CAAG,IAAI,EAAA,GAAA,CAAA,CAAA,MAAA,CAChB;AACE,cAAE;cACA,0DAA0D,EAAA,GAAA,CAAA,CAAA,MAAA,CAC5D,SAAS,CAAE,EACf,KAAK,EACH;AACE,cAAE;AACF,wDAAO,KAAK,CAAA,EAAA,EAAE,eAAe,EAAE,CAAA,EAAA,GAAA,KAAK,KAAA,IAAA,IAAL,KAAK,KAAA,MAAA,GAAA,MAAA,GAAL,KAAK,CAAE,eAAe,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,kBAAkB,EAAE,KAAK,EAAE,CAAA,EAAA,GAAA,KAAK,KAAA,IAAA,IAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,oBAAoB,GAAE,EAE9H,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,YAEjB,QAAQ,EAAA,CACF;AAEb;;;;"}
|
|
@@ -29,30 +29,6 @@ var YEAR_OPTIONS = years.map(function (value) { return ({
|
|
|
29
29
|
value: String(value),
|
|
30
30
|
label: String(value),
|
|
31
31
|
}); });
|
|
32
|
-
var COUNTRY_OPTIONS = [
|
|
33
|
-
{ value: "", label: "Sélectionnez un pays" },
|
|
34
|
-
{ value: "FR", label: "France" },
|
|
35
|
-
{ value: "BE", label: "Belgique" },
|
|
36
|
-
{ value: "CH", label: "Suisse" },
|
|
37
|
-
{ value: "DE", label: "Allemagne" },
|
|
38
|
-
{ value: "ES", label: "Espagne" },
|
|
39
|
-
{ value: "IT", label: "Italie" },
|
|
40
|
-
{ value: "PT", label: "Portugal" },
|
|
41
|
-
{ value: "GB", label: "Royaume-Uni" },
|
|
42
|
-
{ value: "IE", label: "Irlande" },
|
|
43
|
-
{ value: "NL", label: "Pays-Bas" },
|
|
44
|
-
{ value: "US", label: "États-Unis" },
|
|
45
|
-
{ value: "CA", label: "Canada" },
|
|
46
|
-
{ value: "MX", label: "Mexique" },
|
|
47
|
-
{ value: "AU", label: "Australie" },
|
|
48
|
-
{ value: "BR", label: "Brésil" },
|
|
49
|
-
{ value: "MA", label: "Maroc" },
|
|
50
|
-
{ value: "DZ", label: "Algérie" },
|
|
51
|
-
{ value: "TN", label: "Tunisie" },
|
|
52
|
-
{ value: "JP", label: "Japon" },
|
|
53
|
-
{ value: "CN", label: "Chine" },
|
|
54
|
-
{ value: "IN", label: "Inde" },
|
|
55
|
-
];
|
|
56
32
|
var ADDRESS_SUGGESTIONS = [
|
|
57
33
|
"10 Rue de Rivoli, 75001 Paris, France",
|
|
58
34
|
"221B Baker Street, NW1 6XE Londres, Royaume-Uni",
|
|
@@ -93,7 +69,6 @@ var FALLBACK_ADDRESS_SUGGESTIONS = ADDRESS_SUGGESTIONS.map(function (label, inde
|
|
|
93
69
|
}); });
|
|
94
70
|
|
|
95
71
|
exports.ADDRESS_SUGGESTIONS = ADDRESS_SUGGESTIONS;
|
|
96
|
-
exports.COUNTRY_OPTIONS = COUNTRY_OPTIONS;
|
|
97
72
|
exports.DAY_OPTIONS = DAY_OPTIONS;
|
|
98
73
|
exports.DEFAULT_FIELDS = DEFAULT_FIELDS;
|
|
99
74
|
exports.FALLBACK_ADDRESS_SUGGESTIONS = FALLBACK_ADDRESS_SUGGESTIONS;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"userInputForm.js","sources":["../../../../src/constants/userInputForm.ts"],"sourcesContent":["import type {\n AddressSuggestion,\n InformationType,\n RequestedFieldKey,\n SelectOption,\n} from \"../types/userInputForm\";\n\nconst days = Array.from({ length: 31 }, (_, index) => index + 1);\nconst currentYear = new Date().getFullYear();\nconst years = Array.from({ length: 120 }, (_, index) => currentYear - index);\n\nconst monthLabels = [\n \"Janvier\",\n \"Février\",\n \"Mars\",\n \"Avril\",\n \"Mai\",\n \"Juin\",\n \"Juillet\",\n \"Août\",\n \"Septembre\",\n \"Octobre\",\n \"Novembre\",\n \"Décembre\",\n];\n\nexport const DAY_OPTIONS: SelectOption[] = days.map((value) => ({\n value: String(value).padStart(2, \"0\"),\n label: String(value).padStart(2, \"0\"),\n}));\n\nexport const MONTH_OPTIONS: SelectOption[] = monthLabels.map(\n (label, index) => ({\n value: String(index + 1).padStart(2, \"0\"),\n label,\n })\n);\n\nexport const YEAR_OPTIONS: SelectOption[] = years.map((value) => ({\n value: String(value),\n label: String(value),\n}));\n\
|
|
1
|
+
{"version":3,"file":"userInputForm.js","sources":["../../../../src/constants/userInputForm.ts"],"sourcesContent":["import type {\n AddressSuggestion,\n InformationType,\n RequestedFieldKey,\n SelectOption,\n} from \"../types/userInputForm\";\n\nconst days = Array.from({ length: 31 }, (_, index) => index + 1);\nconst currentYear = new Date().getFullYear();\nconst years = Array.from({ length: 120 }, (_, index) => currentYear - index);\n\nconst monthLabels = [\n \"Janvier\",\n \"Février\",\n \"Mars\",\n \"Avril\",\n \"Mai\",\n \"Juin\",\n \"Juillet\",\n \"Août\",\n \"Septembre\",\n \"Octobre\",\n \"Novembre\",\n \"Décembre\",\n];\n\nexport const DAY_OPTIONS: SelectOption[] = days.map((value) => ({\n value: String(value).padStart(2, \"0\"),\n label: String(value).padStart(2, \"0\"),\n}));\n\nexport const MONTH_OPTIONS: SelectOption[] = monthLabels.map(\n (label, index) => ({\n value: String(index + 1).padStart(2, \"0\"),\n label,\n })\n);\n\nexport const YEAR_OPTIONS: SelectOption[] = years.map((value) => ({\n value: String(value),\n label: String(value),\n}));\n\n\nexport const ADDRESS_SUGGESTIONS: string[] = [\n \"10 Rue de Rivoli, 75001 Paris, France\",\n \"221B Baker Street, NW1 6XE Londres, Royaume-Uni\",\n \"1600 Amphitheatre Parkway, 94043 Mountain View, États-Unis\",\n \"55 Rue du Faubourg Saint-Honoré, 75008 Paris, France\",\n \"1 Place du Commerce, 44000 Nantes, France\",\n \"Piazza del Colosseo 1, 00184 Rome, Italie\",\n \"Av. Paulista 1578, 01310-200 São Paulo, Brésil\",\n];\n\nexport const DEFAULT_FIELDS: Record<InformationType, RequestedFieldKey[]> = {\n identity: [\"nom\", \"prenom\", \"date_naissance\"],\n \"identity-legal\": [\"nom\", \"siret\", \"tva\", \"adresse\"],\n contact: [\"email\", \"sms\"],\n address: [\"adresse\"],\n nationality: [\"nationalite\"],\n custom: [], // Custom forms use customFields instead\n};\n\nexport const FIELD_LABELS: Record<RequestedFieldKey, string> = {\n nom: \"user_input_form.fields.last_name\",\n prenom: \"user_input_form.fields.first_name\",\n date_naissance: \"user_input_form.fields.birth_date\",\n email: \"user_input_form.fields.email\",\n sms: \"user_input_form.fields.phone\",\n adresse: \"user_input_form.fields.address_line1\",\n nationalite: \"user_input_form.fields.nationality\",\n company: \"user_input_form.fields.company_name\",\n siret: \"user_input_form.fields.siret\",\n tva: \"user_input_form.fields.vat_number\",\n};\n\n// Backend endpoint pour l'autocomplétion d'adresses (sécurisé)\nexport const GEOCODING_AUTOCOMPLETE_ENDPOINT = \"/geocoding/autocomplete\";\n\nexport const FALLBACK_ADDRESS_SUGGESTIONS: AddressSuggestion[] =\n ADDRESS_SUGGESTIONS.map((label, index) => ({\n id: `fallback-${index}`,\n label,\n addressLine1: label,\n postalCode: \"\",\n city: \"\",\n country: \"\",\n }));\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var tslib_es6 = require('../node_modules/tslib/tslib.es6.js');
|
|
4
|
+
var React = require('react');
|
|
5
|
+
var country_iso2_fr = require('../i18n/country/country.iso2.fr.json.js');
|
|
6
|
+
var useI18n = require('./useI18n.js');
|
|
7
|
+
|
|
8
|
+
var ISO_CODES = Object.keys(country_iso2_fr.default);
|
|
9
|
+
var useCountryOptions = function (placeholderKey) {
|
|
10
|
+
var _a = useI18n.useI18n(), t = _a.t, currentLanguage = _a.currentLanguage;
|
|
11
|
+
return React.useMemo(function () {
|
|
12
|
+
var countries = ISO_CODES.filter(function (code) { return code !== "EU"; })
|
|
13
|
+
.map(function (code) { return ({ value: code, label: t(code) }); })
|
|
14
|
+
.sort(function (a, b) { return a.label.localeCompare(b.label, currentLanguage); });
|
|
15
|
+
return tslib_es6.__spreadArray([{ value: "", label: t(placeholderKey) }], countries, true);
|
|
16
|
+
}, [t, currentLanguage, placeholderKey]);
|
|
17
|
+
};
|
|
18
|
+
|
|
19
|
+
exports.useCountryOptions = useCountryOptions;
|
|
20
|
+
//# sourceMappingURL=useCountryOptions.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useCountryOptions.js","sources":["../../../../src/hooks/useCountryOptions.ts"],"sourcesContent":["import { useMemo } from \"react\";\nimport countryISO from \"../i18n/country/country.iso2.fr.json\";\nimport { useI18n } from \"./useI18n\";\nimport type { SelectOption } from \"../types/userInputForm\";\n\nconst ISO_CODES = Object.keys(countryISO);\n\nexport const useCountryOptions = (placeholderKey: string): SelectOption[] => {\n const { t, currentLanguage } = useI18n();\n\n return useMemo(() => {\n const countries = ISO_CODES.filter((code) => code !== \"EU\")\n .map((code) => ({ value: code, label: t(code) }))\n .sort((a, b) => a.label.localeCompare(b.label, currentLanguage));\n\n return [{ value: \"\", label: t(placeholderKey) }, ...countries];\n }, [t, currentLanguage, placeholderKey]);\n};\n"],"names":["countryISO","useI18n","useMemo","__spreadArray"],"mappings":";;;;;;;AAKA,IAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAACA,uBAAU,CAAC;AAElC,IAAM,iBAAiB,GAAG,UAAC,cAAsB,EAAA;IAChD,IAAA,EAAA,GAAyBC,eAAO,EAAE,EAAhC,CAAC,GAAA,EAAA,CAAA,CAAA,EAAE,eAAe,GAAA,EAAA,CAAA,eAAc;AAExC,IAAA,OAAOC,aAAO,CAAC,YAAA;AACb,QAAA,IAAM,SAAS,GAAG,SAAS,CAAC,MAAM,CAAC,UAAC,IAAI,EAAA,EAAK,OAAA,IAAI,KAAK,IAAI,CAAA,CAAb,CAAa;aACvD,GAAG,CAAC,UAAC,IAAI,EAAA,EAAK,QAAC,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,CAAC,IAAI,CAAC,EAAE,EAAC,CAAjC,CAAiC;aAC/C,IAAI,CAAC,UAAC,CAAC,EAAE,CAAC,EAAA,EAAK,OAAA,CAAC,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,EAAE,eAAe,CAAC,CAAA,CAA/C,CAA+C,CAAC;AAElE,QAAA,OAAAC,uBAAA,CAAA,CAAQ,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,cAAc,CAAC,EAAE,CAAA,EAAK,SAAS,EAAA,IAAA,CAAA;IAC/D,CAAC,EAAE,CAAC,CAAC,EAAE,eAAe,EAAE,cAAc,CAAC,CAAC;AAC1C;;;;"}
|
|
@@ -178,7 +178,7 @@ var YE = "Yémen";
|
|
|
178
178
|
var ZM = "Zambie";
|
|
179
179
|
var ZW = "Zimbabwe";
|
|
180
180
|
var EU = "Europe (UE)";
|
|
181
|
-
var
|
|
181
|
+
var countryISO = {
|
|
182
182
|
AF: AF,
|
|
183
183
|
ZA: ZA,
|
|
184
184
|
AL: AL,
|
|
@@ -533,5 +533,5 @@ exports.YE = YE;
|
|
|
533
533
|
exports.ZA = ZA;
|
|
534
534
|
exports.ZM = ZM;
|
|
535
535
|
exports.ZW = ZW;
|
|
536
|
-
exports.default =
|
|
536
|
+
exports.default = countryISO;
|
|
537
537
|
//# sourceMappingURL=country.iso2.fr.json.js.map
|
|
@@ -88,7 +88,7 @@ var getDocumentTemplateId = function (params) {
|
|
|
88
88
|
var normalizedCountry = countryCode === null || countryCode === void 0 ? void 0 : countryCode.toUpperCase();
|
|
89
89
|
var resolvedType = resolveDocumentType(documentId);
|
|
90
90
|
var documents = (_a = acceptedCountries === null || acceptedCountries === void 0 ? void 0 : acceptedCountries.find(function (country) { var _a; return ((_a = country.code) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === normalizedCountry; })) === null || _a === void 0 ? void 0 : _a.documents;
|
|
91
|
-
if (resolvedType && ((_b = documents === null || documents === void 0 ? void 0 : documents[resolvedType]) === null || _b === void 0 ? void 0 : _b.length) && (documents === null || documents === void 0 ? void 0 : documents[resolvedType][0]) != "INT") {
|
|
91
|
+
if (resolvedType && ((_b = documents === null || documents === void 0 ? void 0 : documents[resolvedType]) === null || _b === void 0 ? void 0 : _b.length) && (documents === null || documents === void 0 ? void 0 : documents[resolvedType][0]) != "INT" && (documents === null || documents === void 0 ? void 0 : documents[resolvedType][0]) != "EU") {
|
|
92
92
|
// Special case for France pink driving license (1989 format)
|
|
93
93
|
var docName = (_d = (_c = documentTemplates === null || documentTemplates === void 0 ? void 0 : documentTemplates.data) === null || _c === void 0 ? void 0 : _c.find(function (tpl) { return tpl.id === documents[resolvedType][0]; })) === null || _d === void 0 ? void 0 : _d.name;
|
|
94
94
|
if (normalizedCountry === "FR" && resolvedType === "driverLicense" && docName === "france_driving_license_1989" && documents[resolvedType][1]) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"documentTemplate.js","sources":["../../../../src/services/documentTemplate.ts"],"sourcesContent":["import { apiService } from \"./api\";\nimport type { AcceptedCountry } from \"../types/session\";\n\nexport interface DocumentTemplate {\n id: string;\n name: string;\n countryCode: string;\n acceptedFormats: string[];\n maxFiles: number;\n minFiles: number;\n maxPages: number;\n maxSize: number;\n sides: string;\n}\n\nexport interface FetchedDocumentTemplates {\n status: number;\n message: string;\n data: DocumentTemplate[];\n}\n\nconst DOCUMENT_ID_TO_TYPE: Record<string, keyof AcceptedCountry[\"documents\"]> = {\n passport: \"passport\",\n \"jdi-3\": \"passport\",\n idcard: \"idCard\",\n idCard: \"idCard\",\n \"jdi-2\": \"idCard\",\n driverlicense: \"driverLicense\",\n driverLicense: \"driverLicense\",\n \"jdi-4\": \"driverLicense\",\n residencepermit: \"residencePermit\",\n residencePermit: \"residencePermit\",\n \"jdi-5\": \"residencePermit\",\n pinkdriverlicense: \"pinkDriverLicense\",\n pinkDriverLicense: \"pinkDriverLicense\",\n};\n\n\n/**\n * Retrieves the document type key for API requests based on the document type.\n * \n * @param docType - The document type from the AcceptedCountry documents\n * @returns The corresponding document type key string used in API requests\n * \n * @example\n * ```typescript\n * getDocTypeKey('passport') // returns 'passport'\n * getDocTypeKey('idCard') // returns 'id_card'\n * getDocTypeKey('driverLicense') // returns 'driving_license'\n * ```\n */\nexport const getDocTypeKey = (docType: keyof AcceptedCountry[\"documents\"]): string => {\n switch (docType) {\n case \"passport\":\n return \"passport\";\n case \"idCard\":\n return \"id_card\";\n case \"residencePermit\":\n return \"residency_permit\";\n case \"driverLicense\":\n return \"driving_license\";\n case \"pinkDriverLicense\":\n return \"driving_license_1989\";\n default:\n return String(docType).toLowerCase();\n }\n};\n\n\n\n/**\n * Resolves a document ID string to its corresponding document type.\n * Performs case-insensitive matching against the DOCUMENT_ID_TO_TYPE mapping.\n * \n * @param documentId - The document identifier to resolve\n * @returns The resolved document type or undefined if no match is found\n * \n * @internal\n */\nconst resolveDocumentType = (documentId: string): keyof AcceptedCountry[\"documents\"] | undefined => {\n return DOCUMENT_ID_TO_TYPE[documentId] ?? DOCUMENT_ID_TO_TYPE[documentId.toLowerCase()];\n};\n\n\n/**\n * Retrieves the document template ID for a specific country and document type.\n * First attempts to find the template ID from acceptedCountries data.\n * If not found, falls back to searching through documentTemplates by matching country code and template name.\n * \n * @param params - Configuration object\n * @param params.countryCode - The ISO country code (case-insensitive)\n * @param params.documentId - The document type identifier\n * @param params.acceptedCountries - Optional array of accepted countries with their document configurations\n * @param params.documentTemplates - Optional fetched document templates to search through\n * @returns The document template ID if found, otherwise undefined\n * \n * @example\n * ```typescript\n * const templateId = getDocumentTemplateId({\n * countryCode: 'FR',\n * documentId: 'passport',\n * acceptedCountries: countries,\n * documentTemplates: templates\n * });\n * ```\n */\nexport const getDocumentTemplateId = (params: {\n countryCode: string;\n documentId: string;\n acceptedCountries?: AcceptedCountry[];\n documentTemplates?: FetchedDocumentTemplates;\n}): string | undefined => {\n const { countryCode, documentId, acceptedCountries, documentTemplates } = params;\n const normalizedCountry = countryCode?.toUpperCase();\n const resolvedType = resolveDocumentType(documentId);\n\n const documents = acceptedCountries?.find(\n (country) => country.code?.toUpperCase() === normalizedCountry\n )?.documents;\n\n if (resolvedType && documents?.[resolvedType]?.length && documents?.[resolvedType][0] != \"INT\") {\n // Special case for France pink driving license (1989 format)\n const docName = documentTemplates?.data?.find(tpl => tpl.id === documents[resolvedType][0])?.name;\n if (normalizedCountry === \"FR\" && resolvedType === \"driverLicense\" && docName === \"france_driving_license_1989\" && documents[resolvedType][1]) {\n return documents[resolvedType][1];\n }\n return documents[resolvedType][0];\n }\n\n if (!resolvedType) {\n return undefined;\n }\n\n const templateKey = getDocTypeKey(resolvedType).toLowerCase();\n const matchedTemplate = documentTemplates?.data?.findLast((tpl) => {\n return (\n tpl.countryCode === normalizedCountry &&\n (tpl.name?.toLowerCase() || \"\").includes(templateKey)\n );\n });\n\n return matchedTemplate?.id;\n};\n\n\n/**\n * Fetches all document templates from the API with optional filtering.\n * \n * @param params - Optional configuration object for filtering results\n * @param params.type - Filter templates by document type\n * @param params.tags - Filter templates by tags array\n * @returns Promise resolving to fetched document templates data\n * @throws {Error} Throws an error if the API request fails\n * \n * @example\n * ```typescript\n * // Fetch all templates\n * const allTemplates = await getAllDocumentTemplates();\n * \n * // Fetch templates with filters\n * const filteredTemplates = await getAllDocumentTemplates({\n * type: 'proof_of_identity',\n * tags: ['biometric', 'eu']\n * });\n * ```\n */\nexport const getAllDocumentTemplates = async (params?: {\n type?: string;\n tags?: string[];\n}): Promise<FetchedDocumentTemplates> => {\n const query = new URLSearchParams();\n if (params?.type) query.append(\"type\", params.type);\n if (params?.tags && params.tags.length > 0) {\n params.tags.forEach((tag) => query.append(\"tags\", tag));\n }\n\n const url = \"document/get-all-document-templates\";\n const response = await apiService.get<FetchedDocumentTemplates>(\n `${url}?${query.toString()}`\n );\n if (!response.success) {\n throw new Error(\"Failed to fetch document templates\");\n }\n return response.data;\n};\n"],"names":["__awaiter","apiService"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"documentTemplate.js","sources":["../../../../src/services/documentTemplate.ts"],"sourcesContent":["import { apiService } from \"./api\";\nimport type { AcceptedCountry } from \"../types/session\";\n\nexport interface DocumentTemplate {\n id: string;\n name: string;\n countryCode: string;\n acceptedFormats: string[];\n maxFiles: number;\n minFiles: number;\n maxPages: number;\n maxSize: number;\n sides: string;\n}\n\nexport interface FetchedDocumentTemplates {\n status: number;\n message: string;\n data: DocumentTemplate[];\n}\n\nconst DOCUMENT_ID_TO_TYPE: Record<string, keyof AcceptedCountry[\"documents\"]> = {\n passport: \"passport\",\n \"jdi-3\": \"passport\",\n idcard: \"idCard\",\n idCard: \"idCard\",\n \"jdi-2\": \"idCard\",\n driverlicense: \"driverLicense\",\n driverLicense: \"driverLicense\",\n \"jdi-4\": \"driverLicense\",\n residencepermit: \"residencePermit\",\n residencePermit: \"residencePermit\",\n \"jdi-5\": \"residencePermit\",\n pinkdriverlicense: \"pinkDriverLicense\",\n pinkDriverLicense: \"pinkDriverLicense\",\n};\n\n\n/**\n * Retrieves the document type key for API requests based on the document type.\n * \n * @param docType - The document type from the AcceptedCountry documents\n * @returns The corresponding document type key string used in API requests\n * \n * @example\n * ```typescript\n * getDocTypeKey('passport') // returns 'passport'\n * getDocTypeKey('idCard') // returns 'id_card'\n * getDocTypeKey('driverLicense') // returns 'driving_license'\n * ```\n */\nexport const getDocTypeKey = (docType: keyof AcceptedCountry[\"documents\"]): string => {\n switch (docType) {\n case \"passport\":\n return \"passport\";\n case \"idCard\":\n return \"id_card\";\n case \"residencePermit\":\n return \"residency_permit\";\n case \"driverLicense\":\n return \"driving_license\";\n case \"pinkDriverLicense\":\n return \"driving_license_1989\";\n default:\n return String(docType).toLowerCase();\n }\n};\n\n\n\n/**\n * Resolves a document ID string to its corresponding document type.\n * Performs case-insensitive matching against the DOCUMENT_ID_TO_TYPE mapping.\n * \n * @param documentId - The document identifier to resolve\n * @returns The resolved document type or undefined if no match is found\n * \n * @internal\n */\nconst resolveDocumentType = (documentId: string): keyof AcceptedCountry[\"documents\"] | undefined => {\n return DOCUMENT_ID_TO_TYPE[documentId] ?? DOCUMENT_ID_TO_TYPE[documentId.toLowerCase()];\n};\n\n\n/**\n * Retrieves the document template ID for a specific country and document type.\n * First attempts to find the template ID from acceptedCountries data.\n * If not found, falls back to searching through documentTemplates by matching country code and template name.\n * \n * @param params - Configuration object\n * @param params.countryCode - The ISO country code (case-insensitive)\n * @param params.documentId - The document type identifier\n * @param params.acceptedCountries - Optional array of accepted countries with their document configurations\n * @param params.documentTemplates - Optional fetched document templates to search through\n * @returns The document template ID if found, otherwise undefined\n * \n * @example\n * ```typescript\n * const templateId = getDocumentTemplateId({\n * countryCode: 'FR',\n * documentId: 'passport',\n * acceptedCountries: countries,\n * documentTemplates: templates\n * });\n * ```\n */\nexport const getDocumentTemplateId = (params: {\n countryCode: string;\n documentId: string;\n acceptedCountries?: AcceptedCountry[];\n documentTemplates?: FetchedDocumentTemplates;\n}): string | undefined => {\n const { countryCode, documentId, acceptedCountries, documentTemplates } = params;\n const normalizedCountry = countryCode?.toUpperCase();\n const resolvedType = resolveDocumentType(documentId);\n\n const documents = acceptedCountries?.find(\n (country) => country.code?.toUpperCase() === normalizedCountry\n )?.documents;\n\n if (resolvedType && documents?.[resolvedType]?.length && documents?.[resolvedType][0] != \"INT\" && documents?.[resolvedType][0] != \"EU\") {\n // Special case for France pink driving license (1989 format)\n const docName = documentTemplates?.data?.find(tpl => tpl.id === documents[resolvedType][0])?.name;\n if (normalizedCountry === \"FR\" && resolvedType === \"driverLicense\" && docName === \"france_driving_license_1989\" && documents[resolvedType][1]) {\n return documents[resolvedType][1];\n }\n return documents[resolvedType][0];\n }\n\n if (!resolvedType) {\n return undefined;\n }\n\n const templateKey = getDocTypeKey(resolvedType).toLowerCase();\n const matchedTemplate = documentTemplates?.data?.findLast((tpl) => {\n return (\n tpl.countryCode === normalizedCountry &&\n (tpl.name?.toLowerCase() || \"\").includes(templateKey)\n );\n });\n\n return matchedTemplate?.id;\n};\n\n\n/**\n * Fetches all document templates from the API with optional filtering.\n * \n * @param params - Optional configuration object for filtering results\n * @param params.type - Filter templates by document type\n * @param params.tags - Filter templates by tags array\n * @returns Promise resolving to fetched document templates data\n * @throws {Error} Throws an error if the API request fails\n * \n * @example\n * ```typescript\n * // Fetch all templates\n * const allTemplates = await getAllDocumentTemplates();\n * \n * // Fetch templates with filters\n * const filteredTemplates = await getAllDocumentTemplates({\n * type: 'proof_of_identity',\n * tags: ['biometric', 'eu']\n * });\n * ```\n */\nexport const getAllDocumentTemplates = async (params?: {\n type?: string;\n tags?: string[];\n}): Promise<FetchedDocumentTemplates> => {\n const query = new URLSearchParams();\n if (params?.type) query.append(\"type\", params.type);\n if (params?.tags && params.tags.length > 0) {\n params.tags.forEach((tag) => query.append(\"tags\", tag));\n }\n\n const url = \"document/get-all-document-templates\";\n const response = await apiService.get<FetchedDocumentTemplates>(\n `${url}?${query.toString()}`\n );\n if (!response.success) {\n throw new Error(\"Failed to fetch document templates\");\n }\n return response.data;\n};\n"],"names":["__awaiter","apiService"],"mappings":";;;;;AAqBA,IAAM,mBAAmB,GAAuD;AAC9E,IAAA,QAAQ,EAAE,UAAU;AACpB,IAAA,OAAO,EAAE,UAAU;AACnB,IAAA,MAAM,EAAE,QAAQ;AAChB,IAAA,MAAM,EAAE,QAAQ;AAChB,IAAA,OAAO,EAAE,QAAQ;AACjB,IAAA,aAAa,EAAE,eAAe;AAC9B,IAAA,aAAa,EAAE,eAAe;AAC9B,IAAA,OAAO,EAAE,eAAe;AACxB,IAAA,eAAe,EAAE,iBAAiB;AAClC,IAAA,eAAe,EAAE,iBAAiB;AAClC,IAAA,OAAO,EAAE,iBAAiB;AAC1B,IAAA,iBAAiB,EAAE,mBAAmB;AACtC,IAAA,iBAAiB,EAAE,mBAAmB;CACvC;AAGD;;;;;;;;;;;;AAYG;AACI,IAAM,aAAa,GAAG,UAAC,OAA2C,EAAA;IACvE,QAAQ,OAAO;AACb,QAAA,KAAK,UAAU;AACb,YAAA,OAAO,UAAU;AACnB,QAAA,KAAK,QAAQ;AACX,YAAA,OAAO,SAAS;AAClB,QAAA,KAAK,iBAAiB;AACpB,YAAA,OAAO,kBAAkB;AAC3B,QAAA,KAAK,eAAe;AAClB,YAAA,OAAO,iBAAiB;AAC1B,QAAA,KAAK,mBAAmB;AACtB,YAAA,OAAO,sBAAsB;AAC/B,QAAA;AACE,YAAA,OAAO,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,EAAE;;AAE1C;AAIA;;;;;;;;AAQG;AACH,IAAM,mBAAmB,GAAG,UAAC,UAAkB,EAAA;;AAC7C,IAAA,OAAO,CAAA,EAAA,GAAA,mBAAmB,CAAC,UAAU,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,mBAAmB,CAAC,UAAU,CAAC,WAAW,EAAE,CAAC;AACzF,CAAC;AAGD;;;;;;;;;;;;;;;;;;;;;AAqBG;AACI,IAAM,qBAAqB,GAAG,UAAC,MAKrC,EAAA;;AACS,IAAA,IAAA,WAAW,GAAuD,MAAM,YAA7D,EAAE,UAAU,GAA2C,MAAM,CAAA,UAAjD,EAAE,iBAAiB,GAAwB,MAAM,CAAA,iBAA9B,EAAE,iBAAiB,GAAK,MAAM,kBAAX;IACrE,IAAM,iBAAiB,GAAG,WAAW,KAAA,IAAA,IAAX,WAAW,uBAAX,WAAW,CAAE,WAAW,EAAE;AACpD,IAAA,IAAM,YAAY,GAAG,mBAAmB,CAAC,UAAU,CAAC;AAEpD,IAAA,IAAM,SAAS,GAAG,CAAA,EAAA,GAAA,iBAAiB,KAAA,IAAA,IAAjB,iBAAiB,KAAA,MAAA,GAAA,MAAA,GAAjB,iBAAiB,CAAE,IAAI,CACvC,UAAC,OAAO,EAAA,EAAA,IAAA,EAAA,CAAA,CAAK,OAAA,CAAA,CAAA,EAAA,GAAA,OAAO,CAAC,IAAI,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,WAAW,EAAE,MAAK,iBAAiB,CAAA,CAAA,CAAA,CAC/D,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,SAAS;AAEZ,IAAA,IAAI,YAAY,KAAI,CAAA,EAAA,GAAA,SAAS,KAAA,IAAA,IAAT,SAAS,uBAAT,SAAS,CAAG,YAAY,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,MAAM,CAAA,IAAI,CAAA,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAG,YAAY,CAAA,CAAE,CAAC,CAAC,KAAI,KAAK,IAAI,CAAA,SAAS,KAAA,IAAA,IAAT,SAAS,uBAAT,SAAS,CAAG,YAAY,CAAA,CAAE,CAAC,CAAC,KAAI,IAAI,EAAE;;AAEtI,QAAA,IAAM,OAAO,GAAG,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,iBAAiB,KAAA,IAAA,IAAjB,iBAAiB,KAAA,MAAA,GAAA,MAAA,GAAjB,iBAAiB,CAAE,IAAI,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,IAAI,CAAC,UAAA,GAAG,EAAA,EAAI,OAAA,GAAG,CAAC,EAAE,KAAK,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAA,CAArC,CAAqC,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,IAAI;QACjG,IAAI,iBAAiB,KAAK,IAAI,IAAI,YAAY,KAAK,eAAe,IAAI,OAAO,KAAK,6BAA6B,IAAI,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,EAAE;AAC7I,YAAA,OAAO,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;QACnC;AACA,QAAA,OAAO,SAAS,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;IACnC;IAEA,IAAI,CAAC,YAAY,EAAE;AACjB,QAAA,OAAO,SAAS;IAClB;IAEA,IAAM,WAAW,GAAG,aAAa,CAAC,YAAY,CAAC,CAAC,WAAW,EAAE;AAC7D,IAAA,IAAM,eAAe,GAAG,CAAA,EAAA,GAAA,iBAAiB,aAAjB,iBAAiB,KAAA,MAAA,GAAA,MAAA,GAAjB,iBAAiB,CAAE,IAAI,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,CAAC,UAAC,GAAG,EAAA;;AAC5D,QAAA,QACE,GAAG,CAAC,WAAW,KAAK,iBAAiB;AACrC,YAAA,CAAC,CAAA,CAAA,EAAA,GAAA,GAAG,CAAC,IAAI,0CAAE,WAAW,EAAE,KAAI,EAAE,EAAE,QAAQ,CAAC,WAAW,CAAC;AAEzD,IAAA,CAAC,CAAC;AAEF,IAAA,OAAO,eAAe,KAAA,IAAA,IAAf,eAAe,uBAAf,eAAe,CAAE,EAAE;AAC5B;AAGA;;;;;;;;;;;;;;;;;;;;AAoBG;AACI,IAAM,uBAAuB,GAAG,UAAO,MAG7C,EAAA,EAAA,OAAAA,mBAAA,CAAA,MAAA,EAAA,MAAA,EAAA,MAAA,EAAA,YAAA;;;;;AACO,gBAAA,KAAK,GAAG,IAAI,eAAe,EAAE;gBAM7B,GAAG,GAAG,qCAAqC;AAChC,gBAAA,OAAA,CAAA,CAAA,YAAMC,cAAU,CAAC,GAAG,CACnC,EAAA,CAAA,MAAA,CAAG,GAAG,EAAA,GAAA,CAAA,CAAA,MAAA,CAAI,KAAK,CAAC,QAAQ,EAAE,CAAE,CAC7B,CAAA;;AAFK,gBAAA,QAAQ,GAAG,EAAA,CAAA,IAAA,EAEhB;AACD,gBAAA,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE;AACrB,oBAAA,MAAM,IAAI,KAAK,CAAC,oCAAoC,CAAC;gBACvD;gBACA,OAAA,CAAA,CAAA,aAAO,QAAQ,CAAC,IAAI,CAAA;;;;;;;;;"}
|
|
@@ -42,7 +42,7 @@ var SelfieConfirmation = function (_a) {
|
|
|
42
42
|
if (!imageUrl) {
|
|
43
43
|
return (jsx("div", { className: "flex flex-col items-center justify-center h-full bg-white", children: jsxs("div", { className: "text-center p-6 max-w-md mx-auto", children: [jsx("div", { className: "w-16 h-16 mx-auto mb-4 text-yellow-500", children: jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [jsx("circle", { cx: "12", cy: "12", r: "10" }), jsx("line", { x1: "12", y1: "8", x2: "12", y2: "12" }), jsx("line", { x1: "12", y1: "16", x2: "12.01", y2: "16" })] }) }), jsx(Title, { className: "text-xl mb-2", children: t("selfie.confirmation.no_display_title", "Impossible d'afficher le selfie") }), jsx("p", { className: "mb-6 text-sm text-gray-600", children: t("selfie.confirmation.no_display_desc", "Nous n'avons pas pu traiter correctement votre selfie.") }), jsx(Button, { variant: "secondary", onClick: onRetake, className: "md:max-w-xs mx-auto", children: t("selfie.confirmation.retake", "Reprendre le selfie") })] }) }));
|
|
44
44
|
}
|
|
45
|
-
return (jsx(MobilePageLayout, { header: jsxs("div", { className: "p-4 text-center bg-white border-b border-gray-100", children: [jsx(Title, { className: "text-xl md:text-2xl", children: t("selfie.confirmation.title", "Confirmez votre selfie") }), jsx(Subtitle, { className: "text-xs text-gray-600 mt-2 md:text-sm", children: t("selfie.confirmation.subtitle", "Vérifiez que votre visage est clairement visible") })] }), footer: jsx(PageActions, { primary: jsx(Button, { onClick: onConfirm, children: t("selfie.confirmation.confirm", "Confirmer") }), secondary: jsx(Button, { variant: "secondary", onClick: onRetake, children: t("selfie.confirmation.retake", "Reprendre le selfie") }) }), className: "bg-white", children: jsx("div", { className: "px-4 py-6 md:px-8 md:py-8", children: jsxs("div", { className: "w-full max-w-md mx-auto space-y-6", children: [jsx("div", { className: "w-full bg-white rounded-lg
|
|
45
|
+
return (jsx(MobilePageLayout, { header: jsxs("div", { className: "p-4 text-center bg-white border-b border-gray-100", children: [jsx(Title, { className: "text-xl md:text-2xl", children: t("selfie.confirmation.title", "Confirmez votre selfie") }), jsx(Subtitle, { className: "text-xs text-gray-600 mt-2 md:text-sm", children: t("selfie.confirmation.subtitle", "Vérifiez que votre visage est clairement visible") })] }), footer: jsx(PageActions, { primary: jsx(Button, { onClick: onConfirm, children: t("selfie.confirmation.confirm", "Confirmer") }), secondary: jsx(Button, { variant: "secondary", onClick: onRetake, children: t("selfie.confirmation.retake", "Reprendre le selfie") }) }), className: "bg-white", children: jsx("div", { className: "px-4 py-6 md:px-8 md:py-8", children: jsxs("div", { className: "w-full max-w-md mx-auto space-y-6", children: [jsx("div", { className: "w-full bg-white rounded-lg shadow-md", children: jsxs("div", { className: "relative rounded-lg border-2 border-[#11E5C5] flex items-center justify-center bg-white", children: [jsx("img", { src: imageUrl, alt: "Selfie captur\u00E9", className: "w-full h-auto object-contain rounded-lg", style: { maxHeight: "50vh" }, onError: function () {
|
|
46
46
|
setError("Impossible d'afficher l'image du selfie");
|
|
47
47
|
} }), jsx("div", { className: "absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/30 to-transparent p-3", children: jsx("p", { className: "text-white text-xs text-center", children: t("selfie.confirmation.overlay_success", "Selfie capturé avec succès") }) })] }) }), jsxs("div", { className: "bg-gray-50 p-4 rounded-lg", children: [jsx("h3", { className: "font-medium text-sm mb-3", children: t("selfie.confirmation.checklist_title", "Vérifiez que :") }), jsxs("ul", { className: "space-y-2 text-xs text-gray-700", children: [jsxs("li", { className: "flex items-start", children: [jsx("svg", { className: "w-4 h-4 text-green-500 mr-2 mt-0.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M5 13l4 4L19 7" }) }), t("selfie.confirmation.check_visible", "Votre visage est bien visible et occupe la majeure partie de l'image")] }), jsxs("li", { className: "flex items-start", children: [jsx("svg", { className: "w-4 h-4 text-green-500 mr-2 mt-0.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M5 13l4 4L19 7" }) }), t("selfie.confirmation.check_well_lit", "L'image est nette et bien éclairée")] }), jsxs("li", { className: "flex items-start", children: [jsx("svg", { className: "w-4 h-4 text-green-500 mr-2 mt-0.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M5 13l4 4L19 7" }) }), t("selfie.confirmation.check_no_object", "Aucun objet ne cache votre visage (lunettes de soleil, masque, etc.)")] })] })] }), jsx("canvas", { ref: canvasRef, style: { display: "none" } })] }) }) }));
|
|
48
48
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelfieConfirmation.js","sources":["../../../../../src/components/selfie/SelfieConfirmation.tsx"],"sourcesContent":["/**\n * SelfieConfirmation component\n *\n * Displays the captured selfie and allows the user to confirm or retake it.\n *\n * @param {Object} props - Component props\n * @param {SelfieCaptureData} props.selfieData - The captured selfie data containing media blob and metadata\n * @param {Function} props.onConfirm - Function called when user confirms the selfie\n * @param {Function} props.onRetake - Function called when user wants to retake the selfie\n * @returns {JSX.Element} The selfie confirmation UI component\n */\n\nimport { useEffect, useRef, useState } from \"react\";\nimport type { SelfieCaptureData } from \"../../types/selfie\";\nimport Button from \"../ui/Button\";\nimport PageActions from \"../ui/PageActions\";\nimport Title from \"../ui/Title\";\nimport Subtitle from \"../ui/Subtitle\";\nimport MobilePageLayout from \"../ui/MobilePageLayout\";\nimport { useI18n } from \"../../hooks/useI18n\";\n\ninterface SelfieConfirmationProps {\n selfieData: SelfieCaptureData;\n setSelfiePhoto: (photo: string) => void;\n onConfirm: () => void;\n onRetake: () => void;\n}\n\nconst SelfieConfirmation = ({\n selfieData,\n setSelfiePhoto,\n onConfirm,\n onRetake,\n}: SelfieConfirmationProps) => {\n const { t } = useI18n();\n const [isLoading, setIsLoading] = useState(true);\n const [error, setError] = useState<string | null>(null);\n const [imageUrl, setImageUrl] = useState<string | null>(null);\n const canvasRef = useRef<HTMLCanvasElement>(null);\n\n useEffect(() => {\n setIsLoading(true);\n setError(null);\n\n if (!selfieData?.media) {\n setError(t(\"selfie.confirmation.errors.no_data\", \"Aucune donnée de selfie disponible\"));\n setIsLoading(false);\n return;\n }\n\n // Use pre-captured thumbnail from live video stream\n if (selfieData.thumbnail) {\n setImageUrl(selfieData.thumbnail);\n setSelfiePhoto(selfieData.thumbnail);\n setIsLoading(false);\n return;\n }\n\n // No thumbnail available (should not happen)\n setError(t(\"selfie.confirmation.errors.no_preview\", \"Aucune preview disponible\"));\n setIsLoading(false);\n }, [selfieData, setSelfiePhoto]);\n\n if (isLoading) {\n return (\n <div className=\"flex flex-col items-center justify-center h-full bg-white\">\n <div className=\"text-center p-6\">\n <div className=\"mb-4 text-gray-700\">\n {t(\"selfie.confirmation.loading\", \"Traitement de votre selfie...\")}\n </div>\n <div className=\"w-12 h-12 border-4 border-[#11E5C5] border-t-transparent rounded-full animate-spin mx-auto\"></div>\n </div>\n </div>\n );\n }\n\n if (error) {\n return (\n <div className=\"flex flex-col items-center justify-center h-full bg-white\">\n <div className=\"text-center p-6 max-w-md mx-auto\">\n <div className=\"w-16 h-16 mx-auto mb-4 text-red-500\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"10\"></circle>\n <line x1=\"15\" y1=\"9\" x2=\"9\" y2=\"15\"></line>\n <line x1=\"9\" y1=\"9\" x2=\"15\" y2=\"15\"></line>\n </svg>\n </div>\n <Title className=\"text-xl mb-2\">{t(\"selfie.confirmation.error_title\", \"Une erreur est survenue\")}</Title>\n <p className=\"mb-6 text-sm text-gray-600\">{error}</p>\n <Button variant=\"secondary\" onClick={onRetake} className=\"md:max-w-xs mx-auto\">\n {t(\"selfie.confirmation.retake\", \"Reprendre le selfie\")}\n </Button>\n </div>\n </div>\n );\n }\n\n if (!imageUrl) {\n return (\n <div className=\"flex flex-col items-center justify-center h-full bg-white\">\n <div className=\"text-center p-6 max-w-md mx-auto\">\n <div className=\"w-16 h-16 mx-auto mb-4 text-yellow-500\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"10\"></circle>\n <line x1=\"12\" y1=\"8\" x2=\"12\" y2=\"12\"></line>\n <line x1=\"12\" y1=\"16\" x2=\"12.01\" y2=\"16\"></line>\n </svg>\n </div>\n <Title className=\"text-xl mb-2\">{t(\"selfie.confirmation.no_display_title\", \"Impossible d'afficher le selfie\")}</Title>\n <p className=\"mb-6 text-sm text-gray-600\">{t(\"selfie.confirmation.no_display_desc\", \"Nous n'avons pas pu traiter correctement votre selfie.\")}</p>\n <Button variant=\"secondary\" onClick={onRetake} className=\"md:max-w-xs mx-auto\">\n {t(\"selfie.confirmation.retake\", \"Reprendre le selfie\")}\n </Button>\n </div>\n </div>\n );\n }\n\n return (\n <MobilePageLayout\n header={\n <div className=\"p-4 text-center bg-white border-b border-gray-100\">\n <Title className=\"text-xl md:text-2xl\">{t(\"selfie.confirmation.title\", \"Confirmez votre selfie\")}</Title>\n <Subtitle className=\"text-xs text-gray-600 mt-2 md:text-sm\">{t(\"selfie.confirmation.subtitle\", \"Vérifiez que votre visage est clairement visible\")}</Subtitle>\n </div>\n }\n footer={\n <PageActions\n primary={\n <Button onClick={onConfirm}>\n {t(\"selfie.confirmation.confirm\", \"Confirmer\")}\n </Button>\n }\n secondary={\n <Button variant=\"secondary\" onClick={onRetake}>\n {t(\"selfie.confirmation.retake\", \"Reprendre le selfie\")}\n </Button>\n }\n />\n }\n className=\"bg-white\"\n >\n <div className=\"px-4 py-6 md:px-8 md:py-8\">\n <div className=\"w-full max-w-md mx-auto space-y-6\">\n {/* Selfie display with frame */}\n <div className=\"w-full bg-white rounded-lg overflow-hidden shadow-md\">\n <div className=\"relative rounded-lg overflow-hidden border-2 border-[#11E5C5]\">\n <img\n src={imageUrl}\n alt=\"Selfie capturé\"\n className=\"w-full h-64 md:h-80 object-cover bg-white\"\n onError={() => {\n setError(\"Impossible d'afficher l'image du selfie\");\n }}\n />\n {/* Overlay pour améliorer la lisibilité */}\n <div className=\"absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/30 to-transparent p-3\">\n <p className=\"text-white text-xs text-center\">{t(\"selfie.confirmation.overlay_success\", \"Selfie capturé avec succès\")}</p>\n </div>\n </div>\n </div>\n\n {/* Checklist de confirmation */}\n <div className=\"bg-gray-50 p-4 rounded-lg\">\n <h3 className=\"font-medium text-sm mb-3\">{t(\"selfie.confirmation.checklist_title\", \"Vérifiez que :\")}</h3>\n <ul className=\"space-y-2 text-xs text-gray-700\">\n <li className=\"flex items-start\">\n <svg\n className=\"w-4 h-4 text-green-500 mr-2 mt-0.5\"\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"2\"\n d=\"M5 13l4 4L19 7\"\n ></path>\n </svg>\n {t(\"selfie.confirmation.check_visible\", \"Votre visage est bien visible et occupe la majeure partie de l'image\")}\n </li>\n <li className=\"flex items-start\">\n <svg\n className=\"w-4 h-4 text-green-500 mr-2 mt-0.5\"\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"2\"\n d=\"M5 13l4 4L19 7\"\n ></path>\n </svg>\n {t(\"selfie.confirmation.check_well_lit\", \"L'image est nette et bien éclairée\")}\n </li>\n <li className=\"flex items-start\">\n <svg\n className=\"w-4 h-4 text-green-500 mr-2 mt-0.5\"\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"2\"\n d=\"M5 13l4 4L19 7\"\n ></path>\n </svg>\n {t(\"selfie.confirmation.check_no_object\", \"Aucun objet ne cache votre visage (lunettes de soleil, masque, etc.)\")}\n </li>\n </ul>\n </div>\n\n {/* Canvas caché utilisé pour le traitement des images */}\n <canvas ref={canvasRef} style={{ display: \"none\" }} />\n </div>\n </div>\n </MobilePageLayout>\n );\n};\n\nexport default SelfieConfirmation;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SelfieConfirmation.js","sources":["../../../../../src/components/selfie/SelfieConfirmation.tsx"],"sourcesContent":["/**\n * SelfieConfirmation component\n *\n * Displays the captured selfie and allows the user to confirm or retake it.\n *\n * @param {Object} props - Component props\n * @param {SelfieCaptureData} props.selfieData - The captured selfie data containing media blob and metadata\n * @param {Function} props.onConfirm - Function called when user confirms the selfie\n * @param {Function} props.onRetake - Function called when user wants to retake the selfie\n * @returns {JSX.Element} The selfie confirmation UI component\n */\n\nimport { useEffect, useRef, useState } from \"react\";\nimport type { SelfieCaptureData } from \"../../types/selfie\";\nimport Button from \"../ui/Button\";\nimport PageActions from \"../ui/PageActions\";\nimport Title from \"../ui/Title\";\nimport Subtitle from \"../ui/Subtitle\";\nimport MobilePageLayout from \"../ui/MobilePageLayout\";\nimport { useI18n } from \"../../hooks/useI18n\";\n\ninterface SelfieConfirmationProps {\n selfieData: SelfieCaptureData;\n setSelfiePhoto: (photo: string) => void;\n onConfirm: () => void;\n onRetake: () => void;\n}\n\nconst SelfieConfirmation = ({\n selfieData,\n setSelfiePhoto,\n onConfirm,\n onRetake,\n}: SelfieConfirmationProps) => {\n const { t } = useI18n();\n const [isLoading, setIsLoading] = useState(true);\n const [error, setError] = useState<string | null>(null);\n const [imageUrl, setImageUrl] = useState<string | null>(null);\n const canvasRef = useRef<HTMLCanvasElement>(null);\n\n useEffect(() => {\n setIsLoading(true);\n setError(null);\n\n if (!selfieData?.media) {\n setError(t(\"selfie.confirmation.errors.no_data\", \"Aucune donnée de selfie disponible\"));\n setIsLoading(false);\n return;\n }\n\n // Use pre-captured thumbnail from live video stream\n if (selfieData.thumbnail) {\n setImageUrl(selfieData.thumbnail);\n setSelfiePhoto(selfieData.thumbnail);\n setIsLoading(false);\n return;\n }\n\n // No thumbnail available (should not happen)\n setError(t(\"selfie.confirmation.errors.no_preview\", \"Aucune preview disponible\"));\n setIsLoading(false);\n }, [selfieData, setSelfiePhoto]);\n\n if (isLoading) {\n return (\n <div className=\"flex flex-col items-center justify-center h-full bg-white\">\n <div className=\"text-center p-6\">\n <div className=\"mb-4 text-gray-700\">\n {t(\"selfie.confirmation.loading\", \"Traitement de votre selfie...\")}\n </div>\n <div className=\"w-12 h-12 border-4 border-[#11E5C5] border-t-transparent rounded-full animate-spin mx-auto\"></div>\n </div>\n </div>\n );\n }\n\n if (error) {\n return (\n <div className=\"flex flex-col items-center justify-center h-full bg-white\">\n <div className=\"text-center p-6 max-w-md mx-auto\">\n <div className=\"w-16 h-16 mx-auto mb-4 text-red-500\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"10\"></circle>\n <line x1=\"15\" y1=\"9\" x2=\"9\" y2=\"15\"></line>\n <line x1=\"9\" y1=\"9\" x2=\"15\" y2=\"15\"></line>\n </svg>\n </div>\n <Title className=\"text-xl mb-2\">{t(\"selfie.confirmation.error_title\", \"Une erreur est survenue\")}</Title>\n <p className=\"mb-6 text-sm text-gray-600\">{error}</p>\n <Button variant=\"secondary\" onClick={onRetake} className=\"md:max-w-xs mx-auto\">\n {t(\"selfie.confirmation.retake\", \"Reprendre le selfie\")}\n </Button>\n </div>\n </div>\n );\n }\n\n if (!imageUrl) {\n return (\n <div className=\"flex flex-col items-center justify-center h-full bg-white\">\n <div className=\"text-center p-6 max-w-md mx-auto\">\n <div className=\"w-16 h-16 mx-auto mb-4 text-yellow-500\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <circle cx=\"12\" cy=\"12\" r=\"10\"></circle>\n <line x1=\"12\" y1=\"8\" x2=\"12\" y2=\"12\"></line>\n <line x1=\"12\" y1=\"16\" x2=\"12.01\" y2=\"16\"></line>\n </svg>\n </div>\n <Title className=\"text-xl mb-2\">{t(\"selfie.confirmation.no_display_title\", \"Impossible d'afficher le selfie\")}</Title>\n <p className=\"mb-6 text-sm text-gray-600\">{t(\"selfie.confirmation.no_display_desc\", \"Nous n'avons pas pu traiter correctement votre selfie.\")}</p>\n <Button variant=\"secondary\" onClick={onRetake} className=\"md:max-w-xs mx-auto\">\n {t(\"selfie.confirmation.retake\", \"Reprendre le selfie\")}\n </Button>\n </div>\n </div>\n );\n }\n\n return (\n <MobilePageLayout\n header={\n <div className=\"p-4 text-center bg-white border-b border-gray-100\">\n <Title className=\"text-xl md:text-2xl\">{t(\"selfie.confirmation.title\", \"Confirmez votre selfie\")}</Title>\n <Subtitle className=\"text-xs text-gray-600 mt-2 md:text-sm\">{t(\"selfie.confirmation.subtitle\", \"Vérifiez que votre visage est clairement visible\")}</Subtitle>\n </div>\n }\n footer={\n <PageActions\n primary={\n <Button onClick={onConfirm}>\n {t(\"selfie.confirmation.confirm\", \"Confirmer\")}\n </Button>\n }\n secondary={\n <Button variant=\"secondary\" onClick={onRetake}>\n {t(\"selfie.confirmation.retake\", \"Reprendre le selfie\")}\n </Button>\n }\n />\n }\n className=\"bg-white\"\n >\n <div className=\"px-4 py-6 md:px-8 md:py-8\">\n <div className=\"w-full max-w-md mx-auto space-y-6\">\n {/* Selfie display with frame */}\n <div className=\"w-full bg-white rounded-lg shadow-md\">\n <div className=\"relative rounded-lg border-2 border-[#11E5C5] flex items-center justify-center bg-white\">\n <img\n src={imageUrl}\n alt=\"Selfie capturé\"\n className=\"w-full h-auto object-contain rounded-lg\"\n style={{ maxHeight: \"50vh\" }}\n onError={() => {\n setError(\"Impossible d'afficher l'image du selfie\");\n }}\n />\n {/* Overlay pour améliorer la lisibilité */}\n <div className=\"absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/30 to-transparent p-3\">\n <p className=\"text-white text-xs text-center\">{t(\"selfie.confirmation.overlay_success\", \"Selfie capturé avec succès\")}</p>\n </div>\n </div>\n </div>\n\n {/* Checklist de confirmation */}\n <div className=\"bg-gray-50 p-4 rounded-lg\">\n <h3 className=\"font-medium text-sm mb-3\">{t(\"selfie.confirmation.checklist_title\", \"Vérifiez que :\")}</h3>\n <ul className=\"space-y-2 text-xs text-gray-700\">\n <li className=\"flex items-start\">\n <svg\n className=\"w-4 h-4 text-green-500 mr-2 mt-0.5\"\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"2\"\n d=\"M5 13l4 4L19 7\"\n ></path>\n </svg>\n {t(\"selfie.confirmation.check_visible\", \"Votre visage est bien visible et occupe la majeure partie de l'image\")}\n </li>\n <li className=\"flex items-start\">\n <svg\n className=\"w-4 h-4 text-green-500 mr-2 mt-0.5\"\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"2\"\n d=\"M5 13l4 4L19 7\"\n ></path>\n </svg>\n {t(\"selfie.confirmation.check_well_lit\", \"L'image est nette et bien éclairée\")}\n </li>\n <li className=\"flex items-start\">\n <svg\n className=\"w-4 h-4 text-green-500 mr-2 mt-0.5\"\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth=\"2\"\n d=\"M5 13l4 4L19 7\"\n ></path>\n </svg>\n {t(\"selfie.confirmation.check_no_object\", \"Aucun objet ne cache votre visage (lunettes de soleil, masque, etc.)\")}\n </li>\n </ul>\n </div>\n\n {/* Canvas caché utilisé pour le traitement des images */}\n <canvas ref={canvasRef} style={{ display: \"none\" }} />\n </div>\n </div>\n </MobilePageLayout>\n );\n};\n\nexport default SelfieConfirmation;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
|
|
@@ -6,7 +6,7 @@ import SelfieFlow from './selfie-flow/SelfieFlow.js';
|
|
|
6
6
|
import VideoResetStyles from './VideoResetStyles.js';
|
|
7
7
|
|
|
8
8
|
var Video = function (_a) {
|
|
9
|
-
var setSelfieData = _a.setSelfieData, setStep = _a.setStep, onBack = _a.onBack;
|
|
9
|
+
var setSelfieData = _a.setSelfieData, setStep = _a.setStep, onBack = _a.onBack, btnBg = _a.btnBg, btnText = _a.btnText;
|
|
10
10
|
// Effet pour ajouter la classe au body lorsque le composant est monté
|
|
11
11
|
useEffect(function () {
|
|
12
12
|
// Empêcher le scroll sur le body lorsque la capture est active
|
|
@@ -28,7 +28,7 @@ var Video = function (_a) {
|
|
|
28
28
|
setStep(1); // Move to the next step after selfie capture
|
|
29
29
|
}, 300);
|
|
30
30
|
};
|
|
31
|
-
return (jsxs("div", { className: "w-full h-full overflow-hidden flex flex-col", children: [jsx(VideoResetStyles, {}), jsx(SelfieFlow, { handleSelfie: handleSelfie, onBack: onBack })] }));
|
|
31
|
+
return (jsxs("div", { className: "w-full h-full overflow-hidden flex flex-col", children: [jsx(VideoResetStyles, {}), jsx(SelfieFlow, { handleSelfie: handleSelfie, onBack: onBack, btnBg: btnBg, btnText: btnText })] }));
|
|
32
32
|
};
|
|
33
33
|
|
|
34
34
|
export { Video as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Video.js","sources":["../../../../../src/components/selfie/Video.tsx"],"sourcesContent":["import { useEffect } from \"react\";\nimport type { SelfieCaptureData } from \"../../types/selfie\";\nimport \"./Video.css\";\nimport \"./VideoFixes.css\";\nimport SelfieFlow from \"./selfie-flow/SelfieFlow\";\nimport VideoResetStyles from \"./VideoResetStyles\";\n\ninterface VideoProps {\n setSelfieData: (selfieData: SelfieCaptureData) => void;\n setStep: (step: number) => void;\n onBack?: () => void;\n}\n\nconst Video = ({ setSelfieData, setStep, onBack }: VideoProps) => {\n // Effet pour ajouter la classe au body lorsque le composant est monté\n useEffect(() => {\n // Empêcher le scroll sur le body lorsque la capture est active\n document.body.classList.add(\"selfie-active\");\n\n // Ajouter une classe pour gérer le plein écran sur mobile\n document.documentElement.classList.add(\"selfie-fullscreen\");\n\n return () => {\n // Nettoyer en enlevant les classes lors du démontage\n document.body.classList.remove(\"selfie-active\");\n document.documentElement.classList.remove(\"selfie-fullscreen\");\n };\n }, []);\n\n const handleSelfie = (e: Event) => {\n const data = (e as CustomEvent<SelfieCaptureData>).detail;\n\n // Attendre un court instant avant de passer à l'écran de confirmation\n // pour donner le temps à l'utilisateur de voir que la capture est terminée\n setTimeout(() => {\n setSelfieData(data);\n setStep(1); // Move to the next step after selfie capture\n }, 300);\n };\n\n return (\n <div className=\"w-full h-full overflow-hidden flex flex-col\">\n <VideoResetStyles />\n <SelfieFlow handleSelfie={handleSelfie} onBack={onBack} />\n </div>\n );\n};\n\nexport default Video;\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;
|
|
1
|
+
{"version":3,"file":"Video.js","sources":["../../../../../src/components/selfie/Video.tsx"],"sourcesContent":["import { useEffect } from \"react\";\nimport type { SelfieCaptureData } from \"../../types/selfie\";\nimport \"./Video.css\";\nimport \"./VideoFixes.css\";\nimport SelfieFlow from \"./selfie-flow/SelfieFlow\";\nimport VideoResetStyles from \"./VideoResetStyles\";\n\ninterface VideoProps {\n setSelfieData: (selfieData: SelfieCaptureData) => void;\n setStep: (step: number) => void;\n onBack?: () => void;\n btnBg?: string;\n btnText?: string;\n}\n\nconst Video = ({ setSelfieData, setStep, onBack, btnBg, btnText }: VideoProps) => {\n // Effet pour ajouter la classe au body lorsque le composant est monté\n useEffect(() => {\n // Empêcher le scroll sur le body lorsque la capture est active\n document.body.classList.add(\"selfie-active\");\n\n // Ajouter une classe pour gérer le plein écran sur mobile\n document.documentElement.classList.add(\"selfie-fullscreen\");\n\n return () => {\n // Nettoyer en enlevant les classes lors du démontage\n document.body.classList.remove(\"selfie-active\");\n document.documentElement.classList.remove(\"selfie-fullscreen\");\n };\n }, []);\n\n const handleSelfie = (e: Event) => {\n const data = (e as CustomEvent<SelfieCaptureData>).detail;\n\n // Attendre un court instant avant de passer à l'écran de confirmation\n // pour donner le temps à l'utilisateur de voir que la capture est terminée\n setTimeout(() => {\n setSelfieData(data);\n setStep(1); // Move to the next step after selfie capture\n }, 300);\n };\n\n return (\n <div className=\"w-full h-full overflow-hidden flex flex-col\">\n <VideoResetStyles />\n <SelfieFlow handleSelfie={handleSelfie} onBack={onBack} btnBg={btnBg} btnText={btnText} />\n </div>\n );\n};\n\nexport default Video;\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;AAeA,IAAM,KAAK,GAAG,UAAC,EAA8D,EAAA;AAA5D,IAAA,IAAA,aAAa,GAAA,EAAA,CAAA,aAAA,EAAE,OAAO,GAAA,EAAA,CAAA,OAAA,EAAE,MAAM,GAAA,EAAA,CAAA,MAAA,EAAE,KAAK,GAAA,EAAA,CAAA,KAAA,EAAE,OAAO,GAAA,EAAA,CAAA,OAAA;;AAE7D,IAAA,SAAS,CAAC,YAAA;;QAER,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,eAAe,CAAC;;QAG5C,QAAQ,CAAC,eAAe,CAAC,SAAS,CAAC,GAAG,CAAC,mBAAmB,CAAC;QAE3D,OAAO,YAAA;;YAEL,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,eAAe,CAAC;YAC/C,QAAQ,CAAC,eAAe,CAAC,SAAS,CAAC,MAAM,CAAC,mBAAmB,CAAC;AAChE,QAAA,CAAC;IACH,CAAC,EAAE,EAAE,CAAC;IAEN,IAAM,YAAY,GAAG,UAAC,CAAQ,EAAA;AAC5B,QAAA,IAAM,IAAI,GAAI,CAAoC,CAAC,MAAM;;;AAIzD,QAAA,UAAU,CAAC,YAAA;YACT,aAAa,CAAC,IAAI,CAAC;AACnB,YAAA,OAAO,CAAC,CAAC,CAAC,CAAC;QACb,CAAC,EAAE,GAAG,CAAC;AACT,IAAA,CAAC;AAED,IAAA,QACEA,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,6CAA6C,EAAA,QAAA,EAAA,CAC1DC,GAAA,CAAC,gBAAgB,EAAA,EAAA,CAAG,EACpBA,GAAA,CAAC,UAAU,IAAC,YAAY,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAA,CAAI,CAAA,EAAA,CACtF;AAEV;;;;"}
|
|
@@ -5,8 +5,8 @@ import { useEffect } from 'react';
|
|
|
5
5
|
* le composant VideoRecorder d'Unissey et éliminent les bords arrondis et les fonds noirs.
|
|
6
6
|
*/
|
|
7
7
|
var useVideoRecorderStyles = function (btnBg, btnText) {
|
|
8
|
-
var resolvedBtnBg = "#11E5C5";
|
|
9
|
-
var resolvedBtnText = "#3C3C40";
|
|
8
|
+
var resolvedBtnBg = btnBg !== null && btnBg !== void 0 ? btnBg : "#11E5C5";
|
|
9
|
+
var resolvedBtnText = btnText !== null && btnText !== void 0 ? btnText : "#3C3C40";
|
|
10
10
|
useEffect(function () {
|
|
11
11
|
// Créer un élément style pour injecter des règles CSS
|
|
12
12
|
var styleElement = document.createElement("style");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useVideoRecorderStyles.js","sources":["../../../../../../src/components/selfie/hooks/useVideoRecorderStyles.tsx"],"sourcesContent":["import { useEffect } from \"react\";\n\n/**\n * Hook personnalisé pour injecter des styles CSS globaux qui ciblent spécifiquement\n * le composant VideoRecorder d'Unissey et éliminent les bords arrondis et les fonds noirs.\n */\nconst useVideoRecorderStyles = (btnBg?: string, btnText?: string) => {\n const resolvedBtnBg = btnBg ?? \"#11E5C5\";\n const resolvedBtnText = btnText ?? \"#3C3C40\";\n\n useEffect(() => {\n // Créer un élément style pour injecter des règles CSS\n const styleElement = document.createElement(\"style\");\n styleElement.id = \"video-recorder-custom-styles\";\n\n // Définir les règles CSS nécessaires pour éliminer les bords arrondis et les fonds noirs\n styleElement.textContent = `\n /* Cibler le composant VideoRecorder et tous ses éléments internes */\n uni-video-recorder,\n uni-video-recorder::shadow-root,\n uni-video-recorder::part(*),\n uni-video-recorder *,\n uni-video-recorder video,\n uni-video-recorder canvas,\n uni-video-recorder div {\n border-radius: 0 !important;\n -webkit-border-radius: 0 !important;\n -moz-border-radius: 0 !important;\n background: transparent !important;\n overflow: hidden !important;\n }\n\n /* Assurer que la vidéo prend tout l'espace disponible */\n uni-video-recorder video,\n uni-video-recorder canvas {\n width: 100% !important;\n height: 100% !important;\n object-fit: cover !important;\n max-height: none !important;\n }\n\n /* iOS-specific fixes for getUserMedia black screen */\n @supports (-webkit-touch-callout: none) {\n uni-video-recorder video {\n -webkit-playsinline: true !important;\n playsinline: true !important;\n autoplay: true !important;\n muted: true !important;\n }\n }\n\n /* Variables CSS globales que le composant pourrait utiliser */\n :root {\n --uni-video-border-radius: 0 !important;\n --uni-border-radius: 0 !important;\n --uni-component-border-radius: 0 !important;\n --uni-video-background: transparent !important;\n --uni-background: transparent !important;\n }\n\n /* Sélecteurs très spécifiques pour garantir que les styles s'appliquent */\n .video-container,\n .video-container > div,\n .video-container > div > uni-video-recorder,\n .video-container uni-video-recorder,\n .selfie .video-container,\n .selfie .video-container > div,\n .selfie .video-container uni-video-recorder {\n border-radius: 0 !important;\n background: transparent !important;\n overflow: hidden !important;\n }\n\n /* Préserver les styles des boutons */\n .selfie button.selfie-button,\n button.selfie-button,\n .selfie-button {\n background-color: ${resolvedBtnBg} !important;\n color: ${resolvedBtnText} !important;\n border-radius: 12px !important;\n }\n\n .selfie button.selfie-button:hover,\n button.selfie-button:hover,\n .selfie-button:hover {\n background-color: ${resolvedBtnBg} !important;\n filter: brightness(1.1);\n }\n\n .selfie button.selfie-button:disabled,\n button.selfie-button:disabled,\n .selfie-button:disabled {\n background-color: #e2e8f0 !important;\n opacity: 0.6 !important;\n }\n `;\n\n // Ajouter l'élément style au head du document\n document.head.appendChild(styleElement);\n\n // Nettoyer en supprimant l'élément style lors du démontage du composant\n return () => {\n const existingStyle = document.getElementById(\n \"video-recorder-custom-styles\"\n );\n if (existingStyle) {\n document.head.removeChild(existingStyle);\n }\n };\n }, [resolvedBtnBg, resolvedBtnText]);\n};\n\nexport default useVideoRecorderStyles;\n"],"names":[],"mappings":";;AAEA;;;AAGG;AACH,IAAM,sBAAsB,GAAG,UAAC,KAAc,EAAE,OAAgB,EAAA;IAC9D,IAAM,aAAa,
|
|
1
|
+
{"version":3,"file":"useVideoRecorderStyles.js","sources":["../../../../../../src/components/selfie/hooks/useVideoRecorderStyles.tsx"],"sourcesContent":["import { useEffect } from \"react\";\n\n/**\n * Hook personnalisé pour injecter des styles CSS globaux qui ciblent spécifiquement\n * le composant VideoRecorder d'Unissey et éliminent les bords arrondis et les fonds noirs.\n */\nconst useVideoRecorderStyles = (btnBg?: string, btnText?: string) => {\n const resolvedBtnBg = btnBg ?? \"#11E5C5\";\n const resolvedBtnText = btnText ?? \"#3C3C40\";\n\n useEffect(() => {\n // Créer un élément style pour injecter des règles CSS\n const styleElement = document.createElement(\"style\");\n styleElement.id = \"video-recorder-custom-styles\";\n\n // Définir les règles CSS nécessaires pour éliminer les bords arrondis et les fonds noirs\n styleElement.textContent = `\n /* Cibler le composant VideoRecorder et tous ses éléments internes */\n uni-video-recorder,\n uni-video-recorder::shadow-root,\n uni-video-recorder::part(*),\n uni-video-recorder *,\n uni-video-recorder video,\n uni-video-recorder canvas,\n uni-video-recorder div {\n border-radius: 0 !important;\n -webkit-border-radius: 0 !important;\n -moz-border-radius: 0 !important;\n background: transparent !important;\n overflow: hidden !important;\n }\n\n /* Assurer que la vidéo prend tout l'espace disponible */\n uni-video-recorder video,\n uni-video-recorder canvas {\n width: 100% !important;\n height: 100% !important;\n object-fit: cover !important;\n max-height: none !important;\n }\n\n /* iOS-specific fixes for getUserMedia black screen */\n @supports (-webkit-touch-callout: none) {\n uni-video-recorder video {\n -webkit-playsinline: true !important;\n playsinline: true !important;\n autoplay: true !important;\n muted: true !important;\n }\n }\n\n /* Variables CSS globales que le composant pourrait utiliser */\n :root {\n --uni-video-border-radius: 0 !important;\n --uni-border-radius: 0 !important;\n --uni-component-border-radius: 0 !important;\n --uni-video-background: transparent !important;\n --uni-background: transparent !important;\n }\n\n /* Sélecteurs très spécifiques pour garantir que les styles s'appliquent */\n .video-container,\n .video-container > div,\n .video-container > div > uni-video-recorder,\n .video-container uni-video-recorder,\n .selfie .video-container,\n .selfie .video-container > div,\n .selfie .video-container uni-video-recorder {\n border-radius: 0 !important;\n background: transparent !important;\n overflow: hidden !important;\n }\n\n /* Préserver les styles des boutons */\n .selfie button.selfie-button,\n button.selfie-button,\n .selfie-button {\n background-color: ${resolvedBtnBg} !important;\n color: ${resolvedBtnText} !important;\n border-radius: 12px !important;\n }\n\n .selfie button.selfie-button:hover,\n button.selfie-button:hover,\n .selfie-button:hover {\n background-color: ${resolvedBtnBg} !important;\n filter: brightness(1.1);\n }\n\n .selfie button.selfie-button:disabled,\n button.selfie-button:disabled,\n .selfie-button:disabled {\n background-color: #e2e8f0 !important;\n opacity: 0.6 !important;\n }\n `;\n\n // Ajouter l'élément style au head du document\n document.head.appendChild(styleElement);\n\n // Nettoyer en supprimant l'élément style lors du démontage du composant\n return () => {\n const existingStyle = document.getElementById(\n \"video-recorder-custom-styles\"\n );\n if (existingStyle) {\n document.head.removeChild(existingStyle);\n }\n };\n }, [resolvedBtnBg, resolvedBtnText]);\n};\n\nexport default useVideoRecorderStyles;\n"],"names":[],"mappings":";;AAEA;;;AAGG;AACH,IAAM,sBAAsB,GAAG,UAAC,KAAc,EAAE,OAAgB,EAAA;IAC9D,IAAM,aAAa,GAAG,KAAK,KAAA,IAAA,IAAL,KAAK,KAAA,MAAA,GAAL,KAAK,GAAI,SAAS;IACxC,IAAM,eAAe,GAAG,OAAO,KAAA,IAAA,IAAP,OAAO,KAAA,MAAA,GAAP,OAAO,GAAI,SAAS;AAE5C,IAAA,SAAS,CAAC,YAAA;;QAER,IAAM,YAAY,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC;AACpD,QAAA,YAAY,CAAC,EAAE,GAAG,8BAA8B;;QAGhD,YAAY,CAAC,WAAW,GAAG,mpEAAA,CAAA,MAAA,CA6DH,aAAa,0CACxB,eAAe,EAAA,0MAAA,CAAA,CAAA,MAAA,CAOJ,aAAa,EAAA,gRAAA,CAUpC;;AAGD,QAAA,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC;;QAGvC,OAAO,YAAA;YACL,IAAM,aAAa,GAAG,QAAQ,CAAC,cAAc,CAC3C,8BAA8B,CAC/B;YACD,IAAI,aAAa,EAAE;AACjB,gBAAA,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC;YAC1C;AACF,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,aAAa,EAAE,eAAe,CAAC,CAAC;AACtC;;;;"}
|
|
@@ -5,8 +5,9 @@ import InstructionsSelfie from './InstructionsSelfie.js';
|
|
|
5
5
|
import SelfieRecorder from './SelfieRecorder.js';
|
|
6
6
|
|
|
7
7
|
var SelfieFlow = function (_a) {
|
|
8
|
-
var
|
|
9
|
-
var
|
|
8
|
+
var _b;
|
|
9
|
+
var handleSelfie = _a.handleSelfie, onBack = _a.onBack, btnBg = _a.btnBg, btnText = _a.btnText;
|
|
10
|
+
var _c = useState(-1), internalStep = _c[0], setInternalStep = _c[1]; // Commencer à -1 pour la pré-introduction
|
|
10
11
|
var handleBack = function () {
|
|
11
12
|
if (internalStep > -1) {
|
|
12
13
|
setInternalStep(internalStep - 1);
|
|
@@ -16,7 +17,10 @@ var SelfieFlow = function (_a) {
|
|
|
16
17
|
onBack();
|
|
17
18
|
}
|
|
18
19
|
};
|
|
19
|
-
return (jsxs("div", { className: "h-full w-full flex flex-col",
|
|
20
|
+
return (jsxs("div", { className: "h-full w-full flex flex-col", style: (_b = {},
|
|
21
|
+
_b["--dk-btn-bg"] = btnBg !== null && btnBg !== void 0 ? btnBg : "#11E5C5",
|
|
22
|
+
_b["--dk-btn-text"] = btnText !== null && btnText !== void 0 ? btnText : "#3C3C40",
|
|
23
|
+
_b), children: [internalStep === -1 && (jsx("div", { className: "flex-1 flex flex-col h-full", children: jsx(SelfiePreIntroduction, { onContinue: function () { return setInternalStep(0); }, onBack: handleBack }) })), internalStep === 0 && (jsx("div", { className: "flex-1 flex flex-col h-full", children: jsx(InstructionsSelfie, { setStep: setInternalStep, onBack: function () { return setInternalStep(-1); } }) })), internalStep === 1 && (jsx("div", { className: "flex-1 flex flex-col h-full overflow-hidden", children: jsx(SelfieRecorder, { handleSelfie: handleSelfie, btnBg: btnBg, btnText: btnText }) }))] }));
|
|
20
24
|
};
|
|
21
25
|
|
|
22
26
|
export { SelfieFlow as default };
|