{"_id":"@damarkuncoro/agnostic-ui-base","name":"@damarkuncoro/agnostic-ui-base","dist-tags":{"latest":"0.1.0"},"versions":{"0.1.0":{"name":"@damarkuncoro/agnostic-ui-base","description":"Agnostic UI Base","version":"0.1.0","type":"module","main":"dist/agnostic-ui-base/src/index.js","types":"dist/agnostic-ui-base/src/index.d.ts","exports":{".":{"types":"./dist/agnostic-ui-base/src/index.d.ts","import":"./dist/agnostic-ui-base/src/index.js","require":"./dist/agnostic-ui-base/src/index.js"}},"sideEffects":false,"publishConfig":{"access":"public"},"scripts":{"build":"tsc -p tsconfig.json","test":"vitest run"},"dependencies":{"@damarkuncoro/agnostic-ui-contracts":"workspace:*"},"devDependencies":{"typescript":"^5.0.0","vitest":"^3.0.0"},"license":"MIT","author":{"name":"Damar Kuncoro"},"keywords":["agnostic-ui","base","ui","hooks","typescript","design-system","a11y"],"repository":{"type":"git","url":"git+https://github.com/damarkuncoro/agnostic-ui.git"},"bugs":{"url":"https://github.com/damarkuncoro/agnostic-ui/issues"},"homepage":"https://github.com/damarkuncoro/agnostic-ui#readme","engines":{"node":">=18","pnpm":">=8"},"_id":"@damarkuncoro/agnostic-ui-base@0.1.0","gitHead":"8209de956f8cfcb4fd176bf3a102490d2cfa79e0","_nodeVersion":"20.19.4","_npmVersion":"10.8.2","dist":{"integrity":"sha512-9dmzWLq//QoVUnHz++2Y5KZPGTsUBwOaerDa15bpg1re6WLfy8veC0u7uBAlb7h3mhZQLRhqsc5LOKsQRoyxww==","shasum":"7faf786ce2b8a673e5895c6b82c92d2a3116da2e","tarball":"https://registry.npmjs.org/@damarkuncoro/agnostic-ui-base/-/agnostic-ui-base-0.1.0.tgz","fileCount":185,"unpackedSize":68269,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIHVbSJAnC9YYexPnXZMipUlY2foHWEeSn9nBTFYyA1GjAiAfiOPEt1ns6geYuYlirJD4TKnfZTbiGeLJNh8WzgRKhQ=="}]},"_npmUser":{"name":"damarkuncoro","email":"damarkuncoro@gmail.com"},"directories":{},"maintainers":[{"name":"damarkuncoro","email":"damarkuncoro@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/agnostic-ui-base_0.1.0_1766998228749_0.866685025648221"},"_hasShrinkwrap":false}},"time":{"created":"2025-12-29T08:50:28.696Z","0.1.0":"2025-12-29T08:50:28.913Z","modified":"2025-12-29T08:50:29.146Z"},"maintainers":[{"name":"damarkuncoro","email":"damarkuncoro@gmail.com"}],"description":"Agnostic UI Base","homepage":"https://github.com/damarkuncoro/agnostic-ui#readme","keywords":["agnostic-ui","base","ui","hooks","typescript","design-system","a11y"],"repository":{"type":"git","url":"git+https://github.com/damarkuncoro/agnostic-ui.git"},"author":{"name":"Damar Kuncoro"},"bugs":{"url":"https://github.com/damarkuncoro/agnostic-ui/issues"},"license":"MIT","readme":"# @damarkuncoro/agnostic-ui-base\n\nLapisan logika UI (Base) untuk Agnostic UI. Paket ini mengimplementasikan logika non-visual yang bersandar pada kontrak tipe dari `@damarkuncoro/agnostic-ui-contracts`. Fokus: resolusi props default, pembentukan state runtime, dan atribut a11y. Tidak bergantung pada framework (React/Vue) maupun Tailwind.\n\n## Ringkas\n- Import via alias: `@damarkuncoro/agnostic-ui-base`\n- Bergantung ke: `@damarkuncoro/agnostic-ui-contracts`\n- Tanggung jawab: `resolve props` → `state` → `a11y`\n- Tanpa UI framework dan styling (SRP, DRY, KISS, YAGNI)\n\n## Instalasi & Import\nMonorepo sudah memetakan alias ke source melalui `tsconfig.base.json`.\n\n```ts\n// Gunakan hook/utility dari Base\nimport { useUiButton } from '@damarkuncoro/agnostic-ui-base'\n```\n\nKontrak diimpor melalui alias:\n\n```ts\nimport { type UiButtonProps } from '@damarkuncoro/agnostic-ui-contracts'\n```\n\n## Struktur Direktori\n```\npackages/agnostic-ui-base/\n├─ src/\n│  ├─ ui/\n│  │  └─ button/\n│  │     ├─ use-button.ts\n│  │     ├─ resolve-button-props.ts\n│  │     ├─ create-button-state.ts\n│  │     ├─ create-button-a11y.ts\n│  │     └─ index.ts\n│  └─ index.ts\n└─ dist/ (hasil build)\n\n\n## API Surface\n- `useUiButton(props: UiButtonProps)` → mengorkestrasi resolusi props, state, dan a11y\n  - Sumber: `src/ui/button/use-button.ts`\n- `resolveUiButtonProps(props)` → menggabungkan default + validasi kontrak\n- `createUiButtonState(resolved)` → membentuk state runtime yang diturunkan dari props\n- `createUiButtonA11y(resolved, state)` → atribut aksesibilitas berdasarkan props/state\n\nTipe terkait:\n- `UiButtonResolvedProps` → props yang sudah dimerge dengan default\n- `UiButtonBase` → hasil dari `useUiButton` berisi `{ props, state, a11y }`\n\n## Contoh Penggunaan\n### 1) Menggunakan Base di adapter/komponen\n```ts\nimport { useUiButton } from '@damarkuncoro/agnostic-ui-base'\nimport { type UiButtonProps } from '@damarkuncoro/agnostic-ui/contracts'\n\nexport function createButtonModel(props: UiButtonProps) {\n  const base = useUiButton(props)\n  // base.props → props final (dengan default)\n  // base.state → state runtime\n  // base.a11y  → atribut aksesibilitas\n  return base\n}\n```\n\n### 2) Integrasi dengan Skin (kelas Tailwind)\n```ts\nimport { useUiButton } from '@damarkuncoro/agnostic-ui-base'\nimport { shadcn } from '@damarkuncoro/agnostic-ui-skin'\n\nconst { props } = useUiButton({ variant: 'primary', size: 'md' })\nconst className = shadcn.getButtonClass(props.variant, props.size)\n```\n\n### 3) Validasi props via kontrak (otomatis di Base)\n```ts\nimport { useUiButton } from '@damarkuncoro/agnostic-ui-base'\n\n// size/variant/type dll divalidasi oleh kontrak; error bila tidak valid\nconst { props } = useUiButton({ size: 'md', variant: 'primary' })\n```\n\n## Build & Test\n- Build: \n```\npnpm --filter @damarkuncoro/agnostic-ui-base build\n```\n- Test:\n```\npnpm --filter @damarkuncoro/agnostic-ui-base test\n```\n\nKonfigurasi terkait:\n- `packages/agnostic-ui-base/package.json` → `build`, `test`\n- `packages/agnostic-ui-base/tsconfig.json` → `outDir: dist`\n- `packages/agnostic-ui-base/vitest.config.ts` → alias untuk `@damarkuncoro/agnostic-ui/contracts`\n\n## Arsitektur & Aturan Dependency\n- Base → bergantung ke Contract\n- Skin → bergantung ke Base + Theme\n- Adapter (React/Vue) → menggabungkan Base + Skin (+ Theme bila perlu)\n- Contract → tidak bergantung apa pun\n\nPrinsip:\n- SRP: Base hanya mengurus logika non-visual\n- DRY: Resolusi props dan a11y terpusat\n- KISS/YAGNI: API sederhana, tanpa over-engineering\n- SOLID: Mematuhi kontrak yang stabil, komposisi di layer atas\n\n## Struktur Direktori\n```\npackages/agnostic-ui-base/\n├─ src/\n│  ├─ ui/\n│  │  └─ button/\n│  │     ├─ use-button.ts\n│  │     └─ index.ts\n│  └─ index.ts\n├─ test/\n│  └─ ui/\n│     └─ button/\n│        └─ use-button.spec.ts\n├─ package.json\n├─ tsconfig.json\n└─ vitest.config.ts\n```\n\n## Catatan\n- Entry ekspor: `packages/agnostic-ui-base/src/index.ts`\n- Ikuti kontrak dari `@damarkuncoro/agnostic-ui-contracts` untuk tipe, props, state, a11y\n- Tambahkan komponen Base baru (mis. `input`, `switch`) dengan pola yang sama: `resolve → state → a11y`\n","readmeFilename":"README.md","_rev":"1-86422aa0b0863227991f2fc66d18aaaf"}