WDS Multi-Select component https://github.com/user-attachments/assets/2809dd44-2a1a-47ba-bccc-4d0bf313aa99 Note: This is a kind of hacky multi-select component. React aria does not provide us with any multi select component. So we are making it with existing components like popover, listbox, and autocomplete. /ok-to-test tags="@tag.Anvil" <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Introduced a new MultiSelect component that offers a dynamic multi-select interface with responsive display, clear error messaging, and loading states. - Added a new MultiSelectValue component to enhance the display of selected items in the MultiSelect interface. - **Enhancements** - Improved styling flexibility across key components—including ListBox, ListBoxItem, TextField, and Select—to support custom appearances. - Refined Calendar and DatePicker interactions for a smoother, more reliable user experience. - Added new export statements for selectStyles and fieldErrorStyles to improve modularity and accessibility. - Updated the version of the react-aria-components dependency for enhanced performance and features. <!-- end of auto-generated comment: release notes by coderabbit.ai --> <!-- This is an auto-generated comment: Cypress test results --> > [!TIP] > 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉 > Workflow run: <https://github.com/appsmithorg/appsmith/actions/runs/13386938922> > Commit: 9d486cbe335446c351b098a420f0e8d0d06b268c > <a href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=13386938922&attempt=1" target="_blank">Cypress dashboard</a>. > Tags: `@tag.Anvil` > Spec: > <hr>Tue, 18 Feb 2025 09:33:19 UTC <!-- end of auto-generated comment: Cypress test results -->
46 lines
1.4 KiB
JSON
46 lines
1.4 KiB
JSON
{
|
|
"name": "@appsmith/wds",
|
|
"version": "1.0.0",
|
|
"main": "src/index.ts",
|
|
"author": "Valera Melnikov <valera@appsmith.com>, Pawan Kumar <pawan@appsmith.com>",
|
|
"license": "MIT",
|
|
"scripts": {
|
|
"lint": "yarn g:lint",
|
|
"prettier": "yarn g:prettier",
|
|
"test:unit": "yarn g:jest",
|
|
"build:icons": "npx tsx ./src/scripts/build-icons.ts"
|
|
},
|
|
"dependencies": {
|
|
"@appsmith/wds-headless": "workspace:^",
|
|
"@appsmith/wds-theming": "workspace:^",
|
|
"@emotion/css": "^11.11.2",
|
|
"@floating-ui/react": "^0.26.24",
|
|
"@react-aria/focus": "^3.18.2",
|
|
"@react-aria/utils": "^3.16.0",
|
|
"@react-aria/visually-hidden": "^3.8.0",
|
|
"@react-spectrum/utils": "^3.11.10",
|
|
"@react-stately/collections": "^3.10.9",
|
|
"@react-stately/list": "^3.10.8",
|
|
"@react-types/actiongroup": "^3.4.6",
|
|
"@react-types/shared": "^3.23.1",
|
|
"@tabler/icons-react": "^3.10.0",
|
|
"clsx": "^2.0.0",
|
|
"lodash": "*",
|
|
"react-aria-components": "^1.6.0",
|
|
"react-markdown": "^9.0.1",
|
|
"react-syntax-highlighter": "^15.5.0",
|
|
"react-transition-group": "^4.4.5",
|
|
"remark-gfm": "^4.0.0",
|
|
"usehooks-ts": "*"
|
|
},
|
|
"devDependencies": {
|
|
"@types/fs-extra": "^11.0.4",
|
|
"@types/react-syntax-highlighter": "^15.5.13",
|
|
"@types/react-transition-group": "^4.4.11",
|
|
"eslint-plugin-storybook": "^0.6.10"
|
|
},
|
|
"peerDependencies": {
|
|
"react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0"
|
|
}
|
|
}
|