{"id":17084522,"url":"https://github.com/nsaunders/demitasse","last_synced_at":"2025-04-12T21:25:56.998Z","repository":{"id":57211870,"uuid":"386105595","full_name":"nsaunders/demitasse","owner":"nsaunders","description":"CSS Modules in TypeScript…the simple way","archived":false,"fork":false,"pushed_at":"2023-10-06T20:30:59.000Z","size":856,"stargazers_count":5,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-04-03T18:42:25.690Z","etag":null,"topics":["css","css-in-js","typescript"],"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/nsaunders.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-07-14T23:46:48.000Z","updated_at":"2023-06-28T21:03:49.000Z","dependencies_parsed_at":"2024-06-21T16:53:23.768Z","dependency_job_id":"d8d78c57-cd96-4ac5-8aa9-ded2f44e0700","html_url":"https://github.com/nsaunders/demitasse","commit_stats":{"total_commits":236,"total_committers":2,"mean_commits":118.0,"dds":0.1610169491525424,"last_synced_commit":"7691bfc599eb1eb25a240273e1b40b009950fce5"},"previous_names":[],"tags_count":32,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nsaunders%2Fdemitasse","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nsaunders%2Fdemitasse/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nsaunders%2Fdemitasse/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nsaunders%2Fdemitasse/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/nsaunders","download_url":"https://codeload.github.com/nsaunders/demitasse/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248633348,"owners_count":21136857,"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":["css","css-in-js","typescript"],"created_at":"2024-10-14T13:07:32.731Z","updated_at":"2025-04-12T21:25:56.978Z","avatar_url":"https://github.com/nsaunders.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ☕ Demitasse \u003ca href=\"https://github.com/nsaunders/demitasse/actions/workflows/ci.yml\"\u003e\u003cimg src=\"https://img.shields.io/github/actions/workflow/status/nsaunders/demitasse/ci.yml?branch=master\" alt=\"Build status\"\u003e\u003c/a\u003e \u003ca href=\"https://www.npmjs.com/package/demitasse\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/demitasse.svg\" alt=\"Latest Release\"\u003e\u003c/a\u003e \u003ca href=\"https://github.com/nsaunders/demitasse/blob/master/LICENSE\"\u003e\u003cimg src=\"https://img.shields.io/github/license/nsaunders/demitasse.svg\" alt=\"License\"\u003e\u003c/a\u003e\n\n\u003ctable\u003e\n\u003ctr\u003e\n\u003ctd\u003e\n\n**CSS Modules in TypeScript…the _simple_ way**\n\nDemitasse offers a component development experience comparable to Typed CSS Modules or CSS-in-TypeScript (CSS-in-JS) without the typical runtime cost or unwieldy configuration of those approaches.\n\n💅 Author style rules within TypeScript.\n\n👬 Colocate styles and markup.\n\n⚒️  Extract static CSS at build time.\n\n📦 Locally-scoped class names\n\n🔎 Transparent build configuration\n\n👼 Pure computation / no side effects\n\n\u003c/td\u003e\n\u003ctd\u003e\n\n\u003cimg src=\"https://user-images.githubusercontent.com/2517229/213875430-b7065a2d-98eb-4d0f-a30c-a71a10130fb5.gif\" alt=\"Live code demo\" width=\"400\" height=\"400\" /\u003e\n\n\u003c/td\u003e\n\u003c/tr\u003e\n\u003c/table\u003e\n\n## Installation\n```bash\nnpm install demitasse\n```\n\n## API\n\n#### `cssBindings`\n\n```typescript\ncssBindings:\n  (css: string) =\u003e {\n    classes: Record\u003cClassRef extends string, string\u003e;\n    ids: Record\u003cIdRef extends string, string\u003e;\n  }\n```\n\nGiven a style sheet, returns a map of class names and IDs. For use with dot notation, keys are converted to camel-case; e.g. `button-label` is converted to `buttonLabel`. The values correspond to the names that appear in the `css`.\n\n#### `makeCSSBindings`\n\n```typescript\nmakeCSSBindings:\n  \u003cContext\u003e(mapFn: (name: string, meta: { type: \"class\" | \"id\", context: Context }) =\u003e string) =\u003e\n    (css: string, context: Context) =\u003e {\n      classes: Record\u003cClassRef extends string, string\u003e;\n      ids: Record\u003cIdRef extends string, string\u003e;\n    }\n```\n\nGiven a mapping function `mapFn`, returns a function similar to [`cssBindings`](#cssbindings), except with one additional `context` parameter. The `context` argument is forwarded to `mapFn` and can be used e.g. to add a prefix to the class name or ID.\n\n### Generated docs\n\nGenerated API documentation is available [here](./docs).\n\n## Additional resources\n\n* [Examples](./examples)\n* [Guides](./docs/guides)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnsaunders%2Fdemitasse","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnsaunders%2Fdemitasse","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnsaunders%2Fdemitasse/lists"}