* fix(popover): check related target onMouseLeave to prevent unexpected collapsing
* refactor(react): remove deprecations
BREAKING CHANGE:
* docs: update changeset
* chore(next): enter changeset pre release next
* chore(next): remove next from main workflow
* feat(react-18-toast): toast with React Portal implementation (#5797)
* feat: add support for React 18
Closes#5795
* chore: add changeset
* feat(react-18-toast): start refactoring toast package
- storybook works
- some tests are failing
* feat(react-18-toast): add changesets
* test(react-18-toast): update tests
* fix(react-18-toast): closeAll at position
* feat(react-18-toast): customize toasts via ToastProvider
* feat(react-18-toast): customize createStandaloneToasts like ToastProvider
* chore(react-18-toast): remove dead code from changeset
* chore(react-18-toast): code review 1
* chore(react-18-toast): code review 2
* chore(react-18-toast): remove duplicate component story
* chore(react-18-toast): fixup rebase
* fix(next): branch setup (#5836)
* chore(next): fix mismatching npm version ranges
* chore(next): rename workflow
* ci(changesets): version packages (next) (#5835)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
* docs: add changelog
* fix(ButtonGroup): collapse borders with isAttached enabled
* fix(ButtonGroup): move negative margin to button outline variant
* chore: tweak data attribute
* chore(deps): bump moment from 2.29.1 to 2.29.2 in /examples/gatsby
Bumps [moment](https://github.com/moment/moment) from 2.29.1 to 2.29.2.
- [Release notes](https://github.com/moment/moment/releases)
- [Changelog](https://github.com/moment/moment/blob/develop/CHANGELOG.md)
- [Commits](https://github.com/moment/moment/compare/2.29.1...2.29.2)
---
updated-dependencies:
- dependency-name: moment
dependency-type: indirect
...
Signed-off-by: dependabot[bot] <support@github.com>
* chore(toast): remove dependency to @reach-ui/alert
* test: remove deprecations
fixup #5828
* chore: add changeset
* ci: run PR workflow on next branch as target
* chore(deps): bump moment from 2.29.1 to 2.29.2
Bumps [moment](https://github.com/moment/moment) from 2.29.1 to 2.29.2.
- [Release notes](https://github.com/moment/moment/releases)
- [Changelog](https://github.com/moment/moment/blob/develop/CHANGELOG.md)
- [Commits](https://github.com/moment/moment/compare/2.29.1...2.29.2)
---
updated-dependencies:
- dependency-name: moment
dependency-type: indirect
...
Signed-off-by: dependabot[bot] <support@github.com>
* chore: update deps
* chore: update more deps and fix storybook linting
* chore: start updating the types WIP
* fix: use-update-effect in strict mode
* chore: add react-strict mode to storybook
* chore: fix .mjs imports in storybook
* feat: replace useId with React.useId
* chore: add watch script
* fix: use-update-effect
* feat: apply correct aria attributes
* fix: type issue
* chore: update toast package
* chore: update framer motion deps range
* docs: add pomSense as a contributor for code (#5857)
* docs: update README.md [skip ci]
* docs: update .all-contributorsrc [skip ci]
Co-authored-by: allcontributors[bot] <46447321+allcontributors[bot]@users.noreply.github.com>
* fix(editable): cancel on blur
* test: add React 18 compatibility for the test suite (#5874)
* chore: upgrade test tooling
* chore: update alert test
* chore: get avatar tests passing
* chore: get more tests passing
* chore: get more tests passing
* fix: prestorybook script
* test: packages from P to V
* feat: allow using the render fn without ChakraProvider
* chore: replace press with user.press
* fix: more tests
* chore: omit color-mode test and get more tests passing
* fix: color mode tests
Co-authored-by: Segun Adebayo <joseshegs@gmail.com>
* feat: memoize toast fn (#5873)
Closes#5868
* feat: add support for async toast (#5310)
* feat(alert): extend alert with loading status
* feat(toast): implement toast promise
* fix: import Spinner
* fix: add chakra-ui/spinner to dependencies
* feat: add toast.promise
* test: fix colormode tests
* fix: apply default duration for toast.promise
* test: render toast provider in toast tests
* test: increase time
* fix: package versions
Co-authored-by: Tim Kolberger <tim@kolberger.eu>
* chore(deps): bump nanoid from 3.1.30 to 3.3.2
Bumps [nanoid](https://github.com/ai/nanoid) from 3.1.30 to 3.3.2.
- [Release notes](https://github.com/ai/nanoid/releases)
- [Changelog](https://github.com/ai/nanoid/blob/main/CHANGELOG.md)
- [Commits](https://github.com/ai/nanoid/compare/3.1.30...3.3.2)
---
updated-dependencies:
- dependency-name: nanoid
dependency-type: indirect
...
Signed-off-by: dependabot[bot] <support@github.com>
* chore(deps): bump url-parse from 1.5.3 to 1.5.10
Bumps [url-parse](https://github.com/unshiftio/url-parse) from 1.5.3 to 1.5.10.
- [Release notes](https://github.com/unshiftio/url-parse/releases)
- [Commits](https://github.com/unshiftio/url-parse/compare/1.5.3...1.5.10)
---
updated-dependencies:
- dependency-name: url-parse
dependency-type: indirect
...
Signed-off-by: dependabot[bot] <support@github.com>
* chore: add changeset (#5879)
* fix: replace asterix version (#5880)
* chore: trigger CI (#5881)
* ci(changesets): version packages (next) (#5840)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
* docs: add changelog
* chore: bump peer deps
* feat: update templates
* chore(deps): bump engine.io from 4.1.1 to 4.1.2
Bumps [engine.io](https://github.com/socketio/engine.io) from 4.1.1 to 4.1.2.
- [Release notes](https://github.com/socketio/engine.io/releases)
- [Changelog](https://github.com/socketio/engine.io/blob/4.1.2/CHANGELOG.md)
- [Commits](https://github.com/socketio/engine.io/compare/4.1.1...4.1.2)
---
updated-dependencies:
- dependency-name: engine.io
dependency-type: indirect
...
Signed-off-by: dependabot[bot] <support@github.com>
* chore(deps): bump simple-get from 3.1.0 to 3.1.1
Bumps [simple-get](https://github.com/feross/simple-get) from 3.1.0 to 3.1.1.
- [Release notes](https://github.com/feross/simple-get/releases)
- [Commits](https://github.com/feross/simple-get/compare/v3.1.0...v3.1.1)
---
updated-dependencies:
- dependency-name: simple-get
dependency-type: indirect
...
Signed-off-by: dependabot[bot] <support@github.com>
* refactor: use-media query
* fix: color contrast of default input elements
* chore: cleanup
* docs: add changeset
* fix: lint error
* fix: suspense issue
* chore: add vite example
* fix: typescript errors
* chore: upgrade typescript and fix types
* chore: update test
* fix: lint errors
* chore(deps): bump follow-redirects from 1.14.5 to 1.14.9
Bumps [follow-redirects](https://github.com/follow-redirects/follow-redirects) from 1.14.5 to 1.14.9.
- [Release notes](https://github.com/follow-redirects/follow-redirects/releases)
- [Commits](https://github.com/follow-redirects/follow-redirects/compare/v1.14.5...v1.14.9)
---
updated-dependencies:
- dependency-name: follow-redirects
dependency-type: indirect
...
Signed-off-by: dependabot[bot] <support@github.com>
* ci(changesets): version packages (next)
* docs: add changelog
* fix(hooks): return a dynamic value for "aria-expanded" prop of getButtonProps
* fix: update csstype and typings
* fix: add reference to popover close button
* docs: add changeset
* Add new use toast prop type `icon` (#5930)
As per the new request of passing in a custom icon on a toast in the issue (#5930),
Added a new property on the `UseToastOptions` interface which will be used by the toast component's props.
* Add support for rendering the passing in cusom icons on toasts (#5930)
* Add story book for toast with custom icon (#5930)
* Fix displaying a description when the toast is updated on storybook (#5930)
* Replace storybook component name typo
Replaced a typo that used `width` instead of `with` (#5930)
* Render custom icon inside `AlertIcon` to receive styles and themes (#5930).
Rendering the icon component differently or not inside the `AlertIcon` cause issues that will not pass the styles and themes to the custom icon. So to fix that I have added by rendering custom icon inside the `AlertIcon` component.
* Support passing in a custom icon as children to `AlertIcon` (#5930)
I have added support for passing in a custom icon as a children to `AlertIcon` which will help in rendering a custom icon within `AlertIcon`.
* chore: add changeset
* chore: add AlertIcon changeset
* Allow opt-in for outline/shadow on focused elements (#5619)
* Allow opt-in for outline/shadow on focused elements
This will need to be documented, but ultimately this allows users to override the automatic focus style overrides applied when using focus-visible.
The focus-visible documentation suggests adding a get-out like this, so Chakra really needs to give us one!
This fixes#5575
* Update packages/css-reset/src/css-reset.tsx
Co-authored-by: Tim Kolberger <tim@kolberger.eu>
Co-authored-by: Tim Kolberger <tim@kolberger.eu>
* chore(toast): update changeset (#5952)
* chore(css-reset): add changeset (#5953)
* fix: use-outside-click register clicks on document (#5838)
* test: add tests for use-outside-click
It's currently failing because clicks on the document aren't registered.
We want this because sometimes the body is shorter than the browser
height and a click in the blank space outside of the body isn't
registered.
* fix(use-outside-click): register clicks on document
I expect useOutsideClick() to respond to clicks anywhere on the page,
but it was ignoring clicks outside <body>. There can be space below the
end of the body for <body> elements who's height is less than the
browsers height.
Now, we respond to events on document too. the test added in the prior
commit now passes.
Fixes#5837
* test: add types in the use-outside-click test
Thanks Typescript!
* chore: add changeset (#5954)
* chore: do not publish src files
* chore: update changeset
* feat(image): add imageFallbackStrategies #5581 (#5680)
* chore: add changeset
* docs: add changeset
* refactor: Fix unsafe any in theme tools mode()
Currently, using `mode()` returns `any`, which causes TypeScript ESLint to throw an unsafe assignment error:
```
Unsafe assignment of an `any` value. (@typescript-eslint/no-unsafe-assignment)
FILE /Users/mc/Sites/saber/client/src/theme/global.ts:9:7
7 | global: (props) => ({
8 | '*, *::before, &::after': {
> 9 | borderColor: mode('gray.300', 'whiteAlpha.300')(props),
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
10 | },
11 | }),
12 | }
```
However, looking at the value of `SystemStyleObject`, the return value needs to be a string:
`@chakra-ui/styled-system/src/system.types.ts`
```ts
type CSSDefinition<D> = D | string | RecursiveCSSSelector<D | string>
export interface RecursiveCSSSelector<D> {
[selector: string]: CSSDefinition<D> & D
}
export type RecursiveCSSObject<D> = D &
(D | RecursivePseudo<D> | RecursiveCSSSelector<D>)
export type CSSObject = RecursiveCSSObject<CSSWithMultiValues>
export type SystemStyleObject = CSSObject
```
This commit updates `mode()`'s `light` and `dark` args to be `string`, instead of `any`
* Make `leastDestructiveRef` property optional
* fix: restore old zIndex of linkbox
* chore: add changeset
* Fixed type
* fix: ts error from recent pr
* docs: add changeset
* test: resolve flaky tests
* test: temp resolve flaky tests
* ci(changesets): version packages (next)
* docs: add changelog
* docs: reword changesets
* chore: update use of deprecated props
* fix: popper match-width property
* fix: zero spacing value for wrap
* docs: add changeset
* feat: storybook-addon toolbar (#5922)
* build(storybook-addon): remove icons dependencies
* chore(storybook-addon): add a channel event
* chore(storybook-addon): remove the colorModeSwitch
* feat(storybook-addon): create a tool to change the color mode
* docs(storybook-addon): add tool docs
* docs(storybook-addon): include changeset
* docs(storybook-addon): fix some typos
* refactor(storybook-addon): rename the variable that retrieve the localstorage value
Co-authored-by: Burhanuddin Udaipurwala <udaipurwalaburhanuddin@gmail.com>
* refactor(storybook-addon): improve setDarkMode
setDarkMode get the previous value to toggle it
Co-authored-by: Burhanuddin Udaipurwala <udaipurwalaburhanuddin@gmail.com>
* refactor(storybook-addon): rename useCallback variable
Co-authored-by: Burhanuddin Udaipurwala <udaipurwalaburhanuddin@gmail.com>
* refactor(storybook-addon): rename some suggested variables
* chore: update storybook
* feat(sb-addon): use sb toolbar for color mode and direction toggle
* chore: dog feed storybook addon
* fix: type errors
* chore: polish
* feat(sb-addon): introduce getThemingArgTypes
* chore: use getThemingArgTypes in button story
* docs(sb-addon): update README
* chore(sb-addon): add changeset
* chore(sb-addon): replace icons
* feat: keep layout direction between stories
Co-authored-by: AndresSp <ngxcoder@gmail.com>
Co-authored-by: ngxCoder <87735757+ngxCoder@users.noreply.github.com>
Co-authored-by: Burhanuddin Udaipurwala <udaipurwalaburhanuddin@gmail.com>
* refactor: color mode and tests (#5946)
* refactor: color-mode utils and provider
* fix: error when options is null
* feat: support for cookie script
* feat: support for custom managers
* fix: scripts and provider
* chore: update the next-js examples
* refactor: color mode tests and manager
* chore: refactor next-js example
* chore: cleanup
* chore: set correct precedence for color-mode and add color-scheme
* docs: add changeset
* chore: use explicit return
Co-authored-by: Tim Kolberger <tim@kolberger.eu>
* chore: use explicit return
Co-authored-by: Tim Kolberger <tim@kolberger.eu>
* test: update mocks in utils
* test: add root match media mock
* chore: cleanup
* docs: update changeset
* chore: update utils
* test: update to match expectations
* test: update to match expectations
* chore: update color mode provider
Co-authored-by: Tim Kolberger <tim@kolberger.eu>
* tooling: use `swc` for `ts-node` (#5872)
* build: update ts-node; use swc: true option
see: https://typestrong.org/ts-node/docs/swc/
* chore: add @swc/core dependency
* feat: add swc as dependency to the cli package
* chore: regenerate lock file
Co-authored-by: Tim Kolberger <tim@kolberger.eu>
* ci(changesets): version packages (next) (#5971)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
* docs: add changelog
* chore: deprecated tinycolor helper functions
* chore: update readme for v2 (#5991)
* chore: update readme for v2
* chore: apply review suggestions
Co-authored-by: Tim Kolberger <tim@kolberger.eu>
Co-authored-by: Tim Kolberger <tim@kolberger.eu>
* fix(storybook-addon): use default theme as fallback (#5990)
* fix(storybook-addon): use default theme as fallback
* fix(storybook-example): update the example with the new storybook addon
* chore: add changeset for all packages (#5989)
* ci(changesets): version packages (next) (#5993)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
* docs: add changelog
* chore: bump react-remove-scroll
* chore: exit pre release (#6009)
* docs: clean changelog (#6010)
* ci(changesets): version packages (#5999)
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
* docs: clean changelogrc
Co-authored-by: Brennvo <brennanarvo@gmail.com>
Co-authored-by: Segun Adebayo <joseshegs@gmail.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Co-authored-by: Thomas Hermann <1596280+novascreen@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: allcontributors[bot] <46447321+allcontributors[bot]@users.noreply.github.com>
Co-authored-by: s97712 <s97712@qq.com>
Co-authored-by: Marek Sedlacek <marek.sedlacek.sk@gmail.com>
Co-authored-by: Dennis Morello <dennis.morello@satispay.com>
Co-authored-by: Tatsuya Itakura <itkrt2y.591721200@gmail.com>
Co-authored-by: Hamdy Dakkak <hamdy.dakkak@owkin.com>
Co-authored-by: Haneen Mahdin <haneenmahdin@gmail.com>
Co-authored-by: Tom Hicks <tomhicks@users.noreply.github.com>
Co-authored-by: Daniel Beardsley <daniel.beardsley@gmail.com>
Co-authored-by: Daniel Schulz <daniel@schulz.codes>
Co-authored-by: Alex Burner <alexburner@users.noreply.github.com>
Co-authored-by: Michael Schmidt <msrd0000@gmail.com>
Co-authored-by: Max Friedrich <max@friedrich.dev>
Co-authored-by: RunDevelopment <mitchi5000.ms@googlemail.com>
Co-authored-by: AndresSp <ngxcoder@gmail.com>
Co-authored-by: ngxCoder <87735757+ngxCoder@users.noreply.github.com>
Co-authored-by: Burhanuddin Udaipurwala <udaipurwalaburhanuddin@gmail.com>
Co-authored-by: Walter Barbagallo <brb.walter@gmail.com>
Co-authored-by: Johann Ehlers <dev@johann-ehlers.eu>
`eslint` complains about `parserOptions.project` configuration in files
that aren't specified in `tsconfig.json` (like `babel.config.js`). This
change moves the parser configuration to an `overrides` section
specifically for `ts` and `tsx` files.
Segun Adebayo