{"_id":"@anan.k/intl-message-editable","_rev":"9-23df85fbc5259c59392b67208f22fc79","name":"@anan.k/intl-message-editable","dist-tags":{"latest":"1.0.8"},"versions":{"0.1.1":{"name":"@anan.k/intl-message-editable","version":"0.1.1","keywords":["react-intl","i18n","translation","editable"],"license":"MIT","_id":"@anan.k/intl-message-editable@0.1.1","maintainers":[{"name":"anan.k","email":"anan.kidchai@gmail.com"}],"dist":{"shasum":"3f535a3e27ba70f672f19b53eea594543b2faf4f","tarball":"https://registry.npmjs.org/@anan.k/intl-message-editable/-/intl-message-editable-0.1.1.tgz","fileCount":8,"integrity":"sha512-G8SNH+AlSBuW0hKg1oOcvCcweYy9LUJzsTJz4owaPur/tJVUeK4fwfFmjWGHCiW+CxrwVMVKMuFwCTCTuaChmQ==","signatures":[{"sig":"MEUCIDEMKlJCZu5LnYYrPMZNP5pFVYcjFWVEGOKeTzQrbGMnAiEAj22sDfvx9RMQvW6ArZAQPcJ1csRJkBHxmot/mJrbeC0=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":11364},"main":"src/index.js","module":"src/index.js","gitHead":"7e2962ea83cba10e31385d3b00646476fbea8545","_npmUser":{"name":"anan.k","email":"anan.kidchai@gmail.com"},"_npmVersion":"11.6.2","description":"Editable react-intl message with built-in translation modal","directories":{},"_nodeVersion":"24.11.1","_hasShrinkwrap":false,"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0","react-intl":">=5.0.0","reactstrap":">=8.0.0"},"_npmOperationalInternal":{"tmp":"tmp/intl-message-editable_0.1.1_1783397655246_0.6488486458202871","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"@anan.k/intl-message-editable","version":"1.0.1","keywords":["react-intl","i18n","translation","editable"],"license":"MIT","_id":"@anan.k/intl-message-editable@1.0.1","maintainers":[{"name":"anan.k","email":"anan.kidchai@gmail.com"}],"dist":{"shasum":"539689036133e8539f2bb37ef7140d75c74834ca","tarball":"https://registry.npmjs.org/@anan.k/intl-message-editable/-/intl-message-editable-1.0.1.tgz","fileCount":12,"integrity":"sha512-jnA+G7DRku8A8fkKGWDw9aXvBeVmLme3+N0mQSR/tqft6c0acNsjs2AgDovn9eO2lNIeZVC3xeLtBfBgzaMB5Q==","signatures":[{"sig":"MEUCIQCPJSUlLIdYvsxZNdsFFykHu8QMh220hLAh1AqKydLr5AIgNWlGykbApe1n7dRuPUXwdIGbRLarir9XZ1Z6HQYAX5w=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":16526},"main":"src/index.js","module":"src/index.js","exports":{".":"./src/index.js","./react-intl":"./src/react-intl.js"},"gitHead":"7e2962ea83cba10e31385d3b00646476fbea8545","_npmUser":{"name":"anan.k","email":"anan.kidchai@gmail.com"},"_npmVersion":"11.6.2","description":"Editable react-intl message with built-in translation modal","directories":{},"_nodeVersion":"24.11.1","_hasShrinkwrap":false,"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0","react-intl":">=5.0.0","reactstrap":">=8.0.0"},"_npmOperationalInternal":{"tmp":"tmp/intl-message-editable_1.0.1_1783488386101_0.7113224383910368","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"name":"@anan.k/intl-message-editable","version":"1.0.2","keywords":["react-intl","i18n","translation","editable"],"license":"MIT","_id":"@anan.k/intl-message-editable@1.0.2","maintainers":[{"name":"anan.k","email":"anan.kidchai@gmail.com"}],"dist":{"shasum":"bf9d3c9e06f48f9ade3e799185e39f2f09e92ccd","tarball":"https://registry.npmjs.org/@anan.k/intl-message-editable/-/intl-message-editable-1.0.2.tgz","fileCount":12,"integrity":"sha512-NqCAmeQcnjJ0Tfvw4RkvxcN1zsOyww3FnuFRupFrYAxuiUFH6K6jgpj8h3XZnqoHMWGSRRqBpLQ2n6vvPaHjuA==","signatures":[{"sig":"MEQCIFLsVUabTeYOVXtMG4E1QOhvrVP7SPJX7z0myOfj8cIRAiA0ateC4L7Sq+oquoJPWHGYDy8GxVkdd7kdKQZ3jQJM8g==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":16755},"main":"src/index.js","module":"src/index.js","exports":{".":"./src/index.js","./react-intl":"./src/react-intl.js"},"gitHead":"7e2962ea83cba10e31385d3b00646476fbea8545","_npmUser":{"name":"anan.k","email":"anan.kidchai@gmail.com"},"_npmVersion":"11.6.2","description":"Editable react-intl message with built-in translation modal","directories":{},"_nodeVersion":"24.11.1","_hasShrinkwrap":false,"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0","react-intl":">=5.0.0","reactstrap":">=8.0.0"},"_npmOperationalInternal":{"tmp":"tmp/intl-message-editable_1.0.2_1783490677784_0.40163880401383745","host":"s3://npm-registry-packages-npm-production"}},"1.0.3":{"name":"@anan.k/intl-message-editable","version":"1.0.3","keywords":["react-intl","i18n","translation","editable"],"license":"MIT","_id":"@anan.k/intl-message-editable@1.0.3","maintainers":[{"name":"anan.k","email":"anan.kidchai@gmail.com"}],"dist":{"shasum":"462c783a2090de2fb41208dc2b7886641bc9394b","tarball":"https://registry.npmjs.org/@anan.k/intl-message-editable/-/intl-message-editable-1.0.3.tgz","fileCount":12,"integrity":"sha512-Yd2qPY6W7eeSJ2e57xvdcaMpR6LPFsJxE5HFo/MLVVheIPnrakfnbk6iG9s5E6mtt314HCplD/jqJXFuNo2x8A==","signatures":[{"sig":"MEQCID43QZMZHnUP1A3ftCfGB/t8yBmwfGKpskNzRq8MfFHKAiAXZoxJdVHzLGHTnQYtVmf/9/2WpsVGGKiaH5Q4qsiRnw==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":17390},"main":"src/index.js","module":"src/index.js","exports":{".":"./src/index.js","./react-intl":"./src/react-intl.js"},"gitHead":"7e2962ea83cba10e31385d3b00646476fbea8545","_npmUser":{"name":"anan.k","email":"anan.kidchai@gmail.com"},"_npmVersion":"11.6.2","description":"Editable react-intl message with built-in translation modal","directories":{},"_nodeVersion":"24.11.1","_hasShrinkwrap":false,"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0","react-intl":">=5.0.0","reactstrap":">=8.0.0"},"_npmOperationalInternal":{"tmp":"tmp/intl-message-editable_1.0.3_1783491073049_0.46635217559686737","host":"s3://npm-registry-packages-npm-production"}},"1.0.4":{"name":"@anan.k/intl-message-editable","version":"1.0.4","keywords":["react-intl","i18n","translation","editable"],"license":"MIT","_id":"@anan.k/intl-message-editable@1.0.4","maintainers":[{"name":"anan.k","email":"anan.kidchai@gmail.com"}],"dist":{"shasum":"6c83f06231203280285f326fc12ff4008848f16a","tarball":"https://registry.npmjs.org/@anan.k/intl-message-editable/-/intl-message-editable-1.0.4.tgz","fileCount":12,"integrity":"sha512-b3xCo0jQiy8rUWhW7QEDbvC6+ZfNOWfTGunjoRkqwGoMWxPBEyvQ5G0sin2SiBCVWfcfuEM6U9Zx+0fmPWTw0Q==","signatures":[{"sig":"MEUCIFnR3ELsQsjYFAUpAJ36k9EI2W7SPEzay+pag79tGJx4AiEA6UGHRczc5hrF+St8xXsyO/XoizSy1zov4EPsA42yGHU=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":17491},"main":"src/index.js","module":"src/index.js","exports":{".":"./src/index.js","./react-intl":"./src/react-intl.js"},"gitHead":"7e2962ea83cba10e31385d3b00646476fbea8545","_npmUser":{"name":"anan.k","email":"anan.kidchai@gmail.com"},"_npmVersion":"11.6.2","description":"Editable react-intl message with built-in translation modal","directories":{},"_nodeVersion":"24.11.1","_hasShrinkwrap":false,"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0","react-intl":">=5.0.0","reactstrap":">=8.0.0"},"_npmOperationalInternal":{"tmp":"tmp/intl-message-editable_1.0.4_1783499808859_0.6320306412192214","host":"s3://npm-registry-packages-npm-production"}},"1.0.5":{"name":"@anan.k/intl-message-editable","version":"1.0.5","keywords":["react-intl","i18n","translation","editable"],"license":"MIT","_id":"@anan.k/intl-message-editable@1.0.5","maintainers":[{"name":"anan.k","email":"anan.kidchai@gmail.com"}],"dist":{"shasum":"6ae97333acb07a974df2bdc9ff3d675cc1296507","tarball":"https://registry.npmjs.org/@anan.k/intl-message-editable/-/intl-message-editable-1.0.5.tgz","fileCount":12,"integrity":"sha512-OWTK3qGFXLZVi+UndD9eyfa2IzgV4rpp4FZCqy7JZrbJzmRC2aGc4f2VZ7xTSPuCBGyy8Dp2wtq/id1hv/LclA==","signatures":[{"sig":"MEUCIQCNg4u5sfXoRLf2wBa1braojRdCnqapktAwREaSo5CKgwIgGwZxDc95I6/1fL7BqC2gobEsYrywsohMi+C0r1UnxbU=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":17544},"main":"src/index.js","module":"src/index.js","exports":{".":"./src/index.js","./react-intl":"./src/react-intl.js"},"gitHead":"7e2962ea83cba10e31385d3b00646476fbea8545","_npmUser":{"name":"anan.k","email":"anan.kidchai@gmail.com"},"_npmVersion":"11.6.2","description":"Editable react-intl message with built-in translation modal","directories":{},"_nodeVersion":"24.11.1","_hasShrinkwrap":false,"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0","react-intl":">=5.0.0","reactstrap":">=8.0.0"},"_npmOperationalInternal":{"tmp":"tmp/intl-message-editable_1.0.5_1783500111991_0.15309214673467064","host":"s3://npm-registry-packages-npm-production"}},"1.0.6":{"name":"@anan.k/intl-message-editable","version":"1.0.6","keywords":["react-intl","i18n","translation","editable"],"license":"MIT","_id":"@anan.k/intl-message-editable@1.0.6","maintainers":[{"name":"anan.k","email":"anan.kidchai@gmail.com"}],"dist":{"shasum":"0f65011c24959b65860bc9499c13c3ad5bd5a0a5","tarball":"https://registry.npmjs.org/@anan.k/intl-message-editable/-/intl-message-editable-1.0.6.tgz","fileCount":12,"integrity":"sha512-tL1MmlSbfkzvqqpjPApvWYnZM9kQzmzA3qpzNm+7LEvehf+FT9TFG7nJuGu7ze5jRDqRY7K/SEnu/U9LSH4rvw==","signatures":[{"sig":"MEUCIHmk/Yf5btPuGNf6kAOAu0YcykH3TDbRNuabe74vPl9hAiEAt+wncXzXh16tk26w3/Skps9YHw5ZRPR8oezbePttoRU=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":17549},"main":"src/index.js","module":"src/index.js","exports":{".":"./src/index.js","./react-intl":"./src/react-intl.js"},"gitHead":"7e2962ea83cba10e31385d3b00646476fbea8545","_npmUser":{"name":"anan.k","email":"anan.kidchai@gmail.com"},"_npmVersion":"11.6.2","description":"Editable react-intl message with built-in translation modal","directories":{},"_nodeVersion":"24.11.1","_hasShrinkwrap":false,"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0","react-intl":">=5.0.0","reactstrap":">=8.0.0"},"_npmOperationalInternal":{"tmp":"tmp/intl-message-editable_1.0.6_1783504383062_0.9145450439257881","host":"s3://npm-registry-packages-npm-production"}},"1.0.7":{"name":"@anan.k/intl-message-editable","version":"1.0.7","keywords":["react-intl","i18n","translation","editable"],"license":"MIT","_id":"@anan.k/intl-message-editable@1.0.7","maintainers":[{"name":"anan.k","email":"anan.kidchai@gmail.com"}],"dist":{"shasum":"10d401ef794778b98fc70ae310e4969800a0b754","tarball":"https://registry.npmjs.org/@anan.k/intl-message-editable/-/intl-message-editable-1.0.7.tgz","fileCount":12,"integrity":"sha512-dVycq9x2QN5ucN1FsdOaBmHotXmHQkvjgMnmq6YL0IUpem4eZgH+lRUtVRQZ48tp4OEQl6Ey+y4aMkNLmP2/hA==","signatures":[{"sig":"MEYCIQCGYU1tx/sTq5U28Hn1gVQuKaPKeA7T7Uq/xLfWd+sZRQIhAJwX6fA55JsJ1cDCPaSDUVgRN+gr+ZEX5r/WrUimVVoO","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":17797},"main":"src/index.js","module":"src/index.js","exports":{".":"./src/index.js","./react-intl":"./src/react-intl.js"},"gitHead":"7e2962ea83cba10e31385d3b00646476fbea8545","_npmUser":{"name":"anan.k","email":"anan.kidchai@gmail.com"},"_npmVersion":"11.6.2","description":"Editable react-intl message with built-in translation modal","directories":{},"_nodeVersion":"24.11.1","_hasShrinkwrap":false,"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0","react-intl":">=5.0.0","reactstrap":">=8.0.0"},"_npmOperationalInternal":{"tmp":"tmp/intl-message-editable_1.0.7_1783507592795_0.8555994552162915","host":"s3://npm-registry-packages-npm-production"}},"1.0.8":{"name":"@anan.k/intl-message-editable","version":"1.0.8","description":"Editable react-intl message with built-in translation modal","main":"src/index.js","module":"src/index.js","exports":{".":"./src/index.js","./react-intl":"./src/react-intl.js"},"license":"MIT","peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0","react-intl":">=5.0.0","reactstrap":">=8.0.0"},"keywords":["react-intl","i18n","translation","editable"],"gitHead":"29eb436331b5712e576f43e30046cf3bb623e84e","_id":"@anan.k/intl-message-editable@1.0.8","_nodeVersion":"24.11.1","_npmVersion":"11.6.2","dist":{"integrity":"sha512-f/zHG/GeSMfwuV0H0oeQgxrfJMChdKYQfCa9RuwMmm3vpEc3pdeJRsXBCrHIRs8aQQ6Ffh8ATtROS5HsMGrO8Q==","shasum":"f3e7bc73e3000627a16b145ed2ba3b87c86cf618","tarball":"https://registry.npmjs.org/@anan.k/intl-message-editable/-/intl-message-editable-1.0.8.tgz","fileCount":12,"unpackedSize":18238,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCICHtMKSSJjL+hVIVy9bgu4ziaW//kYh8NeBV/DXYThm9AiEAxeUqVAahnnJqMn7Djwcz4zquPjNzdtcMMvgHytDYC/0="}]},"_npmUser":{"name":"anan.k","email":"anan.kidchai@gmail.com"},"directories":{},"maintainers":[{"name":"anan.k","email":"anan.kidchai@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/intl-message-editable_1.0.8_1787741841157_0.31378222491467955"},"_hasShrinkwrap":false}},"time":{"created":"2026-07-07T04:14:15.092Z","modified":"2026-08-26T10:57:21.440Z","0.1.1":"2026-07-07T04:14:15.397Z","1.0.1":"2026-07-08T05:26:26.244Z","1.0.2":"2026-07-08T06:04:37.922Z","1.0.3":"2026-07-08T06:11:13.174Z","1.0.4":"2026-07-08T08:36:49.054Z","1.0.5":"2026-07-08T08:41:52.111Z","1.0.6":"2026-07-08T09:53:03.218Z","1.0.7":"2026-07-08T10:46:32.921Z","1.0.8":"2026-08-26T10:57:21.287Z"},"license":"MIT","keywords":["react-intl","i18n","translation","editable"],"description":"Editable react-intl message with built-in translation modal","maintainers":[{"name":"anan.k","email":"anan.kidchai@gmail.com"}],"readme":"# @anan.k/intl-message-editable\r\n\r\nEditable translation UI for react-intl.\r\n\r\n## Compat import\r\n\r\nIf you want a react-intl-like import surface, use:\r\n\r\n```jsx\r\nimport { IntlProvider, FormattedMessage, useIntl, injectIntl } from '@anan.k/intl-message-editable/react-intl';\r\n```\r\n\r\nThis keeps most of the old API shape.\r\n\r\n- `FormattedMessage` becomes clickable when edit mode is enabled\r\n- `useIntl()` still returns the normal intl object\r\n- `useIntl()` also adds `getEditableProps()` and `formatEditableMessage()`\r\n\r\nImportant:\r\n\r\n- `intl.formatMessage()` and `intl.messages[key]` return strings, so they cannot become clickable by themselves\r\n- for string-based rendering, wrap the rendered element and spread `intl.getEditableProps(...)`\r\n\r\n## Install\r\n\r\nnpm install @anan.k/intl-message-editable\r\n\r\nPeer deps: react, react-dom, react-intl, reactstrap\r\n\r\n## Usage\r\n\r\n```jsx\r\nimport { EditableIntlProvider, IntlMessageEditable, useEditableIntl } from '@anan.k/intl-message-editable';\r\n\r\nfunction ToggleButton() {\r\n  const { isEditEnabled, setIsEditEnabled } = useEditableIntl();\r\n  return (\r\n    <button type=\"button\" onClick={() => setIsEditEnabled(!isEditEnabled)}>\r\n      {isEditEnabled ? 'Disable edit' : 'Enable edit'}\r\n    </button>\r\n  );\r\n}\r\n\r\nfunction App({ saveChange, reloadLangJson, companyId, systemAbbr }) {\r\n  return (\r\n    <EditableIntlProvider\r\n      onSave={async (payload) => {\r\n        await saveChange(payload);\r\n        await reloadLangJson();\r\n      }}\r\n      initialCompanyId={companyId}\r\n      initialSystemAbbr={systemAbbr}\r\n      defaultLanguageCode=\"th-TH\"\r\n      languages={[\"th-TH\", \"en-US\"]}\r\n    >\r\n      <ToggleButton />\r\n      <IntlMessageEditable id=\"menu.home\" defaultMessage=\"Home\" />\r\n    </EditableIntlProvider>\r\n  );\r\n}\r\n```\r\n\r\n## API\r\n\r\n### EditableIntlProvider props\r\n\r\n- onSave(payload, ctx): required async callback\r\n- initialCompanyId: optional\r\n- initialSystemAbbr: optional\r\n- defaultLanguageCode: default th-TH\r\n- languages: default [th-TH, en-US]\r\n- storageKey: default enableEditTranslation\r\n- modalTitle, submitText, closeText: UI text\r\n\r\n### useEditableIntl()\r\n\r\n- isEditEnabled\r\n- setIsEditEnabled(boolean)\r\n- openEditor(payload)\r\n- closeEditor()\r\n","readmeFilename":"README.md"}