@bitrix24/b24ui-nuxt
Version:
Bitrix24 UI-Kit for developing web applications REST API for NUXT & VUE
35 lines (34 loc) • 1.25 kB
TypeScript
/**
* Plugin to detect the Bitrix24 application environment.
*
* @description
* 1. Analyzes the User-Agent on the server-side (SSR) or client-side.
* 2. Establishes a reactive `platform` state using `useState`.
* 3. Injects attributes into the `<html>` tag for styling:
* - `data-platform="bitrix-mobile" | "bitrix-desktop" | "web"`
* - `data-version="XX" | "XX.X.XX.XX" | "air"`
*
* @example
* // In CSS:
* html[data-platform="bitrix-mobile"] .my-component { ... }
* html[data-platform="bitrix-desktop"] .my-component { ... }
*
* @example
* <!-- Template usage (Tailwind) -->
* <div class="hidden bitrix-mobile:block bitrix-mobile:bg-blue-600">
* Content visible only inside the Bitrix Mobile
* </div>
* <div class="hidden bitrix-desktop:block bitrix-desktop:bg-blue-600">
* Content visible only inside the Bitrix Desktop
* </div>
*
* @example
* // Inside a Vue component:
* const platform = useState('platform')
* if (platform.value.name === 'bitrix-mobile') { ... }
* if (platform.value.name === 'bitrix-desktop') { ... }
*
* @todo add docs
*/
declare const _default: import("nuxt/app").Plugin<Record<string, unknown>> & import("nuxt/app").ObjectPlugin<Record<string, unknown>>;
export default _default;