├── .yarnrc ├── packages ├── clay-css │ ├── src │ │ ├── scss │ │ │ ├── atlas │ │ │ │ └── variables │ │ │ │ │ ├── _loaders.scss │ │ │ │ │ ├── _timelines.scss │ │ │ │ │ ├── _type.scss │ │ │ │ │ ├── _icons.scss │ │ │ │ │ ├── _quick-action.scss │ │ │ │ │ ├── _reorder.scss │ │ │ │ │ ├── _c-root.scss │ │ │ │ │ ├── _time.scss │ │ │ │ │ ├── _tooltip.scss │ │ │ │ │ └── _drilldown.scss │ │ │ ├── variables │ │ │ │ ├── _bs4-variable-overwrites.scss │ │ │ │ ├── _side-navigation.scss │ │ │ │ ├── _c-root.scss │ │ │ │ ├── _jumbotron.scss │ │ │ │ ├── _images.scss │ │ │ │ ├── _resizer.scss │ │ │ │ └── _aspect-ratio.scss │ │ │ ├── components │ │ │ │ ├── _media.scss │ │ │ │ ├── _resizer.scss │ │ │ │ ├── _navigation-bar.scss │ │ │ │ ├── _transitions.scss │ │ │ │ ├── _application-bar.scss │ │ │ │ ├── _management-bar.scss │ │ │ │ └── _jumbotron.scss │ │ │ ├── cadmin │ │ │ │ ├── variables │ │ │ │ │ ├── _side-navigation.scss │ │ │ │ │ ├── _images.scss │ │ │ │ │ ├── _resizer.scss │ │ │ │ │ └── _aspect-ratio.scss │ │ │ │ └── components │ │ │ │ │ ├── _resizer.scss │ │ │ │ │ ├── _navigation-bar.scss │ │ │ │ │ ├── _transitions.scss │ │ │ │ │ └── _management-bar.scss │ │ │ ├── _cadmin-variables.scss │ │ │ ├── base-variables.scss │ │ │ ├── base.scss │ │ │ ├── mixins │ │ │ │ ├── _clearfix.scss │ │ │ │ ├── _monospace.scss │ │ │ │ └── _box-shadow.scss │ │ │ ├── atlas-variables.scss │ │ │ ├── atlas.scss │ │ │ └── _license-text.scss │ │ └── images │ │ │ ├── images │ │ │ ├── empty_state.gif │ │ │ ├── search_state.gif │ │ │ ├── success_state.gif │ │ │ ├── empty_state_reduced_motion.gif │ │ │ ├── search_state_reduced_motion.gif │ │ │ └── success_state_reduced_motion.gif │ │ │ └── icons │ │ │ ├── google-drive.svg │ │ │ ├── cursor.svg │ │ │ ├── circle.svg │ │ │ ├── italic.svg │ │ │ ├── square.svg │ │ │ ├── hr.svg │ │ │ ├── slash.svg │ │ │ ├── bars.svg │ │ │ ├── play.svg │ │ │ ├── flag-full.svg │ │ │ ├── text-l.svg │ │ │ ├── simple-circle.svg │ │ │ ├── angle-down.svg │ │ │ ├── angle-up-small.svg │ │ │ ├── angle-up.svg │ │ │ ├── rectangle.svg │ │ │ ├── video.svg │ │ │ ├── angle-down-small.svg │ │ │ ├── angle-left-small.svg │ │ │ ├── angle-right-small.svg │ │ │ ├── document-default.svg │ │ │ ├── flag-empty.svg │ │ │ ├── flags-en-LV.svg │ │ │ ├── caret-bottom.svg │ │ │ ├── caret-top-l.svg │ │ │ ├── caret-top.svg │ │ │ ├── document-multimedia.svg │ │ │ ├── heading.svg │ │ │ ├── minus-circle.svg │ │ │ ├── flags-de-CH.svg │ │ │ ├── flags-fr-CH.svg │ │ │ ├── flags-it-CH.svg │ │ │ ├── caret-left-l.svg │ │ │ ├── caret-right-l.svg │ │ │ ├── caret-bottom-l.svg │ │ │ ├── caret-left.svg │ │ │ ├── caret-right.svg │ │ │ ├── document-presentation.svg │ │ │ ├── folder.svg │ │ │ ├── geolocation.svg │ │ │ ├── pause.svg │ │ │ ├── reset.svg │ │ │ ├── angle-left.svg │ │ │ ├── angle-right.svg │ │ │ ├── rectangle-split.svg │ │ │ ├── button.svg │ │ │ ├── underline.svg │ │ │ ├── user.svg │ │ │ ├── flags-en-IE.svg │ │ │ ├── flags-ja-JP.svg │ │ │ ├── heart-full.svg │ │ │ ├── product-menu-open.svg │ │ │ ├── asterisk.svg │ │ │ ├── container.svg │ │ │ ├── flags-in-ID.svg │ │ │ ├── flags-pl-PL.svg │ │ │ ├── flags-uk-UA.svg │ │ │ ├── order-arrow-down.svg │ │ │ ├── order-arrow-up.svg │ │ │ ├── transform.svg │ │ │ ├── bold.svg │ │ │ ├── flags-es-CO.svg │ │ │ ├── moon.svg │ │ │ ├── check.svg │ │ │ ├── order-arrow-left.svg │ │ │ ├── order-arrow-right.svg │ │ │ ├── bolt.svg │ │ │ ├── flags-de-AT.svg │ │ │ ├── search.svg │ │ │ ├── repository.svg │ │ │ ├── tap-ahead.svg │ │ │ ├── home-full.svg │ │ │ ├── bookmarks-full.svg │ │ │ ├── diagonal-line.svg │ │ │ ├── plus-circle-full.svg │ │ │ ├── tablet-portrait.svg │ │ │ ├── times.svg │ │ │ ├── check-small.svg │ │ │ ├── filter.svg │ │ │ └── flags-rw-RW.svg │ ├── .gitignore │ ├── .yarnrc │ └── index.js ├── clay-alert │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ ├── src │ │ └── Footer.tsx │ └── README.md ├── clay-badge │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ └── README.md ├── clay-charts │ ├── BREAKING.md │ ├── src │ │ ├── scss │ │ │ ├── components │ │ │ │ ├── _select_drag.scss │ │ │ │ ├── _title.scss │ │ │ │ ├── _brush.scss │ │ │ │ ├── _area.scss │ │ │ │ ├── _region.scss │ │ │ │ ├── _text.scss │ │ │ │ ├── _bar.scss │ │ │ │ ├── _point.scss │ │ │ │ ├── _loading.scss │ │ │ │ ├── _axis.scss │ │ │ │ ├── _grid.scss │ │ │ │ ├── _legend.scss │ │ │ │ ├── _focus.scss │ │ │ │ ├── _arc.scss │ │ │ │ └── _radar.scss │ │ │ └── main.scss │ │ └── __tests__ │ │ │ └── __snapshots__ │ │ │ └── ClayCharts.tsx.snap │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ └── README.md ├── clay-link │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ ├── src │ │ ├── index.tsx │ │ └── Context.tsx │ └── README.md ├── clay-list │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ └── src │ │ └── index.tsx ├── clay-panel │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ ├── src │ │ ├── Title.tsx │ │ ├── Body.tsx │ │ ├── Footer.tsx │ │ └── Header.tsx │ └── README.md ├── clay-popover │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ ├── src │ │ └── index.tsx │ └── README.md ├── clay-shared │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ ├── README.md │ └── src │ │ ├── stack.ts │ │ ├── __tests__ │ │ └── __snapshots__ │ │ │ └── Portal.tsx.snap │ │ ├── useId.ts │ │ ├── usePrevious.ts │ │ ├── useIsFirstRender.ts │ │ ├── throttle.ts │ │ └── setElementFullHeight.ts ├── clay-slider │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ └── README.md ├── clay-sticker │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ └── src │ │ └── index.tsx ├── clay-table │ ├── BREAKING.md │ ├── tsconfig.json │ ├── stories │ │ └── static │ │ │ └── thumbnail_coffee.jpg │ ├── .yarnrc │ ├── src │ │ ├── types.ts │ │ ├── Body.tsx │ │ └── Head.tsx │ ├── tsconfig.declarations.json │ └── README.md ├── clay-tooltip │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ └── src │ │ ├── index.tsx │ │ └── __tests__ │ │ └── __snapshots__ │ │ └── index.tsx.snap ├── clay-autocomplete │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ └── src │ │ └── index.tsx ├── clay-breadcrumb │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ └── tsconfig.declarations.json ├── clay-color-picker │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ └── tsconfig.declarations.json ├── clay-date-picker │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ ├── src │ │ └── Weekday.tsx │ └── README.md ├── clay-drop-down │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ ├── src │ │ ├── Divider.tsx │ │ ├── index.tsx │ │ ├── DropDownContext.ts │ │ ├── FocusMenu.tsx │ │ ├── Caption.tsx │ │ └── Help.tsx │ └── README.md ├── clay-empty-state │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ └── tsconfig.declarations.json ├── clay-pagination │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ ├── src │ │ └── index.tsx │ └── README.md ├── clay-progress-bar │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ └── README.md ├── clay-time-picker │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ └── README.md ├── clay-upper-toolbar │ ├── BREAKING.md │ ├── tsconfig.json │ ├── tsconfig.declarations.json │ └── .yarnrc ├── clay-loading-indicator │ ├── BREAKING.md │ ├── tsconfig.json │ ├── tsconfig.declarations.json │ └── .yarnrc ├── clay-localized-input │ ├── BREAKING.md │ ├── tsconfig.json │ ├── tsconfig.declarations.json │ └── .yarnrc ├── clay-management-toolbar │ ├── BREAKING.md │ ├── tsconfig.json │ ├── tsconfig.declarations.json │ ├── .yarnrc │ └── src │ │ ├── index.tsx │ │ └── Item.tsx ├── clay-multi-step-nav │ ├── BREAKING.md │ ├── tsconfig.json │ ├── tsconfig.declarations.json │ ├── .yarnrc │ └── src │ │ ├── Divider.tsx │ │ ├── index.tsx │ │ └── Title.tsx ├── clay-navigation-bar │ ├── BREAKING.md │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ └── src │ │ └── context.ts ├── clay-pagination-bar │ ├── BREAKING.md │ ├── tsconfig.json │ ├── tsconfig.declarations.json │ ├── .yarnrc │ ├── src │ │ ├── index.tsx │ │ └── Results.tsx │ └── README.md ├── demos │ ├── README.md │ ├── tsconfig.json │ └── src │ │ └── recharts │ │ └── index.tsx ├── clay-card │ ├── tsconfig.json │ ├── BREAKING.md │ ├── .yarnrc │ ├── tsconfig.declarations.json │ ├── src │ │ └── index.tsx │ └── README.md ├── clay-core │ ├── tsconfig.json │ ├── .yarnrc │ ├── src │ │ ├── tree-view │ │ │ └── index.ts │ │ ├── overlay-mask │ │ │ └── index.ts │ │ ├── language-picker │ │ │ └── index.ts │ │ ├── vertical-nav │ │ │ ├── index.ts │ │ │ └── Trigger.tsx │ │ ├── icon-selector │ │ │ └── index.ts │ │ ├── drop-down │ │ │ └── index.ts │ │ ├── aria │ │ │ └── index.ts │ │ ├── picker │ │ │ └── index.ts │ │ ├── focus-trap │ │ │ └── index.ts │ │ ├── nav │ │ │ ├── index.tsx │ │ │ └── Item.tsx │ │ ├── hooks │ │ │ ├── index.ts │ │ │ ├── useForwardRef.ts │ │ │ ├── useIsFirstRender.ts │ │ │ └── useIsMounted.ts │ │ ├── side-panel │ │ │ ├── index.ts │ │ │ ├── Body.tsx │ │ │ └── Title.tsx │ │ ├── typography │ │ │ └── index.ts │ │ ├── live-announcer │ │ │ └── index.ts │ │ ├── vertical-bar │ │ │ └── index.ts │ │ ├── table │ │ │ ├── index.ts │ │ │ └── ScopeContext.ts │ │ └── collection │ │ │ └── index.ts │ ├── tsconfig.declarations.json │ └── stories │ │ └── IconSelector.stories.tsx ├── clay-form │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ └── BREAKING.md ├── clay-icon │ ├── tsconfig.json │ ├── BREAKING.md │ ├── .yarnrc │ ├── tsconfig.declarations.json │ ├── src │ │ └── __tests__ │ │ │ └── __snapshots__ │ │ │ └── index.tsx.snap │ └── README.md ├── clay-label │ ├── tsconfig.json │ ├── BREAKING.md │ ├── .yarnrc │ ├── tsconfig.declarations.json │ └── README.md ├── clay-modal │ ├── tsconfig.json │ ├── BREAKING.md │ ├── .yarnrc │ ├── tsconfig.declarations.json │ ├── src │ │ ├── Subtitle.tsx │ │ └── types.ts │ └── README.md ├── clay-nav │ ├── tsconfig.json │ ├── BREAKING.md │ ├── .yarnrc │ ├── tsconfig.declarations.json │ ├── src │ │ └── index.tsx │ └── README.md ├── clay-tabs │ ├── tsconfig.json │ ├── BREAKING.md │ ├── .yarnrc │ ├── tsconfig.declarations.json │ └── README.md ├── clay-button │ ├── tsconfig.json │ ├── .yarnrc │ ├── BREAKING.md │ ├── tsconfig.declarations.json │ ├── src │ │ └── index.tsx │ └── README.md ├── clay-layout │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ └── README.md ├── clay-provider │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ ├── src │ │ └── index.ts │ └── README.md ├── clay-toolbar │ ├── tsconfig.json │ ├── .yarnrc │ ├── tsconfig.declarations.json │ └── src │ │ ├── __tests__ │ │ ├── __snapshots__ │ │ │ └── index.tsx.snap │ │ └── index.tsx │ │ └── Section.tsx ├── clay-data-provider │ ├── tsconfig.json │ ├── BREAKING.md │ ├── tsconfig.declarations.json │ ├── .yarnrc │ └── src │ │ └── index.ts ├── clay-multi-select │ ├── tsconfig.json │ ├── BREAKING.md │ ├── .yarnrc │ ├── tsconfig.declarations.json │ └── src │ │ ├── __tests__ │ │ └── __snapshots__ │ │ │ └── index.tsx.snap │ │ └── index.tsx ├── generator-clay-component │ ├── app │ │ └── templates │ │ │ ├── _tsconfig.json │ │ │ ├── src │ │ │ ├── tests │ │ │ │ ├── __snapshots__ │ │ │ │ │ └── _index.tsx.snap │ │ │ │ └── _index.tsx │ │ │ └── _index.tsx │ │ │ ├── _tsconfig.declarations.json │ │ │ ├── _.yarnrc │ │ │ ├── _README.md │ │ │ └── _stories │ │ │ └── _index.tsx │ └── package.json └── browserslist-config-clay │ ├── .yarnrc │ ├── config │ ├── README.md │ ├── package.json │ └── index.js ├── www ├── app │ ├── favicon.ico │ ├── _components │ │ ├── link.module.css │ │ ├── sandpack.module.css │ │ ├── navbar.module.css │ │ └── SandpackStyles.tsx │ └── docs │ │ ├── (layout) │ │ └── layout.module.css │ │ └── (main) │ │ └── (main) │ │ └── docs.module.css ├── public │ ├── banner.png │ ├── clay_logo_w.png │ └── images │ │ ├── tv-at-beach.png │ │ ├── long_user_image.png │ │ ├── thumbnail_dock.jpg │ │ ├── DeathtoStock_Desk4.jpg │ │ ├── switch_components.png │ │ ├── thumbnail_coffee.jpg │ │ ├── thumbnail_placeholder.gif │ │ └── thumbnail_hot_air_ballon.jpg ├── use-client-loader.mjs ├── .eslintrc.json ├── docs │ └── css │ │ └── Sheet.tsx ├── renoun.json └── .gitignore ├── .prettierrc ├── .codesandbox ├── react-ts │ ├── tsconfig.json │ ├── src │ │ └── index.tsx │ └── public │ │ └── index.html └── react │ ├── src │ └── index.js │ └── public │ └── index.html ├── copyright.js ├── .github ├── semantic.yml └── ISSUE_TEMPLATE │ ├── Question.md │ ├── Icon.md │ ├── Clayui.md │ ├── Proposal.md │ └── Bug.md ├── scripts ├── jest-setup.ts ├── jest-clay-lerna-resolver.js ├── check-deps │ └── src │ │ └── getPackageConfig.js └── check-size │ └── convertBytes.mjs ├── .gitignore ├── turbo.json ├── .storybook └── manager.js ├── docs └── clay_css_version_history.md ├── tsconfig.global.json ├── .eslintignore ├── tsconfig.declarations.json ├── .prettierignore └── lerna.json /.yarnrc: -------------------------------------------------------------------------------- 1 | workspaces-experimental true 2 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/atlas/variables/_loaders.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/variables/_bs4-variable-overwrites.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/clay-alert/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-badge/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-charts/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-link/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-list/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-panel/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-popover/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-shared/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-slider/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-sticker/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-table/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-tooltip/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-autocomplete/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-breadcrumb/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-color-picker/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-date-picker/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-drop-down/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-empty-state/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-pagination/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-progress-bar/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-time-picker/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-upper-toolbar/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-charts/src/scss/components/_select_drag.scss: -------------------------------------------------------------------------------- 1 | .bb-dragarea { 2 | } 3 | -------------------------------------------------------------------------------- /packages/clay-loading-indicator/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-localized-input/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-management-toolbar/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-multi-step-nav/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-navigation-bar/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-pagination-bar/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | -------------------------------------------------------------------------------- /packages/clay-css/.gitignore: -------------------------------------------------------------------------------- 1 | build 2 | LICENSES 3 | node_modules 4 | temp 5 | !tasks/lib -------------------------------------------------------------------------------- /www/app/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/liferay/clay/HEAD/www/app/favicon.ico -------------------------------------------------------------------------------- /www/app/_components/link.module.css: -------------------------------------------------------------------------------- 1 | .link_active { 2 | color: #B3472D !important; 3 | } 4 | -------------------------------------------------------------------------------- /www/public/banner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/liferay/clay/HEAD/www/public/banner.png -------------------------------------------------------------------------------- /packages/demos/README.md: -------------------------------------------------------------------------------- 1 | # clay-demos 2 | 3 | Extended storybook demos for Clay components 4 | -------------------------------------------------------------------------------- /packages/clay-charts/src/scss/components/_title.scss: -------------------------------------------------------------------------------- 1 | .bb-title { 2 | font: 14px sans-serif; 3 | } 4 | -------------------------------------------------------------------------------- /packages/demos/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /www/public/clay_logo_w.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/liferay/clay/HEAD/www/public/clay_logo_w.png -------------------------------------------------------------------------------- /packages/clay-alert/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-badge/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-card/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-charts/src/scss/components/_brush.scss: -------------------------------------------------------------------------------- 1 | .bb-brush .extent { 2 | fill-opacity: 0.1; 3 | } 4 | -------------------------------------------------------------------------------- /packages/clay-core/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-form/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-icon/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-label/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-link/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-list/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-modal/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-nav/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-panel/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-table/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-tabs/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-breadcrumb/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-button/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-charts/src/scss/components/_area.scss: -------------------------------------------------------------------------------- 1 | .bb-area { 2 | stroke-width: 0; 3 | opacity: 0.2; 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-charts/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-drop-down/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-layout/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-pagination/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-popover/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-provider/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-shared/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-slider/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-sticker/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-toolbar/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-tooltip/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-autocomplete/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-color-picker/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-data-provider/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-date-picker/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-empty-state/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-localized-input/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-multi-select/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-multi-step-nav/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-navigation-bar/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-pagination-bar/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-progress-bar/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-time-picker/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-upper-toolbar/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /www/public/images/tv-at-beach.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/liferay/clay/HEAD/www/public/images/tv-at-beach.png -------------------------------------------------------------------------------- /packages/clay-charts/src/scss/components/_region.scss: -------------------------------------------------------------------------------- 1 | .bb-region { 2 | fill: steelblue; 3 | fill-opacity: 0.1; 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-loading-indicator/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/clay-management-toolbar/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /www/public/images/long_user_image.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/liferay/clay/HEAD/www/public/images/long_user_image.png -------------------------------------------------------------------------------- /www/public/images/thumbnail_dock.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/liferay/clay/HEAD/www/public/images/thumbnail_dock.jpg -------------------------------------------------------------------------------- /www/public/images/DeathtoStock_Desk4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/liferay/clay/HEAD/www/public/images/DeathtoStock_Desk4.jpg -------------------------------------------------------------------------------- /www/public/images/switch_components.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/liferay/clay/HEAD/www/public/images/switch_components.png -------------------------------------------------------------------------------- /www/public/images/thumbnail_coffee.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/liferay/clay/HEAD/www/public/images/thumbnail_coffee.jpg -------------------------------------------------------------------------------- /www/use-client-loader.mjs: -------------------------------------------------------------------------------- 1 | export default function UseClientLoader(source) { 2 | return `"use client";\n` + source; 3 | } 4 | -------------------------------------------------------------------------------- /packages/generator-clay-component/app/templates/_tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/generator-clay-component/app/templates/src/tests/__snapshots__/_index.tsx.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | -------------------------------------------------------------------------------- /www/public/images/thumbnail_placeholder.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/liferay/clay/HEAD/www/public/images/thumbnail_placeholder.gif -------------------------------------------------------------------------------- /packages/clay-charts/src/scss/components/_text.scss: -------------------------------------------------------------------------------- 1 | .bb-text { 2 | &.bb-empty { 3 | fill: #808080; 4 | font-size: 2em; 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/variables/_side-navigation.scss: -------------------------------------------------------------------------------- 1 | $sidenav-transition: all 0.5s ease !default; 2 | $sidenav-width: 320px !default; 3 | -------------------------------------------------------------------------------- /www/public/images/thumbnail_hot_air_ballon.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/liferay/clay/HEAD/www/public/images/thumbnail_hot_air_ballon.jpg -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "bracketSpacing": false, 3 | "singleQuote": true, 4 | "tabWidth": 4, 5 | "trailingComma": "es5", 6 | "useTabs": true 7 | } 8 | -------------------------------------------------------------------------------- /packages/clay-charts/src/scss/components/_bar.scss: -------------------------------------------------------------------------------- 1 | .bb-bar { 2 | stroke-width: 0; 3 | 4 | &._expanded_ { 5 | fill-opacity: 0.75; 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /packages/clay-css/src/images/images/empty_state.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/liferay/clay/HEAD/packages/clay-css/src/images/images/empty_state.gif -------------------------------------------------------------------------------- /packages/clay-css/src/images/images/search_state.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/liferay/clay/HEAD/packages/clay-css/src/images/images/search_state.gif -------------------------------------------------------------------------------- /packages/clay-tabs/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | 3 | - Update `nav-tabs` and `nav-underline` classes to `displayType` prop. 4 | -------------------------------------------------------------------------------- /packages/clay-css/src/images/images/success_state.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/liferay/clay/HEAD/packages/clay-css/src/images/images/success_state.gif -------------------------------------------------------------------------------- /packages/clay-table/stories/static/thumbnail_coffee.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/liferay/clay/HEAD/packages/clay-table/stories/static/thumbnail_coffee.jpg -------------------------------------------------------------------------------- /www/.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "root": true, 3 | "extends": ["next/core-web-vitals"], 4 | "rules": { 5 | "@next/next/no-img-element": "off" 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /.codesandbox/react-ts/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "include": ["./src/*"], 3 | "compilerOptions": { 4 | "lib": ["dom", "es2015"], 5 | "jsx": "react" 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /copyright.js: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © <%= YEAR %> Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/atlas/variables/_timelines.scss: -------------------------------------------------------------------------------- 1 | $timeline-border-color: $gray-900 !default; 2 | $timeline-icon-border-color: $gray-600 !default; 3 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/components/_media.scss: -------------------------------------------------------------------------------- 1 | .media { 2 | align-items: flex-start; 3 | display: flex; 4 | } 5 | 6 | .media-body { 7 | flex: 1; 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/cadmin/variables/_side-navigation.scss: -------------------------------------------------------------------------------- 1 | $cadmin-sidenav-transition: all 0.5s ease !default; 2 | $cadmin-sidenav-width: 320px !default; 3 | -------------------------------------------------------------------------------- /packages/clay-card/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | 3 | [Update `stickerProps`](https://github.com/liferay/clay/issues/3773#issuecomment-720658343) 4 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/atlas/variables/_type.scss: -------------------------------------------------------------------------------- 1 | $b-font-weight: $font-weight-semi-bold !default; 2 | 3 | $strong-font-weight: $font-weight-semi-bold !default; 4 | -------------------------------------------------------------------------------- /packages/clay-icon/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | 3 | - Icon anonymize.svg is deprecated as of v3.136.0 and will be removed with no replacement 4 | -------------------------------------------------------------------------------- /packages/clay-nav/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | 3 | - Remove `activeLabel` prop from Vertical component and make `triggerLabel` the one used instead 4 | -------------------------------------------------------------------------------- /packages/clay-css/src/images/images/empty_state_reduced_motion.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/liferay/clay/HEAD/packages/clay-css/src/images/images/empty_state_reduced_motion.gif -------------------------------------------------------------------------------- /packages/clay-css/src/images/images/search_state_reduced_motion.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/liferay/clay/HEAD/packages/clay-css/src/images/images/search_state_reduced_motion.gif -------------------------------------------------------------------------------- /packages/clay-css/src/images/images/success_state_reduced_motion.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/liferay/clay/HEAD/packages/clay-css/src/images/images/success_state_reduced_motion.gif -------------------------------------------------------------------------------- /packages/clay-css/src/scss/atlas/variables/_icons.scss: -------------------------------------------------------------------------------- 1 | $order-arrow-down-active-color: $gray-500 !default; 2 | $order-arrow-up-active-color: $order-arrow-down-active-color !default; 3 | -------------------------------------------------------------------------------- /packages/clay-label/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | 3 | - Remove `withClose` prop from hybrid component and new default API would behave as if `withClose` is false. 4 | -------------------------------------------------------------------------------- /packages/clay-modal/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | 3 | - Remove `withTitle` prop from Header component and new default API would behave as if `withTitle` is false. 4 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/atlas/variables/_quick-action.scss: -------------------------------------------------------------------------------- 1 | $quick-action-font-size: 1rem !default; // 16px 2 | 3 | $quick-action-item-disabled-opacity: $component-disabled-opacity !default; 4 | -------------------------------------------------------------------------------- /packages/clay-data-provider/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | 3 | - Remove the behavior of the prop `link` that accepts an asynchronous function with the return of a promise. 4 | -------------------------------------------------------------------------------- /www/app/_components/sandpack.module.css: -------------------------------------------------------------------------------- 1 | .code_preview { 2 | border: 1px solid #F3F3F3; 3 | border-radius: 4px; 4 | height: 300px; 5 | } 6 | 7 | .code_preview > div { 8 | height: 300px; 9 | } -------------------------------------------------------------------------------- /.github/semantic.yml: -------------------------------------------------------------------------------- 1 | --- 2 | # Configuration for the Semantic Pull Request bot. 3 | # https://github.com/probot/semantic-pull-requests 4 | 5 | allowMergeCommits: true 6 | 7 | titleAndCommits: true 8 | -------------------------------------------------------------------------------- /scripts/jest-setup.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2023 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import '@testing-library/jest-dom'; 7 | -------------------------------------------------------------------------------- /www/docs/css/Sheet.tsx: -------------------------------------------------------------------------------- 1 | type Props = { 2 | children: React.ReactNode; 3 | }; 4 | 5 | export function Sheet({children}: Props) { 6 | return
{children}
; 7 | } 8 | -------------------------------------------------------------------------------- /packages/clay-card/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/card@" 3 | version-git-message "chore: prepare @clayui/card@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-core/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/core@" 3 | version-git-message "chore: prepare @clayui/core@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-css/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/css@" 3 | version-git-message "chore: prepare @clayui/css@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-form/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/form@" 3 | version-git-message "chore: prepare @clayui/form@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-icon/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/icon@" 3 | version-git-message "chore: prepare @clayui/icon@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-link/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/link@" 3 | version-git-message "chore: prepare @clayui/link@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-list/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/list@" 3 | version-git-message "chore: prepare @clayui/list@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-multi-select/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | 3 | - [Rename from MultiSelect to Multiselect and multi-select to multiselect](https://github.com/liferay/clay/issues/3867) 4 | -------------------------------------------------------------------------------- /packages/clay-nav/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/nav@" 3 | version-git-message "chore: prepare @clayui/nav@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-tabs/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/tabs@" 3 | version-git-message "chore: prepare @clayui/tabs@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-alert/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/alert@" 3 | version-git-message "chore: prepare @clayui/alert@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-badge/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/badge@" 3 | version-git-message "chore: prepare @clayui/badge@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-button/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/button@" 3 | version-git-message "chore: prepare @clayui/button@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-charts/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/charts@" 3 | version-git-message "chore: prepare @clayui/charts@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-core/src/tree-view/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2021 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export * from './TreeView'; 7 | -------------------------------------------------------------------------------- /packages/clay-label/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/label@" 3 | version-git-message "chore: prepare @clayui/label@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-layout/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/layout@" 3 | version-git-message "chore: prepare @clayui/layout@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-modal/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/modal@" 3 | version-git-message "chore: prepare @clayui/modal@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-panel/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/panel@" 3 | version-git-message "chore: prepare @clayui/panel@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-shared/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/shared@" 3 | version-git-message "chore: prepare @clayui/shared@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-slider/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/slider@" 3 | version-git-message "chore: prepare @clayui/slider@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-table/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/table@" 3 | version-git-message "chore: prepare @clayui/table@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-popover/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/popover@" 3 | version-git-message "chore: prepare @clayui/popover@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-sticker/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/sticker@" 3 | version-git-message "chore: prepare @clayui/sticker@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-table/src/types.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export type TDelimiter = 'start' | 'end'; 7 | -------------------------------------------------------------------------------- /packages/clay-toolbar/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/toolbar@" 3 | version-git-message "chore: prepare @clayui/toolbar@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-tooltip/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/tooltip@" 3 | version-git-message "chore: prepare @clayui/tooltip@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-alert/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-badge/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-button/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | 3 | [Button sizes will be renamed to small (24px), regular (32px), large (40px)](https://github.com/liferay/clay/issues/5081#issue-1366550236) 4 | -------------------------------------------------------------------------------- /packages/clay-button/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-card/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-charts/src/scss/components/_point.scss: -------------------------------------------------------------------------------- 1 | .bb-circle._expanded_ { 2 | stroke-width: 1px; 3 | stroke: white; 4 | } 5 | 6 | .bb-selected-circle { 7 | fill: white; 8 | stroke-width: 2px; 9 | } 10 | -------------------------------------------------------------------------------- /packages/clay-charts/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-core/src/overlay-mask/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2022 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export * from './OverlayMask'; 7 | -------------------------------------------------------------------------------- /packages/clay-core/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-drop-down/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/drop-down@" 3 | version-git-message "chore: prepare @clayui/drop-down@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-form/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-icon/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-label/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-layout/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-link/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-list/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-modal/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-nav/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-panel/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-provider/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/provider@" 3 | version-git-message "chore: prepare @clayui/provider@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-shared/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-slider/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-table/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-tabs/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-breadcrumb/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/breadcrumb@" 3 | version-git-message "chore: prepare @clayui/breadcrumb@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-breadcrumb/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-core/src/language-picker/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2025 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export * from './LanguagePicker'; 7 | -------------------------------------------------------------------------------- /packages/clay-date-picker/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/date-picker@" 3 | version-git-message "chore: prepare @clayui/date-picker@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-date-picker/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-drop-down/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-empty-state/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/empty-state@" 3 | version-git-message "chore: prepare @clayui/empty-state@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-empty-state/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-pagination/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/pagination@" 3 | version-git-message "chore: prepare @clayui/pagination@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-pagination/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-popover/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-provider/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-sticker/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-time-picker/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/time-picker@" 3 | version-git-message "chore: prepare @clayui/time-picker@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-time-picker/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-toolbar/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-tooltip/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-autocomplete/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/autocomplete@" 3 | version-git-message "chore: prepare @clayui/autocomplete@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-autocomplete/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-charts/src/scss/components/_loading.scss: -------------------------------------------------------------------------------- 1 | .loading-icon { 2 | min-height: 320px; 3 | min-height: 320px; 4 | display: flex; 5 | flex-direction: row; 6 | align-items: center; 7 | vertical-align: middle; 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-color-picker/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/color-picker@" 3 | version-git-message "chore: prepare @clayui/color-picker@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-color-picker/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-core/src/vertical-nav/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2023 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export {VerticalNav} from './VerticalNav'; 7 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/_cadmin-variables.scss: -------------------------------------------------------------------------------- 1 | // INSERT @use rules 2 | 3 | @import '_license-text'; 4 | 5 | @import 'functions/_global-functions'; 6 | 7 | @import 'cadmin/_variables'; 8 | 9 | @import '_mixins'; 10 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/atlas/variables/_reorder.scss: -------------------------------------------------------------------------------- 1 | $clay-reorder-underlay-focus: () !default; 2 | $clay-reorder-underlay-focus: map-deep-merge( 3 | ( 4 | box-shadow: null, 5 | ), 6 | $clay-reorder-underlay-focus 7 | ); 8 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/variables/_c-root.scss: -------------------------------------------------------------------------------- 1 | /// This map outputs custom properties in the `:root` selector, use the Sass `map-merge` function to add additional custom properties to `:root`. 2 | 3 | $c-root: () !default; 4 | -------------------------------------------------------------------------------- /packages/clay-data-provider/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-form/BREAKING.md: -------------------------------------------------------------------------------- 1 | # List of Breaking Changes for 4.x 2 | 3 | - `onChange` will return only the value instead of the event. 4 | - Remove the CSS class `custom-control-outside` from checkboxes and radio inputs. 5 | -------------------------------------------------------------------------------- /packages/clay-localized-input/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-multi-select/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/multi-select@" 3 | version-git-message "chore: prepare @clayui/multi-select@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-multi-select/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-multi-step-nav/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-pagination-bar/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-progress-bar/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/progress-bar@" 3 | version-git-message "chore: prepare @clayui/progress-bar@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-progress-bar/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-upper-toolbar/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | bower_components 2 | build 3 | coverage 4 | lib 5 | node_modules 6 | *.log 7 | package-lock.json 8 | .env 9 | .gradle 10 | .esbuild-ci-builds 11 | .esbuild-ci-build.json 12 | # Local Netlify folder 13 | .netlify 14 | -------------------------------------------------------------------------------- /packages/clay-core/src/icon-selector/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2022 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export {IconSelector} from './IconSelector'; 7 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/atlas/variables/_c-root.scss: -------------------------------------------------------------------------------- 1 | // This map outputs custom properties in the `:root` selector, use the Sass `map-merge` function to add additional custom properties to `:root`. 2 | 3 | $c-root: () !default; 4 | -------------------------------------------------------------------------------- /packages/clay-data-provider/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/data-provider@" 3 | version-git-message "chore: prepare @clayui/data-provider@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-loading-indicator/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-management-toolbar/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/clay-multi-step-nav/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/multi-step-nav@" 3 | version-git-message "chore: prepare @clayui/multi-step-nav@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-navigation-bar/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/navigation-bar@" 3 | version-git-message "chore: prepare @clayui/navigation-bar@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-pagination-bar/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/pagination-bar@" 3 | version-git-message "chore: prepare @clayui/pagination-bar@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-shared/README.md: -------------------------------------------------------------------------------- 1 | # `@clayui/shared` 2 | 3 | > **This package is primarily intended for use within Clay components. For use outside, use at your own risk.** 4 | 5 | Shared utilities and hooks used across clay components 6 | -------------------------------------------------------------------------------- /packages/clay-shared/src/stack.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export const stack: Array> = []; 7 | -------------------------------------------------------------------------------- /packages/clay-upper-toolbar/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/upper-toolbar@" 3 | version-git-message "chore: prepare @clayui/upper-toolbar@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-localized-input/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/localized-input@" 3 | version-git-message "chore: prepare @clayui/localized-input@%s" 4 | -------------------------------------------------------------------------------- /packages/browserslist-config-clay/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "browserslist-config-clay@" 3 | version-git-message "chore: prepare browserslist-config-clay@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-core/src/drop-down/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2023 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export {Menu} from './Menu'; 7 | export {Item} from './Item'; 8 | -------------------------------------------------------------------------------- /packages/clay-loading-indicator/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/loading-indicator@" 3 | version-git-message "chore: prepare @clayui/loading-indicator@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-charts/src/scss/components/_axis.scss: -------------------------------------------------------------------------------- 1 | .bb-axis-x .tick { 2 | } 3 | .bb-axis-x-label { 4 | } 5 | 6 | .bb-axis-y .tick { 7 | } 8 | .bb-axis-y-label { 9 | } 10 | 11 | .bb-axis-y2 .tick { 12 | } 13 | .bb-axis-y2-label { 14 | } 15 | -------------------------------------------------------------------------------- /packages/clay-core/src/aria/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2023 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export {useFocusWithin, FocusWithinProvider} from './useFocusWithin'; 7 | -------------------------------------------------------------------------------- /packages/clay-core/src/picker/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2022 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export {Picker} from './Picker'; 7 | export {Option} from './Option'; 8 | -------------------------------------------------------------------------------- /packages/clay-management-toolbar/.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/management-toolbar@" 3 | version-git-message "chore: prepare @clayui/management-toolbar@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-toolbar/src/__tests__/__snapshots__/index.tsx.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`ClayToolbar renders 1`] = ` 4 |
5 |
9 | `; 10 | -------------------------------------------------------------------------------- /packages/generator-clay-component/app/templates/_tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /turbo.json: -------------------------------------------------------------------------------- 1 | { 2 | "pipeline": { 3 | "build": { 4 | "dependsOn": ["^build"], 5 | "outputs": ["lib/**"] 6 | }, 7 | "buildTypes": { 8 | "dependsOn": ["^buildTypes"], 9 | "outputs": ["lib/**/*.d.ts"] 10 | } 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /packages/browserslist-config-clay/config: -------------------------------------------------------------------------------- 1 | last 2 Chrome versions 2 | last 1 Edge versions 3 | last 2 Firefox versions 4 | last 1 Opera versions 5 | last 2 Safari versions 6 | last 1 ChromeAndroid versions 7 | last 2 iOS versions 8 | Firefox 52 9 | IE 11 10 | -------------------------------------------------------------------------------- /packages/clay-core/src/focus-trap/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2022 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export {FocusTrap} from './FocusTrap'; 7 | export {FocusMenu} from './FocusMenu'; 8 | -------------------------------------------------------------------------------- /packages/generator-clay-component/app/templates/_.yarnrc: -------------------------------------------------------------------------------- 1 | # Make `yarn version` produce the right commit message and tag for this package. 2 | version-tag-prefix "@clayui/<%= packageName %>@" 3 | version-git-message "chore: prepare @clayui/<%= packageName %>@%s" 4 | -------------------------------------------------------------------------------- /packages/clay-core/src/nav/index.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2023 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export {Nav} from './Nav'; 7 | export {Item} from './Item'; 8 | export {Link} from './Link'; 9 | -------------------------------------------------------------------------------- /packages/clay-navigation-bar/tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "declarationDir": "./lib" 5 | }, 6 | "extends": "../../tsconfig.declarations.json", 7 | "include": ["src"], 8 | "exclude": ["**/__tests__/**"] 9 | } 10 | -------------------------------------------------------------------------------- /packages/clay-provider/src/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2021 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export * from './Provider'; 7 | export {DataClient as __UNSTABLE_DataClient} from './DataClient'; 8 | -------------------------------------------------------------------------------- /.storybook/manager.js: -------------------------------------------------------------------------------- 1 | import {addons} from '@storybook/addons'; 2 | import {create} from '@storybook/theming'; 3 | 4 | const clayTheme = create({ 5 | base: 'light', 6 | brandTitle: 'Clay Storybook', 7 | }); 8 | 9 | addons.setConfig({ 10 | theme: clayTheme, 11 | }); 12 | -------------------------------------------------------------------------------- /packages/clay-charts/src/scss/components/_grid.scss: -------------------------------------------------------------------------------- 1 | .bb-grid { 2 | line { 3 | stroke: rgb(229, 229, 235); 4 | stroke-width: 0.5px; 5 | } 6 | 7 | text { 8 | fill: #aaa; 9 | } 10 | } 11 | 12 | .bb-xgrid, 13 | .bb-ygrid { 14 | } 15 | 16 | .bb-xgrid-focus { 17 | } 18 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/base-variables.scss: -------------------------------------------------------------------------------- 1 | // INSERT @use rules 2 | 3 | @import '_license-text'; 4 | 5 | @import 'functions/_global-functions'; 6 | 7 | // INSERT CUSTOM BASE VARS 8 | 9 | @import '_variables'; 10 | 11 | @import '_mixins'; 12 | 13 | // INSERT CUSTOM VARS 14 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/Question.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: 🤔 Question 3 | about: Issues for asking questions about Clay 4 | labels: 'type: question' 5 | --- 6 | 7 | 10 | 11 | ## What is your question? 12 | -------------------------------------------------------------------------------- /docs/clay_css_version_history.md: -------------------------------------------------------------------------------- 1 | # Clay CSS Version History 2 | 3 | [https://github.com/liferay/clay/wiki/Liferay-Portal-@clayui-css-Versions](https://github.com/liferay/clay/wiki/Liferay-Portal-@clayui-css-Versions) is a table of Clay CSS and Bootstrap versions shipped with Liferay Portal. 4 | -------------------------------------------------------------------------------- /packages/clay-charts/src/scss/components/_legend.scss: -------------------------------------------------------------------------------- 1 | .bb-legend-item { 2 | font-size: 12px; 3 | } 4 | 5 | .bb-legend-item-hidden { 6 | opacity: 0.15; 7 | } 8 | 9 | .bb-legend-background { 10 | opacity: 0.75; 11 | fill: white; 12 | stroke: lightgray; 13 | stroke-width: 1; 14 | } 15 | -------------------------------------------------------------------------------- /packages/clay-link/src/index.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import Link from './Link'; 7 | 8 | export {default as ClayLinkContext} from './Context'; 9 | export default Link; 10 | -------------------------------------------------------------------------------- /packages/clay-charts/src/scss/components/_focus.scss: -------------------------------------------------------------------------------- 1 | .bb-target { 2 | &.bb-focused { 3 | opacity: 1; 4 | } 5 | 6 | &.bb-focused { 7 | path.bb-line, 8 | path.bb-step { 9 | stroke-width: 2px; 10 | } 11 | } 12 | 13 | &.bb-defocused { 14 | opacity: 0.3 !important; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /packages/clay-css/src/images/icons/google-drive.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/base.scss: -------------------------------------------------------------------------------- 1 | // INSERT @use rules 2 | 3 | @import '_license-text'; 4 | 5 | @import 'functions/_global-functions'; 6 | 7 | // INSERT CUSTOM VARS 8 | 9 | @import '_variables'; 10 | 11 | @import '_mixins'; 12 | 13 | @import '_components'; 14 | 15 | // INSERT CUSTOM EXTENSIONS 16 | -------------------------------------------------------------------------------- /packages/clay-multi-select/src/__tests__/__snapshots__/index.tsx.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`Interactions Use custom function for filtering autocomplete results 1`] = `null`; 4 | 5 | exports[`Interactions Use custom function for filtering autocomplete results 2`] = `null`; 6 | -------------------------------------------------------------------------------- /packages/demos/src/recharts/index.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2018 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import ClayRechartsTooltip from './Tooltip'; 7 | import {COLORS} from './config'; 8 | 9 | export {COLORS, ClayRechartsTooltip}; 10 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/components/_resizer.scss: -------------------------------------------------------------------------------- 1 | .c-horizontal-resizer { 2 | @include clay-css($c-horizontal-resizer); 3 | 4 | &:hover { 5 | @include clay-css(map-get($c-horizontal-resizer, hover)); 6 | } 7 | 8 | &:focus { 9 | @include clay-css(map-get($c-horizontal-resizer, focus)); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/mixins/_clearfix.scss: -------------------------------------------------------------------------------- 1 | //// 2 | /// @group clearfix 3 | //// 4 | 5 | /// Bootstrap 4's Clearfix Mixin. This is deprecated and will be removed. 6 | /// @deprecated 7 | 8 | @mixin clearfix() { 9 | &::after { 10 | clear: both; 11 | content: ''; 12 | display: block; 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /packages/clay-css/src/images/icons/cursor.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/atlas-variables.scss: -------------------------------------------------------------------------------- 1 | // INSERT @use rules 2 | 3 | @import '_license-text'; 4 | 5 | @import 'functions/_global-functions'; 6 | 7 | // INSERT CUSTOM BASE VARS 8 | 9 | @import 'atlas/_variables'; 10 | 11 | @import '_variables'; 12 | 13 | @import '_mixins'; 14 | 15 | // INSERT CUSTOM VARS 16 | -------------------------------------------------------------------------------- /packages/clay-core/src/hooks/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2023 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export {useIsMounted} from './useIsMounted'; 7 | export {useIsFirstRender} from './useIsFirstRender'; 8 | export {useForwardRef} from './useForwardRef'; 9 | -------------------------------------------------------------------------------- /packages/clay-drop-down/src/Divider.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import React from 'react'; 7 | 8 | const Divider = () =>
  • ; 9 | 10 | export default Divider; 11 | -------------------------------------------------------------------------------- /packages/clay-nav/src/index.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import {Nav} from '@clayui/core'; 7 | 8 | import {ClayVerticalNav} from './Vertical'; 9 | 10 | export {ClayVerticalNav}; 11 | 12 | export default Nav; 13 | -------------------------------------------------------------------------------- /www/app/docs/(layout)/layout.module.css: -------------------------------------------------------------------------------- 1 | .content { 2 | max-width: 869px; 3 | padding-top: 38px; 4 | } 5 | 6 | .main { 7 | margin-left: 280px; 8 | padding-left: 64px; 9 | } 10 | 11 | @media (max-width: 520px) { 12 | .main { 13 | margin-left: inherit; 14 | padding-left: inherit; 15 | padding: 0 20px; 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /tsconfig.global.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.declarations.json", 3 | "compilerOptions": { 4 | "noEmit": true, 5 | "declaration": true, 6 | "emitDeclarationOnly": false, 7 | "paths": { 8 | "@clayui/*": ["node_modules/@clayui/*/src"] 9 | } 10 | }, 11 | "include": ["./packages/clay-*/src/**/*", "*.tsx", "*.ts"] 12 | } 13 | -------------------------------------------------------------------------------- /packages/clay-core/src/side-panel/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2025 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export {SidePanel} from './SidePanel'; 7 | export {SidePanelWithDrilldown} from './SidePanelWithDrilldown'; 8 | export type {Props as SidePanelProps} from './SidePanel'; 9 | -------------------------------------------------------------------------------- /packages/clay-core/src/typography/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2022 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export {Heading} from './Heading'; 7 | export {Text} from './Text'; 8 | export {TextHighlight} from './TextHighlight'; 9 | export type {ColorType} from './Text'; 10 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/atlas.scss: -------------------------------------------------------------------------------- 1 | // INSERT @use rules 2 | 3 | @import '_license-text'; 4 | 5 | @import 'functions/_global-functions'; 6 | 7 | // INSERT CUSTOM VARS 8 | 9 | @import 'atlas/_variables'; 10 | 11 | @import '_variables'; 12 | 13 | @import '_mixins'; 14 | 15 | @import '_components'; 16 | 17 | // INSERT CUSTOM EXTENSIONS 18 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/cadmin/components/_resizer.scss: -------------------------------------------------------------------------------- 1 | .c-horizontal-resizer { 2 | @include clay-css($cadmin-c-horizontal-resizer); 3 | 4 | &:hover { 5 | @include clay-css(map-get($cadmin-c-horizontal-resizer, hover)); 6 | } 7 | 8 | &:focus { 9 | @include clay-css(map-get($cadmin-c-horizontal-resizer, focus)); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/variables/_jumbotron.scss: -------------------------------------------------------------------------------- 1 | /// @deprecated as of v3.x with no replacement 2 | 3 | $jumbotron-bg: $gray-200 !default; 4 | 5 | /// @deprecated as of v3.x with no replacement 6 | 7 | $jumbotron-color: null !default; 8 | 9 | /// @deprecated as of v3.x with no replacement 10 | 11 | $jumbotron-padding: 2rem !default; 12 | -------------------------------------------------------------------------------- /packages/clay-multi-step-nav/src/Divider.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import React from 'react'; 7 | 8 | const MultiStepNavDivider = () =>
    ; 9 | 10 | export default MultiStepNavDivider; 11 | -------------------------------------------------------------------------------- /packages/clay-core/src/live-announcer/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2022 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export {LiveAnnouncer} from './LiveAnnouncer'; 7 | export {VisuallyHidden} from './VisuallyHidden'; 8 | 9 | export type {AnnouncerAPI} from './LiveAnnouncer'; 10 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | *.d.ts 2 | *.mock.json 3 | bower_components 4 | copyright.js 5 | coverage 6 | lib 7 | clayui.com/.cache 8 | clayui.com/public 9 | clayui.com/react-docgen 10 | clayui.com/static 11 | node_modules 12 | package-lock.json 13 | /packages/clay-css/src/js/**/*.js 14 | packages/generator-clay-component/app/templates 15 | yarn.lock 16 | .next 17 | /www -------------------------------------------------------------------------------- /packages/clay-tooltip/src/index.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import {Tooltip} from './Tooltip'; 7 | import {ClayTooltipProvider} from './TooltipProvider'; 8 | 9 | export {Tooltip, ClayTooltipProvider}; 10 | 11 | export default Tooltip; 12 | -------------------------------------------------------------------------------- /packages/clay-popover/src/index.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2024 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import {Popover} from './Popover'; 7 | 8 | import type {ALIGN_POSITIONS} from './Popover'; 9 | 10 | export {Popover}; 11 | export type {ALIGN_POSITIONS}; 12 | export default Popover; 13 | -------------------------------------------------------------------------------- /packages/clay-shared/src/__tests__/__snapshots__/Portal.tsx.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`Portal pass className and id to the root element 1`] = ` 4 | 5 |
    6 |
    10 |
    13 |
    14 | 15 | `; 16 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/Icon.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: 🔣 Icon 3 | about: Issues for filing a new Icon 4 | labels: 'comp: icons' 5 | --- 6 | 7 | 11 | 12 | ## Link the LEXI Jira Issue. 13 | 14 | ## Attach the SVG. 15 | -------------------------------------------------------------------------------- /packages/clay-core/src/vertical-bar/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2022 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export {VerticalBar} from './VerticalBar'; 7 | export {Bar} from './Bar'; 8 | export {Item} from './Item'; 9 | export {Panel} from './Panel'; 10 | export {Content} from './Content'; 11 | -------------------------------------------------------------------------------- /packages/clay-link/src/Context.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import React from 'react'; 7 | 8 | const context = React.createContext('a'); 9 | 10 | context.displayName = 'ClayLinkContext'; 11 | 12 | export default context; 13 | -------------------------------------------------------------------------------- /www/renoun.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "https://renoun.dev/schema.json", 3 | "theme": "github-light", 4 | "languages": [ 5 | "jsx", 6 | "typescript", 7 | "tsx", 8 | "javascript", 9 | "js", 10 | "shell", 11 | "html", 12 | "scss" 13 | ], 14 | "git": { 15 | "source": "https://github.com/liferay/clay" 16 | }, 17 | "siteUrl": "https://clayui.com" 18 | } 19 | -------------------------------------------------------------------------------- /packages/clay-shared/src/useId.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import {useMemo} from 'react'; 7 | 8 | let counter = 0; 9 | 10 | export function useId() { 11 | return useMemo(() => { 12 | counter++; 13 | 14 | return `clay-id-${counter}`; 15 | }, []); 16 | } 17 | -------------------------------------------------------------------------------- /packages/browserslist-config-clay/README.md: -------------------------------------------------------------------------------- 1 | # browserslist-config-clay 2 | 3 | Clay components shareable config for Browserslist. 4 | 5 | ## Installation 6 | 7 | ``` 8 | npm install browserslist-config-clay -D 9 | ``` 10 | 11 | ## Usage 12 | 13 | Add this your `package.json` file: 14 | 15 | ``` 16 | "browserslist": [ 17 | "extends browserslist-config-clay" 18 | ] 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/clay-core/src/table/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2023 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export {ForwardBody as Body} from './Body'; 7 | export {Cell} from './Cell'; 8 | export {ForwardHead as Head} from './Head'; 9 | export {ForwardRow as Row} from './Row'; 10 | export {Table} from './Table'; 11 | -------------------------------------------------------------------------------- /packages/browserslist-config-clay/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "browserslist-config-clay", 3 | "version": "3.106.1", 4 | "description": "Clay components Browserslist Shared Config", 5 | "main": "index.js", 6 | "repository": "https://github.com/liferay/clay", 7 | "license": "BSD-3-Clause", 8 | "keywords": [ 9 | "clay", 10 | "browserslist", 11 | "browserslist-config" 12 | ] 13 | } 14 | -------------------------------------------------------------------------------- /packages/clay-autocomplete/src/index.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import {Autocomplete} from './Autocomplete'; 7 | import Item from './Item'; 8 | import LegacyAutocomplete from './LegacyAutocomplete'; 9 | 10 | export {Autocomplete, Item}; 11 | export default LegacyAutocomplete; 12 | -------------------------------------------------------------------------------- /www/app/docs/(main)/(main)/docs.module.css: -------------------------------------------------------------------------------- 1 | .content { 2 | max-width: 869px; 3 | padding-top: 38px; 4 | } 5 | 6 | .banner { 7 | margin: 45px 0; 8 | max-width: 100%; 9 | } 10 | 11 | .section { 12 | display: grid; 13 | gap: 35px; 14 | grid-template-columns: 1fr 1fr 1fr; 15 | } 16 | 17 | @media (max-width: 520px) { 18 | .section { 19 | grid-template-columns: 1fr 1fr; 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/components/_navigation-bar.scss: -------------------------------------------------------------------------------- 1 | .navigation-bar { 2 | @include clay-navbar-size($navigation-bar-size); 3 | @include clay-navbar-variant($navigation-bar-base); 4 | } 5 | 6 | .navigation-bar-light { 7 | @include clay-navbar-variant($navigation-bar-light); 8 | } 9 | 10 | .navigation-bar-secondary { 11 | @include clay-navbar-variant($navigation-bar-secondary); 12 | } 13 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/components/_transitions.scss: -------------------------------------------------------------------------------- 1 | .fade { 2 | @include transition($transition-fade); 3 | 4 | &:not(.show) { 5 | opacity: 0; 6 | } 7 | } 8 | 9 | .collapse { 10 | &:not(.show) { 11 | display: none; 12 | } 13 | } 14 | 15 | .collapsing { 16 | height: 0; 17 | overflow: hidden; 18 | position: relative; 19 | 20 | @include transition($transition-collapse); 21 | } 22 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/mixins/_monospace.scss: -------------------------------------------------------------------------------- 1 | //// 2 | /// @group utilities 3 | //// 4 | 5 | /// A mixin for creating monospaced elements. 6 | /// @param {Number} $size - The width and height of the element 7 | /// @todo 8 | /// - Add @example 9 | /// - Add @link to documentation 10 | 11 | @mixin clay-monospace($size) { 12 | height: $size; 13 | line-height: $size; 14 | width: $size; 15 | } 16 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/Clayui.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: 🕸Clayui.com 3 | about: Issues for filing about clayui.com 4 | labels: 'comp: clayui.com' 5 | --- 6 | 7 | 11 | 12 | ## What are the steps to reproduce? 13 | 14 | ## What is the expected result? 15 | -------------------------------------------------------------------------------- /packages/clay-navigation-bar/src/context.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2022 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import {createContext} from 'react'; 7 | 8 | type ValueContext = { 9 | ariaCurrent: 'page' | null; 10 | }; 11 | 12 | export const NavigationBarContext = createContext({ 13 | ariaCurrent: 'page', 14 | }); 15 | -------------------------------------------------------------------------------- /packages/clay-button/src/index.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import Button, {IProps} from './Button'; 7 | import ClayButtonWithIcon, {Props} from './ButtonWithIcon'; 8 | 9 | export type {Props as ButtonWithIconProps, IProps as ButtonProps}; 10 | export {ClayButtonWithIcon}; 11 | export default Button; 12 | -------------------------------------------------------------------------------- /packages/clay-shared/src/usePrevious.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2025 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import {useEffect, useRef} from 'react'; 7 | 8 | export function usePrevious(value: T) { 9 | const ref = useRef(value); 10 | 11 | useEffect(() => { 12 | ref.current = value; 13 | }, [value]); 14 | 15 | return ref.current; 16 | } 17 | -------------------------------------------------------------------------------- /packages/clay-sticker/src/index.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import Sticker from './Sticker'; 7 | 8 | import type {DisplayType} from './Sticker'; 9 | 10 | type IClayStickerProps = React.ComponentProps; 11 | 12 | export type {DisplayType, IClayStickerProps}; 13 | export default Sticker; 14 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/atlas/variables/_time.scss: -------------------------------------------------------------------------------- 1 | $clay-time-btn: () !default; 2 | $clay-time-btn: map-deep-merge( 3 | ( 4 | color: $secondary, 5 | focus: ( 6 | box-shadow: 0 0 0 1px $primary-l0, 7 | ), 8 | ), 9 | $clay-time-btn 10 | ); 11 | 12 | $clay-time-inner-spin: () !default; 13 | $clay-time-inner-spin: map-merge( 14 | ( 15 | border-color: $secondary-l2, 16 | ), 17 | $clay-time-inner-spin 18 | ); 19 | -------------------------------------------------------------------------------- /packages/clay-css/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | var path = require('path'); 7 | 8 | var srcDir = path.join(__dirname, 'src'); 9 | 10 | module.exports = { 11 | buildDir: path.join(__dirname, 'lib'), 12 | includePaths: [path.join(srcDir, 'scss')], 13 | libDir: path.join(__dirname, 'lib'), 14 | srcDir, 15 | }; 16 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/cadmin/components/_navigation-bar.scss: -------------------------------------------------------------------------------- 1 | .navigation-bar { 2 | @include clay-navbar-size($cadmin-navigation-bar-size); 3 | @include clay-navbar-variant($cadmin-navigation-bar-base); 4 | } 5 | 6 | .navigation-bar-light { 7 | @include clay-navbar-variant($cadmin-navigation-bar-light); 8 | } 9 | 10 | .navigation-bar-secondary { 11 | @include clay-navbar-variant($cadmin-navigation-bar-secondary); 12 | } 13 | -------------------------------------------------------------------------------- /packages/clay-management-toolbar/src/index.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | /** 7 | * @deprecated since version 3.54.x. 8 | */ 9 | 10 | import ClayManagementToolbar from './ManagementToolbar'; 11 | import ClayResultsBar from './ResultsBar'; 12 | 13 | export {ClayResultsBar}; 14 | export default ClayManagementToolbar; 15 | -------------------------------------------------------------------------------- /packages/clay-multi-step-nav/src/index.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import ClayMultiStepNav from './MultiStepNav'; 7 | import {MultiStepNavWithBasicItems} from './MultiStepNavWithBasicItems'; 8 | 9 | export {MultiStepNavWithBasicItems as ClayMultiStepNavWithBasicItems}; 10 | 11 | export default ClayMultiStepNav; 12 | -------------------------------------------------------------------------------- /packages/clay-tooltip/src/__tests__/__snapshots__/index.tsx.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`ClayTooltip renders 1`] = ` 4 |
    5 | 19 | `; 20 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/atlas/variables/_tooltip.scss: -------------------------------------------------------------------------------- 1 | $tooltip-bg: $dark-d2 !default; 2 | $tooltip-box-shadow: 0 1px 4px 0px rgba(0, 0, 0, 0.4) !default; 3 | $tooltip-font-size: 0.875rem !default; // 14px 4 | $tooltip-max-width: 230px !default; 5 | $tooltip-opacity: 1 !default; 6 | $tooltip-padding-x: 0.75rem !default; // 12px 7 | $tooltip-padding-y: 0.75rem !default; // 12px 8 | 9 | $tooltip-arrow-offset: 0.5rem !default; // 8px 10 | -------------------------------------------------------------------------------- /packages/clay-shared/src/useIsFirstRender.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2023 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import {useRef} from 'react'; 7 | 8 | export function useIsFirstRender() { 9 | const isFirst = useRef(true); 10 | 11 | if (isFirst.current) { 12 | isFirst.current = false; 13 | 14 | return true; 15 | } 16 | 17 | return isFirst.current; 18 | } 19 | -------------------------------------------------------------------------------- /tsconfig.declarations.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "allowJs": false, 5 | "declaration": true, 6 | "emitDeclarationOnly": true, 7 | "noEmit": false, 8 | "removeComments": false, 9 | "skipLibCheck": true, 10 | "paths": {} 11 | }, 12 | "exclude": [ 13 | "node_modules", 14 | "packages/**/lib", 15 | "packages/generator-clay-component", 16 | "**/__tests__/**" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /.codesandbox/react-ts/src/index.tsx: -------------------------------------------------------------------------------- 1 | import * as React from 'react'; 2 | import {render} from 'react-dom'; 3 | import '@clayui/css/lib/css/atlas.css'; 4 | 5 | function App() { 6 | return ( 7 |
    8 |

    Hello CodeSandbox

    9 |

    Add some clay components to see the magic happen!

    10 |
    11 | ); 12 | } 13 | 14 | const rootElement = document.getElementById('root'); 15 | render(, rootElement); 16 | -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | *.d.ts 2 | *.mock.json 3 | .git 4 | bower_components 5 | copyright.js 6 | coverage 7 | lib 8 | /clayui.com/.cache 9 | /clayui.com/public 10 | /clayui.com/react-docgen 11 | /clayui.com/static 12 | node_modules 13 | package-lock.json 14 | /packages/clay-css/**/*.md 15 | /packages/clay-css/src/js/**/*.js 16 | /packages/clay-css/src/scss/bootstrap/**/*.scss 17 | /packages/generator-clay-component/app/templates 18 | yarn.lock 19 | .next -------------------------------------------------------------------------------- /packages/clay-core/src/hooks/useForwardRef.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2023 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import {Ref, useImperativeHandle, useRef} from 'react'; 7 | 8 | export function useForwardRef(outRef: Ref) { 9 | const ref = useRef(null); 10 | 11 | useImperativeHandle(outRef, () => ref.current!, []); 12 | 13 | return ref; 14 | } 15 | -------------------------------------------------------------------------------- /.codesandbox/react/src/index.js: -------------------------------------------------------------------------------- 1 | import * as React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import '@clayui/css/lib/css/atlas.css'; 4 | 5 | function App() { 6 | return ( 7 |
    8 |

    Hello CodeSandbox

    9 |

    Add some clay components to see the magic happen!

    10 |
    11 | ); 12 | } 13 | 14 | const rootElement = document.getElementById('root'); 15 | ReactDOM.render(, rootElement); 16 | -------------------------------------------------------------------------------- /packages/clay-core/src/hooks/useIsFirstRender.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2023 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import {useRef} from 'react'; 7 | 8 | export function useIsFirstRender(): boolean { 9 | const isFirst = useRef(true); 10 | 11 | if (isFirst.current) { 12 | isFirst.current = false; 13 | 14 | return true; 15 | } 16 | 17 | return isFirst.current; 18 | } 19 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/variables/_images.scss: -------------------------------------------------------------------------------- 1 | $thumbnail-bg: $body-bg !default; 2 | $thumbnail-border-color: $gray-300 !default; 3 | $thumbnail-border-width: $border-width !default; 4 | 5 | $thumbnail-border-radius: $border-radius !default; 6 | $thumbnail-box-shadow: 0 1px 2px rgba($black, 0.075) !default; 7 | $thumbnail-padding: 0.25rem !default; 8 | 9 | $figure-caption-color: $gray-600 !default; 10 | $figure-caption-font-size: 90% !default; 11 | -------------------------------------------------------------------------------- /packages/clay-panel/src/Title.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import React from 'react'; 7 | 8 | export const Title = ({ 9 | children, 10 | className, 11 | ...otherProps 12 | }: React.HTMLAttributes) => { 13 | return ( 14 |
    15 | {children} 16 |
    17 | ); 18 | }; 19 | -------------------------------------------------------------------------------- /packages/generator-clay-component/app/templates/_README.md: -------------------------------------------------------------------------------- 1 | # <%= kebabCaseName %> 2 | 3 | <%= repoDescription %> 4 | 5 | ## Setup 6 | 7 | 1. Install `yarn` 8 | 9 | 2. Install local dependencies: 10 | 11 | ``` 12 | yarn 13 | ``` 14 | 15 | ## Contribute 16 | 17 | We'd love to get contributions from you! Please, check our [Contributing Guidelines](https://github.com/liferay/clay/blob/master/CONTRIBUTING.md) to see how you can help us improve. 18 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/Proposal.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: 💍 Proposal 3 | about: Issues for proposing a change to Clay 4 | labels: rfc 5 | --- 6 | 7 | 11 | 12 | ## What is your proposal? 13 | 14 | ## Why would adopting this proposal be beneficial? 15 | 16 | ## What are the alternatives to this proposal? 17 | -------------------------------------------------------------------------------- /packages/clay-core/src/collection/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2022 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export {getKey, excludeProps} from './utils'; 7 | export {Collection} from './Collection'; 8 | export {useCollection, useCollectionKeys} from './useCollection'; 9 | export {useVirtual} from './useVirtual'; 10 | export type {ChildrenFunction, ICollectionProps} from './types'; 11 | -------------------------------------------------------------------------------- /packages/clay-data-provider/src/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import {DataProvider} from './DataProvider'; 7 | import {FetchPolicy, NetworkStatus, useResource} from './useResource'; 8 | 9 | export type {Sorting} from './useResource'; 10 | export {DataProvider, FetchPolicy, NetworkStatus, useResource}; 11 | export default DataProvider; 12 | -------------------------------------------------------------------------------- /packages/clay-core/src/side-panel/Body.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2025 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import React from 'react'; 7 | 8 | type Props = { 9 | /** 10 | * Children content to render a content. 11 | */ 12 | children: React.ReactNode; 13 | }; 14 | 15 | export function Body({children}: Props) { 16 | return
    {children}
    ; 17 | } 18 | -------------------------------------------------------------------------------- /packages/clay-css/src/images/icons/circle.svg: -------------------------------------------------------------------------------- 1 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /packages/clay-pagination/src/index.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import {Pagination} from './Pagination'; 7 | import {ClayPaginationWithBasicItems} from './PaginationWithBasicItems'; 8 | 9 | export {Ellipsis} from './Ellipsis'; 10 | export {Item} from './Item'; 11 | export {Pagination, ClayPaginationWithBasicItems}; 12 | export default Pagination; 13 | -------------------------------------------------------------------------------- /lerna.json: -------------------------------------------------------------------------------- 1 | { 2 | "version": "3.156.0", 3 | "npmClient": "yarn", 4 | "command": { 5 | "publish": { 6 | "ignoreChanges": [ 7 | "**/stories/*", 8 | "**/__tests__/**", 9 | "**/*.md", 10 | "**/*.mdx", 11 | "**/docs/*", 12 | "**/packages/demos/**", 13 | "**/packages/generator-clay-component/**", 14 | "**/packages/browserslist-config-clay/**" 15 | ], 16 | "message": "chore(release): publish %s packages" 17 | } 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /packages/browserslist-config-clay/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | module.exports = [ 7 | 'last 2 Chrome versions', 8 | 'last 1 Edge versions', 9 | 'last 2 Firefox versions', 10 | 'last 1 Opera versions', 11 | 'last 2 Safari versions', 12 | 'last 1 ChromeAndroid versions', 13 | 'last 2 iOS versions', 14 | 'Firefox 52', 15 | 'IE 11', 16 | ]; 17 | -------------------------------------------------------------------------------- /packages/clay-charts/src/__tests__/__snapshots__/ClayCharts.tsx.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`ClayCharts renders 1`] = ` 4 |
    7 | `; 8 | 9 | exports[`ClayCharts renders a map 1`] = ` 10 |
    18 | `; 19 | 20 | exports[`ClayCharts renders when using a ref 1`] = `
    `; 21 | -------------------------------------------------------------------------------- /packages/clay-core/src/table/ScopeContext.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2023 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import React, {useContext} from 'react'; 7 | 8 | export enum Scope { 9 | Head = 'head', 10 | Body = 'body', 11 | } 12 | 13 | export const ScopeContext = React.createContext(Scope.Head); 14 | 15 | export function useScope() { 16 | return useContext(ScopeContext); 17 | } 18 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/atlas/variables/_drilldown.scss: -------------------------------------------------------------------------------- 1 | $drilldown-dropdown-item-indicator-start: () !default; 2 | $drilldown-dropdown-item-indicator-start: map-merge( 3 | ( 4 | top: 0.5rem, 5 | ), 6 | $drilldown-dropdown-item-indicator-start 7 | ); 8 | 9 | $drilldown-dropdown-item-indicator-end: () !default; 10 | $drilldown-dropdown-item-indicator-end: map-merge( 11 | ( 12 | top: 0.5rem, 13 | ), 14 | $drilldown-dropdown-item-indicator-end 15 | ); 16 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/cadmin/components/_transitions.scss: -------------------------------------------------------------------------------- 1 | .fade, 2 | &.fade { 3 | @include transition($cadmin-transition-fade); 4 | 5 | &:not(.show) { 6 | opacity: 0; 7 | } 8 | } 9 | 10 | .collapse, 11 | &.collapse { 12 | &:not(.show) { 13 | display: none; 14 | } 15 | } 16 | 17 | .collapsing, 18 | &.collapsing { 19 | height: 0; 20 | overflow: hidden; 21 | position: relative; 22 | 23 | @include transition($cadmin-transition-collapse); 24 | } 25 | -------------------------------------------------------------------------------- /packages/clay-css/src/scss/components/_application-bar.scss: -------------------------------------------------------------------------------- 1 | .application-bar { 2 | flex-wrap: nowrap; 3 | 4 | @include clay-navbar-size($application-bar-size); 5 | @include clay-navbar-variant($application-bar-base); 6 | 7 | .container, 8 | .container-fluid { 9 | flex-wrap: nowrap; 10 | } 11 | 12 | .navbar-nav { 13 | flex-wrap: nowrap; 14 | } 15 | } 16 | 17 | .application-bar-dark { 18 | @include clay-navbar-variant($application-bar-dark); 19 | } 20 | -------------------------------------------------------------------------------- /packages/clay-multi-select/src/index.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2025 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import {Item} from '@clayui/autocomplete'; 7 | 8 | import {MultiSelect, itemLabelFilter} from './MultiSelect'; 9 | 10 | import type {IProps} from './MultiSelect'; 11 | 12 | export {itemLabelFilter}; 13 | export type {IProps}; 14 | export default Object.assign(MultiSelect, {Item}); 15 | -------------------------------------------------------------------------------- /packages/clay-multi-step-nav/src/Title.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import React from 'react'; 7 | 8 | type Props = { 9 | /** 10 | * Title content. 11 | */ 12 | children?: React.ReactNode; 13 | }; 14 | 15 | const Title = ({children}: Props) => ( 16 |
    {children}
    17 | ); 18 | 19 | export default Title; 20 | -------------------------------------------------------------------------------- /packages/clay-css/src/images/icons/italic.svg: -------------------------------------------------------------------------------- 1 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /packages/clay-css/src/images/icons/square.svg: -------------------------------------------------------------------------------- 1 | 7 | -------------------------------------------------------------------------------- /packages/clay-shared/src/throttle.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2023 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | export function throttle(callback: Function, limit: number) { 7 | var waiting = false; 8 | 9 | return (...args: Array) => { 10 | if (!waiting) { 11 | callback(...args); 12 | waiting = true; 13 | 14 | setTimeout(() => { 15 | waiting = false; 16 | }, limit); 17 | } 18 | }; 19 | } 20 | -------------------------------------------------------------------------------- /packages/clay-css/src/images/icons/hr.svg: -------------------------------------------------------------------------------- 1 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /packages/clay-css/src/images/icons/slash.svg: -------------------------------------------------------------------------------- 1 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /packages/clay-drop-down/src/index.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import DropDown from './DropDown'; 7 | import {ClayDropDownWithDrilldown} from './DropDownWithDrilldown'; 8 | import {ClayDropDownWithItems} from './DropDownWithItems'; 9 | import {Align} from './Menu'; 10 | 11 | export {Align, DropDown, ClayDropDownWithItems, ClayDropDownWithDrilldown}; 12 | export default DropDown; 13 | -------------------------------------------------------------------------------- /packages/clay-pagination-bar/src/index.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import {PaginationBar} from './PaginationBar'; 7 | import {ClayPaginationBarWithBasicItems} from './PaginationBarWithBasicItems'; 8 | 9 | export {ClayPaginationBarWithBasicItems, PaginationBar}; 10 | export {DropDown} from './DropDown'; 11 | export {Results} from './Results'; 12 | export default PaginationBar; 13 | -------------------------------------------------------------------------------- /.codesandbox/react/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 9 | 10 | 11 | React App 12 | 13 | 14 | 15 | 18 |
    19 | 20 | 21 | -------------------------------------------------------------------------------- /.codesandbox/react-ts/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 9 | 10 | 11 | React App 12 | 13 | 14 | 15 | 18 |
    19 | 20 | 21 | -------------------------------------------------------------------------------- /packages/clay-core/src/side-panel/Title.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2025 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import React from 'react'; 7 | 8 | import {useSidePanel} from './context'; 9 | 10 | export function Title({children}: React.HTMLAttributes) { 11 | const {titleId} = useSidePanel(); 12 | 13 | return ( 14 | 15 | {children} 16 | 17 | ); 18 | } 19 | -------------------------------------------------------------------------------- /scripts/jest-clay-lerna-resolver.js: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | 'use strict'; 7 | 8 | const resolve = require('resolve'); 9 | 10 | module.exports = function (file, data) { 11 | if (file.indexOf('clay-') === 0 || file.indexOf('@clayui') === 0) { 12 | data.packageFilter = function (pkg) { 13 | return {main: pkg['ts:main']}; 14 | }; 15 | } 16 | 17 | return resolve.sync(file, data); 18 | }; 19 | -------------------------------------------------------------------------------- /www/app/_components/navbar.module.css: -------------------------------------------------------------------------------- 1 | .navbar { 2 | padding: 16px 0; 3 | padding-right: 64px; 4 | display: flex; 5 | align-items: center; 6 | justify-content: space-between; 7 | } 8 | 9 | .navbar_items { 10 | display: flex; 11 | align-items: center; 12 | gap: 15px; 13 | } 14 | 15 | .navbar a { 16 | color: #6b6c7e; 17 | } 18 | 19 | .navbar_item { 20 | font-weight: 500; 21 | font-size: 16px; 22 | } 23 | 24 | @media (max-width: 520px) { 25 | .navbar { 26 | padding-right: inherit; 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /packages/clay-core/src/nav/Item.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import classNames from 'classnames'; 7 | import React from 'react'; 8 | 9 | export const Item = ({ 10 | children, 11 | className, 12 | ...otherProps 13 | }: React.HTMLAttributes) => { 14 | return ( 15 |
  • 16 | {children} 17 |
  • 18 | ); 19 | }; 20 | -------------------------------------------------------------------------------- /packages/clay-css/src/images/icons/bars.svg: -------------------------------------------------------------------------------- 1 | 7 | -------------------------------------------------------------------------------- /packages/clay-css/src/images/icons/play.svg: -------------------------------------------------------------------------------- 1 | 7 | -------------------------------------------------------------------------------- /packages/clay-panel/src/Body.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * SPDX-FileCopyrightText: © 2019 Liferay, Inc. 3 | * SPDX-License-Identifier: BSD-3-Clause 4 | */ 5 | 6 | import classNames from 'classnames'; 7 | import React from 'react'; 8 | 9 | export const Body = ({ 10 | children, 11 | className, 12 | ...otherProps 13 | }: React.HTMLAttributes) => { 14 | return ( 15 |
    16 | {children} 17 |
    18 | ); 19 | }; 20 | -------------------------------------------------------------------------------- /www/app/_components/SandpackStyles.tsx: -------------------------------------------------------------------------------- 1 | 'use client'; 2 | 3 | import {getSandpackCssText} from '@codesandbox/sandpack-react'; 4 | import {useServerInsertedHTML} from 'next/navigation'; 5 | 6 | /** 7 | * Ensures CSSinJS styles are loaded server side. 8 | */ 9 | export const SandPackCSS = () => { 10 | useServerInsertedHTML(() => { 11 | return ( 12 |