{"_id":"@consulting-leadership-growth/clg-ui","name":"@consulting-leadership-growth/clg-ui","dist-tags":{"latest":"0.0.0"},"versions":{"0.0.0":{"name":"@consulting-leadership-growth/clg-ui","version":"0.0.0","description":"Internal React component library and design system for Consulting Leadership Growth.","private":false,"license":"UNLICENSED","repository":{"type":"git","url":"git+https://github.com/Consulting-Leadership-Growth/clg-ui.git"},"packageManager":"yarn@1.22.22","engines":{"node":">=24.0.0 <25","yarn":">=1.22.22 <2"},"type":"module","main":"./dist/index.js","module":"./dist/index.js","types":"./dist/lib.d.ts","style":"./dist/styles.css","sideEffects":["**/*.css"],"exports":{".":{"types":"./dist/lib.d.ts","import":"./dist/index.js"},"./styles.css":"./dist/styles.css","./package.json":"./package.json"},"peerDependencies":{"react":"^18.2.0 || ^19.0.0","react-dom":"^18.2.0 || ^19.0.0"},"resolutions":{"vite":"6.4.3"},"scripts":{"dev":"vite","start":"vite","build":"yarn build:lib","build:app":"vite build","build:lib":"vite build --config vite.lib.config.ts","validate:package":"node scripts/validate-package.mjs","test":"vitest","test:ci":"vitest run","storybook":"storybook dev -p 6006","build-storybook":"storybook build","lint":"eslint . --ext .js,.cjs,.ts,.tsx","typecheck":"tsc --noEmit","validate":"yarn lint && yarn typecheck && yarn test:ci && yarn build:app && yarn build:lib && yarn validate:package && yarn build-storybook","changeset":"changeset","changeset:status":"changeset status","version-packages":"changeset version","release":"yarn build:lib && npm publish","prepare":"husky install","lint-staged":"lint-staged","commit":"git-cz"},"lint-staged":{"*.{js,cjs,ts,tsx}":"eslint --fix"},"devDependencies":{"@changesets/cli":"2.31.0","@commitlint/cli":"^18.2.0","@commitlint/config-conventional":"^18.1.0","@storybook/addon-essentials":"8.6.14","@storybook/addon-interactions":"8.6.14","@storybook/addon-links":"8.6.14","@storybook/blocks":"8.6.14","@storybook/react":"8.6.14","@storybook/react-vite":"8.6.14","@storybook/test":"8.6.14","@testing-library/dom":"8.20.1","@testing-library/jest-dom":"6.6.3","@testing-library/react":"13.4.0","@testing-library/user-event":"13.5.0","@types/node":"24.13.2","@types/react":"18.2.25","@types/react-dom":"18.2.10","@typescript-eslint/eslint-plugin":"8.35.1","@typescript-eslint/parser":"8.35.1","@vitejs/plugin-react":"4.7.0","commitizen":"^4.3.0","cz-conventional-changelog":"^3.3.0","eslint":"8.57.1","eslint-plugin-jsx-a11y":"6.10.2","eslint-plugin-react":"7.37.5","eslint-plugin-react-hooks":"5.2.0","eslint-plugin-storybook":"0.11.6","husky":"^8.0.3","jsdom":"26.1.0","lint-staged":"^15.0.2","prop-types":"^15.8.1","react":"18.2.0","react-dom":"18.2.0","sass":"1.69.3","storybook":"8.6.14","typescript":"5.7.3","vite":"6.4.3","vite-plugin-dts":"4.5.4","vitest":"3.2.6"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"gitHead":"a2483bff2e30c7e9b4b786c9ada98ce0bb74676f","_id":"@consulting-leadership-growth/clg-ui@0.0.0","bugs":{"url":"https://github.com/Consulting-Leadership-Growth/clg-ui/issues"},"homepage":"https://github.com/Consulting-Leadership-Growth/clg-ui#readme","_nodeVersion":"24.16.0","_npmVersion":"11.13.0","dist":{"integrity":"sha512-Icn6dDHtpbhdvtOc6gqhuKuLbOOJDUUXO+ss1KUCK93XEUPpyVUQSfZdYgTNUMteGFtUSm3Yb00Y0JoSP2XPzg==","shasum":"3310e372db5a6568ae9d311d03778b7b3601615d","tarball":"https://registry.npmjs.org/@consulting-leadership-growth/clg-ui/-/clg-ui-0.0.0.tgz","fileCount":41,"unpackedSize":146551,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQD/K7wvxyE4/YilzlzBjk7kVnKcg3EHK3AOfhvQF5OmfwIgS75lGfqzeluTH6vLsbm7DUswbkAaAcmMenppYuQJqO0="}]},"_npmUser":{"name":"consulting-leadership-growth","email":"dev_gaspar@outlook.com"},"directories":{},"maintainers":[{"name":"consulting-leadership-growth","email":"dev_gaspar@outlook.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/clg-ui_0.0.0_1783133916444_0.6941893362678693"},"_hasShrinkwrap":false}},"time":{"created":"2026-07-04T02:58:36.333Z","0.0.0":"2026-07-04T02:58:36.564Z","modified":"2026-07-04T02:58:36.790Z"},"maintainers":[{"name":"consulting-leadership-growth","email":"dev_gaspar@outlook.com"}],"description":"Internal React component library and design system for Consulting Leadership Growth.","homepage":"https://github.com/Consulting-Leadership-Growth/clg-ui#readme","repository":{"type":"git","url":"git+https://github.com/Consulting-Leadership-Growth/clg-ui.git"},"bugs":{"url":"https://github.com/Consulting-Leadership-Growth/clg-ui/issues"},"license":"UNLICENSED","readme":"# CLG-UI\r\n\r\nCLG-UI is the shared React component library and design system maintained by\r\nthe CLG team. It provides accessible, mobile-first foundations for React,\r\nNext.js, and Electron renderer applications.\r\n\r\nStorybook is the component catalog, documentation website, and development\r\nworkshop for the library.\r\n\r\n> **Status:** the design system foundations and first five component batches\r\n> are complete. The project now builds as an installable Vite library and is\r\n> being prepared for private GitHub Packages releases.\r\n\r\n## Design foundation\r\n\r\n- **Primary color:** CLG Violet (`#6258E9`)\r\n- **Typeface:** Nunito (`400`, `500`, `600`, and `700`)\r\n- **Themes:** light and dark\r\n- **Approach:** semantic tokens, mobile first, accessible by default\r\n\r\nBrand values live in the token layer. Components consume semantic CSS custom\r\nproperties instead of hardcoded colors or typography decisions.\r\n\r\n## Component catalog\r\n\r\nCLG-UI currently contains 17 components.\r\n\r\n| Category | Components |\r\n| --- | --- |\r\n| Actions | `Button`, `IconButton`, `Link` |\r\n| Forms | `Input`, `Textarea`, `Select`, `Checkbox`, `Radio`, `RadioGroup`, `Switch` |\r\n| Data Display | `Badge`, `Card` |\r\n| Feedback | `Alert`, `Spinner` |\r\n| Overlays | `Modal` |\r\n| Typography | `Heading`, `Text` |\r\n\r\nThe catalog includes component variants, states, behavior examples, and\r\nfoundation documentation for colors, typography, and spacing.\r\n\r\n## Compatibility\r\n\r\n| Platform | Support |\r\n| --- | --- |\r\n| React | Supported |\r\n| Next.js | Supported when React client boundaries are respected |\r\n| Electron | Supported in React renderer processes |\r\n| React Native | Not supported |\r\n| Vue, Angular, or plain HTML | Require a separate adapter or implementation |\r\n\r\nVisual components must not depend directly on Next.js, Electron, product state,\r\nor platform-specific APIs.\r\n\r\n## Getting started\r\n\r\n### Requirements\r\n\r\n- Node.js 24 LTS (`24.17.0` recommended in `.nvmrc`)\r\n- Yarn `1.22.22`\r\n\r\nYarn is the only project package manager. The required versions are recorded in\r\n`.nvmrc` and `package.json`. Do not generate or commit `package-lock.json`.\r\n\r\n### Installation\r\n\r\n```bash\r\nyarn install\r\n```\r\n\r\n### Run Storybook\r\n\r\n```bash\r\nyarn storybook\r\n```\r\n\r\nOpen [http://localhost:6006](http://localhost:6006).\r\n\r\n### Run the local application shell\n\n```bash\nyarn dev\n```\n\nThe local shell is a visual composition preview only. It does not provide\nauthentication, account creation, or data submission. Storybook runs as a\nseparate development command and the preview does not assume that its local\nserver is already available.\n\r\n## Quality checks\r\n\r\nRun the complete validation pipeline before opening a pull request:\r\n\r\n```bash\r\nyarn validate\r\n```\r\n\r\nGitHub Actions runs the same validation on pull requests and pushes to\r\n`master`, using Node.js from `.nvmrc` and the committed Yarn lockfile.\r\n\r\nThe command runs:\r\n\r\n```bash\r\nyarn lint\r\nyarn typecheck\r\nyarn test:ci\r\nyarn build:app\r\nyarn build:lib\r\nyarn validate:package\r\nyarn build-storybook\r\n```\r\n\r\nCurrent baseline:\r\n\r\n- 15 test suites;\r\n- 32 behavior tests;\r\n- application build;\r\n- Storybook production build;\r\n- desktop and 390 px mobile browser review;\r\n- light and dark theme review.\r\n\r\n## Versioning and releases\r\n\r\nCLG-UI follows semantic versioning through Changesets.\r\n\r\n```bash\r\nyarn changeset\r\n```\r\n\r\nUse `patch` for compatible fixes, `minor` for backward-compatible public\r\nfeatures, and `major` for breaking public API or token changes.\r\n\r\nWhen a release is ready, maintainers run `yarn version-packages` and open a\r\nversion pull request containing the package version and changelog updates.\r\nAfter that pull request is merged, publishing a matching GitHub Release such as\r\n`v0.1.0` validates and publishes the package to the private GitHub Packages\r\nregistry.\r\n\r\nPackage publication is intentionally gated by the GitHub Release action. A\r\nnormal merge to `master` never publishes a package.\r\n\r\nThe initial release is planned as `0.1.0`.\r\n\r\n## Architecture\r\n\r\n```text\r\nsrc/\r\n  components/\r\n    _internal/\r\n      Field/              shared non-public field infrastructure\r\n    Alert/\r\n    Badge/\r\n    Button/\r\n    ...\r\n    index.ts              public component barrel\r\n  styles/\r\n    tokens/\r\n      _breakpoints.scss\r\n      _layout.scss\r\n      _primitives.scss\r\n      _theme.scss\r\n    global.scss\r\n  storybook/\r\n    foundations/\r\n    Introduction.mdx\r\n  utils/\r\n  lib.ts                  public library entry point\r\ndocs/\r\n  component-guidelines.md\r\n  roadmap.md\r\n```\r\n\r\nEach public component is colocated with its implementation, Sass styles,\r\nStorybook stories, tests, and directory exports.\r\n\r\nInternal modules under `src/components/_internal` are not part of the consumer\r\nAPI.\r\n\r\n## Intended package usage\r\n\r\nThe library build emits ESM JavaScript, TypeScript declarations, and a\r\ndistributable stylesheet. After a version is published, applications consume\r\nit through:\r\n\r\n```tsx\r\nimport {\r\n  Button,\r\n  Card,\r\n  Modal,\r\n} from \"@consulting-leadership-growth/clg-ui\";\r\nimport \"@consulting-leadership-growth/clg-ui/styles.css\";\r\n\r\nexport function Example() {\r\n  return (\r\n    <Card>\r\n      <Button>Continue</Button>\r\n    </Card>\r\n  );\r\n}\r\n```\r\n\r\nConsumers must not import source files directly:\r\n\r\n```tsx\r\n// Correct\r\nimport { Button } from \"@consulting-leadership-growth/clg-ui\";\r\n\r\n// Incorrect\r\nimport { Button } from\r\n  \"@consulting-leadership-growth/clg-ui/src/components/Button/Button\";\r\n```\r\n\r\n## Creating a component\r\n\r\nRead the [Component Development Workflow](docs/component-development.md) and\r\n[Component Guidelines](docs/component-guidelines.md) before implementing or\r\nreviewing a component.\r\n\r\nEvery public component must provide:\r\n\r\n- a small and explicit TypeScript API;\r\n- semantic HTML and keyboard behavior;\r\n- accessible names and visible focus;\r\n- mobile-first styles using semantic tokens;\r\n- light and dark theme support;\r\n- Storybook documentation;\r\n- behavior tests where relevant;\r\n- public exports without internal implementation leakage.\r\n\r\nRecommended structure:\r\n\r\n```text\r\nComponentName/\r\n  ComponentName.tsx\r\n  ComponentName.scss\r\n  ComponentName.stories.tsx\r\n  ComponentName.test.tsx\r\n  index.ts\r\n```\r\n\r\n## Contribution workflow\r\n\r\nStart with [CONTRIBUTING.md](CONTRIBUTING.md). It links the complete local\r\nsetup, component, pull request, release, and package-consumption workflows.\r\n\r\nCommit interactively with:\r\n\r\n```bash\r\nyarn commit\r\n```\r\n\r\nCommon prefixes:\r\n\r\n- `feat:` new behavior or component;\r\n- `fix:` bug fix;\r\n- `docs:` documentation only;\r\n- `test:` test-only changes;\r\n- `refactor:` internal change without public behavior changes;\r\n- `chore:` tooling or repository maintenance.\r\n\r\n## Roadmap\r\n\r\nThe current phase prepares the Vite library for automated private releases:\r\n\r\n1. automated CI and accessibility checks;\r\n2. semantic versioning and Changesets;\r\n3. React, Next.js, and Electron consumer validation;\r\n4. private `@consulting-leadership-growth/clg-ui` publication.\r\n\r\nResponsibilities, decisions, and acceptance criteria are tracked in the\r\n[Project Roadmap](docs/roadmap.md).\r\n\r\n## Project documentation\r\n\r\n- [Contribution Guide](CONTRIBUTING.md)\r\n- [Development Setup](docs/development-setup.md)\r\n- [Component Development Workflow](docs/component-development.md)\r\n- [Component Guidelines](docs/component-guidelines.md)\r\n- [Pull Request Workflow](docs/pull-requests.md)\r\n- [Releases and Private Publication](docs/releases.md)\r\n- [Consuming CLG-UI](docs/consuming-package.md)\r\n- [Project Roadmap](docs/roadmap.md)\r\n- [Persistent Project Memory](AGENTS.md)\r\n\r\n## License and distribution\r\n\r\nThe repository is currently private and marked `UNLICENSED`. This means it is\r\ninternal proprietary software and does not grant public reuse rights.\r\n\r\nThe package will be published privately through GitHub Packages as\r\n`@consulting-leadership-growth/clg-ui`. Access will follow the CLG GitHub\r\norganization and repository permissions.\r\n","readmeFilename":"README.md","_rev":"1-d16d4e967857d33c89697cf2dde1edf3"}