{"id":20102493,"url":"https://github.com/clickhouse/click-ui","last_synced_at":"2026-04-09T21:19:13.292Z","repository":{"id":157435957,"uuid":"615461459","full_name":"ClickHouse/click-ui","owner":"ClickHouse","description":"The home of the ClickHouse design system and component library.","archived":false,"fork":false,"pushed_at":"2026-02-23T19:38:58.000Z","size":10826,"stargazers_count":116,"open_issues_count":87,"forks_count":15,"subscribers_count":25,"default_branch":"main","last_synced_at":"2026-02-23T20:28:36.627Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://clickhouse.design/click-ui","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ClickHouse.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","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,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2023-03-17T18:47:19.000Z","updated_at":"2026-02-21T22:17:30.000Z","dependencies_parsed_at":"2026-02-23T14:04:31.856Z","dependency_job_id":"99dad4e7-7500-4349-a335-8745d2da474c","html_url":"https://github.com/ClickHouse/click-ui","commit_stats":null,"previous_names":[],"tags_count":260,"template":false,"template_full_name":null,"purl":"pkg:github/ClickHouse/click-ui","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ClickHouse%2Fclick-ui","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ClickHouse%2Fclick-ui/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ClickHouse%2Fclick-ui/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ClickHouse%2Fclick-ui/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ClickHouse","download_url":"https://codeload.github.com/ClickHouse/click-ui/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ClickHouse%2Fclick-ui/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29831700,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-25T15:41:19.027Z","status":"ssl_error","status_checked_at":"2026-02-25T15:40:47.150Z","response_time":61,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"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":[],"created_at":"2024-11-13T17:31:24.907Z","updated_at":"2026-04-09T21:19:13.269Z","avatar_url":"https://github.com/ClickHouse.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://clickhouse.com\" target=\"_blank\"\u003e\n    \u003cimg\n      alt=\"Clickhouse logo\"\n      src=\"./.repo/images/banner.jpg?202601211122\"\n    /\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n# Click UI\n\n[![Conventional Commits](https://img.shields.io/badge/Conventional%20Commits-1.0.0-blue.svg)](https://conventionalcommits.org)\n\nClick UI is the ClickHouse design system and component library. Our aim with Click UI is to provide an accessible, theme-able, modern, and attractive interface with which to experience the speed and power of ClickHouse.\n\nYou can find the official docs for the Click UI design system and component library at [clickhouse.design/click-ui](https://clickhouse.design/click-ui).\n\n## Overview\n\n* [Requirements](#requirements)\n* [Quick Start](#quick-start)\n* [Development](#development)\n  - [Generating design tokens](#generating-design-tokens)\n  - [Local development](#local-development)\n  - [Circular dependency check](#circular-dependency-check)\n* [Tests](#Tests)\n  - [Functional tests](#functional-tests)\n  - [Visual regression tests](#visual-regression-tests)\n* [Storybook](#storybook)\n  - [Stories development server](#stories-development-server)\n  - [Public static site](#public-static-site)\n* [Distribution](#distribution)\n  - [Build](#build)\n  - [Use Click UI](#use-click-ui)\n  - [Component-level imports](#component-level-imports)\n  - [Public API](#public-api)\n  - [Examples](#examples)\n* [Themes](#themes)\n  - [Prevent theme flash](#prevent-theme-flash)\n  - [Theme Persistence](#theme-persistence)\n  - [Custom styling with CSS](#custom-styling-with-css)\n* [Assets Management](#assets-management)\n  - [Convert SVG to React Component](#convert-svg-to-react-component)\n* [Changesets](#changesets)\n  - [Add a new changeset](#add-a-new-changeset)\n  - [Checking the changeset status](#checking-the-changeset-status)\n  - [Create a new version and changelogs](#create-a-new-version-and-changelogs)\n* [Release](#release)\n* [Contributing](#contributing)\n  - [Component RFC](#component-rfc)\n  - [Conventional commits](#conventional-commits)\n\n## Requirements\n\n- Nodejs (\u003e= 22.12.x) as runtime\n- Yarn (\u003e= 4.5.3) for development, any other package manager in a host project\n\n## Quick Start\n\nInstall the package via npm or your favourite package manager:\n\n```sh\nnpm i @clickhouse/click-ui@latest\n```\n\nTo use Click UI, you must wrap your application in the provider. This ensures styles and themes are applied correctly across all components.\n\n```ts\nimport { ClickUIProvider, Title, Text } from '@clickhouse/click-ui'\n\nfunction App() {\n  return (\n    \u003cClickUIProvider theme=\"dark\"\u003e\n      \u003cTitle type=\"h1\"\u003eHello ClickHouse\u003c/Title\u003e\n      \u003cText\u003eStart building today!\u003c/Text\u003e\n    \u003c/ClickUIProvider\u003e\n  )\n}\n```\n\nFor more examples, including theme switching and configuration, see the [How to](#how-to-use) use section, or explore our design system at [clickhouse.design/click-ui](https://clickhouse.design/click-ui).\n\n## Development\n\nThe project uses yarn package manager for development.\n\nAfter cloning the repository change to the work directory and install the dependencies:\n\n```sh\nyarn\n```\n\n### Circular dependency check\n\nCheck for circular dependencies that can cause build and runtime issues:\n\n```sh\nyarn circular-dependency:check\n```\n\n\u003e [!TIP]\n\u003e Set RUN_DEPS_CHECK=1 to run circular dependency checks automatically on commit.\n\nIf circular dependencies are found it'll exit with a report showing the affeced files which require your attention.\n\n### Generating design tokens\n\nTokens are provided by a style directionary sourced from [tokens-studio](https://tokens.studio/).\n\nIt's expected to have theme tokens provided externally, e.g. Figma tokens-studio output is stored in the repository and a PR's opened. The assets are stored in the directory [./tokens/themes].\n\nOnce [./tokens/themes] files are updated or provided from exernal source, e.g. Figma, we must regenerate the tokens for consumption in the project.\n\nRun the command to generate tokens in the path `./src/theme/tokens/`:\n\n```sh\nyarn generate:tokens\n```\n\nOnce done, you must commit the changes.\n\nLearn more about tokens-studio [here](https://documentation.tokens.studio/).\n\n### Local development\n\nWe leverage Storybook as our primary development environment and documentation, see [Storybook](#storybook).\n\nYou can start the Storybook development server by:\n\n```sh\nyarn dev\n```\n\n\nWe do NOT maintain a separate development environment; our Storybook stories serve as the source of truth for component implementation.\n\n\u003e [!IMPORTANT]\n\u003e We operate collaboratively with the Product Design team. While stories reflect the current implementation (live), Figma files remain the source of truth for design research and decision-making. Changes are typically finalized in Figma before being implemented in code to ensure design-sync.\n\nBy avoiding local preview files, we ensure that component experimentation happens in isolation; free from application side effects and providing a live look at component interfaces and usage examples at time of writing.\n\n\u003e [!NOTE]\n\u003e To ensure stability, we utilize Visual Regression and Unit Testing, see [tests](#tests). When contributing features or tweaks, you're expected to include or update the relevant tests to maintain stability, e.g. remember the components are consumed by a number of applications.\n\nTo get started with the development playground, refer to the Storybook section [here](#storybook).\n\n## Tests\n\n### Functional tests\n\nThe package uses [vitest](https://vitest.dev/) and [react testing library](https://testing-library.com) for tests, e.g. functional tests.\n\n```sh\nyarn test\n```\n\n### Visual regression tests\n\nThe project uses [Chromatic](https://www.chromatic.com/) for visual regression testing of UI components.\n\nIt captures screenshots of Storybook and compares them across builds to detect unintended visual changes by:\n\n- Automated visual testing in GitHub CI/CD pipeline, e.g. storybook publish, UI tests\n- Leveraging storybook stories\n- Provides visual diff reviews and approval workflows\n- Helps catch UI bugs\n\nTo setup, you must get a team member project token.\n\nAdd the token as an environment variable to your environment preference or profile, e.g. `~/.zshrc`:\n\n```sh\nexport CHROMATIC_PROJECT_TOKEN=\u003cYOUR-TOKEN-HERE\u003e\n```\n\nOnce ready, you can run tests by:\n\n```sh\nyarn test:chromatic\n```\n\u003e [!NOTE]\n\u003e Chromatic does NOT generate a report in the terminal due to its cloud nature, which only outputs:\n\u003e - Build status, e.g. uploading or testing\n\u003e - Link to the cloud runner or dashboard\n\u003e - Exit code\n\nIf you need quicker iteration feedback, or more testing control during local development, read [here](./docs/tests/playwright.md)\n\n## Storybook\n\nThe component library provides a collection of ready-to-use components. We use [Storybook](#storybook) to showcase and document our components.\n\n### Stories development server\n\nStart the storybook development server:\n\n```sh\nyarn storybook\n```\n\nIt'll default to the location [http://localhost:6006](http://localhost:6006), if port available.\n\n### Build static site\n\nTo build a static version:\n\n```sh\nyarn storybook:build\n```\n\nOnce built, you can serve the static files by:\n\n```sh\nyarn storybook:serve\n```\n\n### Public Static Site\n\nThe latest static version's built and deployed automatically when contributing to `main` of [Click UI](https://github.com/ClickHouse/click-ui).\n\nOnce deployed it's available publicly at [clickhouse.design/click-ui](https://clickhouse.design/click-ui).\n\n## Changeset\n\nLearn to manage the versioning of changelog entries.\n\nThe following is a brief description of available commands to allow a person making a contribution make key decisions about their changes.\n\nIt'll generate a changeset, which is effectively two key bits of information:\n\n- A version type which follows [semver](https://semver.org/)\n- Change information placed in a changelog\n\nMake good use of this simple workflow to help us release new package versions more confidently.\n\n### Add a new changeset\n\nWhen contributing, declare an intent or describe the changes you're making or adding to a release by executing the `changeset:add` command.\n\nThe wizard will ask a few questions and generate a changelog entry for you:\n\n```sh\nyarn changeset:add\n```\n\nThe changesets tool keeps track of all declared changes in the `.changeset` directory.\n\nOnce completed, you must commit the changeset!\n\n### Checking the changeset status\n\nTo check if your branch contains a changeset:\n\n```sh\nyarn changeset:status\n```\n\n### Create a new version and changelogs\n\nTo consume all changesets, and update to the most appropriate semver version and write a friendly changelog based on those changesets, the following command is available:\n\n\u003e [!IMPORTANT]\n\u003e Consuming changesets is done automatically in the CI/CD environment. For this reason, you don't have to execute the command, as a contributor your single concern should be adding changesets to any relevant changes.\n\n```sh\nyarn changeset:version\n```\n\n## Distribution\n\nThe package is distributed as ESM.\n\n### Build\n\nTo build the distribution version of the package run:\n\n```sh\nyarn build\n```\n\n\u003e [!NOTE]\n\u003e Optimizations are responsability of consumer or host apps, e.g. they can't remove unused code if already minified it! We ship unminified code so their build tools can: analyse and remove what they don't need or dead code, debug more easily, compress everything together in one go instead of handling conflicting compression algorithms, etc.\n\n### Use Click UI\n\nNavigate to your app's work directory and add the package.\n\nHere, we use `yarn` but you can use your favorite package manager, e.g. pnpm.\n\n```sh\nyarn add @clickhouse/click-ui\n```\n\u003e [!NOTE]\n\u003e Click UI should be supported by react frameworks.\n\u003e If you run into any issues consuming it in your react app, report it [here](https://github.com/ClickHouse/click-ui/issues/new). Provide all important details, including information on how to replicate the issue!\n\nOnce installed, wrap the application with Click UI provider:\n\n```js\nimport { ClickUIProvider } from '@clickhouse/click-ui'\n\nexport default () =\u003e {\n  return (\n    \u003cClickUIProvider theme='light'\u003e\n      \u003cp\u003eHello world!\u003c/p\u003e\n    \u003c/ClickUIProvider\u003e\n  );\n}\n```\n\nAfter, you are able to import your favorite [Click UI components](https://clickhouse.design/click-ui).\n\n```js\nimport { ClickUIProvider, Title } from '@clickhouse/click-ui'\n\nexport default () =\u003e {\n  return (\n    \u003cClickUIProvider theme='light'\u003e\n      \u003cTitle type='h1'\u003eClick UI Example\u003c/Title\u003e\n    \u003c/ClickUIProvider\u003e\n  );\n}\n```\n\nTo learn more about individual components, visit [Click UI components](https://clickhouse.design/click-ui).\n\n### Component-level imports\n\nComponents can be imported directly by name, providing a succinct import syntax.\n\n```ts\nimport { Button } from '@clickhouse/click-ui/Button';\n```\n\nThe exports map is auto-generated from the public API defined in `src/index.ts`, learn to manage by reading the [Public API](#public-api) section.\n\n\u003e [!WARNING]\n\u003e Some components depend on the theme provider. These will fail if used outside of `ClickUIProvider`. In next versions, this will change and consumer apps will have the ability to use them without the provider wrapping.\n\n### Public API\n\nThe public API is controlled through the main barrel file at `src/index.ts`. This file serves as the single source of truth for all components, types, and utilities exported by the package.\n\n\u003e [!NOTE]\n\u003e The `generate:exports` script uses the TypeScript Compiler API to parse `src/index.ts` directly and extract only the components that are explicitly exported. This ensures that only public API components get subpath exports in `package.json`, while internal components remain inaccessible via direct imports.\n\nMaintainers can add or remove components from the public API by updating the exports in this file. Each export should include both the component and its associated types to ensure consumers have full type support.\n\nHere's an example of `src/index.ts`:\n\n```ts\n// Adding a new component to the public API\nexport { Button } from './components/Button';\nexport type { ButtonProps } from './components/Button';\n\n// Removing a component (simply delete)\n```\n\nAfter, you must run the `generate:exports` to update the component-level exports in the package.json file:\n\n```sh\nyarn generate:exports\n```\n\nOnce complete, commit your changes.\n\n#### Breaking change support\n\nWhen introducing breaking changes or deprecating types, maintainers can provide retroactive support by creating custom type aliases. This allows consumers to migrate gradually while maintaining backwards compatibility.\n\n```ts\n// Backwards compatibility: export legacy type name\n// that maps to the new type\nexport type { NewComponentProps as LegacyComponentProps } from './components/NewComponent';\n\n// Or create a custom type for transition periods\nexport type DeprecatedProps = NewProps \u0026 {\n  /** @deprecated Use `newProp` instead */\n  oldProp?: string;\n};\n```\n\n\u003e [!NOTE]\n\u003e When deprecating types or components, consider adding JSDoc `@deprecated` annotations to guide consumers towards the updated API. This provides clear migration paths and IDE warnings.\n\n### Examples\n\nHere's a quick copy and paste NextJS example with interactive components you can play:\n\n```ts\nimport { ClickUIProvider, Text, ThemeName, Title, Switch } from '@clickhouse/click-ui'\nimport { useState } from 'react'\n\nfunction App() {\n  const [theme, setTheme] = useState\u003cThemeName\u003e('dark')\n\n  const toggleTheme = () =\u003e {\n    theme === 'dark' ? setTheme('light') : setTheme('dark')\n  }\n\n  return (\n    \u003cClickUIProvider theme={theme} config={{tooltip:{ delayDuration: 0 }}}\u003e\n      \u003cSwitch \n        checked={theme === 'dark'} \n        onCheckedChange={() =\u003e toggleTheme()} \n        label=\"Dark mode\"\n      /\u003e\n\n      \u003cTitle type='h1'\u003eClick UI Example\u003c/Title\u003e\n      \u003cText\u003eWelcome to Click UI. Get started here.\u003c/Text\u003e\n    \u003c/ClickUIProvider\u003e\n  )\n}\n\nexport default App\n```\n\n## Themes\n\nTheming allows the end-user to select its preferred colour theme. You are responsible for managing your own theme state. Use your preferred state management solution (React state, Zustand, Redux, Context, etc.) and pass the current theme to the provider.\n\n\u003e [!NOTE]\n\u003e Currently, styling is done with css-in-js which might cause some flash since it has to compute the theme and apply it. We'll be moving from styled-components and this shall be changed and improved.\n\n### Prevent theme flash\n\nTo prevent flash of incorrect theme, import the `InitCUIThemeScript` component and place it in the `\u003chead\u003e` of your HTML.\n\nThe script reads the theme from localStorage and applies it immediately before React hydration to prevent flashing.\n\n```ts\nimport { InitCUIThemeScript } from '@clickhouse/click-ui';\n```\n\nSimple usage (no props needed):\n\n```jsx\n\u003chtml\u003e\n  \u003chead\u003e\n    \u003cInitCUIThemeScript /\u003e\n  \u003c/head\u003e\n  \u003cbody\u003e\n    \u003cClickUIProvider theme={theme} persistTheme\u003e\n      {children}\n    \u003c/ClickUIProvider\u003e\n  \u003c/body\u003e\n\u003c/html\u003e\n```\n\n\u003e [!NOTE]\n\u003e On initial load, the component `InitCUIThemeScript` reads localStorage and applies the theme immediately before React hydration. When the theme changes the ClickUIProvider stores the new theme to localStorage (persistTheme must be enabled). Finally, when page loads/refreshes the process reads from the stored theme from localStorage.\n\nThe process will check localStorage for a theme, e.g. in the key `cui-theme` and apply it immediately preventing flashing. Otherwise, if nothing's stored it'll fallback to the default value `light`.\n\n\u003e [!IMPORTANT]\n\u003e If you'd like to override the theme fallback when localStorage is empty, you can do it by setting a value for property `defaultTheme`, e.g. `dark`.\n\n### Theme Persistence\n\nTo enable theme persistence across page reloads, enable `persistTheme` (default: `true`). The provider will automatically save theme changes to localStorage.\n\nNotice that we manage theme state in the consumer side:\n\n```tsx\nimport { ClickUIProvider } from '@clickhouse/click-ui';\nimport { useState } from 'react';\n\nexport const App = () =\u003e {\n  const [theme, setTheme] = useState\u003c'dark' | 'light'\u003e('dark');\n\n  return (\n    \u003cClickUIProvider \n      theme={theme}\n      persistTheme\n    \u003e\n      \u003cbutton onClick={() =\u003e setTheme(theme === 'dark' ? 'light' : 'dark')}\u003e\n        Switch to {theme === 'dark' ? 'Light' : 'Dark'} Mode\n      \u003c/button\u003e\n    \u003c/ClickUIProvider\u003e\n  );\n};\n```\n\n\u003e [!TIP]\n\u003e An example of NextJS with Server Side Rendering (SSR) is available [here](/docs/examples/nextjs-app-router-with-ssr.md), where you can see how the root `data-cui-theme` is handled.\n\n### Custom Styling with CSS\n\nThe `InitCUIThemeScript` applies a `data-cui-theme` attribute to the root `\u003chtml\u003e` element, allowing you to style custom elements with vanilla CSS.\n\nFor example, edit your consumer app `stylesheet` and introduce custom styles as follows:\n\n```css\n[data-cui-theme=\"light\"] {\n  --my-app-bg: #ffffff;\n  --my-app-text: #1a1a1a;\n}\n\n[data-cui-theme=\"dark\"] {\n  --my-app-bg: #0a0a0a;\n  --my-app-text: #f5f5f5;\n}\n\n.my-custom-component {\n  background: var(--my-app-bg);\n  color: var(--my-app-text);\n}\n```\n\n## Assets management\n\nThe Click UI has image asset files, such as Flags, Icons, Logos and Payments.\n\nFiles are originally curated in the context of the design system Figma project. Once exported/sourced from the Figma project file these have to be transformed into the Click UI desired format, e.g. an SVG as a React Component.\n\n### Convert SVG to React Component\n\nWe provide an automated tool to convert SVG files to React components for Flags, Icons, Logos and Payments.\n\nLet's assume that you want to add a new logo. You are a macOS user and have stored the logo SVG file in your home **Downloads** directory, e.g. **/Users/MyUsername/Downloads**.\n\nIn the root of Click UI repository, you'd run:\n\n```sh\nyarn convert:logo ~/Downloads/click-ui.svg\n```\n\nOr provide explicit component name:\n\n```sh\nyarn convert:logo ~/Downloads/click-ui.svg Click_UI\n```\n\nAlternatively, you can replace `logo` in the command by the remaining assets types, e.g. `convert:flag` or `convert:icon`.\n\nFor more detailed instructions, see [converting SVG to React Components](./docs/converting-svg-to-react-components).\n\n## Release\n\nReleases are automated via GitHub Actions. A workflow creates a PR with version bumps and changelogs for review. Once merged, the package is published to npm and a GitHub release is created.\n\nUse the [Create a new release Pull Request](./docs/package-release.md#create-a-new-release-pull-request) for a quick automated process.\n\nSee [Package Release](./docs/package-release.md) for detailed instructions, including use-cases.\n\n### Component RFC\n\nTo propose a new component, open an RFC using the [Component RFC template](https://github.com/ClickHouse/click-ui/compare/main...branchName?template=component_rfc.md).\n\n\u003e [!NOTE]\n\u003e Replace the \u003cbranchName\u003e in the Component RFC template URL by your branch name.\n\nFor example, to open a Component RFC for branch name `feat/slider`, you'd open the URL:\n\n```sh\nhttps://github.com/ClickHouse/click-ui/compare/main...feat/slider?template=component_rfc.md\n```\n\nFor GitHub CLI users:\n\n```sh\ngh pr create --template component_rfc.md\n```\n\n### Conventional commits\n\nWe prefer to commit our work following [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0) conventions. Conventional Commits are a simple way to write commit messages that both people and computers can understand. It help us keep track fo changes in a consistent manner, making it easier to see what was added, changed, or fixed in each commit or update.\n\nThe commit messages are formatted as **[type]/[scope]**\nThe **type** is a short descriptor indicating the nature of the work (e.g., feat, fix, docs, style, refactor, test, chore). This follows the conventional commit types.\n\nThe **scope** is a more detailed description of the feature or fix. This could be the component or part of the codebase affected by the change.\n\nHere's an example of different conventional commits messages that you must follow:\n\n```txt\ntest: 💍 Adding missing tests\nfeat: 🎸 A new feature\nfix: 🐛 A bug fix\nchore: 🤖 Build process or auxiliary tool changes\ndocs: 📝 Documentation only changes\nrefactor: 💡 A code change that neither fixes a bug or adds a feature\nstyle: 💄 Markup, white-space, formatting, missing semi-colons...\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fclickhouse%2Fclick-ui","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fclickhouse%2Fclick-ui","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fclickhouse%2Fclick-ui/lists"}