{"_id":"@buyandrent/react-fr","_rev":"4-331741ddc081d7037d7485e58b09ae18","name":"@buyandrent/react-fr","dist-tags":{"latest":"0.1.3"},"versions":{"0.1.0":{"name":"@buyandrent/react-fr","version":"0.1.0","keywords":["react","french","address","siret","iban","phone","france","composants"],"license":"MIT","_id":"@buyandrent/react-fr@0.1.0","maintainers":[{"name":"buyandrent","email":"buyandrent2025@gmail.com"}],"dist":{"shasum":"bd14cf0cbae551ee5bf2948043cc246d6de170d0","tarball":"https://registry.npmjs.org/@buyandrent/react-fr/-/react-fr-0.1.0.tgz","fileCount":9,"integrity":"sha512-Z5lj75K45ub3TBDgdMSMfIt9Qq2z1GDCpzOurblPuCVHAkMnD8T2SnWc4x/ooLgHdQDaY36TzguuHU4MS0+gDA==","signatures":[{"sig":"MEUCIQCKOkRwkKX1vkcfpqWYqCFTQW45pomntGoC3Hwzo7xmuQIgR64CC1un0Mr3q8bCSIeNdGvPrrVKrP/fqJtms3zGd3k=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":118414},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.mjs","gitHead":"dbc572514165ac5e1f742b11216508c7286cfc8b","scripts":{"dev":"tsup --watch","build":"tsup"},"_npmUser":{"name":"buyandrent","email":"buyandrent2025@gmail.com"},"_npmVersion":"11.7.0","description":"React input components for French SaaS apps — address, SIRET, IBAN, phone. No API key required.","directories":{},"_nodeVersion":"22.14.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","react":"^18.2.0","typescript":"^5.3.0","@types/react":"^18.2.0"},"peerDependencies":{"react":">=18"},"_npmOperationalInternal":{"tmp":"tmp/react-fr_0.1.0_1776086188528_0.9192408016683471","host":"s3://npm-registry-packages-npm-production"}},"0.1.1":{"name":"@buyandrent/react-fr","version":"0.1.1","keywords":["react","french","address","siret","iban","phone","france","composants"],"license":"MIT","_id":"@buyandrent/react-fr@0.1.1","maintainers":[{"name":"buyandrent","email":"buyandrent2025@gmail.com"}],"dist":{"shasum":"57e5f8dcd18a54c1e066adf50030f0b4a47c13ab","tarball":"https://registry.npmjs.org/@buyandrent/react-fr/-/react-fr-0.1.1.tgz","fileCount":9,"integrity":"sha512-N1bgNDdPYhyWeQATCd3SWykH2pFA9eF7gAwkgDvC2Vc8fJCPIdkVnfxYWOedHBsMnJr8KfM+whueeGhTOb3hog==","signatures":[{"sig":"MEUCIFdpNafsH3ALZujjnNILZhrrFqSzbusnqiWXrBQEs4XbAiEAyMckqeiOf8OjLxDBu+52z535Igy6MuNMbFlrH8fEVWA=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":118467},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.mjs","gitHead":"a27a8ef946a7cb3e10f1bf55f801776620e2256b","scripts":{"dev":"tsup --watch","build":"tsup"},"_npmUser":{"name":"buyandrent","email":"buyandrent2025@gmail.com"},"_npmVersion":"11.7.0","description":"React input components for French SaaS apps - address, SIRET, IBAN, phone. No API key required.","directories":{},"_nodeVersion":"22.14.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","react":"^18.2.0","typescript":"^5.3.0","@types/react":"^18.2.0"},"peerDependencies":{"react":">=18"},"_npmOperationalInternal":{"tmp":"tmp/react-fr_0.1.1_1776086589490_0.02939247513366916","host":"s3://npm-registry-packages-npm-production"}},"0.1.2":{"name":"@buyandrent/react-fr","version":"0.1.2","keywords":["react","react-component","france","french","address","autocomplete","siret","siren","iban","phone","postal-code","code-postal","input","form","validation","api-gouv","ban","base-adresse-nationale","headless","typescript"],"license":"MIT","_id":"@buyandrent/react-fr@0.1.2","maintainers":[{"name":"buyandrent","email":"buyandrent2025@gmail.com"}],"homepage":"https://github.com/Buy-and-Rent/react-fr#readme","bugs":{"url":"https://github.com/Buy-and-Rent/react-fr/issues"},"dist":{"shasum":"f20eeaec9ff40e7aaa14d615c74dba08f735485b","tarball":"https://registry.npmjs.org/@buyandrent/react-fr/-/react-fr-0.1.2.tgz","fileCount":9,"integrity":"sha512-iGnGoLgQrGO9LtCrL84wQwPUNZrwfvc17AajG6RTP1pgN+4gVbURlBRlt4K8BW+3vShTCLKlJM4IKLELrRg02g==","signatures":[{"sig":"MEQCIBDx3yTSq2zFotfl482F1PaP4+pf6oRwaGbQovB2bla9AiBob6Fvd/QXA2IkJLI2QsclskUVzsxCuhkwLYZlgq1bow==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":118920},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.mjs","gitHead":"a27a8ef946a7cb3e10f1bf55f801776620e2256b","scripts":{"dev":"tsup --watch","build":"tsup"},"_npmUser":{"name":"buyandrent","email":"buyandrent2025@gmail.com"},"repository":{"url":"git+https://github.com/Buy-and-Rent/react-fr.git","type":"git"},"_npmVersion":"11.7.0","description":"React input components for French SaaS apps - address, SIRET, IBAN, phone. No API key required.","directories":{},"_nodeVersion":"22.14.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.0","react":"^18.2.0","typescript":"^5.3.0","@types/react":"^18.2.0"},"peerDependencies":{"react":">=18"},"_npmOperationalInternal":{"tmp":"tmp/react-fr_0.1.2_1776087612393_0.9248575696151433","host":"s3://npm-registry-packages-npm-production"}},"0.1.3":{"name":"@buyandrent/react-fr","version":"0.1.3","description":"React input components for French SaaS apps - address, SIRET, IBAN, phone. No API key required.","main":"dist/index.js","module":"dist/index.mjs","types":"dist/index.d.ts","exports":{".":{"import":{"types":"./dist/index.d.mts","default":"./dist/index.mjs"},"require":{"types":"./dist/index.d.ts","default":"./dist/index.js"}}},"scripts":{"build":"tsup","dev":"tsup --watch","storybook":"storybook dev -p 6006","build-storybook":"storybook build"},"peerDependencies":{"react":">=18"},"devDependencies":{"@storybook/addon-docs":"^10.3.5","@storybook/react-vite":"^10.3.5","@types/react":"^18.2.0","react":"^18.2.0","react-dom":"^18.3.1","storybook":"^10.3.5","tsup":"^8.0.0","typescript":"^5.3.0","vite":"^8.0.8"},"keywords":["react","react-component","france","french","address","autocomplete","siret","siren","iban","phone","postal-code","code-postal","input","form","validation","api-gouv","ban","base-adresse-nationale","headless","typescript"],"repository":{"type":"git","url":"git+https://github.com/Buy-and-Rent/react-fr.git"},"homepage":"https://buy-and-rent.github.io/react-fr/","bugs":{"url":"https://github.com/Buy-and-Rent/react-fr/issues"},"license":"MIT","gitHead":"73a5880c56127ccf5d3fe6475a226f1e5b32dba2","_id":"@buyandrent/react-fr@0.1.3","_nodeVersion":"22.14.0","_npmVersion":"11.7.0","dist":{"integrity":"sha512-r3nCY+PyBzToUPcgBYvlpzDXJWXl8OlJBi4SeFq+rd6URiOQXgNr63cHp2ijQGd0lLigMezmNoPZulq3kEq8cA==","shasum":"06b981c9d9debf152040a1c28d06965daf955e5a","tarball":"https://registry.npmjs.org/@buyandrent/react-fr/-/react-fr-0.1.3.tgz","fileCount":9,"unpackedSize":119951,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIEx8jiLnxLssn3R/eSUptlU0QSKYRw4E6nSFURQPn47YAiEArLXI4yjJr6h2qqjYnTy176RbnJ+Z4F/yZ8LrEMm+Sv8="}]},"_npmUser":{"name":"buyandrent","email":"buyandrent2025@gmail.com"},"directories":{},"maintainers":[{"name":"buyandrent","email":"buyandrent2025@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/react-fr_0.1.3_1776088570241_0.4812434918813038"},"_hasShrinkwrap":false}},"time":{"created":"2026-04-13T13:16:28.386Z","modified":"2026-04-13T13:56:10.516Z","0.1.0":"2026-04-13T13:16:28.661Z","0.1.1":"2026-04-13T13:23:09.636Z","0.1.2":"2026-04-13T13:40:12.517Z","0.1.3":"2026-04-13T13:56:10.423Z"},"bugs":{"url":"https://github.com/Buy-and-Rent/react-fr/issues"},"license":"MIT","homepage":"https://buy-and-rent.github.io/react-fr/","keywords":["react","react-component","france","french","address","autocomplete","siret","siren","iban","phone","postal-code","code-postal","input","form","validation","api-gouv","ban","base-adresse-nationale","headless","typescript"],"repository":{"type":"git","url":"git+https://github.com/Buy-and-Rent/react-fr.git"},"description":"React input components for French SaaS apps - address, SIRET, IBAN, phone. No API key required.","maintainers":[{"name":"buyandrent","email":"buyandrent2025@gmail.com"}],"readme":"# @buyandrent/react-fr\n\n[![npm version](https://img.shields.io/npm/v/@buyandrent/react-fr)](https://www.npmjs.com/package/@buyandrent/react-fr)\n[![npm downloads](https://img.shields.io/npm/dm/@buyandrent/react-fr)](https://www.npmjs.com/package/@buyandrent/react-fr)\n[![bundle size](https://img.shields.io/bundlephobia/minzip/@buyandrent/react-fr)](https://bundlephobia.com/package/@buyandrent/react-fr)\n[![TypeScript](https://img.shields.io/badge/TypeScript-ready-blue)](https://www.typescriptlang.org/)\n[![license](https://img.shields.io/npm/l/@buyandrent/react-fr)](https://github.com/Buy-and-Rent/react-fr/blob/main/LICENSE)\n\nReact input components for French SaaS applications - address autocomplete, SIRET lookup, IBAN validation, phone formatting. No API key required.\n\n> **Used in production at [buyandrent.fr](https://buyandrent.fr)** | [Live demo (Storybook)](https://buy-and-rent.github.io/react-fr/)\n\n## Install\n\n```bash\nnpm i @buyandrent/react-fr\n```\n\n## Components\n\n### AddressInput\n\nAutocomplete input for French addresses using the Base Adresse Nationale API.\n\n```tsx\nimport { AddressInput } from \"@buyandrent/react-fr\";\n\nfunction MyForm() {\n  return (\n    <AddressInput\n      placeholder=\"Saisissez une adresse\"\n      onSelect={(address) => {\n        console.log(address.label);      // \"12 Rue de la Paix 75002 Paris\"\n        console.log(address.postcode);   // \"75002\"\n        console.log(address.lat);        // 48.8698\n      }}\n    />\n  );\n}\n```\n\n| Prop | Type | Default | Description |\n|------|------|---------|-------------|\n| `onSelect` | `(address: FrenchAddress) => void` | - | Called when an address is selected |\n| `debounceMs` | `number` | `300` | Debounce delay in ms |\n| `className` | `string` | - | CSS class name |\n| `style` | `CSSProperties` | - | Inline styles |\n| `...rest` | `InputHTMLAttributes` | - | All standard input props |\n\n### PostalCodeInput\n\nInput for French postal codes. Auto-suggests matching cities on 5-digit input.\n\n```tsx\nimport { PostalCodeInput } from \"@buyandrent/react-fr\";\n\nfunction MyForm() {\n  return (\n    <PostalCodeInput\n      placeholder=\"Code postal\"\n      onSelect={({ postcode, city, citycode }) => {\n        console.log(`${postcode} ${city}`); // \"75002 Paris\"\n      }}\n    />\n  );\n}\n```\n\n| Prop | Type | Default | Description |\n|------|------|---------|-------------|\n| `onSelect` | `(value: FrenchPostalCity) => void` | - | Called when a city is selected |\n| `className` | `string` | - | CSS class name |\n| `style` | `CSSProperties` | - | Inline styles |\n\n### SiretInput\n\nInput for French SIRET numbers with client-side Luhn validation and company lookup.\n\n```tsx\nimport { SiretInput } from \"@buyandrent/react-fr\";\n\nfunction MyForm() {\n  return (\n    <SiretInput\n      placeholder=\"Numéro SIRET\"\n      onFetch={(company) => {\n        console.log(company.name);       // \"GOOGLE FRANCE\"\n        console.log(company.siret);      // \"44306184100047\"\n        console.log(company.isActive);   // true\n      }}\n      onError={(error) => console.error(error)}\n    />\n  );\n}\n```\n\n| Prop | Type | Default | Description |\n|------|------|---------|-------------|\n| `onFetch` | `(company: FrenchCompany) => void` | - | Called with company data on valid SIRET |\n| `onError` | `(error: string) => void` | - | Called on validation or fetch error |\n| `className` | `string` | - | CSS class name |\n| `style` | `CSSProperties` | - | Inline styles |\n\n### IbanInput\n\nIBAN input with live formatting (groups of 4) and ISO 13616 checksum validation.\n\n```tsx\nimport { IbanInput } from \"@buyandrent/react-fr\";\n\nfunction MyForm() {\n  return (\n    <IbanInput\n      placeholder=\"FR76 XXXX XXXX ...\"\n      onChange={(value, isValid) => {\n        console.log(value);    // \"FR7630001007941234567890185\"\n        console.log(isValid);  // true\n      }}\n    />\n  );\n}\n```\n\n| Prop | Type | Default | Description |\n|------|------|---------|-------------|\n| `onChange` | `(value: string, isValid: boolean) => void` | - | Called on every change with raw value and validity |\n| `className` | `string` | - | CSS class name |\n| `style` | `CSSProperties` | - | Inline styles |\n\n### PhoneInput\n\nFrench phone number input with live formatting and validation.\n\n```tsx\nimport { PhoneInput } from \"@buyandrent/react-fr\";\n\nfunction MyForm() {\n  return (\n    <PhoneInput\n      placeholder=\"06 12 34 56 78\"\n      onChange={(value, isValid) => {\n        console.log(value);    // \"0612345678\"\n        console.log(isValid);  // true\n      }}\n    />\n  );\n}\n```\n\n| Prop | Type | Default | Description |\n|------|------|---------|-------------|\n| `onChange` | `(value: string, isValid: boolean) => void` | - | Called on every change with raw value and validity |\n| `className` | `string` | - | CSS class name |\n| `style` | `CSSProperties` | - | Inline styles |\n\n## Hooks\n\n### useAddressSearch\n\nStandalone hook for the French address API.\n\n```tsx\nimport { useAddressSearch } from \"@buyandrent/react-fr\";\n\nfunction MyComponent() {\n  const { results, isLoading } = useAddressSearch(\"12 rue de la paix paris\");\n  // results: FrenchAddress[]\n}\n```\n\n### useSiretLookup\n\nStandalone hook for SIRET company lookup.\n\n```tsx\nimport { useSiretLookup } from \"@buyandrent/react-fr\";\n\nfunction MyComponent() {\n  const { company, isLoading, error } = useSiretLookup(\"44306184100047\");\n  // company: FrenchCompany | null\n}\n```\n\n### isValidSiretFormat\n\nUtility function to validate SIRET format with Luhn algorithm.\n\n```tsx\nimport { isValidSiretFormat } from \"@buyandrent/react-fr\";\n\nisValidSiretFormat(\"44306184100047\"); // true\nisValidSiretFormat(\"12345678901234\"); // false\n```\n\n## No API key required\n\nAll API calls use free, public French government APIs:\n\n| Component | API | Documentation |\n|-----------|-----|---------------|\n| AddressInput, PostalCodeInput | [api-adresse.data.gouv.fr](https://adresse.data.gouv.fr/api-doc/adresse) | Base Adresse Nationale - free, no key, no rate limit for reasonable use |\n| SiretInput | [recherche-entreprises.api.gouv.fr](https://recherche-entreprises.api.gouv.fr) | Recherche Entreprises - free, no key |\n| IbanInput, PhoneInput | None | Client-side validation only |\n\n## Styling\n\nAll components are headless (unstyled) by default. Pass `className` and `style` props to style them, or wrap them in your design system.\n\n## License\n\nMIT\n","readmeFilename":"README.md"}