{"_id":"@dlabs71/d-vue-localization","_rev":"2-2085adf53c2868d45d029afc617a7711","name":"@dlabs71/d-vue-localization","dist-tags":{"latest":"1.1.1"},"versions":{"1.0.0":{"name":"@dlabs71/d-vue-localization","version":"1.0.0","keywords":["local","vue","vuejs","localization","l10n","n18i"],"author":{"name":"Danila Ivanov","email":"danila.a.ivanov@d-labs.ru"},"license":"MIT","_id":"@dlabs71/d-vue-localization@1.0.0","maintainers":[{"name":"dlabs71","email":"danila.a.ivanov@d-labs.ru"}],"homepage":"https://github.com/dlabs71/d-vue-localization#readme","bugs":{"url":"https://github.com/dlabs71/d-vue-localization/issues"},"dist":{"shasum":"fbb224fd62692efdf1a08ed7e85c0b0c0c39e631","tarball":"https://registry.npmjs.org/@dlabs71/d-vue-localization/-/d-vue-localization-1.0.0.tgz","fileCount":28,"integrity":"sha512-6hB1LuEGjcpaGzyXwpM7lnAUy7H2bX2qqImP9ATE/IIEKyHD3jyaWvE7eMOcdvEWpZyiurQ768KV3raTzGZoHQ==","signatures":[{"sig":"MEUCIEEprf/QvkDmr3ktHzjYTysPjgij0SISODaoMh3OCpWnAiEA+eHLdGKzA9y6iF75o82rircuXxELlwkXpnvsY/ZpzxI=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":417681,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjwDeHACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmor3A//XpNILpetu2Kk1IKVmOspT+Eqjgh+biHYeKo8cMuyDH2Ex2jA\r\nTjt60gmNmiZsF8Nq3XzsdeYLnYhxiMpEcWAkkXtL7wSNKTy9MWBIzcn/4Bko\r\nnaZ4yw8tLmD7R5o5mKXw0OoYqlYJwmxVOhb12w9gF///6GgGg2hgYU308WKf\r\nUfcjAlB3G0Hie5vKz0xEVvdNWo1twz/lw8TeejWS4CC6COnqK22x5M1KYksU\r\nuoZHmTtEJ1cKNsnvh7OP7Y4nsE6MJw2sEN78MnLK5qaKzMT9ttOYEitOmD64\r\nEfrTENbpqao1IRXX/I7HdJzahM+CUzUCdqUDAglcBF8RSUSGw94UsnmXOTde\r\nvULJiE2VOFHGLiGbYYNffVblebPnGaUQ7kjf6sgujhEO0sreqVP761rg6CK6\r\nWZVYnoaFIucVORrNiI8yK+UTJLJumjQAjxrYvjDlkZyL0rfSFjsu2ttSYQdq\r\nuE+uu4Gf+jETwGKKY/B8TjLTMUqw6OZgGLU5eM8cy11r8dpDrCg8diyVWPES\r\n+w2Zs/saw+wUBVRrpow9phMf01Ho2f5RQtIIje6LzQXsl7GVsrtKZLJ0wTQG\r\nXwpOUTFFvkwhKUl3qg9yzYf0tT9grrW4BE2YT8zDQDWbVS/OdWbm7XxxLsC/\r\nte9rRlNvE4VJ14D1rvWD6xEeCnvr9hulXuw=\r\n=e+cJ\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/d-vue-localization.umd.min.js","module":"dist/d-vue-localization.esm.min.js","engines":{"node":">=14.18.2"},"gitHead":"18576a590d84af8729a2f6b90de914d691ff7ce2","private":false,"scripts":{"lint":"npx eslint --fix ./src","test":"jest","build":"npx rollup -c rollup.config.mjs"},"_npmUser":{"name":"dlabs71","email":"danila.a.ivanov@d-labs.ru"},"repository":{"url":"git+https://github.com/dlabs71/d-vue-localization.git","type":"git"},"_npmVersion":"8.6.0","description":"Library for add support localization","directories":{},"_nodeVersion":"14.18.2","publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^2.6.14","jest":"^29.3.1","vuex":"=3.6.2","eslint":"^8.26.0","rollup":"^2.68.0","requirejs":"^2.3.6","@babel/cli":"^7.19.3","babel-jest":"^29.3.1","@babel/core":"^7.19.6","@babel/register":"^7.18.9","@vue/test-utils":"^1.3.3","@babel/preset-env":"=7.18.10","@babel/eslint-parser":"^7.19.1","@rollup/plugin-babel":"^6.0.2","eslint-plugin-import":"^2.26.0","rollup-plugin-delete":"^2.0.0","rollup-plugin-terser":"^7.0.2","jest-environment-jsdom":"^29.3.1","@rollup/plugin-commonjs":"^23.0.2","eslint-config-airbnb-base":"^15.0.0","@rollup/plugin-node-resolve":"^15.0.1","rollup-plugin-node-externals":"^5.0.2","@babel/plugin-transform-runtime":"^7.19.6"},"peerDependencies":{"vue":"2.x.x","vuex":"3.x.x"},"_npmOperationalInternal":{"tmp":"tmp/d-vue-localization_1.0.0_1673541511466_0.550558263450273","host":"s3://npm-registry-packages"}},"1.1.0":{"name":"@dlabs71/d-vue-localization","version":"1.1.0","keywords":["local","vue","vuejs","localization","l10n","n18i"],"author":{"name":"Danila Ivanov","email":"danila.a.ivanov@d-labs.ru"},"license":"MIT","_id":"@dlabs71/d-vue-localization@1.1.0","maintainers":[{"name":"dlabs71","email":"danila.a.ivanov@d-labs.ru"}],"homepage":"https://github.com/dlabs71/d-vue-localization#readme","bugs":{"url":"https://github.com/dlabs71/d-vue-localization/issues"},"dist":{"shasum":"ee5b243e6b168417f2248849774dcf4124920a3b","tarball":"https://registry.npmjs.org/@dlabs71/d-vue-localization/-/d-vue-localization-1.1.0.tgz","fileCount":30,"integrity":"sha512-NqYx5OZclr4hbBeYWV/8DwG5esGhBbOczW8gTgLqG+Y2bq8YMSTUoeAh6/H6D9YrFpKOrQyJCPzCk+ePLhMygw==","signatures":[{"sig":"MEYCIQD2qmAB13mWkuMKWDJCjq2vVSpFrLAkuM1vKGgrjRiwbwIhAN3kZ7rhVyN89+06fSueAt6v52NiOGFbfnPDyK3V+CDp","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":269767},"main":"dist/d-vue-localization.umd.min.js","module":"dist/d-vue-localization.esm.min.js","engines":{"node":">=14.18.2"},"gitHead":"e58df0cdecdc4792846d7ee60220a5404eeaf5c2","private":false,"scripts":{"lint":"npx eslint --fix ./src","test":"jest","build":"npx rollup -c rollup.config.mjs"},"_npmUser":{"name":"dlabs71","email":"danila.a.ivanov@d-labs.ru"},"repository":{"url":"git+https://github.com/dlabs71/d-vue-localization.git","type":"git"},"_npmVersion":"8.19.4","description":"Library for add support localization","directories":{},"_nodeVersion":"16.20.2","publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"vue":"=3.5.13","jest":"^29.7.0","vuex":"=4.1.0","eslint":"^8.26.0","rollup":"^2.68.0","requirejs":"^2.3.6","@babel/cli":"^7.19.3","babel-jest":"^29.7.0","@babel/core":"^7.19.6","@babel/register":"^7.18.9","@vue/test-utils":"^2.4.6","@babel/preset-env":"=7.18.10","@babel/eslint-parser":"^7.19.1","@rollup/plugin-babel":"^6.0.2","eslint-plugin-import":"^2.26.0","rollup-plugin-delete":"^2.0.0","rollup-plugin-terser":"^7.0.2","jest-environment-jsdom":"^29.7.0","@rollup/plugin-commonjs":"^23.0.2","eslint-config-airbnb-base":"^15.0.0","@rollup/plugin-node-resolve":"^15.0.1","rollup-plugin-node-externals":"^5.0.2","@babel/plugin-transform-runtime":"^7.19.6"},"peerDependencies":{"vue":"3.x.x","vuex":"4.x.x"},"_npmOperationalInternal":{"tmp":"tmp/d-vue-localization_1.1.0_1734534407150_0.4900618951711122","host":"s3://npm-registry-packages-npm-production"}},"1.1.1":{"name":"@dlabs71/d-vue-localization","private":false,"version":"1.1.1","author":{"name":"Danila Ivanov","email":"danila.a.ivanov@d-labs.ru"},"description":"Library for add support localization","license":"MIT","scripts":{"build":"npx rollup -c rollup.config.mjs","test":"jest","lint":"npx eslint --fix ./src"},"devDependencies":{"@babel/cli":"^7.19.3","@babel/core":"^7.19.6","@babel/plugin-transform-runtime":"^7.19.6","@babel/preset-env":"=7.18.10","@babel/register":"^7.18.9","@babel/eslint-parser":"^7.19.1","@rollup/plugin-babel":"^6.0.2","@rollup/plugin-commonjs":"^23.0.2","@rollup/plugin-node-resolve":"^15.0.1","@vue/test-utils":"^2.4.6","babel-jest":"^29.7.0","eslint":"^8.26.0","eslint-config-airbnb-base":"^15.0.0","eslint-plugin-import":"^2.26.0","jest":"^29.7.0","jest-environment-jsdom":"^29.7.0","requirejs":"^2.3.6","rollup":"^2.68.0","rollup-plugin-delete":"^2.0.0","rollup-plugin-node-externals":"^5.0.2","rollup-plugin-terser":"^7.0.2","vue":"=3.5.13","vuex":"=4.1.0"},"peerDependencies":{"vue":"3.x.x","vuex":"4.x.x"},"main":"dist/d-vue-localization.umd.min.js","module":"dist/d-vue-localization.esm.min.js","repository":{"type":"git","url":"git+https://github.com/dlabs71/d-vue-localization.git"},"keywords":["local","vue","vuejs","localization","l10n","n18i"],"bugs":{"url":"https://github.com/dlabs71/d-vue-localization/issues"},"homepage":"https://github.com/dlabs71/d-vue-localization#readme","engines":{"node":">=14.18.2"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"gitHead":"258f2d441d6dd810326e38183df841fd77a4f27e","_id":"@dlabs71/d-vue-localization@1.1.1","_nodeVersion":"16.20.2","_npmVersion":"8.19.4","dist":{"integrity":"sha512-T5Ee+u5mb3XO4fG/gwhuXGod3gkc6NQ5EHWzLmIwBuYdYM/VSg2TNRcf8QFkJa051ZNMKWVPCNU6/kFJEYMDdw==","shasum":"8da79200437ac3b5df28bc65cb7dea5b82473533","tarball":"https://registry.npmjs.org/@dlabs71/d-vue-localization/-/d-vue-localization-1.1.1.tgz","fileCount":30,"unpackedSize":269751,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCaEDkiyXbOtqA0kl0YE+DCjqzC/FqgSVMU8GZtIW1MwwIgcJgEItRu/2QbW1E0zMu2fPza4wD2KtRvVIJziiKE5FE="}]},"_npmUser":{"name":"dlabs71","email":"danila.a.ivanov@d-labs.ru"},"directories":{},"maintainers":[{"name":"dlabs71","email":"danila.a.ivanov@d-labs.ru"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/d-vue-localization_1.1.1_1734534719068_0.11077088539393021"},"_hasShrinkwrap":false}},"time":{"created":"2023-01-12T16:38:31.373Z","modified":"2024-12-18T15:11:59.409Z","1.0.0":"2023-01-12T16:38:31.621Z","1.1.0":"2024-12-18T15:06:47.333Z","1.1.1":"2024-12-18T15:11:59.268Z"},"bugs":{"url":"https://github.com/dlabs71/d-vue-localization/issues"},"author":{"name":"Danila Ivanov","email":"danila.a.ivanov@d-labs.ru"},"license":"MIT","homepage":"https://github.com/dlabs71/d-vue-localization#readme","keywords":["local","vue","vuejs","localization","l10n","n18i"],"repository":{"type":"git","url":"git+https://github.com/dlabs71/d-vue-localization.git"},"description":"Library for add support localization","maintainers":[{"name":"dlabs71","email":"danila.a.ivanov@d-labs.ru"}],"readme":"# D-vue-localization\n\n[![NPM Version][npm-image]][npm-url]\n[![License][license-image]][license-url]\n\nБиблиотека для упрощения реализации механизма локализации во Vue.js приложении\n\n# Установка NPM\n\n```sh\nnpm i @dlabs71/d-vue-localization\n```\n\n# Использование\n\nДанная библиотека может быть использована в любом приложении основанном на стеке Vue.js 2/3 и Vuex 3/4.\n\nD-vue-localization предоставляет Vue плагин при подключении которого добавляется глобальный mixin и vuex store module.\n\n**`main.js`**\n\n```js\nimport Vue from 'vue';\nimport store from '@/store';\nimport router from '@/router';\nimport App from '@/App';\nimport DL10nPlugin from '@dlabs71/d-vue-localization';\n\nconst lang2messages = {\n    \"en\": {\n        MAIN_FORM: {\n            ACCEPT_BTN_LABEL: \"Accept\",\n            CANCEL_BTN_LABEL: \"Cancel\",\n            PLEASE_WAIT: \"Please wait ......\"\n        }\n    },\n    \"ru\": {\n        MAIN_FORM: {\n            ACCEPT_BTN_LABEL: \"Принять\",\n            CANCEL_BTN_LABEL: \"Отмена\",\n            PLEASE_WAIT: \"Пожалуйста подождите ......\"\n        }\n    }\n};\n\nVue.use(DL10nPlugin, {\n    lang2messages: lang2messages,\n    store: store\n});\n\nnew Vue({\n    components: {App},\n    router,\n    store,\n    template: '<App/>'\n}).$mount('#app');\n```\n\n**`App.vue (For Vue 2)`**\n\n```vue\n\n<template>\n    <div id=\"d-app\" class=\"app d-app\">\n        <div v-if=\"loading\" class=\"prepare-overlay\">\n            <span>{{ L10N_FORM.PLEASE_WAIT }}</span>\n        </div>\n        <v-app v-else>\n            <v-btn text @click=\"acceptHandler\">\n                {{ L10N_FORM.ACCEPT_BTN_LABEL }}\n            </v-btn>\n            <v-btn text @click=\"cancelHandler\">\n                {{ L10N_FORM.CANCEL_BTN_LABEL }}\n            </v-btn>\n        </v-app>\n    </div>\n</template>\n\n<script>\n    export default {\n        name: 'app',\n        data() {\n            return {}\n        },\n        methods: {\n            acceptHandler() {\n            },\n            cancelHandler() {\n            }\n        },\n        computed: {\n            L10N_FORM() {\n                return this.getDL10nNameByCode('MAIN_FORM');\n            }\n        },\n        mounted() {\n            if (!this.getDL10nLang()) {\n                this.setDL10nLang(\"ru\");\n            }\n        }\n    }\n</script>\n```\n\n**`App.vue (For Vue 3, Composition API)`**\n\n```vue\n\n<template>\n    <div id=\"d-app\" class=\"app d-app\">\n        <div v-if=\"loading\" class=\"prepare-overlay\">\n            <span>{{ L10N_FORM.PLEASE_WAIT }}</span>\n        </div>\n        <v-app v-else>\n            <v-btn text @click=\"acceptHandler\">\n                {{ L10N_FORM.ACCEPT_BTN_LABEL }}\n            </v-btn>\n            <v-btn text @click=\"cancelHandler\">\n                {{ L10N_FORM.CANCEL_BTN_LABEL }}\n            </v-btn>\n        </v-app>\n    </div>\n</template>\n\n<script setup>\n    import {computed, onMounted} from \"vue\";\n    import {useDL10n} from '@dlabs71/d-vue-localization';\n\n    const l10n = useDL10n();\n\n    const L10N_FORM = computed(() => l10n.getDL10nNameByCode(\"LOGIN_PAGE\"));\n\n    const acceptHandler = () => {\n    }\n    const cancelHandler = () => {\n    }\n\n    onMounted(() => {\n        if (!l10n.getDL10nLang()) {\n            l10n.setDL10nLang(\"ru\");\n        }\n    });\n</script>\n```\n\n# Документация\n\n## Оглавление\n\n* [1. Vue плагин DL10nPlugin](#section1)\n* [2. Vue миксин DL10nMixin](#section2)\n    * [2.1. Свойства data](#section21)\n    * [2.2. Методы](#section22)\n    * [2.3. Вычисляемые свойства (computed)](#section23)\n    * [2.4. Блок watch](#section24)\n    * [2.5. Хук created()](#section25)\n* [3. Модуль Vuex DL10nStoreModule](#section3)\n* [4. Класс DL10n](#section4)\n    * [4.1. Статичный геттер instance](#section41)\n    * [4.2. Метод addLang](#section42)\n    * [4.3. Метод addMessagesToLang](#section43)\n    * [4.4. Метод setLang2Messages](#section44)\n    * [4.5. Метод loadLang](#section45)\n    * [4.6. Метод getMessages](#section46)\n* [5. Vue3 composable](#section5)\n\n## <h2 id=\"section1\">1. Vue плагин DL10nPlugin</h2>\n\nVue плагин **DL10nPlugin** предназначен для быстрого подключения библиотеки к Vue.js приложению. После подключения\nпоявляется доступ к методам/computed свойствам/data предоставляемыми vue mixin ([DL10nMixin](#section2)). А также, при\nуказании экземпляра vuex хранилища, автоматически регистрируется vuex store module ([DL10nStoreModule](section3)).\nПараметры плагина описаны в таблице ниже:\n\n| **Параметр**  | **Тип** | **Обязательность** | **Пример**                                        | **Описание**                            |\n|:--------------|:--------|:-------------------|:--------------------------------------------------|:----------------------------------------|\n| lang2messages | Object  | нет                | {\"ru\": {NAME1: \"имя 1\"}, \"en\": {NAME1: \"name 1\"}} | Объект маппинга кода языка на сообщения |\n| store         | Vuex    | нет                |                                                   | Экземпляр vuex                          |\n\nПример использования:\n\n```js\nimport Vue from 'vue';\nimport store from '@/store';\nimport router from '@/router';\nimport App from '@/App';\nimport DL10nPlugin from '@dlabs71/d-vue-localization';\n\nconst lang2messages = {\n    \"en\": {\n        MAIN_FORM: {\n            ACCEPT_BTN_LABEL: \"Accept\",\n            CANCEL_BTN_LABEL: \"Cancel\",\n            PLEASE_WAIT: \"Please wait ......\"\n        }\n    },\n    \"ru\": {\n        MAIN_FORM: {\n            ACCEPT_BTN_LABEL: \"Принять\",\n            CANCEL_BTN_LABEL: \"Отмена\",\n            PLEASE_WAIT: \"Пожалуйста подождите ......\"\n        }\n    }\n};\n\nVue.use(DL10nPlugin, {\n    lang2messages: lang2messages,\n    store: store\n});\n```\n\n## <h2 id=\"section2\">2. Vue миксин DL10nMixin</h2>\n\nVue миксин **DL10nMixin** регистрируется глобально и содержит вспомогательные методы/свойства для организации механизма\nлокализации в приложении.\n\n### <h3 id=\"section21\">2.1. Свойства data</h3>\n\nВ блоке data миксин добавляет только одно свойство: **dL10n**. В данном свойстве находиться экземпляр класса **DL10n**.\n\n### <h3 id=\"section22\">2.2. Методы</h3>\n\nМиксин предоставляет ряд методов для реализации локализации в приложении. В таблице ниже описаны эти методы.\n\n| **Метод**          | **Параметры**        | **Описание**                                                |\n|:-------------------|:---------------------|:------------------------------------------------------------|\n| getDL10nLang       |                      | Метод получения текущего кода языка, установленного в сторе |\n| setDL10nLang       | lang - код языка     | Метод установки кода языка в стор                           |\n| getDL10nNameByCode | name - код сообщения | Метод получения локализованного сообщения по его коду       |\n\nПример использования:\n\n```vue\n\n<script>\n    export default {\n        name: 'app',\n        data() {\n            return {}\n        },\n        computed: {\n            L10N_FORM() {\n                return this.getDL10nNameByCode('MAIN_FORM');\n            }\n        },\n        mounted() {\n            if (!this.getDL10nLang()) {\n                this.setDL10nLang(\"ru\");\n            }\n        }\n    }\n</script>\n```\n\n### <h3 id=\"section23\">2.3. Вычисляемые свойства (computed)</h3>\n\nМиксин предоставляет одно вычисляемое свойство: **$currentLang** - оно имеет значение актуального кода языка,\nустановленного в сторе.\n\n### <h3 id=\"section24\">2.4. Блок watch</h3>\n\nВ блоке watch миксин добавляет слушателя на вычисляемое свойство **$currentLang**. При изменении языка в сторе\nпроисходит автоматическое изменение и перезагрузка атрибутов класса **DL10n** в свойстве **dL10n** блока **data**.\n\n### <h3 id=\"section25\">2.5. Хук created()</h3>\n\nМиксин также реализует хук жизненного цикла **created()**. В нём реализуется начальная инициализация свойства **dL10n**\nв блоке **data**. А также первоначальная установка языка.\n\n## <h2 id=\"section3\">3. Модуль Vuex DL10nStoreModule</h2>\n\nБиблиотека предоставляет готовый модуль Vuex (DL10nStoreModule) для организации хранения кода языка в приложении. Данный\nмодуль подключается автоматически в плагине при указании параметра store. Также его можно подключить и отдельно.\n\nПример подключения:\n\n```js\nimport Vue from 'vue';\nimport Vuex from 'vuex';\nimport {DL10nStoreModule, STORE_MODULE_NAME} from '@dlabs71/d-vue-localization';\n\nVue.use(Vuex);\n\nexport default new Vuex.Store({\n    modules: {\n        [STORE_MODULE_NAME]: DL10nStoreModule\n    },\n    strict: process.env.NODE_ENV !== 'production'\n});\n```\n\n## <h2 id=\"section4\">4. Класс DL10n</h2>\n\nКласс **DL10n** предназначен для реализации локализации приложения. Он предоставляет хранилище маппинга кода языка на\nсообщения, а также ряд методов для работы и получения сообщения для определённого языка.\n\nБиблиотека также предоставляет готовый экземпляр класса **DL10n**.\n\n```js\nimport {DL10nInstance} from '@dlabs71/d-vue-localization';\n```\n\n| **Поле**      | **Тип** | **Значение по умолчанию** | **Описание**                              |\n|:--------------|:--------|:--------------------------|:------------------------------------------|\n| lang          | String  | null                      | Текущий код языка локализации             |\n| lang2messages | Object  | {}                        | Хранилище сообщений для каждого из языков |\n\n### <h3 id=\"section41\">4.1. Статичный геттер instance</h3>\n\nСтатичный геттер instance предназначен для реализации паттерна Singleton для данного класса.\n\n### <h3 id=\"section42\">4.2. Метод addLang</h3>\n\nМетод **addLang** предназначен для добавления нового кода языка с объектом сообщений для него.\n\n| **Параметр** | **Тип** | **Обязательность** | **Значение по умолчанию** | **Описание**                           |\n|:-------------|:--------|:-------------------|:--------------------------|:---------------------------------------|\n| name         | String  | да                 |                           | Код языка                              |\n| messages     | Object  | да                 |                           | Объект с сообщениями для данного языка |\n\nПример использования:\n\n```js\nimport {DL10n} from '@dlabs71/d-vue-localization';\n\nlet dL10n = new DL10n();\n\nlet messagesEn = {\n    NAME1: \"name 1\",\n    NAME2: \"name 2\"\n};\n\ndL10n.addLang(\"en\", messagesEn);\n\nlet messagesRu = {\n    NAME1: \"имя 1\",\n    NAME2: \"имя 2\"\n};\n\ndL10n.addLang(\"ru\", messagesRu);\n```\n\n### <h3 id=\"section43\">4.3. Метод addMessagesToLang</h3>\n\nМетод **addMessagesToLang** предназначен для добавления дополнительных сообщений к уже сохранённому языку.\n\n| **Параметр** | **Тип** | **Обязательность** | **Значение по умолчанию** | **Описание**                           |\n|:-------------|:--------|:-------------------|:--------------------------|:---------------------------------------|\n| lang         | String  | да                 |                           | Код языка                              |\n| messages     | Object  | да                 |                           | Объект с сообщениями для данного языка |\n\nПример использования:\n\n```js\nimport {DL10n} from '@dlabs71/d-vue-localization';\n\nlet dL10n = new DL10n({\n    \"en\": {\n        NAME1: \"name 1\",\n        NAME2: \"name 2\"\n    },\n    \"ru\": {\n        NAME1: \"имя 1\",\n        NAME2: \"имя 2\"\n    }\n});\n\nlet newMessagesEn = {\n    NAME3: \"name 3\",\n    NAME4: \"name 4\"\n};\n\ndL10n.addMessagesToLang(\"en\", messagesEn);\n```\n\n### <h3 id=\"section44\">4.4. Метод setLang2Messages</h3>\n\nМетод **setLang2Messages** предназначен для инициализации хранилища маппинга языка на его сообщения.\n\n| **Параметр**  | **Тип** | **Обязательность** | **Значение по умолчанию** | **Описание**                           |\n|:--------------|:--------|:-------------------|:--------------------------|:---------------------------------------|\n| lang2messages | Object  | нет                | {}                        | Объект маппинга языка на его сообщения |\n\nПример использования:\n\n```js\nimport {DL10n} from '@dlabs71/d-vue-localization';\n\nlet dL10n = new DL10n();\n\ndL10n.setLang2Messages({\n    \"en\": {\n        NAME1: \"name 1\",\n        NAME2: \"name 2\"\n    },\n    \"ru\": {\n        NAME1: \"имя 1\",\n        NAME2: \"имя 2\"\n    }\n});\n```\n\n### <h3 id=\"section45\">4.5. Метод loadLang</h3>\n\nМетод **loadLang** предназначен для загрузки определённого языка из хранилища. При этом в классе создаются\nдополнительные поля на основе кодов сообщений. Такие поля класса имеют префикс `$`.\n\n| **Параметр** | **Тип** | **Обязательность** | **Значение по умолчанию** | **Описание**                        |\n|:-------------|:--------|:-------------------|:--------------------------|:------------------------------------|\n| lang         | String  | да                 |                           | Код языка для загрузки из хранилища |\n\nПример использования:\n\n```js\nimport {DL10n} from '@dlabs71/d-vue-localization';\n\nlet dL10n = new DL10n({\n    \"en\": {\n        NAME1: \"name 1\",\n        NAME2: \"name 2\"\n    },\n    \"ru\": {\n        NAME1: \"имя 1\",\n        NAME2: \"имя 2\"\n    }\n});\n\ndL10n.loadLang(\"en\");\n\n/* В классе появятся следующие поля:\nclass DL10n {\n    lang2messages = {.....};\n    lang = \"en\";\n    $NAME1 = \"name 1\";\n    $NAME2 = \"name 2\";\n}\n*/\n\ndL10n.loadLang(\"ru\");\n\n/* В классе появятся следующие поля:\nclass DL10n {\n    lang2messages = {.....};\n    lang = \"ru\";\n    $NAME1 = \"имя 1\";\n    $NAME2 = \"имя 2\";\n}\n*/\n```\n\n### <h3 id=\"section46\">4.6. Метод getMessages</h3>\n\nМетод **getMessages** предназначен для получения по коду языка списка всех сообщений, находящихся в хранилище.\n\n| **Параметр** | **Тип** | **Обязательность** | **Значение по умолчанию** | **Описание** |\n|:-------------|:--------|:-------------------|:--------------------------|:-------------|\n| lang         | String  | да                 |                           | Код языка    |\n\nПример использования:\n\n```js\nimport {DL10n} from '@dlabs71/d-vue-localization';\n\nlet dL10n = new DL10n({\n    \"en\": {\n        NAME1: \"name 1\",\n        NAME2: \"name 2\"\n    },\n    \"ru\": {\n        NAME1: \"имя 1\",\n        NAME2: \"имя 2\"\n    }\n});\n\nlet messagesRu = dL10n.loadLang(\"ru\");\n\n/* \nmessagesRu = {\n    NAME1: \"имя 1\",\n    NAME2: \"имя 2\"\n}\n*/\n```\n\n## <h2 id=\"section4\">5. Vue3 composable</h2>\n\nДля подключения в setup функции используйте composable функцию `useDL10n` как показано ниже. Она предоставляет 3 метода:\n\n- `getDL10nNameByCode` - получение значения по коду\n- `setDL10nLang` - установить язык\n- `getDL10nLang` - получить текущий язык\n\n```vue\n\n<script setup>\n    import {computed, onMounted} from \"vue\";\n    import {useDL10n} from '@dlabs71/d-vue-localization';\n\n    const l10n = useDL10n();\n\n    const L10N_FORM = computed(() => l10n.getDL10nNameByCode(\"LOGIN_PAGE\"));\n\n    onMounted(() => {\n        if (!l10n.getDL10nLang()) {\n            l10n.setDL10nLang(\"ru\");\n        }\n    });\n</script>\n```\n\n[npm-image]: https://img.shields.io/npm/v/@dlabs71/d-vue-localization\n\n[npm-url]: https://www.npmjs.com/package/@dlabs71/d-vue-localization\n\n[license-image]: https://img.shields.io/badge/license-MIT-blue.svg\n\n[license-url]: LICENSE","readmeFilename":"README.md"}