Showing preview only (6,574K chars total). Download the full file or copy to clipboard to get everything.
Repository: geist-org/geist-ui
Branch: master
Commit: b48b8238e7aa
Files: 761
Total size: 6.1 MB
Directory structure:
gitextract_2s6hwfls/
├── .circleci/
│ └── config.yml
├── .codecov.yml
├── .eslintignore
├── .eslintrc.js
├── .github/
│ ├── CODE_OF_CONDUCT.md
│ ├── CONTRIBUTING.md
│ ├── ISSUE_TEMPLATE/
│ │ ├── 1-bug-report.md
│ │ ├── 2-feature-request.md
│ │ ├── 3-docs.md
│ │ └── config.yml
│ ├── PULL_REQUEST_TEMPLATE.md
│ └── workflows/
│ └── publish.yml
├── .gitignore
├── .jest.config.js
├── .prettierignore
├── .travis.yml
├── .vercelignore
├── LICENSE
├── README.md
├── components/
│ ├── auto-complete/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── index.test.tsx.snap
│ │ │ │ └── search.test.tsx.snap
│ │ │ ├── index.test.tsx
│ │ │ ├── search.test.tsx
│ │ │ └── use-input.test.tsx
│ │ ├── auto-complete-context.ts
│ │ ├── auto-complete-dropdown.tsx
│ │ ├── auto-complete-empty.tsx
│ │ ├── auto-complete-item.tsx
│ │ ├── auto-complete-searching.tsx
│ │ ├── auto-complete.tsx
│ │ └── index.ts
│ ├── avatar/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── avatar-group.tsx
│ │ ├── avatar.tsx
│ │ └── index.ts
│ ├── badge/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── anchor.test.tsx.snap
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── anchor.test.tsx
│ │ │ └── index.test.tsx
│ │ ├── badge-anchor.tsx
│ │ ├── badge.tsx
│ │ └── index.ts
│ ├── breadcrumbs/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── breadcrumbs.test.tsx.snap
│ │ │ └── breadcrumbs.test.tsx
│ │ ├── breadcrumbs-item.tsx
│ │ ├── breadcrumbs-separator.tsx
│ │ ├── breadcrumbs.tsx
│ │ └── index.ts
│ ├── button/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── icon.test.tsx.snap
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── icon.test.tsx
│ │ │ └── index.test.tsx
│ │ ├── button-icon.tsx
│ │ ├── button-loading.tsx
│ │ ├── button.drip.tsx
│ │ ├── button.tsx
│ │ ├── index.ts
│ │ ├── styles.ts
│ │ └── utils.tsx
│ ├── button-dropdown/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── button-dropdown-context.ts
│ │ ├── button-dropdown-item.tsx
│ │ ├── button-dropdown.tsx
│ │ ├── icon.tsx
│ │ ├── index.ts
│ │ └── styles.ts
│ ├── button-group/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── button-group-context.ts
│ │ ├── button-group.tsx
│ │ └── index.ts
│ ├── capacity/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── capacity.tsx
│ │ └── index.ts
│ ├── card/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── footer.test.tsx.snap
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── footer.test.tsx
│ │ │ └── index.test.tsx
│ │ ├── card-content.tsx
│ │ ├── card-footer.tsx
│ │ ├── card.tsx
│ │ ├── index.ts
│ │ └── styles.ts
│ ├── checkbox/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── group.test.tsx.snap
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── group.test.tsx
│ │ │ └── index.test.tsx
│ │ ├── checkbox-context.ts
│ │ ├── checkbox-group.tsx
│ │ ├── checkbox.icon.tsx
│ │ ├── checkbox.tsx
│ │ ├── index.ts
│ │ └── styles.ts
│ ├── code/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── code.tsx
│ │ └── index.ts
│ ├── col/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── col.tsx
│ │ └── index.ts
│ ├── collapse/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── group.test.tsx.snap
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── group.test.tsx
│ │ │ └── index.test.tsx
│ │ ├── collapse-context.ts
│ │ ├── collapse-group.tsx
│ │ ├── collapse-icon.tsx
│ │ ├── collapse.tsx
│ │ └── index.ts
│ ├── css-baseline/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── baseline.test.tsx.snap
│ │ │ └── baseline.test.tsx
│ │ ├── css-baseline.tsx
│ │ └── index.ts
│ ├── description/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── description.tsx
│ │ └── index.ts
│ ├── display/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── display.tsx
│ │ └── index.ts
│ ├── divider/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── divider.tsx
│ │ └── index.ts
│ ├── dot/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── dot.tsx
│ │ └── index.ts
│ ├── drawer/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── index.test.tsx
│ │ │ └── use-modal.test.tsx
│ │ ├── drawer-wrapper.tsx
│ │ ├── drawer.tsx
│ │ ├── helper.ts
│ │ └── index.ts
│ ├── fieldset/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── group.test.tsx
│ │ │ └── index.test.tsx
│ │ ├── fieldset-content.tsx
│ │ ├── fieldset-context.ts
│ │ ├── fieldset-footer.tsx
│ │ ├── fieldset-group.tsx
│ │ ├── fieldset-subtitle.tsx
│ │ ├── fieldset-title.tsx
│ │ ├── fieldset.tsx
│ │ └── index.ts
│ ├── geist-provider/
│ │ ├── geist-provider.tsx
│ │ ├── index.ts
│ │ └── theme-provider.tsx
│ ├── grid/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── basic-item.tsx
│ │ ├── grid-container.tsx
│ │ ├── grid-types.ts
│ │ ├── grid.tsx
│ │ └── index.ts
│ ├── image/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── browser.test.tsx.snap
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── browser.test.tsx
│ │ │ └── index.test.tsx
│ │ ├── helpers.ts
│ │ ├── image-browser-https-icon.tsx
│ │ ├── image-browser.tsx
│ │ ├── image.skeleton.tsx
│ │ ├── image.tsx
│ │ ├── index.ts
│ │ └── styles.ts
│ ├── index.ts
│ ├── input/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── index.test.tsx.snap
│ │ │ │ └── password.test.tsx.snap
│ │ │ ├── index.test.tsx
│ │ │ └── password.test.tsx
│ │ ├── index.ts
│ │ ├── input-block-label.tsx
│ │ ├── input-icon-clear.tsx
│ │ ├── input-icon.tsx
│ │ ├── input-label.tsx
│ │ ├── input-props.ts
│ │ ├── input.tsx
│ │ ├── password-icon.tsx
│ │ ├── password.tsx
│ │ └── styles.ts
│ ├── keyboard/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── keyboard.tsx
│ ├── link/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── icon.tsx
│ │ ├── index.ts
│ │ └── link.tsx
│ ├── loading/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── loading.tsx
│ ├── modal/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── modal-action.tsx
│ │ ├── modal-actions.tsx
│ │ ├── modal-content.tsx
│ │ ├── modal-context.ts
│ │ ├── modal-subtitle.tsx
│ │ ├── modal-title.tsx
│ │ ├── modal-wrapper.tsx
│ │ └── modal.tsx
│ ├── note/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── note.tsx
│ ├── page/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── child.test.tsx.snap
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── child.test.tsx
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── page-content.tsx
│ │ ├── page-footer.tsx
│ │ ├── page-header.tsx
│ │ └── page.tsx
│ ├── pagination/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── pagination.test.tsx.snap
│ │ │ └── pagination.test.tsx
│ │ ├── index.ts
│ │ ├── pagination-context.ts
│ │ ├── pagination-ellipsis.tsx
│ │ ├── pagination-item.tsx
│ │ ├── pagination-next.tsx
│ │ ├── pagination-pages.tsx
│ │ ├── pagination-previous.tsx
│ │ └── pagination.tsx
│ ├── popover/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── popover-context.ts
│ │ ├── popover-item.tsx
│ │ └── popover.tsx
│ ├── progress/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── progress.tsx
│ ├── radio/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── group.test.tsx.snap
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── group.test.tsx
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── radio-context.ts
│ │ ├── radio-description.tsx
│ │ ├── radio-group.tsx
│ │ ├── radio.tsx
│ │ └── styles.ts
│ ├── rating/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── rating-icon.tsx
│ │ └── rating.tsx
│ ├── row/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── row.tsx
│ ├── select/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── index.test.tsx.snap
│ │ │ │ └── multiple.test.tsx.snap
│ │ │ ├── events.test.tsx
│ │ │ ├── index.test.tsx
│ │ │ └── multiple.test.tsx
│ │ ├── index.ts
│ │ ├── select-context.ts
│ │ ├── select-dropdown.tsx
│ │ ├── select-icon-clear.tsx
│ │ ├── select-icon.tsx
│ │ ├── select-input.tsx
│ │ ├── select-multiple-value.tsx
│ │ ├── select-option.tsx
│ │ ├── select.tsx
│ │ └── styles.ts
│ ├── shared/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── backdrop.test.tsx.snap
│ │ │ │ ├── dropdown.test.tsx.snap
│ │ │ │ ├── ellipsis.test.tsx.snap
│ │ │ │ └── transition.test.tsx.snap
│ │ │ ├── backdrop.test.tsx
│ │ │ ├── dropdown.test.tsx
│ │ │ ├── ellipsis.test.tsx
│ │ │ └── transition.test.tsx
│ │ ├── backdrop.tsx
│ │ ├── css-transition.tsx
│ │ ├── dropdown.tsx
│ │ ├── ellipsis.tsx
│ │ ├── expand.tsx
│ │ └── highlight.tsx
│ ├── slider/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── slider-dot.tsx
│ │ ├── slider-mark.tsx
│ │ ├── slider.tsx
│ │ └── styles.ts
│ ├── snippet/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── snippet-icon.tsx
│ │ ├── snippet.tsx
│ │ └── styles.ts
│ ├── spacer/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── spacer.tsx
│ ├── spinner/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── spinner.tsx
│ ├── table/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── table-body.tsx
│ │ ├── table-cell.tsx
│ │ ├── table-column.tsx
│ │ ├── table-context.ts
│ │ ├── table-head.tsx
│ │ ├── table-types.ts
│ │ └── table.tsx
│ ├── tabs/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── tabs-context.ts
│ │ ├── tabs-item.tsx
│ │ └── tabs.tsx
│ ├── tag/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── tag.tsx
│ ├── text/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── child.tsx
│ │ ├── index.ts
│ │ └── text.tsx
│ ├── textarea/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── textarea.tsx
│ ├── themes/
│ │ ├── index.ts
│ │ ├── presets/
│ │ │ ├── dark.ts
│ │ │ ├── default.ts
│ │ │ ├── index.ts
│ │ │ └── shared.ts
│ │ └── themes.ts
│ ├── toggle/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── styles.ts
│ │ └── toggle.tsx
│ ├── tooltip/
│ │ ├── __test__/
│ │ │ └── index.test.tsx
│ │ ├── helper.ts
│ │ ├── index.ts
│ │ ├── placement.ts
│ │ ├── styles.ts
│ │ ├── tooltip-content.tsx
│ │ ├── tooltip-icon.tsx
│ │ └── tooltip.tsx
│ ├── tree/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── tree-context.ts
│ │ ├── tree-file-icon.tsx
│ │ ├── tree-file.tsx
│ │ ├── tree-folder-icon.tsx
│ │ ├── tree-folder.tsx
│ │ ├── tree-help.ts
│ │ ├── tree-indents.tsx
│ │ ├── tree-status-icon.tsx
│ │ └── tree.tsx
│ ├── use-all-themes/
│ │ ├── all-themes-context.ts
│ │ └── index.ts
│ ├── use-body-scroll/
│ │ ├── __tests__/
│ │ │ └── body-scroll.test.tsx
│ │ ├── index.ts
│ │ └── use-body-scroll.ts
│ ├── use-classes/
│ │ ├── __tests__/
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── use-classes.ts
│ ├── use-click-away/
│ │ ├── __tests__/
│ │ │ └── click-away.test.tsx
│ │ ├── index.ts
│ │ └── use-click-away.ts
│ ├── use-clipboard/
│ │ ├── __tests__/
│ │ │ └── clipboard.test.tsx
│ │ ├── index.ts
│ │ └── use-clipboard.ts
│ ├── use-current-state/
│ │ ├── __tests__/
│ │ │ └── current-state.test.tsx
│ │ ├── index.ts
│ │ └── use-current-state.ts
│ ├── use-input/
│ │ ├── __tests__/
│ │ │ └── use-input.test.tsx
│ │ ├── index.ts
│ │ └── use-input.tsx
│ ├── use-keyboard/
│ │ ├── __tests__/
│ │ │ └── keyboard.test.tsx
│ │ ├── codes.ts
│ │ ├── helper.ts
│ │ ├── index.ts
│ │ └── use-keyboard.ts
│ ├── use-media-query/
│ │ ├── __tests__/
│ │ │ └── media-query.test.tsx
│ │ ├── index.ts
│ │ └── use-media-query.ts
│ ├── use-modal/
│ │ ├── __tests__/
│ │ │ └── use-modal.test.tsx
│ │ ├── index.ts
│ │ └── use-modal.ts
│ ├── use-scale/
│ │ ├── __tests__/
│ │ │ └── scale.test.tsx
│ │ ├── index.ts
│ │ ├── scale-context.ts
│ │ ├── utils.ts
│ │ └── with-scale.tsx
│ ├── use-tabs/
│ │ ├── __tests__/
│ │ │ └── use-tabs.test.tsx
│ │ ├── index.ts
│ │ └── use-tabs.ts
│ ├── use-theme/
│ │ ├── index.ts
│ │ └── theme-context.ts
│ ├── use-toasts/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── helpers.tsx
│ │ ├── index.ts
│ │ ├── toast-container.tsx
│ │ ├── toast-item.tsx
│ │ └── use-toast.tsx
│ ├── user/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── user-link.tsx
│ │ └── user.tsx
│ └── utils/
│ ├── __tests__/
│ │ └── calculations.test.tsx
│ ├── calculations.ts
│ ├── collections.ts
│ ├── color.ts
│ ├── layouts.ts
│ ├── prop-types.ts
│ ├── types.ts
│ ├── use-body-scroll.ts
│ ├── use-click-anywhere.ts
│ ├── use-click-away.ts
│ ├── use-clipboard.ts
│ ├── use-context-state/
│ │ ├── create-geist-context.tsx
│ │ └── use-context-state.ts
│ ├── use-current-state.ts
│ ├── use-default-props.ts
│ ├── use-dom-observer.ts
│ ├── use-drag.ts
│ ├── use-geist-ui-context.ts
│ ├── use-portal.ts
│ ├── use-previous.ts
│ ├── use-real-shape.ts
│ ├── use-resize.ts
│ ├── use-ssr.ts
│ └── use-warning.ts
├── examples/
│ ├── create-next-app/
│ │ ├── .eslintrc.json
│ │ ├── README.md
│ │ ├── next-env.d.ts
│ │ ├── next.config.js
│ │ ├── package.json
│ │ ├── pages/
│ │ │ ├── _app.tsx
│ │ │ ├── _document.js
│ │ │ └── index.tsx
│ │ └── tsconfig.json
│ ├── create-react-app/
│ │ └── README.md
│ ├── custom-styles/
│ │ ├── README.md
│ │ ├── package.json
│ │ ├── public/
│ │ │ └── index.html
│ │ └── src/
│ │ ├── home.jsx
│ │ ├── index.jsx
│ │ └── style.css
│ ├── custom-themes/
│ │ ├── README.md
│ │ ├── package.json
│ │ ├── public/
│ │ │ └── index.html
│ │ └── src/
│ │ ├── home.jsx
│ │ ├── index.jsx
│ │ └── theme.js
│ ├── extends-components/
│ │ ├── README.md
│ │ ├── package.json
│ │ ├── public/
│ │ │ └── index.html
│ │ ├── src/
│ │ │ ├── app.tsx
│ │ │ ├── index.tsx
│ │ │ ├── my-input.tsx
│ │ │ └── react-app-env.d.ts
│ │ └── tsconfig.json
│ ├── remix/
│ │ ├── README.md
│ │ ├── api/
│ │ │ └── index.js
│ │ ├── app/
│ │ │ ├── entry.client.tsx
│ │ │ ├── entry.server.tsx
│ │ │ ├── root.tsx
│ │ │ └── routes/
│ │ │ └── index.tsx
│ │ ├── package.json
│ │ ├── remix.config.js
│ │ ├── remix.env.d.ts
│ │ ├── tsconfig.json
│ │ └── vercel.json
│ ├── tree-shaking-create-react-app/
│ │ ├── README.md
│ │ ├── build/
│ │ │ ├── asset-manifest.json
│ │ │ ├── index.html
│ │ │ └── static/
│ │ │ └── js/
│ │ │ ├── main.c0df7028.js
│ │ │ └── main.c0df7028.js.LICENSE.txt
│ │ ├── package.json
│ │ ├── public/
│ │ │ └── index.html
│ │ └── src/
│ │ ├── home.jsx
│ │ └── index.jsx
│ ├── tree-shaking-nextjs/
│ │ ├── README.md
│ │ ├── next.config.js
│ │ ├── package.json
│ │ └── pages/
│ │ ├── _app.js
│ │ ├── _document.js
│ │ └── index.js
│ ├── tree-shaking-webpack/
│ │ ├── .babelrc
│ │ ├── README.md
│ │ ├── package.json
│ │ ├── src/
│ │ │ ├── index.html
│ │ │ └── index.js
│ │ └── webpack.config.js
│ └── with-typescript/
│ └── README.md
├── lib/
│ ├── components/
│ │ ├── attributes/
│ │ │ ├── attributes-table.tsx
│ │ │ ├── attributes-title.tsx
│ │ │ ├── attributes.tsx
│ │ │ ├── contributors.tsx
│ │ │ └── index.ts
│ │ ├── customization/
│ │ │ ├── codes.tsx
│ │ │ ├── colors.tsx
│ │ │ ├── demo.tsx
│ │ │ ├── editor-color-item.tsx
│ │ │ ├── editor-input-item.tsx
│ │ │ ├── editor.tsx
│ │ │ └── layout.tsx
│ │ ├── index.ts
│ │ ├── layout/
│ │ │ ├── header.tsx
│ │ │ ├── index.tsx
│ │ │ ├── layout.tsx
│ │ │ ├── menu/
│ │ │ │ ├── index.tsx
│ │ │ │ ├── menu-mobile.tsx
│ │ │ │ ├── menu-skeleton.tsx
│ │ │ │ └── menu.tsx
│ │ │ ├── powered-by/
│ │ │ │ ├── index.ts
│ │ │ │ └── powered-by.tsx
│ │ │ └── sidebar/
│ │ │ ├── active-catalog.tsx
│ │ │ ├── active-link.tsx
│ │ │ ├── index.tsx
│ │ │ ├── side-item.tsx
│ │ │ ├── sidebar-skeleton.tsx
│ │ │ └── sidebar.tsx
│ │ ├── mdx-widgets/
│ │ │ ├── README.md
│ │ │ ├── colors/
│ │ │ │ ├── colors-data.ts
│ │ │ │ └── index.tsx
│ │ │ ├── example-block.tsx
│ │ │ ├── grid-demo.tsx
│ │ │ ├── home-cell.tsx
│ │ │ ├── hybrid-code.tsx
│ │ │ ├── hybrid-link.tsx
│ │ │ ├── icons-gallery/
│ │ │ │ ├── icons-cell.tsx
│ │ │ │ ├── icons-gallery.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── index.ts
│ │ │ ├── mock-page.tsx
│ │ │ └── parsed-codes/
│ │ │ ├── clock.tsx
│ │ │ ├── greeting.tsx
│ │ │ ├── index.ts
│ │ │ └── types.tsx
│ │ ├── playground/
│ │ │ ├── code-theme.ts
│ │ │ ├── dynamic-live.tsx
│ │ │ ├── editor.tsx
│ │ │ ├── index.ts
│ │ │ ├── playground.tsx
│ │ │ └── title.tsx
│ │ ├── pures/
│ │ │ ├── anchor/
│ │ │ │ ├── anchor-icon.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── controls.tsx
│ │ │ └── index.ts
│ │ └── search/
│ │ ├── helper.ts
│ │ ├── index.tsx
│ │ ├── search-icon.tsx
│ │ ├── search-item.tsx
│ │ ├── search-items.tsx
│ │ └── search.tsx
│ ├── config-context.ts
│ ├── config-provider.tsx
│ ├── constants.ts
│ ├── data/
│ │ ├── index.ts
│ │ ├── metadata-en-us.json
│ │ ├── metadata-zh-cn.json
│ │ ├── seeds-en-us.json
│ │ ├── seeds-zh-cn.json
│ │ └── seeds.ts
│ ├── redirect.tsx
│ ├── use-dom-clean.ts
│ └── use-locale.ts
├── next-env.d.ts
├── next.config.js
├── now.json
├── package.json
├── pages/
│ ├── _app.tsx
│ ├── _document.tsx
│ ├── en-us/
│ │ ├── components/
│ │ │ ├── auto-complete.mdx
│ │ │ ├── avatar.mdx
│ │ │ ├── badge.mdx
│ │ │ ├── breadcrumbs.mdx
│ │ │ ├── button-dropdown.mdx
│ │ │ ├── button-group.mdx
│ │ │ ├── button.mdx
│ │ │ ├── capacity.mdx
│ │ │ ├── card.mdx
│ │ │ ├── checkbox.mdx
│ │ │ ├── code.mdx
│ │ │ ├── collapse.mdx
│ │ │ ├── description.mdx
│ │ │ ├── display.mdx
│ │ │ ├── divider.mdx
│ │ │ ├── dot.mdx
│ │ │ ├── drawer.mdx
│ │ │ ├── fieldset.mdx
│ │ │ ├── file-tree.mdx
│ │ │ ├── grid.mdx
│ │ │ ├── icons.mdx
│ │ │ ├── image.mdx
│ │ │ ├── index.js
│ │ │ ├── input.mdx
│ │ │ ├── keyboard.mdx
│ │ │ ├── link.mdx
│ │ │ ├── loading.mdx
│ │ │ ├── modal.mdx
│ │ │ ├── note.mdx
│ │ │ ├── page.mdx
│ │ │ ├── pagination.mdx
│ │ │ ├── popover.mdx
│ │ │ ├── progress.mdx
│ │ │ ├── radio.mdx
│ │ │ ├── rating.mdx
│ │ │ ├── select.mdx
│ │ │ ├── slider.mdx
│ │ │ ├── snippet.mdx
│ │ │ ├── spacer.mdx
│ │ │ ├── spinner.mdx
│ │ │ ├── table.mdx
│ │ │ ├── tabs.mdx
│ │ │ ├── tag.mdx
│ │ │ ├── text.mdx
│ │ │ ├── textarea.mdx
│ │ │ ├── toast.mdx
│ │ │ ├── toggle.mdx
│ │ │ ├── tooltip.mdx
│ │ │ └── user.mdx
│ │ ├── guide/
│ │ │ ├── bundle-size.mdx
│ │ │ ├── colors.mdx
│ │ │ ├── index.js
│ │ │ ├── installation.mdx
│ │ │ ├── introduction.mdx
│ │ │ ├── scale.mdx
│ │ │ ├── server-render.mdx
│ │ │ └── themes.mdx
│ │ ├── hooks/
│ │ │ ├── index.js
│ │ │ ├── use-body-scroll.mdx
│ │ │ ├── use-classes.mdx
│ │ │ ├── use-click-away.mdx
│ │ │ ├── use-clipboard.mdx
│ │ │ ├── use-current-state.mdx
│ │ │ ├── use-input.mdx
│ │ │ ├── use-keyboard.mdx
│ │ │ ├── use-media-query.mdx
│ │ │ ├── use-modal.mdx
│ │ │ ├── use-scale.mdx
│ │ │ ├── use-tabs.mdx
│ │ │ ├── use-theme.mdx
│ │ │ └── use-toast.mdx
│ │ └── index.tsx
│ └── zh-cn/
│ ├── components/
│ │ ├── auto-complete.mdx
│ │ ├── avatar.mdx
│ │ ├── badge.mdx
│ │ ├── breadcrumbs.mdx
│ │ ├── button-dropdown.mdx
│ │ ├── button-group.mdx
│ │ ├── button.mdx
│ │ ├── capacity.mdx
│ │ ├── card.mdx
│ │ ├── checkbox.mdx
│ │ ├── code.mdx
│ │ ├── collapse.mdx
│ │ ├── description.mdx
│ │ ├── display.mdx
│ │ ├── divider.mdx
│ │ ├── dot.mdx
│ │ ├── drawer.mdx
│ │ ├── fieldset.mdx
│ │ ├── file-tree.mdx
│ │ ├── grid.mdx
│ │ ├── icons.mdx
│ │ ├── image.mdx
│ │ ├── index.js
│ │ ├── input.mdx
│ │ ├── keyboard.mdx
│ │ ├── link.mdx
│ │ ├── loading.mdx
│ │ ├── modal.mdx
│ │ ├── note.mdx
│ │ ├── page.mdx
│ │ ├── pagination.mdx
│ │ ├── popover.mdx
│ │ ├── progress.mdx
│ │ ├── radio.mdx
│ │ ├── rating.mdx
│ │ ├── select.mdx
│ │ ├── slider.mdx
│ │ ├── snippet.mdx
│ │ ├── spacer.mdx
│ │ ├── spinner.mdx
│ │ ├── table.mdx
│ │ ├── tabs.mdx
│ │ ├── tag.mdx
│ │ ├── text.mdx
│ │ ├── textarea.mdx
│ │ ├── toast.mdx
│ │ ├── toggle.mdx
│ │ ├── tooltip.mdx
│ │ └── user.mdx
│ ├── guide/
│ │ ├── bundle-size.mdx
│ │ ├── colors.mdx
│ │ ├── index.js
│ │ ├── installation.mdx
│ │ ├── introduction.mdx
│ │ ├── scale.mdx
│ │ ├── server-render.mdx
│ │ └── themes.mdx
│ ├── hooks/
│ │ ├── index.js
│ │ ├── use-body-scroll.mdx
│ │ ├── use-classes.mdx
│ │ ├── use-click-away.mdx
│ │ ├── use-clipboard.mdx
│ │ ├── use-current-state.mdx
│ │ ├── use-input.mdx
│ │ ├── use-keyboard.mdx
│ │ ├── use-media-query.mdx
│ │ ├── use-modal.mdx
│ │ ├── use-scale.mdx
│ │ ├── use-tabs.mdx
│ │ ├── use-theme.mdx
│ │ └── use-toast.mdx
│ └── index.tsx
├── public/
│ └── _redirects
├── scripts/
│ ├── babel.config.js
│ ├── built-in/
│ │ ├── styled-jsx-server.es.js
│ │ ├── styled-jsx.cjs.js
│ │ └── styled-jsx.es.js
│ ├── collect-meta.js
│ ├── locales.js
│ ├── move-built-in.js
│ ├── rollup.config.js
│ ├── seeds/
│ │ ├── codesandbox.json
│ │ ├── links.json
│ │ ├── presets.js
│ │ └── update.js
│ ├── side-effects.js
│ ├── tsconfig.json
│ ├── tsconfig.test.json
│ └── webpack.config.js
├── tests/
│ ├── .babelrc.js
│ ├── __mocks__/
│ │ └── styled-jsx/
│ │ └── css.js
│ ├── setup.ts
│ └── utils.ts
├── tsconfig.json
└── typings/
├── mdx.d.ts
├── meta.d.ts
└── styled.d.ts
================================================
FILE CONTENTS
================================================
================================================
FILE: .circleci/config.yml
================================================
version: 2
jobs:
test:
docker:
- image: circleci/node:14.15.0
working_directory: ~/repo
steps:
- checkout
- restore_cache:
keys:
- v2-dependencies-{{ checksum "package.json" }}
- v2-dependencies-
- run: yarn
- save_cache:
paths:
- node_modules
key: v2-dependencies-{{ checksum "package.json" }}
- run: yarn run lint
- run: yarn test -w 1 --coverage
- run: bash <(curl -s https://codecov.io/bash)
build:
docker:
- image: circleci/node:14.15.0
working_directory: ~/repo
steps:
- checkout
- restore_cache:
keys:
- v2-dependencies-{{ checksum "package.json" }}
- v2-dependencies-
- run: yarn
- save_cache:
paths:
- node_modules
key: v2-dependencies-{{ checksum "package.json" }}
- run: yarn run build
workflows:
version: 2
build_and_test:
jobs:
- test
- build
================================================
FILE: .codecov.yml
================================================
codecov:
require_ci_to_pass: yes
comment:
layout: "reach, diff, flags, files"
behavior: default
require_changes: false
branches:
- "master"
================================================
FILE: .eslintignore
================================================
.now/*
.next/*
examples/*
dist/*
esm/*
public/*
scripts/*
tests/*
*.config.js
================================================
FILE: .eslintrc.js
================================================
module.exports = {
parser: '@typescript-eslint/parser',
extends: ['eslint-config-ts-lambdas', 'eslint-config-ts-lambdas/react', 'prettier'],
plugins: ['@typescript-eslint'],
settings: {
react: {
pragma: 'React',
version: 'detect',
},
},
parserOptions: {
project: './tsconfig.json',
ecmaFeatures: {
jsx: true,
},
},
rules: {
indent: 0,
'@typescript-eslint/indent': 0,
'@typescript-eslint/member-delimiter-style': 0,
},
}
================================================
FILE: .github/CODE_OF_CONDUCT.md
================================================
# Contributor Covenant Code of Conduct
## Our Pledge
We as members, contributors, and leaders pledge to make participation in our
community a harassment-free experience for everyone, regardless of age, body
size, visible or invisible disability, ethnicity, sex characteristics, gender
identity and expression, level of experience, education, socio-economic status,
nationality, personal appearance, race, religion, or sexual identity
and orientation.
We pledge to act and interact in ways that contribute to an open, welcoming,
diverse, inclusive, and healthy community.
## Our Standards
Examples of behavior that contributes to a positive environment for our
community include:
* Demonstrating empathy and kindness toward other people
* Being respectful of differing opinions, viewpoints, and experiences
* Giving and gracefully accepting constructive feedback
* Accepting responsibility and apologizing to those affected by our mistakes,
and learning from the experience
* Focusing on what is best not just for us as individuals, but for the
overall community
Examples of unacceptable behavior include:
* The use of sexualized language or imagery, and sexual attention or
advances of any kind
* Trolling, insulting or derogatory comments, and personal or political attacks
* Public or private harassment
* Publishing others' private information, such as a physical or email
address, without their explicit permission
* Other conduct which could reasonably be considered inappropriate in a
professional setting
## Enforcement Responsibilities
Community leaders are responsible for clarifying and enforcing our standards of
acceptable behavior and will take appropriate and fair corrective action in
response to any behavior that they deem inappropriate, threatening, offensive,
or harmful.
Community leaders have the right and responsibility to remove, edit, or reject
comments, commits, code, wiki edits, issues, and other contributions that are
not aligned to this Code of Conduct, and will communicate reasons for moderation
decisions when appropriate.
## Scope
This Code of Conduct applies within all community spaces, and also applies when
an individual is officially representing the community in public spaces.
Examples of representing our community include using an official e-mail address,
posting via an official social media account, or acting as an appointed
representative at an online or offline event.
## Enforcement
Instances of abusive, harassing, or otherwise unacceptable behavior may be
reported to the community leaders responsible for enforcement at
unix.bio@gmail.com.
All complaints will be reviewed and investigated promptly and fairly.
All community leaders are obligated to respect the privacy and security of the
reporter of any incident.
## Enforcement Guidelines
Community leaders will follow these Community Impact Guidelines in determining
the consequences for any action they deem in violation of this Code of Conduct:
### 1. Correction
**Community Impact**: Use of inappropriate language or other behavior deemed
unprofessional or unwelcome in the community.
**Consequence**: A private, written warning from community leaders, providing
clarity around the nature of the violation and an explanation of why the
behavior was inappropriate. A public apology may be requested.
### 2. Warning
**Community Impact**: A violation through a single incident or series
of actions.
**Consequence**: A warning with consequences for continued behavior. No
interaction with the people involved, including unsolicited interaction with
those enforcing the Code of Conduct, for a specified period of time. This
includes avoiding interactions in community spaces as well as external channels
like social media. Violating these terms may lead to a temporary or
permanent ban.
### 3. Temporary Ban
**Community Impact**: A serious violation of community standards, including
sustained inappropriate behavior.
**Consequence**: A temporary ban from any sort of interaction or public
communication with the community for a specified period of time. No public or
private interaction with the people involved, including unsolicited interaction
with those enforcing the Code of Conduct, is allowed during this period.
Violating these terms may lead to a permanent ban.
### 4. Permanent Ban
**Community Impact**: Demonstrating a pattern of violation of community
standards, including sustained inappropriate behavior, harassment of an
individual, or aggression toward or disparagement of classes of individuals.
**Consequence**: A permanent ban from any sort of public interaction within
the community.
## Attribution
This Code of Conduct is adapted from the [Contributor Covenant][homepage],
version 2.0, available at
https://www.contributor-covenant.org/version/2/0/code_of_conduct.html.
Community Impact Guidelines were inspired by [Mozilla's code of conduct
enforcement ladder](https://github.com/mozilla/diversity).
[homepage]: https://www.contributor-covenant.org
For answers to common questions about this code of conduct, see the FAQ at
https://www.contributor-covenant.org/faq. Translations are available at
https://www.contributor-covenant.org/translations.
================================================
FILE: .github/CONTRIBUTING.md
================================================
## Geist UI - React Contributing Guide
### Ready to start
We welcome everyone to join in the construction of the project.
As a pre requirement, you need to have a preliminary understanding of React,
this is a good [learning document for React](https://reactjs.org/docs/getting-started.html).
For basic operation of Git, you can refer to [GitHub's help documentation](https://help.github.com/en/github/using-git).
1. [Fork this repository](https://help.github.com/en/github/getting-started-with-github/fork-a-repo) to your own account and then clone it.
2. Create a new branch for your changes: `git checkout -b {BRANCH_NAME}`.
3. Install [Yarn](https://classic.yarnpkg.com/en/docs/install#mac-stable) and then update project dependenices: `yarn`.
4. Run `yarn dev` and view your changes on your local document site. (If you add a new document page, you need to run `yarn dev` again)
At any time, you think it's ok, you can start the following steps to submit your amazing works:
1. Run `yarn lint` check the code style.
2. Run `yarn test:update` to update & run your testcase.
3. Run `git commit -ma '{YOUR_MESSAGE}'` to commit changes. Commit info should be formatted by the [rules](https://github.com/conventional-changelog/commitlint/blob/master/%40commitlint/config-conventional/README.md).
4. Push code to your own repo and [create PullRequest](https://help.github.com/en/github/collaborating-with-issues-and-pull-requests/about-pull-requests) at GitHub.
### Common steps
#### **Create component**
1. Create a folder in `components`, and add `import` to `components/index.ts`.
2. Create a document file in `pages/en-us/components/`.
3. Restart local server view changes: `yarn dev`.
#### **About document page**
1. Document page must have `meta` field. refer to [here](https://github.com/geist-org/geist-ui/blame/master/pages/en-us/components/avatar.mdx#L4).
2. If you are creating a new component, please provide at least one document.
3. Do Document using [mdx-js](https://github.com/mdx-js/mdx), here is [vs-code plug-in](https://github.com/silvenon/vscode-mdx).
#### **Create testcase**
1. If you are creating a new component, the testcase is required.
2. If you only modify components, please note update **test snapshot**: `yarn test-update`.
3. (Optional) Modifying `testRegex` in `.jest.config.js` allows you to test only a single component.
4. Please check coverage locally before submit.
### Q & A
> How to choose the target branch of PR ?
- If this is a `feature`, set to `rc` branch. All the others are set to `master` branch.
> How to check my code style?
- Run `yarn prettier`
> I added a new document page, but it was not displayed locally ?
- Run `yarn dev` again.
> How can I update remote origin ?
- refer to [here](https://git-scm.com/book/en/v2/Git-Basics-Working-with-Remotes).
### Get stuck
- Create new issue to tell us: [create issue](https://github.com/geist-org/geist-ui/issues/new/choose).
- Ask on [GitHub Discussions](https://github.com/geist-org/geist-ui/discussions).
================================================
FILE: .github/ISSUE_TEMPLATE/1-bug-report.md
================================================
---
name: "Bug report 🐞"
about: "If something isn't working as expected 🤔."
---
<!-- Please do NOT DELETE the template. -->
<!-- No template issues will be closed. -->
# Bug report 🐞
## Version & Environment
- Version of browser
- Version of `geist-ui/core`
## Expected Behaviour
The behavior I expect is ...
## Actual results (or Errors)
I got an error:
```
code
```
================================================
FILE: .github/ISSUE_TEMPLATE/2-feature-request.md
================================================
---
name: "Feature request 🚀"
about: "I have a suggestion!"
---
<!-- Please do NOT DELETE the template. -->
<!-- No template issues will be closed. -->
# Feature request 🚀
- [ ] I will create Pull Request
- [x] It's just a suggestion
### Expected
- Component or something else
### Examples
```jsx
```
### Programme (Optional)
### Others (Optional)
================================================
FILE: .github/ISSUE_TEMPLATE/3-docs.md
================================================
---
name: "About `docs` 🛠️"
about: "Issues and feature requests for docs"
---
<!-- Please do NOT DELETE the template. -->
<!-- No template issues will be closed. -->
# About `docs`
This is a document site related issue.
### Languages
- [x] English
- [ ] Chinese
### Description
### Page Links (Optional)
================================================
FILE: .github/ISSUE_TEMPLATE/config.yml
================================================
contact_links:
- name: Help or Questions 🙀
url: https://github.com/geist-org/geist-ui/discussions
about: This issue tracker is not for support questions. Please refer to the Github's Discussions.
================================================
FILE: .github/PULL_REQUEST_TEMPLATE.md
================================================
## Checklist
- [ ] Fix linting errors
- [ ] Tests have been added / updated (or snapshots)
## Change information
================================================
FILE: .github/workflows/publish.yml
================================================
name: Publish
on:
release:
types: [created]
jobs:
build:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v1
- name: checkout
uses: actions/setup-node@v1
with:
node-version: 12
- name: install
run: yarn install --check-files --frozen-lockfile
- name: lint
run: yarn lint
- name: lint
run: yarn test
- name: build
run: yarn build
publish:
needs: build
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v1
- name: checkout
uses: actions/setup-node@v1
with:
node-version: 12
registry-url: https://registry.npmjs.org/
- name: install
run: yarn install --check-files --frozen-lockfile
- name: set dist-tag
run: |
case "${{github.event.release.name}}" in
*"rc"* | *"canary"*)
echo "r_tag=canary" >> $GITHUB_ENV;;
*"dev"*)
echo "r_tag=dev" >> $GITHUB_ENV;;
*"beta"*)
echo "r_tag=beta" >> $GITHUB_ENV;;
*)
echo "r_tag=latest" >> $GITHUB_ENV;;
esac
- name: publish
run: |
echo ">> dist-tag: ${{ env.r_tag }}"
yarn release --tag ${{ env.r_tag }}
env:
NODE_AUTH_TOKEN: ${{secrets.npm_token}}
================================================
FILE: .gitignore
================================================
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
# dependencies
/node_modules
/.pnp
.pnp.js
# testing
/coverage
# next.js
/.next/
/out/
# production
/build
# misc
.DS_Store
.env*
.idea
# debug
npm-debug.log*
yarn-debug.log*
yarn-error.log*
.now
dist
esm
examples/**/yarn.lock
examples/**/out
examples/**/.next
examples/**/node_modules
examples/**/_build
examples/**/.cache
# Local Netlify folder
.netlify
================================================
FILE: .jest.config.js
================================================
module.exports = {
verbose: true,
testEnvironment: 'jsdom',
setupFilesAfterEnv: ['./tests/setup.ts'],
moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
testPathIgnorePatterns: ['/pages/', '/dist/', '/lib/', '/esm/'],
transform: {
'^.+\\.tsx?$': ['babel-jest', { configFile: './tests/.babelrc.js' }],
},
testRegex: '.*\\.test\\.(j|t)sx?$',
// testRegex: 'use-classes\\/.*\\.test\\.(j|t)sx?$',
collectCoverageFrom: [
'components/**/*.{ts,tsx}',
'!components/**/styles.{ts,tsx}',
'!components/**/*types.{ts,tsx}',
'!components/use-theme/*',
'!components/use-all-themes/*',
'!components/themes/*',
'!components/geist-provider/*',
'!components/index.ts',
'!components/utils/**/*',
],
moduleNameMapper: {
'tests/(.*)$': '<rootDir>/tests/$1',
components: '<rootDir>/components/index.ts',
},
}
================================================
FILE: .prettierignore
================================================
.github
.next
.now
.circleci
dist
coverage
public
esm
*.json
*.d.ts
*.yml
*.snap
================================================
FILE: .travis.yml
================================================
language: node_js
node_js:
- 13.9.0
cache:
directories:
- "node_modules"
notifications:
email:
on_success: never
branches:
only:
- master
install:
- yarn
script:
- yarn run build
================================================
FILE: .vercelignore
================================================
.hg
.git
.gitmodules
.svn
.cache
.next
.now
.vercel
.npmignore
.dockerignore
.gitignore
.*.swp
.DS_Store
.wafpicke-*
.lock-wscript
.env.local
.env.*.local
.venv
npm-debug.log
config.gypi
node_modules
__pycache__
venv
CVS
examples
esm
dist
coverage
.circleci
================================================
FILE: LICENSE
================================================
MIT License
Copyright (c) 2020 Geist UI
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
================================================
FILE: README.md
================================================
<p align="center" height="370">
<img align="center" height="370" src="https://user-images.githubusercontent.com/11304944/91128466-dfc96c00-e6da-11ea-8b03-a96e6b98667d.png">
</p>
<p align="center">
<img alt="Codecov" src="https://img.shields.io/codecov/c/github/geist-org/geist-ui?style=for-the-badge&labelColor=000000">
<img alt="CircleCI" src="https://img.shields.io/circleci/build/github/geist-org/geist-ui?style=for-the-badge&labelColor=000000">
<img alt="npm (scoped)" src="https://img.shields.io/npm/v/@geist-ui/core?style=for-the-badge&labelColor=000000">
</p>
> Modern and minimalist React UI library, originating from Vercel's design.
> **NOTE: This is a COMMUNITY PROJECT, [not associated with Vercel](https://github.com/geist-org/geist-ui/issues/635).**
<br/>
## Quick Start
1. run `yarn add @geist-ui/core` or `npm i @geist-ui/core` install it.
2. import into project:
```jsx
import { GeistProvider, CssBaseline } from '@geist-ui/core'
const Application = () => (
<GeistProvider>
<CssBaseline /> // ---> Normalize styles
<AppComponent /> // ---> Your App Component
</GeistProvider>
)
```
## Documentation
- [Document Site](https://geist-ui.dev)
- [中文文档](https://geist-ui.dev/zh-cn)
## Development
- [Contributing Guide](https://github.com/geist-org/geist-ui/blob/master/.github/CONTRIBUTING.md)
## Showcases
- [Secret](https://secret.gl/)
- [Article view count](https://views-docs.unix.bio/)
- [Tree viewer for CDN](https://cdn.unix.bio/)
- [Better social image](https://img.unix.bio/)
- [SentiNEO: Near-Earth Objects Viewer](https://sentineo.app)
- [Dashboard Design](https://github.com/ofekashery/react-dashboard-design)
- [Regex-Vis: Regex visualizer & editor](https://github.com/Bowen7/regex-vis)
- [Add here](https://github.com/geist-org/geist-ui/issues/new)
## LICENSE
[MIT](./LICENSE)
================================================
FILE: components/auto-complete/__tests__/__snapshots__/index.test.tsx.snap
================================================
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`AutoComplete should render correctly 1`] = `<ScaleGeistAutoComplete />`;
================================================
FILE: components/auto-complete/__tests__/__snapshots__/search.test.tsx.snap
================================================
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`AutoComplete Search should hide empty component 1`] = `
LoadedCheerio {
"0": Node {
"attribs": Object {
"class": "auto-complete",
},
"children": Array [
Node {
"attribs": Object {
"class": "with-label",
},
"children": Array [
Node {
"attribs": Object {
"class": "input-container",
},
"children": Array [
Node {
"attribs": Object {
"class": "input-wrapper",
},
"children": Array [
Node {
"attribs": Object {
"autocomplete": "off",
"class": "",
"placeholder": "Enter here",
"type": "text",
"value": "",
},
"children": Array [],
"name": "input",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"autocomplete": undefined,
"class": undefined,
"placeholder": undefined,
"type": undefined,
"value": undefined,
},
"x-attribsPrefix": Object {
"autocomplete": undefined,
"class": undefined,
"placeholder": undefined,
"type": undefined,
"value": undefined,
},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.with-label {
display: inline-block;
box-sizing: border-box;
-webkit-box-align: center;
--input-height: calc(2.25 * 16px);
font-size: calc(0.875 * 16px);
width: initial;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.input-container {
display: inline-flex;
align-items: center;
width: initial;
height: var(--input-height);
}
.input-wrapper {
display: inline-flex;
vertical-align: middle;
align-items: center;
height: 100%;
flex: 1;
user-select: none;
border-radius: 6px;
border: 1px solid #eaeaea;
transition: border 0.2s ease 0s, color 0.2s ease 0s;
}
.input-wrapper.left-label {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.input-wrapper.right-label {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.input-wrapper.disabled {
background-color: #fafafa;
border-color: #eaeaea;
cursor: not-allowed;
}
input.disabled {
cursor: not-allowed;
}
.input-wrapper.hover {
border-color: #666;
}
input {
margin: 0.25em 0.625em;
padding: 0;
box-shadow: none;
font-size: calc(0.875 * 16px);
background-color: transparent;
border: none;
color: #000;
outline: none;
border-radius: 0;
width: 100%;
min-width: 0;
-webkit-appearance: none;
}
input.left-icon {
margin-left: 0;
}
input.right-icon {
margin-right: 0;
}
::placeholder,
::-moz-placeholder,
:-ms-input-placeholder,
::-webkit-input-placeholder {
color: #999;
}
::-ms-reveal {
display: none !important;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:active,
input:-webkit-autofill:focus {
-webkit-box-shadow: 0 0 0 30px #fff inset !important;
-webkit-text-fill-color: #000 !important;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.with-label {
display: inline-block;
box-sizing: border-box;
-webkit-box-align: center;
--input-height: calc(2.25 * 16px);
font-size: calc(0.875 * 16px);
width: initial;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.input-container {
display: inline-flex;
align-items: center;
width: initial;
height: var(--input-height);
}
.input-wrapper {
display: inline-flex;
vertical-align: middle;
align-items: center;
height: 100%;
flex: 1;
user-select: none;
border-radius: 6px;
border: 1px solid #eaeaea;
transition: border 0.2s ease 0s, color 0.2s ease 0s;
}
.input-wrapper.left-label {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.input-wrapper.right-label {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.input-wrapper.disabled {
background-color: #fafafa;
border-color: #eaeaea;
cursor: not-allowed;
}
input.disabled {
cursor: not-allowed;
}
.input-wrapper.hover {
border-color: #666;
}
input {
margin: 0.25em 0.625em;
padding: 0;
box-shadow: none;
font-size: calc(0.875 * 16px);
background-color: transparent;
border: none;
color: #000;
outline: none;
border-radius: 0;
width: 100%;
min-width: 0;
-webkit-appearance: none;
}
input.left-icon {
margin-left: 0;
}
input.right-icon {
margin-right: 0;
}
::placeholder,
::-moz-placeholder,
:-ms-input-placeholder,
::-webkit-input-placeholder {
color: #999;
}
::-ms-reveal {
display: none !important;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:active,
input:-webkit-autofill:focus {
-webkit-box-shadow: 0 0 0 30px #fff inset !important;
-webkit-text-fill-color: #000 !important;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "input-container",
},
"children": Array [
Node {
"attribs": Object {
"class": "input-wrapper",
},
"children": Array [
Node {
"attribs": Object {
"autocomplete": "off",
"class": "",
"placeholder": "Enter here",
"type": "text",
"value": "",
},
"children": Array [],
"name": "input",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"autocomplete": undefined,
"class": undefined,
"placeholder": undefined,
"type": undefined,
"value": undefined,
},
"x-attribsPrefix": Object {
"autocomplete": undefined,
"class": undefined,
"placeholder": undefined,
"type": undefined,
"value": undefined,
},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.auto-complete {
width: max-content;
height: auto;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.auto-complete :global(.loading) {
width: max-content;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.auto-complete {
width: max-content;
height: auto;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.auto-complete :global(.loading) {
width: max-content;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "with-label",
},
"children": Array [
Node {
"attribs": Object {
"class": "input-container",
},
"children": Array [
Node {
"attribs": Object {
"class": "input-wrapper",
},
"children": Array [
Node {
"attribs": Object {
"autocomplete": "off",
"class": "",
"placeholder": "Enter here",
"type": "text",
"value": "",
},
"children": Array [],
"name": "input",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"autocomplete": undefined,
"class": undefined,
"placeholder": undefined,
"type": undefined,
"value": undefined,
},
"x-attribsPrefix": Object {
"autocomplete": undefined,
"class": undefined,
"placeholder": undefined,
"type": undefined,
"value": undefined,
},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.with-label {
display: inline-block;
box-sizing: border-box;
-webkit-box-align: center;
--input-height: calc(2.25 * 16px);
font-size: calc(0.875 * 16px);
width: initial;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.input-container {
display: inline-flex;
align-items: center;
width: initial;
height: var(--input-height);
}
.input-wrapper {
display: inline-flex;
vertical-align: middle;
align-items: center;
height: 100%;
flex: 1;
user-select: none;
border-radius: 6px;
border: 1px solid #eaeaea;
transition: border 0.2s ease 0s, color 0.2s ease 0s;
}
.input-wrapper.left-label {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.input-wrapper.right-label {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.input-wrapper.disabled {
background-color: #fafafa;
border-color: #eaeaea;
cursor: not-allowed;
}
input.disabled {
cursor: not-allowed;
}
.input-wrapper.hover {
border-color: #666;
}
input {
margin: 0.25em 0.625em;
padding: 0;
box-shadow: none;
font-size: calc(0.875 * 16px);
background-color: transparent;
border: none;
color: #000;
outline: none;
border-radius: 0;
width: 100%;
min-width: 0;
-webkit-appearance: none;
}
input.left-icon {
margin-left: 0;
}
input.right-icon {
margin-right: 0;
}
::placeholder,
::-moz-placeholder,
:-ms-input-placeholder,
::-webkit-input-placeholder {
color: #999;
}
::-ms-reveal {
display: none !important;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:active,
input:-webkit-autofill:focus {
-webkit-box-shadow: 0 0 0 30px #fff inset !important;
-webkit-text-fill-color: #000 !important;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.with-label {
display: inline-block;
box-sizing: border-box;
-webkit-box-align: center;
--input-height: calc(2.25 * 16px);
font-size: calc(0.875 * 16px);
width: initial;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.input-container {
display: inline-flex;
align-items: center;
width: initial;
height: var(--input-height);
}
.input-wrapper {
display: inline-flex;
vertical-align: middle;
align-items: center;
height: 100%;
flex: 1;
user-select: none;
border-radius: 6px;
border: 1px solid #eaeaea;
transition: border 0.2s ease 0s, color 0.2s ease 0s;
}
.input-wrapper.left-label {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.input-wrapper.right-label {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.input-wrapper.disabled {
background-color: #fafafa;
border-color: #eaeaea;
cursor: not-allowed;
}
input.disabled {
cursor: not-allowed;
}
.input-wrapper.hover {
border-color: #666;
}
input {
margin: 0.25em 0.625em;
padding: 0;
box-shadow: none;
font-size: calc(0.875 * 16px);
background-color: transparent;
border: none;
color: #000;
outline: none;
border-radius: 0;
width: 100%;
min-width: 0;
-webkit-appearance: none;
}
input.left-icon {
margin-left: 0;
}
input.right-icon {
margin-right: 0;
}
::placeholder,
::-moz-placeholder,
:-ms-input-placeholder,
::-webkit-input-placeholder {
color: #999;
}
::-ms-reveal {
display: none !important;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:active,
input:-webkit-autofill:focus {
-webkit-box-shadow: 0 0 0 30px #fff inset !important;
-webkit-text-fill-color: #000 !important;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "input-container",
},
"children": Array [
Node {
"attribs": Object {
"class": "input-wrapper",
},
"children": Array [
Node {
"attribs": Object {
"autocomplete": "off",
"class": "",
"placeholder": "Enter here",
"type": "text",
"value": "",
},
"children": Array [],
"name": "input",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"autocomplete": undefined,
"class": undefined,
"placeholder": undefined,
"type": undefined,
"value": undefined,
},
"x-attribsPrefix": Object {
"autocomplete": undefined,
"class": undefined,
"placeholder": undefined,
"type": undefined,
"value": undefined,
},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": Node {
"children": Array [
[Circular],
],
"name": "root",
"next": null,
"parent": null,
"prev": null,
"type": "root",
},
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"_root": LoadedCheerio {
"0": Node {
"children": Array [
Node {
"attribs": Object {},
"children": Array [
Node {
"attribs": Object {},
"children": Array [],
"name": "head",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [],
"name": "body",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
Node {
"attribs": Object {},
"children": Array [],
"name": "body",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {},
"children": Array [],
"name": "head",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "html",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "root",
"next": null,
"parent": null,
"prev": null,
"type": "root",
"x-mode": "quirks",
},
"_root": [Circular],
"length": 1,
"options": Object {
"decodeEntities": true,
"xml": false,
},
},
"length": 1,
"options": Object {
"decodeEntities": true,
"xml": false,
},
}
`;
exports[`AutoComplete Search should hide empty component 2`] = `
LoadedCheerio {
"0": Node {
"attribs": Object {
"class": "auto-complete",
},
"children": Array [
Node {
"attribs": Object {
"class": "with-label",
},
"children": Array [
Node {
"attribs": Object {
"class": "input-container",
},
"children": Array [
Node {
"attribs": Object {
"class": "input-wrapper",
},
"children": Array [
Node {
"attribs": Object {
"autocomplete": "off",
"class": "",
"placeholder": "Enter here",
"type": "text",
"value": "",
},
"children": Array [],
"name": "input",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"autocomplete": undefined,
"class": undefined,
"placeholder": undefined,
"type": undefined,
"value": undefined,
},
"x-attribsPrefix": Object {
"autocomplete": undefined,
"class": undefined,
"placeholder": undefined,
"type": undefined,
"value": undefined,
},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.with-label {
display: inline-block;
box-sizing: border-box;
-webkit-box-align: center;
--input-height: calc(2.25 * 16px);
font-size: calc(0.875 * 16px);
width: initial;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.input-container {
display: inline-flex;
align-items: center;
width: initial;
height: var(--input-height);
}
.input-wrapper {
display: inline-flex;
vertical-align: middle;
align-items: center;
height: 100%;
flex: 1;
user-select: none;
border-radius: 6px;
border: 1px solid #eaeaea;
transition: border 0.2s ease 0s, color 0.2s ease 0s;
}
.input-wrapper.left-label {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.input-wrapper.right-label {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.input-wrapper.disabled {
background-color: #fafafa;
border-color: #eaeaea;
cursor: not-allowed;
}
input.disabled {
cursor: not-allowed;
}
.input-wrapper.hover {
border-color: #666;
}
input {
margin: 0.25em 0.625em;
padding: 0;
box-shadow: none;
font-size: calc(0.875 * 16px);
background-color: transparent;
border: none;
color: #000;
outline: none;
border-radius: 0;
width: 100%;
min-width: 0;
-webkit-appearance: none;
}
input.left-icon {
margin-left: 0;
}
input.right-icon {
margin-right: 0;
}
::placeholder,
::-moz-placeholder,
:-ms-input-placeholder,
::-webkit-input-placeholder {
color: #999;
}
::-ms-reveal {
display: none !important;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:active,
input:-webkit-autofill:focus {
-webkit-box-shadow: 0 0 0 30px #fff inset !important;
-webkit-text-fill-color: #000 !important;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.with-label {
display: inline-block;
box-sizing: border-box;
-webkit-box-align: center;
--input-height: calc(2.25 * 16px);
font-size: calc(0.875 * 16px);
width: initial;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.input-container {
display: inline-flex;
align-items: center;
width: initial;
height: var(--input-height);
}
.input-wrapper {
display: inline-flex;
vertical-align: middle;
align-items: center;
height: 100%;
flex: 1;
user-select: none;
border-radius: 6px;
border: 1px solid #eaeaea;
transition: border 0.2s ease 0s, color 0.2s ease 0s;
}
.input-wrapper.left-label {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.input-wrapper.right-label {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.input-wrapper.disabled {
background-color: #fafafa;
border-color: #eaeaea;
cursor: not-allowed;
}
input.disabled {
cursor: not-allowed;
}
.input-wrapper.hover {
border-color: #666;
}
input {
margin: 0.25em 0.625em;
padding: 0;
box-shadow: none;
font-size: calc(0.875 * 16px);
background-color: transparent;
border: none;
color: #000;
outline: none;
border-radius: 0;
width: 100%;
min-width: 0;
-webkit-appearance: none;
}
input.left-icon {
margin-left: 0;
}
input.right-icon {
margin-right: 0;
}
::placeholder,
::-moz-placeholder,
:-ms-input-placeholder,
::-webkit-input-placeholder {
color: #999;
}
::-ms-reveal {
display: none !important;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:active,
input:-webkit-autofill:focus {
-webkit-box-shadow: 0 0 0 30px #fff inset !important;
-webkit-text-fill-color: #000 !important;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "input-container",
},
"children": Array [
Node {
"attribs": Object {
"class": "input-wrapper",
},
"children": Array [
Node {
"attribs": Object {
"autocomplete": "off",
"class": "",
"placeholder": "Enter here",
"type": "text",
"value": "",
},
"children": Array [],
"name": "input",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"autocomplete": undefined,
"class": undefined,
"placeholder": undefined,
"type": undefined,
"value": undefined,
},
"x-attribsPrefix": Object {
"autocomplete": undefined,
"class": undefined,
"placeholder": undefined,
"type": undefined,
"value": undefined,
},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.auto-complete {
width: max-content;
height: auto;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.auto-complete :global(.loading) {
width: max-content;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.auto-complete {
width: max-content;
height: auto;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.auto-complete :global(.loading) {
width: max-content;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "with-label",
},
"children": Array [
Node {
"attribs": Object {
"class": "input-container",
},
"children": Array [
Node {
"attribs": Object {
"class": "input-wrapper",
},
"children": Array [
Node {
"attribs": Object {
"autocomplete": "off",
"class": "",
"placeholder": "Enter here",
"type": "text",
"value": "",
},
"children": Array [],
"name": "input",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"autocomplete": undefined,
"class": undefined,
"placeholder": undefined,
"type": undefined,
"value": undefined,
},
"x-attribsPrefix": Object {
"autocomplete": undefined,
"class": undefined,
"placeholder": undefined,
"type": undefined,
"value": undefined,
},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.with-label {
display: inline-block;
box-sizing: border-box;
-webkit-box-align: center;
--input-height: calc(2.25 * 16px);
font-size: calc(0.875 * 16px);
width: initial;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.input-container {
display: inline-flex;
align-items: center;
width: initial;
height: var(--input-height);
}
.input-wrapper {
display: inline-flex;
vertical-align: middle;
align-items: center;
height: 100%;
flex: 1;
user-select: none;
border-radius: 6px;
border: 1px solid #eaeaea;
transition: border 0.2s ease 0s, color 0.2s ease 0s;
}
.input-wrapper.left-label {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.input-wrapper.right-label {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.input-wrapper.disabled {
background-color: #fafafa;
border-color: #eaeaea;
cursor: not-allowed;
}
input.disabled {
cursor: not-allowed;
}
.input-wrapper.hover {
border-color: #666;
}
input {
margin: 0.25em 0.625em;
padding: 0;
box-shadow: none;
font-size: calc(0.875 * 16px);
background-color: transparent;
border: none;
color: #000;
outline: none;
border-radius: 0;
width: 100%;
min-width: 0;
-webkit-appearance: none;
}
input.left-icon {
margin-left: 0;
}
input.right-icon {
margin-right: 0;
}
::placeholder,
::-moz-placeholder,
:-ms-input-placeholder,
::-webkit-input-placeholder {
color: #999;
}
::-ms-reveal {
display: none !important;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:active,
input:-webkit-autofill:focus {
-webkit-box-shadow: 0 0 0 30px #fff inset !important;
-webkit-text-fill-color: #000 !important;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.with-label {
display: inline-block;
box-sizing: border-box;
-webkit-box-align: center;
--input-height: calc(2.25 * 16px);
font-size: calc(0.875 * 16px);
width: initial;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.input-container {
display: inline-flex;
align-items: center;
width: initial;
height: var(--input-height);
}
.input-wrapper {
display: inline-flex;
vertical-align: middle;
align-items: center;
height: 100%;
flex: 1;
user-select: none;
border-radius: 6px;
border: 1px solid #eaeaea;
transition: border 0.2s ease 0s, color 0.2s ease 0s;
}
.input-wrapper.left-label {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.input-wrapper.right-label {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.input-wrapper.disabled {
background-color: #fafafa;
border-color: #eaeaea;
cursor: not-allowed;
}
input.disabled {
cursor: not-allowed;
}
.input-wrapper.hover {
border-color: #666;
}
input {
margin: 0.25em 0.625em;
padding: 0;
box-shadow: none;
font-size: calc(0.875 * 16px);
background-color: transparent;
border: none;
color: #000;
outline: none;
border-radius: 0;
width: 100%;
min-width: 0;
-webkit-appearance: none;
}
input.left-icon {
margin-left: 0;
}
input.right-icon {
margin-right: 0;
}
::placeholder,
::-moz-placeholder,
:-ms-input-placeholder,
::-webkit-input-placeholder {
color: #999;
}
::-ms-reveal {
display: none !important;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:active,
input:-webkit-autofill:focus {
-webkit-box-shadow: 0 0 0 30px #fff inset !important;
-webkit-text-fill-color: #000 !important;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "input-container",
},
"children": Array [
Node {
"attribs": Object {
"class": "input-wrapper",
},
"children": Array [
Node {
"attribs": Object {
"autocomplete": "off",
"class": "",
"placeholder": "Enter here",
"type": "text",
"value": "",
},
"children": Array [],
"name": "input",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"autocomplete": undefined,
"class": undefined,
"placeholder": undefined,
"type": undefined,
"value": undefined,
},
"x-attribsPrefix": Object {
"autocomplete": undefined,
"class": undefined,
"placeholder": undefined,
"type": undefined,
"value": undefined,
},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": Node {
"children": Array [
[Circular],
],
"name": "root",
"next": null,
"parent": null,
"prev": null,
"type": "root",
},
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"_root": LoadedCheerio {
"0": Node {
"children": Array [
Node {
"attribs": Object {},
"children": Array [
Node {
"attribs": Object {},
"children": Array [],
"name": "head",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [],
"name": "body",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
Node {
"attribs": Object {},
"children": Array [],
"name": "body",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {},
"children": Array [],
"name": "head",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "html",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "root",
"next": null,
"parent": null,
"prev": null,
"type": "root",
"x-mode": "quirks",
},
"_root": [Circular],
"length": 1,
"options": Object {
"decodeEntities": true,
"xml": false,
},
},
"length": 1,
"options": Object {
"decodeEntities": true,
"xml": false,
},
}
`;
================================================
FILE: components/auto-complete/__tests__/index.test.tsx
================================================
import React from 'react'
import { mount } from 'enzyme'
import { AutoComplete } from 'components'
import { nativeEvent } from 'tests/utils'
import { act } from 'react-dom/test-utils'
describe('AutoComplete', () => {
it('should render correctly', () => {
const wrapper = mount(<AutoComplete />)
expect(() => wrapper.unmount()).not.toThrow()
expect(<AutoComplete />).toMatchSnapshot()
})
it('should support sizes and status', () => {
const wrapper = mount(
<div>
<AutoComplete type="secondary" />
<AutoComplete type="success" />
<AutoComplete />
<AutoComplete />
</div>,
)
expect(() => wrapper.unmount()).not.toThrow()
})
it('should set input value from initial value', () => {
let wrapper = mount(<AutoComplete initialValue="value" />)
let input = wrapper.find('input').at(0).getDOMNode()
expect((input as HTMLInputElement).value).toEqual('value')
wrapper = mount(<AutoComplete value="value2" />)
input = wrapper.find('input').at(0).getDOMNode()
expect((input as HTMLInputElement).value).toEqual('value2')
})
it('should render clear icon', async () => {
const wrapper = mount(<AutoComplete initialValue="value" />)
expect(wrapper.find('svg').length).toBe(0)
await act(async () => {
wrapper.setProps({ clearable: true })
})
expect(wrapper.find('svg').length).toBe(1)
wrapper.find('svg').simulate('click', nativeEvent)
const input = wrapper.find('input').at(0).getDOMNode()
expect((input as HTMLInputElement).value).toEqual('')
})
it('should reponse width change', async () => {
const wrapper = mount(<AutoComplete initialValue="value" width="100px" />)
expect(wrapper.prop('width')).toEqual('100px')
await act(async () => {
wrapper.setProps({ width: '200px' })
})
expect(wrapper.prop('width')).toEqual('200px')
})
it('should forward ref by default', () => {
const ref = React.createRef<HTMLInputElement>()
const wrapper = mount(<AutoComplete ref={ref} />)
expect(ref.current).not.toBeNull()
expect(() => wrapper.unmount()).not.toThrow()
})
})
================================================
FILE: components/auto-complete/__tests__/search.test.tsx
================================================
import React from 'react'
import { mount, render } from 'enzyme'
import { AutoComplete } from 'components'
import { nativeEvent, updateWrapper } from 'tests/utils'
import { act } from 'react-dom/test-utils'
const mockOptions = [{ label: 'London', value: 'london' }]
describe('AutoComplete Search', () => {
it('should render options element', () => {
const wrapper = mount(<AutoComplete options={mockOptions} />)
wrapper.find('input').at(0).simulate('focus')
let dropdown = wrapper.find('.auto-complete-dropdown').children()
expect(dropdown.length).not.toBe(0)
wrapper.find('input').at(0).simulate('blur')
expect(() => wrapper.unmount()).not.toThrow()
})
it('should update value when dropdown clicked', () => {
let value = ''
const wrapper = mount(
<AutoComplete options={mockOptions} onChange={val => (value = val)} />,
)
wrapper.find('input').at(0).simulate('focus')
wrapper.find('.item').at(0).simulate('click', nativeEvent)
expect(value).toEqual('london')
})
it('should ignore events when disabled', () => {
let value = ''
const wrapper = mount(
<AutoComplete disabled options={mockOptions} onChange={val => (value = val)} />,
)
wrapper.find('input').at(0).simulate('focus')
wrapper.find('.item').at(0).simulate('click', nativeEvent)
expect(value).not.toEqual('london')
})
it('should render searching component', async () => {
let wrapper = mount(<AutoComplete searching={false} options={mockOptions} />)
await act(async () => {
wrapper.setProps({ searching: true })
})
wrapper.find('input').at(0).simulate('focus')
let dropdown = wrapper.find('.auto-complete-dropdown')
expect(dropdown.text()).not.toContain('london')
const loading = wrapper.find('.loading')
expect(loading.length).not.toBe(0)
wrapper = mount(
<AutoComplete searching options={mockOptions}>
<AutoComplete.Searching>
<span>waiting...</span>
</AutoComplete.Searching>
</AutoComplete>,
)
wrapper.find('input').at(0).simulate('focus')
dropdown = wrapper.find('.auto-complete-dropdown')
expect(dropdown.text()).toContain('waiting')
})
it('should hide empty component', () => {
let wrapper = render(
<AutoComplete placeholder="Enter here">
<AutoComplete.Empty hidden />
</AutoComplete>,
)
expect(wrapper).toMatchSnapshot()
wrapper = render(
<AutoComplete placeholder="Enter here">
<AutoComplete.Empty>empty</AutoComplete.Empty>
</AutoComplete>,
)
expect(wrapper).toMatchSnapshot()
const mountWrapper = mount(
<AutoComplete placeholder="Enter here" initialValue="value">
<AutoComplete.Empty>empty</AutoComplete.Empty>
</AutoComplete>,
)
mountWrapper.find('input').at(0).simulate('focus')
const text = mountWrapper.find('.auto-complete-dropdown').text()
expect(text).toContain('empty')
const mountWrapper2 = mount(
<AutoComplete placeholder="Enter here" initialValue="value">
<AutoComplete.Empty hidden>empty</AutoComplete.Empty>
</AutoComplete>,
)
mountWrapper2.find('input').at(0).simulate('focus')
const text2 = mountWrapper2.find('.auto-complete-dropdown').text()
expect(text2).not.toContain('empty')
})
it('should trigger search handler', () => {
const handler = jest.fn()
const wrapper = mount(<AutoComplete initialValue="value" onSearch={handler} />)
const input = wrapper.find('input').at(0)
input.simulate('focus')
input.simulate('change')
;(input.getDOMNode() as HTMLInputElement).value = 'value'
expect(handler).toHaveBeenCalled()
})
it('should trigger select and change handler', () => {
const selectHandler = jest.fn()
const changeHandler = jest.fn()
const wrapper = mount(
<AutoComplete
options={mockOptions}
initialValue="value"
onSelect={selectHandler}
onChange={changeHandler}
/>,
)
wrapper.find('input').at(0).simulate('focus')
wrapper.find('.item').at(0).simulate('click', nativeEvent)
expect(selectHandler).toHaveBeenCalled()
expect(changeHandler).toHaveBeenCalled()
})
it('should work with custom options', () => {
const changeHandler = jest.fn()
const makeOption = (label: string, value: string): any => (
<AutoComplete.Option value={value}>
<span>{label}</span>
</AutoComplete.Option>
)
const options = mockOptions.map(
({ label, value }) => makeOption(label, value) as typeof AutoComplete.Option,
)
const wrapper = mount(<AutoComplete options={options} onChange={changeHandler} />)
wrapper.find('input').at(0).simulate('focus')
wrapper.find('.item').at(0).simulate('click', nativeEvent)
expect(changeHandler).toHaveBeenCalled()
})
it('should work correctly without options', () => {
const wrapper = mount(<AutoComplete options={[]} />)
expect(() => wrapper.unmount()).not.toThrow()
})
it('value should be reset when freeSolo disabled', async () => {
const wrapper = mount(<AutoComplete initialValue="value" disableFreeSolo />)
const input = wrapper.find('input').at(0)
input.simulate('focus')
input.simulate('change', { target: { value: 'test' } })
expect((input.getDOMNode() as HTMLInputElement).value).toEqual('test')
input.simulate('blur')
await updateWrapper(wrapper, 200)
expect((input.getDOMNode() as HTMLInputElement).value).toEqual('value')
})
})
================================================
FILE: components/auto-complete/__tests__/use-input.test.tsx
================================================
import React, { useEffect } from 'react'
import { mount } from 'enzyme'
import { AutoComplete, useInput } from 'components'
describe('UseInput', () => {
it('should follow change with use-input', () => {
let log = ''
const logSpy = jest.spyOn(console, 'log').mockImplementation(msg => (log = msg))
const MockInput: React.FC<{ value?: string }> = ({ value }) => {
const { state, setState, bindings } = useInput('')
useEffect(() => {
if (value) setState(value)
}, [value])
useEffect(() => {
if (state) console.log(state)
}, [state])
return <AutoComplete {...bindings} />
}
const wrapper = mount(<MockInput />)
wrapper.setProps({ value: 'test' })
const input = wrapper.find('input').at(0).getDOMNode() as HTMLInputElement
expect(input.value).toEqual('test')
expect(log).toContain('test')
log = ''
wrapper
.find('input')
.at(0)
.simulate('change', { target: { value: 'test-change' } })
expect(log).toContain('test-change')
logSpy.mockRestore()
})
it('should follow change with use-input', () => {
const MockInput: React.FC<{ value?: string; resetValue?: boolean }> = ({
value,
resetValue,
}) => {
const { reset, setState, bindings } = useInput('')
useEffect(() => {
if (value) setState(value)
}, [value])
useEffect(() => {
if (resetValue) reset()
}, [resetValue])
return <AutoComplete {...bindings} />
}
const wrapper = mount(<MockInput />)
wrapper.setProps({ value: 'test' })
let input = wrapper.find('input').at(0).getDOMNode() as HTMLInputElement
expect(input.value).toEqual('test')
wrapper.setProps({ resetValue: true })
input = wrapper.find('input').at(0).getDOMNode() as HTMLInputElement
expect(input.value).toEqual('')
})
})
================================================
FILE: components/auto-complete/auto-complete-context.ts
================================================
import React, { MutableRefObject } from 'react'
export interface AutoCompleteConfig {
value?: string
updateValue?: (val: string) => unknown
visible?: boolean
updateVisible?: (next: boolean) => unknown
ref?: MutableRefObject<HTMLElement | null>
}
const defaultContext = {
visible: false,
}
export const AutoCompleteContext = React.createContext<AutoCompleteConfig>(defaultContext)
export const useAutoCompleteContext = (): AutoCompleteConfig =>
React.useContext<AutoCompleteConfig>(AutoCompleteContext)
================================================
FILE: components/auto-complete/auto-complete-dropdown.tsx
================================================
import React, { CSSProperties, useMemo } from 'react'
import useTheme from '../use-theme'
import { useAutoCompleteContext } from './auto-complete-context'
import Dropdown from '../shared/dropdown'
import useClasses from '../use-classes'
interface Props {
visible: boolean
className?: string
disableMatchWidth?: boolean
dropdownStyle?: CSSProperties
getPopupContainer?: () => HTMLElement | null
}
const defaultProps = {
className: '',
dropdownStyle: {},
}
type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
export type AutoCompleteDropdownProps = Props & NativeAttrs
const AutoCompleteDropdown: React.FC<
React.PropsWithChildren<AutoCompleteDropdownProps>
> = ({
children,
visible,
className,
dropdownStyle,
disableMatchWidth,
getPopupContainer,
}: React.PropsWithChildren<AutoCompleteDropdownProps> & typeof defaultProps) => {
const theme = useTheme()
const { ref } = useAutoCompleteContext()
const isEmpty = useMemo(() => {
return !visible || React.Children.count(children) === 0
}, [children, visible])
const classes = useClasses('auto-complete-dropdown', className)
const clickHandler = (event: React.MouseEvent<HTMLDivElement>) => {
event.preventDefault()
event.stopPropagation()
event.nativeEvent.stopImmediatePropagation()
}
return (
<Dropdown
parent={ref}
visible={visible}
disableMatchWidth={disableMatchWidth}
getPopupContainer={getPopupContainer}>
<div className={classes} style={dropdownStyle} onClick={clickHandler}>
{children}
<style jsx>{`
.auto-complete-dropdown {
border-radius: ${theme.layout.radius};
box-shadow: ${isEmpty ? 'none' : theme.expressiveness.shadowLarge};
background-color: ${theme.palette.background};
overflow-y: auto;
max-height: 15rem;
overflow-anchor: none;
}
`}</style>
</div>
</Dropdown>
)
}
AutoCompleteDropdown.defaultProps = defaultProps
AutoCompleteDropdown.displayName = 'GeistAutoCompleteDropdown'
export default AutoCompleteDropdown
================================================
FILE: components/auto-complete/auto-complete-empty.tsx
================================================
import React from 'react'
import AutoCompleteSearch from './auto-complete-searching'
interface Props {
hidden?: boolean
className?: string
}
const defaultProps = {
hidden: false,
className: '',
}
export type AutoCompleteEmptyProps = Props & React.HTMLAttributes<any>
const AutoCompleteEmpty: React.FC<React.PropsWithChildren<AutoCompleteEmptyProps>> = ({
children,
hidden,
className,
}: React.PropsWithChildren<AutoCompleteEmptyProps> & typeof defaultProps) => {
if (hidden) return null
return <AutoCompleteSearch className={className}>{children}</AutoCompleteSearch>
}
AutoCompleteEmpty.defaultProps = defaultProps
AutoCompleteEmpty.displayName = 'GeistAutoCompleteEmpty'
export default AutoCompleteEmpty
================================================
FILE: components/auto-complete/auto-complete-item.tsx
================================================
import React, { useMemo } from 'react'
import useTheme from '../use-theme'
import { useAutoCompleteContext } from './auto-complete-context'
import Ellipsis from '../shared/ellipsis'
import useScale, { withScale } from '../use-scale'
import useClasses from '../use-classes'
interface Props {
value: string
// The 'isLabelOnly' is only used inside the component,
// Automatically adjust width when only label children is included.
isLabelOnly?: boolean
}
const defaultProps = {}
export type AutoCompleteItemProps = Props & React.HTMLAttributes<any>
const AutoCompleteItemComponent: React.FC<
React.PropsWithChildren<AutoCompleteItemProps>
> = ({
value: identValue,
children,
isLabelOnly,
}: React.PropsWithChildren<AutoCompleteItemProps> & typeof defaultProps) => {
const theme = useTheme()
const { SCALES } = useScale()
const { value, updateValue, updateVisible } = useAutoCompleteContext()
const selectHandler = () => {
updateValue && updateValue(identValue)
updateVisible && updateVisible(false)
}
const isActive = useMemo(() => value === identValue, [identValue, value])
const classes = useClasses('item', {
active: isActive,
})
return (
<div className={classes} onClick={selectHandler}>
{isLabelOnly ? <Ellipsis height={SCALES.height(2)}>{children}</Ellipsis> : children}
<style jsx>{`
.item {
display: flex;
justify-content: flex-start;
align-items: center;
font-weight: normal;
white-space: pre;
background-color: ${theme.palette.background};
color: ${theme.palette.foreground};
user-select: none;
border: 0;
cursor: pointer;
transition: background 0.2s ease 0s, border-color 0.2s ease 0s;
font-size: ${SCALES.font(0.875)};
width: ${SCALES.width(1, 'auto')};
height: ${isLabelOnly ? SCALES.height(2.5) : SCALES.height(1, 'auto')};
padding: ${SCALES.pt(0)} ${SCALES.pr(0.75)} ${SCALES.pb(0)} ${SCALES.pl(0.75)};
margin: ${SCALES.mt(0)} ${SCALES.mr(0)} ${SCALES.mb(0)} ${SCALES.ml(0)};
}
.item:first-of-type {
border-top-left-radius: ${theme.layout.radius};
border-top-right-radius: ${theme.layout.radius};
}
.item:last-of-type {
border-bottom-left-radius: ${theme.layout.radius};
border-bottom-right-radius: ${theme.layout.radius};
}
.item:hover {
background-color: ${theme.palette.accents_1};
}
.item.active {
background-color: ${theme.palette.accents_1};
color: ${theme.palette.success};
}
`}</style>
</div>
)
}
AutoCompleteItemComponent.defaultProps = defaultProps
AutoCompleteItemComponent.displayName = 'GeistAutoCompleteItem'
const AutoCompleteItem = withScale(AutoCompleteItemComponent)
export default AutoCompleteItem
================================================
FILE: components/auto-complete/auto-complete-searching.tsx
================================================
import React from 'react'
import useTheme from '../use-theme'
import useScale, { withScale } from '../use-scale'
interface Props {
className?: string
}
const defaultProps = {
className: '',
}
export type AutoCompleteSearchProps = Props & React.HTMLAttributes<any>
const AutoCompleteSearchComponent: React.FC<
React.PropsWithChildren<AutoCompleteSearchProps>
> = ({
children,
className,
}: React.PropsWithChildren<AutoCompleteSearchProps> & typeof defaultProps) => {
const theme = useTheme()
const { SCALES } = useScale()
return (
<div className={className}>
{children}
<style jsx>{`
div {
display: flex;
justify-content: center;
text-align: center;
align-items: center;
font-weight: normal;
white-space: pre;
padding: ${theme.layout.gapHalf};
line-height: 1;
background-color: ${theme.palette.background};
color: ${theme.palette.accents_5};
user-select: none;
border: 0;
border-radius: ${theme.layout.radius};
font-size: ${SCALES.font(0.875)};
width: ${SCALES.width(1, 'auto')};
height: ${SCALES.height(1, 'auto')};
padding: ${SCALES.pt(0.875)} ${SCALES.pr(0.875)} ${SCALES.pb(0.875)}
${SCALES.pl(0.875)};
margin: ${SCALES.mt(0)} ${SCALES.mr(0)} ${SCALES.mb(0)} ${SCALES.ml(0)};
}
`}</style>
</div>
)
}
AutoCompleteSearchComponent.defaultProps = defaultProps
AutoCompleteSearchComponent.displayName = 'GeistAutoCompleteSearch'
const AutoCompleteSearch = withScale(AutoCompleteSearchComponent)
export default AutoCompleteSearch
================================================
FILE: components/auto-complete/auto-complete.tsx
================================================
import React, {
CSSProperties,
useEffect,
useImperativeHandle,
useMemo,
useRef,
useState,
} from 'react'
import Input from '../input'
import AutoCompleteItem, { AutoCompleteItemProps } from './auto-complete-item'
import AutoCompleteDropdown from './auto-complete-dropdown'
import AutoCompleteSearching from './auto-complete-searching'
import AutoCompleteEmpty from './auto-complete-empty'
import { AutoCompleteContext, AutoCompleteConfig } from './auto-complete-context'
import { NormalTypes } from '../utils/prop-types'
import Loading from '../loading'
import { pickChild } from '../utils/collections'
import useCurrentState from '../utils/use-current-state'
import useScale, { withScale } from '../use-scale'
export type AutoCompleteTypes = NormalTypes
export type AutoCompleteOption = {
label: string
value: string
}
export type AutoCompleteOptions = Array<
typeof AutoCompleteItem | AutoCompleteOption | React.ReactElement<AutoCompleteItemProps>
>
interface Props {
options?: AutoCompleteOptions
type?: AutoCompleteTypes
initialValue?: string
value?: string
onChange?: (value: string) => void
onSearch?: (value: string) => void
onSelect?: (value: string) => void
searching?: boolean | undefined
clearable?: boolean
dropdownClassName?: string
dropdownStyle?: CSSProperties
disableMatchWidth?: boolean
disableFreeSolo?: boolean
className?: string
getPopupContainer?: () => HTMLElement | null
}
const defaultProps = {
options: [] as AutoCompleteOptions,
initialValue: '',
disabled: false,
clearable: false,
type: 'default' as AutoCompleteTypes,
disableMatchWidth: false,
disableFreeSolo: false,
className: '',
}
type NativeAttrs = Omit<React.InputHTMLAttributes<any>, keyof Props>
export type AutoCompleteProps = Props & NativeAttrs
const childrenToOptionsNode = (options: Array<AutoCompleteOption>) =>
options.map((item, index) => {
const key = `auto-complete-item-${index}`
if (React.isValidElement(item)) return React.cloneElement(item, { key })
const validItem = item as AutoCompleteOption
return (
<AutoCompleteItem key={key} value={validItem.value} isLabelOnly>
{validItem.label}
</AutoCompleteItem>
)
})
// When the search is not set, the "clearable" icon can be displayed in the original location.
// When the search is seted, at least one element should exist to avoid re-render.
const getSearchIcon = (searching?: boolean, scale: string | number = 1) => {
if (searching === undefined) return null
return searching ? <Loading scale={+scale / 2} /> : <span />
}
const AutoCompleteComponent = React.forwardRef<
HTMLInputElement,
React.PropsWithChildren<AutoCompleteProps>
>(
(
{
options,
initialValue: customInitialValue,
onSelect,
onSearch,
onChange,
searching,
children,
type,
value,
clearable,
disabled,
dropdownClassName,
dropdownStyle,
disableMatchWidth,
disableFreeSolo,
getPopupContainer,
...props
}: React.PropsWithChildren<AutoCompleteProps> & typeof defaultProps,
userRef: React.Ref<HTMLInputElement | null>,
) => {
const resetTimer = useRef<number>()
const { SCALES, getScaleProps } = useScale()
const ref = useRef<HTMLDivElement>(null)
const inputRef = useRef<HTMLInputElement>(null)
const [state, setState, stateRef] = useCurrentState<string>(customInitialValue)
const [selectVal, setSelectVal] = useState<string>(customInitialValue)
const [visible, setVisible] = useState<boolean>(false)
useImperativeHandle(userRef, () => inputRef.current)
const [, searchChild] = pickChild(children, AutoCompleteSearching)
const [, emptyChild] = pickChild(children, AutoCompleteEmpty)
const autoCompleteItems = useMemo(() => {
const hasSearchChild = searchChild && React.Children.count(searchChild) > 0
const hasEmptyChild = emptyChild && React.Children.count(emptyChild) > 0
if (searching) {
return hasSearchChild ? (
searchChild
) : (
<AutoCompleteSearching>Searching...</AutoCompleteSearching>
)
}
if (options.length === 0) {
if (state === '') return null
return hasEmptyChild ? (
emptyChild
) : (
<AutoCompleteEmpty>No Options</AutoCompleteEmpty>
)
}
return childrenToOptionsNode(options as Array<AutoCompleteOption>)
}, [searching, options])
const showClearIcon = useMemo(
() => clearable && searching === undefined,
[clearable, searching],
)
const updateValue = (val: string) => {
if (disabled) return
setSelectVal(val)
onSelect && onSelect(val)
setState(val)
inputRef.current && inputRef.current.focus()
}
const updateVisible = (next: boolean) => setVisible(next)
const onInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
setVisible(true)
onSearch && onSearch(event.target.value)
setState(event.target.value)
}
const resetInputValue = () => {
if (!disableFreeSolo) return
if (!state || state === '') return
if (state !== selectVal) {
setState(selectVal)
}
}
useEffect(() => {
onChange && onChange(state)
}, [state])
useEffect(() => {
if (value === undefined) return
setState(value)
}, [value])
const initialValue = useMemo<AutoCompleteConfig>(
() => ({
ref,
value: state,
updateValue,
visible,
updateVisible,
}),
[state, visible],
)
const toggleFocusHandler = (next: boolean) => {
clearTimeout(resetTimer.current)
setVisible(next)
if (next) {
onSearch && onSearch(stateRef.current)
} else {
resetTimer.current = window.setTimeout(() => {
resetInputValue()
clearTimeout(resetTimer.current)
}, 100)
}
}
const inputProps = {
...props,
disabled,
value: state,
}
return (
<AutoCompleteContext.Provider value={initialValue}>
<div ref={ref} className="auto-complete">
<Input
ref={inputRef}
type={type}
onChange={onInputChange}
onFocus={() => toggleFocusHandler(true)}
onBlur={() => toggleFocusHandler(false)}
clearable={showClearIcon}
width={SCALES.width(1, 'initial')}
height={SCALES.height(2.25)}
iconRight={getSearchIcon(searching, getScaleProps('scale'))}
{...inputProps}
/>
<AutoCompleteDropdown
visible={visible}
disableMatchWidth={disableMatchWidth}
className={dropdownClassName}
dropdownStyle={dropdownStyle}
getPopupContainer={getPopupContainer}>
{autoCompleteItems}
</AutoCompleteDropdown>
<style jsx>{`
.auto-complete {
width: ${SCALES.width(1, 'max-content')};
height: ${SCALES.height(1, 'auto')};
padding: ${SCALES.pt(0)} ${SCALES.pr(0)} ${SCALES.pb(0)} ${SCALES.pl(0)};
margin: ${SCALES.mt(0)} ${SCALES.mr(0)} ${SCALES.mb(0)} ${SCALES.ml(0)};
}
.auto-complete :global(.loading) {
width: max-content;
}
`}</style>
</div>
</AutoCompleteContext.Provider>
)
},
)
AutoCompleteComponent.defaultProps = defaultProps
AutoCompleteComponent.displayName = 'GeistAutoComplete'
const AutoComplete = withScale(AutoCompleteComponent)
export default AutoComplete
================================================
FILE: components/auto-complete/index.ts
================================================
import AutoComplete from './auto-complete'
import AutoCompleteItem from './auto-complete-item'
import AutoCompleteSearching from './auto-complete-searching'
import AutoCompleteEmpty from './auto-complete-empty'
export type AutoCompleteComponentType = typeof AutoComplete & {
Item: typeof AutoCompleteItem
Option: typeof AutoCompleteItem
Searching: typeof AutoCompleteSearching
Empty: typeof AutoCompleteEmpty
}
;(AutoComplete as AutoCompleteComponentType).Item = AutoCompleteItem
;(AutoComplete as AutoCompleteComponentType).Option = AutoCompleteItem
;(AutoComplete as AutoCompleteComponentType).Searching = AutoCompleteSearching
;(AutoComplete as AutoCompleteComponentType).Empty = AutoCompleteEmpty
export type {
AutoCompleteOption,
AutoCompleteOptions,
AutoCompleteProps,
AutoCompleteTypes,
} from './auto-complete'
export default AutoComplete as AutoCompleteComponentType
================================================
FILE: components/avatar/__tests__/__snapshots__/index.test.tsx.snap
================================================
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Avatar should render text element 1`] = `
LoadedCheerio {
"0": Node {
"attribs": Object {
"class": "avatar",
},
"children": Array [
Node {
"attribs": Object {
"class": "avatar-text",
},
"children": Array [],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar {
display: inline-block;
position: relative;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 50%;
vertical-align: top;
background-color: #fff;
box-sizing: border-box;
width: calc(1.75 * 16px);
height: calc(1.75 * 16px);
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-img {
display: inline-block;
object-fit: cover;
width: 100%;
height: 100%;
border-radius: 50%;
user-select: none;
}
.avatar-text {
position: absolute;
left: 50%;
top: 50%;
font-size: calc(1 * 16px);
text-align: center;
transform: translate(-50%, -50%) scale(0.65);
white-space: nowrap;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar {
display: inline-block;
position: relative;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 50%;
vertical-align: top;
background-color: #fff;
box-sizing: border-box;
width: calc(1.75 * 16px);
height: calc(1.75 * 16px);
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-img {
display: inline-block;
object-fit: cover;
width: 100%;
height: 100%;
border-radius: 50%;
user-select: none;
}
.avatar-text {
position: absolute;
left: 50%;
top: 50%;
font-size: calc(1 * 16px);
text-align: center;
transform: translate(-50%, -50%) scale(0.65);
white-space: nowrap;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "avatar-text",
},
"children": Array [],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": Node {
"children": Array [
[Circular],
],
"name": "root",
"next": null,
"parent": null,
"prev": null,
"type": "root",
},
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"_root": LoadedCheerio {
"0": Node {
"children": Array [
Node {
"attribs": Object {},
"children": Array [
Node {
"attribs": Object {},
"children": Array [],
"name": "head",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [],
"name": "body",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
Node {
"attribs": Object {},
"children": Array [],
"name": "body",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {},
"children": Array [],
"name": "head",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "html",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "root",
"next": null,
"parent": null,
"prev": null,
"type": "root",
"x-mode": "quirks",
},
"_root": [Circular],
"length": 1,
"options": Object {
"decodeEntities": true,
"xml": false,
},
},
"length": 1,
"options": Object {
"decodeEntities": true,
"xml": false,
},
}
`;
exports[`Avatar should render text element 2`] = `
LoadedCheerio {
"0": Node {
"attribs": Object {
"class": "avatar",
},
"children": Array [
Node {
"attribs": Object {
"class": "avatar-text",
},
"children": Array [
Node {
"data": "text",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar {
display: inline-block;
position: relative;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 50%;
vertical-align: top;
background-color: #fff;
box-sizing: border-box;
width: calc(1.75 * 16px);
height: calc(1.75 * 16px);
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-img {
display: inline-block;
object-fit: cover;
width: 100%;
height: 100%;
border-radius: 50%;
user-select: none;
}
.avatar-text {
position: absolute;
left: 50%;
top: 50%;
font-size: calc(1 * 16px);
text-align: center;
transform: translate(-50%, -50%) scale(0.65);
white-space: nowrap;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar {
display: inline-block;
position: relative;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 50%;
vertical-align: top;
background-color: #fff;
box-sizing: border-box;
width: calc(1.75 * 16px);
height: calc(1.75 * 16px);
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-img {
display: inline-block;
object-fit: cover;
width: 100%;
height: 100%;
border-radius: 50%;
user-select: none;
}
.avatar-text {
position: absolute;
left: 50%;
top: 50%;
font-size: calc(1 * 16px);
text-align: center;
transform: translate(-50%, -50%) scale(0.65);
white-space: nowrap;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "avatar-text",
},
"children": Array [
Node {
"data": "text",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": Node {
"children": Array [
[Circular],
],
"name": "root",
"next": null,
"parent": null,
"prev": null,
"type": "root",
},
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"_root": LoadedCheerio {
"0": Node {
"children": Array [
Node {
"attribs": Object {},
"children": Array [
Node {
"attribs": Object {},
"children": Array [],
"name": "head",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [],
"name": "body",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
Node {
"attribs": Object {},
"children": Array [],
"name": "body",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {},
"children": Array [],
"name": "head",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "html",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "root",
"next": null,
"parent": null,
"prev": null,
"type": "root",
"x-mode": "quirks",
},
"_root": [Circular],
"length": 1,
"options": Object {
"decodeEntities": true,
"xml": false,
},
},
"length": 1,
"options": Object {
"decodeEntities": true,
"xml": false,
},
}
`;
exports[`Avatar should stacked when avatars are in a group 1`] = `
LoadedCheerio {
"0": Node {
"attribs": Object {
"class": "avatar-group",
},
"children": Array [
Node {
"attribs": Object {
"class": "avatar",
},
"children": Array [
Node {
"attribs": Object {
"class": "avatar-text",
},
"children": Array [],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar {
display: inline-block;
position: relative;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 50%;
vertical-align: top;
background-color: #fff;
box-sizing: border-box;
width: calc(1.75 * 16px);
height: calc(1.75 * 16px);
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-img {
display: inline-block;
object-fit: cover;
width: 100%;
height: 100%;
border-radius: 50%;
user-select: none;
}
.avatar-text {
position: absolute;
left: 50%;
top: 50%;
font-size: calc(1 * 16px);
text-align: center;
transform: translate(-50%, -50%) scale(0.65);
white-space: nowrap;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar {
display: inline-block;
position: relative;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 50%;
vertical-align: top;
background-color: #fff;
box-sizing: border-box;
width: calc(1.75 * 16px);
height: calc(1.75 * 16px);
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-img {
display: inline-block;
object-fit: cover;
width: 100%;
height: 100%;
border-radius: 50%;
user-select: none;
}
.avatar-text {
position: absolute;
left: 50%;
top: 50%;
font-size: calc(1 * 16px);
text-align: center;
transform: translate(-50%, -50%) scale(0.65);
white-space: nowrap;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "avatar-text",
},
"children": Array [],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {
"class": "avatar",
},
"children": Array [
Node {
"attribs": Object {
"class": "avatar-text",
},
"children": Array [],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar {
display: inline-block;
position: relative;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 50%;
vertical-align: top;
background-color: #fff;
box-sizing: border-box;
width: calc(1.75 * 16px);
height: calc(1.75 * 16px);
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-img {
display: inline-block;
object-fit: cover;
width: 100%;
height: 100%;
border-radius: 50%;
user-select: none;
}
.avatar-text {
position: absolute;
left: 50%;
top: 50%;
font-size: calc(1 * 16px);
text-align: center;
transform: translate(-50%, -50%) scale(0.65);
white-space: nowrap;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar {
display: inline-block;
position: relative;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 50%;
vertical-align: top;
background-color: #fff;
box-sizing: border-box;
width: calc(1.75 * 16px);
height: calc(1.75 * 16px);
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-img {
display: inline-block;
object-fit: cover;
width: 100%;
height: 100%;
border-radius: 50%;
user-select: none;
}
.avatar-text {
position: absolute;
left: 50%;
top: 50%;
font-size: calc(1 * 16px);
text-align: center;
transform: translate(-50%, -50%) scale(0.65);
white-space: nowrap;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "avatar-text",
},
"children": Array [],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar-group {
display: flex;
align-items: center;
width: max-content;
height: auto;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-group :global(.avatar) {
margin-left: -calc(0.625 * 16px);
}
.count {
font-size: calc(0.875 * 16px);
display: inline-flex;
align-items: center;
padding-left: 5.5px;
color: #333;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": [Circular],
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
Node {
"attribs": Object {
"class": "avatar",
},
"children": Array [
Node {
"attribs": Object {
"class": "avatar-text",
},
"children": Array [],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar {
display: inline-block;
position: relative;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 50%;
vertical-align: top;
background-color: #fff;
box-sizing: border-box;
width: calc(1.75 * 16px);
height: calc(1.75 * 16px);
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-img {
display: inline-block;
object-fit: cover;
width: 100%;
height: 100%;
border-radius: 50%;
user-select: none;
}
.avatar-text {
position: absolute;
left: 50%;
top: 50%;
font-size: calc(1 * 16px);
text-align: center;
transform: translate(-50%, -50%) scale(0.65);
white-space: nowrap;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar {
display: inline-block;
position: relative;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 50%;
vertical-align: top;
background-color: #fff;
box-sizing: border-box;
width: calc(1.75 * 16px);
height: calc(1.75 * 16px);
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-img {
display: inline-block;
object-fit: cover;
width: 100%;
height: 100%;
border-radius: 50%;
user-select: none;
}
.avatar-text {
position: absolute;
left: 50%;
top: 50%;
font-size: calc(1 * 16px);
text-align: center;
transform: translate(-50%, -50%) scale(0.65);
white-space: nowrap;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "avatar-text",
},
"children": Array [],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar-group {
display: flex;
align-items: center;
width: max-content;
height: auto;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-group :global(.avatar) {
margin-left: -calc(0.625 * 16px);
}
.count {
font-size: calc(0.875 * 16px);
display: inline-flex;
align-items: center;
padding-left: 5.5px;
color: #333;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "avatar",
},
"children": Array [
Node {
"attribs": Object {
"class": "avatar-text",
},
"children": Array [],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar {
display: inline-block;
position: relative;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 50%;
vertical-align: top;
background-color: #fff;
box-sizing: border-box;
width: calc(1.75 * 16px);
height: calc(1.75 * 16px);
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-img {
display: inline-block;
object-fit: cover;
width: 100%;
height: 100%;
border-radius: 50%;
user-select: none;
}
.avatar-text {
position: absolute;
left: 50%;
top: 50%;
font-size: calc(1 * 16px);
text-align: center;
transform: translate(-50%, -50%) scale(0.65);
white-space: nowrap;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar {
display: inline-block;
position: relative;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 50%;
vertical-align: top;
background-color: #fff;
box-sizing: border-box;
width: calc(1.75 * 16px);
height: calc(1.75 * 16px);
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-img {
display: inline-block;
object-fit: cover;
width: 100%;
height: 100%;
border-radius: 50%;
user-select: none;
}
.avatar-text {
position: absolute;
left: 50%;
top: 50%;
font-size: calc(1 * 16px);
text-align: center;
transform: translate(-50%, -50%) scale(0.65);
white-space: nowrap;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "avatar-text",
},
"children": Array [],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar-group {
display: flex;
align-items: center;
width: max-content;
height: auto;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-group :global(.avatar) {
margin-left: -calc(0.625 * 16px);
}
.count {
font-size: calc(0.875 * 16px);
display: inline-flex;
align-items: center;
padding-left: 5.5px;
color: #333;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "avatar",
},
"children": Array [
Node {
"attribs": Object {
"class": "avatar-text",
},
"children": Array [],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar {
display: inline-block;
position: relative;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 50%;
vertical-align: top;
background-color: #fff;
box-sizing: border-box;
width: calc(1.75 * 16px);
height: calc(1.75 * 16px);
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-img {
display: inline-block;
object-fit: cover;
width: 100%;
height: 100%;
border-radius: 50%;
user-select: none;
}
.avatar-text {
position: absolute;
left: 50%;
top: 50%;
font-size: calc(1 * 16px);
text-align: center;
transform: translate(-50%, -50%) scale(0.65);
white-space: nowrap;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar {
display: inline-block;
position: relative;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 50%;
vertical-align: top;
background-color: #fff;
box-sizing: border-box;
width: calc(1.75 * 16px);
height: calc(1.75 * 16px);
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-img {
display: inline-block;
object-fit: cover;
width: 100%;
height: 100%;
border-radius: 50%;
user-select: none;
}
.avatar-text {
position: absolute;
left: 50%;
top: 50%;
font-size: calc(1 * 16px);
text-align: center;
transform: translate(-50%, -50%) scale(0.65);
white-space: nowrap;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "avatar-text",
},
"children": Array [],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "avatar",
},
"children": Array [
Node {
"attribs": Object {
"class": "avatar-text",
},
"children": Array [],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar {
display: inline-block;
position: relative;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 50%;
vertical-align: top;
background-color: #fff;
box-sizing: border-box;
width: calc(1.75 * 16px);
height: calc(1.75 * 16px);
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-img {
display: inline-block;
object-fit: cover;
width: 100%;
height: 100%;
border-radius: 50%;
user-select: none;
}
.avatar-text {
position: absolute;
left: 50%;
top: 50%;
font-size: calc(1 * 16px);
text-align: center;
transform: translate(-50%, -50%) scale(0.65);
white-space: nowrap;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.avatar {
display: inline-block;
position: relative;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 50%;
vertical-align: top;
background-color: #fff;
box-sizing: border-box;
width: calc(1.75 * 16px);
height: calc(1.75 * 16px);
padding: 0 0 0 0;
margin: 0 0 0 0;
}
.avatar-img {
display: inline-block;
object-fit: cover;
width: 100%;
height: 100%;
border-radius: 50%;
user-select: none;
}
.avatar-text {
position: absolute;
left: 50%;
top: 50%;
font-size: calc(1 * 16px);
text-align: center;
transform: translate(-50%, -50%) scale(0.65);
white-space: nowrap;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "avatar-text",
},
"children": Array [],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "div",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": Node {
"children": Array [
[Circular],
],
"name": "root",
"next": null,
"parent": null,
"prev": null,
"type": "root",
},
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"_root": LoadedCheerio {
"0": Node {
"children": Array [
Node {
"attribs": Object {},
"children": Array [
Node {
"attribs": Object {},
"children": Array [],
"name": "head",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {},
"children": Array [],
"name": "body",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
Node {
"attribs": Object {},
"children": Array [],
"name": "body",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"attribs": Object {},
"children": Array [],
"name": "head",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "html",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "root",
"next": null,
"parent": null,
"prev": null,
"type": "root",
"x-mode": "quirks",
},
"_root": [Circular],
"length": 1,
"options": Object {
"decodeEntities": true,
"xml": false,
},
},
"length": 1,
"options": Object {
"decodeEntities": true,
"xml": false,
},
}
`;
================================================
FILE: components/avatar/__tests__/index.test.tsx
================================================
import React from 'react'
import { mount, render, shallow } from 'enzyme'
import { Avatar } from 'components'
describe('Avatar', () => {
it('should support square and circle', () => {
const circle = shallow(<Avatar />)
expect(() => circle.unmount()).not.toThrow()
const square = shallow(<Avatar isSquare />)
expect(() => square.unmount()).not.toThrow()
})
it('should render text element', () => {
const imageAvatar = render(<Avatar />)
expect(imageAvatar).toMatchSnapshot()
const textAvatar = render(<Avatar text="text" />)
expect(textAvatar).toMatchSnapshot()
})
it('should omit long chars automatically', () => {
const avatar = mount(<Avatar text="texttexttexttext" />)
const text = avatar.find('.avatar-text').text()
expect(text.length).toBeLessThan(4)
})
it('stacked should be work', () => {
const avatar = shallow(<Avatar src="/images/avatar.png" stacked />)
expect(() => avatar.unmount()).not.toThrow()
})
it('group component should render all children', () => {
const group = mount(
<Avatar.Group>
<Avatar />
<Avatar />
</Avatar.Group>,
)
expect(group.find('.avatar')).toHaveLength(2)
})
it('should stacked when avatars are in a group', () => {
const group = render(
<Avatar.Group>
<Avatar />
<Avatar />
</Avatar.Group>,
)
expect(group).toMatchSnapshot()
})
it('should show count in group', () => {
const count = 20
const group = render(<Avatar.Group count={count} />)
const text = group.find('.count').text()
expect(text).toMatch(`${count}`)
})
})
================================================
FILE: components/avatar/avatar-group.tsx
================================================
import React from 'react'
import useTheme from '../use-theme'
import useScale, { withScale } from '../use-scale'
import useClasses from '../use-classes'
interface Props {
count?: number
className?: string
}
const defaultProps = {
className: '',
}
type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
export type AvatarGroupProps = Props & NativeAttrs
const AvatarGroupComponent: React.FC<React.PropsWithChildren<AvatarGroupProps>> = ({
count,
className,
children,
}: AvatarGroupProps & typeof defaultProps) => {
const theme = useTheme()
const { SCALES } = useScale()
return (
<div className={useClasses('avatar-group', className)}>
{children}
{count && <span className="count">+{count}</span>}
<style jsx>{`
.avatar-group {
display: flex;
align-items: center;
width: ${SCALES.width(1, 'max-content')};
height: ${SCALES.height(1, 'auto')};
padding: ${SCALES.pt(0)} ${SCALES.pr(0)} ${SCALES.pb(0)} ${SCALES.pl(0)};
margin: ${SCALES.mt(0)} ${SCALES.mr(0)} ${SCALES.mb(0)} ${SCALES.ml(0)};
}
.avatar-group :global(.avatar) {
margin-left: -${SCALES.ml(0.625)};
}
.count {
font-size: ${SCALES.font(0.875)};
display: inline-flex;
align-items: center;
padding-left: 5.5px;
color: ${theme.palette.accents_7};
}
`}</style>
</div>
)
}
AvatarGroupComponent.defaultProps = defaultProps
AvatarGroupComponent.displayName = 'GeistAvatarGroup'
const AvatarGroup = withScale(AvatarGroupComponent)
export default AvatarGroup
================================================
FILE: components/avatar/avatar.tsx
================================================
import React from 'react'
import useTheme from '../use-theme'
import useScale, { withScale } from '../use-scale'
import useClasses from '../use-classes'
interface Props {
src?: string
stacked?: boolean
text?: string
isSquare?: boolean
className?: string
}
const defaultProps = {
stacked: false,
text: '',
isSquare: false,
className: '',
}
type NativeAttrs = Omit<
Partial<React.ImgHTMLAttributes<any> & React.HTMLAttributes<any>>,
keyof Props
>
export type AvatarProps = Props & NativeAttrs
const safeText = (text: string): string => {
if (text.length <= 4) return text
return text.slice(0, 3)
}
const AvatarComponent: React.FC<AvatarProps> = ({
src,
stacked,
text,
isSquare,
className,
...props
}: AvatarProps & typeof defaultProps) => {
const theme = useTheme()
const { SCALES } = useScale()
const showText = !src
const radius = isSquare ? theme.layout.radius : '50%'
const marginLeft = stacked ? SCALES.ml(-0.625) : SCALES.ml(0)
const classes = useClasses('avatar', className)
return (
<span className={classes}>
{!showText && (
<img alt="avatar" className="avatar-img" src={src} draggable={false} {...props} />
)}
{showText && (
<span className="avatar-text" {...props}>
{safeText(text)}
</span>
)}
<style jsx>{`
.avatar {
display: inline-block;
position: relative;
overflow: hidden;
border: 1px solid ${theme.palette.accents_2};
border-radius: ${radius};
vertical-align: top;
background-color: ${theme.palette.background};
box-sizing: border-box;
width: ${SCALES.width(1.75) || SCALES.height(1.75)};
height: ${SCALES.height(1.75) || SCALES.width(1.75)};
padding: ${SCALES.pt(0)} ${SCALES.pr(0)} ${SCALES.pb(0)} ${SCALES.pl(0)};
margin: ${SCALES.mt(0)} ${SCALES.mr(0)} ${SCALES.mb(0)} ${marginLeft};
}
.avatar-img {
display: inline-block;
object-fit: cover;
width: 100%;
height: 100%;
border-radius: ${radius};
user-select: none;
}
.avatar-text {
position: absolute;
left: 50%;
top: 50%;
font-size: ${SCALES.font(1)};
text-align: center;
transform: translate(-50%, -50%) scale(0.65);
white-space: nowrap;
user-select: none;
}
`}</style>
</span>
)
}
AvatarComponent.defaultProps = defaultProps
AvatarComponent.displayName = 'GeistAvatar'
const Avatar = withScale(AvatarComponent)
export default Avatar
================================================
FILE: components/avatar/index.ts
================================================
import Avatar from './avatar'
import AvatarGroup from './avatar-group'
export type AvatarComponentType = typeof Avatar & {
Group: typeof AvatarGroup
}
;(Avatar as AvatarComponentType).Group = AvatarGroup
export type { AvatarProps } from './avatar'
export type { AvatarGroupProps } from './avatar-group'
export default Avatar as AvatarComponentType
================================================
FILE: components/badge/__tests__/__snapshots__/anchor.test.tsx.snap
================================================
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`BadgeAnchor should be support multiple position 1`] = `
"<div class=\\"anchor\\"><button>btn</button><sup><span class=\\"badge\\">test<style>
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #000;
color: #fff;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
</style></span></sup><style>
.anchor {
position: relative;
display: inline-flex;
vertical-align: middle;
flex-shrink: 0;
box-sizing: border-box;
}
sup {
position: absolute;
top: 0;
left: auto;
right: 0;
bottom: auto;
transform: translate(50%, -50%);
transform-origin: 100% 0%;
z-index: 1;
}
</style></div>"
`;
exports[`BadgeAnchor should be support multiple position 2`] = `
"<div class=\\"anchor\\"><button>btn</button><sup><span class=\\"badge\\">test<style>
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #000;
color: #fff;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
</style></span></sup><style>
.anchor {
position: relative;
display: inline-flex;
vertical-align: middle;
flex-shrink: 0;
box-sizing: border-box;
}
sup {
position: absolute;
top: 0;
left: 0;
right: auto;
bottom: auto;
transform: translate(-50%, -50%);
transform-origin: 0% 0%;
z-index: 1;
}
</style></div>"
`;
exports[`BadgeAnchor should be support multiple position 3`] = `
"<div class=\\"anchor\\"><button>btn</button><sup><span class=\\"badge\\">test<style>
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #000;
color: #fff;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
</style></span></sup><style>
.anchor {
position: relative;
display: inline-flex;
vertical-align: middle;
flex-shrink: 0;
box-sizing: border-box;
}
sup {
position: absolute;
top: auto;
left: auto;
right: 0;
bottom: 0;
transform: translate(50%, 50%);
transform-origin: 100% 100%;
z-index: 1;
}
</style></div>"
`;
================================================
FILE: components/badge/__tests__/__snapshots__/index.test.tsx.snap
================================================
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Badge should re-render when size changed 1`] = `ReactWrapper {}`;
exports[`Badge should re-render when size changed 2`] = `ReactWrapper {}`;
exports[`Badge should render different types 1`] = `
LoadedCheerio {
"0": Node {
"attribs": Object {},
"children": Array [
Node {
"attribs": Object {
"class": "badge",
},
"children": Array [
Node {
"data": "badge",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #0070f3;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "text",
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #0070f3;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"data": "badge",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "text",
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {
"class": "badge",
},
"children": Array [
Node {
"data": "badge",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #666;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "text",
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #666;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"data": "badge",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "text",
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {
"class": "badge",
},
"children": Array [
Node {
"data": "badge",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #f5a623;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "text",
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #f5a623;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"data": "badge",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "text",
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {
"class": "badge",
},
"children": Array [
Node {
"data": "badge",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #e00;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "text",
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #e00;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"data": "badge",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "text",
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"parent": [Circular],
"prev": [Circular],
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"parent": [Circular],
"prev": [Circular],
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
Node {
"attribs": Object {
"class": "badge",
},
"children": Array [
Node {
"data": "badge",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #666;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "text",
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #666;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"data": "badge",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "text",
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {
"class": "badge",
},
"children": Array [
Node {
"data": "badge",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #f5a623;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "text",
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #f5a623;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"data": "badge",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "text",
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {
"class": "badge",
},
"children": Array [
Node {
"data": "badge",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #e00;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "text",
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #e00;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"data": "badge",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "text",
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"parent": [Circular],
"prev": [Circular],
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "badge",
},
"children": Array [
Node {
"data": "badge",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #0070f3;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "text",
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #0070f3;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"data": "badge",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "text",
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
Node {
"attribs": Object {
"class": "badge",
},
"children": Array [
Node {
"data": "badge",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #f5a623;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "text",
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #f5a623;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"data": "badge",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "text",
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": Node {
"attribs": Object {
"class": "badge",
},
"children": Array [
Node {
"data": "badge",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #e00;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
"parent": [Circular],
"prev": null,
"type": "text",
},
Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #e00;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radius: 50%;
user-select: none;
}
",
"next": null,
"parent": [Circular],
"prev": null,
"type": "text",
},
],
"name": "style",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": Node {
"data": "badge",
"next": [Circular],
"parent": [Circular],
"prev": null,
"type": "text",
},
"type": "style",
"x-attribsNamespace": Object {},
"x-attribsPrefix": Object {},
},
],
"name": "span",
"namespace": "http://www.w3.org/1999/xhtml",
"next": null,
"parent": [Circular],
"prev": [Circular],
"type": "tag",
"x-attribsNamespace": Object {
"class": undefined,
},
"x-attribsPrefix": Object {
"class": undefined,
},
},
"parent": [Circular],
"prev": Node {
"attribs": Object {
"class": "badge",
},
"children": Array [
Node {
"data": "badge",
"next": Node {
"attribs": Object {},
"children": Array [
Node {
"data": "
.badge {
display: inline-block;
border-radius: 16px;
font-variant: tabular-nums;
line-height: 1;
vertical-align: middle;
background-color: #666;
color: white;
border: 0;
font-size: calc(0.875 * 16px);
width: auto;
height: auto;
padding: calc(0.25 * 16px) calc(0.4375 * 16px) calc(0.25 * 16px)
calc(0.4375 * 16px);
margin: 0 0 0 0;
}
.dot {
padding: calc(0.25 * 16px) calc(0.25 * 16px);
border-radi
gitextract_2s6hwfls/
├── .circleci/
│ └── config.yml
├── .codecov.yml
├── .eslintignore
├── .eslintrc.js
├── .github/
│ ├── CODE_OF_CONDUCT.md
│ ├── CONTRIBUTING.md
│ ├── ISSUE_TEMPLATE/
│ │ ├── 1-bug-report.md
│ │ ├── 2-feature-request.md
│ │ ├── 3-docs.md
│ │ └── config.yml
│ ├── PULL_REQUEST_TEMPLATE.md
│ └── workflows/
│ └── publish.yml
├── .gitignore
├── .jest.config.js
├── .prettierignore
├── .travis.yml
├── .vercelignore
├── LICENSE
├── README.md
├── components/
│ ├── auto-complete/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── index.test.tsx.snap
│ │ │ │ └── search.test.tsx.snap
│ │ │ ├── index.test.tsx
│ │ │ ├── search.test.tsx
│ │ │ └── use-input.test.tsx
│ │ ├── auto-complete-context.ts
│ │ ├── auto-complete-dropdown.tsx
│ │ ├── auto-complete-empty.tsx
│ │ ├── auto-complete-item.tsx
│ │ ├── auto-complete-searching.tsx
│ │ ├── auto-complete.tsx
│ │ └── index.ts
│ ├── avatar/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── avatar-group.tsx
│ │ ├── avatar.tsx
│ │ └── index.ts
│ ├── badge/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── anchor.test.tsx.snap
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── anchor.test.tsx
│ │ │ └── index.test.tsx
│ │ ├── badge-anchor.tsx
│ │ ├── badge.tsx
│ │ └── index.ts
│ ├── breadcrumbs/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── breadcrumbs.test.tsx.snap
│ │ │ └── breadcrumbs.test.tsx
│ │ ├── breadcrumbs-item.tsx
│ │ ├── breadcrumbs-separator.tsx
│ │ ├── breadcrumbs.tsx
│ │ └── index.ts
│ ├── button/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── icon.test.tsx.snap
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── icon.test.tsx
│ │ │ └── index.test.tsx
│ │ ├── button-icon.tsx
│ │ ├── button-loading.tsx
│ │ ├── button.drip.tsx
│ │ ├── button.tsx
│ │ ├── index.ts
│ │ ├── styles.ts
│ │ └── utils.tsx
│ ├── button-dropdown/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── button-dropdown-context.ts
│ │ ├── button-dropdown-item.tsx
│ │ ├── button-dropdown.tsx
│ │ ├── icon.tsx
│ │ ├── index.ts
│ │ └── styles.ts
│ ├── button-group/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── button-group-context.ts
│ │ ├── button-group.tsx
│ │ └── index.ts
│ ├── capacity/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── capacity.tsx
│ │ └── index.ts
│ ├── card/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── footer.test.tsx.snap
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── footer.test.tsx
│ │ │ └── index.test.tsx
│ │ ├── card-content.tsx
│ │ ├── card-footer.tsx
│ │ ├── card.tsx
│ │ ├── index.ts
│ │ └── styles.ts
│ ├── checkbox/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── group.test.tsx.snap
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── group.test.tsx
│ │ │ └── index.test.tsx
│ │ ├── checkbox-context.ts
│ │ ├── checkbox-group.tsx
│ │ ├── checkbox.icon.tsx
│ │ ├── checkbox.tsx
│ │ ├── index.ts
│ │ └── styles.ts
│ ├── code/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── code.tsx
│ │ └── index.ts
│ ├── col/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── col.tsx
│ │ └── index.ts
│ ├── collapse/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── group.test.tsx.snap
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── group.test.tsx
│ │ │ └── index.test.tsx
│ │ ├── collapse-context.ts
│ │ ├── collapse-group.tsx
│ │ ├── collapse-icon.tsx
│ │ ├── collapse.tsx
│ │ └── index.ts
│ ├── css-baseline/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── baseline.test.tsx.snap
│ │ │ └── baseline.test.tsx
│ │ ├── css-baseline.tsx
│ │ └── index.ts
│ ├── description/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── description.tsx
│ │ └── index.ts
│ ├── display/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── display.tsx
│ │ └── index.ts
│ ├── divider/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── divider.tsx
│ │ └── index.ts
│ ├── dot/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── dot.tsx
│ │ └── index.ts
│ ├── drawer/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── index.test.tsx
│ │ │ └── use-modal.test.tsx
│ │ ├── drawer-wrapper.tsx
│ │ ├── drawer.tsx
│ │ ├── helper.ts
│ │ └── index.ts
│ ├── fieldset/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── group.test.tsx
│ │ │ └── index.test.tsx
│ │ ├── fieldset-content.tsx
│ │ ├── fieldset-context.ts
│ │ ├── fieldset-footer.tsx
│ │ ├── fieldset-group.tsx
│ │ ├── fieldset-subtitle.tsx
│ │ ├── fieldset-title.tsx
│ │ ├── fieldset.tsx
│ │ └── index.ts
│ ├── geist-provider/
│ │ ├── geist-provider.tsx
│ │ ├── index.ts
│ │ └── theme-provider.tsx
│ ├── grid/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── basic-item.tsx
│ │ ├── grid-container.tsx
│ │ ├── grid-types.ts
│ │ ├── grid.tsx
│ │ └── index.ts
│ ├── image/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── browser.test.tsx.snap
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── browser.test.tsx
│ │ │ └── index.test.tsx
│ │ ├── helpers.ts
│ │ ├── image-browser-https-icon.tsx
│ │ ├── image-browser.tsx
│ │ ├── image.skeleton.tsx
│ │ ├── image.tsx
│ │ ├── index.ts
│ │ └── styles.ts
│ ├── index.ts
│ ├── input/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── index.test.tsx.snap
│ │ │ │ └── password.test.tsx.snap
│ │ │ ├── index.test.tsx
│ │ │ └── password.test.tsx
│ │ ├── index.ts
│ │ ├── input-block-label.tsx
│ │ ├── input-icon-clear.tsx
│ │ ├── input-icon.tsx
│ │ ├── input-label.tsx
│ │ ├── input-props.ts
│ │ ├── input.tsx
│ │ ├── password-icon.tsx
│ │ ├── password.tsx
│ │ └── styles.ts
│ ├── keyboard/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── keyboard.tsx
│ ├── link/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── icon.tsx
│ │ ├── index.ts
│ │ └── link.tsx
│ ├── loading/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── loading.tsx
│ ├── modal/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── modal-action.tsx
│ │ ├── modal-actions.tsx
│ │ ├── modal-content.tsx
│ │ ├── modal-context.ts
│ │ ├── modal-subtitle.tsx
│ │ ├── modal-title.tsx
│ │ ├── modal-wrapper.tsx
│ │ └── modal.tsx
│ ├── note/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── note.tsx
│ ├── page/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── child.test.tsx.snap
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── child.test.tsx
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── page-content.tsx
│ │ ├── page-footer.tsx
│ │ ├── page-header.tsx
│ │ └── page.tsx
│ ├── pagination/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── pagination.test.tsx.snap
│ │ │ └── pagination.test.tsx
│ │ ├── index.ts
│ │ ├── pagination-context.ts
│ │ ├── pagination-ellipsis.tsx
│ │ ├── pagination-item.tsx
│ │ ├── pagination-next.tsx
│ │ ├── pagination-pages.tsx
│ │ ├── pagination-previous.tsx
│ │ └── pagination.tsx
│ ├── popover/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── popover-context.ts
│ │ ├── popover-item.tsx
│ │ └── popover.tsx
│ ├── progress/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── progress.tsx
│ ├── radio/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── group.test.tsx.snap
│ │ │ │ └── index.test.tsx.snap
│ │ │ ├── group.test.tsx
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── radio-context.ts
│ │ ├── radio-description.tsx
│ │ ├── radio-group.tsx
│ │ ├── radio.tsx
│ │ └── styles.ts
│ ├── rating/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── rating-icon.tsx
│ │ └── rating.tsx
│ ├── row/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── row.tsx
│ ├── select/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── index.test.tsx.snap
│ │ │ │ └── multiple.test.tsx.snap
│ │ │ ├── events.test.tsx
│ │ │ ├── index.test.tsx
│ │ │ └── multiple.test.tsx
│ │ ├── index.ts
│ │ ├── select-context.ts
│ │ ├── select-dropdown.tsx
│ │ ├── select-icon-clear.tsx
│ │ ├── select-icon.tsx
│ │ ├── select-input.tsx
│ │ ├── select-multiple-value.tsx
│ │ ├── select-option.tsx
│ │ ├── select.tsx
│ │ └── styles.ts
│ ├── shared/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ ├── backdrop.test.tsx.snap
│ │ │ │ ├── dropdown.test.tsx.snap
│ │ │ │ ├── ellipsis.test.tsx.snap
│ │ │ │ └── transition.test.tsx.snap
│ │ │ ├── backdrop.test.tsx
│ │ │ ├── dropdown.test.tsx
│ │ │ ├── ellipsis.test.tsx
│ │ │ └── transition.test.tsx
│ │ ├── backdrop.tsx
│ │ ├── css-transition.tsx
│ │ ├── dropdown.tsx
│ │ ├── ellipsis.tsx
│ │ ├── expand.tsx
│ │ └── highlight.tsx
│ ├── slider/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── slider-dot.tsx
│ │ ├── slider-mark.tsx
│ │ ├── slider.tsx
│ │ └── styles.ts
│ ├── snippet/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── snippet-icon.tsx
│ │ ├── snippet.tsx
│ │ └── styles.ts
│ ├── spacer/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── spacer.tsx
│ ├── spinner/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── spinner.tsx
│ ├── table/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── table-body.tsx
│ │ ├── table-cell.tsx
│ │ ├── table-column.tsx
│ │ ├── table-context.ts
│ │ ├── table-head.tsx
│ │ ├── table-types.ts
│ │ └── table.tsx
│ ├── tabs/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── tabs-context.ts
│ │ ├── tabs-item.tsx
│ │ └── tabs.tsx
│ ├── tag/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── tag.tsx
│ ├── text/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── child.tsx
│ │ ├── index.ts
│ │ └── text.tsx
│ ├── textarea/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── textarea.tsx
│ ├── themes/
│ │ ├── index.ts
│ │ ├── presets/
│ │ │ ├── dark.ts
│ │ │ ├── default.ts
│ │ │ ├── index.ts
│ │ │ └── shared.ts
│ │ └── themes.ts
│ ├── toggle/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── styles.ts
│ │ └── toggle.tsx
│ ├── tooltip/
│ │ ├── __test__/
│ │ │ └── index.test.tsx
│ │ ├── helper.ts
│ │ ├── index.ts
│ │ ├── placement.ts
│ │ ├── styles.ts
│ │ ├── tooltip-content.tsx
│ │ ├── tooltip-icon.tsx
│ │ └── tooltip.tsx
│ ├── tree/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── tree-context.ts
│ │ ├── tree-file-icon.tsx
│ │ ├── tree-file.tsx
│ │ ├── tree-folder-icon.tsx
│ │ ├── tree-folder.tsx
│ │ ├── tree-help.ts
│ │ ├── tree-indents.tsx
│ │ ├── tree-status-icon.tsx
│ │ └── tree.tsx
│ ├── use-all-themes/
│ │ ├── all-themes-context.ts
│ │ └── index.ts
│ ├── use-body-scroll/
│ │ ├── __tests__/
│ │ │ └── body-scroll.test.tsx
│ │ ├── index.ts
│ │ └── use-body-scroll.ts
│ ├── use-classes/
│ │ ├── __tests__/
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ └── use-classes.ts
│ ├── use-click-away/
│ │ ├── __tests__/
│ │ │ └── click-away.test.tsx
│ │ ├── index.ts
│ │ └── use-click-away.ts
│ ├── use-clipboard/
│ │ ├── __tests__/
│ │ │ └── clipboard.test.tsx
│ │ ├── index.ts
│ │ └── use-clipboard.ts
│ ├── use-current-state/
│ │ ├── __tests__/
│ │ │ └── current-state.test.tsx
│ │ ├── index.ts
│ │ └── use-current-state.ts
│ ├── use-input/
│ │ ├── __tests__/
│ │ │ └── use-input.test.tsx
│ │ ├── index.ts
│ │ └── use-input.tsx
│ ├── use-keyboard/
│ │ ├── __tests__/
│ │ │ └── keyboard.test.tsx
│ │ ├── codes.ts
│ │ ├── helper.ts
│ │ ├── index.ts
│ │ └── use-keyboard.ts
│ ├── use-media-query/
│ │ ├── __tests__/
│ │ │ └── media-query.test.tsx
│ │ ├── index.ts
│ │ └── use-media-query.ts
│ ├── use-modal/
│ │ ├── __tests__/
│ │ │ └── use-modal.test.tsx
│ │ ├── index.ts
│ │ └── use-modal.ts
│ ├── use-scale/
│ │ ├── __tests__/
│ │ │ └── scale.test.tsx
│ │ ├── index.ts
│ │ ├── scale-context.ts
│ │ ├── utils.ts
│ │ └── with-scale.tsx
│ ├── use-tabs/
│ │ ├── __tests__/
│ │ │ └── use-tabs.test.tsx
│ │ ├── index.ts
│ │ └── use-tabs.ts
│ ├── use-theme/
│ │ ├── index.ts
│ │ └── theme-context.ts
│ ├── use-toasts/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── helpers.tsx
│ │ ├── index.ts
│ │ ├── toast-container.tsx
│ │ ├── toast-item.tsx
│ │ └── use-toast.tsx
│ ├── user/
│ │ ├── __tests__/
│ │ │ ├── __snapshots__/
│ │ │ │ └── index.test.tsx.snap
│ │ │ └── index.test.tsx
│ │ ├── index.ts
│ │ ├── user-link.tsx
│ │ └── user.tsx
│ └── utils/
│ ├── __tests__/
│ │ └── calculations.test.tsx
│ ├── calculations.ts
│ ├── collections.ts
│ ├── color.ts
│ ├── layouts.ts
│ ├── prop-types.ts
│ ├── types.ts
│ ├── use-body-scroll.ts
│ ├── use-click-anywhere.ts
│ ├── use-click-away.ts
│ ├── use-clipboard.ts
│ ├── use-context-state/
│ │ ├── create-geist-context.tsx
│ │ └── use-context-state.ts
│ ├── use-current-state.ts
│ ├── use-default-props.ts
│ ├── use-dom-observer.ts
│ ├── use-drag.ts
│ ├── use-geist-ui-context.ts
│ ├── use-portal.ts
│ ├── use-previous.ts
│ ├── use-real-shape.ts
│ ├── use-resize.ts
│ ├── use-ssr.ts
│ └── use-warning.ts
├── examples/
│ ├── create-next-app/
│ │ ├── .eslintrc.json
│ │ ├── README.md
│ │ ├── next-env.d.ts
│ │ ├── next.config.js
│ │ ├── package.json
│ │ ├── pages/
│ │ │ ├── _app.tsx
│ │ │ ├── _document.js
│ │ │ └── index.tsx
│ │ └── tsconfig.json
│ ├── create-react-app/
│ │ └── README.md
│ ├── custom-styles/
│ │ ├── README.md
│ │ ├── package.json
│ │ ├── public/
│ │ │ └── index.html
│ │ └── src/
│ │ ├── home.jsx
│ │ ├── index.jsx
│ │ └── style.css
│ ├── custom-themes/
│ │ ├── README.md
│ │ ├── package.json
│ │ ├── public/
│ │ │ └── index.html
│ │ └── src/
│ │ ├── home.jsx
│ │ ├── index.jsx
│ │ └── theme.js
│ ├── extends-components/
│ │ ├── README.md
│ │ ├── package.json
│ │ ├── public/
│ │ │ └── index.html
│ │ ├── src/
│ │ │ ├── app.tsx
│ │ │ ├── index.tsx
│ │ │ ├── my-input.tsx
│ │ │ └── react-app-env.d.ts
│ │ └── tsconfig.json
│ ├── remix/
│ │ ├── README.md
│ │ ├── api/
│ │ │ └── index.js
│ │ ├── app/
│ │ │ ├── entry.client.tsx
│ │ │ ├── entry.server.tsx
│ │ │ ├── root.tsx
│ │ │ └── routes/
│ │ │ └── index.tsx
│ │ ├── package.json
│ │ ├── remix.config.js
│ │ ├── remix.env.d.ts
│ │ ├── tsconfig.json
│ │ └── vercel.json
│ ├── tree-shaking-create-react-app/
│ │ ├── README.md
│ │ ├── build/
│ │ │ ├── asset-manifest.json
│ │ │ ├── index.html
│ │ │ └── static/
│ │ │ └── js/
│ │ │ ├── main.c0df7028.js
│ │ │ └── main.c0df7028.js.LICENSE.txt
│ │ ├── package.json
│ │ ├── public/
│ │ │ └── index.html
│ │ └── src/
│ │ ├── home.jsx
│ │ └── index.jsx
│ ├── tree-shaking-nextjs/
│ │ ├── README.md
│ │ ├── next.config.js
│ │ ├── package.json
│ │ └── pages/
│ │ ├── _app.js
│ │ ├── _document.js
│ │ └── index.js
│ ├── tree-shaking-webpack/
│ │ ├── .babelrc
│ │ ├── README.md
│ │ ├── package.json
│ │ ├── src/
│ │ │ ├── index.html
│ │ │ └── index.js
│ │ └── webpack.config.js
│ └── with-typescript/
│ └── README.md
├── lib/
│ ├── components/
│ │ ├── attributes/
│ │ │ ├── attributes-table.tsx
│ │ │ ├── attributes-title.tsx
│ │ │ ├── attributes.tsx
│ │ │ ├── contributors.tsx
│ │ │ └── index.ts
│ │ ├── customization/
│ │ │ ├── codes.tsx
│ │ │ ├── colors.tsx
│ │ │ ├── demo.tsx
│ │ │ ├── editor-color-item.tsx
│ │ │ ├── editor-input-item.tsx
│ │ │ ├── editor.tsx
│ │ │ └── layout.tsx
│ │ ├── index.ts
│ │ ├── layout/
│ │ │ ├── header.tsx
│ │ │ ├── index.tsx
│ │ │ ├── layout.tsx
│ │ │ ├── menu/
│ │ │ │ ├── index.tsx
│ │ │ │ ├── menu-mobile.tsx
│ │ │ │ ├── menu-skeleton.tsx
│ │ │ │ └── menu.tsx
│ │ │ ├── powered-by/
│ │ │ │ ├── index.ts
│ │ │ │ └── powered-by.tsx
│ │ │ └── sidebar/
│ │ │ ├── active-catalog.tsx
│ │ │ ├── active-link.tsx
│ │ │ ├── index.tsx
│ │ │ ├── side-item.tsx
│ │ │ ├── sidebar-skeleton.tsx
│ │ │ └── sidebar.tsx
│ │ ├── mdx-widgets/
│ │ │ ├── README.md
│ │ │ ├── colors/
│ │ │ │ ├── colors-data.ts
│ │ │ │ └── index.tsx
│ │ │ ├── example-block.tsx
│ │ │ ├── grid-demo.tsx
│ │ │ ├── home-cell.tsx
│ │ │ ├── hybrid-code.tsx
│ │ │ ├── hybrid-link.tsx
│ │ │ ├── icons-gallery/
│ │ │ │ ├── icons-cell.tsx
│ │ │ │ ├── icons-gallery.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── index.ts
│ │ │ ├── mock-page.tsx
│ │ │ └── parsed-codes/
│ │ │ ├── clock.tsx
│ │ │ ├── greeting.tsx
│ │ │ ├── index.ts
│ │ │ └── types.tsx
│ │ ├── playground/
│ │ │ ├── code-theme.ts
│ │ │ ├── dynamic-live.tsx
│ │ │ ├── editor.tsx
│ │ │ ├── index.ts
│ │ │ ├── playground.tsx
│ │ │ └── title.tsx
│ │ ├── pures/
│ │ │ ├── anchor/
│ │ │ │ ├── anchor-icon.tsx
│ │ │ │ └── index.tsx
│ │ │ ├── controls.tsx
│ │ │ └── index.ts
│ │ └── search/
│ │ ├── helper.ts
│ │ ├── index.tsx
│ │ ├── search-icon.tsx
│ │ ├── search-item.tsx
│ │ ├── search-items.tsx
│ │ └── search.tsx
│ ├── config-context.ts
│ ├── config-provider.tsx
│ ├── constants.ts
│ ├── data/
│ │ ├── index.ts
│ │ ├── metadata-en-us.json
│ │ ├── metadata-zh-cn.json
│ │ ├── seeds-en-us.json
│ │ ├── seeds-zh-cn.json
│ │ └── seeds.ts
│ ├── redirect.tsx
│ ├── use-dom-clean.ts
│ └── use-locale.ts
├── next-env.d.ts
├── next.config.js
├── now.json
├── package.json
├── pages/
│ ├── _app.tsx
│ ├── _document.tsx
│ ├── en-us/
│ │ ├── components/
│ │ │ ├── auto-complete.mdx
│ │ │ ├── avatar.mdx
│ │ │ ├── badge.mdx
│ │ │ ├── breadcrumbs.mdx
│ │ │ ├── button-dropdown.mdx
│ │ │ ├── button-group.mdx
│ │ │ ├── button.mdx
│ │ │ ├── capacity.mdx
│ │ │ ├── card.mdx
│ │ │ ├── checkbox.mdx
│ │ │ ├── code.mdx
│ │ │ ├── collapse.mdx
│ │ │ ├── description.mdx
│ │ │ ├── display.mdx
│ │ │ ├── divider.mdx
│ │ │ ├── dot.mdx
│ │ │ ├── drawer.mdx
│ │ │ ├── fieldset.mdx
│ │ │ ├── file-tree.mdx
│ │ │ ├── grid.mdx
│ │ │ ├── icons.mdx
│ │ │ ├── image.mdx
│ │ │ ├── index.js
│ │ │ ├── input.mdx
│ │ │ ├── keyboard.mdx
│ │ │ ├── link.mdx
│ │ │ ├── loading.mdx
│ │ │ ├── modal.mdx
│ │ │ ├── note.mdx
│ │ │ ├── page.mdx
│ │ │ ├── pagination.mdx
│ │ │ ├── popover.mdx
│ │ │ ├── progress.mdx
│ │ │ ├── radio.mdx
│ │ │ ├── rating.mdx
│ │ │ ├── select.mdx
│ │ │ ├── slider.mdx
│ │ │ ├── snippet.mdx
│ │ │ ├── spacer.mdx
│ │ │ ├── spinner.mdx
│ │ │ ├── table.mdx
│ │ │ ├── tabs.mdx
│ │ │ ├── tag.mdx
│ │ │ ├── text.mdx
│ │ │ ├── textarea.mdx
│ │ │ ├── toast.mdx
│ │ │ ├── toggle.mdx
│ │ │ ├── tooltip.mdx
│ │ │ └── user.mdx
│ │ ├── guide/
│ │ │ ├── bundle-size.mdx
│ │ │ ├── colors.mdx
│ │ │ ├── index.js
│ │ │ ├── installation.mdx
│ │ │ ├── introduction.mdx
│ │ │ ├── scale.mdx
│ │ │ ├── server-render.mdx
│ │ │ └── themes.mdx
│ │ ├── hooks/
│ │ │ ├── index.js
│ │ │ ├── use-body-scroll.mdx
│ │ │ ├── use-classes.mdx
│ │ │ ├── use-click-away.mdx
│ │ │ ├── use-clipboard.mdx
│ │ │ ├── use-current-state.mdx
│ │ │ ├── use-input.mdx
│ │ │ ├── use-keyboard.mdx
│ │ │ ├── use-media-query.mdx
│ │ │ ├── use-modal.mdx
│ │ │ ├── use-scale.mdx
│ │ │ ├── use-tabs.mdx
│ │ │ ├── use-theme.mdx
│ │ │ └── use-toast.mdx
│ │ └── index.tsx
│ └── zh-cn/
│ ├── components/
│ │ ├── auto-complete.mdx
│ │ ├── avatar.mdx
│ │ ├── badge.mdx
│ │ ├── breadcrumbs.mdx
│ │ ├── button-dropdown.mdx
│ │ ├── button-group.mdx
│ │ ├── button.mdx
│ │ ├── capacity.mdx
│ │ ├── card.mdx
│ │ ├── checkbox.mdx
│ │ ├── code.mdx
│ │ ├── collapse.mdx
│ │ ├── description.mdx
│ │ ├── display.mdx
│ │ ├── divider.mdx
│ │ ├── dot.mdx
│ │ ├── drawer.mdx
│ │ ├── fieldset.mdx
│ │ ├── file-tree.mdx
│ │ ├── grid.mdx
│ │ ├── icons.mdx
│ │ ├── image.mdx
│ │ ├── index.js
│ │ ├── input.mdx
│ │ ├── keyboard.mdx
│ │ ├── link.mdx
│ │ ├── loading.mdx
│ │ ├── modal.mdx
│ │ ├── note.mdx
│ │ ├── page.mdx
│ │ ├── pagination.mdx
│ │ ├── popover.mdx
│ │ ├── progress.mdx
│ │ ├── radio.mdx
│ │ ├── rating.mdx
│ │ ├── select.mdx
│ │ ├── slider.mdx
│ │ ├── snippet.mdx
│ │ ├── spacer.mdx
│ │ ├── spinner.mdx
│ │ ├── table.mdx
│ │ ├── tabs.mdx
│ │ ├── tag.mdx
│ │ ├── text.mdx
│ │ ├── textarea.mdx
│ │ ├── toast.mdx
│ │ ├── toggle.mdx
│ │ ├── tooltip.mdx
│ │ └── user.mdx
│ ├── guide/
│ │ ├── bundle-size.mdx
│ │ ├── colors.mdx
│ │ ├── index.js
│ │ ├── installation.mdx
│ │ ├── introduction.mdx
│ │ ├── scale.mdx
│ │ ├── server-render.mdx
│ │ └── themes.mdx
│ ├── hooks/
│ │ ├── index.js
│ │ ├── use-body-scroll.mdx
│ │ ├── use-classes.mdx
│ │ ├── use-click-away.mdx
│ │ ├── use-clipboard.mdx
│ │ ├── use-current-state.mdx
│ │ ├── use-input.mdx
│ │ ├── use-keyboard.mdx
│ │ ├── use-media-query.mdx
│ │ ├── use-modal.mdx
│ │ ├── use-scale.mdx
│ │ ├── use-tabs.mdx
│ │ ├── use-theme.mdx
│ │ └── use-toast.mdx
│ └── index.tsx
├── public/
│ └── _redirects
├── scripts/
│ ├── babel.config.js
│ ├── built-in/
│ │ ├── styled-jsx-server.es.js
│ │ ├── styled-jsx.cjs.js
│ │ └── styled-jsx.es.js
│ ├── collect-meta.js
│ ├── locales.js
│ ├── move-built-in.js
│ ├── rollup.config.js
│ ├── seeds/
│ │ ├── codesandbox.json
│ │ ├── links.json
│ │ ├── presets.js
│ │ └── update.js
│ ├── side-effects.js
│ ├── tsconfig.json
│ ├── tsconfig.test.json
│ └── webpack.config.js
├── tests/
│ ├── .babelrc.js
│ ├── __mocks__/
│ │ └── styled-jsx/
│ │ └── css.js
│ ├── setup.ts
│ └── utils.ts
├── tsconfig.json
└── typings/
├── mdx.d.ts
├── meta.d.ts
└── styled.d.ts
SYMBOL INDEX (963 symbols across 270 files)
FILE: components/auto-complete/auto-complete-context.ts
type AutoCompleteConfig (line 3) | interface AutoCompleteConfig {
FILE: components/auto-complete/auto-complete-dropdown.tsx
type Props (line 7) | interface Props {
type NativeAttrs (line 20) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type AutoCompleteDropdownProps (line 21) | type AutoCompleteDropdownProps = Props & NativeAttrs
FILE: components/auto-complete/auto-complete-empty.tsx
type Props (line 4) | interface Props {
type AutoCompleteEmptyProps (line 14) | type AutoCompleteEmptyProps = Props & React.HTMLAttributes<any>
FILE: components/auto-complete/auto-complete-item.tsx
type Props (line 8) | interface Props {
type AutoCompleteItemProps (line 17) | type AutoCompleteItemProps = Props & React.HTMLAttributes<any>
FILE: components/auto-complete/auto-complete-searching.tsx
type Props (line 5) | interface Props {
type AutoCompleteSearchProps (line 13) | type AutoCompleteSearchProps = Props & React.HTMLAttributes<any>
FILE: components/auto-complete/auto-complete.tsx
type AutoCompleteTypes (line 21) | type AutoCompleteTypes = NormalTypes
type AutoCompleteOption (line 23) | type AutoCompleteOption = {
type AutoCompleteOptions (line 28) | type AutoCompleteOptions = Array<
type Props (line 32) | interface Props {
type NativeAttrs (line 61) | type NativeAttrs = Omit<React.InputHTMLAttributes<any>, keyof Props>
type AutoCompleteProps (line 62) | type AutoCompleteProps = Props & NativeAttrs
FILE: components/auto-complete/index.ts
type AutoCompleteComponentType (line 6) | type AutoCompleteComponentType = typeof AutoComplete & {
FILE: components/avatar/avatar-group.tsx
type Props (line 6) | interface Props {
type NativeAttrs (line 15) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type AvatarGroupProps (line 16) | type AvatarGroupProps = Props & NativeAttrs
FILE: components/avatar/avatar.tsx
type Props (line 6) | interface Props {
type NativeAttrs (line 21) | type NativeAttrs = Omit<
type AvatarProps (line 25) | type AvatarProps = Props & NativeAttrs
FILE: components/avatar/index.ts
type AvatarComponentType (line 4) | type AvatarComponentType = typeof Avatar & {
FILE: components/badge/badge-anchor.tsx
type BadgeAnchorPlacement (line 8) | type BadgeAnchorPlacement = typeof placement[number]
type Props (line 10) | interface Props {
type NativeAttrs (line 20) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type BadgeAnchorProps (line 21) | type BadgeAnchorProps = Props & NativeAttrs
type TransformStyles (line 23) | type TransformStyles = {
FILE: components/badge/badge.tsx
type BadgeTypes (line 8) | type BadgeTypes = NormalTypes
type Props (line 10) | interface Props {
type NativeAttrs (line 22) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type BadgeProps (line 23) | type BadgeProps = Props & NativeAttrs
FILE: components/badge/index.ts
type BadgeComponentType (line 4) | type BadgeComponentType = typeof Badge & {
FILE: components/breadcrumbs/breadcrumbs-item.tsx
type Props (line 8) | interface Props {
type NativeAttrs (line 20) | type NativeAttrs = Omit<React.AnchorHTMLAttributes<any>, keyof Props>
type NativeLinkAttrs (line 21) | type NativeLinkAttrs = Omit<NativeAttrs, keyof LinkBasicProps>
type BreadcrumbsItemProps (line 22) | type BreadcrumbsItemProps = Props & NativeLinkAttrs
FILE: components/breadcrumbs/breadcrumbs-separator.tsx
type Props (line 5) | interface Props {
type NativeAttrs (line 13) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type BreadcrumbsSeparatorProps (line 14) | type BreadcrumbsSeparatorProps = Props & NativeAttrs
FILE: components/breadcrumbs/breadcrumbs.tsx
type Props (line 7) | interface Props {
type NativeAttrs (line 17) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type BreadcrumbsProps (line 18) | type BreadcrumbsProps = Props & NativeAttrs
FILE: components/breadcrumbs/index.ts
type BreadcrumbsComponentType (line 5) | type BreadcrumbsComponentType = typeof Breadcrumbs & {
FILE: components/button-dropdown/button-dropdown-context.ts
type ButtonDropdownConfig (line 4) | interface ButtonDropdownConfig {
FILE: components/button-dropdown/button-dropdown-item.tsx
type ButtonDropdownItemTypes (line 8) | type ButtonDropdownItemTypes = NormalTypes
type Props (line 10) | interface Props {
type NativeAttrs (line 24) | type NativeAttrs = Omit<React.ButtonHTMLAttributes<any>, keyof Props>
type ButtonDropdownItemProps (line 25) | type ButtonDropdownItemProps = Props & NativeAttrs
FILE: components/button-dropdown/button-dropdown.tsx
type ButtonDropdownTypes (line 13) | type ButtonDropdownTypes = NormalTypes
type Props (line 15) | interface Props {
type NativeAttrs (line 32) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type ButtonDropdownProps (line 33) | type ButtonDropdownProps = Props & NativeAttrs
FILE: components/button-dropdown/icon.tsx
type Props (line 3) | interface Props {
FILE: components/button-dropdown/index.ts
type ButtonDropdownType (line 4) | type ButtonDropdownType = typeof ButtonDropdown & {
FILE: components/button-dropdown/styles.ts
type ButtonDropdownColors (line 4) | type ButtonDropdownColors = {
FILE: components/button-group/button-group-context.ts
type ButtonGroupConfig (line 4) | interface ButtonGroupConfig {
FILE: components/button-group/button-group.tsx
type Props (line 9) | interface Props {
type NativeAttrs (line 25) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type ButtonGroupProps (line 26) | type ButtonGroupProps = Props & NativeAttrs
FILE: components/button/button-icon.tsx
type Props (line 4) | interface Props {
type NativeAttrs (line 15) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type ButtonIconProps (line 16) | type ButtonIconProps = Props & NativeAttrs
FILE: components/button/button-loading.tsx
type Props (line 4) | interface Props {
FILE: components/button/button.drip.tsx
type Props (line 3) | interface Props {
type ButtonDrip (line 15) | type ButtonDrip = Props
FILE: components/button/button.tsx
type Props (line 17) | interface Props {
type NativeAttrs (line 44) | type NativeAttrs = Omit<React.ButtonHTMLAttributes<any>, keyof Props>
type ButtonProps (line 45) | type ButtonProps = Props & NativeAttrs
FILE: components/button/styles.ts
type ButtonColorGroup (line 6) | interface ButtonColorGroup {
type ButtonCursorGroup (line 205) | interface ButtonCursorGroup {
FILE: components/capacity/capacity.tsx
type Props (line 8) | interface Props {
type NativeAttrs (line 22) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type CapacityProps (line 23) | type CapacityProps = Props & NativeAttrs
FILE: components/card/card-content.tsx
type Props (line 5) | interface Props {
type NativeAttrs (line 13) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type CardContentProps (line 14) | type CardContentProps = Props & NativeAttrs
FILE: components/card/card-footer.tsx
type Props (line 6) | interface Props {
type NativeAttrs (line 16) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type CardFooterProps (line 17) | type CardFooterProps = Props & NativeAttrs
FILE: components/card/card.tsx
type Props (line 12) | interface Props {
type NativeAttrs (line 26) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type CardProps (line 27) | type CardProps = Props & NativeAttrs
FILE: components/card/index.ts
type CardComponentType (line 5) | type CardComponentType = typeof Card & {
FILE: components/card/styles.ts
type CardStyles (line 4) | type CardStyles = {
FILE: components/checkbox/checkbox-context.ts
type CheckboxConfig (line 3) | interface CheckboxConfig {
FILE: components/checkbox/checkbox-group.tsx
type Props (line 7) | interface Props {
type NativeAttrs (line 19) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type CheckboxGroupProps (line 20) | type CheckboxGroupProps = Props & NativeAttrs
FILE: components/checkbox/checkbox.icon.tsx
type Props (line 4) | interface Props {
FILE: components/checkbox/checkbox.tsx
type CheckboxTypes (line 11) | type CheckboxTypes = NormalTypes
type CheckboxEventTarget (line 12) | interface CheckboxEventTarget {
type CheckboxEvent (line 15) | interface CheckboxEvent {
type Props (line 22) | interface Props {
type NativeAttrs (line 40) | type NativeAttrs = Omit<React.InputHTMLAttributes<any>, keyof Props>
type CheckboxProps (line 41) | type CheckboxProps = Props & NativeAttrs
FILE: components/checkbox/index.ts
type CheckboxComponentType (line 4) | type CheckboxComponentType = typeof Checkbox & {
FILE: components/checkbox/styles.ts
type CheckboxColor (line 4) | type CheckboxColor = {
FILE: components/code/code.tsx
type Props (line 6) | interface Props {
type NativeAttrs (line 20) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type CodeProps (line 21) | type CodeProps = Props & NativeAttrs
FILE: components/col/col.tsx
type Props (line 3) | interface Props {
type NativeAttrs (line 17) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type ColProps (line 18) | type ColProps = Props & NativeAttrs
FILE: components/collapse/collapse-context.ts
type CollapseConfig (line 3) | interface CollapseConfig {
FILE: components/collapse/collapse-group.tsx
type Props (line 9) | interface Props {
type NativeAttrs (line 19) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type CollapseGroupProps (line 20) | type CollapseGroupProps = Props & NativeAttrs
FILE: components/collapse/collapse-icon.tsx
type Props (line 3) | interface Props {
FILE: components/collapse/collapse.tsx
type Props (line 11) | interface Props {
type NativeAttrs (line 26) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type CollapseProps (line 27) | type CollapseProps = Props & NativeAttrs
FILE: components/collapse/index.ts
type CollapseComponentType (line 4) | type CollapseComponentType = typeof Collapse & {
FILE: components/css-baseline/css-baseline.tsx
type FlushToReact (line 5) | type FlushToReact = <T>(opts?: { nonce?: string }) => Array<ReactElement...
type FlushToHTML (line 6) | type FlushToHTML = (opts?: { nonce?: string }) => string
type MemoCssBaselineComponent (line 307) | type MemoCssBaselineComponent<P = {}> = React.NamedExoticComponent<P> & {
FILE: components/description/description.tsx
type Props (line 6) | interface Props {
type NativeAttrs (line 18) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type DescriptionProps (line 19) | type DescriptionProps = Props & NativeAttrs
FILE: components/display/display.tsx
type Props (line 6) | interface Props {
type NativeAttrs (line 18) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type DisplayProps (line 19) | type DisplayProps = Props & NativeAttrs
FILE: components/divider/divider.tsx
type DividerTypes (line 8) | type DividerTypes = SnippetTypes
type Props (line 10) | interface Props {
type NativeAttrs (line 22) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type DividerProps (line 23) | type DividerProps = Props & NativeAttrs
FILE: components/dot/dot.tsx
type DotTypes (line 8) | type DotTypes = NormalTypes
type Props (line 9) | interface Props {
type NativeAttrs (line 19) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type DotProps (line 20) | type DotProps = Props & NativeAttrs
FILE: components/drawer/drawer-wrapper.tsx
type Props (line 9) | interface Props {
type DrawerWrapperProps (line 20) | type DrawerWrapperProps = Props
FILE: components/drawer/drawer.tsx
type Props (line 11) | interface Props {
type NativeAttrs (line 28) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type DrawerProps (line 29) | type DrawerProps = Props & NativeAttrs
FILE: components/drawer/helper.ts
type DrawerPlacement (line 4) | type DrawerPlacement = typeof drawerPlacement[number]
type DrawerTranslateItem (line 6) | type DrawerTranslateItem = {
FILE: components/drawer/index.ts
type DrawerComponentType (line 6) | type DrawerComponentType = typeof Drawer & {
FILE: components/fieldset/fieldset-content.tsx
type Props (line 5) | interface Props {
type NativeAttrs (line 13) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type FieldsetContentProps (line 14) | type FieldsetContentProps = Props & NativeAttrs
FILE: components/fieldset/fieldset-context.ts
type FieldItem (line 3) | interface FieldItem {
type FieldsetConfig (line 8) | interface FieldsetConfig {
FILE: components/fieldset/fieldset-footer.tsx
type Props (line 5) | interface Props {
type NativeAttrs (line 13) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type FieldsetFooterProps (line 14) | type FieldsetFooterProps = Props & NativeAttrs
FILE: components/fieldset/fieldset-group.tsx
type Props (line 9) | interface Props {
type NativeAttrs (line 19) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type FieldsetGroupProps (line 20) | type FieldsetGroupProps = Props & NativeAttrs
FILE: components/fieldset/fieldset-subtitle.tsx
type Props (line 3) | interface Props {
type NativeAttrs (line 11) | type NativeAttrs = Omit<React.HTMLAttributes<HTMLDivElement>, keyof Props>
type FieldsetSubtitleProps (line 12) | type FieldsetSubtitleProps = Props & NativeAttrs
FILE: components/fieldset/fieldset-title.tsx
type Props (line 4) | interface Props {
type NativeAttrs (line 12) | type NativeAttrs = Omit<React.HTMLAttributes<HTMLDivElement>, keyof Props>
type FieldsetTitleProps (line 13) | type FieldsetTitleProps = Props & NativeAttrs
FILE: components/fieldset/fieldset.tsx
type Props (line 13) | interface Props {
type NativeAttrs (line 30) | type NativeAttrs = Omit<React.FieldsetHTMLAttributes<any>, keyof Props>
type FieldsetProps (line 31) | type FieldsetProps = Props & NativeAttrs
FILE: components/fieldset/index.ts
type FieldsetComponentType (line 8) | type FieldsetComponentType = typeof Fieldset & {
FILE: components/geist-provider/geist-provider.tsx
type GeistProviderProps (line 15) | type GeistProviderProps = {
FILE: components/geist-provider/theme-provider.tsx
type Props (line 7) | interface Props {
FILE: components/grid/basic-item.tsx
type GridBreakpointsValue (line 12) | type GridBreakpointsValue = number | boolean
type GridBasicComponentProps (line 13) | interface GridBasicComponentProps {
type NativeAttrs (line 35) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof GridBasicCompon...
type GridBasicItemProps (line 36) | type GridBasicItemProps = GridBasicComponentProps & NativeAttrs
type ItemLayoutValue (line 38) | type ItemLayoutValue = {
FILE: components/grid/grid-container.tsx
type Props (line 8) | interface Props {
type GridContainerProps (line 20) | type GridContainerProps = Props & GridBasicItemProps
FILE: components/grid/grid-types.ts
type GridJustify (line 12) | type GridJustify = typeof justify[number]
type GridAlignItems (line 16) | type GridAlignItems = typeof alignItems[number]
type GridAlignContent (line 27) | type GridAlignContent = typeof alignContent[number]
type GridDirection (line 31) | type GridDirection = typeof direction[number]
type GridWrap (line 35) | type GridWrap = typeof wrap[number]
FILE: components/grid/grid.tsx
type Props (line 7) | interface Props {
type GridProps (line 15) | type GridProps = Props & GridBasicItemProps
FILE: components/grid/index.ts
type GridComponentType (line 4) | type GridComponentType = typeof Grid & {
FILE: components/image/__tests__/index.test.tsx
method get (line 77) | get() {
FILE: components/image/image-browser.tsx
type ImageAnchorProps (line 11) | type ImageAnchorProps = Omit<React.AnchorHTMLAttributes<any>, keyof Link...
type Props (line 13) | interface Props {
type NativeAttrs (line 29) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type ImageBrowserProps (line 30) | type ImageBrowserProps = Props & NativeAttrs
FILE: components/image/image.skeleton.tsx
type Props (line 4) | interface Props {
type ImageSkeletonProps (line 12) | type ImageSkeletonProps = Props
FILE: components/image/image.tsx
type Props (line 8) | interface Props {
type NativeAttrs (line 21) | type NativeAttrs = Omit<React.ImgHTMLAttributes<any>, keyof Props>
type ImageProps (line 22) | type ImageProps = Props & NativeAttrs
FILE: components/image/index.ts
type ImageComponentType (line 4) | type ImageComponentType = typeof Image & {
FILE: components/image/styles.ts
type BrowserColors (line 3) | type BrowserColors = {
FILE: components/input/index.ts
type InputComponentType (line 5) | type InputComponentType = typeof Input & {
FILE: components/input/input-block-label.tsx
type InputBlockLabelLabel (line 4) | interface InputBlockLabelLabel {}
FILE: components/input/input-icon-clear.tsx
type Props (line 5) | interface Props {
FILE: components/input/input-icon.tsx
type InputIconProps (line 3) | interface InputIconProps {
FILE: components/input/input-label.tsx
type InputLabel (line 4) | interface InputLabel {
FILE: components/input/input-props.ts
type InputTypes (line 4) | type InputTypes = NormalTypes
type Props (line 5) | interface Props {
FILE: components/input/input.tsx
type NativeAttrs (line 12) | type NativeAttrs = Omit<React.InputHTMLAttributes<any>, keyof Props>
type InputProps (line 13) | type InputProps = Props & NativeAttrs
FILE: components/input/password-icon.tsx
type Props (line 3) | interface Props {
FILE: components/input/password.tsx
type PasswordProps (line 7) | interface PasswordProps extends Props {
type NativeAttrs (line 16) | type NativeAttrs = Omit<React.InputHTMLAttributes<any>, keyof PasswordPr...
type InputPasswordProps (line 17) | type InputPasswordProps = PasswordProps & NativeAttrs
FILE: components/input/styles.ts
type InputColor (line 4) | type InputColor = {
FILE: components/keyboard/keyboard.tsx
type Props (line 5) | interface Props {
type NativeAttrs (line 21) | type NativeAttrs = Omit<React.KeygenHTMLAttributes<any>, keyof Props>
type KeyboardProps (line 22) | type KeyboardProps = Props & NativeAttrs
FILE: components/link/link.tsx
type Props (line 8) | interface Props {
type NativeAttrs (line 26) | type NativeAttrs = Omit<React.AnchorHTMLAttributes<any>, keyof Props>
type LinkProps (line 27) | type LinkProps = Props & NativeAttrs
FILE: components/loading/loading.tsx
type LoadingTypes (line 8) | type LoadingTypes = NormalTypes
type Props (line 9) | interface Props {
type NativeAttrs (line 22) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type LoadingProps (line 23) | type LoadingProps = Props & NativeAttrs
FILE: components/modal/index.ts
type ModalComponentType (line 7) | type ModalComponentType = typeof Modal & {
FILE: components/modal/modal-action.tsx
type ModalActionEvent (line 9) | type ModalActionEvent = MouseEvent<HTMLButtonElement> & {
type Props (line 13) | interface Props {
type ModalActionProps (line 26) | type ModalActionProps = Props & Omit<ButtonProps, keyof Props>
FILE: components/modal/modal-content.tsx
type Props (line 5) | interface Props {
type NativeAttrs (line 13) | type NativeAttrs = Omit<React.HTMLAttributes<HTMLElement>, keyof Props>
type ModalContentProps (line 14) | type ModalContentProps = Props & NativeAttrs
FILE: components/modal/modal-context.ts
type ModalConfig (line 3) | interface ModalConfig {
FILE: components/modal/modal-subtitle.tsx
type Props (line 5) | interface Props {
type NativeAttrs (line 13) | type NativeAttrs = Omit<React.HTMLAttributes<HTMLHeadingElement>, keyof ...
type ModalSubtitleProps (line 14) | type ModalSubtitleProps = Props & NativeAttrs
FILE: components/modal/modal-title.tsx
type Props (line 5) | interface Props {
type NativeAttrs (line 13) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type ModalTitleProps (line 14) | type ModalTitleProps = Props & NativeAttrs
FILE: components/modal/modal-wrapper.tsx
type Props (line 8) | interface Props {
type ModalWrapperProps (line 18) | type ModalWrapperProps = Props
FILE: components/modal/modal.tsx
type Props (line 14) | interface Props {
type NativeAttrs (line 35) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type ModalProps (line 36) | type ModalProps = Props & NativeAttrs
FILE: components/note/note.tsx
type NoteTypes (line 8) | type NoteTypes = NormalTypes
type Props (line 9) | interface Props {
type NativeAttrs (line 23) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type NoteProps (line 24) | type NoteProps = Props & NativeAttrs
FILE: components/page/index.ts
type PageComponentType (line 6) | type PageComponentType = typeof Page & {
FILE: components/page/page-content.tsx
type Props (line 4) | interface Props {
type NativeAttrs (line 12) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type PageContentProps (line 13) | type PageContentProps = Props & NativeAttrs
FILE: components/page/page-footer.tsx
type Props (line 4) | interface Props {
type NativeAttrs (line 12) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type PageFooterProps (line 13) | type PageFooterProps = Props & NativeAttrs
FILE: components/page/page-header.tsx
type Props (line 5) | interface Props {
type NativeAttrs (line 15) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type PageHeaderProps (line 16) | type PageHeaderProps = Props & NativeAttrs
FILE: components/page/page.tsx
type PageRenderMode (line 10) | type PageRenderMode = typeof renderMode[number]
type Props (line 12) | interface Props {
type DotStylesProps (line 26) | type DotStylesProps = {
type NativeAttrs (line 54) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type PageProps (line 55) | type PageProps = Props & NativeAttrs
FILE: components/pagination/index.ts
type PaginationComponentType (line 5) | type PaginationComponentType = typeof Pagination & {
FILE: components/pagination/pagination-context.ts
type PaginationUpdateType (line 5) | type PaginationUpdateType = typeof paginationUpdateTypes[number]
type PaginationConfig (line 7) | interface PaginationConfig {
FILE: components/pagination/pagination-ellipsis.tsx
type Props (line 4) | interface Props {
FILE: components/pagination/pagination-item.tsx
type Props (line 6) | interface Props {
type NativeAttrs (line 12) | type NativeAttrs = Omit<React.ButtonHTMLAttributes<any>, keyof Props>
type PaginationItemProps (line 13) | type PaginationItemProps = Props & NativeAttrs
FILE: components/pagination/pagination-next.tsx
type PaginationNextProps (line 5) | type PaginationNextProps = React.ButtonHTMLAttributes<any>
FILE: components/pagination/pagination-pages.tsx
type Props (line 5) | interface Props {
FILE: components/pagination/pagination-previous.tsx
type PaginationPreviousProps (line 5) | type PaginationPreviousProps = React.ButtonHTMLAttributes<any>
FILE: components/pagination/pagination.tsx
type Props (line 14) | interface Props {
type NativeAttrs (line 30) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type PaginationProps (line 31) | type PaginationProps = Props & NativeAttrs
FILE: components/popover/index.ts
type PopoverComponentType (line 4) | type PopoverComponentType = typeof Popover & {
FILE: components/popover/popover-context.ts
type PopoverConfig (line 3) | type PopoverConfig = {
FILE: components/popover/popover-item.tsx
type Props (line 7) | interface Props {
type NativeAttrs (line 21) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type PopoverItemProps (line 22) | type PopoverItemProps = Props & NativeAttrs
FILE: components/popover/popover.tsx
type PopoverTriggerTypes (line 13) | type PopoverTriggerTypes = TriggerTypes
type PopoverPlacement (line 14) | type PopoverPlacement = Placement
type Props (line 15) | interface Props {
type ExcludeTooltipProps (line 37) | type ExcludeTooltipProps = {
type PopoverProps (line 44) | type PopoverProps = Props & Omit<TooltipProps, keyof ExcludeTooltipProps>
FILE: components/progress/progress.tsx
type ProgressColors (line 9) | type ProgressColors = {
type ProgressTypes (line 12) | type ProgressTypes = NormalTypes
type Props (line 14) | interface Props {
type NativeAttrs (line 33) | type NativeAttrs = Omit<React.ProgressHTMLAttributes<any>, keyof Props>
type ProgressProps (line 34) | type ProgressProps = Props & NativeAttrs
FILE: components/radio/index.ts
type RadioComponentType (line 5) | type RadioComponentType = typeof Radio & {
FILE: components/radio/radio-context.ts
type RadioConfig (line 3) | interface RadioConfig {
FILE: components/radio/radio-description.tsx
type Props (line 5) | interface Props {
type NativeAttrs (line 13) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type RadioDescriptionProps (line 14) | type RadioDescriptionProps = Props & NativeAttrs
FILE: components/radio/radio-group.tsx
type Props (line 6) | interface Props {
type NativeAttrs (line 21) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type RadioGroupProps (line 22) | type RadioGroupProps = Props & NativeAttrs
FILE: components/radio/radio.tsx
type RadioTypes (line 12) | type RadioTypes = NormalTypes
type RadioEventTarget (line 13) | interface RadioEventTarget {
type RadioEvent (line 16) | interface RadioEvent {
type Props (line 23) | interface Props {
type NativeAttrs (line 38) | type NativeAttrs = Omit<React.InputHTMLAttributes<any>, keyof Props>
type RadioProps (line 39) | type RadioProps = Props & NativeAttrs
FILE: components/radio/styles.ts
type RadioColor (line 4) | type RadioColor = {
FILE: components/rating/rating.tsx
type RatingTypes (line 9) | type RatingTypes = NormalTypes
type RatingValue (line 12) | type RatingValue = typeof ratingValueTuple[number]
type RatingCount (line 13) | type RatingCount = typeof ratingCountTuple[number]
type Props (line 15) | interface Props {
type NativeAttrs (line 36) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type RatingProps (line 37) | type RatingProps = Props & NativeAttrs
FILE: components/row/row.tsx
type Justify (line 4) | type Justify = 'start' | 'end' | 'center' | 'space-around' | 'space-betw...
type Align (line 5) | type Align = 'top' | 'middle' | 'bottom'
type Props (line 7) | interface Props {
type NativeAttrs (line 23) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type RowProps (line 24) | type RowProps = Props & NativeAttrs
FILE: components/select/index.ts
type SelectComponentType (line 4) | type SelectComponentType = typeof Select & {
FILE: components/select/select-context.ts
type SelectConfig (line 3) | interface SelectConfig {
FILE: components/select/select-dropdown.tsx
type Props (line 7) | interface Props {
type NativeAttrs (line 20) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type SelectDropdownProps (line 21) | type SelectDropdownProps = Props & NativeAttrs
FILE: components/select/select-icon-clear.tsx
type Props (line 4) | interface Props {
FILE: components/select/select-input.tsx
type SelectInputProps (line 3) | type SelectInputProps = {
FILE: components/select/select-multiple-value.tsx
type Props (line 6) | interface Props {
FILE: components/select/select-option.tsx
type Props (line 9) | interface Props {
type NativeAttrs (line 26) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type SelectOptionProps (line 27) | type SelectOptionProps = Props & NativeAttrs
FILE: components/select/select.tsx
type SelectRef (line 24) | type SelectRef = {
type SelectTypes (line 29) | type SelectTypes = NormalTypes
type Props (line 30) | interface Props {
type NativeAttrs (line 61) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type SelectProps (line 62) | type SelectProps = Props & NativeAttrs
FILE: components/select/styles.ts
type SelectColor (line 4) | type SelectColor = {
FILE: components/shared/backdrop.tsx
type Props (line 7) | interface Props {
type NativeAttrs (line 26) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type BackdropProps (line 27) | type BackdropProps = Props & NativeAttrs
FILE: components/shared/css-transition.tsx
type Props (line 3) | interface Props {
type CssTransitionProps (line 21) | type CssTransitionProps = Props
FILE: components/shared/dropdown.tsx
type Props (line 12) | interface Props {
type ReactiveDomReact (line 19) | interface ReactiveDomReact {
FILE: components/shared/ellipsis.tsx
type EllipsisProps (line 3) | type EllipsisProps = {
FILE: components/shared/expand.tsx
type ExpandProps (line 5) | type ExpandProps = {
FILE: components/shared/highlight.tsx
type Props (line 7) | type Props = {
type HighlightPosition (line 15) | type HighlightPosition = {
type NativeAttrs (line 23) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type HighlightProps (line 24) | type HighlightProps = Props & NativeAttrs
FILE: components/slider/slider-dot.tsx
type Props (line 5) | interface Props {
type NativeAttrs (line 17) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type SliderDotProps (line 18) | type SliderDotProps = Props & NativeAttrs
FILE: components/slider/slider-mark.tsx
type Props (line 4) | interface Props {
type MarkLeftValue (line 10) | type MarkLeftValue = number
type Marks (line 12) | type Marks = Array<MarkLeftValue>
FILE: components/slider/slider.tsx
type SliderTypes (line 19) | type SliderTypes = NormalTypes
type Props (line 20) | interface Props {
type NativeAttrs (line 46) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type SliderProps (line 47) | type SliderProps = Props & NativeAttrs
FILE: components/slider/styles.ts
type SelectColor (line 4) | type SelectColor = {
FILE: components/snippet/snippet.tsx
type ToastTypes (line 11) | type ToastTypes = NormalTypes
type Props (line 12) | interface Props {
type NativeAttrs (line 33) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type SnippetProps (line 34) | type SnippetProps = Props & NativeAttrs
FILE: components/snippet/styles.ts
type SnippetStyles (line 4) | type SnippetStyles = {
FILE: components/spacer/spacer.tsx
type Props (line 4) | interface Props {
type NativeAttrs (line 14) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type SpacerProps (line 15) | type SpacerProps = Props & NativeAttrs
FILE: components/spinner/spinner.tsx
type Props (line 7) | interface Props {
type NativeAttrs (line 15) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type SpinnerProps (line 16) | type SpinnerProps = Props & NativeAttrs
FILE: components/table/__tests__/index.test.tsx
type Item (line 117) | type Item = {
FILE: components/table/table-body.tsx
type Props (line 13) | interface Props<TableDataItem extends TableDataItemBase> {
type NativeAttrs (line 27) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props<any>>
type TableBodyProps (line 28) | type TableBodyProps<TableDataItem> = Props<TableDataItem> & NativeAttrs
FILE: components/table/table-cell.tsx
type Props (line 4) | interface Props<TableDataItem extends TableDataItemBase> {
type TableCellData (line 12) | type TableCellData<TableDataItem> = {
type NativeAttrs (line 18) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props<any>>
type TableCellProps (line 19) | type TableCellProps<TableDataItem extends TableDataItemBase> =
FILE: components/table/table-column.tsx
type TableColumnProps (line 11) | type TableColumnProps<TableDataItem> = {
FILE: components/table/table-context.ts
type TableConfig (line 4) | interface TableConfig<T> {
FILE: components/table/table-head.tsx
type Props (line 5) | interface Props<TableDataItem extends TableDataItemBase> {
type NativeAttrs (line 15) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props<any>>
type TableHeadProps (line 16) | type TableHeadProps<TableDataItem> = Props<TableDataItem> & NativeAttrs
FILE: components/table/table-types.ts
type TableDataItemBase (line 3) | type TableDataItemBase = Record<string, any>
type TableColumnRender (line 5) | type TableColumnRender<Item extends TableDataItemBase> = (
type TableAbstractColumn (line 11) | type TableAbstractColumn<TableDataItem> = {
type TableOnRowClick (line 19) | type TableOnRowClick<TableDataItem> = (
type TableOnCellClick (line 23) | type TableOnCellClick<TableDataItem> = (
type TableOnChange (line 28) | type TableOnChange<TableDataItem> = (data: Array<TableDataItem>) => void
type TableRowClassNameHandler (line 29) | type TableRowClassNameHandler<TableDataItem> = (
FILE: components/table/table.tsx
type Props (line 18) | interface Props<TableDataItem extends TableDataItemBase> {
type NativeAttrs (line 38) | type NativeAttrs = Omit<React.TableHTMLAttributes<any>, keyof Props<any>>
type TableProps (line 39) | type TableProps<TableDataItem extends TableDataItemBase> = Props<TableDa...
function TableComponent (line 42) | function TableComponent<TableDataItem extends TableDataItemBase>(
FILE: components/tabs/index.ts
type TabsComponentType (line 4) | type TabsComponentType = typeof Tabs & {
FILE: components/tabs/tabs-context.ts
type TabsInternalCellProps (line 3) | type TabsInternalCellProps = {
type TabsInternalCell (line 11) | type TabsInternalCell = React.FC<TabsInternalCellProps>
type TabsHeaderItem (line 13) | interface TabsHeaderItem {
type TabsConfig (line 18) | interface TabsConfig {
FILE: components/tabs/tabs-item.tsx
type Props (line 7) | interface Props {
type NativeAttrs (line 17) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type TabsItemProps (line 18) | type TabsItemProps = Props & NativeAttrs
FILE: components/tabs/tabs.tsx
type Props (line 17) | interface Props {
type NativeAttrs (line 45) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type TabsProps (line 46) | type TabsProps = Props & NativeAttrs
FILE: components/tag/tag.tsx
type TagTypes (line 7) | type TagTypes = SnippetTypes
type Props (line 8) | interface Props {
type NativeAttrs (line 20) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type TagProps (line 21) | type TagProps = Props & NativeAttrs
type TagColors (line 23) | type TagColors = {
FILE: components/text/child.tsx
type Props (line 7) | interface Props {
type NativeAttrs (line 30) | type NativeAttrs = Omit<React.DetailsHTMLAttributes<any>, keyof Props>
type TextChildProps (line 31) | type TextChildProps = Props & NativeAttrs
FILE: components/text/text.tsx
type TextTypes (line 6) | type TextTypes = NormalTypes
type Props (line 7) | interface Props {
type ElementMap (line 45) | type ElementMap = { [key in keyof JSX.IntrinsicElements]?: boolean }
type NativeAttrs (line 47) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type TextProps (line 48) | type TextProps = Props & NativeAttrs
type TextRenderableElements (line 50) | type TextRenderableElements = Array<keyof JSX.IntrinsicElements>
FILE: components/textarea/textarea.tsx
type TextareaResizes (line 9) | type TextareaResizes = typeof resizeTypes[number]
type TextareaTypes (line 10) | type TextareaTypes = NormalTypes
type Props (line 11) | interface Props {
type NativeAttrs (line 34) | type NativeAttrs = Omit<React.TextareaHTMLAttributes<any>, keyof Props>
type TextareaProps (line 35) | type TextareaProps = Props & NativeAttrs
FILE: components/themes/presets/index.ts
type GeistUIThemesPalette (line 1) | interface GeistUIThemesPalette {
type GeistUIThemesExpressiveness (line 42) | interface GeistUIThemesExpressiveness {
type GeistUIThemesLayout (line 54) | interface GeistUIThemesLayout {
type GeistUIThemesFont (line 70) | interface GeistUIThemesFont {
type BreakpointsItem (line 76) | interface BreakpointsItem {
type GeistUIThemesBreakpoints (line 81) | interface GeistUIThemesBreakpoints {
type GeistUIThemes (line 89) | interface GeistUIThemes {
FILE: components/themes/themes.ts
type GeistUserTheme (line 6) | type GeistUserTheme = DeepPartial<GeistUIThemes> & { type: string }
FILE: components/toggle/styles.ts
type SelectColor (line 4) | type SelectColor = {
FILE: components/toggle/toggle.tsx
type ToggleTypes (line 8) | type ToggleTypes = NormalTypes
type ToggleEventTarget (line 9) | interface ToggleEventTarget {
type ToggleEvent (line 12) | interface ToggleEvent {
type Props (line 19) | interface Props {
type NativeAttrs (line 35) | type NativeAttrs = Omit<React.LabelHTMLAttributes<any>, keyof Props>
type ToggleProps (line 36) | type ToggleProps = Props & NativeAttrs
type ToggleSize (line 38) | type ToggleSize = {
FILE: components/tooltip/helper.ts
type ReactiveDomReact (line 3) | interface ReactiveDomReact {
FILE: components/tooltip/placement.ts
type ParentDomRect (line 3) | interface ParentDomRect {
type TooltipPosition (line 12) | interface TooltipPosition {
type TooltipIconPosition (line 24) | interface TooltipIconPosition {
FILE: components/tooltip/styles.ts
type TooltipColors (line 4) | type TooltipColors = {
FILE: components/tooltip/tooltip-content.tsx
type Props (line 16) | interface Props {
type TooltipIconOffset (line 26) | type TooltipIconOffset = {
FILE: components/tooltip/tooltip-icon.tsx
type Props (line 6) | interface Props {
FILE: components/tooltip/tooltip.tsx
type TooltipOnVisibleChange (line 9) | type TooltipOnVisibleChange = (visible: boolean) => void
type TooltipTypes (line 10) | type TooltipTypes = SnippetTypes
type TooltipTriggers (line 11) | type TooltipTriggers = TriggerTypes
type TooltipPlacement (line 12) | type TooltipPlacement = Placement
type Props (line 13) | interface Props {
type NativeAttrs (line 43) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type TooltipProps (line 44) | type TooltipProps = Props & NativeAttrs
FILE: components/tree/index.ts
type TreeComponentType (line 5) | type TreeComponentType = typeof Tree & {
FILE: components/tree/tree-context.ts
type TreeConfig (line 3) | interface TreeConfig {
FILE: components/tree/tree-file-icon.tsx
type TreeFileIconProps (line 4) | interface TreeFileIconProps {
FILE: components/tree/tree-file.tsx
type Props (line 9) | interface Props {
type NativeAttrs (line 23) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type TreeFileProps (line 24) | type TreeFileProps = Props & NativeAttrs
FILE: components/tree/tree-folder-icon.tsx
type TreeFolderIconProps (line 4) | interface TreeFolderIconProps {
FILE: components/tree/tree-folder.tsx
type Props (line 13) | interface Props {
type NativeAttrs (line 27) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type TreeFolderProps (line 28) | type TreeFolderProps = Props & NativeAttrs
FILE: components/tree/tree-indents.tsx
type Props (line 3) | interface Props {
FILE: components/tree/tree-status-icon.tsx
type TreeStatusIconProps (line 4) | interface TreeStatusIconProps {
FILE: components/tree/tree.tsx
type TreeFile (line 13) | type TreeFile = {
type Props (line 20) | interface Props {
type NativeAttrs (line 32) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type TreeProps (line 33) | type TreeProps = Props & NativeAttrs
FILE: components/use-all-themes/all-themes-context.ts
type AllThemesConfig (line 5) | type AllThemesConfig = {
FILE: components/use-body-scroll/use-body-scroll.ts
type ElementStackItem (line 3) | type ElementStackItem = {
type BodyScrollOptions (line 8) | type BodyScrollOptions = {
FILE: components/use-classes/use-classes.ts
type classNamesObject (line 1) | type classNamesObject = Record<
type className (line 5) | type className = string | classNamesObject | null | undefined | boolean ...
FILE: components/use-click-away/use-click-away.ts
type ClickAwayGetContainer (line 3) | type ClickAwayGetContainer = () => HTMLElement | null
FILE: components/use-clipboard/use-clipboard.ts
type UseClipboardOptions (line 5) | type UseClipboardOptions = {
type UseClipboardResult (line 9) | type UseClipboardResult = {
FILE: components/use-current-state/use-current-state.ts
type CurrentStateType (line 10) | type CurrentStateType<S> = [S, Dispatch<SetStateAction<S>>, MutableRefOb...
FILE: components/use-input/use-input.tsx
type BindingsChangeTarget (line 4) | type BindingsChangeTarget =
FILE: components/use-keyboard/codes.ts
type KeyCode (line 10) | enum KeyCode {
type KeyMod (line 89) | enum KeyMod {
FILE: components/use-keyboard/use-keyboard.ts
type KeyboardOptions (line 5) | type KeyboardOptions = {
type KeyboardResult (line 13) | type KeyboardResult = {
type UseKeyboardHandler (line 24) | type UseKeyboardHandler = (event: React.KeyboardEvent | KeyboardEvent) =...
type UseKeyboard (line 26) | type UseKeyboard = (
FILE: components/use-media-query/use-media-query.ts
type ResponsiveBreakpoint (line 7) | type ResponsiveBreakpoint = typeof breakpoints[number]
type ResponsiveMatchType (line 10) | type ResponsiveMatchType = typeof matchType[number]
type ResponsiveOptions (line 11) | type ResponsiveOptions = {
FILE: components/use-modal/use-modal.ts
type ModalHooksBindings (line 5) | type ModalHooksBindings = Pick<ModalProps, 'visible' | 'onClose'>
FILE: components/use-scale/scale-context.ts
type ScaleProps (line 35) | type ScaleProps = {
type DynamicLayoutPipe (line 67) | type DynamicLayoutPipe = (
type ScaleInputKeys (line 72) | type ScaleInputKeys =
type DynamicScales (line 89) | type DynamicScales = {
type GetScalePropsFunction (line 93) | type GetScalePropsFunction = (
type GetAllScalePropsFunction (line 97) | type GetAllScalePropsFunction = () => ScaleProps
type ScaleConfig (line 99) | interface ScaleConfig {
FILE: components/use-toasts/helpers.tsx
type ToastPlacement (line 55) | type ToastPlacement = typeof toastPlacement[number]
FILE: components/use-toasts/toast-item.tsx
type ToastItemProps (line 7) | interface ToastItemProps {
FILE: components/use-toasts/use-toast.tsx
type ToastAction (line 7) | interface ToastAction {
type ToastTypes (line 12) | type ToastTypes = NormalTypes
type ToastLayout (line 13) | type ToastLayout = {
type ToastInput (line 21) | interface ToastInput {
type ToastInstance (line 28) | type ToastInstance = {
type Toast (line 35) | type Toast = Required<ToastInput> & ToastInstance
type ToastHooksResult (line 42) | type ToastHooksResult = {
FILE: components/user/index.ts
type UserComponentType (line 4) | type UserComponentType = typeof User & {
FILE: components/user/user-link.tsx
type Props (line 4) | interface Props {
type NativeAttrs (line 13) | type NativeAttrs = Omit<React.AnchorHTMLAttributes<any>, keyof Props>
type UserLinkProps (line 14) | type UserLinkProps = Props & NativeAttrs
FILE: components/user/user.tsx
type Props (line 7) | interface Props {
type NativeAttrs (line 19) | type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>
type UserProps (line 20) | type UserProps = Props & NativeAttrs
FILE: components/utils/__tests__/calculations.test.tsx
type Params (line 34) | type Params = { value: number; max: number; maxFixed?: number }
FILE: components/utils/layouts.ts
type ReactiveDomReact (line 13) | interface ReactiveDomReact {
FILE: components/utils/prop-types.ts
type ButtonTypes (line 65) | type ButtonTypes = typeof buttonTypes[number]
type NormalTypes (line 67) | type NormalTypes = typeof normalTypes[number]
type SnippetTypes (line 69) | type SnippetTypes = typeof snippetTypes[number]
type CardTypes (line 71) | type CardTypes = typeof cardTypes[number]
type CopyTypes (line 73) | type CopyTypes = typeof copyTypes[number]
type TriggerTypes (line 75) | type TriggerTypes = typeof triggerTypes[number]
type Placement (line 77) | type Placement = typeof placement[number]
type DividerAlign (line 79) | type DividerAlign = typeof dividerAlign[number]
FILE: components/utils/types.ts
type DeepPartial (line 2) | type DeepPartial<T> = {
FILE: components/utils/use-context-state/create-geist-context.tsx
type GeistNamedContext (line 29) | type GeistNamedContext<T, N> = {
type GeistNamedProvider (line 33) | type GeistNamedProvider<T, N> = {
type GeistContextProps (line 44) | type GeistContextProps = {
type ResultType (line 69) | type ResultType = GeistNamedProvider<typeof GeistContext, N> &
FILE: components/utils/use-context-state/use-context-state.ts
type ContextStateOnChange (line 5) | type ContextStateOnChange<T> = <K extends keyof T>(key: K, nextValue: T[...
type ContextHandler (line 6) | type ContextHandler<S> = {
type ContextHandlerWhere (line 10) | type ContextHandlerWhere<T> = <K extends keyof T>(key: K, next: T[K]) =>...
type ContextStates (line 11) | type ContextStates<S> = S & ContextHandler<S> & { update: ContextHandler...
type ContextStatesType (line 12) | type ContextStatesType<S> = [
type ContextStateFilter (line 18) | type ContextStateFilter<T> = <K extends keyof T>(
FILE: components/utils/use-drag.ts
type DraggingEvent (line 4) | type DraggingEvent = {
type DraggingHandler (line 9) | type DraggingHandler = (event: DraggingEvent) => void
FILE: components/utils/use-geist-ui-context.ts
type UpdateToastsFunction (line 13) | type UpdateToastsFunction = (fn: (toasts: Array<Toast>) => Array<Toast>)...
type UpdateToastsLayoutFunction (line 14) | type UpdateToastsLayoutFunction = (
type UpdateToastsIDFunction (line 17) | type UpdateToastsIDFunction = (fn: () => string | null) => any
type GeistUIContextParams (line 19) | interface GeistUIContextParams {
FILE: components/utils/use-real-shape.ts
type ShapeType (line 3) | type ShapeType = {
type ShapeResult (line 32) | type ShapeResult = [ShapeType, () => void]
FILE: components/utils/use-ssr.ts
type SSRState (line 4) | type SSRState = {
FILE: examples/create-next-app/pages/_app.tsx
function MyApp (line 4) | function MyApp({ Component, pageProps }: AppProps) {
FILE: examples/create-next-app/pages/_document.js
class MyDocument (line 4) | class MyDocument extends Document {
method getInitialProps (line 5) | static async getInitialProps(ctx) {
method render (line 20) | render() {
FILE: examples/create-next-app/pages/index.tsx
function Home (line 7) | function Home() {
FILE: examples/extends-components/src/app.tsx
function App (line 5) | function App() {
FILE: examples/extends-components/src/my-input.tsx
type InputErrorType (line 4) | type InputErrorType = {
FILE: examples/remix/app/entry.server.tsx
function handleRequest (line 6) | function handleRequest(
FILE: examples/remix/app/root.tsx
function App (line 9) | function App() {
FILE: examples/remix/app/routes/index.tsx
function Index (line 3) | function Index() {
FILE: examples/tree-shaking-create-react-app/build/static/js/main.c0df7028.js
function a (line 2) | function a(e){if(null===e||void 0===e)throw new TypeError("Object.assign...
function l (line 2) | function l(e){for(var t="https://reactjs.org/docs/error-decoder.html?inv...
function c (line 2) | function c(e,t){s(e,t),s(e+"Capture",t)}
function s (line 2) | function s(e,t){for(u[e]=t,e=0;e<t.length;e++)i.add(t[e])}
function g (line 2) | function g(e,t,n,r,a,o,l){this.acceptsBooleans=2===t||3===t||4===t,this....
function b (line 2) | function b(e){return e[1].toUpperCase()}
function w (line 2) | function w(e,t,n,r){var a=y.hasOwnProperty(t)?y[t]:null;(null!==a?0===a....
function H (line 2) | function H(e){return null===e||"object"!==typeof e?null:"function"===typ...
function V (line 2) | function V(e){if(void 0===U)try{throw Error()}catch(n){var t=n.stack.tri...
function $ (line 2) | function $(e,t){if(!e||W)return"";W=!0;var n=Error.prepareStackTrace;Err...
function Q (line 2) | function Q(e){switch(e.tag){case 5:return V(e.type);case 16:return V("La...
function q (line 2) | function q(e){if(null==e)return null;if("function"===typeof e)return e.d...
function K (line 2) | function K(e){switch(typeof e){case"boolean":case"number":case"object":c...
function G (line 2) | function G(e){var t=e.type;return(e=e.nodeName)&&"input"===e.toLowerCase...
function Y (line 2) | function Y(e){e._valueTracker||(e._valueTracker=function(e){var t=G(e)?"...
function X (line 2) | function X(e){if(!e)return!1;var t=e._valueTracker;if(!t)return!0;var n=...
function Z (line 2) | function Z(e){if("undefined"===typeof(e=e||("undefined"!==typeof documen...
function J (line 2) | function J(e,t){var n=t.checked;return a({},t,{defaultChecked:void 0,def...
function ee (line 2) | function ee(e,t){var n=null==t.defaultValue?"":t.defaultValue,r=null!=t....
function te (line 2) | function te(e,t){null!=(t=t.checked)&&w(e,"checked",t,!1)}
function ne (line 2) | function ne(e,t){te(e,t);var n=K(t.value),r=t.type;if(null!=n)"number"==...
function re (line 2) | function re(e,t,n){if(t.hasOwnProperty("value")||t.hasOwnProperty("defau...
function ae (line 2) | function ae(e,t,n){"number"===t&&Z(e.ownerDocument)===e||(null==n?e.defa...
function oe (line 2) | function oe(e,t){return e=a({children:void 0},t),(t=function(e){var t=""...
function le (line 2) | function le(e,t,n,r){if(e=e.options,t){t={};for(var a=0;a<n.length;a++)t...
function ie (line 2) | function ie(e,t){if(null!=t.dangerouslySetInnerHTML)throw Error(l(91));r...
function ue (line 2) | function ue(e,t){var n=t.value;if(null==n){if(n=t.children,t=t.defaultVa...
function ce (line 2) | function ce(e,t){var n=K(t.value),r=K(t.defaultValue);null!=n&&((n=""+n)...
function se (line 2) | function se(e){var t=e.textContent;t===e._wrapperState.initialValue&&""!...
function pe (line 2) | function pe(e){switch(e){case"svg":return"http://www.w3.org/2000/svg";ca...
function me (line 2) | function me(e,t){return null==e||"http://www.w3.org/1999/xhtml"===e?pe(t...
function ve (line 2) | function ve(e,t){if(t){var n=e.firstChild;if(n&&n===e.lastChild&&3===n.n...
function ke (line 2) | function ke(e,t,n){return null==t||"boolean"===typeof t||""===t?"":n||"n...
function xe (line 2) | function xe(e,t){for(var n in e=e.style,t)if(t.hasOwnProperty(n)){var r=...
function _e (line 2) | function _e(e,t){if(t){if(Se[e]&&(null!=t.children||null!=t.dangerouslyS...
function Ee (line 2) | function Ee(e,t){if(-1===e.indexOf("-"))return"string"===typeof t.is;swi...
function Ce (line 2) | function Ce(e){return(e=e.target||e.srcElement||window).correspondingUse...
function Pe (line 2) | function Pe(e){if(e=ra(e)){if("function"!==typeof Ne)throw Error(l(280))...
function Le (line 2) | function Le(e){Te?ze?ze.push(e):ze=[e]:Te=e}
function Re (line 2) | function Re(){if(Te){var e=Te,t=ze;if(ze=Te=null,Pe(e),t)for(e=0;e<t.len...
function Oe (line 2) | function Oe(e,t){return e(t)}
function je (line 2) | function je(e,t,n,r,a){return e(t,n,r,a)}
function Me (line 2) | function Me(){}
function Ae (line 2) | function Ae(){null===Te&&null===ze||(Me(),Re())}
function Ue (line 2) | function Ue(e,t){var n=e.stateNode;if(null===n)return null;var r=oa(n);i...
function Ve (line 2) | function Ve(e,t,n,r,a,o,l,i,u){var c=Array.prototype.slice.call(argument...
function Ge (line 2) | function Ge(e,t,n,r,a,o,l,i,u){We=!1,$e=null,Ve.apply(Ke,arguments)}
function Ye (line 2) | function Ye(e){var t=e,n=e;if(e.alternate)for(;t.return;)t=t.return;else...
function Xe (line 2) | function Xe(e){if(13===e.tag){var t=e.memoizedState;if(null===t&&(null!=...
function Ze (line 2) | function Ze(e){if(Ye(e)!==e)throw Error(l(188))}
function Je (line 2) | function Je(e){if(e=function(e){var t=e.alternate;if(!t){if(null===(t=Ye...
function et (line 2) | function et(e,t){for(var n=e.alternate;null!==t;){if(t===e||t===n)return...
function mt (line 2) | function mt(e,t,n,r,a){return{blockedOn:e,domEventName:t,eventSystemFlag...
function ht (line 2) | function ht(e,t){switch(e){case"focusin":case"focusout":it=null;break;ca...
function gt (line 2) | function gt(e,t,n,r,a,o){return null===e||e.nativeEvent!==o?(e=mt(t,n,r,...
function yt (line 2) | function yt(e){var t=na(e.target);if(null!==t){var n=Ye(t);if(null!==n)i...
function vt (line 2) | function vt(e){if(null!==e.blockedOn)return!1;for(var t=e.targetContaine...
function bt (line 2) | function bt(e,t,n){vt(e)&&n.delete(t)}
function wt (line 2) | function wt(){for(ot=!1;0<lt.length;){var e=lt[0];if(null!==e.blockedOn)...
function kt (line 2) | function kt(e,t){e.blockedOn===t&&(e.blockedOn=null,ot||(ot=!0,o.unstabl...
function xt (line 2) | function xt(e){function t(t){return kt(t,e)}if(0<lt.length){kt(lt[0],e);...
function St (line 2) | function St(e,t){var n={};return n[e.toLowerCase()]=t.toLowerCase(),n["W...
function Nt (line 2) | function Nt(e){if(Et[e])return Et[e];if(!_t[e])return e;var t,n=_t[e];fo...
function Mt (line 2) | function Mt(e,t){for(var n=0;n<e.length;n+=2){var r=e[n],a=e[n+1];a="on"...
function Ft (line 2) | function Ft(e){if(0!==(1&e))return It=15,1;if(0!==(2&e))return It=14,2;i...
function Dt (line 2) | function Dt(e,t){var n=e.pendingLanes;if(0===n)return It=0;var r=0,a=0,o...
function At (line 2) | function At(e){return 0!==(e=-1073741825&e.pendingLanes)?e:1073741824&e?...
function Ut (line 2) | function Ut(e,t){switch(e){case 15:return 1;case 14:return 2;case 12:ret...
function Bt (line 2) | function Bt(e){return e&-e}
function Ht (line 2) | function Ht(e){for(var t=[],n=0;31>n;n++)t.push(e);return t}
function Vt (line 2) | function Vt(e,t,n){e.pendingLanes|=t;var r=t-1;e.suspendedLanes&=r,e.pin...
function Yt (line 2) | function Yt(e,t,n,r){Fe||Me();var a=Zt,o=Fe;Fe=!0;try{je(a,e,t,n,r)}fina...
function Xt (line 2) | function Xt(e,t,n,r){Kt(qt,Zt.bind(null,e,t,n,r))}
function Zt (line 2) | function Zt(e,t,n,r){var a;if(Gt)if((a=0===(4&t))&&0<lt.length&&-1<pt.in...
function Jt (line 2) | function Jt(e,t,n,r){var a=Ce(r);if(null!==(a=na(a))){var o=Ye(a);if(nul...
function rn (line 2) | function rn(){if(nn)return nn;var e,t,n=tn,r=n.length,a="value"in en?en....
function an (line 2) | function an(e){var t=e.keyCode;return"charCode"in e?0===(e=e.charCode)&&...
function on (line 2) | function on(){return!0}
function ln (line 2) | function ln(){return!1}
function un (line 2) | function un(e){function t(t,n,r,a,o){for(var l in this._reactName=t,this...
function Nn (line 2) | function Nn(e){var t=this.nativeEvent;return t.getModifierState?t.getMod...
function Tn (line 2) | function Tn(){return Nn}
function Vn (line 2) | function Vn(e,t){switch(e){case"keyup":return-1!==In.indexOf(t.keyCode);...
function Wn (line 2) | function Wn(e){return"object"===typeof(e=e.detail)&&"data"in e?e.data:null}
function qn (line 2) | function qn(e){var t=e&&e.nodeName&&e.nodeName.toLowerCase();return"inpu...
function Kn (line 2) | function Kn(e,t,n,r){Le(r),0<(t=Fr(t,"onChange")).length&&(n=new pn("onC...
function Xn (line 2) | function Xn(e){zr(e,0)}
function Zn (line 2) | function Zn(e){if(X(aa(e)))return e}
function Jn (line 2) | function Jn(e,t){if("change"===e)return t}
function ar (line 2) | function ar(){Gn&&(Gn.detachEvent("onpropertychange",or),Yn=Gn=null)}
function or (line 2) | function or(e){if("value"===e.propertyName&&Zn(Yn)){var t=[];if(Kn(t,Yn,...
function lr (line 2) | function lr(e,t,n){"focusin"===e?(ar(),Yn=n,(Gn=t).attachEvent("onproper...
function ir (line 2) | function ir(e){if("selectionchange"===e||"keyup"===e||"keydown"===e)retu...
function ur (line 2) | function ur(e,t){if("click"===e)return Zn(t)}
function cr (line 2) | function cr(e,t){if("input"===e||"change"===e)return Zn(t)}
function dr (line 2) | function dr(e,t){if(sr(e,t))return!0;if("object"!==typeof e||null===e||"...
function pr (line 2) | function pr(e){for(;e&&e.firstChild;)e=e.firstChild;return e}
function mr (line 2) | function mr(e,t){var n,r=pr(e);for(e=0;r;){if(3===r.nodeType){if(n=e+r.t...
function hr (line 2) | function hr(e,t){return!(!e||!t)&&(e===t||(!e||3!==e.nodeType)&&(t&&3===...
function gr (line 2) | function gr(){for(var e=window,t=Z();t instanceof e.HTMLIFrameElement;){...
function yr (line 2) | function yr(e){var t=e&&e.nodeName&&e.nodeName.toLowerCase();return t&&(...
function Sr (line 2) | function Sr(e,t,n){var r=n.window===n?n.document:9===n.nodeType?n:n.owne...
function Tr (line 2) | function Tr(e,t,n){var r=e.type||"unknown-event";e.currentTarget=n,funct...
function zr (line 2) | function zr(e,t){t=0!==(4&t);for(var n=0;n<e.length;n++){var r=e[n],a=r....
function Pr (line 2) | function Pr(e,t){var n=la(t),r=e+"__bubble";n.has(r)||(jr(t,e,2,!1),n.ad...
function Rr (line 2) | function Rr(e){e[Lr]||(e[Lr]=!0,i.forEach((function(t){Nr.has(t)||Or(t,!...
function Or (line 2) | function Or(e,t,n,r){var a=4<arguments.length&&void 0!==arguments[4]?arg...
function jr (line 2) | function jr(e,t,n,r){var a=Ot.get(t);switch(void 0===a?2:a){case 0:a=Yt;...
function Mr (line 2) | function Mr(e,t,n,r,a){var o=r;if(0===(1&t)&&0===(2&t)&&null!==r)e:for(;...
function Ir (line 2) | function Ir(e,t,n){return{instance:e,listener:t,currentTarget:n}}
function Fr (line 2) | function Fr(e,t){for(var n=t+"Capture",r=[];null!==e;){var a=e,o=a.state...
function Dr (line 2) | function Dr(e){if(null===e)return null;do{e=e.return}while(e&&5!==e.tag)...
function Ar (line 2) | function Ar(e,t,n,r,a){for(var o=t._reactName,l=[];null!==n&&n!==r;){var...
function Ur (line 2) | function Ur(){}
function Vr (line 2) | function Vr(e,t){switch(e){case"button":case"input":case"select":case"te...
function Wr (line 2) | function Wr(e,t){return"textarea"===e||"option"===e||"noscript"===e||"st...
function qr (line 2) | function qr(e){1===e.nodeType?e.textContent="":9===e.nodeType&&(null!=(e...
function Kr (line 2) | function Kr(e){for(;null!=e;e=e.nextSibling){var t=e.nodeType;if(1===t||...
function Gr (line 2) | function Gr(e){e=e.previousSibling;for(var t=0;e;){if(8===e.nodeType){va...
function na (line 2) | function na(e){var t=e[Zr];if(t)return t;for(var n=e.parentNode;n;){if(t...
function ra (line 2) | function ra(e){return!(e=e[Zr]||e[ea])||5!==e.tag&&6!==e.tag&&13!==e.tag...
function aa (line 2) | function aa(e){if(5===e.tag||6===e.tag)return e.stateNode;throw Error(l(...
function oa (line 2) | function oa(e){return e[Jr]||null}
function la (line 2) | function la(e){var t=e[ta];return void 0===t&&(t=e[ta]=new Set),t}
function ca (line 2) | function ca(e){return{current:e}}
function sa (line 2) | function sa(e){0>ua||(e.current=ia[ua],ia[ua]=null,ua--)}
function fa (line 2) | function fa(e,t){ua++,ia[ua]=e.current,e.current=t}
function ga (line 2) | function ga(e,t){var n=e.type.contextTypes;if(!n)return da;var r=e.state...
function ya (line 2) | function ya(e){return null!==(e=e.childContextTypes)&&void 0!==e}
function va (line 2) | function va(){sa(ma),sa(pa)}
function ba (line 2) | function ba(e,t,n){if(pa.current!==da)throw Error(l(168));fa(pa,t),fa(ma...
function wa (line 2) | function wa(e,t,n){var r=e.stateNode;if(e=t.childContextTypes,"function"...
function ka (line 2) | function ka(e){return e=(e=e.stateNode)&&e.__reactInternalMemoizedMerged...
function xa (line 2) | function xa(e,t,n){var r=e.stateNode;if(!r)throw Error(l(169));n?(e=wa(e...
function Wa (line 2) | function Wa(){switch(La()){case Ra:return 99;case Oa:return 98;case ja:r...
function $a (line 2) | function $a(e){switch(e){case 99:return Ra;case 98:return Oa;case 97:ret...
function Qa (line 2) | function Qa(e,t){return e=$a(e),Ea(e,t)}
function qa (line 2) | function qa(e,t,n){return e=$a(e),Ca(e,t,n)}
function Ka (line 2) | function Ka(){if(null!==Ua){var e=Ua;Ua=null,Na(e)}Ga()}
function Ga (line 2) | function Ga(){if(!Ba&&null!==Aa){Ba=!0;var e=0;try{var t=Aa;Qa(99,(funct...
function Xa (line 2) | function Xa(e,t){if(e&&e.defaultProps){for(var n in t=a({},t),e=e.defaul...
function no (line 2) | function no(){to=eo=Ja=null}
function ro (line 2) | function ro(e){var t=Za.current;sa(Za),e.type._context._currentValue=t}
function ao (line 2) | function ao(e,t){for(;null!==e;){var n=e.alternate;if((e.childLanes&t)==...
function oo (line 2) | function oo(e,t){Ja=e,to=eo=null,null!==(e=e.dependencies)&&null!==e.fir...
function lo (line 2) | function lo(e,t){if(to!==e&&!1!==t&&0!==t)if("number"===typeof t&&107374...
function uo (line 2) | function uo(e){e.updateQueue={baseState:e.memoizedState,firstBaseUpdate:...
function co (line 2) | function co(e,t){e=e.updateQueue,t.updateQueue===e&&(t.updateQueue={base...
function so (line 2) | function so(e,t){return{eventTime:e,lane:t,tag:0,payload:null,callback:n...
function fo (line 2) | function fo(e,t){if(null!==(e=e.updateQueue)){var n=(e=e.shared).pending...
function po (line 2) | function po(e,t){var n=e.updateQueue,r=e.alternate;if(null!==r&&n===(r=r...
function mo (line 2) | function mo(e,t,n,r){var o=e.updateQueue;io=!1;var l=o.firstBaseUpdate,i...
function ho (line 2) | function ho(e,t,n){if(e=t.effects,t.effects=null,null!==e)for(t=0;t<e.le...
function yo (line 2) | function yo(e,t,n,r){n=null===(n=n(r,t=e.memoizedState))||void 0===n?t:a...
function bo (line 2) | function bo(e,t,n,r,a,o,l){return"function"===typeof(e=e.stateNode).shou...
function wo (line 2) | function wo(e,t,n){var r=!1,a=da,o=t.contextType;return"object"===typeof...
function ko (line 2) | function ko(e,t,n,r){e=t.state,"function"===typeof t.componentWillReceiv...
function xo (line 2) | function xo(e,t,n,r){var a=e.stateNode;a.props=n,a.state=e.memoizedState...
function _o (line 2) | function _o(e,t,n){if(null!==(e=n.ref)&&"function"!==typeof e&&"object"!...
function Eo (line 2) | function Eo(e,t){if("textarea"!==e.type)throw Error(l(31,"[object Object...
function Co (line 2) | function Co(e){function t(t,n){if(e){var r=t.lastEffect;null!==r?(r.next...
function Oo (line 2) | function Oo(e){if(e===zo)throw Error(l(174));return e}
function jo (line 2) | function jo(e,t){switch(fa(Ro,t),fa(Lo,e),fa(Po,zo),e=t.nodeType){case 9...
function Mo (line 2) | function Mo(){sa(Po),sa(Lo),sa(Ro)}
function Io (line 2) | function Io(e){Oo(Ro.current);var t=Oo(Po.current),n=me(t,e.type);t!==n&...
function Fo (line 2) | function Fo(e){Lo.current===e&&(sa(Po),sa(Lo))}
function Ao (line 2) | function Ao(e){for(var t=e;null!==t;){if(13===t.tag){var n=t.memoizedSta...
function Vo (line 2) | function Vo(e,t){var n=Wu(5,null,null,0);n.elementType="DELETED",n.type=...
function Wo (line 2) | function Wo(e,t){switch(e.tag){case 5:var n=e.type;return null!==(t=1!==...
function $o (line 2) | function $o(e){if(Ho){var t=Bo;if(t){var n=t;if(!Wo(e,t)){if(!(t=Kr(n.ne...
function Qo (line 2) | function Qo(e){for(e=e.return;null!==e&&5!==e.tag&&3!==e.tag&&13!==e.tag...
function qo (line 2) | function qo(e){if(e!==Uo)return!1;if(!Ho)return Qo(e),Ho=!0,!1;var t=e.t...
function Ko (line 2) | function Ko(){Bo=Uo=null,Ho=!1}
function Yo (line 2) | function Yo(){for(var e=0;e<Go.length;e++)Go[e]._workInProgressVersionPr...
function ol (line 2) | function ol(){throw Error(l(321))}
function ll (line 2) | function ll(e,t){if(null===t)return!1;for(var n=0;n<t.length&&n<e.length...
function il (line 2) | function il(e,t,n,r,a,o){if(Jo=o,el=t,t.memoizedState=null,t.updateQueue...
function ul (line 2) | function ul(){var e={memoizedState:null,baseState:null,baseQueue:null,qu...
function cl (line 2) | function cl(){if(null===tl){var e=el.alternate;e=null!==e?e.memoizedStat...
function sl (line 2) | function sl(e,t){return"function"===typeof t?t(e):t}
function fl (line 2) | function fl(e){var t=cl(),n=t.queue;if(null===n)throw Error(l(311));n.la...
function dl (line 2) | function dl(e){var t=cl(),n=t.queue;if(null===n)throw Error(l(311));n.la...
function pl (line 2) | function pl(e,t,n){var r=t._getVersion;r=r(t._source);var a=t._workInPro...
function ml (line 2) | function ml(e,t,n,r){var a=Oi;if(null===a)throw Error(l(349));var o=t._g...
function hl (line 2) | function hl(e,t,n){return ml(cl(),e,t,n)}
function gl (line 2) | function gl(e){var t=ul();return"function"===typeof e&&(e=e()),t.memoize...
function yl (line 2) | function yl(e,t,n,r){return e={tag:e,create:t,destroy:n,deps:r,next:null...
function vl (line 2) | function vl(e){return e={current:e},ul().memoizedState=e}
function bl (line 2) | function bl(){return cl().memoizedState}
function wl (line 2) | function wl(e,t,n,r){var a=ul();el.flags|=e,a.memoizedState=yl(1|t,n,voi...
function kl (line 2) | function kl(e,t,n,r){var a=cl();r=void 0===r?null:r;var o=void 0;if(null...
function xl (line 2) | function xl(e,t){return wl(516,4,e,t)}
function Sl (line 2) | function Sl(e,t){return kl(516,4,e,t)}
function _l (line 2) | function _l(e,t){return kl(4,2,e,t)}
function El (line 2) | function El(e,t){return"function"===typeof t?(e=e(),t(e),function(){t(nu...
function Cl (line 2) | function Cl(e,t,n){return n=null!==n&&void 0!==n?n.concat([e]):null,kl(4...
function Nl (line 2) | function Nl(){}
function Tl (line 2) | function Tl(e,t){var n=cl();t=void 0===t?null:t;var r=n.memoizedState;re...
function zl (line 2) | function zl(e,t){var n=cl();t=void 0===t?null:t;var r=n.memoizedState;re...
function Pl (line 2) | function Pl(e,t){var n=Wa();Qa(98>n?98:n,(function(){e(!0)})),Qa(97<n?97...
function Ll (line 2) | function Ll(e,t,n){var r=du(),a=pu(e),o={lane:a,action:n,eagerReducer:nu...
function Dl (line 2) | function Dl(e,t,n,r){t.child=null===e?To(t,null,n,r):No(t,e.child,n,r)}
function Al (line 2) | function Al(e,t,n,r,a){n=n.render;var o=t.ref;return oo(t,a),r=il(e,t,n,...
function Ul (line 2) | function Ul(e,t,n,r,a,o){if(null===e){var l=n.type;return"function"!==ty...
function Bl (line 2) | function Bl(e,t,n,r,a,o){if(null!==e&&dr(e.memoizedProps,r)&&e.ref===t.r...
function Hl (line 2) | function Hl(e,t,n){var r=t.pendingProps,a=r.children,o=null!==e?e.memoiz...
function Vl (line 2) | function Vl(e,t){var n=t.ref;(null===e&&null!==n||null!==e&&e.ref!==n)&&...
function Wl (line 2) | function Wl(e,t,n,r,a){var o=ya(n)?ha:pa.current;return o=ga(t,o),oo(t,a...
function $l (line 2) | function $l(e,t,n,r,a){if(ya(n)){var o=!0;ka(t)}else o=!1;if(oo(t,a),nul...
function Ql (line 2) | function Ql(e,t,n,r,a,o){Vl(e,t);var l=0!==(64&t.flags);if(!r&&!l)return...
function ql (line 2) | function ql(e){var t=e.stateNode;t.pendingContext?ba(0,t.pendingContext,...
function Zl (line 2) | function Zl(e,t,n){var r,a=t.pendingProps,o=Do.current,l=!1;return(r=0!=...
function Jl (line 2) | function Jl(e,t,n,r){var a=e.mode,o=e.child;return t={mode:"hidden",chil...
function ei (line 2) | function ei(e,t,n,r){var a=e.child;return e=a.sibling,n=Qu(a,{mode:"visi...
function ti (line 2) | function ti(e,t,n,r,a){var o=t.mode,l=e.child;e=l.sibling;var i={mode:"h...
function ni (line 2) | function ni(e,t){e.lanes|=t;var n=e.alternate;null!==n&&(n.lanes|=t),ao(...
function ri (line 2) | function ri(e,t,n,r,a,o){var l=e.memoizedState;null===l?e.memoizedState=...
function ai (line 2) | function ai(e,t,n){var r=t.pendingProps,a=r.revealOrder,o=r.tail;if(Dl(e...
function oi (line 2) | function oi(e,t,n){if(null!==e&&(t.dependencies=e.dependencies),Bi|=t.la...
function li (line 2) | function li(e,t){if(!Ho)switch(e.tailMode){case"hidden":t=e.tail;for(var...
function ii (line 2) | function ii(e,t,n){var r=t.pendingProps;switch(t.tag){case 2:case 16:cas...
function ui (line 2) | function ui(e){switch(e.tag){case 1:ya(e.type)&&va();var t=e.flags;retur...
function ci (line 2) | function ci(e,t){try{var n="",r=t;do{n+=Q(r),r=r.return}while(r);var a=n...
function si (line 2) | function si(e,t){try{console.error(t.value)}catch(n){setTimeout((functio...
function di (line 2) | function di(e,t,n){(n=so(-1,n)).tag=3,n.payload={element:null};var r=t.v...
function pi (line 2) | function pi(e,t,n){(n=so(-1,n)).tag=3;var r=e.type.getDerivedStateFromEr...
function hi (line 2) | function hi(e){var t=e.ref;if(null!==t)if("function"===typeof t)try{t(nu...
function gi (line 2) | function gi(e,t){switch(t.tag){case 0:case 11:case 15:case 22:case 5:cas...
function yi (line 2) | function yi(e,t,n){switch(n.tag){case 0:case 11:case 15:case 22:if(null!...
function vi (line 2) | function vi(e,t){for(var n=e;;){if(5===n.tag){var r=n.stateNode;if(t)"fu...
function bi (line 2) | function bi(e,t){if(_a&&"function"===typeof _a.onCommitFiberUnmount)try{...
function wi (line 2) | function wi(e){e.alternate=null,e.child=null,e.dependencies=null,e.first...
function ki (line 2) | function ki(e){return 5===e.tag||3===e.tag||4===e.tag}
function xi (line 2) | function xi(e){e:{for(var t=e.return;null!==t;){if(ki(t))break e;t=t.ret...
function Si (line 2) | function Si(e,t,n){var r=e.tag,a=5===r||6===r;if(a)e=a?e.stateNode:e.sta...
function _i (line 2) | function _i(e,t,n){var r=e.tag,a=5===r||6===r;if(a)e=a?e.stateNode:e.sta...
function Ei (line 2) | function Ei(e,t){for(var n,r,a=t,o=!1;;){if(!o){o=a.return;e:for(;;){if(...
function Ci (line 2) | function Ci(e,t){switch(t.tag){case 0:case 11:case 14:case 15:case 22:va...
function Ni (line 2) | function Ni(e){var t=e.updateQueue;if(null!==t){e.updateQueue=null;var n...
function Ti (line 2) | function Ti(e,t){return null!==e&&(null===(e=e.memoizedState)||null!==e....
function qi (line 2) | function qi(){Qi=Va()+500}
function du (line 2) | function du(){return 0!==(48&Ri)?Va():-1!==iu?iu:iu=Va()}
function pu (line 2) | function pu(e){if(0===(2&(e=e.mode)))return 1;if(0===(4&e))return 99===W...
function mu (line 2) | function mu(e,t,n){if(50<ou)throw ou=0,lu=null,Error(l(185));if(null===(...
function hu (line 2) | function hu(e,t){e.lanes|=t;var n=e.alternate;for(null!==n&&(n.lanes|=t)...
function gu (line 2) | function gu(e,t){for(var n=e.callbackNode,r=e.suspendedLanes,a=e.pingedL...
function yu (line 2) | function yu(e){if(iu=-1,cu=uu=0,0!==(48&Ri))throw Error(l(327));var t=e....
function vu (line 2) | function vu(e,t){for(t&=~Vi,t&=~Hi,e.suspendedLanes|=t,e.pingedLanes&=~t...
function bu (line 2) | function bu(e){if(0!==(48&Ri))throw Error(l(327));if(Mu(),e===Oi&&0!==(e...
function wu (line 2) | function wu(e,t){var n=Ri;Ri|=1;try{return e(t)}finally{0===(Ri=n)&&(qi(...
function ku (line 2) | function ku(e,t){var n=Ri;Ri&=-2,Ri|=8;try{return e(t)}finally{0===(Ri=n...
function xu (line 2) | function xu(e,t){fa(Fi,Ii),Ii|=t,Ui|=t}
function Su (line 2) | function Su(){Ii=Fi.current,sa(Fi)}
function _u (line 2) | function _u(e,t){e.finishedWork=null,e.finishedLanes=0;var n=e.timeoutHa...
function Eu (line 2) | function Eu(e,t){for(;;){var n=ji;try{if(no(),Xo.current=Rl,rl){for(var ...
function Cu (line 2) | function Cu(){var e=Pi.current;return Pi.current=Rl,null===e?Rl:e}
function Nu (line 2) | function Nu(e,t){var n=Ri;Ri|=16;var r=Cu();for(Oi===e&&Mi===t||_u(e,t);...
function Tu (line 2) | function Tu(){for(;null!==ji;)Pu(ji)}
function zu (line 2) | function zu(){for(;null!==ji&&!Ta();)Pu(ji)}
function Pu (line 2) | function Pu(e){var t=Ki(e.alternate,e,Ii);e.memoizedProps=e.pendingProps...
function Lu (line 2) | function Lu(e){var t=e;do{var n=t.alternate;if(e=t.return,0===(2048&t.fl...
function Ru (line 2) | function Ru(e){var t=Wa();return Qa(99,Ou.bind(null,e,t)),null}
function Ou (line 2) | function Ou(e,t){do{Mu()}while(null!==eu);if(0!==(48&Ri))throw Error(l(3...
function ju (line 2) | function ju(){for(;null!==Gi;){var e=Gi.alternate;fu||null===su||(0!==(8...
function Mu (line 2) | function Mu(){if(90!==tu){var e=97<tu?97:tu;return tu=90,Qa(e,Du)}return!1}
function Iu (line 2) | function Iu(e,t){nu.push(t,e),Ji||(Ji=!0,qa(97,(function(){return Mu(),n...
function Fu (line 2) | function Fu(e,t){ru.push(t,e),Ji||(Ji=!0,qa(97,(function(){return Mu(),n...
function Du (line 2) | function Du(){if(null===eu)return!1;var e=eu;if(eu=null,0!==(48&Ri))thro...
function Au (line 2) | function Au(e,t,n){fo(e,t=di(0,t=ci(n,t),1)),t=du(),null!==(e=hu(e,1))&&...
function Uu (line 2) | function Uu(e,t){if(3===e.tag)Au(e,e,t);else for(var n=e.return;null!==n...
function Bu (line 2) | function Bu(e,t,n){var r=e.pingCache;null!==r&&r.delete(t),t=du(),e.ping...
function Hu (line 2) | function Hu(e,t){var n=e.stateNode;null!==n&&n.delete(t),0===(t=0)&&(0==...
function Vu (line 2) | function Vu(e,t,n,r){this.tag=e,this.key=n,this.sibling=this.child=this....
function Wu (line 2) | function Wu(e,t,n,r){return new Vu(e,t,n,r)}
function $u (line 2) | function $u(e){return!(!(e=e.prototype)||!e.isReactComponent)}
function Qu (line 2) | function Qu(e,t){var n=e.alternate;return null===n?((n=Wu(e.tag,t,e.key,...
function qu (line 2) | function qu(e,t,n,r,a,o){var i=2;if(r=e,"function"===typeof e)$u(e)&&(i=...
function Ku (line 2) | function Ku(e,t,n,r){return(e=Wu(7,e,r,t)).lanes=n,e}
function Gu (line 2) | function Gu(e,t,n,r){return(e=Wu(23,e,r,t)).elementType=F,e.lanes=n,e}
function Yu (line 2) | function Yu(e,t,n){return(e=Wu(6,e,null,t)).lanes=n,e}
function Xu (line 2) | function Xu(e,t,n){return(t=Wu(4,null!==e.children?e.children:[],e.key,t...
function Zu (line 2) | function Zu(e,t,n){this.tag=t,this.containerInfo=e,this.finishedWork=thi...
function Ju (line 2) | function Ju(e,t,n){var r=3<arguments.length&&void 0!==arguments[3]?argum...
function ec (line 2) | function ec(e,t,n,r){var a=t.current,o=du(),i=pu(a);e:if(n){t:{if(Ye(n=n...
function tc (line 2) | function tc(e){return(e=e.current).child?(e.child.tag,e.child.stateNode)...
function nc (line 2) | function nc(e,t){if(null!==(e=e.memoizedState)&&null!==e.dehydrated){var...
function rc (line 2) | function rc(e,t){nc(e,t),(e=e.alternate)&&nc(e,t)}
function ac (line 2) | function ac(e,t,n){var r=null!=n&&null!=n.hydrationOptions&&n.hydrationO...
function oc (line 2) | function oc(e){return!(!e||1!==e.nodeType&&9!==e.nodeType&&11!==e.nodeTy...
function lc (line 2) | function lc(e,t,n,r,a){var o=n._reactRootContainer;if(o){var l=o._intern...
function ic (line 2) | function ic(e,t){var n=2<arguments.length&&void 0!==arguments[2]?argumen...
function c (line 2) | function c(e,t,n){var r,o={},c=null,s=null;for(r in void 0!==n&&(c=""+n)...
function p (line 2) | function p(e){for(var t="https://reactjs.org/docs/error-decoder.html?inv...
function g (line 2) | function g(e,t,n){this.props=e,this.context=t,this.refs=h,this.updater=n...
function y (line 2) | function y(){}
function v (line 2) | function v(e,t,n){this.props=e,this.context=t,this.refs=h,this.updater=n...
function S (line 2) | function S(e,t,n){var r,o={},l=null,i=null;if(null!=t)for(r in void 0!==...
function _ (line 2) | function _(e){return"object"===typeof e&&null!==e&&e.$$typeof===a}
function C (line 2) | function C(e,t){return"object"===typeof e&&null!==e&&null!=e.key?functio...
function N (line 2) | function N(e,t,n,r,l){var i=typeof e;"undefined"!==i&&"boolean"!==i||(e=...
function T (line 2) | function T(e,t,n){if(null==e)return e;var r=[],a=0;return N(e,r,"","",(f...
function z (line 2) | function z(e){if(-1===e._status){var t=e._result;t=t(),e._status=0,e._re...
function L (line 2) | function L(){var e=P.current;if(null===e)throw Error(p(321));return e}
function x (line 2) | function x(e,t){var n=e.length;e.push(t);e:for(;;){var r=n-1>>>1,a=e[r];...
function S (line 2) | function S(e){return void 0===(e=e[0])?null:e}
function _ (line 2) | function _(e){var t=e[0];if(void 0!==t){var n=e.pop();if(n!==t){e[0]=n;e...
function E (line 2) | function E(e,t){var n=e.sortIndex-t.sortIndex;return 0!==n?n:e.id-t.id}
function j (line 2) | function j(e){for(var t=S(N);null!==t;){if(null===t.callback)_(N);else{i...
function M (line 2) | function M(e){if(O=!1,j(e),!R)if(null!==S(C))R=!0,n(I);else{var t=S(N);n...
function I (line 2) | function I(e,n){R=!1,O&&(O=!1,a()),L=!0;var o=P;try{for(j(n),z=S(C);null...
function n (line 2) | function n(r){var a=t[r];if(void 0!==a)return a.exports;var o=t[r]={expo...
function r (line 2) | function r(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Ar...
function a (line 2) | function a(e,t){return function(e){if(Array.isArray(e))return e}(e)||fun...
function u (line 2) | function u(){return u=Object.assign||function(e){for(var t=1;t<arguments...
function c (line 2) | function c(e){return c="function"==typeof Symbol&&"symbol"==typeof Symbo...
function t (line 2) | function t(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.en...
function e (line 2) | function e(e){var t=void 0===e?{}:e,a=t.name,l=void 0===a?"stylesheet":a...
function o (line 2) | function o(e,t){if(!e)throw new Error("StyleSheet: "+t+".")}
function r (line 2) | function r(e){return e&&e.__esModule?e:{default:e}}
function e (line 2) | function e(e){var t=void 0===e?{}:e,r=t.styleSheet,a=void 0===r?null:r,o...
function o (line 2) | function o(e){return"undefined"===typeof window?(a.add(e),null):((0,r.us...
function V (line 2) | function V(e,t){if(null==e)return{};var n,r,a=function(e,t){if(null==e)r...
function Z (line 2) | function Z(e,t){var n="undefined"!==typeof Symbol&&e[Symbol.iterator]||e...
function J (line 2) | function J(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Ar...
FILE: examples/tree-shaking-nextjs/pages/_app.js
function MyApp (line 3) | function MyApp({ Component, pageProps }) {
FILE: examples/tree-shaking-nextjs/pages/_document.js
class MyDocument (line 4) | class MyDocument extends Document {
method getInitialProps (line 5) | static async getInitialProps(ctx) {
method render (line 20) | render() {
FILE: examples/tree-shaking-nextjs/pages/index.js
function Home (line 3) | function Home() {
FILE: lib/components/attributes/attributes-title.tsx
type AttributesTitleProps (line 6) | interface AttributesTitleProps {
FILE: lib/components/attributes/attributes.tsx
type AttributesProps (line 9) | interface AttributesProps {
type AttributesComponent (line 45) | type AttributesComponent<P> = React.FC<P> & {
FILE: lib/components/attributes/contributors.tsx
type Contributor (line 7) | interface Contributor {
type Props (line 13) | interface Props {
FILE: lib/components/customization/editor-color-item.tsx
type Props (line 8) | interface Props {
FILE: lib/components/customization/editor-input-item.tsx
type Props (line 5) | type Props = {
FILE: lib/components/layout/header.tsx
type Meta (line 4) | interface Meta {
FILE: lib/components/layout/index.tsx
type LayoutComponentType (line 3) | type LayoutComponentType = typeof Layout
FILE: lib/components/layout/layout.tsx
type Meta (line 7) | interface Meta {
type LayoutProps (line 11) | interface LayoutProps {
FILE: lib/components/layout/menu/menu-mobile.tsx
type Props (line 11) | interface Props {
FILE: lib/components/layout/sidebar/active-catalog.tsx
type Props (line 5) | interface Props {
FILE: lib/components/layout/sidebar/active-link.tsx
type Props (line 6) | interface Props {
FILE: lib/components/layout/sidebar/side-item.tsx
type Sides (line 5) | type Sides = {
type SideItemProps (line 12) | interface SideItemProps {
FILE: lib/components/layout/sidebar/sidebar-skeleton.tsx
constant DEFAULT_OPACITY (line 4) | const DEFAULT_OPACITY = 0.75
constant LOADING_OPACITY (line 5) | const LOADING_OPACITY = 0.45
FILE: lib/components/layout/sidebar/sidebar.tsx
type Props (line 9) | interface Props {}
type SideChildren (line 11) | type SideChildren = Sides | Array<Sides>
FILE: lib/components/mdx-widgets/colors/colors-data.ts
type ColorEnum (line 3) | type ColorEnum = {
FILE: lib/components/mdx-widgets/colors/index.tsx
type Props (line 6) | interface Props {
FILE: lib/components/mdx-widgets/example-block.tsx
type ExampleBlockProps (line 9) | type ExampleBlockProps = {
FILE: lib/components/mdx-widgets/home-cell.tsx
type HomeCellProps (line 5) | type HomeCellProps = {
FILE: lib/components/mdx-widgets/hybrid-code.tsx
type HybridCodeProps (line 4) | type HybridCodeProps = CodeProps
constant FILE_NAME_PREFIX (line 5) | const FILE_NAME_PREFIX = '// NAME:'
type HybridCodeChildrenAndName (line 6) | type HybridCodeChildrenAndName = {
FILE: lib/components/mdx-widgets/hybrid-link.tsx
type HybridLinkProps (line 6) | type HybridLinkProps = LinkProps
FILE: lib/components/mdx-widgets/icons-gallery/icons-cell.tsx
type Props (line 18) | interface Props {
FILE: lib/components/mdx-widgets/mock-page.tsx
type Props (line 4) | interface Props {
FILE: lib/components/playground/dynamic-live.tsx
type Props (line 7) | interface Props {
FILE: lib/components/playground/editor.tsx
type Props (line 8) | interface Props {
FILE: lib/components/playground/playground.tsx
type PlaygroundProps (line 16) | type PlaygroundProps = {
FILE: lib/components/playground/title.tsx
type TitleProps (line 4) | type TitleProps = {
FILE: lib/components/pures/anchor/index.tsx
type Props (line 5) | interface Props {
FILE: lib/components/search/helper.ts
type SearchResults (line 3) | type SearchResults = Seeds
type SearchResultGroup (line 4) | type SearchResultGroup = {
FILE: lib/components/search/search-icon.tsx
type SearchIconProps (line 26) | type SearchIconProps = {
FILE: lib/components/search/search-item.tsx
type SearchItemProps (line 6) | type SearchItemProps = {
FILE: lib/components/search/search-items.tsx
type SearchItemsProps (line 15) | type SearchItemsProps = {
type SearchItemsRef (line 22) | type SearchItemsRef = HTMLUListElement & {
FILE: lib/config-context.ts
type Configs (line 5) | interface Configs {
FILE: lib/config-provider.tsx
type ConfigProviderProps (line 11) | type ConfigProviderProps = {
FILE: lib/constants.ts
constant CUSTOM_THEME_TYPE (line 1) | const CUSTOM_THEME_TYPE = 'Custom'
constant CHINESE_LANGUAGE_IDENT (line 3) | const CHINESE_LANGUAGE_IDENT = 'zh-cn'
constant ENGLISH_LANGUAGE_IDENT (line 5) | const ENGLISH_LANGUAGE_IDENT = 'en-us'
constant GITHUB_URL (line 7) | const GITHUB_URL = 'https://github.com/geist-org/geist-ui'
constant CONTRIBUTORS_URL (line 9) | const CONTRIBUTORS_URL = 'https://contributors.geist-ui.dev/api/users'
FILE: lib/data/index.ts
type MultipleLocaleMetaInformation (line 5) | interface MultipleLocaleMetaInformation {
FILE: lib/data/seeds.ts
type Seed (line 4) | type Seed = {
type Seeds (line 10) | type Seeds = Array<Seed>
constant SEEDS (line 12) | const SEEDS = {
FILE: lib/redirect.tsx
type Props (line 5) | interface Props {
FILE: lib/use-locale.ts
constant DEFAULT_LOCALE (line 5) | const DEFAULT_LOCALE = 'en-us'
constant DEFAULT_TAB (line 6) | const DEFAULT_TAB = ''
type LocaleTypes (line 8) | type LocaleTypes = {
FILE: next.config.js
method redirects (line 36) | async redirects() {
FILE: pages/_document.tsx
class MyDocument (line 4) | class MyDocument extends Document {
method getInitialProps (line 5) | static async getInitialProps(ctx: DocumentContext) {
method render (line 20) | render() {
FILE: scripts/built-in/styled-jsx.cjs.js
function _interopDefaultLegacy (line 5) | function _interopDefaultLegacy(e) {
function hash (line 15) | function hash(str) {
function _defineProperties (line 37) | function _defineProperties(target, props) {
function _createClass (line 47) | function _createClass(Constructor, protoProps, staticProps) {
function StyleSheet (line 65) | function StyleSheet(_temp) {
function invariant (line 351) | function invariant(condition, message) {
function _interopRequireDefault (line 366) | function _interopRequireDefault(obj) {
function StyleSheetRegistry (line 375) | function StyleSheetRegistry(_temp) {
function invariant (line 627) | function invariant(condition, message) {
function _interopRequireDefault (line 643) | function _interopRequireDefault(obj) {
function JSXStyle (line 649) | function JSXStyle(props) {
function flush (line 677) | function flush() {
function _interopRequireDefault (line 699) | function _interopRequireDefault(obj) {
function flushToReact (line 703) | function flushToReact(options) {
function flushToHTML (line 723) | function flushToHTML(options) {
FILE: scripts/built-in/styled-jsx.es.js
function hash (line 7) | function hash(str) {
function _defineProperties (line 29) | function _defineProperties(target, props) {
function _createClass (line 39) | function _createClass(Constructor, protoProps, staticProps) {
function StyleSheet (line 57) | function StyleSheet(_temp) {
function invariant (line 343) | function invariant(condition, message) {
function _interopRequireDefault (line 357) | function _interopRequireDefault(obj) {
function StyleSheetRegistry (line 366) | function StyleSheetRegistry(_temp) {
function invariant (line 618) | function invariant(condition, message) {
function _interopRequireDefault (line 633) | function _interopRequireDefault(obj) {
function JSXStyle (line 639) | function JSXStyle(props) {
function flush (line 667) | function flush() {
function _interopRequireDefault (line 689) | function _interopRequireDefault(obj) {
function flushToReact (line 693) | function flushToReact(options) {
function flushToHTML (line 713) | function flushToHTML(options) {
FILE: typings/mdx.d.ts
type MDXProps (line 9) | type MDXProps = {
class MDXProvider (line 13) | class MDXProvider extends React.Component<MDXProps> {}
FILE: typings/meta.d.ts
type MetaHTMLAttributes (line 4) | interface MetaHTMLAttributes<T> extends React.MetaHTMLAttributes<T> {
FILE: typings/styled.d.ts
type StyleHTMLAttributes (line 6) | interface StyleHTMLAttributes<T> extends HTMLAttributes<T> {
Condensed preview — 761 files, each showing path, character count, and a content snippet. Download the .json file or copy for the full structured content (6,875K chars).
[
{
"path": ".circleci/config.yml",
"chars": 1033,
"preview": "version: 2\njobs:\n test:\n docker:\n - image: circleci/node:14.15.0\n\n working_directory: ~/repo\n\n steps:\n "
},
{
"path": ".codecov.yml",
"chars": 166,
"preview": "codecov:\n require_ci_to_pass: yes\n comment:\n layout: \"reach, diff, flags, files\"\n behavior: default\n require_"
},
{
"path": ".eslintignore",
"chars": 78,
"preview": ".now/*\n.next/*\nexamples/*\ndist/*\nesm/*\npublic/*\nscripts/*\ntests/*\n*.config.js\n"
},
{
"path": ".eslintrc.js",
"chars": 488,
"preview": "module.exports = {\n parser: '@typescript-eslint/parser',\n extends: ['eslint-config-ts-lambdas', 'eslint-config-ts-lamb"
},
{
"path": ".github/CODE_OF_CONDUCT.md",
"chars": 5220,
"preview": "# Contributor Covenant Code of Conduct\n\n## Our Pledge\n\nWe as members, contributors, and leaders pledge to make participa"
},
{
"path": ".github/CONTRIBUTING.md",
"chars": 3029,
"preview": "## Geist UI - React Contributing Guide\n\n### Ready to start\n\nWe welcome everyone to join in the construction of the proj"
},
{
"path": ".github/ISSUE_TEMPLATE/1-bug-report.md",
"chars": 382,
"preview": "---\nname: \"Bug report 🐞\"\nabout: \"If something isn't working as expected 🤔.\"\n---\n\n<!-- Please do NOT DELETE the template."
},
{
"path": ".github/ISSUE_TEMPLATE/2-feature-request.md",
"chars": 363,
"preview": "---\nname: \"Feature request 🚀\"\nabout: \"I have a suggestion!\"\n---\n\n<!-- Please do NOT DELETE the template. -->\n<!-- No tem"
},
{
"path": ".github/ISSUE_TEMPLATE/3-docs.md",
"chars": 317,
"preview": "---\nname: \"About `docs` 🛠️\"\nabout: \"Issues and feature requests for docs\"\n---\n\n<!-- Please do NOT DELETE the template. -"
},
{
"path": ".github/ISSUE_TEMPLATE/config.yml",
"chars": 206,
"preview": "contact_links:\n - name: Help or Questions 🙀\n url: https://github.com/geist-org/geist-ui/discussions\n about: This "
},
{
"path": ".github/PULL_REQUEST_TEMPLATE.md",
"chars": 116,
"preview": "## Checklist\n\n- [ ] Fix linting errors\n- [ ] Tests have been added / updated (or snapshots)\n\n## Change information\n\n"
},
{
"path": ".github/workflows/publish.yml",
"chars": 1350,
"preview": "name: Publish\n\non:\n release:\n types: [created]\n\njobs:\n build:\n runs-on: ubuntu-latest\n steps:\n - uses: a"
},
{
"path": ".gitignore",
"chars": 450,
"preview": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pn"
},
{
"path": ".jest.config.js",
"chars": 868,
"preview": "module.exports = {\n verbose: true,\n\n testEnvironment: 'jsdom',\n\n setupFilesAfterEnv: ['./tests/setup.ts'],\n\n moduleF"
},
{
"path": ".prettierignore",
"chars": 81,
"preview": ".github\n.next\n.now\n.circleci\ndist\ncoverage\npublic\nesm\n*.json\n*.d.ts\n*.yml\n*.snap\n"
},
{
"path": ".travis.yml",
"chars": 207,
"preview": "language: node_js\n\nnode_js:\n - 13.9.0\n\ncache:\n directories:\n - \"node_modules\"\n\nnotifications:\n email:\n on_success"
},
{
"path": ".vercelignore",
"chars": 258,
"preview": ".hg\n.git\n.gitmodules\n.svn\n.cache\n.next\n.now\n.vercel\n.npmignore\n.dockerignore\n.gitignore\n.*.swp\n.DS_Store\n.wafpicke-*\n.lo"
},
{
"path": "LICENSE",
"chars": 1065,
"preview": "MIT License\n\nCopyright (c) 2020 Geist UI\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\no"
},
{
"path": "README.md",
"chars": 1832,
"preview": "<p align=\"center\" height=\"370\">\n<img align=\"center\" height=\"370\" src=\"https://user-images.githubusercontent.com/11304944"
},
{
"path": "components/auto-complete/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 126,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`AutoComplete should render correctly 1`] = `<ScaleGeistAutoComplete"
},
{
"path": "components/auto-complete/__tests__/__snapshots__/search.test.tsx.snap",
"chars": 56395,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`AutoComplete Search should hide empty component 1`] = `\nLoadedCheer"
},
{
"path": "components/auto-complete/__tests__/index.test.tsx",
"chars": 2148,
"preview": "import React from 'react'\nimport { mount } from 'enzyme'\nimport { AutoComplete } from 'components'\nimport { nativeEvent "
},
{
"path": "components/auto-complete/__tests__/search.test.tsx",
"chars": 5528,
"preview": "import React from 'react'\nimport { mount, render } from 'enzyme'\nimport { AutoComplete } from 'components'\nimport { nati"
},
{
"path": "components/auto-complete/__tests__/use-input.test.tsx",
"chars": 1868,
"preview": "import React, { useEffect } from 'react'\nimport { mount } from 'enzyme'\nimport { AutoComplete, useInput } from 'componen"
},
{
"path": "components/auto-complete/auto-complete-context.ts",
"chars": 520,
"preview": "import React, { MutableRefObject } from 'react'\n\nexport interface AutoCompleteConfig {\n value?: string\n updateValue?: "
},
{
"path": "components/auto-complete/auto-complete-dropdown.tsx",
"chars": 2120,
"preview": "import React, { CSSProperties, useMemo } from 'react'\nimport useTheme from '../use-theme'\nimport { useAutoCompleteContex"
},
{
"path": "components/auto-complete/auto-complete-empty.tsx",
"chars": 730,
"preview": "import React from 'react'\nimport AutoCompleteSearch from './auto-complete-searching'\n\ninterface Props {\n hidden?: boole"
},
{
"path": "components/auto-complete/auto-complete-item.tsx",
"chars": 2924,
"preview": "import React, { useMemo } from 'react'\nimport useTheme from '../use-theme'\nimport { useAutoCompleteContext } from './aut"
},
{
"path": "components/auto-complete/auto-complete-searching.tsx",
"chars": 1686,
"preview": "import React from 'react'\nimport useTheme from '../use-theme'\nimport useScale, { withScale } from '../use-scale'\n\ninterf"
},
{
"path": "components/auto-complete/auto-complete.tsx",
"chars": 7666,
"preview": "import React, {\n CSSProperties,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react'\nimp"
},
{
"path": "components/auto-complete/index.ts",
"chars": 894,
"preview": "import AutoComplete from './auto-complete'\nimport AutoCompleteItem from './auto-complete-item'\nimport AutoCompleteSearch"
},
{
"path": "components/avatar/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 48773,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Avatar should render text element 1`] = `\nLoadedCheerio {\n \"0\": No"
},
{
"path": "components/avatar/__tests__/index.test.tsx",
"chars": 1639,
"preview": "import React from 'react'\nimport { mount, render, shallow } from 'enzyme'\nimport { Avatar } from 'components'\n\ndescribe("
},
{
"path": "components/avatar/avatar-group.tsx",
"chars": 1645,
"preview": "import React from 'react'\nimport useTheme from '../use-theme'\nimport useScale, { withScale } from '../use-scale'\nimport "
},
{
"path": "components/avatar/avatar.tsx",
"chars": 2655,
"preview": "import React from 'react'\nimport useTheme from '../use-theme'\nimport useScale, { withScale } from '../use-scale'\nimport "
},
{
"path": "components/avatar/index.ts",
"chars": 353,
"preview": "import Avatar from './avatar'\nimport AvatarGroup from './avatar-group'\n\nexport type AvatarComponentType = typeof Avatar "
},
{
"path": "components/badge/__tests__/__snapshots__/anchor.test.tsx.snap",
"chars": 3847,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`BadgeAnchor should be support multiple position 1`] = `\n\"<div class"
},
{
"path": "components/badge/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 64505,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Badge should re-render when size changed 1`] = `ReactWrapper {}`;\n\n"
},
{
"path": "components/badge/__tests__/anchor.test.tsx",
"chars": 973,
"preview": "import React from 'react'\nimport { mount } from 'enzyme'\nimport { Badge } from 'components'\n\ndescribe('BadgeAnchor', () "
},
{
"path": "components/badge/__tests__/index.test.tsx",
"chars": 1999,
"preview": "import React from 'react'\nimport { mount, render, shallow } from 'enzyme'\nimport Badge from '../badge'\n\ndescribe('Badge'"
},
{
"path": "components/badge/badge-anchor.tsx",
"chars": 2464,
"preview": "import React, { useMemo } from 'react'\nimport { pickChild } from '../utils/collections'\nimport { tuple } from '../utils/"
},
{
"path": "components/badge/badge.tsx",
"chars": 2452,
"preview": "import React, { useMemo } from 'react'\nimport useTheme from '../use-theme'\nimport { NormalTypes } from '../utils/prop-ty"
},
{
"path": "components/badge/index.ts",
"chars": 378,
"preview": "import Badge from './badge'\nimport BadgeAnchor from './badge-anchor'\n\nexport type BadgeComponentType = typeof Badge & {\n"
},
{
"path": "components/breadcrumbs/__tests__/__snapshots__/breadcrumbs.test.tsx.snap",
"chars": 2308,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Breadcrumbs should redefined all separators 1`] = `\n\"<nav class=\\\\\""
},
{
"path": "components/breadcrumbs/__tests__/breadcrumbs.test.tsx",
"chars": 2222,
"preview": "import React from 'react'\nimport { mount } from 'enzyme'\nimport { Breadcrumbs } from 'components'\n\ndescribe('Breadcrumbs"
},
{
"path": "components/breadcrumbs/breadcrumbs-item.tsx",
"chars": 1721,
"preview": "import Link from '../link'\nimport { Props as LinkBasicProps } from '../link/link'\nimport React, { useMemo } from 'react'"
},
{
"path": "components/breadcrumbs/breadcrumbs-separator.tsx",
"chars": 1286,
"preview": "import React from 'react'\nimport useScale, { withScale } from '../use-scale'\nimport useClasses from '../use-classes'\n\nin"
},
{
"path": "components/breadcrumbs/breadcrumbs.tsx",
"chars": 2769,
"preview": "import React, { ReactNode, useMemo } from 'react'\nimport useTheme from '../use-theme'\nimport BreadcrumbsSeparator from '"
},
{
"path": "components/breadcrumbs/index.ts",
"chars": 673,
"preview": "import Breadcrumbs from './breadcrumbs'\nimport BreadcrumbsItem from './breadcrumbs-item'\nimport BreadcrumbsSeparator fro"
},
{
"path": "components/button/__tests__/__snapshots__/icon.test.tsx.snap",
"chars": 9297,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`ButtonIcon should render correctly 1`] = `\n\"<button type=\\\\\"button\\"
},
{
"path": "components/button/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 321,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Button should render empty button correctly 1`] = `<ScaleGeistButto"
},
{
"path": "components/button/__tests__/icon.test.tsx",
"chars": 1489,
"preview": "import React from 'react'\nimport { mount } from 'enzyme'\nimport { Button } from 'components'\nconst Icon: React.FC<any> ="
},
{
"path": "components/button/__tests__/index.test.tsx",
"chars": 3807,
"preview": "import React from 'react'\nimport { mount } from 'enzyme'\nimport { Button } from 'components'\nimport { sleep } from 'test"
},
{
"path": "components/button/button-icon.tsx",
"chars": 1564,
"preview": "import React from 'react'\nimport useClasses from '../use-classes'\n\ninterface Props {\n isRight?: boolean\n isSingle?: bo"
},
{
"path": "components/button/button-loading.tsx",
"chars": 606,
"preview": "import React from 'react'\nimport Loading from '../loading'\n\ninterface Props {\n color: string\n}\n\nconst ButtonLoading: Re"
},
{
"path": "components/button/button.drip.tsx",
"chars": 1972,
"preview": "import React, { useEffect, useRef } from 'react'\n\ninterface Props {\n x: number\n y: number\n onCompleted: () => void\n "
},
{
"path": "components/button/button.tsx",
"chars": 6882,
"preview": "import React, { useRef, useState, MouseEvent, useMemo, useImperativeHandle } from 'react'\nimport useScale, { withScale }"
},
{
"path": "components/button/index.ts",
"chars": 152,
"preview": "import Button from './button'\n\nexport type { ButtonProps } from './button'\nexport type { ButtonTypes } from '../utils/pr"
},
{
"path": "components/button/styles.ts",
"chars": 5602,
"preview": "import { GeistUIThemesPalette } from '../themes/presets'\nimport { ButtonTypes } from '../utils/prop-types'\nimport { Butt"
},
{
"path": "components/button/utils.tsx",
"chars": 1649,
"preview": "import React, { ReactNode } from 'react'\nimport ButtonIcon from './button-icon'\nimport { ButtonProps } from './button'\ni"
},
{
"path": "components/button-dropdown/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 832529,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Button Dropdown should render multiple types 1`] = `\nLoadedCheerio "
},
{
"path": "components/button-dropdown/__tests__/index.test.tsx",
"chars": 5005,
"preview": "import React from 'react'\nimport { mount, render } from 'enzyme'\nimport { ButtonDropdown } from 'components'\nimport { mo"
},
{
"path": "components/button-dropdown/button-dropdown-context.ts",
"chars": 539,
"preview": "import React from 'react'\nimport { NormalTypes } from '../utils/prop-types'\n\nexport interface ButtonDropdownConfig {\n t"
},
{
"path": "components/button-dropdown/button-dropdown-item.tsx",
"chars": 2601,
"preview": "import React, { MouseEvent, useMemo } from 'react'\nimport useTheme from '../use-theme'\nimport { getColor } from './style"
},
{
"path": "components/button-dropdown/button-dropdown.tsx",
"chars": 6557,
"preview": "import React, { MouseEvent, useCallback, useMemo, useRef, useState } from 'react'\nimport useTheme from '../use-theme'\nim"
},
{
"path": "components/button-dropdown/icon.tsx",
"chars": 664,
"preview": "import React from 'react'\n\ninterface Props {\n color?: string\n height?: string\n}\n\nconst ButtonDropdownIcon: React.FC<Pr"
},
{
"path": "components/button-dropdown/index.ts",
"chars": 493,
"preview": "import ButtonDropdown from './button-dropdown'\nimport ButtonDropdownItem from './button-dropdown-item'\n\ntype ButtonDropd"
},
{
"path": "components/button-dropdown/styles.ts",
"chars": 1665,
"preview": "import { GeistUIThemesPalette } from '../themes/presets'\nimport { NormalTypes } from '../utils/prop-types'\n\ntype ButtonD"
},
{
"path": "components/button-group/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 16471,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`ButtonGroup buttons should be displayed vertically 1`] = `\n\"<div cl"
},
{
"path": "components/button-group/__tests__/index.test.tsx",
"chars": 1562,
"preview": "import React from 'react'\nimport { mount } from 'enzyme'\nimport { ButtonGroup, Button } from 'components'\nimport { nativ"
},
{
"path": "components/button-group/button-group-context.ts",
"chars": 483,
"preview": "import React from 'react'\nimport { ButtonTypes } from '../utils/prop-types'\n\nexport interface ButtonGroupConfig {\n type"
},
{
"path": "components/button-group/button-group.tsx",
"chars": 3859,
"preview": "import React, { useMemo } from 'react'\nimport useTheme from '../use-theme'\nimport { ButtonTypes } from '../utils/prop-ty"
},
{
"path": "components/button-group/index.ts",
"chars": 179,
"preview": "import ButtonGroup from './button-group'\n\nexport type { ButtonGroupProps } from './button-group'\nexport type { ButtonTyp"
},
{
"path": "components/capacity/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 40962,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Capacity should override background color 1`] = `\nLoadedCheerio {\n "
},
{
"path": "components/capacity/__tests__/index.test.tsx",
"chars": 981,
"preview": "import React from 'react'\nimport { render, mount } from 'enzyme'\nimport { Capacity } from 'components'\n\ndescribe('Capaci"
},
{
"path": "components/capacity/capacity.tsx",
"chars": 2175,
"preview": "import React, { useMemo } from 'react'\nimport useTheme from '../use-theme'\nimport { useProportions } from '../utils/calc"
},
{
"path": "components/capacity/index.ts",
"chars": 107,
"preview": "import Capacity from './capacity'\n\nexport type { CapacityProps } from './capacity'\nexport default Capacity\n"
},
{
"path": "components/card/__tests__/__snapshots__/footer.test.tsx.snap",
"chars": 2665,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Card Footer should render correctly 1`] = `\n\"<div class=\\\\\"card\\\\\">"
},
{
"path": "components/card/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 333854,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Card should render correctly when nested 1`] = `\nLoadedCheerio {\n "
},
{
"path": "components/card/__tests__/footer.test.tsx",
"chars": 792,
"preview": "import React from 'react'\nimport { mount } from 'enzyme'\nimport { Card } from 'components'\n\ndescribe('Card Footer', () ="
},
{
"path": "components/card/__tests__/index.test.tsx",
"chars": 1508,
"preview": "import React from 'react'\nimport { mount, render } from 'enzyme'\nimport { Card } from 'components'\n\ndescribe('Card', () "
},
{
"path": "components/card/card-content.tsx",
"chars": 1302,
"preview": "import React from 'react'\nimport useScale, { withScale } from '../use-scale'\nimport useClasses from '../use-classes'\n\nin"
},
{
"path": "components/card/card-footer.tsx",
"chars": 1870,
"preview": "import React from 'react'\nimport useTheme from '../use-theme'\nimport useScale, { withScale } from '../use-scale'\nimport "
},
{
"path": "components/card/card.tsx",
"chars": 2912,
"preview": "import React, { useMemo } from 'react'\nimport useTheme from '../use-theme'\nimport { CardTypes } from '../utils/prop-type"
},
{
"path": "components/card/index.ts",
"chars": 712,
"preview": "import Card from './card'\nimport CardFooter from './card-footer'\nimport CardContent from './card-content'\n\nexport type C"
},
{
"path": "components/card/styles.ts",
"chars": 1447,
"preview": "import { CardTypes } from '../utils/prop-types'\nimport { GeistUIThemesPalette } from '../themes/presets'\n\nexport type Ca"
},
{
"path": "components/checkbox/__tests__/__snapshots__/group.test.tsx.snap",
"chars": 61612,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Checkbox Group should render correctly 1`] = `\nLoadedCheerio {\n \"0"
},
{
"path": "components/checkbox/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 34051,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Checkbox should render correctly 1`] = `\nLoadedCheerio {\n \"0\": Nod"
},
{
"path": "components/checkbox/__tests__/group.test.tsx",
"chars": 3212,
"preview": "import React from 'react'\nimport { mount, render } from 'enzyme'\nimport { Checkbox } from 'components'\n\ndescribe('Checkb"
},
{
"path": "components/checkbox/__tests__/index.test.tsx",
"chars": 2401,
"preview": "import React from 'react'\nimport { mount, render } from 'enzyme'\nimport { Checkbox } from 'components'\n\ndescribe('Checkb"
},
{
"path": "components/checkbox/checkbox-context.ts",
"chars": 450,
"preview": "import React from 'react'\n\nexport interface CheckboxConfig {\n updateState?: (value: string, checked: boolean) => void\n "
},
{
"path": "components/checkbox/checkbox-group.tsx",
"chars": 2411,
"preview": "import React, { useEffect, useMemo, useState } from 'react'\nimport { CheckboxContext } from './checkbox-context'\nimport "
},
{
"path": "components/checkbox/checkbox.icon.tsx",
"chars": 1627,
"preview": "import React, { useMemo } from 'react'\nimport useTheme from '../use-theme'\n\ninterface Props {\n disabled?: boolean\n che"
},
{
"path": "components/checkbox/checkbox.tsx",
"chars": 4450,
"preview": "import React, { useCallback, useEffect, useMemo, useState } from 'react'\nimport { useCheckbox } from './checkbox-context"
},
{
"path": "components/checkbox/index.ts",
"chars": 444,
"preview": "import Checkbox from './checkbox'\nimport CheckboxGroup from './checkbox-group'\n\nexport type CheckboxComponentType = type"
},
{
"path": "components/checkbox/styles.ts",
"chars": 821,
"preview": "import { GeistUIThemesPalette } from '../themes/presets'\nimport { NormalTypes } from '../utils/prop-types'\n\nexport type "
},
{
"path": "components/code/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 30890,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Code should repspond to changed by width 1`] = `\nLoadedCheerio {\n "
},
{
"path": "components/code/__tests__/index.test.tsx",
"chars": 1037,
"preview": "import React from 'react'\nimport { mount, render } from 'enzyme'\nimport { Code } from 'components'\n\ndescribe('Code', () "
},
{
"path": "components/code/code.tsx",
"chars": 3164,
"preview": "import React, { useMemo } from 'react'\nimport useScale, { withScale } from '../use-scale'\nimport useTheme from '../use-t"
},
{
"path": "components/code/index.ts",
"chars": 87,
"preview": "import Code from './code'\n\nexport type { CodeProps } from './code'\nexport default Code\n"
},
{
"path": "components/col/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 13532,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Col should render correctly 1`] = `ReactWrapper {}`;\n\nexports[`Col "
},
{
"path": "components/col/__tests__/index.test.tsx",
"chars": 1124,
"preview": "import React from 'react'\nimport { mount, render } from 'enzyme'\nimport Col from '../index'\n\ndescribe('Col', () => {\n i"
},
{
"path": "components/col/col.tsx",
"chars": 1093,
"preview": "import React from 'react'\n\ninterface Props {\n span?: number\n offset?: number\n component?: keyof JSX.IntrinsicElements"
},
{
"path": "components/col/index.ts",
"chars": 82,
"preview": "import Col from './col'\n\nexport type { ColProps } from './col'\nexport default Col\n"
},
{
"path": "components/collapse/__tests__/__snapshots__/group.test.tsx.snap",
"chars": 549736,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Collapse Group should be no errors when children are missing 1`] = "
},
{
"path": "components/collapse/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 1150037,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Collapse should render correctly 1`] = `ReactWrapper {}`;\n\nexports["
},
{
"path": "components/collapse/__tests__/group.test.tsx",
"chars": 2245,
"preview": "import React from 'react'\nimport { mount, render } from 'enzyme'\nimport { Collapse } from 'components'\nimport { updateWr"
},
{
"path": "components/collapse/__tests__/index.test.tsx",
"chars": 1716,
"preview": "import React from 'react'\nimport { mount, render } from 'enzyme'\nimport { Collapse } from 'components'\nimport { updateWr"
},
{
"path": "components/collapse/collapse-context.ts",
"chars": 405,
"preview": "import React from 'react'\n\nexport interface CollapseConfig {\n values: Array<number>\n updateValues?: (currentIndex: num"
},
{
"path": "components/collapse/collapse-group.tsx",
"chars": 2663,
"preview": "import React, { useMemo } from 'react'\nimport Collapse from './collapse'\nimport useCurrentState from '../utils/use-curre"
},
{
"path": "components/collapse/collapse-icon.tsx",
"chars": 726,
"preview": "import React from 'react'\n\ninterface Props {\n active?: boolean\n}\n\nconst CollapseIcon: React.FC<Props> = ({ active }) =>"
},
{
"path": "components/collapse/collapse.tsx",
"chars": 3784,
"preview": "import React, { useEffect } from 'react'\nimport CollapseIcon from './collapse-icon'\nimport useTheme from '../use-theme'\n"
},
{
"path": "components/collapse/index.ts",
"chars": 384,
"preview": "import Collapse from './collapse'\nimport CollapseGroup from './collapse-group'\n\nexport type CollapseComponentType = type"
},
{
"path": "components/css-baseline/__tests__/__snapshots__/baseline.test.tsx.snap",
"chars": 19202,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`CSSBaseline should render correctly 1`] = `\nLoadedCheerio {\n \"0\": "
},
{
"path": "components/css-baseline/__tests__/baseline.test.tsx",
"chars": 552,
"preview": "import React from 'react'\nimport { render } from 'enzyme'\nimport { CssBaseline, GeistProvider } from 'components'\n\ndescr"
},
{
"path": "components/css-baseline/css-baseline.tsx",
"chars": 7189,
"preview": "import React, { ReactElement } from 'react'\nimport useTheme from '../use-theme'\nimport flush, { flushToHTML } from 'styl"
},
{
"path": "components/css-baseline/index.ts",
"chars": 41,
"preview": "export { default } from './css-baseline'\n"
},
{
"path": "components/description/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 114,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Description should render correctly 1`] = `ReactWrapper {}`;\n"
},
{
"path": "components/description/__tests__/index.test.tsx",
"chars": 870,
"preview": "import React from 'react'\nimport { mount } from 'enzyme'\nimport { Description } from 'components'\n\ndescribe('Description"
},
{
"path": "components/description/description.tsx",
"chars": 1979,
"preview": "import React, { ReactNode } from 'react'\nimport useTheme from '../use-theme'\nimport useScale, { withScale } from '../use"
},
{
"path": "components/description/index.ts",
"chars": 122,
"preview": "import Description from './description'\n\nexport type { DescriptionProps } from './description'\nexport default Descriptio"
},
{
"path": "components/display/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 48698,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Display should render correctly 1`] = `ReactWrapper {}`;\n\nexports[`"
},
{
"path": "components/display/__tests__/index.test.tsx",
"chars": 879,
"preview": "import React from 'react'\nimport { mount, render } from 'enzyme'\nimport { Display } from 'components'\n\ndescribe('Display"
},
{
"path": "components/display/display.tsx",
"chars": 2384,
"preview": "import React, { ReactNode, useMemo } from 'react'\nimport useTheme from '../use-theme'\nimport useScale, { withScale } fro"
},
{
"path": "components/display/index.ts",
"chars": 102,
"preview": "import Display from './display'\n\nexport type { DisplayProps } from './display'\nexport default Display\n"
},
{
"path": "components/divider/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 126410,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Divider should render correctly 1`] = `ReactWrapper {}`;\n\nexports[`"
},
{
"path": "components/divider/__tests__/index.test.tsx",
"chars": 1365,
"preview": "import React from 'react'\nimport { mount, render } from 'enzyme'\nimport { Divider } from 'components'\n\ndescribe('Divider"
},
{
"path": "components/divider/divider.tsx",
"chars": 3215,
"preview": "import React, { useMemo } from 'react'\nimport useTheme from '../use-theme'\nimport { DividerAlign, SnippetTypes } from '."
},
{
"path": "components/divider/index.ts",
"chars": 172,
"preview": "import Divider from './divider'\n\nexport type { DividerProps, DividerTypes } from './divider'\nexport type { DividerAlign "
},
{
"path": "components/dot/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 131997,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Dot should render correctly 1`] = `ReactWrapper {}`;\n\nexports[`Dot "
},
{
"path": "components/dot/__tests__/index.test.tsx",
"chars": 692,
"preview": "import React from 'react'\nimport { mount, render } from 'enzyme'\nimport { Dot } from 'components'\n\ndescribe('Dot', () =>"
},
{
"path": "components/dot/dot.tsx",
"chars": 2341,
"preview": "import React, { useMemo } from 'react'\nimport useTheme from '../use-theme'\nimport { NormalTypes } from '../utils/prop-ty"
},
{
"path": "components/dot/index.ts",
"chars": 92,
"preview": "import Dot from './dot'\n\nexport type { DotProps, DotTypes } from './dot'\nexport default Dot\n"
},
{
"path": "components/drawer/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 28017,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Drawer customization should be supported 1`] = `\n\"<div class=\\\\\"wra"
},
{
"path": "components/drawer/__tests__/index.test.tsx",
"chars": 4853,
"preview": "import React from 'react'\nimport { mount } from 'enzyme'\nimport { Drawer } from 'components'\nimport { nativeEvent, updat"
},
{
"path": "components/drawer/__tests__/use-modal.test.tsx",
"chars": 1117,
"preview": "import React, { useEffect } from 'react'\nimport { mount, ReactWrapper } from 'enzyme'\nimport { Drawer, useModal } from '"
},
{
"path": "components/drawer/drawer-wrapper.tsx",
"chars": 5121,
"preview": "import React, { useEffect, useMemo, useRef } from 'react'\nimport useScale from '../use-scale'\nimport useTheme from '../u"
},
{
"path": "components/drawer/drawer.tsx",
"chars": 2373,
"preview": "import React, { MouseEvent, useEffect, useState } from 'react'\nimport { withScale } from '../use-scale'\nimport usePortal"
},
{
"path": "components/drawer/helper.ts",
"chars": 1028,
"preview": "import { tuple } from '../utils/prop-types'\n\nconst drawerPlacement = tuple('top', 'right', 'bottom', 'left')\nexport type"
},
{
"path": "components/drawer/index.ts",
"chars": 739,
"preview": "import Drawer from './drawer'\nimport ModalTitle from '../modal/modal-title'\nimport ModalSubtitle from '../modal/modal-su"
},
{
"path": "components/fieldset/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 95903,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Fieldset should render correctly 1`] = `\nLoadedCheerio {\n \"0\": Nod"
},
{
"path": "components/fieldset/__tests__/group.test.tsx",
"chars": 1787,
"preview": "import React from 'react'\nimport { mount } from 'enzyme'\nimport { Fieldset } from 'components'\n\ndescribe('Fieldset Group"
},
{
"path": "components/fieldset/__tests__/index.test.tsx",
"chars": 1897,
"preview": "import React from 'react'\nimport { mount, render } from 'enzyme'\nimport { Fieldset } from 'components'\n\ndescribe('Fields"
},
{
"path": "components/fieldset/fieldset-content.tsx",
"chars": 1403,
"preview": "import React from 'react'\nimport useScale, { withScale } from '../use-scale'\nimport useClasses from '../use-classes'\n\nin"
},
{
"path": "components/fieldset/fieldset-context.ts",
"chars": 460,
"preview": "import React from 'react'\n\nexport interface FieldItem {\n value: string\n label: string\n}\n\nexport interface FieldsetConf"
},
{
"path": "components/fieldset/fieldset-footer.tsx",
"chars": 1770,
"preview": "import React from 'react'\nimport useTheme from '../use-theme'\nimport useScale, { withScale } from '../use-scale'\n\ninterf"
},
{
"path": "components/fieldset/fieldset-group.tsx",
"chars": 4319,
"preview": "import React, { useCallback, useMemo, useState } from 'react'\nimport useTheme from '../use-theme'\nimport useCurrentState"
},
{
"path": "components/fieldset/fieldset-subtitle.tsx",
"chars": 872,
"preview": "import React from 'react'\n\ninterface Props {\n className?: string\n}\n\nconst defaultProps = {\n className: '',\n}\n\ntype Nat"
},
{
"path": "components/fieldset/fieldset-title.tsx",
"chars": 1027,
"preview": "import React from 'react'\nimport useClasses from '../use-classes'\n\ninterface Props {\n className?: string\n}\n\nconst defau"
},
{
"path": "components/fieldset/fieldset.tsx",
"chars": 3581,
"preview": "import React, { ReactNode, useEffect, useMemo, useState } from 'react'\nimport useTheme from '../use-theme'\nimport Fields"
},
{
"path": "components/fieldset/index.ts",
"chars": 1295,
"preview": "import Fieldset from './fieldset'\nimport FieldsetTitle from './fieldset-title'\nimport FieldsetSubtitle from './fieldset-"
},
{
"path": "components/geist-provider/geist-provider.tsx",
"chars": 1933,
"preview": "import React, { PropsWithChildren, useMemo, useState } from 'react'\nimport {\n GeistUIContent,\n defaultToastLayout,\n G"
},
{
"path": "components/geist-provider/index.ts",
"chars": 134,
"preview": "import GeistProvider from './geist-provider'\n\nexport type { GeistProviderProps } from './geist-provider'\nexport default "
},
{
"path": "components/geist-provider/theme-provider.tsx",
"chars": 1363,
"preview": "import React, { PropsWithChildren, useEffect, useMemo, useState } from 'react'\nimport Themes from '../themes'\nimport { G"
},
{
"path": "components/grid/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 27721,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Grid all breakpoint values should be supported 1`] = `\n\"<div class="
},
{
"path": "components/grid/__tests__/index.test.tsx",
"chars": 3468,
"preview": "import React from 'react'\nimport { mount } from 'enzyme'\nimport { Grid } from 'components'\n\ndescribe('Grid', () => {\n i"
},
{
"path": "components/grid/basic-item.tsx",
"chars": 4638,
"preview": "import React, { useMemo } from 'react'\nimport useTheme from '../use-theme'\nimport {\n GridJustify,\n GridDirection,\n Gr"
},
{
"path": "components/grid/grid-container.tsx",
"chars": 1814,
"preview": "import React, { useMemo } from 'react'\nimport GridBasicItem, { GridBasicItemProps } from './basic-item'\nimport { GridWra"
},
{
"path": "components/grid/grid-types.ts",
"chars": 768,
"preview": "import { tuple } from '../utils/prop-types'\n\nconst justify = tuple(\n 'flex-start',\n 'center',\n 'flex-end',\n 'space-b"
},
{
"path": "components/grid/grid.tsx",
"chars": 1263,
"preview": "import React from 'react'\nimport css from 'styled-jsx/css'\nimport GridBasicItem, { GridBasicItemProps } from './basic-it"
},
{
"path": "components/grid/index.ts",
"chars": 527,
"preview": "import Grid from './grid'\nimport GridContainer from './grid-container'\n\nexport type GridComponentType = typeof Grid & {\n"
},
{
"path": "components/image/__tests__/__snapshots__/browser.test.tsx.snap",
"chars": 394982,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Image Browser should render correctly 1`] = `\nLoadedCheerio {\n \"0\""
},
{
"path": "components/image/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 481,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Image should render correctly 1`] = `ReactWrapper {}`;\n\nexports[`Im"
},
{
"path": "components/image/__tests__/browser.test.tsx",
"chars": 2111,
"preview": "import React from 'react'\nimport { mount, render } from 'enzyme'\nimport { Image } from 'components'\n\nconst link = 'https"
},
{
"path": "components/image/__tests__/index.test.tsx",
"chars": 3604,
"preview": "import React from 'react'\nimport { mount } from 'enzyme'\nimport { Image } from 'components'\nimport { updateWrapper } fro"
},
{
"path": "components/image/helpers.ts",
"chars": 324,
"preview": "export const transformDataSource = (src: string) => {\n const left = `${src}`.slice(0, 4)\n if (encodeURIComponent(left)"
},
{
"path": "components/image/image-browser-https-icon.tsx",
"chars": 759,
"preview": "import React from 'react'\n\nconst ImageBrowserHttpsIcon = () => {\n return (\n <svg viewBox=\"0 0 24 24\" fill=\"currentCo"
},
{
"path": "components/image/image-browser.tsx",
"chars": 5738,
"preview": "import React, { useMemo } from 'react'\nimport Link from '../link'\nimport { Props as LinkProps } from '../link/link'\nimpo"
},
{
"path": "components/image/image.skeleton.tsx",
"chars": 1420,
"preview": "import React from 'react'\nimport useTheme from '../use-theme'\n\ninterface Props {\n opacity?: number\n}\n\nconst defaultProp"
},
{
"path": "components/image/image.tsx",
"chars": 2758,
"preview": "import React, { useEffect, useMemo, useRef, useState } from 'react'\nimport useTheme from '../use-theme'\nimport ImageSkel"
},
{
"path": "components/image/index.ts",
"chars": 370,
"preview": "import Image from './image'\nimport ImageBrowser from './image-browser'\n\nexport type ImageComponentType = typeof Image & "
},
{
"path": "components/image/styles.ts",
"chars": 739,
"preview": "import { GeistUIThemesPalette } from '../themes/presets'\n\nexport type BrowserColors = {\n color: string\n barBgColor: st"
},
{
"path": "components/index.ts",
"chars": 6839,
"preview": "// @ts-ignore\n/// <reference types=\"styled-jsx\" />\n\nexport { default as AutoComplete } from './auto-complete'\nexport typ"
},
{
"path": "components/input/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 25680,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Input should be work with icon 1`] = `\n\"<div><div class=\\\\\"with-lab"
},
{
"path": "components/input/__tests__/__snapshots__/password.test.tsx.snap",
"chars": 3858,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`InputPassword should render correctly 1`] = `\n\"<div class=\\\\\"with-l"
},
{
"path": "components/input/__tests__/index.test.tsx",
"chars": 4732,
"preview": "import React from 'react'\nimport { mount } from 'enzyme'\nimport { Input } from 'components'\nimport { nativeEvent } from "
},
{
"path": "components/input/__tests__/password.test.tsx",
"chars": 1221,
"preview": "import React from 'react'\nimport { mount, shallow } from 'enzyme'\nimport { Input } from 'components'\nimport { nativeEven"
},
{
"path": "components/input/index.ts",
"chars": 568,
"preview": "import Input from './input'\nimport Textarea from '../textarea'\nimport InputPassword from './password'\n\nexport type Input"
},
{
"path": "components/input/input-block-label.tsx",
"chars": 898,
"preview": "import React from 'react'\nimport useTheme from '../use-theme'\n\nexport interface InputBlockLabelLabel {}\n\nconst InputBloc"
},
{
"path": "components/input/input-icon-clear.tsx",
"chars": 2005,
"preview": "import React from 'react'\nimport useTheme from '../use-theme'\nimport useClasses from '../use-classes'\n\ninterface Props {"
},
{
"path": "components/input/input-icon.tsx",
"chars": 1168,
"preview": "import React from 'react'\n\nexport interface InputIconProps {\n icon: React.ReactNode\n clickable: boolean\n onClick: (e:"
},
{
"path": "components/input/input-label.tsx",
"chars": 1454,
"preview": "import React from 'react'\nimport useTheme from '../use-theme'\n\nexport interface InputLabel {\n isRight?: boolean\n}\n\ncons"
},
{
"path": "components/input/input-props.ts",
"chars": 1027,
"preview": "import React from 'react'\nimport { NormalTypes } from '../utils/prop-types'\n\nexport type InputTypes = NormalTypes\nexport"
},
{
"path": "components/input/input.tsx",
"chars": 7929,
"preview": "import React, { useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react'\nimport useTheme from '../use-th"
},
{
"path": "components/input/password-icon.tsx",
"chars": 909,
"preview": "import React from 'react'\n\ninterface Props {\n visible: boolean\n}\n\nconst PasswordIcon: React.FC<Props> = ({ visible }) ="
},
{
"path": "components/input/password.tsx",
"chars": 1985,
"preview": "import React, { useImperativeHandle, useMemo, useRef, useState } from 'react'\nimport { Props, defaultProps } from './inp"
},
{
"path": "components/input/styles.ts",
"chars": 1071,
"preview": "import { NormalTypes } from '../utils/prop-types'\nimport { GeistUIThemesPalette } from '../themes/presets'\n\nexport type "
},
{
"path": "components/keyboard/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 4852,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Keyboard should render correctly 1`] = `\n\"<kbd class=\\\\\"\\\\\"><span>F"
},
{
"path": "components/keyboard/__tests__/index.test.tsx",
"chars": 672,
"preview": "import React from 'react'\nimport { mount } from 'enzyme'\nimport { Keyboard } from 'components'\n\ndescribe('Keyboard', () "
},
{
"path": "components/keyboard/index.ts",
"chars": 107,
"preview": "import Keyboard from './keyboard'\n\nexport type { KeyboardProps } from './keyboard'\nexport default Keyboard\n"
},
{
"path": "components/keyboard/keyboard.tsx",
"chars": 2095,
"preview": "import React from 'react'\nimport useTheme from '../use-theme'\nimport useScale, { withScale } from '../use-scale'\n\ninterf"
},
{
"path": "components/link/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 5439,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Link should render correctly 1`] = `\n\"<div><a class=\\\\\"link\\\\\" href"
},
{
"path": "components/link/__tests__/index.test.tsx",
"chars": 1558,
"preview": "import React from 'react'\nimport { mount } from 'enzyme'\nimport { Link } from 'components'\n\ndescribe('Link', () => {\n i"
},
{
"path": "components/link/icon.tsx",
"chars": 836,
"preview": "import React from 'react'\n\nexport const LinkIconComponent: React.FC<unknown> = () => {\n return (\n <svg\n viewBox"
},
{
"path": "components/link/index.ts",
"chars": 87,
"preview": "import Link from './link'\n\nexport type { LinkProps } from './link'\nexport default Link\n"
},
{
"path": "components/link/link.tsx",
"chars": 2790,
"preview": "import React from 'react'\nimport useTheme from '../use-theme'\nimport LinkIcon from './icon'\nimport { addColorAlpha } fro"
},
{
"path": "components/loading/__tests__/__snapshots__/index.test.tsx.snap",
"chars": 12840,
"preview": "// Jest Snapshot v1, https://goo.gl/fbAQLP\n\nexports[`Loading should render correctly 1`] = `\n\"<div class=\\\\\"loading-cont"
},
{
"path": "components/loading/__tests__/index.test.tsx",
"chars": 1148,
"preview": "import React from 'react'\nimport { mount } from 'enzyme'\nimport { Loading } from 'components'\n\ndescribe('Loading', () =>"
},
{
"path": "components/loading/index.ts",
"chars": 116,
"preview": "import Loading from './loading'\n\nexport type { LoadingProps, LoadingTypes } from './loading'\nexport default Loading\n"
},
{
"path": "components/loading/loading.tsx",
"chars": 3466,
"preview": "import React, { useMemo } from 'react'\nimport useTheme from '../use-theme'\nimport { NormalTypes } from '../utils/prop-ty"
}
]
// ... and 561 more files (download for full content)
About this extraction
This page contains the full source code of the geist-org/geist-ui GitHub repository, extracted and formatted as plain text for AI agents and large language models (LLMs). The extraction includes 761 files (6.1 MB), approximately 1.6M tokens, and a symbol index with 963 extracted functions, classes, methods, constants, and types. Use this with OpenClaw, Claude, ChatGPT, Cursor, Windsurf, or any other AI tool that accepts text input. You can copy the full output to your clipboard or download it as a .txt file.
Extracted by GitExtract — free GitHub repo to text converter for AI. Built by Nikandr Surkov.