{"library":"metaviewport-parser","title":"Meta Viewport Parser","description":"The `metaviewport-parser` library, currently at version 0.3.0, provides a robust parser and interpreter for the `content` attribute within HTML `<meta name=\"viewport\">` declarations. It implements the algorithms specified in the W3C CSS Device Adaption specification, enabling developers to programmatically analyze and understand how viewport configurations affect rendering. The library offers `parseMetaViewPortContent` to break down the attribute string into valid, unknown, and invalid properties, and `getRenderingDataFromViewport` to interpret these properties against supplied browser dimensions to calculate initial width, height, zoom, and user-scalability. As a pre-1.0 package, its API should be considered experimental and may undergo changes. Its key differentiator is strict adherence to web standards for accurate viewport parsing, making it valuable for server-side rendering, testing tools, or dynamic content adaptation logic.","language":"javascript","status":"active","last_verified":"Sun Apr 19","install":{"commands":["npm install metaviewport-parser"],"cli":null},"imports":["const metaparser = require('metaviewport-parser');","const { parseMetaViewPortContent } = require('metaviewport-parser');","const { getRenderingDataFromViewport } = require('metaviewport-parser');"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"const metaparser = require('metaviewport-parser');\n\n// Example 1: Basic width=device-width\nconst contentAttr1 = \"width=device-width\";\nconst viewport1 = metaparser.parseMetaViewPortContent(contentAttr1);\nconst renderingData1 = metaparser.getRenderingDataFromViewport(viewport1.validProperties, {\n    deviceWidth: 320,\n    deviceHeight: 480,\n    maxZoom: 4,\n    minZoom: 0.25\n});\nconsole.log('Rendering Data 1:', renderingData1); // Expected: { zoom: null, width: 320, height: 480, userZoom: \"zoom\" }\n\n// Example 2: Initial scale and user-scalable=no\nconst contentAttr2 = \"initial-scale=1,user-scalable=no\";\nconst viewport2 = metaparser.parseMetaViewPortContent(contentAttr2);\nconst renderingData2 = metaparser.getRenderingDataFromViewport(viewport2.validProperties, {\n    deviceWidth: 320,\n    deviceHeight: 480,\n    maxZoom: 4,\n    minZoom: 0.25\n});\nconsole.log('Rendering Data 2:', renderingData2); // Expected: { zoom: 1, width: 320, height: 480, userZoom: \"fixed\" }\n\n// Example 3: Invalid property value\nconst contentAttr3 = \"width=foo,initial-scale=1\";\nconst viewport3 = metaparser.parseMetaViewPortContent(contentAttr3);\nconsole.log('Viewport with invalid prop:', viewport3); // Expected: { validProperties: {'initial-scale': 1}, unknownProperties: {}, invalidValues: {'width': 'foo'} }","lang":"javascript","description":"Demonstrates parsing a meta viewport content string and interpreting its valid properties into rendering data based on provided device dimensions.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}