{"id":50372397,"url":"https://github.com/mikeyil/ulam","last_synced_at":"2026-06-01T10:00:37.387Z","repository":{"id":357649134,"uuid":"1237944585","full_name":"mikeyil/ulam","owner":"mikeyil","description":"Accessibility utilities for the modern web. Focus management, live region announcements, i18n, and UI components, each independently installable, vanilla-first, with optional React, Remix, Vue, and Angular adapters. Named for the Filipino word for dish.","archived":false,"fork":false,"pushed_at":"2026-05-20T23:52:18.000Z","size":1287,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-05-21T05:49:29.131Z","etag":null,"topics":["a11y","a11yfred","accessibility","angular","aria","focus-management","i18n","react","ulam","vue","wcag"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mikeyil.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"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,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2026-05-13T16:56:07.000Z","updated_at":"2026-05-20T23:52:22.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/mikeyil/ulam","commit_stats":null,"previous_names":["mikeyil/ulam"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/mikeyil/ulam","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mikeyil%2Fulam","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mikeyil%2Fulam/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mikeyil%2Fulam/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mikeyil%2Fulam/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mikeyil","download_url":"https://codeload.github.com/mikeyil/ulam/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mikeyil%2Fulam/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33769492,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-01T02:00:06.963Z","response_time":115,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["a11y","a11yfred","accessibility","angular","aria","focus-management","i18n","react","ulam","vue","wcag"],"created_at":"2026-05-30T08:00:26.065Z","updated_at":"2026-06-01T10:00:37.379Z","avatar_url":"https://github.com/mikeyil.png","language":"JavaScript","funding_links":[],"categories":["Development Utilities"],"sub_categories":["Accessibility"],"readme":"# ulam\n\nAccessibility utilities for the modern web. Vanilla-first, with optional React, Remix, Vue, and Angular adapters.\n\nNamed for the Filipino word for dish: the thing everything else is built around.\n\n\u003e Accessibility utilities for the modern web. Focus management, live region announcements, i18n, and UI components, each independently installable, vanilla-first, with optional React, Remix, Vue, and Angular adapters. Named for the Filipino word for dish.\n\n## Packages\n\n| Package | Description |\n| ------- | ----------- |\n| [`@ulam/taho`](packages/taho) | ARIA live region announcer, route announcer |\n| [`@ulam/sili`](packages/sili) | Focus management, overlays, routing hooks |\n| [`@ulam/calamansi`](packages/calamansi) | Data-agnostic i18n, locale hooks, logic utilities |\n| [`@ulam/halohalo`](packages/halohalo) | AI provider adapters, model config, agentic mode |\n| [`@ulam/ube`](packages/ube) | Framework-agnostic UI components (vanilla, React, Vue, Angular, Remix), theming, design tokens |\n| [`@ulam/sawsawan`](packages/sawsawan) | The sauce: integration layer wiring the above together |\n\n## Architecture\n\nEach package is independently installable. Dependency flow is strictly one direction:\n\n```text\ncalamansi ──┐\ntaho ────────┤──► sawsawan\nsili ────────┤\nube ─────────┘\n```\n\nNone of the four core packages import from each other or from sawsawan. Sawsawan is the only package that imports from the others.\n\n## Install\n\nMost packages are vanilla-first with optional framework adapters. Install only what you need:\n\n```bash\nnpm install @ulam/taho           # vanilla announcer; React, Remix, Vue, Angular adapters optional\nnpm install @ulam/sili           # vanilla focus management; React, Remix, Vue, Angular adapters optional\nnpm install @ulam/calamansi      # vanilla i18n; React, Vue, Angular adapters optional\nnpm install @ulam/halohalo       # vanilla AI adapters; React, Vue, Angular adapters optional\nnpm install @ulam/ube            # vanilla web components; React, Remix, Vue, Angular adapters optional\n```\n\nOr with npm aliases if you prefer shorter import names:\n\n```bash\nnpm install taho@npm:@ulam/taho\nnpm install sili@npm:@ulam/sili\nnpm install calamansi@npm:@ulam/calamansi\n```\n\n## Framework support\n\nPackages with framework-specific behavior ship subpath exports:\n\n| Subpath | Framework | Description |\n| ------- | --------- | ----------- |\n| `@ulam/taho` | any | Vanilla core |\n| `@ulam/taho/react` | React | `useAnnounce`, `Announcer` |\n| `@ulam/taho/remix` | Remix | Route announcer, React re-exports |\n| `@ulam/taho/vue` | Vue 3 | `useAnnounce` composable |\n| `@ulam/taho/angular` | Angular 17+ | `AnnounceService` |\n| `@ulam/sili` | any | Vanilla core |\n| `@ulam/sili/react` | React | Hooks, overlay components, hash router |\n| `@ulam/sili/remix` | Remix | Same hooks, Remix router |\n| `@ulam/sili/vue` | Vue 3 | Composables matching all React hooks |\n| `@ulam/sili/angular` | Angular 17+ | Services and standalone directives |\n| `@ulam/calamansi` | any | Vanilla core |\n| `@ulam/calamansi/react` | React | `I18nProvider`, `useT`, `usePref` |\n| `@ulam/calamansi/vue` | Vue 3 | `useT`, `usePref` composables |\n| `@ulam/calamansi/angular` | Angular 17+ | `I18nService`, `PrefService` |\n| `@ulam/halohalo` | any | Vanilla core |\n| `@ulam/halohalo/react` | React | `useCompletion`, `useProviderConfig` |\n| `@ulam/halohalo/vue` | Vue 3 | `useCompletion`, `useProviderConfig` composables |\n| `@ulam/halohalo/angular` | Angular 17+ | `CompletionService`, `ProviderConfigService` |\n| `@ulam/ube` | any | Vanilla web components |\n| `@ulam/ube/core` | any | Web component registrations |\n| `@ulam/ube/react` | React | React component adapters |\n| `@ulam/ube/remix` | Remix | React re-exports (Remix is React-based) |\n| `@ulam/ube/vue` | Vue 3 | Vue component adapters |\n| `@ulam/ube/angular` | Angular 17+ | Angular component decorators, UbeModule |\n\n## Quick Start by Framework\n\n### React\n\n```javascript\nimport '@ulam/ube/base-tokens.css'\nimport '@ulam/ube/base-typography.css'\nimport '@ulam/ube/ui.css'\nimport '@ulam/sili/base.css'\n\nimport { Router } from '@ulam/sili/react'\nimport { Announcer } from '@ulam/taho/react'\nimport { I18nProvider } from '@ulam/calamansi/react'\nimport { Button, Dialog } from '@ulam/ube/react'\n\nfunction App() {\n  const [isOpen, setIsOpen] = useState(false)\n\n  return (\n    \u003cI18nProvider\u003e\n      \u003cRouter\u003e\n        \u003cAnnouncer /\u003e\n        \u003cButton onClick={() =\u003e setIsOpen(true)}\u003eOpen\u003c/Button\u003e\n        \u003cDialog open={isOpen} onClose={() =\u003e setIsOpen(false)} heading=\"Title\"\u003e\n          Content\n        \u003c/Dialog\u003e\n      \u003c/Router\u003e\n    \u003c/I18nProvider\u003e\n  )\n}\n```\n\n### Remix\n\nFor framework-agnostic focus management and vanilla utilities:\n\n```javascript\nimport { mountRouteFocus, focusPageHeading } from '@ulam/sili/remix'\nimport { announce } from '@ulam/taho/remix'\n```\n\nFor React routes in Remix, use the `/react` subexports:\n\n```javascript\nimport { useRouter, useRouteMatch } from '@ulam/sili/remix/react'\nimport { useRouteAnnouncer } from '@ulam/taho/remix/react'\nimport { Button } from '@ulam/ube/react'\n```\n\nWeb components work identically across all frameworks (`@ulam/ube/remix` re-exports from core).\n\n### Vue\n\nUse `/vue` subpaths:\n\n```javascript\nimport { useFocusTrap, useDir } from '@ulam/sili/vue'\nimport { useT } from '@ulam/calamansi/vue'\nimport { useAnnounce } from '@ulam/taho/vue'\nimport { Button } from '@ulam/ube/vue'\n```\n\n### Angular\n\nUse `/angular` subpaths:\n\n```typescript\nimport { FocusTrapDirective } from '@ulam/sili/angular'\nimport { I18nService } from '@ulam/calamansi/angular'\nimport { AnnounceService } from '@ulam/taho/angular'\nimport { UbeModule } from '@ulam/ube/angular'\n\n@NgModule({\n  imports: [UbeModule],\n})\nexport class AppModule {}\n```\n\n## Core Concepts\n\n- **Vanilla-first**: Every package has a vanilla core with zero dependencies. Framework adapters are optional add-ons.\n- **Independent**: Install only what you need. Packages don't import each other.\n- **Accessible by default**: All components handle focus, keyboard, ARIA, and screen reader support automatically.\n- **Strictly Linted**: The codebase enforces accessibility and inclusivity through `@a11yfred/neighbor`.\n- **Tree-shakeable**: Component CSS imports only what's used. Unused code doesn't bundle.\n\n## Resources\n\n- [@ulam/sili](packages/sili) — Focus management, overlays, routing\n- [@ulam/taho](packages/taho) — Live region announcements\n- [@ulam/calamansi](packages/calamansi) — i18n and utilities\n- [@ulam/ube](packages/ube) — UI components and theming\n- [@ulam/sawsawan](packages/sawsawan) — The sauce: integration layer\n\n## License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmikeyil%2Fulam","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmikeyil%2Fulam","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmikeyil%2Fulam/lists"}