{"id":17531270,"url":"https://github.com/zirbest/unocss-preset-primitives","last_synced_at":"2025-03-06T10:32:20.164Z","repository":{"id":61378895,"uuid":"550886621","full_name":"zirbest/unocss-preset-primitives","owner":"zirbest","description":"Utilities and variants for styling headlessui, radix-ui, kobalte state or custom one ;)","archived":false,"fork":false,"pushed_at":"2024-07-04T11:27:00.000Z","size":789,"stargazers_count":57,"open_issues_count":4,"forks_count":3,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-03T07:22:43.678Z","etag":null,"topics":["ark","ark-ui","headlessui","kobalte","primitives","radix-ui","unocss","unocss-preset","zagjs"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/zirbest.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null},"funding":{"github":["zirbest"]}},"created_at":"2022-10-13T13:40:50.000Z","updated_at":"2024-11-01T10:40:03.000Z","dependencies_parsed_at":"2023-02-08T03:31:32.550Z","dependency_job_id":null,"html_url":"https://github.com/zirbest/unocss-preset-primitives","commit_stats":{"total_commits":39,"total_committers":1,"mean_commits":39.0,"dds":0.0,"last_synced_commit":"6fa7a99c88d62164967acf6b9fdeacaf432847d7"},"previous_names":[],"tags_count":15,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zirbest%2Funocss-preset-primitives","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zirbest%2Funocss-preset-primitives/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zirbest%2Funocss-preset-primitives/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zirbest%2Funocss-preset-primitives/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zirbest","download_url":"https://codeload.github.com/zirbest/unocss-preset-primitives/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":242191592,"owners_count":20087010,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["ark","ark-ui","headlessui","kobalte","primitives","radix-ui","unocss","unocss-preset","zagjs"],"created_at":"2024-10-20T17:23:24.254Z","updated_at":"2025-03-06T10:32:19.789Z","avatar_url":"https://github.com/zirbest.png","language":"TypeScript","funding_links":["https://github.com/sponsors/zirbest"],"categories":["Community","Presets"],"sub_categories":["Presets"],"readme":"# unocss-preset-primitives\nUtilities and variants for styling [headlessui](https://github.com/zirbest/unocss-preset-primitives#headlessui) [radix-ui](https://github.com/zirbest/unocss-preset-primitives#radix-ui) [kobalte](https://github.com/zirbest/unocss-preset-primitives#kobalte) state or [custom](https://github.com/zirbest/unocss-preset-primitives#custom) one\n\n```bash\nnpm i -D unocss-preset-primitives\n```\n# Demo\nYou can find the code inside the [playground](https://github.com/zirbest/unocss-preset-primitives/tree/main/playground) folder.\n\n# Usage\n\n``` vue\n\u003cMenuItem class=\"ui-active:bg-violet-5 ui-active:text-white ui-not-active:text-gray-900\"\u003e\n  Options\n\u003c/MenuItem\u003e\n\n\u003cMenuItem\u003e\n\u003c/MenuItem\u003e\n\n\u003c!-- using presetAttributify --\u003e\n\u003cMenuItem\n  ui-active=\"bg-violet-5 text-white\"\n  ui-not-active=\"text-gray-900\"\n  \u003e\n  Options\n\u003c/MenuItem\u003e\n```\n## headlessui\n```typescript\n// headless-ui\nimport { presetHeadlessUi } from 'unocss-preset-primitives'\nimport presetUno from '@unocss/preset-uno'\n\nUnocss({\n  presets: [\n    presetUno(),\n    // default options {prefix: 'ui'}\n    presetHeadlessUi(/* options */),\n  ],\n})\n```\n\n## radix-ui\n```typescript\n// radix-ui\nimport { presetRadixUi } from 'unocss-preset-primitives'\nimport presetUno from '@unocss/preset-uno'\n\nUnocss({\n  presets: [\n    presetUno(),\n    // default options {prefix: 'ui'}\n    presetRadixUi(/* options */),\n  ],\n})\n```\n\n## kobalte\n```typescript\n// kobalte\nimport { presetKobalte } from 'unocss-preset-primitives'\nimport presetUno from '@unocss/preset-uno'\n\nUnocss({\n  presets: [\n    presetUno(),\n    // default options {prefix: 'ui'}\n    presetKobalte(/* options */),\n  ],\n})\n```\n## custom\n```typescript\n// custom\nimport presetPrimitives from 'unocss-preset-primitives'\nimport presetUno from '@unocss/preset-uno'\n\nUnocss({\n  presets: [\n    presetUno(),\n    presetPrimitives( {\n      prefix: 'ui',\n      variants: 'enable|disable',\n      selector: 'data-bar-state'\n      isAttrBoolean = false,\n    }),\n  ],\n})\n```\n\n## List of variants\n\n| Variant       | Inverse variant   |\n| ------------- | ----------------- |\n| `ui-open`     | `ui-not-open`     |\n| `ui-checked`  | `ui-not-checked`  |\n| `ui-selected` | `ui-not-selected` |\n| `ui-active`   | `ui-not-active`   |\n| `ui-disabled` | `ui-not-disabled` |\n| `...`         | `...`             |\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzirbest%2Funocss-preset-primitives","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzirbest%2Funocss-preset-primitives","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzirbest%2Funocss-preset-primitives/lists"}