{"_id":"@auroratide/arched-text","name":"@auroratide/arched-text","dist-tags":{"latest":"0.1.0"},"versions":{"0.1.0":{"name":"@auroratide/arched-text","version":"0.1.0","description":"Forms text into an arch.","type":"module","main":"lib/index.js","module":"lib/index.js","keywords":["arch","text","web component"],"author":{"name":"Timothy Foster","url":"https://auroratide.com"},"homepage":"https://components.auroratide.com/arched-text","repository":{"type":"git","url":"git+https://github.com/Auroratide/web-components.git"},"license":"ISC","devDependencies":{"@open-wc/testing":"^4.0.0","@web/test-runner":"^0.18.0","typescript":"^5.3.3"},"scripts":{"clean":"rm -rf lib","build":"tsc","build:watch":"tsc -w","test":"wtr --node-resolve --port 10010 test","test:clean":"pnpm clean && pnpm build && pnpm test"},"types":"./lib/index.d.ts","bugs":{"url":"https://github.com/Auroratide/web-components/issues"},"_id":"@auroratide/arched-text@0.1.0","_integrity":"sha512-iSyz7or1zm+AOUnJUV2L5YEt+oiz9k6TUGFv913e1eg0vsDPD8XJJn5xw15/aUNQssJYmTxo7RSTeqAwpIf1Gg==","_resolved":"/private/var/folders/bk/zbxm0bcj609gs34tt_wxngfr0000gn/T/702676d04f1fbdd6291594b2570a099f/auroratide-arched-text-0.1.0.tgz","_from":"file:auroratide-arched-text-0.1.0.tgz","_nodeVersion":"20.11.1","_npmVersion":"10.2.4","dist":{"integrity":"sha512-iSyz7or1zm+AOUnJUV2L5YEt+oiz9k6TUGFv913e1eg0vsDPD8XJJn5xw15/aUNQssJYmTxo7RSTeqAwpIf1Gg==","shasum":"c3b4555b3f8f558ff6bc659915873432ddb69fb9","tarball":"https://registry.npmjs.org/@auroratide/arched-text/-/arched-text-0.1.0.tgz","fileCount":11,"unpackedSize":8126,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHhUMqLjZe5XqidibXfDfWVWbjk/AxcnhuA8F5svdzr2AiBrbQv5212VscoLQIHIOrfaevF7sLQRpKUAz8kgpQMqaA=="}]},"_npmUser":{"name":"auroratide","email":"tf.auroratide@gmail.com"},"directories":{},"maintainers":[{"name":"auroratide","email":"tf.auroratide@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/arched-text_0.1.0_1729035957237_0.3211130179870636"},"_hasShrinkwrap":false}},"time":{"created":"2024-10-15T23:45:57.095Z","0.1.0":"2024-10-15T23:45:57.419Z","modified":"2024-10-15T23:45:57.745Z"},"maintainers":[{"name":"auroratide","email":"tf.auroratide@gmail.com"}],"description":"Forms text into an arch.","homepage":"https://components.auroratide.com/arched-text","keywords":["arch","text","web component"],"repository":{"type":"git","url":"git+https://github.com/Auroratide/web-components.git"},"author":{"name":"Timothy Foster","url":"https://auroratide.com"},"bugs":{"url":"https://github.com/Auroratide/web-components/issues"},"license":"ISC","readme":"# The arched-text Element\n\n<p hidden><strong><a href=\"https://components.auroratide.com/arched-text\">View this page with live demos!</a></strong></p>\n\nThe `arched-text` element represents text shaped into an arch.\n\n<!--DEMO\n<wc-demo>\n\t<div class=\"arch-amount-demo\">\n\t\t<p style=\"font-size: 2em;\">\n\t\t\t<arched-text amount=\"0.5\">This text is arched!</arched-text>\n\t\t</p>\n\t\t<section class=\"range-input\">\n\t\t\t<input id=\"arch-demo-amount\" type=\"range\" min=\"0\" max=\"1\" value=\"0.5\" step=\"0.05\" />\n\t\t\t<label for=\"arch-demo-amount\">Arch Amount</label>\n\t\t</section>\n\t</div>\n</wc-demo>\n/DEMO-->\n\n```html\n<arched-text>This text is arched!</arched-text>\n```\n\n## Installation\n\nYou can import through CDN:\n\n```html\n<script type=\"module\" src=\"https://unpkg.com/@auroratide/arched-text/lib/define.js\"></script>\n```\n\nOr, you may install through [NPM](https://www.npmjs.com/package/@auroratide/arched-text) and include it as part of your build process:\n\n```\n$ npm i @auroratide/arched-text\n```\n\n```javascript\nimport '@auroratide/arched-text/lib/define.js'\n```\n\n## Usage\n\n`arched-text` is a **markup element** that can be used in your HTML. It only accepts text as children.\n\nYou can use the `amount` attribute to adjust the amount of arching. It is a decimal number from 0 to 1.\n\n* The minumum value of 0 means no arching, basically just flat text.\n* The maximum value of 1 means infinite arching, which... doesn't actually render anything. Probably for the best.\n* By default it is 0.33333.\n\n```html\n<arched-text>Default arch</arched-text>\n<arched-text amount=\"0.6667\">More arching</arched-text>\n<arched-text amount=\"0.1\">Less arching</arched-text>\n```\n\n<!--DEMO\n<wc-demo>\n\t<p style=\"display: flex; flex-wrap: wrap; gap: 2em; margin-block-start: 1em;\">\n\t\t<arched-text>Default arch</arched-text>\n\t\t<arched-text amount=\"0.6667\">More arching</arched-text>\n\t\t<arched-text amount=\"0.1\">Less arching</arched-text>\n\t</p>\n</wc-demo>\n/DEMO-->\n\n## Accessibility\n\nThe element represents its textual content. That's it, I don't have anything else to say 🙂\n","readmeFilename":"README.md"}