{"_id":"@amandaguthrie/css-index","name":"@amandaguthrie/css-index","dist-tags":{"dev":"0.1.0-dev-20240510234403","latest":"0.1.0-dev-20240510234403"},"versions":{"0.1.0-dev-20240510234403":{"name":"@amandaguthrie/css-index","version":"0.1.0-dev-20240510234403","description":"CSS properties grouped by category, function, and more","author":{"name":"Amanda Guthrie","url":"https://github.com/amandaguthrie"},"repository":{"type":"git","url":"git+https://github.com/amandaguthrie/css-index.git","directory":"packages/css-index"},"license":"MIT","exports":{"./category":{"require":"./dist/category.js","source":"./src/category.ts","svelte":"./dist/category.js","types":"./dist/category.d.ts","import":{"types":"./dist/category.d.mts","default":"./dist/category.mjs"}},"./package.json":"./package.json"},"side-effects":false,"publishConfig":{"access":"public"},"devDependencies":{"@webref/css":"^6.12.10"},"scripts":{"prebuild":"tsx scripts/prebuild.ts","build":"tsup","build-fast":"tsup --no-dts","dev":"pnpm build-fast --watch","test":"node --import=tsx tests/test.mts"},"bugs":{"url":"https://github.com/amandaguthrie/css-index/issues"},"homepage":"https://github.com/amandaguthrie/css-index#readme","_id":"@amandaguthrie/css-index@0.1.0-dev-20240510234403","_integrity":"sha512-yBPaTQH8Uv46SALqPzRkbsLW45Lx8/ZiOobqvNG98eo3cH4/s2aG88PDCTFZyGCoDjOEK/Dvuy5gxQX82Z5rew==","_resolved":"/tmp/0b189c4b7f8f44bd3836b1edf0e46062/amandaguthrie-css-index-0.1.0-dev-20240510234403.tgz","_from":"file:amandaguthrie-css-index-0.1.0-dev-20240510234403.tgz","_nodeVersion":"20.12.2","_npmVersion":"10.5.0","dist":{"integrity":"sha512-yBPaTQH8Uv46SALqPzRkbsLW45Lx8/ZiOobqvNG98eo3cH4/s2aG88PDCTFZyGCoDjOEK/Dvuy5gxQX82Z5rew==","shasum":"2aee1b22b44af5d765f521ada144caee53f7bbec","tarball":"https://registry.npmjs.org/@amandaguthrie/css-index/-/css-index-0.1.0-dev-20240510234403.tgz","fileCount":7,"unpackedSize":133050,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD7Fy0toLsVIztIhduSuATryI5tKcOja7aD8KHNV+YhWgIhAJvK4ze8dC2YgYao/CXEHQ7S1ZZdEggBoI8vVYtzd14I"}]},"_npmUser":{"name":"amandaguthrie","email":"tools.a.npm@heygu.com"},"directories":{},"maintainers":[{"name":"amandaguthrie","email":"tools.a.npm@heygu.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/css-index_0.1.0-dev-20240510234403_1715384647480_0.8842134254344596"},"_hasShrinkwrap":false}},"time":{"created":"2024-05-10T23:44:07.378Z","0.1.0-dev-20240510234403":"2024-05-10T23:44:07.686Z","modified":"2024-05-10T23:44:07.992Z"},"maintainers":[{"name":"amandaguthrie","email":"tools.a.npm@heygu.com"}],"description":"CSS properties grouped by category, function, and more","homepage":"https://github.com/amandaguthrie/css-index#readme","repository":{"type":"git","url":"git+https://github.com/amandaguthrie/css-index.git","directory":"packages/css-index"},"author":{"name":"Amanda Guthrie","url":"https://github.com/amandaguthrie"},"bugs":{"url":"https://github.com/amandaguthrie/css-index/issues"},"license":"MIT","readme":"# @amandaguthrie/css-index\n\nThis package contains CSS property names sliced in different categories as types and arrays to avoid duplication of\nlists.\n\nIt utilizes [@webref/css][webref-css] to provide the CSS property names and style declarations.\n\n---\n\n## Contents\n\n- [Installation](#installation)\n- [Usage](#usage)\n- [License](#license)\n\n---\n\n## Installation\n\n```bash\nnpm install @amandaguthrie/css-index\n```\n\n---\n\n[> Back to Contents](#contents)\n\n---\n\n## Usage\n\n### Categories\n\nCategories are exported from `@amandaguthrie/css-index/category` and are used to group CSS properties by their function.\n\nTo view all properties in a category, [review the source code](./src/.generated/category.ts).\n\nEach category is exported as an array and a type as both kebab case and camel case for convenience.\n\nThe CSS properties for camel case do not convert variables or vendor-prefixed properties. For example, `-webkit-box-reflect` remains kebab-cased in the camel case type and array because it is vendor-prefixed.\n\n| Category   | Kebab Case                                                      | Camel Case                                                          | Description                                                                                       |\n|------------|-----------------------------------------------------------------|---------------------------------------------------------------------|---------------------------------------------------------------------------------------------------|\n| `align`    | Array: `cssAlignProperties`<br />Type: `CssAlignProperty`       | Array: `cssAlignPropertiesCC`<br />Type: `CssAlignPropertyCC`       | Horizontal/vertical alignment properties for boxes, flex, grid, and text.                         |\n| `box`      | Array: `cssBoxProperties`<br />Type: `CssBoxProperty`           | Array: `cssBoxPropertiesCC`<br />Type: `CssBoxPropertyCC`           | Box model properties, like `box`, `margin`, `padding`, `height`, `width`, etc.                    |\n| `color`    | Array: `cssColorProperties`<br />Type: `CssColorProperty`       | Array: `cssColorPropertiesCC`<br />Type: `CssColorPropertyCC`       | CSS properties that relate to color, including blending/composition/filters                       |\n| `line`     | Array: `cssLineProperties`<br />Type: `CssLineProperty`         | Array: `cssLinePropertiesCC`<br />Type: `CssLinePropertyCC`         | Properties that result in a border, outline, underline, etc.                                      |\n| `media`    | Array: `cssMediaProperties`<br />Type: `CssMediaProperty`       | Array: `cssMediaPropertiesCC`<br />Type: `CssMediaPropertyCC`       | CSS properties related to images and SVG                                                          |\n| `motion`   | Array: `cssMotionProperties`<br />Type: `CssMotionProperty`     | Array: `cssMotionPropertiesCC`<br />Type: `CssMotionPropertyCC`     | CSS properties related to animation, motion, transforms, and transitions.                         |\n| `position` | Array: `cssPositionProperties`<br />Type: `CssPositionProperty` | Array: `cssPositionPropertiesCC`<br />Type: `CssPositionPropertyCC` | CSS properties related to positioning, including `position`, `top`, `left`, `z-index`, etc.       |\n| `text`     | Array: `cssTextProperties`<br />Type: `CssTextProperty`         | Array: `cssTextPropertiesCC`<br />Type: `CssTextPropertyCC`         | CSS properties related to font, text display, and text localization. Includes counters and lists. |\n\n\n```typescript\nimport { cssAlignProperties, type CssAlignProperty } from '@amandaguthrie/css-index/category';\n\nfunction isCssAlignProperty(s: string | CssAlignProperty): s is CssAlignProperty {\n  return cssAlignProperties.includes(s);\n}\n```\n\n---\n\n[> Back to Contents](#contents)\n\n---\n\n## License\n\n[MIT][license] © 2024 [Amanda Guthrie][author]\n\n---\n\n[> Back to Contents](#contents)\n\n---\n\n<!-- Internal Links -->\n\n[license]: LICENSE.md\n\n<!-- External Links -->\n\n[author]: https://github.com/amandaguthrie\n\n[webref-css]: https://github.com/w3c/webref","readmeFilename":"README.md"}