From 809817383e658006dd8555882c21f2aaf613be98 Mon Sep 17 00:00:00 2001 From: Vitaly Rtishchev Date: Sun, 10 Dec 2023 11:30:47 +0400 Subject: [PATCH] [refactor] Add prettier import order sorting --- .prettierrc.mjs | 21 ++- .storybook/preview.tsx | 4 +- .../AppShellPage/AppShellPage.tsx | 4 +- .../ExamplesDrawer/ExamplesDrawer.tsx | 4 +- .../examples/AltLayout/AltLayout.tsx | 2 +- .../examples/AltLayout/code.json | 2 +- .../examples/BasicAppShell/BasicAppShell.tsx | 2 +- .../examples/BasicAppShell/code.json | 2 +- .../CollapseDesktop/CollapseDesktop.tsx | 2 +- .../examples/CollapseDesktop/code.json | 2 +- .../examples/Disabled/Disabled.tsx | 2 +- .../examples/Disabled/code.json | 2 +- .../examples/FullLayout/FullLayout.tsx | 2 +- .../examples/FullLayout/code.json | 2 +- .../examples/Headroom/Headroom.tsx | 2 +- .../examples/Headroom/code.json | 2 +- .../examples/MobileNavbar/MobileNavbar.tsx | 2 +- .../examples/MobileNavbar/code.json | 2 +- .../examples/NavbarSection/NavbarSection.tsx | 2 +- .../examples/NavbarSection/code.json | 2 +- .../examples/NoTransitions/NoTransitions.tsx | 2 +- .../examples/NoTransitions/code.json | 2 +- .../ResponsiveSizes/ResponsiveSizes.tsx | 2 +- .../examples/ResponsiveSizes/code.json | 2 +- docs/src/app-shell-examples/examples/index.ts | 29 ++-- .../ComboboxDemo/ComboboxDemo.tsx | 6 +- .../ComboboxPage/ComboboxPage.tsx | 4 +- .../ComboboxLinksGroup/ComboboxLinksGroup.tsx | 4 +- .../ComboboxNavbar/ComboboxNavbar.tsx | 6 +- .../ComboboxShell/ComboboxShell.tsx | 2 +- .../ActiveOptionsFilter.tsx | 2 +- .../examples/ActiveOptionsFilter/code.json | 2 +- .../AsyncAutocomplete/AsyncAutocomplete.tsx | 4 +- .../examples/AsyncAutocomplete/code.json | 2 +- .../AutocompleteClearable.tsx | 2 +- .../examples/AutocompleteClearable/code.json | 2 +- .../AutocompleteSelectFirstOption.tsx | 2 +- .../AutocompleteSelectFirstOption/code.json | 2 +- .../examples/BasicButton/BasicButton.tsx | 2 +- .../examples/BasicButton/code.json | 2 +- .../BasicMultiSelect/BasicMultiSelect.tsx | 2 +- .../examples/BasicMultiSelect/code.json | 2 +- .../examples/BasicSelect/BasicSelect.tsx | 2 +- .../examples/BasicSelect/code.json | 2 +- .../ButtonMultiSelect/ButtonMultiSelect.tsx | 2 +- .../examples/ButtonMultiSelect/code.json | 2 +- .../examples/ButtonSearch/ButtonSearch.tsx | 2 +- .../examples/ButtonSearch/code.json | 2 +- .../DropdownAnimation/DropdownAnimation.tsx | 2 +- .../examples/DropdownAnimation/code.json | 2 +- .../DropdownFooter/DropdownFooter.tsx | 2 +- .../examples/DropdownFooter/code.json | 2 +- .../DropdownHeader/DropdownHeader.tsx | 2 +- .../examples/DropdownHeader/code.json | 2 +- .../DropdownOptionsAnimation.tsx | 2 +- .../DropdownOptionsAnimation/code.json | 2 +- .../DropdownPositionStyles.tsx | 2 +- .../examples/DropdownPositionStyles/code.json | 2 +- .../DropdownScrollArea/DropdownScrollArea.tsx | 2 +- .../examples/DropdownScrollArea/code.json | 2 +- .../DropdownSmoothScroll.tsx | 2 +- .../examples/DropdownSmoothScroll/code.json | 2 +- .../MaxDisplayedItems/MaxDisplayedItems.tsx | 2 +- .../examples/MaxDisplayedItems/code.json | 2 +- .../MaxSelectedItems/MaxSelectedItems.tsx | 2 +- .../examples/MaxSelectedItems/code.json | 2 +- .../MultiSelectCheckbox.tsx | 2 +- .../examples/MultiSelectCheckbox/code.json | 2 +- .../MultiSelectCreatable.tsx | 2 +- .../examples/MultiSelectCreatable/code.json | 2 +- .../MultiSelectValueRenderer.tsx | 2 +- .../MultiSelectValueRenderer/code.json | 2 +- .../SearchableMultiSelect.tsx | 2 +- .../examples/SearchableMultiSelect/code.json | 2 +- .../examples/SelectActive/SelectActive.tsx | 2 +- .../examples/SelectActive/code.json | 2 +- .../examples/SelectAsync/SelectAsync.tsx | 2 +- .../examples/SelectAsync/code.json | 2 +- .../SelectClearable/SelectClearable.tsx | 2 +- .../examples/SelectClearable/code.json | 2 +- .../SelectDropdownSearch.tsx | 2 +- .../examples/SelectDropdownSearch/code.json | 2 +- .../examples/SelectGroups/SelectGroups.tsx | 2 +- .../examples/SelectGroups/code.json | 2 +- .../SelectGroupsStyles/SelectGroupsStyles.tsx | 2 +- .../examples/SelectGroupsStyles/code.json | 2 +- .../examples/SelectList/SelectList.tsx | 2 +- .../examples/SelectList/code.json | 2 +- .../SelectOptionComponent.tsx | 2 +- .../examples/SelectOptionComponent/code.json | 2 +- .../SelectOptionOnHover.tsx | 2 +- .../examples/SelectOptionOnHover/code.json | 2 +- .../SelectedAnimation/SelectedAnimation.tsx | 2 +- .../examples/SelectedAnimation/code.json | 2 +- .../SelectedStyles/SelectedStyles.tsx | 2 +- .../examples/SelectedStyles/code.json | 2 +- .../examples/TransferList/TransferList.tsx | 2 +- .../examples/TransferList/code.json | 2 +- docs/src/combobox-examples/examples/index.ts | 129 +++++++++-------- .../ColorsGenerator/ColorsGenerator.tsx | 6 +- .../ColorsInput/ColorsInput.tsx | 12 +- .../ComponentsPreview/ComponentsPreview.tsx | 2 +- .../CssVariablesList/CssVariablesList.tsx | 2 +- .../CssVariablesTable/CssVariablesTable.tsx | 2 +- docs/src/components/Footer/Footer.tsx | 6 +- .../FrameworksGuides/FrameworksGuides.tsx | 2 +- .../src/components/HomePage/Banner/Banner.tsx | 2 +- .../HomePage/Components/Components.tsx | 14 +- .../HomePage/Components/demos/Carousel.tsx | 2 +- .../HomePage/Components/demos/Content.tsx | 2 +- .../HomePage/Components/demos/Dates.tsx | 6 +- .../HomePage/Components/demos/Inputs.tsx | 12 +- .../HomePage/Components/demos/Overlays.tsx | 18 +-- .../CustomizeStyles/CustomizeStyles.tsx | 6 +- .../CustomizeWithProps/CustomizeWithProps.tsx | 2 +- .../HomePage/DarkTheme/DarkTheme.tsx | 6 +- .../components/HomePage/DemoTabs/DemoTabs.tsx | 4 +- docs/src/components/HomePage/HomePage.tsx | 16 +-- docs/src/components/HomePage/Hooks/Hooks.tsx | 2 +- .../HomePage/JoinCommunity/JoinCommunity.tsx | 2 +- .../HomePage/Jumbotron/Jumbotron.tsx | 4 +- .../components/HomePage/Jumbotron/features.ts | 2 +- .../HomePage/PageSection/PageSection.tsx | 2 +- .../components/HomePage/Theming/Theming.tsx | 2 +- .../HotKeysHandler/HotKeysHandler.tsx | 2 +- docs/src/components/HtmlText/HtmlText.tsx | 2 +- docs/src/components/Logo/Logo.tsx | 2 +- .../LogoAssets/LogoAsset/LogoAsset.tsx | 2 +- docs/src/components/LogoAssets/LogoAssets.tsx | 2 +- .../src/components/LogoAssets/assets/index.ts | 2 +- docs/src/components/MdxLayout/MdxLayout.tsx | 2 +- docs/src/components/MdxPage/MdxPage.tsx | 2 +- .../ImportStatement/ImportStatement.tsx | 2 +- .../MdxPageHeader/MdxPageHeader.tsx | 6 +- .../MdxProvider/MdxDataTable/MdxDataTable.tsx | 2 +- .../MdxExamplesButton/MdxExamplesButton.tsx | 2 +- .../MdxProvider/MdxInfo/MdxInfo.tsx | 2 +- .../MdxKeyboardEventsTable.tsx | 2 +- .../MdxProvider/MdxNpmScript/MdxNpmScript.tsx | 2 +- .../MdxPackagesInstallation.tsx | 2 +- .../components/MdxProvider/MdxProvider.tsx | 42 +++--- .../MdxSharedContent/MdxComboboxData.tsx | 2 +- .../MdxComboboxDisclaimer.tsx | 2 +- .../MdxSharedContent/MdxComboboxFiltering.tsx | 2 +- .../MdxSharedContent/MdxComboboxLargeData.tsx | 2 +- .../MdxSharedContent/MdxComboboxProps.tsx | 4 +- .../MdxSharedContent/MdxFlexboxGapSupport.tsx | 2 +- .../MdxSharedContent/MdxGetElementRef.tsx | 2 +- .../MdxSharedContent/MdxGetTemplates.tsx | 2 +- .../MdxSharedContent/MdxGradient.tsx | 4 +- .../MdxInputAccessibility.tsx | 2 +- .../MdxSharedContent/MdxInputFeatures.tsx | 2 +- .../MdxSharedContent/MdxInputSections.tsx | 2 +- .../MdxSharedContent/MdxPolymorphic.tsx | 8 +- .../MdxServerComponentsIncompatible.tsx | 2 +- .../MdxStylesApiSelectors.tsx | 2 +- .../MdxSharedContent/MdxTargetComponent.tsx | 2 +- .../MdxSharedContent/MdxWrapperProps.tsx | 4 +- .../MdxTemplatesList/MdxTemplatesList.tsx | 6 +- .../MdxProvider/MdxTitle/MdxTitle.tsx | 2 +- .../MdxRawContent/MdxRawContent.tsx | 6 +- .../components/MdxSiblings/MdxSiblings.tsx | 6 +- .../MdxSiblings/get-mdx-siblings.ts | 2 +- docs/src/components/MdxTabs/MdxTabs.tsx | 8 +- .../ModalsProviderDemo/ModalsProviderDemo.tsx | 4 +- docs/src/components/PropsTable/PropsTable.tsx | 6 +- .../components/PropsTable/PropsTablesList.tsx | 4 +- docs/src/components/Search/Search.tsx | 2 +- docs/src/components/Shell/Header/Header.tsx | 10 +- docs/src/components/Shell/Navbar/Navbar.tsx | 8 +- .../NavbarLinksGroup/NavbarLinksGroup.tsx | 4 +- .../Navbar/NavbarLinksGroup/category-icons.ts | 14 +- .../Navbar/NavbarMainLink/NavbarMainLink.tsx | 2 +- .../components/SocialButton/SocialButton.tsx | 2 +- .../StylePropsTable/StylePropsTable.tsx | 2 +- .../StylesApiTable/StylesApiTable.tsx | 4 +- .../StylesApiTable/StylesApiTablesList.tsx | 2 +- docs/src/components/TableError/TableError.tsx | 2 +- .../TableInlineCode/TableInlineCode.tsx | 2 +- .../TableOfContents/TableOfContents.tsx | 4 +- .../ThemeColors/ColorsGroup/ColorsGroup.tsx | 2 +- .../components/VersionsList/VersionsList.tsx | 6 +- docs/src/components/icons/index.ts | 8 +- docs/src/mdx/mdx-data.ts | 14 +- docs/src/mdx/mdx-pages-group.ts | 2 +- docs/src/pages/_app.tsx | 11 +- docs/src/pages/_document.tsx | 2 +- docs/src/pages/about.mdx | 4 +- docs/src/pages/changelog/7-0-0.mdx | 36 ++--- docs/src/pages/changelog/7-1-0.mdx | 4 +- docs/src/pages/changelog/7-2-0.mdx | 8 +- docs/src/pages/changelog/7-3-0.mdx | 8 +- docs/src/pages/changelog/all-releases.mdx | 2 +- .../src/pages/changelog/previous-versions.mdx | 2 +- docs/src/pages/colors-generator.tsx | 2 +- docs/src/pages/core/accordion.mdx | 2 +- docs/src/pages/core/action-icon.mdx | 4 +- docs/src/pages/core/affix.mdx | 2 +- docs/src/pages/core/alert.mdx | 2 +- docs/src/pages/core/anchor.mdx | 2 +- docs/src/pages/core/app-shell.mdx | 6 +- docs/src/pages/core/aspect-ratio.mdx | 2 +- docs/src/pages/core/autocomplete.mdx | 2 +- docs/src/pages/core/avatar.mdx | 2 +- docs/src/pages/core/background-image.mdx | 2 +- docs/src/pages/core/badge.mdx | 2 +- docs/src/pages/core/blockquote.mdx | 2 +- docs/src/pages/core/breadcrumbs.mdx | 2 +- docs/src/pages/core/burger.mdx | 2 +- docs/src/pages/core/button.mdx | 2 +- docs/src/pages/core/card.mdx | 2 +- docs/src/pages/core/center.mdx | 2 +- docs/src/pages/core/checkbox.mdx | 2 +- docs/src/pages/core/chip.mdx | 2 +- docs/src/pages/core/close-button.mdx | 2 +- docs/src/pages/core/code.mdx | 2 +- docs/src/pages/core/collapse.mdx | 2 +- docs/src/pages/core/color-input.mdx | 2 +- docs/src/pages/core/color-picker.mdx | 2 +- docs/src/pages/core/color-swatch.mdx | 2 +- docs/src/pages/core/combobox.mdx | 8 +- docs/src/pages/core/container.mdx | 2 +- docs/src/pages/core/copy-button.mdx | 2 +- docs/src/pages/core/dialog.mdx | 2 +- docs/src/pages/core/divider.mdx | 2 +- docs/src/pages/core/drawer.mdx | 2 +- docs/src/pages/core/fieldset.mdx | 2 +- docs/src/pages/core/file-button.mdx | 2 +- docs/src/pages/core/file-input.mdx | 2 +- docs/src/pages/core/flex.mdx | 6 +- docs/src/pages/core/focus-trap.mdx | 2 +- docs/src/pages/core/grid.mdx | 2 +- docs/src/pages/core/group.mdx | 2 +- docs/src/pages/core/highlight.mdx | 2 +- docs/src/pages/core/hover-card.mdx | 2 +- docs/src/pages/core/image.mdx | 2 +- docs/src/pages/core/indicator.mdx | 2 +- docs/src/pages/core/input.mdx | 4 +- docs/src/pages/core/json-input.mdx | 2 +- docs/src/pages/core/kbd.mdx | 2 +- docs/src/pages/core/list.mdx | 2 +- docs/src/pages/core/loader.mdx | 2 +- docs/src/pages/core/loading-overlay.mdx | 2 +- docs/src/pages/core/mark.mdx | 2 +- docs/src/pages/core/menu.mdx | 2 +- docs/src/pages/core/modal.mdx | 2 +- docs/src/pages/core/multi-select.mdx | 2 +- docs/src/pages/core/native-select.mdx | 2 +- docs/src/pages/core/nav-link.mdx | 2 +- docs/src/pages/core/notification.mdx | 2 +- docs/src/pages/core/number-formatter.mdx | 2 +- docs/src/pages/core/number-input.mdx | 2 +- docs/src/pages/core/overlay.mdx | 2 +- docs/src/pages/core/pagination.mdx | 2 +- docs/src/pages/core/paper.mdx | 2 +- docs/src/pages/core/password-input.mdx | 2 +- docs/src/pages/core/pill.mdx | 2 +- docs/src/pages/core/pills-input.mdx | 2 +- docs/src/pages/core/pin-input.mdx | 2 +- docs/src/pages/core/popover.mdx | 4 +- docs/src/pages/core/progress.mdx | 2 +- docs/src/pages/core/radio.mdx | 4 +- docs/src/pages/core/rating.mdx | 2 +- docs/src/pages/core/ring-progress.mdx | 2 +- docs/src/pages/core/scroll-area.mdx | 2 +- docs/src/pages/core/segmented-control.mdx | 2 +- docs/src/pages/core/select.mdx | 2 +- docs/src/pages/core/simple-grid.mdx | 2 +- docs/src/pages/core/skeleton.mdx | 2 +- docs/src/pages/core/slider.mdx | 4 +- docs/src/pages/core/space.mdx | 4 +- docs/src/pages/core/spoiler.mdx | 2 +- docs/src/pages/core/stack.mdx | 2 +- docs/src/pages/core/stepper.mdx | 2 +- docs/src/pages/core/switch.mdx | 4 +- docs/src/pages/core/table.mdx | 2 +- docs/src/pages/core/tabs.mdx | 4 +- docs/src/pages/core/tags-input.mdx | 2 +- docs/src/pages/core/text-input.mdx | 2 +- docs/src/pages/core/text.mdx | 2 +- docs/src/pages/core/textarea.mdx | 2 +- docs/src/pages/core/theme-icon.mdx | 2 +- docs/src/pages/core/timeline.mdx | 2 +- docs/src/pages/core/title.mdx | 2 +- docs/src/pages/core/tooltip.mdx | 8 +- docs/src/pages/core/transition.mdx | 2 +- .../pages/core/typography-styles-provider.mdx | 2 +- docs/src/pages/core/unstyled-button.mdx | 2 +- docs/src/pages/core/visually-hidden.mdx | 2 +- docs/src/pages/dates/calendar.mdx | 2 +- docs/src/pages/dates/date-input.mdx | 2 +- docs/src/pages/dates/date-picker-input.mdx | 2 +- docs/src/pages/dates/date-picker.mdx | 2 +- docs/src/pages/dates/date-time-picker.mdx | 2 +- docs/src/pages/dates/dates-provider.mdx | 2 +- docs/src/pages/dates/getting-started.mdx | 8 +- docs/src/pages/dates/month-picker-input.mdx | 2 +- docs/src/pages/dates/month-picker.mdx | 2 +- docs/src/pages/dates/time-input.mdx | 2 +- docs/src/pages/dates/year-picker-input.mdx | 2 +- docs/src/pages/dates/year-picker.mdx | 2 +- docs/src/pages/form/actions.mdx | 2 +- docs/src/pages/form/create-form-context.mdx | 4 +- docs/src/pages/form/errors.mdx | 2 +- docs/src/pages/form/nested.mdx | 2 +- docs/src/pages/form/recipes.mdx | 2 +- docs/src/pages/form/schema-validation.mdx | 24 ++-- docs/src/pages/form/status.mdx | 2 +- docs/src/pages/form/use-form.mdx | 2 +- docs/src/pages/form/validation.mdx | 2 +- docs/src/pages/form/validators.mdx | 12 +- docs/src/pages/form/values.mdx | 4 +- docs/src/pages/getting-started.mdx | 6 +- docs/src/pages/guides/6x-to-7x.mdx | 2 +- docs/src/pages/guides/gatsby.mdx | 1 + docs/src/pages/guides/icons.mdx | 2 +- docs/src/pages/guides/jest.mdx | 1 - docs/src/pages/guides/next.mdx | 9 +- docs/src/pages/guides/polymorphic.mdx | 6 +- docs/src/pages/guides/redwood.mdx | 4 +- docs/src/pages/guides/remix.mdx | 2 +- docs/src/pages/guides/storybook.mdx | 1 - docs/src/pages/guides/typescript.mdx | 10 +- docs/src/pages/hooks/use-click-outside.mdx | 4 +- docs/src/pages/hooks/use-clipboard.mdx | 2 +- docs/src/pages/hooks/use-color-scheme.mdx | 2 +- docs/src/pages/hooks/use-counter.mdx | 2 +- docs/src/pages/hooks/use-debounced-state.mdx | 2 +- docs/src/pages/hooks/use-debounced-value.mdx | 2 +- docs/src/pages/hooks/use-did-update.mdx | 2 +- docs/src/pages/hooks/use-disclosure.mdx | 2 +- docs/src/pages/hooks/use-document-title.mdx | 2 +- .../pages/hooks/use-document-visibility.mdx | 2 +- docs/src/pages/hooks/use-element-size.mdx | 2 +- docs/src/pages/hooks/use-event-listener.mdx | 2 +- docs/src/pages/hooks/use-eye-dropper.mdx | 2 +- docs/src/pages/hooks/use-favicon.mdx | 2 +- docs/src/pages/hooks/use-focus-return.mdx | 2 +- docs/src/pages/hooks/use-focus-within.mdx | 2 +- docs/src/pages/hooks/use-force-update.mdx | 2 +- docs/src/pages/hooks/use-fullscreen.mdx | 2 +- docs/src/pages/hooks/use-hash.mdx | 2 +- docs/src/pages/hooks/use-headroom.mdx | 2 +- docs/src/pages/hooks/use-hotkeys.mdx | 2 +- docs/src/pages/hooks/use-hover.mdx | 2 +- docs/src/pages/hooks/use-id.mdx | 2 +- docs/src/pages/hooks/use-idle.mdx | 2 +- docs/src/pages/hooks/use-input-state.mdx | 4 +- docs/src/pages/hooks/use-intersection.mdx | 2 +- docs/src/pages/hooks/use-interval.mdx | 2 +- .../src/pages/hooks/use-isomorphic-effect.mdx | 2 +- docs/src/pages/hooks/use-list-state.mdx | 2 +- docs/src/pages/hooks/use-local-storage.mdx | 6 +- docs/src/pages/hooks/use-logger.mdx | 2 +- docs/src/pages/hooks/use-media-query.mdx | 2 +- docs/src/pages/hooks/use-merged-ref.mdx | 4 +- docs/src/pages/hooks/use-mouse.mdx | 2 +- docs/src/pages/hooks/use-move.mdx | 2 +- docs/src/pages/hooks/use-network.mdx | 2 +- docs/src/pages/hooks/use-os.mdx | 3 +- docs/src/pages/hooks/use-page-leave.mdx | 2 +- docs/src/pages/hooks/use-pagination.mdx | 2 +- docs/src/pages/hooks/use-previous.mdx | 2 +- docs/src/pages/hooks/use-queue.mdx | 2 +- docs/src/pages/hooks/use-reduced-motion.mdx | 2 +- docs/src/pages/hooks/use-resize-observer.mdx | 2 +- docs/src/pages/hooks/use-scroll-into-view.mdx | 2 +- docs/src/pages/hooks/use-set-state.mdx | 2 +- docs/src/pages/hooks/use-shallow-effect.mdx | 2 +- docs/src/pages/hooks/use-text-selection.mdx | 2 +- docs/src/pages/hooks/use-timeout.mdx | 2 +- docs/src/pages/hooks/use-toggle.mdx | 2 +- docs/src/pages/hooks/use-uncontrolled.mdx | 2 +- docs/src/pages/hooks/use-validated-state.mdx | 2 +- docs/src/pages/hooks/use-viewport-size.mdx | 2 +- docs/src/pages/hooks/use-window-event.mdx | 2 +- docs/src/pages/hooks/use-window-scroll.mdx | 2 +- docs/src/pages/others/carousel.mdx | 2 +- docs/src/pages/others/code-highlight.mdx | 2 +- docs/src/pages/others/dropzone.mdx | 16 +-- docs/src/pages/others/modals.mdx | 7 +- docs/src/pages/others/notifications.mdx | 8 +- docs/src/pages/others/nprogress.mdx | 2 +- docs/src/pages/others/spotlight.mdx | 6 +- docs/src/pages/others/tiptap.mdx | 10 +- docs/src/pages/overview.mdx | 8 +- docs/src/pages/styles/color-functions.mdx | 4 +- docs/src/pages/styles/css-files-list.mdx | 2 +- docs/src/pages/styles/css-modules.mdx | 4 +- docs/src/pages/styles/css-variables-list.mdx | 2 +- docs/src/pages/styles/css-variables.mdx | 6 +- docs/src/pages/styles/data-attributes.mdx | 4 +- docs/src/pages/styles/global-styles.mdx | 2 +- docs/src/pages/styles/mantine-styles.mdx | 4 +- docs/src/pages/styles/rem.mdx | 6 +- docs/src/pages/styles/responsive.mdx | 6 +- docs/src/pages/styles/rtl.mdx | 2 +- docs/src/pages/styles/style-props.mdx | 4 +- docs/src/pages/styles/styles-api.mdx | 8 +- docs/src/pages/styles/styles-overview.mdx | 4 +- docs/src/pages/styles/styles-performance.mdx | 2 +- docs/src/pages/styles/unstyled.mdx | 2 +- docs/src/pages/styles/vanilla-extract.mdx | 12 +- docs/src/pages/styles/variants-sizes.mdx | 6 +- docs/src/pages/theming/color-schemes.mdx | 13 +- docs/src/pages/theming/colors.mdx | 6 +- docs/src/pages/theming/default-props.mdx | 4 +- docs/src/pages/theming/default-theme.mdx | 2 +- docs/src/pages/theming/mantine-provider.mdx | 12 +- docs/src/pages/theming/theme-object.mdx | 8 +- docs/src/pages/theming/typography.mdx | 4 +- docs/theme.ts | 2 +- package.json | 1 + .../Carousel.demo.animationOffset.tsx | 2 +- .../demos/carousel/Carousel.demo.autoplay.tsx | 2 +- .../Carousel.demo.brokenAnimation.tsx | 2 +- .../demos/carousel/Carousel.demo.cards.tsx | 2 +- .../demos/carousel/Carousel.demo.icons.tsx | 4 +- .../carousel/Carousel.demo.stylesApi.tsx | 2 +- .../demos/carousel/Carousel.demos.story.tsx | 2 +- .../demos/src/demos/carousel/_slides.tsx | 2 +- ...Changelog730.demo.checkboxRadioVariant.tsx | 2 +- .../7-3-0/CodeHighlight.demos.story.tsx | 2 +- .../CodeHighlight.demo.copy.tsx | 2 +- .../CodeHighlight.demo.expand.tsx | 2 +- .../CodeHighlight.demo.inline.tsx | 4 +- .../CodeHighlight.demo.tabs.tsx | 2 +- .../CodeHighlight.demo.tabsGetIcons.tsx | 4 +- .../CodeHighlight.demo.tabsIcons.tsx | 4 +- .../CodeHighlight.demo.usage.tsx | 2 +- .../CodeHighlight.demos.story.tsx | 2 +- .../core/Accordion/Accordion.demo.chevron.tsx | 4 +- .../Accordion/Accordion.demo.configurator.tsx | 2 +- .../Accordion/Accordion.demo.customize.tsx | 2 +- .../Accordion/Accordion.demo.disabled.tsx | 2 +- .../core/Accordion/Accordion.demo.icons.tsx | 4 +- .../core/Accordion/Accordion.demo.label.tsx | 2 +- .../Accordion/Accordion.demo.sideControls.tsx | 4 +- .../Accordion/Accordion.demo.stylesApi.tsx | 2 +- .../core/Accordion/Accordion.demos.story.tsx | 2 +- .../ActionIcon/ActionIcon.demo.customSize.tsx | 4 +- .../ActionIcon.demo.customVariant.tsx | 4 +- .../ActionIcon/ActionIcon.demo.disabled.tsx | 4 +- .../ActionIcon.demo.disabledLink.tsx | 4 +- .../ActionIcon.demo.disabledStyles.tsx | 4 +- .../ActionIcon.demo.disabledTooltip.tsx | 4 +- .../ActionIcon/ActionIcon.demo.gradient.tsx | 4 +- .../core/ActionIcon/ActionIcon.demo.group.tsx | 4 +- .../ActionIcon.demo.loaderProps.tsx | 2 +- .../ActionIcon/ActionIcon.demo.loading.tsx | 2 +- .../core/ActionIcon/ActionIcon.demo.size.tsx | 4 +- .../core/ActionIcon/ActionIcon.demo.usage.tsx | 2 +- .../ActionIcon/ActionIcon.demos.story.tsx | 2 +- .../src/demos/core/Affix/Affix.demo.usage.tsx | 2 +- .../demos/core/Affix/Affix.demos.story.tsx | 2 +- .../core/Alert/Alert.demo.configurator.tsx | 4 +- .../demos/core/Alert/Alert.demo.stylesApi.tsx | 4 +- .../demos/core/Alert/Alert.demos.story.tsx | 2 +- .../core/Anchor/Anchor.demo.decoration.tsx | 2 +- .../demos/core/Anchor/Anchor.demo.usage.tsx | 2 +- .../demos/core/Anchor/Anchor.demos.story.tsx | 2 +- .../AspectRatio/AspectRatio.demo.flex.tsx | 2 +- .../AspectRatio/AspectRatio.demo.image.tsx | 2 +- .../core/AspectRatio/AspectRatio.demo.map.tsx | 2 +- .../AspectRatio/AspectRatio.demo.video.tsx | 2 +- .../AspectRatio/AspectRatio.demos.story.tsx | 2 +- .../Autocomplete.demo.configurator.tsx | 2 +- .../Autocomplete.demo.disabled.tsx | 2 +- .../Autocomplete.demo.disabledOptions.tsx | 2 +- .../Autocomplete.demo.dropdownAnimation.tsx | 2 +- .../Autocomplete.demo.dropdownOpened.tsx | 4 +- .../Autocomplete.demo.dropdownPadding.tsx | 2 +- .../Autocomplete.demo.dropdownPosition.tsx | 2 +- .../Autocomplete.demo.dropdownShadow.tsx | 2 +- .../Autocomplete/Autocomplete.demo.error.tsx | 2 +- .../Autocomplete/Autocomplete.demo.groups.tsx | 2 +- .../Autocomplete/Autocomplete.demo.limit.tsx | 2 +- .../Autocomplete.demo.readOnly.tsx | 2 +- .../Autocomplete.demo.scrollArea.tsx | 2 +- .../Autocomplete/Autocomplete.demo.search.tsx | 2 +- .../Autocomplete.demo.sections.tsx | 4 +- .../Autocomplete/Autocomplete.demo.sort.tsx | 2 +- .../Autocomplete.demo.stylesApi.tsx | 2 +- .../Autocomplete/Autocomplete.demo.usage.tsx | 2 +- .../Autocomplete.demo.withinPopover.tsx | 2 +- .../Autocomplete/Autocomplete.demos.story.tsx | 2 +- .../core/Avatar/Avatar.demo.gradient.tsx | 2 +- .../core/Avatar/Avatar.demo.placeholders.tsx | 2 +- .../demos/core/Avatar/Avatar.demos.story.tsx | 2 +- .../BackgroundImage.demo.usage.tsx | 2 +- .../BackgroundImage.demos.story.tsx | 2 +- .../demos/core/Badge/Badge.demo.fullWidth.tsx | 2 +- .../demos/core/Badge/Badge.demo.gradient.tsx | 2 +- .../demos/core/Badge/Badge.demo.sections.tsx | 4 +- .../demos/core/Badge/Badge.demo.stylesApi.tsx | 4 +- .../src/demos/core/Badge/Badge.demo.usage.tsx | 2 +- .../demos/core/Badge/Badge.demos.story.tsx | 2 +- .../core/Blockquote/Blockquote.demo.usage.tsx | 4 +- .../Blockquote/Blockquote.demos.story.tsx | 2 +- .../Breadcrumbs/Breadcrumbs.demo.usage.tsx | 2 +- .../Breadcrumbs/Breadcrumbs.demos.story.tsx | 2 +- .../demos/core/Burger/Burger.demo.usage.tsx | 4 +- .../demos/core/Burger/Burger.demos.story.tsx | 2 +- .../demos/core/Button/Button.demo.compact.tsx | 2 +- .../core/Button/Button.demo.configurator.tsx | 2 +- .../core/Button/Button.demo.customVariant.tsx | 2 +- .../core/Button/Button.demo.disabled.tsx | 2 +- .../core/Button/Button.demo.disabledLink.tsx | 2 +- .../Button/Button.demo.disabledStyles.tsx | 2 +- .../Button/Button.demo.disabledTooltip.tsx | 2 +- .../core/Button/Button.demo.fullWidth.tsx | 2 +- .../core/Button/Button.demo.gradient.tsx | 2 +- .../demos/core/Button/Button.demo.group.tsx | 2 +- .../core/Button/Button.demo.loaderProps.tsx | 2 +- .../demos/core/Button/Button.demo.loading.tsx | 4 +- .../core/Button/Button.demo.sections.tsx | 4 +- .../Button/Button.demo.sectionsJustify.tsx | 4 +- .../core/Button/Button.demo.stylesApi.tsx | 4 +- .../demos/core/Button/Button.demos.story.tsx | 2 +- .../demos/core/Card/Card.demo.linkSection.tsx | 2 +- .../src/demos/core/Card/Card.demo.section.tsx | 2 +- .../src/demos/core/Card/Card.demo.usage.tsx | 2 +- .../src/demos/core/Card/Card.demos.story.tsx | 2 +- .../demos/core/Center/Center.demo.inline.tsx | 2 +- .../demos/core/Center/Center.demo.usage.tsx | 2 +- .../demos/core/Center/Center.demos.story.tsx | 2 +- .../core/Checkbox/Checkbox.demo.anchor.tsx | 2 +- .../core/Checkbox/Checkbox.demo.card.tsx | 2 +- .../Checkbox/Checkbox.demo.configurator.tsx | 2 +- .../Checkbox/Checkbox.demo.customSize.tsx | 2 +- .../core/Checkbox/Checkbox.demo.customize.tsx | 2 +- .../Checkbox.demo.groupConfigurator.tsx | 2 +- .../core/Checkbox/Checkbox.demo.icon.tsx | 2 +- .../core/Checkbox/Checkbox.demo.iconColor.tsx | 2 +- .../Checkbox/Checkbox.demo.indeterminate.tsx | 4 +- .../core/Checkbox/Checkbox.demo.states.tsx | 2 +- .../core/Checkbox/Checkbox.demo.stylesApi.tsx | 2 +- .../core/Checkbox/Checkbox.demo.tooltip.tsx | 2 +- .../core/Checkbox/Checkbox.demos.story.tsx | 2 +- .../core/Chip/Chip.demo.configurator.tsx | 2 +- .../src/demos/core/Chip/Chip.demo.group.tsx | 2 +- .../src/demos/core/Chip/Chip.demo.icon.tsx | 4 +- .../src/demos/core/Chip/Chip.demo.states.tsx | 2 +- .../src/demos/core/Chip/Chip.demo.tooltip.tsx | 2 +- .../src/demos/core/Chip/Chip.demos.story.tsx | 2 +- .../CloseButton/CloseButton.demo.usage.tsx | 2 +- .../CloseButton/CloseButton.demos.story.tsx | 2 +- .../src/demos/core/Code/Code.demo.block.tsx | 2 +- .../src/demos/core/Code/Code.demo.colors.tsx | 2 +- .../src/demos/core/Code/Code.demo.usage.tsx | 2 +- .../src/demos/core/Code/Code.demos.story.tsx | 2 +- .../core/Collapse/Collapse.demo.nested.tsx | 2 +- .../Collapse/Collapse.demo.transition.tsx | 4 +- .../core/Collapse/Collapse.demo.usage.tsx | 4 +- .../core/Collapse/Collapse.demos.story.tsx | 2 +- ...olorInput.demo.closeOnColorSwatchClick.tsx | 2 +- .../ColorInput/ColorInput.demo.disabled.tsx | 2 +- .../ColorInput.demo.disallowInput.tsx | 2 +- .../core/ColorInput/ColorInput.demo.error.tsx | 2 +- .../ColorInput.demo.eyeDropperIcon.tsx | 4 +- .../ColorInput/ColorInput.demo.fixOnBlur.tsx | 2 +- .../ColorInput.demo.formatsConfigurator.tsx | 2 +- .../ColorInput.demo.noEyeDropper.tsx | 2 +- .../ColorInput.demo.onChangeEnd.tsx | 2 +- .../ColorInput/ColorInput.demo.readOnly.tsx | 2 +- .../ColorInput.demo.rightSection.tsx | 2 +- .../ColorInput/ColorInput.demo.sections.tsx | 4 +- .../ColorInput/ColorInput.demo.stylesApi.tsx | 2 +- .../ColorInput/ColorInput.demo.swatches.tsx | 2 +- .../ColorInput.demo.swatchesOnly.tsx | 2 +- .../core/ColorInput/ColorInput.demo.usage.tsx | 2 +- .../ColorInput/ColorInput.demo.withPicker.tsx | 2 +- .../ColorInput/ColorInput.demos.story.tsx | 2 +- .../ColorPicker.demo.alphaSlider.tsx | 2 +- .../ColorPicker.demo.formatsConfigurator.tsx | 2 +- .../ColorPicker.demo.fullWidth.tsx | 2 +- .../ColorPicker.demo.hueSlider.tsx | 2 +- .../ColorPicker.demo.sizeConfigurator.tsx | 2 +- .../ColorPicker.demo.stylesApi.tsx | 2 +- .../ColorPicker/ColorPicker.demo.swatches.tsx | 2 +- .../ColorPicker.demo.swatchesConfigurator.tsx | 2 +- .../ColorPicker.demo.swatchesOnly.tsx | 2 +- .../ColorPicker/ColorPicker.demo.usage.tsx | 2 +- .../ColorPicker/ColorPicker.demos.story.tsx | 2 +- .../ColorSwatch.demo.component.tsx | 2 +- .../ColorSwatch/ColorSwatch.demo.shadow.tsx | 2 +- .../ColorSwatch/ColorSwatch.demo.usage.tsx | 2 +- .../ColorSwatch/ColorSwatch.demos.story.tsx | 2 +- .../Combobox/Combobox.demo.activeOption.tsx | 2 +- .../Combobox/Combobox.demo.autocomplete.tsx | 2 +- .../core/Combobox/Combobox.demo.button.tsx | 2 +- .../Combobox/Combobox.demo.buttonSearch.tsx | 2 +- .../Combobox.demo.controlledDropdown.tsx | 2 +- .../core/Combobox/Combobox.demo.groups.tsx | 2 +- .../Combobox/Combobox.demo.hiddenDropdown.tsx | 2 +- .../Combobox/Combobox.demo.multiselect.tsx | 2 +- .../Combobox/Combobox.demo.nativeScroll.tsx | 2 +- .../Combobox/Combobox.demo.noDropdown.tsx | 2 +- .../Combobox/Combobox.demo.scrollArea.tsx | 2 +- .../Combobox.demo.searchableMultiselect.tsx | 2 +- .../Combobox.demo.searchableSelect.tsx | 2 +- .../core/Combobox/Combobox.demo.select.tsx | 2 +- .../Combobox.demo.selectFirstOption.tsx | 2 +- .../core/Combobox/Combobox.demo.stylesApi.tsx | 2 +- .../core/Combobox/Combobox.demos.story.tsx | 2 +- .../core/Container/Container.demo.fluid.tsx | 2 +- .../Container/Container.demo.responsive.tsx | 4 +- .../core/Container/Container.demo.sizes.tsx | 2 +- .../core/Container/Container.demo.usage.tsx | 2 +- .../core/Container/Container.demos.story.tsx | 2 +- .../CopyButton/CopyButton.demo.timeout.tsx | 4 +- .../core/CopyButton/CopyButton.demo.usage.tsx | 2 +- .../CopyButton/CopyButton.demos.story.tsx | 2 +- .../demos/core/Dialog/Dialog.demo.usage.tsx | 4 +- .../demos/core/Dialog/Dialog.demos.story.tsx | 2 +- .../core/Divider/Divider.demo.labels.tsx | 2 +- .../core/Divider/Divider.demo.orientation.tsx | 2 +- .../demos/core/Divider/Divider.demo.sizes.tsx | 2 +- .../demos/core/Divider/Divider.demo.usage.tsx | 2 +- .../core/Divider/Divider.demo.variants.tsx | 2 +- .../core/Divider/Divider.demos.story.tsx | 2 +- .../core/Drawer/Drawer.demo.composition.tsx | 2 +- .../demos/core/Drawer/Drawer.demo.header.tsx | 4 +- .../core/Drawer/Drawer.demo.initialFocus.tsx | 2 +- .../demos/core/Drawer/Drawer.demo.offset.tsx | 4 +- .../core/Drawer/Drawer.demo.overflow.tsx | 2 +- .../demos/core/Drawer/Drawer.demo.overlay.tsx | 4 +- .../core/Drawer/Drawer.demo.positions.tsx | 2 +- .../core/Drawer/Drawer.demo.scrollarea.tsx | 2 +- .../demos/core/Drawer/Drawer.demo.sizes.tsx | 2 +- .../core/Drawer/Drawer.demo.transitions.tsx | 4 +- .../demos/core/Drawer/Drawer.demo.usage.tsx | 4 +- .../demos/core/Drawer/Drawer.demos.story.tsx | 2 +- .../core/Fieldset/Fieldset.demo.disabled.tsx | 2 +- .../core/Fieldset/Fieldset.demo.usage.tsx | 2 +- .../core/Fieldset/Fieldset.demos.story.tsx | 2 +- .../FileButton/FileButton.demo.multiple.tsx | 2 +- .../core/FileButton/FileButton.demo.reset.tsx | 5 +- .../core/FileButton/FileButton.demo.usage.tsx | 2 +- .../FileButton/FileButton.demos.story.tsx | 2 +- .../core/FileInput/FileInput.demo.accept.tsx | 2 +- .../FileInput/FileInput.demo.clearable.tsx | 2 +- .../FileInput/FileInput.demo.disabled.tsx | 2 +- .../core/FileInput/FileInput.demo.error.tsx | 2 +- .../FileInput/FileInput.demo.multiple.tsx | 2 +- .../FileInput/FileInput.demo.sections.tsx | 4 +- .../FileInput/FileInput.demo.stylesApi.tsx | 4 +- .../core/FileInput/FileInput.demo.usage.tsx | 2 +- .../FileInput.demo.valueComponent.tsx | 2 +- .../core/FileInput/FileInput.demos.story.tsx | 2 +- .../core/Flex/Flex.demo.configurator.tsx | 2 +- .../demos/core/Flex/Flex.demo.responsive.tsx | 2 +- .../src/demos/core/Flex/Flex.demos.story.tsx | 2 +- .../core/FocusTrap/FocusTrap.demo.initial.tsx | 2 +- .../core/FocusTrap/FocusTrap.demo.usage.tsx | 2 +- .../core/FocusTrap/FocusTrap.demos.story.tsx | 2 +- .../src/demos/core/Grid/Grid.demos.story.tsx | 2 +- .../Group/Group.demo.preventGrowOverflow.tsx | 2 +- .../src/demos/core/Group/Group.demo.usage.tsx | 2 +- .../demos/core/Group/Group.demos.story.tsx | 2 +- .../Highlight/Highlight.demo.multiple.tsx | 2 +- .../core/Highlight/Highlight.demo.props.tsx | 2 +- .../core/Highlight/Highlight.demo.styles.tsx | 2 +- .../core/Highlight/Highlight.demo.usage.tsx | 2 +- .../core/Highlight/Highlight.demos.story.tsx | 2 +- .../core/HoverCard/HoverCard.demo.delay.tsx | 2 +- .../core/HoverCard/HoverCard.demo.profile.tsx | 2 +- .../core/HoverCard/HoverCard.demo.usage.tsx | 2 +- .../core/HoverCard/HoverCard.demos.story.tsx | 2 +- .../demos/core/Image/Image.demo.contain.tsx | 2 +- .../demos/core/Image/Image.demo.fallback.tsx | 2 +- .../demos/core/Image/Image.demo.height.tsx | 2 +- .../src/demos/core/Image/Image.demo.usage.tsx | 2 +- .../demos/core/Image/Image.demos.story.tsx | 2 +- .../Indicator/Indicator.demo.configurator.tsx | 2 +- .../Indicator/Indicator.demo.disabled.tsx | 4 +- .../core/Indicator/Indicator.demo.inline.tsx | 2 +- .../core/Indicator/Indicator.demo.offset.tsx | 2 +- .../Indicator/Indicator.demo.processing.tsx | 2 +- .../core/Indicator/Indicator.demos.story.tsx | 2 +- .../demos/core/Input/Input.demo.component.tsx | 4 +- .../demos/core/Input/Input.demo.compound.tsx | 2 +- .../core/Input/Input.demo.defaultProps.tsx | 2 +- .../src/demos/core/Input/Input.demo.error.tsx | 4 +- .../core/Input/Input.demo.focusStyles.tsx | 2 +- .../demos/core/Input/Input.demo.inputBase.tsx | 4 +- .../core/Input/Input.demo.inputContainer.tsx | 2 +- .../Input/Input.demo.inputWrapperOrder.tsx | 2 +- .../src/demos/core/Input/Input.demo.mask.tsx | 4 +- .../core/Input/Input.demo.placeholder.tsx | 2 +- .../demos/core/Input/Input.demo.sections.tsx | 4 +- .../core/Input/Input.demo.sharedStyles.tsx | 2 +- .../demos/core/Input/Input.demo.stylesApi.tsx | 4 +- .../src/demos/core/Input/Input.demo.usage.tsx | 2 +- .../demos/core/Input/Input.demo.wrapper.tsx | 2 +- .../Input/Input.demo.wrapperStylesApi.tsx | 2 +- .../demos/core/Input/Input.demos.story.tsx | 2 +- .../JsonInput/JsonInput.demo.configurator.tsx | 2 +- .../JsonInput/JsonInput.demo.disabled.tsx | 2 +- .../JsonInput/JsonInput.demo.stylesApi.tsx | 4 +- .../core/JsonInput/JsonInput.demo.usage.tsx | 2 +- .../core/JsonInput/JsonInput.demos.story.tsx | 2 +- .../src/demos/core/Kbd/Kbd.demos.story.tsx | 2 +- .../src/demos/core/Kbd/Kdb.demo.usage.tsx | 2 +- .../core/List/List.demo.configurator.tsx | 2 +- .../src/demos/core/List/List.demo.icon.tsx | 2 +- .../src/demos/core/List/List.demo.nested.tsx | 2 +- .../src/demos/core/List/List.demos.story.tsx | 2 +- .../core/Loader/Loader.demo.configurator.tsx | 2 +- .../core/Loader/Loader.demo.cssLoader.tsx | 2 +- .../core/Loader/Loader.demo.customType.tsx | 2 +- .../demos/core/Loader/Loader.demo.size.tsx | 2 +- .../demos/core/Loader/Loader.demos.story.tsx | 2 +- .../LoadingOverlay.demo.customLoader.tsx | 2 +- .../LoadingOverlay.demo.loaderProps.tsx | 2 +- .../LoadingOverlay.demo.usage.tsx | 2 +- .../LoadingOverlay.demos.story.tsx | 2 +- .../src/demos/core/Mark/Mark.demo.usage.tsx | 2 +- .../src/demos/core/Mark/Mark.demos.story.tsx | 2 +- .../demos/core/Menu/Menu.demo.component.tsx | 2 +- .../core/Menu/Menu.demo.customControl.tsx | 2 +- .../demos/core/Menu/Menu.demo.disabled.tsx | 12 +- .../demos/core/Menu/Menu.demo.navigation.tsx | 2 +- .../Menu/Menu.demo.positionConfigurator.tsx | 2 +- .../demos/core/Menu/Menu.demo.stylesApi.tsx | 2 +- .../src/demos/core/Menu/Menu.demos.story.tsx | 2 +- .../demos/src/demos/core/Menu/_menu-items.tsx | 10 +- .../demos/core/Modal/Modal.demo.centered.tsx | 2 +- .../core/Modal/Modal.demo.composition.tsx | 2 +- .../core/Modal/Modal.demo.fullScreen.tsx | 2 +- .../Modal/Modal.demo.fullScreenMobile.tsx | 2 +- .../demos/core/Modal/Modal.demo.header.tsx | 4 +- .../core/Modal/Modal.demo.initialFocus.tsx | 2 +- .../demos/core/Modal/Modal.demo.offset.tsx | 2 +- .../demos/core/Modal/Modal.demo.overflow.tsx | 2 +- .../demos/core/Modal/Modal.demo.overlay.tsx | 2 +- .../core/Modal/Modal.demo.scrollarea.tsx | 2 +- .../demos/core/Modal/Modal.demo.sizeAuto.tsx | 4 +- .../src/demos/core/Modal/Modal.demo.sizes.tsx | 2 +- .../core/Modal/Modal.demo.transitions.tsx | 2 +- .../src/demos/core/Modal/Modal.demo.usage.tsx | 2 +- .../demos/core/Modal/Modal.demos.story.tsx | 2 +- .../MultiSelect.demo.checkIcon.tsx | 2 +- .../MultiSelect.demo.clearable.tsx | 2 +- .../MultiSelect.demo.configurator.tsx | 2 +- .../MultiSelect/MultiSelect.demo.disabled.tsx | 2 +- .../MultiSelect.demo.disabledOptions.tsx | 2 +- .../MultiSelect.demo.dropdownAnimation.tsx | 2 +- .../MultiSelect.demo.dropdownOffset.tsx | 2 +- .../MultiSelect.demo.dropdownOpened.tsx | 4 +- .../MultiSelect.demo.dropdownPadding.tsx | 2 +- .../MultiSelect.demo.dropdownPosition.tsx | 2 +- .../MultiSelect.demo.dropdownShadow.tsx | 2 +- .../MultiSelect/MultiSelect.demo.error.tsx | 2 +- .../MultiSelect/MultiSelect.demo.groups.tsx | 2 +- .../MultiSelect.demo.hidePickedOptions.tsx | 2 +- .../MultiSelect/MultiSelect.demo.limit.tsx | 2 +- .../MultiSelect.demo.maxValues.tsx | 2 +- .../MultiSelect.demo.nothingFound.tsx | 2 +- .../MultiSelect/MultiSelect.demo.readOnly.tsx | 2 +- .../MultiSelect.demo.scrollArea.tsx | 2 +- .../MultiSelect/MultiSelect.demo.search.tsx | 2 +- .../MultiSelect.demo.searchable.tsx | 2 +- .../MultiSelect/MultiSelect.demo.sections.tsx | 4 +- .../MultiSelect/MultiSelect.demo.sort.tsx | 2 +- .../MultiSelect.demo.stylesApi.tsx | 2 +- .../MultiSelect/MultiSelect.demo.usage.tsx | 2 +- .../MultiSelect.demo.withinPopover.tsx | 2 +- .../MultiSelect/MultiSelect.demos.story.tsx | 2 +- .../NativeSelect/NativeSelect.demo.data.tsx | 2 +- .../NativeSelect.demo.disabled.tsx | 2 +- .../NativeSelect/NativeSelect.demo.error.tsx | 2 +- .../NativeSelect.demo.options.tsx | 2 +- .../NativeSelect.demo.sections.tsx | 4 +- .../NativeSelect.demo.stylesApi.tsx | 2 +- .../NativeSelect/NativeSelect.demo.usage.tsx | 2 +- .../NativeSelect/NativeSelect.demos.story.tsx | 2 +- .../core/NavLink/NavLink.demo.active.tsx | 4 +- .../core/NavLink/NavLink.demo.nested.tsx | 2 +- .../demos/core/NavLink/NavLink.demo.usage.tsx | 10 +- .../core/NavLink/NavLink.demos.story.tsx | 2 +- .../Notification.demo.configurator.tsx | 2 +- .../Notification/Notification.demo.icon.tsx | 4 +- .../Notification.demo.stylesApi.tsx | 4 +- .../Notification/Notification.demos.story.tsx | 2 +- .../NumberFormatter.demo.decimalScale.tsx | 2 +- .../NumberFormatter.demo.prefixSuffix.tsx | 2 +- ...umberFormatter.demo.thousandsSeparator.tsx | 2 +- .../NumberFormatter.demo.usage.tsx | 2 +- .../NumberFormatter.demos.story.tsx | 2 +- .../NumberInput.demo.allowDecimal.tsx | 2 +- .../NumberInput.demo.allowNegative.tsx | 2 +- .../NumberInput.demo.decimalScale.tsx | 2 +- .../NumberInput.demo.decimalSeparator.tsx | 2 +- .../NumberInput/NumberInput.demo.disabled.tsx | 2 +- .../NumberInput/NumberInput.demo.error.tsx | 2 +- .../NumberInput.demo.fixedDecimalScale.tsx | 2 +- .../NumberInput/NumberInput.demo.handlers.tsx | 2 +- .../NumberInput/NumberInput.demo.minMax.tsx | 2 +- .../NumberInput.demo.prefixSuffix.tsx | 2 +- .../NumberInput.demo.rightSection.tsx | 4 +- .../NumberInput/NumberInput.demo.sections.tsx | 4 +- .../NumberInput.demo.strictClamp.tsx | 2 +- .../NumberInput.demo.stylesApi.tsx | 4 +- .../NumberInput.demo.thousandsSeparator.tsx | 2 +- .../NumberInput/NumberInput.demo.usage.tsx | 2 +- .../NumberInput/NumberInput.demos.story.tsx | 2 +- .../demos/core/Overlay/Overlay.demo.blur.tsx | 2 +- .../core/Overlay/Overlay.demo.gradient.tsx | 2 +- .../demos/core/Overlay/Overlay.demo.usage.tsx | 2 +- .../core/Overlay/Overlay.demos.story.tsx | 2 +- .../Pagination/Pagination.demo.boundaries.tsx | 2 +- .../Pagination.demo.composition.tsx | 2 +- .../Pagination.demo.configurator.tsx | 2 +- .../core/Pagination/Pagination.demo.icons.tsx | 6 +- .../core/Pagination/Pagination.demo.links.tsx | 2 +- .../Pagination/Pagination.demo.siblings.tsx | 2 +- .../Pagination/Pagination.demo.stylesApi.tsx | 2 +- .../core/Pagination/Pagination.demo.usage.tsx | 2 +- .../Pagination.demo.withContent.tsx | 4 +- .../Pagination/Pagination.demos.story.tsx | 2 +- .../src/demos/core/Paper/Paper.demo.usage.tsx | 2 +- .../demos/core/Paper/Paper.demos.story.tsx | 2 +- ...asswordInput.demo.controlledVisibility.tsx | 2 +- .../PasswordInput.demo.disabled.tsx | 2 +- .../PasswordInput.demo.error.tsx | 2 +- .../PasswordInput.demo.sections.tsx | 4 +- .../PasswordInput.demo.strengthMeter.tsx | 4 +- .../PasswordInput.demo.stylesApi.tsx | 4 +- .../PasswordInput.demo.usage.tsx | 2 +- .../PasswordInput.demo.visibilityIcon.tsx | 2 +- .../PasswordInput.demos.story.tsx | 2 +- .../demos/core/Pill/Pill.demo.stylesApi.tsx | 2 +- .../src/demos/core/Pill/Pill.demo.usage.tsx | 2 +- .../demos/core/Pill/Pill.demo.withinInput.tsx | 2 +- .../src/demos/core/Pill/Pill.demos.story.tsx | 2 +- .../PillsInput.demo.configurator.tsx | 2 +- .../core/PillsInput/PillsInput.demo.usage.tsx | 2 +- .../PillsInput/PillsInput.demos.story.tsx | 2 +- .../PinInput/PinInput.demo.configurator.tsx | 2 +- .../core/PinInput/PinInput.demo.regexp.tsx | 2 +- .../core/PinInput/PinInput.demo.stylesApi.tsx | 2 +- .../core/PinInput/PinInput.demos.story.tsx | 2 +- .../demos/core/Popover/Popover.demo.arrow.tsx | 2 +- .../Popover.demo.clickOutsideEvents.tsx | 2 +- .../core/Popover/Popover.demo.disabled.tsx | 2 +- .../demos/core/Popover/Popover.demo.form.tsx | 2 +- .../demos/core/Popover/Popover.demo.hover.tsx | 2 +- .../core/Popover/Popover.demo.inline.tsx | 2 +- .../core/Popover/Popover.demo.offset.tsx | 2 +- .../core/Popover/Popover.demo.offsetAxis.tsx | 2 +- .../Popover/Popover.demo.portalChildren.tsx | 2 +- .../core/Popover/Popover.demo.sameWidth.tsx | 2 +- .../demos/core/Popover/Popover.demo.usage.tsx | 2 +- .../core/Popover/Popover.demos.story.tsx | 2 +- .../core/Progress/Progress.demo.compound.tsx | 2 +- .../core/Progress/Progress.demo.stylesApi.tsx | 2 +- .../core/Progress/Progress.demo.tooltips.tsx | 2 +- .../core/Progress/Progress.demo.usage.tsx | 2 +- .../core/Progress/Progress.demos.story.tsx | 2 +- .../core/Radio/Radio.demo.configurator.tsx | 2 +- .../demos/core/Radio/Radio.demo.disabled.tsx | 4 +- .../Radio/Radio.demo.groupConfigurator.tsx | 2 +- .../src/demos/core/Radio/Radio.demo.icon.tsx | 2 +- .../demos/core/Radio/Radio.demo.iconColor.tsx | 2 +- .../demos/core/Radio/Radio.demo.states.tsx | 2 +- .../demos/core/Radio/Radio.demo.stylesApi.tsx | 2 +- .../demos/core/Radio/Radio.demo.tooltip.tsx | 2 +- .../demos/core/Radio/Radio.demos.story.tsx | 2 +- .../core/Rating/Rating.demo.configurator.tsx | 2 +- .../core/Rating/Rating.demo.customSymbol.tsx | 8 +- .../core/Rating/Rating.demo.fractions.tsx | 2 +- .../core/Rating/Rating.demo.readOnly.tsx | 2 +- .../demos/core/Rating/Rating.demo.symbol.tsx | 4 +- .../demos/core/Rating/Rating.demos.story.tsx | 2 +- .../RingProgress.demo.configurator.tsx | 2 +- .../RingProgress/RingProgress.demo.label.tsx | 2 +- .../RingProgress.demo.rootColor.tsx | 2 +- .../RingProgress.demo.sectionsProps.tsx | 2 +- .../RingProgress.demo.tooltip.tsx | 2 +- .../RingProgress/RingProgress.demo.usage.tsx | 2 +- .../RingProgress/RingProgress.demos.story.tsx | 2 +- .../ScrollArea.demo.autosizePopover.tsx | 4 +- .../ScrollArea/ScrollArea.demo.horizontal.tsx | 2 +- .../ScrollArea/ScrollArea.demo.maxHeight.tsx | 2 +- .../ScrollArea.demo.scrollIntoView.tsx | 4 +- .../ScrollArea.demo.scrollPosition.tsx | 2 +- .../ScrollArea/ScrollArea.demo.scrollTo.tsx | 2 +- .../ScrollArea/ScrollArea.demo.scrollbars.tsx | 2 +- .../ScrollArea/ScrollArea.demo.stylesApi.tsx | 2 +- .../core/ScrollArea/ScrollArea.demo.usage.tsx | 2 +- .../ScrollArea/ScrollArea.demos.story.tsx | 2 +- .../SegmentedControl.demo.configurator.tsx | 2 +- .../SegmentedControl.demo.disabled.tsx | 2 +- .../SegmentedControl.demo.iconsOnly.tsx | 4 +- .../SegmentedControl.demo.labels.tsx | 4 +- .../SegmentedControl.demo.readOnly.tsx | 2 +- .../SegmentedControl.demo.stylesApi.tsx | 2 +- .../SegmentedControl.demo.transitions.tsx | 2 +- .../SegmentedControl.demo.usage.tsx | 2 +- .../SegmentedControl.demos.story.tsx | 2 +- .../core/Select/Select.demo.allowDeselect.tsx | 2 +- .../core/Select/Select.demo.checkIcon.tsx | 2 +- .../core/Select/Select.demo.clearable.tsx | 2 +- .../core/Select/Select.demo.configurator.tsx | 2 +- .../core/Select/Select.demo.disabled.tsx | 2 +- .../Select/Select.demo.disabledOptions.tsx | 2 +- .../Select/Select.demo.dropdownAnimation.tsx | 2 +- .../Select/Select.demo.dropdownOffset.tsx | 2 +- .../Select/Select.demo.dropdownOpened.tsx | 4 +- .../Select/Select.demo.dropdownPadding.tsx | 2 +- .../Select/Select.demo.dropdownPosition.tsx | 2 +- .../Select/Select.demo.dropdownShadow.tsx | 2 +- .../demos/core/Select/Select.demo.error.tsx | 2 +- .../demos/core/Select/Select.demo.groups.tsx | 2 +- .../demos/core/Select/Select.demo.limit.tsx | 2 +- .../core/Select/Select.demo.nothingFound.tsx | 2 +- .../core/Select/Select.demo.readOnly.tsx | 2 +- .../core/Select/Select.demo.scrollArea.tsx | 2 +- .../demos/core/Select/Select.demo.search.tsx | 2 +- .../core/Select/Select.demo.searchable.tsx | 2 +- .../core/Select/Select.demo.sections.tsx | 4 +- .../demos/core/Select/Select.demo.sort.tsx | 2 +- .../core/Select/Select.demo.stylesApi.tsx | 4 +- .../demos/core/Select/Select.demo.usage.tsx | 2 +- .../core/Select/Select.demo.withinPopover.tsx | 2 +- .../demos/core/Select/Select.demos.story.tsx | 2 +- .../SimpleGrid/SimpleGrid.demo.responsive.tsx | 2 +- .../SimpleGrid/SimpleGrid.demos.story.tsx | 2 +- .../src/demos/core/SimpleGrid/_demo-item.tsx | 2 +- .../Skeleton/Skeleton.demo.configurator.tsx | 2 +- .../core/Skeleton/Skeleton.demo.content.tsx | 2 +- .../core/Skeleton/Skeleton.demos.story.tsx | 2 +- .../core/Slider/Slider.demo.changeEnd.tsx | 2 +- .../core/Slider/Slider.demo.configurator.tsx | 2 +- .../core/Slider/Slider.demo.customize.tsx | 2 +- .../demos/core/Slider/Slider.demo.decimal.tsx | 2 +- .../core/Slider/Slider.demo.decimalRange.tsx | 2 +- .../core/Slider/Slider.demo.disabled.tsx | 2 +- .../core/Slider/Slider.demo.inverted.tsx | 2 +- .../demos/core/Slider/Slider.demo.label.tsx | 2 +- .../demos/core/Slider/Slider.demo.marks.tsx | 2 +- .../demos/core/Slider/Slider.demo.scale.tsx | 2 +- .../demos/core/Slider/Slider.demo.step.tsx | 2 +- .../core/Slider/Slider.demo.stylesApi.tsx | 2 +- .../core/Slider/Slider.demo.thumbChildren.tsx | 4 +- .../core/Slider/Slider.demo.thumbSize.tsx | 2 +- .../demos/core/Slider/Slider.demos.story.tsx | 2 +- .../core/Space/Space.demo.horizontal.tsx | 2 +- .../demos/core/Space/Space.demo.vertical.tsx | 2 +- .../demos/core/Space/Space.demos.story.tsx | 2 +- .../core/Spoiler/Spoiler.demos.story.tsx | 2 +- .../demos/src/demos/core/Spoiler/_wrapper.tsx | 2 +- .../core/Stack/Stack.demo.configurator.tsx | 2 +- .../demos/core/Stack/Stack.demos.story.tsx | 2 +- .../Stepper.demo.allowNextStepsSelect.tsx | 2 +- .../Stepper/Stepper.demo.allowStepSelect.tsx | 2 +- .../Stepper/Stepper.demo.configurator.tsx | 2 +- .../Stepper/Stepper.demo.iconPosition.tsx | 2 +- .../Stepper.demo.iconSizeConfigurator.tsx | 2 +- .../demos/core/Stepper/Stepper.demo.icons.tsx | 6 +- .../core/Stepper/Stepper.demo.iconsOnly.tsx | 4 +- .../core/Stepper/Stepper.demo.loading.tsx | 2 +- .../core/Stepper/Stepper.demo.orientation.tsx | 2 +- .../core/Stepper/Stepper.demo.stepColor.tsx | 2 +- .../core/Stepper/Stepper.demo.stylesApi.tsx | 2 +- .../core/Stepper/Stepper.demo.stylesApi2.tsx | 2 +- .../core/Stepper/Stepper.demo.stylesApi3.tsx | 2 +- .../demos/core/Stepper/Stepper.demo.usage.tsx | 2 +- .../core/Stepper/Stepper.demos.story.tsx | 2 +- .../core/Switch/Switch.demo.configurator.tsx | 2 +- .../Switch/Switch.demo.groupConfigurator.tsx | 2 +- .../core/Switch/Switch.demo.iconLabels.tsx | 4 +- .../demos/core/Switch/Switch.demo.labels.tsx | 2 +- .../core/Switch/Switch.demo.stylesApi.tsx | 2 +- .../core/Switch/Switch.demo.thumbIcon.tsx | 4 +- .../demos/core/Switch/Switch.demo.tooltip.tsx | 2 +- .../demos/core/Switch/Switch.demos.story.tsx | 2 +- .../src/demos/core/Table/Table.demo.data.tsx | 2 +- .../core/Table/Table.demo.rowSelection.tsx | 2 +- .../demos/core/Table/Table.demos.story.tsx | 2 +- .../src/demos/core/Tabs/Tabs.demo.colors.tsx | 2 +- .../demos/core/Tabs/Tabs.demo.customize.tsx | 4 +- .../demos/core/Tabs/Tabs.demo.deactivate.tsx | 2 +- .../demos/core/Tabs/Tabs.demo.disabled.tsx | 2 +- .../demos/core/Tabs/Tabs.demo.inverted.tsx | 3 +- .../Tabs/Tabs.demo.keyboardActivation.tsx | 2 +- .../demos/core/Tabs/Tabs.demo.placement.tsx | 2 +- .../demos/core/Tabs/Tabs.demo.position.tsx | 2 +- .../src/demos/core/Tabs/Tabs.demo.pull.tsx | 2 +- .../demos/core/Tabs/Tabs.demo.stylesApi.tsx | 4 +- .../src/demos/core/Tabs/Tabs.demo.usage.tsx | 4 +- .../src/demos/core/Tabs/Tabs.demos.story.tsx | 2 +- .../TagsInput.demo.allowDuplicates.tsx | 2 +- .../TagsInput/TagsInput.demo.clearable.tsx | 2 +- .../TagsInput/TagsInput.demo.configurator.tsx | 2 +- .../core/TagsInput/TagsInput.demo.data.tsx | 2 +- .../TagsInput/TagsInput.demo.disabled.tsx | 2 +- .../TagsInput.demo.disabledOptions.tsx | 2 +- .../TagsInput.demo.dropdownAnimation.tsx | 2 +- .../TagsInput.demo.dropdownOpened.tsx | 4 +- .../TagsInput.demo.dropdownPadding.tsx | 2 +- .../TagsInput.demo.dropdownPosition.tsx | 2 +- .../TagsInput.demo.dropdownShadow.tsx | 2 +- .../core/TagsInput/TagsInput.demo.error.tsx | 2 +- .../core/TagsInput/TagsInput.demo.groups.tsx | 2 +- .../core/TagsInput/TagsInput.demo.limit.tsx | 2 +- .../core/TagsInput/TagsInput.demo.maxTags.tsx | 2 +- .../TagsInput/TagsInput.demo.readOnly.tsx | 2 +- .../TagsInput/TagsInput.demo.scrollArea.tsx | 2 +- .../core/TagsInput/TagsInput.demo.search.tsx | 2 +- .../TagsInput/TagsInput.demo.sections.tsx | 4 +- .../core/TagsInput/TagsInput.demo.sort.tsx | 2 +- .../TagsInput/TagsInput.demo.splitChars.tsx | 2 +- .../TagsInput/TagsInput.demo.stylesApi.tsx | 4 +- .../core/TagsInput/TagsInput.demo.usage.tsx | 2 +- .../TagsInput.demo.withinPopover.tsx | 2 +- .../core/TagsInput/TagsInput.demos.story.tsx | 2 +- .../demos/core/Text/Text.demo.gradient.tsx | 2 +- .../src/demos/core/Text/Text.demo.inherit.tsx | 2 +- .../demos/core/Text/Text.demo.lineClamp.tsx | 2 +- .../core/Text/Text.demo.linesConfigurator.tsx | 2 +- .../demos/core/Text/Text.demo.truncate.tsx | 2 +- .../src/demos/core/Text/Text.demo.usage.tsx | 2 +- .../src/demos/core/Text/Text.demos.story.tsx | 2 +- .../TextInput/TextInput.demo.disabled.tsx | 2 +- .../core/TextInput/TextInput.demo.error.tsx | 2 +- .../TextInput/TextInput.demo.sections.tsx | 4 +- .../TextInput/TextInput.demo.stylesApi.tsx | 4 +- .../core/TextInput/TextInput.demo.type.tsx | 2 +- .../core/TextInput/TextInput.demo.usage.tsx | 2 +- .../core/TextInput/TextInput.demos.story.tsx | 2 +- .../core/Textarea/Textarea.demo.autosize.tsx | 2 +- .../Textarea/Textarea.demo.configurator.tsx | 2 +- .../core/Textarea/Textarea.demo.disabled.tsx | 2 +- .../core/Textarea/Textarea.demo.error.tsx | 2 +- .../core/Textarea/Textarea.demo.stylesApi.tsx | 4 +- .../core/Textarea/Textarea.demos.story.tsx | 2 +- .../ThemeIcon/ThemeIcon.demo.gradient.tsx | 4 +- .../core/ThemeIcon/ThemeIcon.demo.usage.tsx | 2 +- .../core/ThemeIcon/ThemeIcon.demos.story.tsx | 2 +- .../core/Timeline/Timeline.demo.bullet.tsx | 4 +- .../Timeline/Timeline.demo.configurator.tsx | 2 +- .../core/Timeline/Timeline.demo.usage.tsx | 2 +- .../core/Timeline/Timeline.demos.story.tsx | 2 +- .../demos/src/demos/core/Timeline/_base.tsx | 2 +- .../demos/core/Title/Title.demo.lineClamp.tsx | 2 +- .../src/demos/core/Title/Title.demo.size.tsx | 2 +- .../src/demos/core/Title/Title.demo.usage.tsx | 2 +- .../demos/core/Title/Title.demos.story.tsx | 2 +- .../demos/core/Tooltip/Tooltip.demo.arrow.tsx | 2 +- .../Tooltip/Tooltip.demo.configurator.tsx | 2 +- .../core/Tooltip/Tooltip.demo.controlled.tsx | 2 +- .../demos/core/Tooltip/Tooltip.demo.delay.tsx | 2 +- .../core/Tooltip/Tooltip.demo.floating.tsx | 2 +- .../demos/core/Tooltip/Tooltip.demo.group.tsx | 2 +- .../core/Tooltip/Tooltip.demo.inline.tsx | 2 +- .../core/Tooltip/Tooltip.demo.multiline.tsx | 2 +- .../core/Tooltip/Tooltip.demo.nested.tsx | 2 +- .../core/Tooltip/Tooltip.demo.offset.tsx | 2 +- .../core/Tooltip/Tooltip.demo.offsetAxis.tsx | 2 +- .../core/Tooltip/Tooltip.demo.transitions.tsx | 2 +- .../demos/core/Tooltip/Tooltip.demo.usage.tsx | 2 +- .../core/Tooltip/Tooltip.demos.story.tsx | 2 +- .../Transition/Transition.demo.custom.tsx | 4 +- .../Transition/Transition.demos.story.tsx | 2 +- .../TypographyStylesProvider.demo.usage.tsx | 2 +- .../TypographyStylesProvider.demos.story.tsx | 2 +- .../UnstyledButton.demo.usage.tsx | 2 +- .../UnstyledButton.demos.story.tsx | 2 +- .../dates/Calendar/Calendar.demo.isStatic.tsx | 2 +- .../dates/Calendar/Calendar.demo.picker.tsx | 2 +- .../dates/Calendar/Calendar.demo.usage.tsx | 2 +- .../Calendar/Calendar.demo.weekPicker.tsx | 4 +- .../dates/Calendar/Calendar.demos.story.tsx | 2 +- .../DateInput/DateInput.demo.clearable.tsx | 2 +- .../DateInput/DateInput.demo.configurator.tsx | 2 +- .../DateInput/DateInput.demo.deselect.tsx | 2 +- .../DateInput/DateInput.demo.disabled.tsx | 2 +- .../dates/DateInput/DateInput.demo.format.tsx | 2 +- .../dates/DateInput/DateInput.demo.minMax.tsx | 2 +- .../dates/DateInput/DateInput.demo.parser.tsx | 2 +- .../dates/DateInput/DateInput.demo.time.tsx | 2 +- .../dates/DateInput/DateInput.demo.usage.tsx | 2 +- .../dates/DateInput/DateInput.demos.story.tsx | 2 +- .../DatePicker.demo.controlProps.tsx | 2 +- .../DatePicker.demo.controlledDate.tsx | 2 +- .../DatePicker.demo.defaultDate.tsx | 2 +- .../DatePicker.demo.defaultLevel.tsx | 2 +- .../DatePicker.demo.firstDayOfWeek.tsx | 2 +- .../DatePicker.demo.hideOutsideDates.tsx | 2 +- .../DatePicker.demo.hideWeekdays.tsx | 2 +- .../DatePicker.demo.labelFormat.tsx | 2 +- .../DatePicker/DatePicker.demo.listFormat.tsx | 2 +- .../DatePicker/DatePicker.demo.locale.tsx | 3 +- .../DatePicker/DatePicker.demo.maxLevel.tsx | 2 +- .../DatePicker/DatePicker.demo.minMax.tsx | 2 +- .../DatePicker/DatePicker.demo.renderDay.tsx | 2 +- .../DatePicker.demo.weekendDays.tsx | 2 +- .../DatePicker/DatePicker.demos.story.tsx | 2 +- .../DatePickerInput.demo.disabled.tsx | 2 +- .../DatePickerInput.demo.valueFormat.tsx | 2 +- .../DatePickerInput.demos.story.tsx | 2 +- .../DateTimePicker.demo.clearable.tsx | 2 +- .../DateTimePicker.demo.configurator.tsx | 2 +- .../DateTimePicker.demo.disabled.tsx | 2 +- .../DateTimePicker.demo.format.tsx | 2 +- .../DateTimePicker.demo.modal.tsx | 2 +- .../DateTimePicker.demo.usage.tsx | 2 +- .../DateTimePicker.demo.withSeconds.tsx | 2 +- .../DateTimePicker.demos.story.tsx | 2 +- .../DatesProvider.demo.timezone.tsx | 2 +- .../DatesProvider.demo.usage.tsx | 3 +- .../DatesProvider.demos.story.tsx | 2 +- .../MonthPicker.demo.controlProps.tsx | 2 +- .../MonthPicker.demo.controlledDate.tsx | 2 +- .../MonthPicker.demo.defaultDate.tsx | 2 +- .../MonthPicker.demo.labelFormat.tsx | 2 +- .../MonthPicker.demo.listFormat.tsx | 2 +- .../MonthPicker/MonthPicker.demo.locale.tsx | 3 +- .../MonthPicker/MonthPicker.demo.maxLevel.tsx | 2 +- .../MonthPicker/MonthPicker.demo.minMax.tsx | 2 +- .../MonthPicker/MonthPicker.demos.story.tsx | 2 +- .../MonthPickerInput.demo.disabled.tsx | 2 +- .../MonthPickerInput.demo.valueFormat.tsx | 2 +- .../MonthPickerInput.demos.story.tsx | 2 +- .../TimeInput/TimeInput.demo.configurator.tsx | 2 +- .../TimeInput/TimeInput.demo.disabled.tsx | 2 +- .../dates/TimeInput/TimeInput.demo.icon.tsx | 4 +- .../dates/TimeInput/TimeInput.demo.picker.tsx | 2 +- .../TimeInput/TimeInput.demo.withSeconds.tsx | 2 +- .../dates/TimeInput/TimeInput.demos.story.tsx | 2 +- .../YearPicker.demo.controlProps.tsx | 2 +- .../YearPicker.demo.controlledDate.tsx | 2 +- .../YearPicker.demo.decadeLabelFormat.tsx | 2 +- .../YearPicker.demo.defaultDate.tsx | 2 +- .../YearPicker/YearPicker.demo.minMax.tsx | 2 +- .../YearPicker.demo.yearsListFormat.tsx | 2 +- .../YearPicker/YearPicker.demos.story.tsx | 2 +- .../YearPickerInput.demo.disabled.tsx | 2 +- .../YearPickerInput.demo.valueFormat.tsx | 2 +- .../YearPickerInput.demos.story.tsx | 2 +- .../dates/_shared/get-shared-picker-demos.ts | 4 +- .../_shared/get-shared-picker-input-demos.ts | 10 +- .../dates/_shared/picker-input-icon.demo.tsx | 2 +- .../_shared/picker-numberOfColumns.demo.tsx | 2 +- .../demos/dropzone/Dropzone.demo.preview.tsx | 4 +- .../dropzone/Dropzone.demo.stylesApi.tsx | 2 +- .../@docs/demos/src/demos/dropzone/_base.tsx | 4 +- .../demos/form/Form.demo.asyncSetValues.tsx | 2 +- .../form/Form.demo.blurFieldValidation.tsx | 4 +- .../demos/form/Form.demo.blurValidation.tsx | 2 +- .../form/Form.demo.clearErrorOnChange.tsx | 4 +- .../demos/src/demos/form/Form.demo.dnd.tsx | 6 +- .../demos/src/demos/form/Form.demo.lists.tsx | 4 +- .../form/Form.demo.liveFieldValidation.tsx | 2 +- .../demos/form/Form.demo.liveValidation.tsx | 2 +- .../src/demos/form/Form.demo.localStorage.tsx | 2 +- .../demos/src/demos/form/Form.demo.nested.tsx | 2 +- .../demos/form/Form.demo.onSubmitErrors.tsx | 4 +- .../src/demos/form/Form.demo.password.tsx | 4 +- .../demos/src/demos/form/Form.demo.reset.tsx | 2 +- .../demos/form/Form.demo.rulesValidation.tsx | 2 +- .../demos/form/Form.demo.setFieldValue.tsx | 4 +- .../src/demos/form/Form.demo.setValues.tsx | 4 +- .../demos/src/demos/form/Form.demo.status.tsx | 2 +- .../src/demos/form/Form.demo.stepper.tsx | 4 +- .../demos/form/Form.demo.transformValues.tsx | 4 +- .../demos/src/demos/form/Form.demo.usage.tsx | 4 +- .../demos/form/Form.demo.validateFunction.tsx | 2 +- .../src/demos/form/Form.demo.validators.tsx | 4 +- .../demos/form/Form.demo.validatorsEmpty.tsx | 4 +- .../demos/src/demos/form/Form.demos.story.tsx | 2 +- .../guides/Guides.demo.createPolymorphic.tsx | 2 +- .../demos/guides/Guides.demo.customIcon.tsx | 2 +- .../src/demos/guides/Guides.demo.icon.tsx | 2 +- .../guides/Guides.demo.newPolymorphic.tsx | 2 +- .../demos/guides/Guides.demo.polymorphic.tsx | 2 +- .../guides/Guides.demo.staticPolymorphic.tsx | 2 +- .../src/demos/guides/Guides.demos.story.tsx | 2 +- .../src/demos/hooks/Hooks.demos.story.tsx | 2 +- .../hooks/use-click-outside.demo.events.tsx | 4 +- .../hooks/use-click-outside.demo.usage.tsx | 4 +- .../demos/hooks/use-clipboard.usage.demo.tsx | 2 +- .../hooks/use-color-scheme.demo.usage.tsx | 2 +- .../demos/hooks/use-counter.demo.usage.tsx | 4 +- .../use-debounced-state.demo.leading.tsx | 2 +- .../hooks/use-debounced-state.demo.usage.tsx | 2 +- .../hooks/use-debounced-value.demo.cancel.tsx | 2 +- .../use-debounced-value.demo.leading.tsx | 2 +- .../hooks/use-debounced-value.demo.usage.tsx | 2 +- .../hooks/use-document-title.demo.usage.tsx | 4 +- .../use-document-visibility.demo.usage.tsx | 2 +- .../hooks/use-element-size.demo.usage.tsx | 4 +- .../hooks/use-event-listener.demo.usage.tsx | 4 +- .../hooks/use-eye-dropper.demo.usage.tsx | 4 +- .../demos/hooks/use-favicon.demo.usage.tsx | 4 +- .../hooks/use-focus-within.demo.usage.tsx | 2 +- .../hooks/use-force-update.demo.usage.tsx | 4 +- .../demos/hooks/use-fullscreen.demo.ref.tsx | 2 +- .../demos/hooks/use-fullscreen.demo.usage.tsx | 2 +- .../src/demos/hooks/use-hash.demo.usage.tsx | 4 +- .../demos/hooks/use-hotkeys.demo.usage.tsx | 2 +- .../src/demos/hooks/use-hover.demo.usage.tsx | 2 +- .../src/demos/hooks/use-idle.demo.events.tsx | 2 +- .../src/demos/hooks/use-idle.demo.state.tsx | 2 +- .../src/demos/hooks/use-idle.demo.usage.tsx | 2 +- .../hooks/use-intersection.demo.usage.tsx | 2 +- .../demos/hooks/use-interval.demo.usage.tsx | 6 +- .../src/demos/hooks/use-logger.demo.usage.tsx | 2 +- .../hooks/use-media-query.demo.usage.tsx | 2 +- .../src/demos/hooks/use-mouse.demo.ref.tsx | 4 +- .../src/demos/hooks/use-mouse.demo.usage.tsx | 4 +- .../src/demos/hooks/use-move.demo.color.tsx | 2 +- .../demos/hooks/use-move.demo.horizontal.tsx | 4 +- .../src/demos/hooks/use-move.demo.usage.tsx | 4 +- .../demos/hooks/use-move.demo.vertical.tsx | 4 +- .../demos/hooks/use-network.demo.usage.tsx | 4 +- .../src/demos/hooks/use-os.demo.usage.tsx | 2 +- .../demos/hooks/use-page-leave.demo.usage.tsx | 2 +- .../demos/hooks/use-previous.demo.usage.tsx | 4 +- .../hooks/use-reduced-motion.demo.usage.tsx | 2 +- .../hooks/use-resize-observer.demo.usage.tsx | 4 +- .../hooks/use-scroll-into-view.demo.axis.tsx | 2 +- .../use-scroll-into-view.demo.parent.tsx | 2 +- .../hooks/use-scroll-into-view.demo.usage.tsx | 2 +- .../hooks/use-text-selection.demo.usage.tsx | 2 +- .../demos/hooks/use-timeout.demo.usage.tsx | 4 +- .../src/demos/hooks/use-toggle.demo.usage.tsx | 2 +- .../hooks/use-validated-state.demo.usage.tsx | 4 +- .../demos/hooks/use-viewport-size.demo.tsx | 2 +- .../hooks/use-window-scroll.demo.usage.tsx | 2 +- .../src/demos/modals/Modals.demo.confirm.tsx | 2 +- .../modals/Modals.demo.confirmCustomize.tsx | 2 +- .../src/demos/modals/Modals.demo.content.tsx | 4 +- .../src/demos/modals/Modals.demo.context.tsx | 2 +- .../demos/modals/Modals.demo.modalProps.tsx | 2 +- .../modals/Modals.demo.multipleSteps.tsx | 2 +- .../src/demos/modals/Modals.demos.story.tsx | 2 +- .../Notifications.demo.autoclose.tsx | 4 +- .../notifications/Notifications.demo.base.tsx | 2 +- .../Notifications.demo.clean.tsx | 4 +- .../Notifications.demo.customize.tsx | 2 +- .../Notifications.demo.limit.tsx | 2 +- .../Notifications.demo.update.tsx | 2 +- .../Notifications.demos.story.tsx | 2 +- .../demos/nprogress/NProgress.demo.usage.tsx | 2 +- .../demos/nprogress/NProgress.demos.story.tsx | 2 +- .../spotlight/Spotlight.demo.compound.tsx | 6 +- .../spotlight/Spotlight.demo.customAction.tsx | 6 +- .../demos/spotlight/Spotlight.demo.groups.tsx | 2 +- .../demos/spotlight/Spotlight.demo.limit.tsx | 2 +- .../spotlight/Spotlight.demo.scrollable.tsx | 2 +- .../demos/spotlight/Spotlight.demo.usage.tsx | 4 +- .../demos/spotlight/Spotlight.demos.story.tsx | 2 +- .../demos/src/demos/spotlight/_demo-base.tsx | 2 +- .../demos/styles/Styles.demo.className.tsx | 2 +- .../demos/styles/Styles.demo.classNames.tsx | 2 +- .../styles/Styles.demo.classNamesProps.tsx | 4 +- .../styles/Styles.demo.customVariant.tsx | 2 +- .../styles/Styles.demo.dataAttributes.tsx | 4 +- .../src/demos/styles/Styles.demo.dataSize.tsx | 2 +- .../styles/Styles.demo.directionControl.tsx | 4 +- .../styles/Styles.demo.globalClasses.tsx | 2 +- .../styles/Styles.demo.hiddenVisible.tsx | 2 +- .../styles/Styles.demo.lightDarkHidden.tsx | 2 +- .../demos/styles/Styles.demo.remSlider.tsx | 2 +- .../Styles.demo.responsiveStyleProps.tsx | 2 +- .../demos/styles/Styles.demo.sizesMedia.tsx | 2 +- .../src/demos/styles/Styles.demo.styles.tsx | 2 +- .../src/demos/styles/Styles.demo.unstyled.tsx | 2 +- .../styles/Styles.demo.useMediaQueryHook.tsx | 4 +- .../src/demos/styles/Styles.demo.vars.tsx | 2 +- .../src/demos/styles/Styles.demos.story.tsx | 2 +- .../theming/Theming.demo.activeClassName.tsx | 2 +- .../Theming.demo.activeClassNameEmpty.tsx | 2 +- .../theming/Theming.demo.colorAndCProps.tsx | 2 +- .../demos/theming/Theming.demo.colorProp.tsx | 2 +- .../theming/Theming.demo.colorScheme.tsx | 2 +- .../Theming.demo.colorSchemeControl.tsx | 6 +- .../Theming.demo.colorsIndexConfigurator.tsx | 2 +- .../theming/Theming.demo.colorsOverride.tsx | 2 +- .../demos/theming/Theming.demo.cursorType.tsx | 2 +- .../theming/Theming.demo.defaultGradient.tsx | 2 +- .../theming/Theming.demo.defaultProps.tsx | 2 +- ...Theming.demo.defaultRadiusConfigurator.tsx | 2 +- .../theming/Theming.demo.focusClassName.tsx | 2 +- .../demos/theming/Theming.demo.focusRing.tsx | 2 +- .../Theming.demo.fontSizeConfigurator.tsx | 2 +- .../src/demos/theming/Theming.demo.fonts.tsx | 2 +- .../theming/Theming.demo.headingsStyles.tsx | 2 +- .../theming/Theming.demo.primaryColor.tsx | 2 +- .../Theming.demo.primaryShadeConfigurator.tsx | 2 +- .../theming/Theming.demo.usePropsHook.tsx | 2 +- .../Theming.demo.variantColorsResolver.tsx | 8 +- .../src/demos/theming/Theming.demos.story.tsx | 2 +- .../demos/tiptap/TipTap.demo.bubbleMenu.tsx | 6 +- .../tiptap/TipTap.demo.codeHighlight.tsx | 8 +- .../src/demos/tiptap/TipTap.demo.colors.tsx | 4 +- .../tiptap/TipTap.demo.customControl.tsx | 4 +- .../demos/tiptap/TipTap.demo.floatingMenu.tsx | 6 +- .../src/demos/tiptap/TipTap.demo.icons.tsx | 4 +- .../demos/tiptap/TipTap.demo.placeholder.tsx | 6 +- .../src/demos/tiptap/TipTap.demo.usage.tsx | 14 +- .../src/demos/tiptap/TipTap.demos.story.tsx | 2 +- packages/@docs/demos/src/render-demo.tsx | 4 +- .../AuthenticationForm/AuthenticationForm.tsx | 16 +-- .../src/data/Autocomplete.styles-api.ts | 2 +- .../src/data/CodeHighlight.styles-api.ts | 2 +- .../src/data/ColorInput.styles-api.ts | 2 +- .../styles-api/src/data/Dates.styles-api.ts | 20 +-- .../styles-api/src/data/Menu.styles-api.ts | 2 +- .../src/data/MultiSelect.styles-api.ts | 2 +- .../styles-api/src/data/Select.styles-api.ts | 2 +- .../src/data/TagsInput.styles-api.ts | 2 +- packages/@mantine-tests/core/src/index.ts | 56 ++++---- .../src/inputs/it-supports-input-props.tsx | 4 +- .../core/src/it-supports-system-props.tsx | 29 ++-- packages/@mantine-tests/core/src/render.tsx | 4 +- .../core/src/shared/it-supports-style-api.tsx | 2 +- .../core/src/shared/it-supports-style.tsx | 2 +- .../src/shared/it-throws-context-error.tsx | 2 +- packages/@mantine-tests/dates/src/index.ts | 24 ++-- .../src/it-supports-date-input-props.tsx | 8 +- .../dates/src/it-supports-month-props.tsx | 3 +- .../dates/src/it-supports-weekdays-props.tsx | 3 +- .../@mantine/carousel/src/Carousel.story.tsx | 2 +- .../@mantine/carousel/src/Carousel.test.tsx | 2 +- packages/@mantine/carousel/src/Carousel.tsx | 22 +-- .../src/CarouselSlide/CarouselSlide.test.tsx | 2 +- .../src/CarouselSlide/CarouselSlide.tsx | 4 +- .../CarouselVariables/CarouselVariables.tsx | 10 +- .../src/CodeHighlight.story.tsx | 2 +- .../code-highlight/src/CodeHighlight.tsx | 16 +-- .../code-highlight/src/CodeHighlightTabs.tsx | 26 ++-- .../@mantine/code-highlight/src/CopyIcon.tsx | 2 +- .../code-highlight/src/ExpandIcon.tsx | 2 +- .../src/InlineCodeHighlight.tsx | 8 +- .../code-highlight/src/use-highlight.ts | 2 +- .../components/Accordion/Accordion.context.ts | 2 +- .../components/Accordion/Accordion.test.tsx | 4 +- .../src/components/Accordion/Accordion.tsx | 20 +-- .../AccordionControl.test.tsx | 4 +- .../AccordionControl/AccordionControl.tsx | 6 +- .../AccordionItem/AccordionItem.test.tsx | 4 +- .../Accordion/AccordionItem/AccordionItem.tsx | 4 +- .../AccordionPanel/AccordionPanel.test.tsx | 4 +- .../AccordionPanel/AccordionPanel.tsx | 4 +- .../ActionIcon/ActionIcon.story.tsx | 2 +- .../components/ActionIcon/ActionIcon.test.tsx | 2 +- .../src/components/ActionIcon/ActionIcon.tsx | 18 +-- .../ActionIconGroup/ActionIconGroup.test.tsx | 2 +- .../ActionIconGroup/ActionIconGroup.tsx | 8 +- .../core/src/components/Affix/Affix.tsx | 10 +- .../core/src/components/Alert/Alert.story.tsx | 2 +- .../core/src/components/Alert/Alert.tsx | 14 +- .../core/src/components/Anchor/Anchor.tsx | 4 +- .../components/AppShell/AppShell.story.tsx | 2 +- .../src/components/AppShell/AppShell.test.tsx | 2 +- .../core/src/components/AppShell/AppShell.tsx | 30 ++-- .../AppShellAside/AppShellAside.test.tsx | 4 +- .../AppShell/AppShellAside/AppShellAside.tsx | 6 +- .../AppShellFooter/AppShellFooter.test.tsx | 4 +- .../AppShellFooter/AppShellFooter.tsx | 10 +- .../AppShellHeader/AppShellHeader.test.tsx | 4 +- .../AppShellHeader/AppShellHeader.tsx | 10 +- .../AppShellMain/AppShellMain.test.tsx | 4 +- .../AppShell/AppShellMain/AppShellMain.tsx | 4 +- .../AppShellMediaStyles.tsx | 2 +- .../assign-aside-variables.ts | 8 +- .../assign-footer-variables.ts | 6 +- .../assign-header-variables.ts | 6 +- .../assign-navbar-variables.ts | 8 +- .../get-base-size/get-base-size.ts | 2 +- .../get-variables/get-variables.ts | 2 +- .../is-primitive-size/is-primitive-size.ts | 2 +- .../is-responsive-size/is-responsive-size.ts | 2 +- .../AppShellNavbar/AppShellNavbar.test.tsx | 4 +- .../AppShellNavbar/AppShellNavbar.tsx | 6 +- .../AppShellSection/AppShellSection.test.tsx | 4 +- .../AppShellSection/AppShellSection.tsx | 2 +- .../AppShell/use-resizing/use-resizing.tsx | 4 +- .../components/AspectRatio/AspectRatio.tsx | 8 +- .../Autocomplete/Autocomplete.story.tsx | 2 +- .../Autocomplete/Autocomplete.test.tsx | 2 +- .../components/Autocomplete/Autocomplete.tsx | 20 +-- .../src/components/Avatar/Avatar.story.tsx | 4 +- .../src/components/Avatar/Avatar.test.tsx | 2 +- .../core/src/components/Avatar/Avatar.tsx | 16 +-- .../Avatar/AvatarGroup/AvatarGroup.tsx | 12 +- .../BackgroundImage/BackgroundImage.tsx | 10 +- .../core/src/components/Badge/Badge.tsx | 18 +-- .../Blockquote/Blockquote.story.tsx | 2 +- .../src/components/Blockquote/Blockquote.tsx | 18 +-- .../Breadcrumbs/Breadcrumbs.test.tsx | 2 +- .../components/Breadcrumbs/Breadcrumbs.tsx | 12 +- .../src/components/Burger/Burger.test.tsx | 2 +- .../core/src/components/Burger/Burger.tsx | 18 +-- .../src/components/Button/Button.story.tsx | 2 +- .../src/components/Button/Button.test.tsx | 2 +- .../core/src/components/Button/Button.tsx | 24 ++-- .../Button/ButtonGroup/ButtonGroup.test.tsx | 2 +- .../Button/ButtonGroup/ButtonGroup.tsx | 8 +- .../core/src/components/Card/Card.tsx | 16 +-- .../Card/CardSection/CardSection.test.tsx | 4 +- .../Card/CardSection/CardSection.tsx | 2 +- .../core/src/components/Center/Center.tsx | 4 +- .../components/Checkbox/Checkbox.story.tsx | 2 +- .../src/components/Checkbox/Checkbox.test.tsx | 2 +- .../core/src/components/Checkbox/Checkbox.tsx | 22 +-- .../CheckboxGroup/CheckboxGroup.test.tsx | 2 +- .../Checkbox/CheckboxGroup/CheckboxGroup.tsx | 4 +- .../core/src/components/Chip/Chip.story.tsx | 2 +- .../core/src/components/Chip/Chip.tsx | 20 +-- .../Chip/ChipGroup/ChipGroup.test.tsx | 4 +- .../CloseButton/CloseButton.test.tsx | 2 +- .../components/CloseButton/CloseButton.tsx | 16 +-- .../core/src/components/Code/Code.test.tsx | 2 +- .../core/src/components/Code/Code.tsx | 12 +- .../core/src/components/Collapse/Collapse.tsx | 8 +- .../src/components/Collapse/use-collapse.ts | 4 +- .../components/ColorInput/ColorInput.test.tsx | 4 +- .../src/components/ColorInput/ColorInput.tsx | 20 +-- .../ColorPicker/AlphaSlider/AlphaSlider.tsx | 2 +- .../ColorPicker/ColorPicker.story.tsx | 2 +- .../components/ColorPicker/ColorPicker.tsx | 22 +-- .../ColorPicker/ColorSlider/ColorSlider.tsx | 16 +-- .../ColorPicker/HueSlider/HueSlider.tsx | 2 +- .../ColorPicker/Saturation/Saturation.tsx | 4 +- .../ColorPicker/converters/converters.ts | 2 +- .../ColorPicker/converters/parsers.ts | 2 +- .../components/ColorSwatch/ColorSwatch.tsx | 8 +- .../components/Combobox/Combobox.story.tsx | 2 +- .../core/src/components/Combobox/Combobox.tsx | 34 ++--- .../Combobox/Combobox.virtualized.story.tsx | 4 +- .../ComboboxChevron/ComboboxChevron.tsx | 8 +- .../ComboboxClearButton.tsx | 2 +- .../ComboboxDropdown.test.tsx | 2 +- .../ComboboxDropdown/ComboboxDropdown.tsx | 2 +- .../ComboboxDropdownTarget.test.tsx | 2 +- .../ComboboxDropdownTarget.tsx | 2 +- .../ComboboxEmpty/ComboboxEmpty.test.tsx | 2 +- .../Combobox/ComboboxEmpty/ComboboxEmpty.tsx | 6 +- .../ComboboxEventsTarget.test.tsx | 2 +- .../ComboboxEventsTarget.tsx | 4 +- .../ComboboxFooter/ComboboxFooter.test.tsx | 2 +- .../ComboboxFooter/ComboboxFooter.tsx | 4 +- .../ComboboxGroup/ComboboxGroup.test.tsx | 2 +- .../Combobox/ComboboxGroup/ComboboxGroup.tsx | 4 +- .../ComboboxHeader/ComboboxHeader.test.tsx | 2 +- .../ComboboxHeader/ComboboxHeader.tsx | 4 +- .../ComboboxOption/ComboboxOption.test.tsx | 2 +- .../ComboboxOption/ComboboxOption.tsx | 4 +- .../ComboboxOptions/ComboboxOptions.test.tsx | 2 +- .../ComboboxOptions/ComboboxOptions.tsx | 4 +- .../ComboboxSearch/ComboboxSearch.test.tsx | 2 +- .../ComboboxSearch/ComboboxSearch.tsx | 2 +- .../ComboboxTarget/ComboboxTarget.test.tsx | 2 +- .../ComboboxTarget/ComboboxTarget.tsx | 2 +- .../OptionsDropdown/OptionsDropdown.tsx | 2 +- .../get-options-lockup/get-options-lockup.ts | 2 +- .../get-parsed-combobox-data.ts | 2 +- .../use-combobox/get-index/get-index.test.ts | 2 +- .../use-combobox/use-combobox.test.ts | 2 +- .../Combobox/use-combobox/use-combobox.ts | 4 +- .../use-combobox/use-virtualized-combobox.ts | 2 +- .../components/Container/Container.story.tsx | 2 +- .../src/components/Container/Container.tsx | 12 +- .../src/components/Dialog/Dialog.story.tsx | 2 +- .../src/components/Dialog/Dialog.test.tsx | 2 +- .../core/src/components/Dialog/Dialog.tsx | 16 +-- .../core/src/components/Divider/Divider.tsx | 14 +- .../src/components/Drawer/Drawer.story.tsx | 2 +- .../core/src/components/Drawer/Drawer.tsx | 16 +-- .../core/src/components/Drawer/DrawerBody.tsx | 2 +- .../components/Drawer/DrawerCloseButton.tsx | 2 +- .../src/components/Drawer/DrawerContent.tsx | 2 +- .../src/components/Drawer/DrawerHeader.tsx | 2 +- .../src/components/Drawer/DrawerOverlay.tsx | 2 +- .../core/src/components/Drawer/DrawerRoot.tsx | 12 +- .../src/components/Drawer/DrawerTitle.tsx | 2 +- .../components/Fieldset/Fieldset.story.tsx | 2 +- .../src/components/Fieldset/Fieldset.test.tsx | 2 +- .../core/src/components/Fieldset/Fieldset.tsx | 12 +- .../components/FileButton/FileButton.test.tsx | 2 +- .../src/components/FileButton/FileButton.tsx | 2 +- .../components/FileInput/FileInput.test.tsx | 4 +- .../src/components/FileInput/FileInput.tsx | 6 +- .../core/src/components/Flex/Flex.tsx | 16 +-- .../Floating/FloatingArrow/FloatingArrow.tsx | 2 +- .../get-arrow-position-styles.ts | 2 +- .../get-floating-position.ts | 2 +- .../components/Floating/use-delayed-hover.ts | 2 +- .../Floating/use-floating-auto-update.ts | 2 +- .../core/src/components/Grid/Grid.story.tsx | 2 +- .../core/src/components/Grid/Grid.tsx | 14 +- .../components/Grid/GridCol/GridCol.test.tsx | 4 +- .../src/components/Grid/GridCol/GridCol.tsx | 4 +- .../Grid/GridCol/GridColVariables.tsx | 10 +- .../src/components/Grid/GridVariables.tsx | 10 +- .../core/src/components/Group/Group.test.tsx | 2 +- .../core/src/components/Group/Group.tsx | 12 +- .../src/components/Highlight/Highlight.tsx | 6 +- .../components/HoverCard/HoverCard.story.tsx | 2 +- .../components/HoverCard/HoverCard.test.tsx | 2 +- .../src/components/HoverCard/HoverCard.tsx | 4 +- .../HoverCardTarget/HoverCardTarget.test.tsx | 4 +- .../HoverCardTarget/HoverCardTarget.tsx | 2 +- .../core/src/components/Image/Image.story.tsx | 2 +- .../core/src/components/Image/Image.test.tsx | 2 +- .../core/src/components/Image/Image.tsx | 10 +- .../components/Indicator/Indicator.story.tsx | 4 +- .../components/Indicator/Indicator.test.tsx | 2 +- .../src/components/Indicator/Indicator.tsx | 16 +-- .../get-position-variables.ts | 2 +- .../components/InlineInput/InlineInput.tsx | 8 +- .../core/src/components/Input/Input.test.tsx | 6 +- .../core/src/components/Input/Input.tsx | 26 ++-- .../InputDescription/InputDescription.tsx | 14 +- .../Input/InputError/InputError.tsx | 14 +- .../Input/InputLabel/InputLabel.test.tsx | 2 +- .../Input/InputLabel/InputLabel.tsx | 12 +- .../InputPlaceholder/InputPlaceholder.tsx | 6 +- .../components/Input/InputWrapper.context.ts | 2 +- .../Input/InputWrapper/InputWrapper.test.tsx | 2 +- .../Input/InputWrapper/InputWrapper.tsx | 26 ++-- .../src/components/Input/use-input-props.ts | 2 +- .../components/InputBase/InputBase.test.tsx | 4 +- .../src/components/InputBase/InputBase.tsx | 4 +- .../components/JsonInput/JsonInput.test.tsx | 4 +- .../src/components/JsonInput/JsonInput.tsx | 4 +- .../@mantine/core/src/components/Kbd/Kbd.tsx | 10 +- .../core/src/components/List/List.story.tsx | 2 +- .../core/src/components/List/List.test.tsx | 2 +- .../core/src/components/List/List.tsx | 16 +-- .../List/ListItem/ListItem.test.tsx | 4 +- .../src/components/List/ListItem/ListItem.tsx | 4 +- .../src/components/Loader/Loader.story.tsx | 4 +- .../src/components/Loader/Loader.test.tsx | 4 +- .../core/src/components/Loader/Loader.tsx | 18 +-- .../LoadingOverlay/LoadingOverlay.tsx | 14 +- .../core/src/components/Mark/Mark.tsx | 10 +- .../core/src/components/Menu/Menu.story.tsx | 6 +- .../core/src/components/Menu/Menu.test.tsx | 8 +- .../core/src/components/Menu/Menu.tsx | 12 +- .../Menu/MenuDivider/MenuDivider.test.tsx | 2 +- .../Menu/MenuDivider/MenuDivider.tsx | 6 +- .../Menu/MenuDropdown/MenuDropdown.test.tsx | 2 +- .../Menu/MenuDropdown/MenuDropdown.tsx | 8 +- .../Menu/MenuItem/MenuItem.test.tsx | 4 +- .../src/components/Menu/MenuItem/MenuItem.tsx | 10 +- .../Menu/MenuLabel/MenuLabel.test.tsx | 2 +- .../components/Menu/MenuLabel/MenuLabel.tsx | 4 +- .../Menu/MenuTarget/MenuTarget.test.tsx | 4 +- .../components/Menu/MenuTarget/MenuTarget.tsx | 4 +- .../core/src/components/Modal/Modal.story.tsx | 2 +- .../core/src/components/Modal/Modal.tsx | 16 +-- .../core/src/components/Modal/ModalBody.tsx | 2 +- .../src/components/Modal/ModalCloseButton.tsx | 2 +- .../src/components/Modal/ModalContent.tsx | 2 +- .../core/src/components/Modal/ModalHeader.tsx | 2 +- .../src/components/Modal/ModalOverlay.tsx | 2 +- .../core/src/components/Modal/ModalRoot.tsx | 14 +- .../core/src/components/Modal/ModalTitle.tsx | 2 +- .../components/ModalBase/ModalBase.story.tsx | 2 +- .../src/components/ModalBase/ModalBase.tsx | 6 +- .../components/ModalBase/ModalBaseBody.tsx | 2 +- .../ModalBase/ModalBaseCloseButton.tsx | 2 +- .../components/ModalBase/ModalBaseContent.tsx | 2 +- .../components/ModalBase/ModalBaseHeader.tsx | 2 +- .../components/ModalBase/ModalBaseOverlay.tsx | 2 +- .../components/ModalBase/ModalBaseTitle.tsx | 2 +- .../components/ModalBase/use-lock-scroll.ts | 2 +- .../src/components/ModalBase/use-modal.ts | 4 +- .../MultiSelect/MultiSelect.test.tsx | 2 +- .../components/MultiSelect/MultiSelect.tsx | 24 ++-- .../MultiSelect/MutliSelect.story.tsx | 2 +- .../NativeSelect/NativeSelect.story.tsx | 4 +- .../NativeSelect/NativeSelect.test.tsx | 4 +- .../components/NativeSelect/NativeSelect.tsx | 6 +- .../src/components/NavLink/NavLink.story.tsx | 2 +- .../src/components/NavLink/NavLink.test.tsx | 2 +- .../core/src/components/NavLink/NavLink.tsx | 14 +- .../Notification/Notification.story.tsx | 6 +- .../Notification/Notification.test.tsx | 2 +- .../components/Notification/Notification.tsx | 18 +-- .../NumberFormatter/NumberFormatter.tsx | 2 +- .../NumberInput/NumberInput.story.tsx | 6 +- .../NumberInput/NumberInput.test.tsx | 10 +- .../components/NumberInput/NumberInput.tsx | 16 +-- .../core/src/components/Overlay/Overlay.tsx | 14 +- .../Pagination/Pagination.story.tsx | 2 +- .../src/components/Pagination/Pagination.tsx | 16 +-- .../PaginationControl.test.tsx | 4 +- .../PaginationControl/PaginationControl.tsx | 4 +- .../PaginationDots/PaginationDots.test.tsx | 4 +- .../PaginationDots/PaginationDots.tsx | 4 +- .../PaginationEdges/PaginationEdges.tsx | 8 +- .../PaginationItems/PaginationItems.tsx | 2 +- .../PaginationRoot/PaginationRoot.tsx | 20 +-- .../core/src/components/Paper/Paper.tsx | 14 +- .../PasswordInput/PasswordInput.test.tsx | 4 +- .../PasswordInput/PasswordInput.tsx | 20 +-- .../core/src/components/Pill/Pill.tsx | 18 +-- .../components/Pill/PillGroup/PillGroup.tsx | 14 +- .../PillsInput/PillsInput.context.ts | 2 +- .../PillsInput/PillsInput.story.tsx | 4 +- .../components/PillsInput/PillsInput.test.tsx | 4 +- .../src/components/PillsInput/PillsInput.tsx | 4 +- .../PillsInputField/PillsInputField.test.tsx | 4 +- .../PillsInputField/PillsInputField.tsx | 6 +- .../components/PinInput/PinInput.story.tsx | 6 +- .../core/src/components/PinInput/PinInput.tsx | 12 +- .../src/components/Popover/Popover.context.ts | 12 +- .../src/components/Popover/Popover.story.tsx | 4 +- .../src/components/Popover/Popover.test.tsx | 2 +- .../core/src/components/Popover/Popover.tsx | 32 ++--- .../PopoverDropdown/PopoverDropdown.test.tsx | 4 +- .../PopoverDropdown/PopoverDropdown.tsx | 12 +- .../PopoverTarget/PopoverTarget.test.tsx | 4 +- .../Popover/PopoverTarget/PopoverTarget.tsx | 2 +- .../src/components/Popover/use-popover.ts | 16 +-- .../core/src/components/Portal/Portal.tsx | 4 +- .../src/components/Progress/Progress.test.tsx | 2 +- .../core/src/components/Progress/Progress.tsx | 12 +- .../ProgressLabel/ProgressLabel.test.tsx | 4 +- .../Progress/ProgressLabel/ProgressLabel.tsx | 6 +- .../Progress/ProgressRoot/ProgressRoot.tsx | 16 +-- .../ProgressSection/ProgressSection.test.tsx | 4 +- .../ProgressSection/ProgressSection.tsx | 6 +- .../core/src/components/Radio/Radio.story.tsx | 2 +- .../core/src/components/Radio/Radio.test.tsx | 2 +- .../core/src/components/Radio/Radio.tsx | 20 +-- .../components/Radio/RadioGroup.context.ts | 2 +- .../Radio/RadioGroup/RadioGroup.test.tsx | 2 +- .../Radio/RadioGroup/RadioGroup.tsx | 4 +- .../core/src/components/Rating/Rating.tsx | 18 +-- .../Rating/RatingItem/RatingItem.tsx | 4 +- .../Rating/StarSymbol/StarSymbol.tsx | 2 +- .../components/RingProgress/Curve/Curve.tsx | 4 +- .../components/RingProgress/RingProgress.tsx | 14 +- .../src/components/ScrollArea/ScrollArea.tsx | 14 +- .../ScrollAreaRoot/ScrollAreaRoot.tsx | 4 +- .../ScrollAreaScrollbar.tsx | 6 +- .../ScrollAreaScrollbarAuto.tsx | 4 +- .../ScrollAreaScrollbarScroll.tsx | 2 +- .../ScrollAreaScrollbarVisible.tsx | 6 +- .../ScrollAreaScrollbar/Scrollbar.tsx | 8 +- .../ScrollAreaScrollbar/ScrollbarX.tsx | 8 +- .../ScrollAreaScrollbar/ScrollbarY.tsx | 4 +- .../ScrollAreaThumb/ScrollAreaThumb.tsx | 4 +- .../ScrollArea/use-resize-observer.ts | 2 +- .../SegmentedControl.story.tsx | 2 +- .../SegmentedControl/SegmentedControl.tsx | 28 ++-- .../src/components/Select/Select.story.tsx | 2 +- .../src/components/Select/Select.test.tsx | 2 +- .../core/src/components/Select/Select.tsx | 18 +-- .../src/components/SimpleGrid/SimpleGrid.tsx | 12 +- .../SimpleGrid/SimpleGridVariables.tsx | 10 +- .../core/src/components/Skeleton/Skeleton.tsx | 12 +- .../src/components/Slider/Marks/Marks.tsx | 2 +- .../Slider/RangeSlider/RangeSlider.test.tsx | 2 +- .../Slider/RangeSlider/RangeSlider.tsx | 28 ++-- .../src/components/Slider/Slider.story.tsx | 2 +- .../components/Slider/Slider/Slider.test.tsx | 4 +- .../src/components/Slider/Slider/Slider.tsx | 24 ++-- .../Slider/SliderRoot/SliderRoot.tsx | 4 +- .../src/components/Slider/Thumb/Thumb.tsx | 2 +- .../core/src/components/Space/Space.tsx | 6 +- .../core/src/components/Spoiler/Spoiler.tsx | 10 +- .../core/src/components/Stack/Stack.tsx | 12 +- .../src/components/Stepper/Stepper.story.tsx | 2 +- .../src/components/Stepper/Stepper.test.tsx | 4 +- .../core/src/components/Stepper/Stepper.tsx | 28 ++-- .../Stepper/StepperStep/StepperStep.test.tsx | 4 +- .../Stepper/StepperStep/StepperStep.tsx | 12 +- .../src/components/Switch/Switch.story.tsx | 2 +- .../src/components/Switch/Switch.test.tsx | 2 +- .../core/src/components/Switch/Switch.tsx | 22 +-- .../Switch/SwitchGroup/SwitchGroup.test.tsx | 2 +- .../Switch/SwitchGroup/SwitchGroup.tsx | 4 +- .../Table/Table.components.test.tsx | 14 +- .../src/components/Table/Table.components.tsx | 6 +- .../core/src/components/Table/Table.test.tsx | 4 +- .../core/src/components/Table/Table.tsx | 20 +-- .../components/Table/TableDataRenderer.tsx | 10 +- .../components/Table/TableScrollContainer.tsx | 10 +- .../core/src/components/Tabs/Tabs.test.tsx | 6 +- .../core/src/components/Tabs/Tabs.tsx | 14 +- .../Tabs/TabsList/TabsList.test.tsx | 2 +- .../src/components/Tabs/TabsList/TabsList.tsx | 6 +- .../Tabs/TabsPanel/TabsPanel.test.tsx | 2 +- .../components/Tabs/TabsPanel/TabsPanel.tsx | 6 +- .../components/Tabs/TabsTab/TabsTab.test.tsx | 4 +- .../src/components/Tabs/TabsTab/TabsTab.tsx | 12 +- .../components/TagsInput/TagsInput.story.tsx | 2 +- .../components/TagsInput/TagsInput.test.tsx | 2 +- .../src/components/TagsInput/TagsInput.tsx | 28 ++-- .../core/src/components/Text/Text.tsx | 20 +-- .../components/TextInput/TextInput.test.tsx | 4 +- .../src/components/TextInput/TextInput.tsx | 4 +- .../src/components/Textarea/Textarea.test.tsx | 4 +- .../core/src/components/Textarea/Textarea.tsx | 8 +- .../components/ThemeIcon/ThemeIcon.story.tsx | 2 +- .../src/components/ThemeIcon/ThemeIcon.tsx | 14 +- .../components/Timeline/Timeline.story.tsx | 4 +- .../core/src/components/Timeline/Timeline.tsx | 18 +-- .../TimelineItem/TimelineItem.test.tsx | 4 +- .../Timeline/TimelineItem/TimelineItem.tsx | 10 +- .../core/src/components/Title/Title.tsx | 12 +- .../src/components/Title/get-title-size.ts | 2 +- .../src/components/Tooltip/Tooltip.test.tsx | 2 +- .../core/src/components/Tooltip/Tooltip.tsx | 14 +- .../src/components/Tooltip/Tooltip.types.ts | 2 +- .../TooltipFloating/TooltipFloating.tsx | 14 +- .../TooltipFloating/use-floating-tooltip.ts | 4 +- .../src/components/Tooltip/use-tooltip.ts | 22 +-- .../src/components/Transition/Transition.tsx | 2 +- .../get-transition-styles.test.ts | 2 +- .../components/Transition/use-transition.ts | 4 +- .../TypographyStylesProvider.tsx | 6 +- .../UnstyledButton/UnstyleButton.story.tsx | 2 +- .../UnstyledButton/UnstyleButton.test.tsx | 2 +- .../UnstyledButton/UnstyledButton.tsx | 8 +- .../VisuallyHidden/VisuallyHidden.tsx | 6 +- .../@mantine/core/src/core/Box/Box.test.tsx | 2 +- packages/@mantine/core/src/core/Box/Box.tsx | 14 +- .../Box/get-box-style/get-box-style.test.ts | 2 +- .../core/Box/get-box-style/get-box-style.ts | 2 +- .../get-style-object/get-style-object.test.ts | 2 +- .../parse-style-props.test.ts | 2 +- .../parse-style-props/parse-style-props.ts | 6 +- .../parse-style-props/sort-media-queries.ts | 2 +- .../color-resolver/color-resolver.test.ts | 2 +- .../font-size-resolver.test.ts | 2 +- .../core/Box/style-props/resolvers/index.ts | 4 +- .../line-height-resolver.test.ts | 2 +- .../spacing-resolver/spacing-resolver.test.ts | 2 +- .../core/Box/style-props/style-props.types.ts | 4 +- .../src/core/InlineStyles/InlineStyles.tsx | 2 +- .../css-object-to-string.ts | 2 +- .../core/MantineProvider/Mantine.context.ts | 2 +- .../MantineClasses/MantineClasses.tsx | 4 +- .../MantineCssVariables.tsx | 4 +- .../default-css-variables-resolver.ts | 2 +- .../get-merged-variables.test.ts | 4 +- .../get-merged-variables.ts | 2 +- .../remove-default-variables.ts | 4 +- .../core/MantineProvider/MantineProvider.tsx | 11 +- .../MantineThemeProvider.tsx | 2 +- .../default-variant-colors-resolver.ts | 8 +- .../get-gradient/get-gradient.test.ts | 2 +- .../get-primary-shade.test.ts | 2 +- .../get-theme-color/get-theme-color.test.ts | 2 +- .../get-theme-color/get-theme-color.ts | 2 +- .../is-light-color/is-light-color.ts | 2 +- .../parse-theme-color.test.ts | 2 +- .../parse-theme-color/parse-theme-color.ts | 2 +- .../local-storage-manager.ts | 2 +- .../convert-css-variables.ts | 2 +- .../src/core/MantineProvider/default-theme.ts | 6 +- .../merge-mantine-theme.test.ts | 2 +- .../merge-theme-overrides.ts | 2 +- .../use-props/use-props.test.tsx | 2 +- .../@mantine/core/src/core/factory/factory.ts | 2 +- .../src/core/factory/polymorphic-factory.ts | 6 +- .../create-vars-resolver.ts | 2 +- .../src/core/styles-api/styles-api.types.ts | 2 +- .../get-class-name/get-class-name.test.ts | 2 +- .../get-class-name/get-class-name.ts | 10 +- .../get-global-class-names.test.ts | 2 +- .../get-global-class-names.ts | 2 +- .../get-options-class-names.ts | 2 +- .../use-styles/get-style/get-style.ts | 4 +- .../core/styles-api/use-styles/use-styles.ts | 4 +- .../close-on-escape/close-on-escape.test.ts | 2 +- .../get-breakpoint-value.ts | 2 +- .../src/core/utils/get-size/get-size.test.ts | 2 +- .../core/utils/units-converters/rem.test.ts | 2 +- .../src/components/Calendar/Calendar.test.tsx | 4 +- .../src/components/Calendar/Calendar.tsx | 22 +-- .../CalendarHeader/CalendarHeader.test.tsx | 2 +- .../CalendarHeader/CalendarHeader.tsx | 16 +-- .../components/DateInput/DateInput.story.tsx | 8 +- .../components/DateInput/DateInput.test.tsx | 8 +- .../src/components/DateInput/DateInput.tsx | 32 ++--- .../DatePicker/DatePicker.story.tsx | 1 + .../components/DatePicker/DatePicker.test.tsx | 2 +- .../src/components/DatePicker/DatePicker.tsx | 14 +- .../DatePickerInput/DatePickerInput.story.tsx | 4 +- .../DatePickerInput/DatePickerInput.test.tsx | 4 +- .../DatePickerInput/DatePickerInput.tsx | 14 +- .../DateTimePicker/DateTimePicker.test.tsx | 8 +- .../DateTimePicker/DateTimePicker.tsx | 26 ++-- .../DatesProvider/use-dates-context.ts | 2 +- .../dates/src/components/Day/Day.test.tsx | 2 +- .../@mantine/dates/src/components/Day/Day.tsx | 14 +- .../DecadeLevel/DecadeLevel.test.tsx | 2 +- .../components/DecadeLevel/DecadeLevel.tsx | 10 +- .../DecadeLevelGroup.test.tsx | 2 +- .../DecadeLevelGroup/DecadeLevelGroup.tsx | 4 +- .../HiddenDatesInput/HiddenDatesInput.tsx | 2 +- .../components/LevelsGroup/LevelsGroup.tsx | 8 +- .../dates/src/components/Month/Month.test.tsx | 2 +- .../dates/src/components/Month/Month.tsx | 18 +-- .../Month/get-month-days/get-month-days.ts | 4 +- .../MonthLevel/MonthLevel.story.tsx | 1 + .../components/MonthLevel/MonthLevel.test.tsx | 2 +- .../src/components/MonthLevel/MonthLevel.tsx | 8 +- .../MonthLevelGroup/MonthLevelGroup.test.tsx | 2 +- .../MonthLevelGroup/MonthLevelGroup.tsx | 6 +- .../MonthPicker/MonthPicker.test.tsx | 2 +- .../components/MonthPicker/MonthPicker.tsx | 18 +-- .../MonthPickerInput.test.tsx | 6 +- .../MonthPickerInput/MonthPickerInput.tsx | 14 +- .../components/MonthsList/MonthsList.test.tsx | 2 +- .../src/components/MonthsList/MonthsList.tsx | 16 +-- .../PickerControl/PickerControl.test.tsx | 2 +- .../PickerControl/PickerControl.tsx | 10 +- .../PickerInputBase/PickerInputBase.test.tsx | 2 +- .../PickerInputBase/PickerInputBase.tsx | 22 +-- .../components/TimeInput/TimeInput.test.tsx | 2 +- .../src/components/TimeInput/TimeInput.tsx | 12 +- .../WeekdaysRow/WeekdaysRow.story.tsx | 1 + .../WeekdaysRow/WeekdaysRow.test.tsx | 2 +- .../components/WeekdaysRow/WeekdaysRow.tsx | 12 +- .../get-weekdays-names.test.ts | 2 + .../get-weekdays-names/get-weekdays-names.ts | 2 +- .../components/YearLevel/YearLevel.test.tsx | 2 +- .../src/components/YearLevel/YearLevel.tsx | 12 +- .../YearLevelGroup/YearLevelGroup.test.tsx | 2 +- .../YearLevelGroup/YearLevelGroup.tsx | 6 +- .../components/YearPicker/YearPicker.test.tsx | 4 +- .../src/components/YearPicker/YearPicker.tsx | 14 +- .../YearPickerInput/YearPickerInput.test.tsx | 6 +- .../YearPickerInput/YearPickerInput.tsx | 14 +- .../components/YearsList/YearsList.story.tsx | 2 +- .../components/YearsList/YearsList.test.tsx | 2 +- .../src/components/YearsList/YearsList.tsx | 12 +- .../hooks/use-dates-input/use-dates-input.ts | 4 +- .../use-uncontrolled-dates.ts | 4 +- .../dates/src/utils/get-timezone-offset.ts | 2 +- .../dates/src/utils/shift-timezone.ts | 2 +- .../@mantine/dropzone/src/Dropzone.test.tsx | 4 +- packages/@mantine/dropzone/src/Dropzone.tsx | 24 ++-- .../dropzone/src/DropzoneFullScreen.tsx | 14 +- .../@mantine/dropzone/src/DropzoneStatus.tsx | 2 +- packages/@mantine/dropzone/src/index.ts | 2 +- packages/@mantine/form/src/Form/Form.tsx | 2 +- .../form/src/FormProvider/FormProvider.tsx | 2 +- packages/@mantine/form/src/actions/actions.ts | 22 +-- .../@mantine/form/src/paths/reorder-path.ts | 2 +- .../form/src/stories/Form.actions.story.tsx | 6 +- .../form/src/stories/Form.context.story.tsx | 2 +- .../form/src/stories/Form.dirty.story.tsx | 2 +- .../form/src/stories/Form.lists.story.tsx | 4 +- .../src/stories/Form.nestedObject.story.tsx | 4 +- .../form/src/stories/Form.rendering.story.tsx | 2 +- .../form/src/stories/Form.usage.story.tsx | 4 +- .../stories/Form.validateOnChange.story.tsx | 6 +- packages/@mantine/form/src/stories/_base.tsx | 2 +- .../form/src/tests/reorderListItem.test.ts | 2 +- .../form/src/tests/transformValues.test.ts | 2 +- .../form/src/tests/validate-function.test.ts | 2 +- .../form/src/tests/validate-object.test.ts | 2 +- .../@mantine/form/src/tests/values.test.ts | 2 +- packages/@mantine/form/src/use-form.ts | 8 +- .../form/src/validate/validate-field-value.ts | 2 +- .../form/src/validate/validate-values.ts | 2 +- .../src/use-callback-ref/use-callback-ref.ts | 2 +- .../hooks/src/use-counter/use-counter.test.ts | 2 +- .../use-debounced-callback.ts | 2 +- .../use-debounced-state.ts | 2 +- .../use-debounced-value.ts | 2 +- .../src/use-did-update/use-did-update.ts | 2 +- .../src/use-disclosure/use-disclosure.ts | 2 +- .../use-event-listener/use-event-listener.ts | 2 +- .../use-focus-trap/use-focus-trap.test.tsx | 2 +- .../src/use-focus-trap/use-focus-trap.ts | 4 +- .../src/use-focus-within/use-focus-within.ts | 2 +- .../src/use-fullscreen/use-fullscreen.ts | 2 +- .../@mantine/hooks/src/use-hash/use-hash.ts | 2 +- .../hooks/src/use-headroom/use-headroom.ts | 2 +- .../@mantine/hooks/src/use-hover/use-hover.ts | 2 +- .../hooks/src/use-idle/use-idle.test.tsx | 2 +- .../@mantine/hooks/src/use-idle/use-idle.ts | 2 +- .../src/use-interval/use-interval.test.ts | 2 +- .../src/use-list-state/use-list-state.test.ts | 2 +- .../src/use-local-storage/create-storage.ts | 2 +- .../src/use-media-query/use-media-query.ts | 2 +- .../use-merged-ref/use-merged-ref.test.tsx | 2 +- .../src/use-merged-ref/use-merged-ref.ts | 2 +- .../hooks/src/use-mouse/use-mouse.test.tsx | 2 +- .../@mantine/hooks/src/use-move/use-move.ts | 2 +- .../hooks/src/use-network/use-network.ts | 2 +- .../src/use-pagination/use-pagination.test.ts | 2 +- .../hooks/src/use-queue/use-queue.test.ts | 2 +- .../use-scroll-into-view.ts | 2 +- .../src/use-set-state/use-set-state.test.ts | 2 +- .../hooks/src/use-set-state/use-set-state.ts | 2 +- .../use-text-selection/use-text-selection.ts | 2 +- .../hooks/src/use-timeout/use-timeout.ts | 2 +- .../hooks/src/use-toggle/use-toggle.test.ts | 2 +- .../use-validated-state.test.ts | 2 +- .../use-viewport-size/use-viewport-size.ts | 2 +- .../use-window-scroll/use-window-scroll.ts | 2 +- packages/@mantine/modals/src/ConfirmModal.tsx | 2 +- packages/@mantine/modals/src/Modals.story.tsx | 8 +- .../@mantine/modals/src/ModalsProvider.tsx | 12 +- .../modals/src/use-modals/use-modals.test.tsx | 8 +- .../src/NotificationContainer.tsx | 4 +- .../notifications/src/Notifications.tsx | 28 ++-- .../notifications/src/notifications.store.ts | 2 +- .../nprogress/src/NavigationProgress.tsx | 6 +- .../@mantine/nprogress/src/nprogress.store.ts | 2 +- .../spotlight/src/Spotlight.context.ts | 2 +- .../@mantine/spotlight/src/Spotlight.test.tsx | 2 +- packages/@mantine/spotlight/src/Spotlight.tsx | 16 +-- .../spotlight/src/SpotlightAction.tsx | 10 +- .../spotlight/src/SpotlightActionsGroup.tsx | 6 +- .../spotlight/src/SpotlightActionsList.tsx | 6 +- .../@mantine/spotlight/src/SpotlightEmpty.tsx | 4 +- .../spotlight/src/SpotlightFooter.tsx | 6 +- .../@mantine/spotlight/src/SpotlightRoot.tsx | 16 +-- .../spotlight/src/SpotlightSearch.tsx | 6 +- .../spotlight/src/default-spotlight-filter.ts | 2 +- .../@mantine/spotlight/src/limit-actions.ts | 2 +- .../@mantine/spotlight/src/spotlight.store.ts | 2 +- .../tiptap/src/RichTextEditor.context.ts | 2 +- .../tiptap/src/RichTextEditor.story.tsx | 22 +-- .../@mantine/tiptap/src/RichTextEditor.tsx | 14 +- .../RichTextEditorContent.tsx | 6 +- .../RichTextEditorColorControl.tsx | 4 +- .../RichTextEditorColorPickerControl.tsx | 18 +-- .../RichTextEditorControl.tsx | 8 +- .../RichTextEditorLinkControl.tsx | 16 +-- .../src/RichTextEditorControl/controls.tsx | 28 ++-- .../RichTextEditorControlsGroup.tsx | 4 +- .../RichTextEditorToolbar.tsx | 4 +- .../vanilla-extract/src/theme-to-vars.ts | 2 +- .../@mantine/vanilla-extract/src/types.ts | 6 +- .../src/ConfiguratorDemo/ConfiguratorDemo.tsx | 18 +-- .../controls/ConfiguratorBoolean.control.tsx | 2 +- .../controls/ConfiguratorColor.control.tsx | 14 +- .../controls/ConfiguratorNumber.control.tsx | 2 +- .../ConfiguratorSegmented.control.tsx | 4 +- .../controls/ConfiguratorSelect.control.tsx | 4 +- .../controls/ConfiguratorSize.control.tsx | 2 +- .../controls/ConfiguratorString.control.tsx | 2 +- .../@mantinex/demo/src/DemoCode/DemoCode.tsx | 2 +- .../demo/src/StylesApiDemo/StylesApiDemo.tsx | 4 +- .../@mantinex/dev-icons/src/Icons.story.tsx | 2 +- .../dev-icons/src/get-code-file-icon.tsx | 2 +- packages/@mantinex/dev-icons/src/types.ts | 2 +- .../mantine-header/src/ColorSchemeControl.tsx | 4 +- .../mantine-header/src/DirectionControl.tsx | 2 +- .../mantine-header/src/HeaderControl.tsx | 2 +- .../mantine-header/src/HeaderControls.tsx | 2 +- .../src/SearchControl/SearchControl.tsx | 4 +- .../src/SearchMobileControl.tsx | 2 +- .../src/MantineLogo/MantineLogoText.tsx | 2 +- .../@mantinex/shiki/src/CodeHighlight.tsx | 18 +-- .../@mantinex/shiki/src/CodeHighlightTabs.tsx | 26 ++-- packages/@mantinex/shiki/src/CopyIcon.tsx | 2 +- packages/@mantinex/shiki/src/ExpandIcon.tsx | 2 +- packages/@mantinex/shiki/src/Shiki.story.tsx | 2 +- .../@mantinex/shiki/src/ShikiProvider.tsx | 2 +- scripts/build/build-all-packages.ts | 6 +- scripts/build/build-package.ts | 8 +- scripts/build/generate-css.ts | 8 +- scripts/build/generate-dts.ts | 2 +- scripts/build/index.ts | 4 +- scripts/build/rollup/create-package-config.ts | 10 +- scripts/codegen/generate-examples-code.ts | 2 +- scripts/codegen/index.ts | 2 +- scripts/docgen/docgen-paths.ts | 2 +- scripts/docgen/index.ts | 2 +- scripts/docs/changelog.ts | 2 +- scripts/docs/deploy-alpha.ts | 4 +- scripts/packages/locate-package.ts | 2 +- scripts/plop/index.ts | 6 +- scripts/publish/index.ts | 12 +- scripts/release/index.ts | 14 +- scripts/release/open-github-release.ts | 2 +- scripts/tests/conflicts.ts | 2 +- scripts/tests/exports.ts | 2 +- scripts/tests/validate-package-json.ts | 2 +- scripts/tests/validate-packages-files.ts | 4 +- yarn.lock | 135 +++++++++++++++++- 1989 files changed, 4129 insertions(+), 3962 deletions(-) diff --git a/.prettierrc.mjs b/.prettierrc.mjs index 3d0b267067c..81886c0c691 100644 --- a/.prettierrc.mjs +++ b/.prettierrc.mjs @@ -1,8 +1,27 @@ -/** @type {import("prettier").Config} */ +/** @type {import("@ianvs/prettier-plugin-sort-imports").PrettierConfig} */ const config = { printWidth: 100, singleQuote: true, trailingComma: 'es5', + plugins: ['@ianvs/prettier-plugin-sort-imports'], + importOrder: [ + '.*styles.css$', + '', + 'dayjs', + '^react$', + '^next$', + '^next/.*$', + '', + '', + '^@mantine/(.*)$', + '^@mantinex/(.*)$', + '^@mantine-tests/(.*)$', + '^@docs/(.*)$', + '^@/.*$', + '^../(?!.*.css$).*$', + '^./(?!.*.css$).*$', + '\\.css$', + ], overrides: [ { files: '*.mdx', diff --git a/.storybook/preview.tsx b/.storybook/preview.tsx index e38ab19c33b..97adc9362f0 100644 --- a/.storybook/preview.tsx +++ b/.storybook/preview.tsx @@ -3,11 +3,11 @@ import { addons } from '@storybook/preview-api'; import { IconTextDirectionLtr, IconTextDirectionRtl } from '@tabler/icons-react'; import { DARK_MODE_EVENT_NAME } from 'storybook-dark-mode'; import { - MantineProvider, - useMantineColorScheme, ActionIcon, DirectionProvider, + MantineProvider, useDirection, + useMantineColorScheme, } from '@mantine/core'; import { theme } from '../docs/theme'; diff --git a/docs/src/app-shell-examples/AppShellPage/AppShellPage.tsx b/docs/src/app-shell-examples/AppShellPage/AppShellPage.tsx index 8016d405c31..1fb3f9db0e7 100644 --- a/docs/src/app-shell-examples/AppShellPage/AppShellPage.tsx +++ b/docs/src/app-shell-examples/AppShellPage/AppShellPage.tsx @@ -1,10 +1,10 @@ import React, { useEffect } from 'react'; import { useRouter } from 'next/router'; -import { CodeHighlightTabs } from '@mantinex/shiki'; import { getCodeFileIcon } from '@mantinex/dev-icons'; +import { CodeHighlightTabs } from '@mantinex/shiki'; import { PageHead } from '@/components/PageHead'; -import { ExamplesDrawer } from './ExamplesDrawer/ExamplesDrawer'; import { APP_SHELL_EXAMPLES_COMPONENTS } from '../examples'; +import { ExamplesDrawer } from './ExamplesDrawer/ExamplesDrawer'; export function AppShellPage() { const router = useRouter(); diff --git a/docs/src/app-shell-examples/AppShellPage/ExamplesDrawer/ExamplesDrawer.tsx b/docs/src/app-shell-examples/AppShellPage/ExamplesDrawer/ExamplesDrawer.tsx index 90c2eb37b64..01df14a3b79 100644 --- a/docs/src/app-shell-examples/AppShellPage/ExamplesDrawer/ExamplesDrawer.tsx +++ b/docs/src/app-shell-examples/AppShellPage/ExamplesDrawer/ExamplesDrawer.tsx @@ -1,9 +1,9 @@ import React from 'react'; import Link from 'next/link'; import { useRouter } from 'next/router'; +import { IconArrowLeft, IconCode, IconLayoutBoard, IconMenu2 } from '@tabler/icons-react'; +import { Affix, Button, Drawer, Group, rem, ScrollArea, Text, UnstyledButton } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { Button, Affix, Drawer, Group, rem, UnstyledButton, Text, ScrollArea } from '@mantine/core'; -import { IconMenu2, IconArrowLeft, IconCode, IconLayoutBoard } from '@tabler/icons-react'; import { APP_SHELL_EXAMPLES_DATA } from '../../app-shell-examples-data'; import classes from './ExamplesDrawer.module.css'; diff --git a/docs/src/app-shell-examples/examples/AltLayout/AltLayout.tsx b/docs/src/app-shell-examples/examples/AltLayout/AltLayout.tsx index 0395c9105cc..50131bd97e4 100644 --- a/docs/src/app-shell-examples/examples/AltLayout/AltLayout.tsx +++ b/docs/src/app-shell-examples/examples/AltLayout/AltLayout.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { useDisclosure } from '@mantine/hooks'; import { AppShell, Burger, Group, Skeleton, Text } from '@mantine/core'; +import { useDisclosure } from '@mantine/hooks'; import { MantineLogo } from '@mantinex/mantine-logo'; export function AltLayout() { diff --git a/docs/src/app-shell-examples/examples/AltLayout/code.json b/docs/src/app-shell-examples/examples/AltLayout/code.json index d40bc9f7b81..4707074ef97 100644 --- a/docs/src/app-shell-examples/examples/AltLayout/code.json +++ b/docs/src/app-shell-examples/examples/AltLayout/code.json @@ -2,6 +2,6 @@ { "fileName": "AltLayout.tsx", "language": "tsx", - "code": "import { useDisclosure } from '@mantine/hooks';\nimport { AppShell, Burger, Group, Skeleton, Text } from '@mantine/core';\nimport { MantineLogo } from '@mantinex/mantine-logo';\n\nexport function AltLayout() {\n const [opened, { toggle }] = useDisclosure();\n\n return (\n \n \n \n \n \n \n \n \n \n \n Navbar\n \n {Array(15)\n .fill(0)\n .map((_, index) => (\n \n ))}\n \n \n Alt layout – Navbar and Aside are rendered on top on Header and Footer\n \n Aside\n Footer\n \n );\n}\n" + "code": "import { AppShell, Burger, Group, Skeleton, Text } from '@mantine/core';\nimport { useDisclosure } from '@mantine/hooks';\nimport { MantineLogo } from '@mantinex/mantine-logo';\n\nexport function AltLayout() {\n const [opened, { toggle }] = useDisclosure();\n\n return (\n \n \n \n \n \n \n \n \n \n \n Navbar\n \n {Array(15)\n .fill(0)\n .map((_, index) => (\n \n ))}\n \n \n Alt layout – Navbar and Aside are rendered on top on Header and Footer\n \n Aside\n Footer\n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/app-shell-examples/examples/BasicAppShell/BasicAppShell.tsx b/docs/src/app-shell-examples/examples/BasicAppShell/BasicAppShell.tsx index 3b75c674dd4..f53b259013c 100644 --- a/docs/src/app-shell-examples/examples/BasicAppShell/BasicAppShell.tsx +++ b/docs/src/app-shell-examples/examples/BasicAppShell/BasicAppShell.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { useDisclosure } from '@mantine/hooks'; import { AppShell, Burger, Group, Skeleton } from '@mantine/core'; +import { useDisclosure } from '@mantine/hooks'; import { MantineLogo } from '@mantinex/mantine-logo'; export function BasicAppShell() { diff --git a/docs/src/app-shell-examples/examples/BasicAppShell/code.json b/docs/src/app-shell-examples/examples/BasicAppShell/code.json index e8d14f3fdf8..f4050acb5c1 100644 --- a/docs/src/app-shell-examples/examples/BasicAppShell/code.json +++ b/docs/src/app-shell-examples/examples/BasicAppShell/code.json @@ -2,6 +2,6 @@ { "fileName": "BasicAppShell.tsx", "language": "tsx", - "code": "import { useDisclosure } from '@mantine/hooks';\nimport { AppShell, Burger, Group, Skeleton } from '@mantine/core';\nimport { MantineLogo } from '@mantinex/mantine-logo';\n\nexport function BasicAppShell() {\n const [opened, { toggle }] = useDisclosure();\n\n return (\n \n \n \n \n \n \n \n \n Navbar\n {Array(15)\n .fill(0)\n .map((_, index) => (\n \n ))}\n \n Main\n \n );\n}\n" + "code": "import { AppShell, Burger, Group, Skeleton } from '@mantine/core';\nimport { useDisclosure } from '@mantine/hooks';\nimport { MantineLogo } from '@mantinex/mantine-logo';\n\nexport function BasicAppShell() {\n const [opened, { toggle }] = useDisclosure();\n\n return (\n \n \n \n \n \n \n \n \n Navbar\n {Array(15)\n .fill(0)\n .map((_, index) => (\n \n ))}\n \n Main\n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/app-shell-examples/examples/CollapseDesktop/CollapseDesktop.tsx b/docs/src/app-shell-examples/examples/CollapseDesktop/CollapseDesktop.tsx index 060ac917456..23cbbae2174 100644 --- a/docs/src/app-shell-examples/examples/CollapseDesktop/CollapseDesktop.tsx +++ b/docs/src/app-shell-examples/examples/CollapseDesktop/CollapseDesktop.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { useDisclosure } from '@mantine/hooks'; import { AppShell, Burger, Group, Skeleton } from '@mantine/core'; +import { useDisclosure } from '@mantine/hooks'; import { MantineLogo } from '@mantinex/mantine-logo'; export function CollapseDesktop() { diff --git a/docs/src/app-shell-examples/examples/CollapseDesktop/code.json b/docs/src/app-shell-examples/examples/CollapseDesktop/code.json index 4256affde17..728a0b26200 100644 --- a/docs/src/app-shell-examples/examples/CollapseDesktop/code.json +++ b/docs/src/app-shell-examples/examples/CollapseDesktop/code.json @@ -2,6 +2,6 @@ { "fileName": "CollapseDesktop.tsx", "language": "tsx", - "code": "import { useDisclosure } from '@mantine/hooks';\nimport { AppShell, Burger, Group, Skeleton } from '@mantine/core';\nimport { MantineLogo } from '@mantinex/mantine-logo';\n\nexport function CollapseDesktop() {\n const [mobileOpened, { toggle: toggleMobile }] = useDisclosure();\n const [desktopOpened, { toggle: toggleDesktop }] = useDisclosure(true);\n\n return (\n \n \n \n \n \n \n \n \n \n Navbar\n {Array(15)\n .fill(0)\n .map((_, index) => (\n \n ))}\n \n Main\n \n );\n}\n" + "code": "import { AppShell, Burger, Group, Skeleton } from '@mantine/core';\nimport { useDisclosure } from '@mantine/hooks';\nimport { MantineLogo } from '@mantinex/mantine-logo';\n\nexport function CollapseDesktop() {\n const [mobileOpened, { toggle: toggleMobile }] = useDisclosure();\n const [desktopOpened, { toggle: toggleDesktop }] = useDisclosure(true);\n\n return (\n \n \n \n \n \n \n \n \n \n Navbar\n {Array(15)\n .fill(0)\n .map((_, index) => (\n \n ))}\n \n Main\n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/app-shell-examples/examples/Disabled/Disabled.tsx b/docs/src/app-shell-examples/examples/Disabled/Disabled.tsx index 8bbd36d81ee..41f5329b64c 100644 --- a/docs/src/app-shell-examples/examples/Disabled/Disabled.tsx +++ b/docs/src/app-shell-examples/examples/Disabled/Disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { AppShell, Burger, Button, Group, Skeleton } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { AppShell, Burger, Group, Skeleton, Button } from '@mantine/core'; import { MantineLogo } from '@mantinex/mantine-logo'; export function Disabled() { diff --git a/docs/src/app-shell-examples/examples/Disabled/code.json b/docs/src/app-shell-examples/examples/Disabled/code.json index 1171c1aa843..1b2f3e953d0 100644 --- a/docs/src/app-shell-examples/examples/Disabled/code.json +++ b/docs/src/app-shell-examples/examples/Disabled/code.json @@ -2,6 +2,6 @@ { "fileName": "Disabled.tsx", "language": "tsx", - "code": "import { useDisclosure } from '@mantine/hooks';\nimport { AppShell, Burger, Group, Skeleton, Button } from '@mantine/core';\nimport { MantineLogo } from '@mantinex/mantine-logo';\n\nexport function Disabled() {\n const [opened, { toggle }] = useDisclosure();\n const [disabled, { toggle: toggleDisabled }] = useDisclosure();\n\n return (\n \n \n \n \n \n \n \n \n Navbar\n {Array(15)\n .fill(0)\n .map((_, index) => (\n \n ))}\n \n \n \n \n \n );\n}\n" + "code": "import { AppShell, Burger, Button, Group, Skeleton } from '@mantine/core';\nimport { useDisclosure } from '@mantine/hooks';\nimport { MantineLogo } from '@mantinex/mantine-logo';\n\nexport function Disabled() {\n const [opened, { toggle }] = useDisclosure();\n const [disabled, { toggle: toggleDisabled }] = useDisclosure();\n\n return (\n \n \n \n \n \n \n \n \n Navbar\n {Array(15)\n .fill(0)\n .map((_, index) => (\n \n ))}\n \n \n \n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/app-shell-examples/examples/FullLayout/FullLayout.tsx b/docs/src/app-shell-examples/examples/FullLayout/FullLayout.tsx index d3cc2c957c1..6524a297e96 100644 --- a/docs/src/app-shell-examples/examples/FullLayout/FullLayout.tsx +++ b/docs/src/app-shell-examples/examples/FullLayout/FullLayout.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { useDisclosure } from '@mantine/hooks'; import { AppShell, Burger, Group, Skeleton } from '@mantine/core'; +import { useDisclosure } from '@mantine/hooks'; import { MantineLogo } from '@mantinex/mantine-logo'; export function FullLayout() { diff --git a/docs/src/app-shell-examples/examples/FullLayout/code.json b/docs/src/app-shell-examples/examples/FullLayout/code.json index 54f9e4eb8e8..4a8e827e769 100644 --- a/docs/src/app-shell-examples/examples/FullLayout/code.json +++ b/docs/src/app-shell-examples/examples/FullLayout/code.json @@ -2,6 +2,6 @@ { "fileName": "FullLayout.tsx", "language": "tsx", - "code": "import { useDisclosure } from '@mantine/hooks';\nimport { AppShell, Burger, Group, Skeleton } from '@mantine/core';\nimport { MantineLogo } from '@mantinex/mantine-logo';\n\nexport function FullLayout() {\n const [opened, { toggle }] = useDisclosure();\n\n return (\n \n \n \n \n \n \n \n \n Navbar\n {Array(15)\n .fill(0)\n .map((_, index) => (\n \n ))}\n \n \n Aside is hidden on on md breakpoint and cannot be opened when it is collapsed\n \n Aside\n Footer\n \n );\n}\n" + "code": "import { AppShell, Burger, Group, Skeleton } from '@mantine/core';\nimport { useDisclosure } from '@mantine/hooks';\nimport { MantineLogo } from '@mantinex/mantine-logo';\n\nexport function FullLayout() {\n const [opened, { toggle }] = useDisclosure();\n\n return (\n \n \n \n \n \n \n \n \n Navbar\n {Array(15)\n .fill(0)\n .map((_, index) => (\n \n ))}\n \n \n Aside is hidden on on md breakpoint and cannot be opened when it is collapsed\n \n Aside\n Footer\n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/app-shell-examples/examples/Headroom/Headroom.tsx b/docs/src/app-shell-examples/examples/Headroom/Headroom.tsx index fc34bb82539..5ab4b0fdaed 100644 --- a/docs/src/app-shell-examples/examples/Headroom/Headroom.tsx +++ b/docs/src/app-shell-examples/examples/Headroom/Headroom.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { AppShell, Group, rem, Text } from '@mantine/core'; import { useHeadroom } from '@mantine/hooks'; -import { AppShell, Group, Text, rem } from '@mantine/core'; import { MantineLogo } from '@mantinex/mantine-logo'; const lorem = diff --git a/docs/src/app-shell-examples/examples/Headroom/code.json b/docs/src/app-shell-examples/examples/Headroom/code.json index 7dfdce9215c..f64af8f0605 100644 --- a/docs/src/app-shell-examples/examples/Headroom/code.json +++ b/docs/src/app-shell-examples/examples/Headroom/code.json @@ -2,6 +2,6 @@ { "fileName": "Headroom.tsx", "language": "tsx", - "code": "import { useHeadroom } from '@mantine/hooks';\nimport { AppShell, Group, Text, rem } from '@mantine/core';\nimport { MantineLogo } from '@mantinex/mantine-logo';\n\nconst lorem =\n 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Eos ullam, ex cum repellat alias ea nemo. Ducimus ex nesciunt hic ad saepe molestiae nobis necessitatibus laboriosam officia, reprehenderit, earum fugiat?';\n\nexport function Headroom() {\n const pinned = useHeadroom({ fixedAt: 120 });\n\n return (\n \n \n \n \n \n \n\n \n {Array(40)\n .fill(0)\n .map((_, index) => (\n \n {lorem}\n \n ))}\n \n \n );\n}\n" + "code": "import { AppShell, Group, rem, Text } from '@mantine/core';\nimport { useHeadroom } from '@mantine/hooks';\nimport { MantineLogo } from '@mantinex/mantine-logo';\n\nconst lorem =\n 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Eos ullam, ex cum repellat alias ea nemo. Ducimus ex nesciunt hic ad saepe molestiae nobis necessitatibus laboriosam officia, reprehenderit, earum fugiat?';\n\nexport function Headroom() {\n const pinned = useHeadroom({ fixedAt: 120 });\n\n return (\n \n \n \n \n \n \n\n \n {Array(40)\n .fill(0)\n .map((_, index) => (\n \n {lorem}\n \n ))}\n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/app-shell-examples/examples/MobileNavbar/MobileNavbar.tsx b/docs/src/app-shell-examples/examples/MobileNavbar/MobileNavbar.tsx index 9c615666f08..818d4a6c9ed 100644 --- a/docs/src/app-shell-examples/examples/MobileNavbar/MobileNavbar.tsx +++ b/docs/src/app-shell-examples/examples/MobileNavbar/MobileNavbar.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { useDisclosure } from '@mantine/hooks'; import { AppShell, Burger, Group, UnstyledButton } from '@mantine/core'; +import { useDisclosure } from '@mantine/hooks'; import { MantineLogo } from '@mantinex/mantine-logo'; import classes from './MobileNavbar.module.css'; diff --git a/docs/src/app-shell-examples/examples/MobileNavbar/code.json b/docs/src/app-shell-examples/examples/MobileNavbar/code.json index d25850588d4..bd2a6e6f671 100644 --- a/docs/src/app-shell-examples/examples/MobileNavbar/code.json +++ b/docs/src/app-shell-examples/examples/MobileNavbar/code.json @@ -2,7 +2,7 @@ { "fileName": "MobileNavbar.tsx", "language": "tsx", - "code": "import { useDisclosure } from '@mantine/hooks';\nimport { AppShell, Burger, Group, UnstyledButton } from '@mantine/core';\nimport { MantineLogo } from '@mantinex/mantine-logo';\nimport classes from './MobileNavbar.module.css';\n\nexport function MobileNavbar() {\n const [opened, { toggle }] = useDisclosure();\n\n return (\n \n \n \n \n \n \n \n Home\n Blog\n Contacts\n Support\n \n \n \n \n\n \n Home\n Blog\n Contacts\n Support\n \n\n \n Navbar is only visible on mobile, links that are rendered in the header on desktop are\n hidden on mobile in header and rendered in navbar instead.\n \n \n );\n}\n" + "code": "import { AppShell, Burger, Group, UnstyledButton } from '@mantine/core';\nimport { useDisclosure } from '@mantine/hooks';\nimport { MantineLogo } from '@mantinex/mantine-logo';\nimport classes from './MobileNavbar.module.css';\n\nexport function MobileNavbar() {\n const [opened, { toggle }] = useDisclosure();\n\n return (\n \n \n \n \n \n \n \n Home\n Blog\n Contacts\n Support\n \n \n \n \n\n \n Home\n Blog\n Contacts\n Support\n \n\n \n Navbar is only visible on mobile, links that are rendered in the header on desktop are\n hidden on mobile in header and rendered in navbar instead.\n \n \n );\n}\n" }, { "fileName": "MobileNavbar.module.css", diff --git a/docs/src/app-shell-examples/examples/NavbarSection/NavbarSection.tsx b/docs/src/app-shell-examples/examples/NavbarSection/NavbarSection.tsx index 1de9dfb1f27..daeb7d48856 100644 --- a/docs/src/app-shell-examples/examples/NavbarSection/NavbarSection.tsx +++ b/docs/src/app-shell-examples/examples/NavbarSection/NavbarSection.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { AppShell, Burger, Group, ScrollArea, Skeleton } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { AppShell, Burger, Group, Skeleton, ScrollArea } from '@mantine/core'; import { MantineLogo } from '@mantinex/mantine-logo'; export function NavbarSection() { diff --git a/docs/src/app-shell-examples/examples/NavbarSection/code.json b/docs/src/app-shell-examples/examples/NavbarSection/code.json index 1b05162b6bf..f6d20aa3554 100644 --- a/docs/src/app-shell-examples/examples/NavbarSection/code.json +++ b/docs/src/app-shell-examples/examples/NavbarSection/code.json @@ -2,6 +2,6 @@ { "fileName": "NavbarSection.tsx", "language": "tsx", - "code": "import { useDisclosure } from '@mantine/hooks';\nimport { AppShell, Burger, Group, Skeleton, ScrollArea } from '@mantine/core';\nimport { MantineLogo } from '@mantinex/mantine-logo';\n\nexport function NavbarSection() {\n const [opened, { toggle }] = useDisclosure();\n\n return (\n \n \n \n \n \n \n \n \n Navbar header\n \n 60 links in a scrollable section\n {Array(60)\n .fill(0)\n .map((_, index) => (\n \n ))}\n \n Navbar footer – always at the bottom\n \n Main\n \n );\n}\n" + "code": "import { AppShell, Burger, Group, ScrollArea, Skeleton } from '@mantine/core';\nimport { useDisclosure } from '@mantine/hooks';\nimport { MantineLogo } from '@mantinex/mantine-logo';\n\nexport function NavbarSection() {\n const [opened, { toggle }] = useDisclosure();\n\n return (\n \n \n \n \n \n \n \n \n Navbar header\n \n 60 links in a scrollable section\n {Array(60)\n .fill(0)\n .map((_, index) => (\n \n ))}\n \n Navbar footer – always at the bottom\n \n Main\n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/app-shell-examples/examples/NoTransitions/NoTransitions.tsx b/docs/src/app-shell-examples/examples/NoTransitions/NoTransitions.tsx index 2e24a9ef29b..8b5f352e2bd 100644 --- a/docs/src/app-shell-examples/examples/NoTransitions/NoTransitions.tsx +++ b/docs/src/app-shell-examples/examples/NoTransitions/NoTransitions.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { useDisclosure } from '@mantine/hooks'; import { AppShell, Burger, Group, Skeleton } from '@mantine/core'; +import { useDisclosure } from '@mantine/hooks'; import { MantineLogo } from '@mantinex/mantine-logo'; export function NoTransitions() { diff --git a/docs/src/app-shell-examples/examples/NoTransitions/code.json b/docs/src/app-shell-examples/examples/NoTransitions/code.json index 5248db54b17..a31462d330a 100644 --- a/docs/src/app-shell-examples/examples/NoTransitions/code.json +++ b/docs/src/app-shell-examples/examples/NoTransitions/code.json @@ -2,6 +2,6 @@ { "fileName": "NoTransitions.tsx", "language": "tsx", - "code": "import { useDisclosure } from '@mantine/hooks';\nimport { AppShell, Burger, Group, Skeleton } from '@mantine/core';\nimport { MantineLogo } from '@mantinex/mantine-logo';\n\nexport function NoTransitions() {\n const [opened, { toggle }] = useDisclosure();\n\n return (\n \n \n \n \n \n \n \n \n Navbar\n {Array(15)\n .fill(0)\n .map((_, index) => (\n \n ))}\n \n Main\n \n );\n}\n" + "code": "import { AppShell, Burger, Group, Skeleton } from '@mantine/core';\nimport { useDisclosure } from '@mantine/hooks';\nimport { MantineLogo } from '@mantinex/mantine-logo';\n\nexport function NoTransitions() {\n const [opened, { toggle }] = useDisclosure();\n\n return (\n \n \n \n \n \n \n \n \n Navbar\n {Array(15)\n .fill(0)\n .map((_, index) => (\n \n ))}\n \n Main\n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/app-shell-examples/examples/ResponsiveSizes/ResponsiveSizes.tsx b/docs/src/app-shell-examples/examples/ResponsiveSizes/ResponsiveSizes.tsx index ac31471a04a..751254b12a6 100644 --- a/docs/src/app-shell-examples/examples/ResponsiveSizes/ResponsiveSizes.tsx +++ b/docs/src/app-shell-examples/examples/ResponsiveSizes/ResponsiveSizes.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { useDisclosure } from '@mantine/hooks'; import { AppShell, Burger, Group, Skeleton } from '@mantine/core'; +import { useDisclosure } from '@mantine/hooks'; import { MantineLogo } from '@mantinex/mantine-logo'; export function ResponsiveSizes() { diff --git a/docs/src/app-shell-examples/examples/ResponsiveSizes/code.json b/docs/src/app-shell-examples/examples/ResponsiveSizes/code.json index d35dfcdcfa5..f35e28a4f56 100644 --- a/docs/src/app-shell-examples/examples/ResponsiveSizes/code.json +++ b/docs/src/app-shell-examples/examples/ResponsiveSizes/code.json @@ -2,6 +2,6 @@ { "fileName": "ResponsiveSizes.tsx", "language": "tsx", - "code": "import { useDisclosure } from '@mantine/hooks';\nimport { AppShell, Burger, Group, Skeleton } from '@mantine/core';\nimport { MantineLogo } from '@mantinex/mantine-logo';\n\nexport function ResponsiveSizes() {\n const [opened, { toggle }] = useDisclosure();\n\n return (\n \n \n \n \n \n \n \n \n Navbar\n {Array(15)\n .fill(0)\n .map((_, index) => (\n \n ))}\n \n Main\n \n );\n}\n" + "code": "import { AppShell, Burger, Group, Skeleton } from '@mantine/core';\nimport { useDisclosure } from '@mantine/hooks';\nimport { MantineLogo } from '@mantinex/mantine-logo';\n\nexport function ResponsiveSizes() {\n const [opened, { toggle }] = useDisclosure();\n\n return (\n \n \n \n \n \n \n \n \n Navbar\n {Array(15)\n .fill(0)\n .map((_, index) => (\n \n ))}\n \n Main\n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/app-shell-examples/examples/index.ts b/docs/src/app-shell-examples/examples/index.ts index 90e0338b1dc..d63635ae6b0 100644 --- a/docs/src/app-shell-examples/examples/index.ts +++ b/docs/src/app-shell-examples/examples/index.ts @@ -1,25 +1,24 @@ import { ShikiLanguage } from '@mantinex/shiki'; -import { BasicAppShell } from './BasicAppShell/BasicAppShell'; -import { ResponsiveSizes } from './ResponsiveSizes/ResponsiveSizes'; -import { MobileNavbar } from './MobileNavbar/MobileNavbar'; -import { FullLayout } from './FullLayout/FullLayout'; import { AltLayout } from './AltLayout/AltLayout'; -import { CollapseDesktop } from './CollapseDesktop/CollapseDesktop'; -import { NoTransitions } from './NoTransitions/NoTransitions'; -import { Disabled } from './Disabled/Disabled'; -import { Headroom } from './Headroom/Headroom'; -import { NavbarSection } from './NavbarSection/NavbarSection'; - -import BasicAppShellCode from './BasicAppShell/code.json'; -import ResponsiveSizesCode from './ResponsiveSizes/code.json'; -import MobileNavbarCode from './MobileNavbar/code.json'; -import FullLayoutCode from './FullLayout/code.json'; import AltLayoutCode from './AltLayout/code.json'; +import { BasicAppShell } from './BasicAppShell/BasicAppShell'; +import BasicAppShellCode from './BasicAppShell/code.json'; import CollapseDesktopCode from './CollapseDesktop/code.json'; -import NoTransitionsCode from './NoTransitions/code.json'; +import { CollapseDesktop } from './CollapseDesktop/CollapseDesktop'; import DisabledCode from './Disabled/code.json'; +import { Disabled } from './Disabled/Disabled'; +import FullLayoutCode from './FullLayout/code.json'; +import { FullLayout } from './FullLayout/FullLayout'; import HeadroomCode from './Headroom/code.json'; +import { Headroom } from './Headroom/Headroom'; +import MobileNavbarCode from './MobileNavbar/code.json'; +import { MobileNavbar } from './MobileNavbar/MobileNavbar'; import NavbarSectionCode from './NavbarSection/code.json'; +import { NavbarSection } from './NavbarSection/NavbarSection'; +import NoTransitionsCode from './NoTransitions/code.json'; +import { NoTransitions } from './NoTransitions/NoTransitions'; +import ResponsiveSizesCode from './ResponsiveSizes/code.json'; +import { ResponsiveSizes } from './ResponsiveSizes/ResponsiveSizes'; interface AppShellExampleComponent { component: () => JSX.Element; diff --git a/docs/src/combobox-examples/ComboboxDemo/ComboboxDemo.tsx b/docs/src/combobox-examples/ComboboxDemo/ComboboxDemo.tsx index 3f06fa7c427..cbfd430d9e9 100644 --- a/docs/src/combobox-examples/ComboboxDemo/ComboboxDemo.tsx +++ b/docs/src/combobox-examples/ComboboxDemo/ComboboxDemo.tsx @@ -1,11 +1,11 @@ import React from 'react'; -import cx from 'clsx'; -import { RemoveScroll, Text, Badge } from '@mantine/core'; import { useRouter } from 'next/router'; +import cx from 'clsx'; +import { Badge, RemoveScroll, Text } from '@mantine/core'; import { getCodeFileIcon } from '@mantinex/dev-icons'; import { CodeHighlightTabs } from '@mantinex/shiki'; -import { COMBOBOX_EXAMPLES_COMPONENTS, ComboboxExampleId } from '../examples'; import { COMBOBOX_EXAMPLES_DATA } from '../combobox-examples-data'; +import { COMBOBOX_EXAMPLES_COMPONENTS, ComboboxExampleId } from '../examples'; import classes from './ComboboxDemo.module.css'; export function ComboboxDemo() { diff --git a/docs/src/combobox-examples/ComboboxPage/ComboboxPage.tsx b/docs/src/combobox-examples/ComboboxPage/ComboboxPage.tsx index cd3a114c5f6..6a1ff382773 100644 --- a/docs/src/combobox-examples/ComboboxPage/ComboboxPage.tsx +++ b/docs/src/combobox-examples/ComboboxPage/ComboboxPage.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { ComboboxShell } from '../ComboboxShell/ComboboxShell'; -import { ComboboxDemo } from '../ComboboxDemo/ComboboxDemo'; import { PageHead } from '@/components/PageHead'; +import { ComboboxDemo } from '../ComboboxDemo/ComboboxDemo'; +import { ComboboxShell } from '../ComboboxShell/ComboboxShell'; export function ComboboxPage() { return ( diff --git a/docs/src/combobox-examples/ComboboxShell/ComboboxNavbar/ComboboxLinksGroup/ComboboxLinksGroup.tsx b/docs/src/combobox-examples/ComboboxShell/ComboboxNavbar/ComboboxLinksGroup/ComboboxLinksGroup.tsx index fd72deb5459..48b1878ef39 100644 --- a/docs/src/combobox-examples/ComboboxShell/ComboboxNavbar/ComboboxLinksGroup/ComboboxLinksGroup.tsx +++ b/docs/src/combobox-examples/ComboboxShell/ComboboxNavbar/ComboboxLinksGroup/ComboboxLinksGroup.tsx @@ -1,9 +1,9 @@ import React, { useEffect } from 'react'; import Link from 'next/link'; import { useRouter } from 'next/router'; -import { useDisclosure } from '@mantine/hooks'; -import { UnstyledButton, Highlight, Box, Text } from '@mantine/core'; import { IconChevronDown } from '@tabler/icons-react'; +import { Box, Highlight, Text, UnstyledButton } from '@mantine/core'; +import { useDisclosure } from '@mantine/hooks'; import type { ComboboxExamplesGroup } from '../get-grouped-data'; import classes from './ComboboxLinksGroup.module.css'; diff --git a/docs/src/combobox-examples/ComboboxShell/ComboboxNavbar/ComboboxNavbar.tsx b/docs/src/combobox-examples/ComboboxShell/ComboboxNavbar/ComboboxNavbar.tsx index 99aecccbbc6..b43c3ee4961 100644 --- a/docs/src/combobox-examples/ComboboxShell/ComboboxNavbar/ComboboxNavbar.tsx +++ b/docs/src/combobox-examples/ComboboxShell/ComboboxNavbar/ComboboxNavbar.tsx @@ -1,7 +1,7 @@ -import React, { useState, useRef, useEffect } from 'react'; -import { useHotkeys } from '@mantine/hooks'; -import { Text, TextInput, ScrollArea } from '@mantine/core'; +import React, { useEffect, useRef, useState } from 'react'; import { IconSearch } from '@tabler/icons-react'; +import { ScrollArea, Text, TextInput } from '@mantine/core'; +import { useHotkeys } from '@mantine/hooks'; import { COMBOBOX_EXAMPLES_DATA } from '../../combobox-examples-data'; import { ComboboxLinksGroup } from './ComboboxLinksGroup/ComboboxLinksGroup'; import { getGroupedData } from './get-grouped-data'; diff --git a/docs/src/combobox-examples/ComboboxShell/ComboboxShell.tsx b/docs/src/combobox-examples/ComboboxShell/ComboboxShell.tsx index 0d1199eefc2..89d8df35b37 100644 --- a/docs/src/combobox-examples/ComboboxShell/ComboboxShell.tsx +++ b/docs/src/combobox-examples/ComboboxShell/ComboboxShell.tsx @@ -1,4 +1,4 @@ -import React, { useState, useEffect } from 'react'; +import React, { useEffect, useState } from 'react'; import { useDirection } from '@mantine/core'; import { Shell } from '@/components/Shell'; import { ComboboxNavbar } from './ComboboxNavbar/ComboboxNavbar'; diff --git a/docs/src/combobox-examples/examples/ActiveOptionsFilter/ActiveOptionsFilter.tsx b/docs/src/combobox-examples/examples/ActiveOptionsFilter/ActiveOptionsFilter.tsx index e2624472489..3d4c912b9ef 100644 --- a/docs/src/combobox-examples/examples/ActiveOptionsFilter/ActiveOptionsFilter.tsx +++ b/docs/src/combobox-examples/examples/ActiveOptionsFilter/ActiveOptionsFilter.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { PillsInput, Pill, Input, Combobox, useCombobox } from '@mantine/core'; +import { Combobox, Input, Pill, PillsInput, useCombobox } from '@mantine/core'; const groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate']; diff --git a/docs/src/combobox-examples/examples/ActiveOptionsFilter/code.json b/docs/src/combobox-examples/examples/ActiveOptionsFilter/code.json index bc8f69b85c6..a2cdb6a2c46 100644 --- a/docs/src/combobox-examples/examples/ActiveOptionsFilter/code.json +++ b/docs/src/combobox-examples/examples/ActiveOptionsFilter/code.json @@ -2,6 +2,6 @@ { "fileName": "ActiveOptionsFilter.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { PillsInput, Pill, Input, Combobox, useCombobox } from '@mantine/core';\n\nconst groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate'];\n\nexport function ActiveOptionsFilter() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n });\n\n const [value, setValue] = useState([]);\n\n const handleValueSelect = (val: string) =>\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n\n const handleValueRemove = (val: string) =>\n setValue((current) => current.filter((v) => v !== val));\n\n const values = value.map((item) => (\n handleValueRemove(item)}>\n {item}\n \n ));\n\n const options = groceries\n .filter((item) => !value.includes(item))\n .map((item) => (\n \n {item}\n \n ));\n\n return (\n \n \n combobox.toggleDropdown()}>\n \n {values.length > 0 ? (\n values\n ) : (\n Pick one or more values\n )}\n\n \n combobox.closeDropdown()}\n onKeyDown={(event) => {\n if (event.key === 'Backspace') {\n event.preventDefault();\n handleValueRemove(value[value.length - 1]);\n }\n }}\n />\n \n \n \n \n\n \n \n {options.length === 0 ? All options selected : options}\n \n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Combobox, Input, Pill, PillsInput, useCombobox } from '@mantine/core';\n\nconst groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate'];\n\nexport function ActiveOptionsFilter() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n });\n\n const [value, setValue] = useState([]);\n\n const handleValueSelect = (val: string) =>\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n\n const handleValueRemove = (val: string) =>\n setValue((current) => current.filter((v) => v !== val));\n\n const values = value.map((item) => (\n handleValueRemove(item)}>\n {item}\n \n ));\n\n const options = groceries\n .filter((item) => !value.includes(item))\n .map((item) => (\n \n {item}\n \n ));\n\n return (\n \n \n combobox.toggleDropdown()}>\n \n {values.length > 0 ? (\n values\n ) : (\n Pick one or more values\n )}\n\n \n combobox.closeDropdown()}\n onKeyDown={(event) => {\n if (event.key === 'Backspace') {\n event.preventDefault();\n handleValueRemove(value[value.length - 1]);\n }\n }}\n />\n \n \n \n \n\n \n \n {options.length === 0 ? All options selected : options}\n \n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/AsyncAutocomplete/AsyncAutocomplete.tsx b/docs/src/combobox-examples/examples/AsyncAutocomplete/AsyncAutocomplete.tsx index fdc59dd4c21..0adb70df669 100644 --- a/docs/src/combobox-examples/examples/AsyncAutocomplete/AsyncAutocomplete.tsx +++ b/docs/src/combobox-examples/examples/AsyncAutocomplete/AsyncAutocomplete.tsx @@ -1,5 +1,5 @@ -import React, { useState, useRef } from 'react'; -import { Combobox, TextInput, Loader, useCombobox } from '@mantine/core'; +import React, { useRef, useState } from 'react'; +import { Combobox, Loader, TextInput, useCombobox } from '@mantine/core'; const MOCKDATA = [ '🍎 Apples', diff --git a/docs/src/combobox-examples/examples/AsyncAutocomplete/code.json b/docs/src/combobox-examples/examples/AsyncAutocomplete/code.json index 139d991da8c..5759e198ff7 100644 --- a/docs/src/combobox-examples/examples/AsyncAutocomplete/code.json +++ b/docs/src/combobox-examples/examples/AsyncAutocomplete/code.json @@ -2,6 +2,6 @@ { "fileName": "AsyncAutocomplete.tsx", "language": "tsx", - "code": "import { useState, useRef } from 'react';\nimport { Combobox, TextInput, Loader, useCombobox } from '@mantine/core';\n\nconst MOCKDATA = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n '🍋 Lemon',\n '🥬 Lettuce',\n '🍄 Mushrooms',\n '🍊 Oranges',\n '🥔 Potatoes',\n '🍅 Tomatoes',\n '🥚 Eggs',\n '🥛 Milk',\n '🍞 Bread',\n '🍗 Chicken',\n '🍔 Hamburger',\n '🧀 Cheese',\n '🥩 Steak',\n '🍟 French Fries',\n '🍕 Pizza',\n '🥦 Cauliflower',\n '🥜 Peanuts',\n '🍦 Ice Cream',\n '🍯 Honey',\n '🥖 Baguette',\n '🍣 Sushi',\n '🥝 Kiwi',\n '🍓 Strawberries',\n];\n\nfunction getAsyncData(searchQuery: string, signal: AbortSignal) {\n return new Promise((resolve, reject) => {\n signal.addEventListener('abort', () => {\n reject(new Error('Request aborted'));\n });\n\n setTimeout(() => {\n resolve(\n MOCKDATA.filter((item) => item.toLowerCase().includes(searchQuery.toLowerCase())).slice(\n 0,\n 5\n )\n );\n }, Math.random() * 1000);\n });\n}\n\nexport function AsyncAutocomplete() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [loading, setLoading] = useState(false);\n const [data, setData] = useState(null);\n const [value, setValue] = useState('');\n const [empty, setEmpty] = useState(false);\n const abortController = useRef();\n\n const fetchOptions = (query: string) => {\n abortController.current?.abort();\n abortController.current = new AbortController();\n setLoading(true);\n\n getAsyncData(query, abortController.current.signal)\n .then((result) => {\n setData(result);\n setLoading(false);\n setEmpty(result.length === 0);\n abortController.current = undefined;\n })\n .catch(() => {});\n };\n\n const options = (data || []).map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(optionValue);\n combobox.closeDropdown();\n }}\n withinPortal={false}\n store={combobox}\n >\n \n {\n setValue(event.currentTarget.value);\n fetchOptions(event.currentTarget.value);\n combobox.resetSelectedOption();\n combobox.openDropdown();\n }}\n onClick={() => combobox.openDropdown()}\n onFocus={() => {\n combobox.openDropdown();\n if (data === null) {\n fetchOptions(value);\n }\n }}\n onBlur={() => combobox.closeDropdown()}\n rightSection={loading && }\n />\n \n\n \n \n );\n}\n" + "code": "import { useRef, useState } from 'react';\nimport { Combobox, Loader, TextInput, useCombobox } from '@mantine/core';\n\nconst MOCKDATA = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n '🍋 Lemon',\n '🥬 Lettuce',\n '🍄 Mushrooms',\n '🍊 Oranges',\n '🥔 Potatoes',\n '🍅 Tomatoes',\n '🥚 Eggs',\n '🥛 Milk',\n '🍞 Bread',\n '🍗 Chicken',\n '🍔 Hamburger',\n '🧀 Cheese',\n '🥩 Steak',\n '🍟 French Fries',\n '🍕 Pizza',\n '🥦 Cauliflower',\n '🥜 Peanuts',\n '🍦 Ice Cream',\n '🍯 Honey',\n '🥖 Baguette',\n '🍣 Sushi',\n '🥝 Kiwi',\n '🍓 Strawberries',\n];\n\nfunction getAsyncData(searchQuery: string, signal: AbortSignal) {\n return new Promise((resolve, reject) => {\n signal.addEventListener('abort', () => {\n reject(new Error('Request aborted'));\n });\n\n setTimeout(() => {\n resolve(\n MOCKDATA.filter((item) => item.toLowerCase().includes(searchQuery.toLowerCase())).slice(\n 0,\n 5\n )\n );\n }, Math.random() * 1000);\n });\n}\n\nexport function AsyncAutocomplete() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [loading, setLoading] = useState(false);\n const [data, setData] = useState(null);\n const [value, setValue] = useState('');\n const [empty, setEmpty] = useState(false);\n const abortController = useRef();\n\n const fetchOptions = (query: string) => {\n abortController.current?.abort();\n abortController.current = new AbortController();\n setLoading(true);\n\n getAsyncData(query, abortController.current.signal)\n .then((result) => {\n setData(result);\n setLoading(false);\n setEmpty(result.length === 0);\n abortController.current = undefined;\n })\n .catch(() => {});\n };\n\n const options = (data || []).map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(optionValue);\n combobox.closeDropdown();\n }}\n withinPortal={false}\n store={combobox}\n >\n \n {\n setValue(event.currentTarget.value);\n fetchOptions(event.currentTarget.value);\n combobox.resetSelectedOption();\n combobox.openDropdown();\n }}\n onClick={() => combobox.openDropdown()}\n onFocus={() => {\n combobox.openDropdown();\n if (data === null) {\n fetchOptions(value);\n }\n }}\n onBlur={() => combobox.closeDropdown()}\n rightSection={loading && }\n />\n \n\n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/AutocompleteClearable/AutocompleteClearable.tsx b/docs/src/combobox-examples/examples/AutocompleteClearable/AutocompleteClearable.tsx index 9b09f035bc0..0f0775a2f3c 100644 --- a/docs/src/combobox-examples/examples/AutocompleteClearable/AutocompleteClearable.tsx +++ b/docs/src/combobox-examples/examples/AutocompleteClearable/AutocompleteClearable.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Combobox, TextInput, CloseButton, useCombobox } from '@mantine/core'; +import { CloseButton, Combobox, TextInput, useCombobox } from '@mantine/core'; const groceries = [ '🍎 Apples', diff --git a/docs/src/combobox-examples/examples/AutocompleteClearable/code.json b/docs/src/combobox-examples/examples/AutocompleteClearable/code.json index d728d236588..5d060b0b607 100644 --- a/docs/src/combobox-examples/examples/AutocompleteClearable/code.json +++ b/docs/src/combobox-examples/examples/AutocompleteClearable/code.json @@ -2,6 +2,6 @@ { "fileName": "AutocompleteClearable.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { Combobox, TextInput, CloseButton, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function AutocompleteClearable() {\n const combobox = useCombobox();\n const [value, setValue] = useState('');\n const shouldFilterOptions = !groceries.some((item) => item === value);\n const filteredOptions = shouldFilterOptions\n ? groceries.filter((item) => item.toLowerCase().includes(value.toLowerCase().trim()))\n : groceries;\n\n const options = filteredOptions.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(optionValue);\n combobox.closeDropdown();\n }}\n store={combobox}\n withinPortal={false}\n >\n \n {\n setValue(event.currentTarget.value);\n combobox.openDropdown();\n combobox.updateSelectedOptionIndex();\n }}\n onClick={() => combobox.openDropdown()}\n onFocus={() => combobox.openDropdown()}\n onBlur={() => combobox.closeDropdown()}\n rightSection={\n value !== '' && (\n event.preventDefault()}\n onClick={() => setValue('')}\n aria-label=\"Clear value\"\n />\n )\n }\n />\n \n\n \n \n {options.length === 0 ? Nothing found : options}\n \n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { CloseButton, Combobox, TextInput, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function AutocompleteClearable() {\n const combobox = useCombobox();\n const [value, setValue] = useState('');\n const shouldFilterOptions = !groceries.some((item) => item === value);\n const filteredOptions = shouldFilterOptions\n ? groceries.filter((item) => item.toLowerCase().includes(value.toLowerCase().trim()))\n : groceries;\n\n const options = filteredOptions.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(optionValue);\n combobox.closeDropdown();\n }}\n store={combobox}\n withinPortal={false}\n >\n \n {\n setValue(event.currentTarget.value);\n combobox.openDropdown();\n combobox.updateSelectedOptionIndex();\n }}\n onClick={() => combobox.openDropdown()}\n onFocus={() => combobox.openDropdown()}\n onBlur={() => combobox.closeDropdown()}\n rightSection={\n value !== '' && (\n event.preventDefault()}\n onClick={() => setValue('')}\n aria-label=\"Clear value\"\n />\n )\n }\n />\n \n\n \n \n {options.length === 0 ? Nothing found : options}\n \n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/AutocompleteSelectFirstOption/AutocompleteSelectFirstOption.tsx b/docs/src/combobox-examples/examples/AutocompleteSelectFirstOption/AutocompleteSelectFirstOption.tsx index 00cfc44ef1d..ba9ce87c4b5 100644 --- a/docs/src/combobox-examples/examples/AutocompleteSelectFirstOption/AutocompleteSelectFirstOption.tsx +++ b/docs/src/combobox-examples/examples/AutocompleteSelectFirstOption/AutocompleteSelectFirstOption.tsx @@ -1,4 +1,4 @@ -import React, { useState, useEffect } from 'react'; +import React, { useEffect, useState } from 'react'; import { Combobox, TextInput, useCombobox } from '@mantine/core'; const groceries = [ diff --git a/docs/src/combobox-examples/examples/AutocompleteSelectFirstOption/code.json b/docs/src/combobox-examples/examples/AutocompleteSelectFirstOption/code.json index 906f037afd3..db24ddfe3a7 100644 --- a/docs/src/combobox-examples/examples/AutocompleteSelectFirstOption/code.json +++ b/docs/src/combobox-examples/examples/AutocompleteSelectFirstOption/code.json @@ -2,6 +2,6 @@ { "fileName": "AutocompleteSelectFirstOption.tsx", "language": "tsx", - "code": "import { useState, useEffect } from 'react';\nimport { Combobox, TextInput, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function AutocompleteSelectFirstOption() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState('');\n const shouldFilterOptions = !groceries.some((item) => item === value);\n const filteredOptions = shouldFilterOptions\n ? groceries.filter((item) => item.toLowerCase().includes(value.toLowerCase().trim()))\n : groceries;\n\n const options = filteredOptions.map((item) => (\n \n {item}\n \n ));\n\n useEffect(() => {\n // we need to wait for options to render before we can select first one\n combobox.selectFirstOption();\n }, [value]);\n\n return (\n {\n setValue(optionValue);\n combobox.closeDropdown();\n }}\n store={combobox}\n withinPortal={false}\n >\n \n {\n setValue(event.currentTarget.value);\n combobox.openDropdown();\n }}\n onClick={() => combobox.openDropdown()}\n onFocus={() => combobox.openDropdown()}\n onBlur={() => combobox.closeDropdown()}\n />\n \n\n \n \n {options.length === 0 ? Nothing found : options}\n \n \n \n );\n}\n" + "code": "import { useEffect, useState } from 'react';\nimport { Combobox, TextInput, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function AutocompleteSelectFirstOption() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState('');\n const shouldFilterOptions = !groceries.some((item) => item === value);\n const filteredOptions = shouldFilterOptions\n ? groceries.filter((item) => item.toLowerCase().includes(value.toLowerCase().trim()))\n : groceries;\n\n const options = filteredOptions.map((item) => (\n \n {item}\n \n ));\n\n useEffect(() => {\n // we need to wait for options to render before we can select first one\n combobox.selectFirstOption();\n }, [value]);\n\n return (\n {\n setValue(optionValue);\n combobox.closeDropdown();\n }}\n store={combobox}\n withinPortal={false}\n >\n \n {\n setValue(event.currentTarget.value);\n combobox.openDropdown();\n }}\n onClick={() => combobox.openDropdown()}\n onFocus={() => combobox.openDropdown()}\n onBlur={() => combobox.closeDropdown()}\n />\n \n\n \n \n {options.length === 0 ? Nothing found : options}\n \n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/BasicButton/BasicButton.tsx b/docs/src/combobox-examples/examples/BasicButton/BasicButton.tsx index a284639c0e9..c0ca08ca9d6 100644 --- a/docs/src/combobox-examples/examples/BasicButton/BasicButton.tsx +++ b/docs/src/combobox-examples/examples/BasicButton/BasicButton.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { useCombobox, Combobox, Text, Button, Box } from '@mantine/core'; +import { Box, Button, Combobox, Text, useCombobox } from '@mantine/core'; const groceries = [ '🍎 Apples', diff --git a/docs/src/combobox-examples/examples/BasicButton/code.json b/docs/src/combobox-examples/examples/BasicButton/code.json index 21850186e97..f1a70ca5868 100644 --- a/docs/src/combobox-examples/examples/BasicButton/code.json +++ b/docs/src/combobox-examples/examples/BasicButton/code.json @@ -2,6 +2,6 @@ { "fileName": "BasicButton.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { useCombobox, Combobox, Text, Button, Box } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function BasicButton() {\n const [selectedItem, setSelectedItem] = useState(null);\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const options = groceries.map((item) => (\n \n {item}\n \n ));\n\n return (\n <>\n {\n setSelectedItem(val);\n combobox.closeDropdown();\n }}\n >\n \n \n \n\n \n {options}\n \n \n\n \n \n Selected item:{' '}\n \n\n \n {selectedItem || 'Nothing selected'}\n \n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Box, Button, Combobox, Text, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function BasicButton() {\n const [selectedItem, setSelectedItem] = useState(null);\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const options = groceries.map((item) => (\n \n {item}\n \n ));\n\n return (\n <>\n {\n setSelectedItem(val);\n combobox.closeDropdown();\n }}\n >\n \n \n \n\n \n {options}\n \n \n\n \n \n Selected item:{' '}\n \n\n \n {selectedItem || 'Nothing selected'}\n \n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/BasicMultiSelect/BasicMultiSelect.tsx b/docs/src/combobox-examples/examples/BasicMultiSelect/BasicMultiSelect.tsx index 8b4fc8c25d1..f4c3f5b58e3 100644 --- a/docs/src/combobox-examples/examples/BasicMultiSelect/BasicMultiSelect.tsx +++ b/docs/src/combobox-examples/examples/BasicMultiSelect/BasicMultiSelect.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { PillsInput, Pill, Input, Combobox, CheckIcon, Group, useCombobox } from '@mantine/core'; +import { CheckIcon, Combobox, Group, Input, Pill, PillsInput, useCombobox } from '@mantine/core'; const groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate']; diff --git a/docs/src/combobox-examples/examples/BasicMultiSelect/code.json b/docs/src/combobox-examples/examples/BasicMultiSelect/code.json index 38a1f184e92..599ae7180c2 100644 --- a/docs/src/combobox-examples/examples/BasicMultiSelect/code.json +++ b/docs/src/combobox-examples/examples/BasicMultiSelect/code.json @@ -2,6 +2,6 @@ { "fileName": "BasicMultiSelect.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { PillsInput, Pill, Input, Combobox, CheckIcon, Group, useCombobox } from '@mantine/core';\n\nconst groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate'];\n\nexport function BasicMultiSelect() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n });\n\n const [value, setValue] = useState([]);\n\n const handleValueSelect = (val: string) =>\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n\n const handleValueRemove = (val: string) =>\n setValue((current) => current.filter((v) => v !== val));\n\n const values = value.map((item) => (\n handleValueRemove(item)}>\n {item}\n \n ));\n\n const options = groceries.map((item) => (\n \n \n {value.includes(item) ? : null}\n {item}\n \n \n ));\n\n return (\n \n \n combobox.toggleDropdown()}>\n \n {values.length > 0 ? (\n values\n ) : (\n Pick one or more values\n )}\n\n \n combobox.closeDropdown()}\n onKeyDown={(event) => {\n if (event.key === 'Backspace') {\n event.preventDefault();\n handleValueRemove(value[value.length - 1]);\n }\n }}\n />\n \n \n \n \n\n \n {options}\n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { CheckIcon, Combobox, Group, Input, Pill, PillsInput, useCombobox } from '@mantine/core';\n\nconst groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate'];\n\nexport function BasicMultiSelect() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n });\n\n const [value, setValue] = useState([]);\n\n const handleValueSelect = (val: string) =>\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n\n const handleValueRemove = (val: string) =>\n setValue((current) => current.filter((v) => v !== val));\n\n const values = value.map((item) => (\n handleValueRemove(item)}>\n {item}\n \n ));\n\n const options = groceries.map((item) => (\n \n \n {value.includes(item) ? : null}\n {item}\n \n \n ));\n\n return (\n \n \n combobox.toggleDropdown()}>\n \n {values.length > 0 ? (\n values\n ) : (\n Pick one or more values\n )}\n\n \n combobox.closeDropdown()}\n onKeyDown={(event) => {\n if (event.key === 'Backspace') {\n event.preventDefault();\n handleValueRemove(value[value.length - 1]);\n }\n }}\n />\n \n \n \n \n\n \n {options}\n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/BasicSelect/BasicSelect.tsx b/docs/src/combobox-examples/examples/BasicSelect/BasicSelect.tsx index 73e12911bd9..cb74cce8dfd 100644 --- a/docs/src/combobox-examples/examples/BasicSelect/BasicSelect.tsx +++ b/docs/src/combobox-examples/examples/BasicSelect/BasicSelect.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Combobox, InputBase, Input, useCombobox } from '@mantine/core'; +import { Combobox, Input, InputBase, useCombobox } from '@mantine/core'; const groceries = [ '🍎 Apples', diff --git a/docs/src/combobox-examples/examples/BasicSelect/code.json b/docs/src/combobox-examples/examples/BasicSelect/code.json index df11221406f..999cfbb84e8 100644 --- a/docs/src/combobox-examples/examples/BasicSelect/code.json +++ b/docs/src/combobox-examples/examples/BasicSelect/code.json @@ -2,6 +2,6 @@ { "fileName": "BasicSelect.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { Combobox, InputBase, Input, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function BasicSelect() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n\n const options = groceries.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n \n {options}\n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Combobox, Input, InputBase, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function BasicSelect() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n\n const options = groceries.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n \n {options}\n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/ButtonMultiSelect/ButtonMultiSelect.tsx b/docs/src/combobox-examples/examples/ButtonMultiSelect/ButtonMultiSelect.tsx index 87b5e6127d8..32fcb3340d5 100644 --- a/docs/src/combobox-examples/examples/ButtonMultiSelect/ButtonMultiSelect.tsx +++ b/docs/src/combobox-examples/examples/ButtonMultiSelect/ButtonMultiSelect.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { useCombobox, Combobox, Text, Button, Box, Group, CheckIcon } from '@mantine/core'; +import { Box, Button, CheckIcon, Combobox, Group, Text, useCombobox } from '@mantine/core'; const groceries = [ '🍎 Apples', diff --git a/docs/src/combobox-examples/examples/ButtonMultiSelect/code.json b/docs/src/combobox-examples/examples/ButtonMultiSelect/code.json index f2d1292c2d0..1390d42aa6e 100644 --- a/docs/src/combobox-examples/examples/ButtonMultiSelect/code.json +++ b/docs/src/combobox-examples/examples/ButtonMultiSelect/code.json @@ -2,6 +2,6 @@ { "fileName": "ButtonMultiSelect.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { useCombobox, Combobox, Text, Button, Box, Group, CheckIcon } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function ButtonMultiSelect() {\n const [selectedItems, setSelectedItems] = useState([]);\n\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const options = groceries.map((item) => (\n \n \n {selectedItems.includes(item) && }\n {item}\n \n \n ));\n\n return (\n <>\n \n \n Selected item:{' '}\n \n\n \n {selectedItems.length > 0 ? selectedItems.join(', ') : 'Nothing selected'}\n \n \n\n {\n setSelectedItems((current) =>\n current.includes(val) ? current.filter((item) => item !== val) : [...current, val]\n );\n }}\n >\n \n \n \n\n \n {options}\n \n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Box, Button, CheckIcon, Combobox, Group, Text, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function ButtonMultiSelect() {\n const [selectedItems, setSelectedItems] = useState([]);\n\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const options = groceries.map((item) => (\n \n \n {selectedItems.includes(item) && }\n {item}\n \n \n ));\n\n return (\n <>\n \n \n Selected item:{' '}\n \n\n \n {selectedItems.length > 0 ? selectedItems.join(', ') : 'Nothing selected'}\n \n \n\n {\n setSelectedItems((current) =>\n current.includes(val) ? current.filter((item) => item !== val) : [...current, val]\n );\n }}\n >\n \n \n \n\n \n {options}\n \n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/ButtonSearch/ButtonSearch.tsx b/docs/src/combobox-examples/examples/ButtonSearch/ButtonSearch.tsx index 86070628303..741541de09a 100644 --- a/docs/src/combobox-examples/examples/ButtonSearch/ButtonSearch.tsx +++ b/docs/src/combobox-examples/examples/ButtonSearch/ButtonSearch.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { useCombobox, Combobox, Text, Button, Box } from '@mantine/core'; +import { Box, Button, Combobox, Text, useCombobox } from '@mantine/core'; const groceries = [ '🍎 Apples', diff --git a/docs/src/combobox-examples/examples/ButtonSearch/code.json b/docs/src/combobox-examples/examples/ButtonSearch/code.json index ff16981c089..e821a802a5e 100644 --- a/docs/src/combobox-examples/examples/ButtonSearch/code.json +++ b/docs/src/combobox-examples/examples/ButtonSearch/code.json @@ -2,6 +2,6 @@ { "fileName": "ButtonSearch.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { useCombobox, Combobox, Text, Button, Box } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function ButtonSearch() {\n const [search, setSearch] = useState('');\n const [selectedItem, setSelectedItem] = useState(null);\n const combobox = useCombobox({\n onDropdownClose: () => {\n combobox.resetSelectedOption();\n combobox.focusTarget();\n setSearch('');\n },\n\n onDropdownOpen: () => {\n combobox.focusSearchInput();\n },\n });\n\n const options = groceries\n .filter((item) => item.toLowerCase().includes(search.toLowerCase().trim()))\n .map((item) => (\n \n {item}\n \n ));\n\n return (\n <>\n {\n setSelectedItem(val);\n combobox.closeDropdown();\n }}\n >\n \n \n \n\n \n setSearch(event.currentTarget.value)}\n placeholder=\"Search groceries\"\n />\n \n {options.length > 0 ? options : Nothing found}\n \n \n \n\n \n \n Selected item:{' '}\n \n\n \n {selectedItem || 'Nothing selected'}\n \n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Box, Button, Combobox, Text, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function ButtonSearch() {\n const [search, setSearch] = useState('');\n const [selectedItem, setSelectedItem] = useState(null);\n const combobox = useCombobox({\n onDropdownClose: () => {\n combobox.resetSelectedOption();\n combobox.focusTarget();\n setSearch('');\n },\n\n onDropdownOpen: () => {\n combobox.focusSearchInput();\n },\n });\n\n const options = groceries\n .filter((item) => item.toLowerCase().includes(search.toLowerCase().trim()))\n .map((item) => (\n \n {item}\n \n ));\n\n return (\n <>\n {\n setSelectedItem(val);\n combobox.closeDropdown();\n }}\n >\n \n \n \n\n \n setSearch(event.currentTarget.value)}\n placeholder=\"Search groceries\"\n />\n \n {options.length > 0 ? options : Nothing found}\n \n \n \n\n \n \n Selected item:{' '}\n \n\n \n {selectedItem || 'Nothing selected'}\n \n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/DropdownAnimation/DropdownAnimation.tsx b/docs/src/combobox-examples/examples/DropdownAnimation/DropdownAnimation.tsx index f4fd757b923..4473d00c5bc 100644 --- a/docs/src/combobox-examples/examples/DropdownAnimation/DropdownAnimation.tsx +++ b/docs/src/combobox-examples/examples/DropdownAnimation/DropdownAnimation.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Combobox, InputBase, Input, useCombobox } from '@mantine/core'; +import { Combobox, Input, InputBase, useCombobox } from '@mantine/core'; const groceries = [ '🍎 Apples', diff --git a/docs/src/combobox-examples/examples/DropdownAnimation/code.json b/docs/src/combobox-examples/examples/DropdownAnimation/code.json index 8d5d73601c2..78657dfb570 100644 --- a/docs/src/combobox-examples/examples/DropdownAnimation/code.json +++ b/docs/src/combobox-examples/examples/DropdownAnimation/code.json @@ -2,6 +2,6 @@ { "fileName": "DropdownAnimation.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { Combobox, InputBase, Input, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function DropdownAnimation() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n\n const options = groceries.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n \n {options}\n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Combobox, Input, InputBase, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function DropdownAnimation() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n\n const options = groceries.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n \n {options}\n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/DropdownFooter/DropdownFooter.tsx b/docs/src/combobox-examples/examples/DropdownFooter/DropdownFooter.tsx index 6bbdb284563..90fa079b6fd 100644 --- a/docs/src/combobox-examples/examples/DropdownFooter/DropdownFooter.tsx +++ b/docs/src/combobox-examples/examples/DropdownFooter/DropdownFooter.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Combobox, TextInput, ScrollArea, Anchor, useCombobox, Text } from '@mantine/core'; +import { Anchor, Combobox, ScrollArea, Text, TextInput, useCombobox } from '@mantine/core'; const groceries = [ '🍎 Apples', diff --git a/docs/src/combobox-examples/examples/DropdownFooter/code.json b/docs/src/combobox-examples/examples/DropdownFooter/code.json index 2a70035ca40..5311dece16e 100644 --- a/docs/src/combobox-examples/examples/DropdownFooter/code.json +++ b/docs/src/combobox-examples/examples/DropdownFooter/code.json @@ -2,6 +2,6 @@ { "fileName": "DropdownFooter.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { Combobox, TextInput, ScrollArea, Anchor, useCombobox, Text } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n '🍋 Lemon',\n '🥬 Lettuce',\n '🍄 Mushrooms',\n '🍊 Oranges',\n '🥔 Potatoes',\n '🍅 Tomatoes',\n '🥚 Eggs',\n '🥛 Milk',\n '🍞 Bread',\n '🍗 Chicken',\n '🍔 Hamburger',\n '🧀 Cheese',\n '🥩 Steak',\n '🍟 French Fries',\n '🍕 Pizza',\n '🥦 Cauliflower',\n '🥜 Peanuts',\n '🍦 Ice Cream',\n '🍯 Honey',\n '🥖 Baguette',\n '🍣 Sushi',\n '🥝 Kiwi',\n '🍓 Strawberries',\n];\n\nexport function DropdownFooter() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState('');\n const shouldFilterOptions = !groceries.some((item) => item === value);\n const filteredOptions = shouldFilterOptions\n ? groceries.filter((item) => item.toLowerCase().includes(value.toLowerCase().trim()))\n : groceries;\n\n const options = filteredOptions.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(optionValue);\n combobox.closeDropdown();\n }}\n store={combobox}\n withinPortal={false}\n >\n \n {\n setValue(event.currentTarget.value);\n combobox.openDropdown();\n combobox.updateSelectedOptionIndex();\n }}\n onClick={() => combobox.openDropdown()}\n onFocus={() => combobox.openDropdown()}\n onBlur={() => combobox.closeDropdown()}\n />\n \n\n \n \n \n {options.length === 0 ? Nothing found : options}\n \n \n \n \n Search powered by{' '}\n \n Mantine\n \n \n \n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Anchor, Combobox, ScrollArea, Text, TextInput, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n '🍋 Lemon',\n '🥬 Lettuce',\n '🍄 Mushrooms',\n '🍊 Oranges',\n '🥔 Potatoes',\n '🍅 Tomatoes',\n '🥚 Eggs',\n '🥛 Milk',\n '🍞 Bread',\n '🍗 Chicken',\n '🍔 Hamburger',\n '🧀 Cheese',\n '🥩 Steak',\n '🍟 French Fries',\n '🍕 Pizza',\n '🥦 Cauliflower',\n '🥜 Peanuts',\n '🍦 Ice Cream',\n '🍯 Honey',\n '🥖 Baguette',\n '🍣 Sushi',\n '🥝 Kiwi',\n '🍓 Strawberries',\n];\n\nexport function DropdownFooter() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState('');\n const shouldFilterOptions = !groceries.some((item) => item === value);\n const filteredOptions = shouldFilterOptions\n ? groceries.filter((item) => item.toLowerCase().includes(value.toLowerCase().trim()))\n : groceries;\n\n const options = filteredOptions.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(optionValue);\n combobox.closeDropdown();\n }}\n store={combobox}\n withinPortal={false}\n >\n \n {\n setValue(event.currentTarget.value);\n combobox.openDropdown();\n combobox.updateSelectedOptionIndex();\n }}\n onClick={() => combobox.openDropdown()}\n onFocus={() => combobox.openDropdown()}\n onBlur={() => combobox.closeDropdown()}\n />\n \n\n \n \n \n {options.length === 0 ? Nothing found : options}\n \n \n \n \n Search powered by{' '}\n \n Mantine\n \n \n \n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/DropdownHeader/DropdownHeader.tsx b/docs/src/combobox-examples/examples/DropdownHeader/DropdownHeader.tsx index 6577da8561d..b00b9571656 100644 --- a/docs/src/combobox-examples/examples/DropdownHeader/DropdownHeader.tsx +++ b/docs/src/combobox-examples/examples/DropdownHeader/DropdownHeader.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Combobox, TextInput, ScrollArea, useCombobox, Text } from '@mantine/core'; +import { Combobox, ScrollArea, Text, TextInput, useCombobox } from '@mantine/core'; const groceries = [ '🍎 Apples', diff --git a/docs/src/combobox-examples/examples/DropdownHeader/code.json b/docs/src/combobox-examples/examples/DropdownHeader/code.json index 1ac77b97329..40df247400c 100644 --- a/docs/src/combobox-examples/examples/DropdownHeader/code.json +++ b/docs/src/combobox-examples/examples/DropdownHeader/code.json @@ -2,6 +2,6 @@ { "fileName": "DropdownHeader.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { Combobox, TextInput, ScrollArea, useCombobox, Text } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n '🍋 Lemon',\n '🥬 Lettuce',\n '🍄 Mushrooms',\n '🍊 Oranges',\n '🥔 Potatoes',\n '🍅 Tomatoes',\n '🥚 Eggs',\n '🥛 Milk',\n '🍞 Bread',\n '🍗 Chicken',\n '🍔 Hamburger',\n '🧀 Cheese',\n '🥩 Steak',\n '🍟 French Fries',\n '🍕 Pizza',\n '🥦 Cauliflower',\n '🥜 Peanuts',\n '🍦 Ice Cream',\n '🍯 Honey',\n '🥖 Baguette',\n '🍣 Sushi',\n '🥝 Kiwi',\n '🍓 Strawberries',\n];\n\nexport function DropdownHeader() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState('');\n const shouldFilterOptions = !groceries.some((item) => item === value);\n const filteredOptions = shouldFilterOptions\n ? groceries.filter((item) => item.toLowerCase().includes(value.toLowerCase().trim()))\n : groceries;\n\n const options = filteredOptions.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(optionValue);\n combobox.closeDropdown();\n }}\n store={combobox}\n withinPortal={false}\n >\n \n {\n setValue(event.currentTarget.value);\n combobox.openDropdown();\n combobox.updateSelectedOptionIndex();\n }}\n onClick={() => combobox.openDropdown()}\n onFocus={() => combobox.openDropdown()}\n onBlur={() => combobox.closeDropdown()}\n />\n \n\n \n \n \n Note: Carrots are not currently available\n \n \n {options.length === 0 ? Nothing found : options}\n \n \n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Combobox, ScrollArea, Text, TextInput, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n '🍋 Lemon',\n '🥬 Lettuce',\n '🍄 Mushrooms',\n '🍊 Oranges',\n '🥔 Potatoes',\n '🍅 Tomatoes',\n '🥚 Eggs',\n '🥛 Milk',\n '🍞 Bread',\n '🍗 Chicken',\n '🍔 Hamburger',\n '🧀 Cheese',\n '🥩 Steak',\n '🍟 French Fries',\n '🍕 Pizza',\n '🥦 Cauliflower',\n '🥜 Peanuts',\n '🍦 Ice Cream',\n '🍯 Honey',\n '🥖 Baguette',\n '🍣 Sushi',\n '🥝 Kiwi',\n '🍓 Strawberries',\n];\n\nexport function DropdownHeader() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState('');\n const shouldFilterOptions = !groceries.some((item) => item === value);\n const filteredOptions = shouldFilterOptions\n ? groceries.filter((item) => item.toLowerCase().includes(value.toLowerCase().trim()))\n : groceries;\n\n const options = filteredOptions.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(optionValue);\n combobox.closeDropdown();\n }}\n store={combobox}\n withinPortal={false}\n >\n \n {\n setValue(event.currentTarget.value);\n combobox.openDropdown();\n combobox.updateSelectedOptionIndex();\n }}\n onClick={() => combobox.openDropdown()}\n onFocus={() => combobox.openDropdown()}\n onBlur={() => combobox.closeDropdown()}\n />\n \n\n \n \n \n Note: Carrots are not currently available\n \n \n {options.length === 0 ? Nothing found : options}\n \n \n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/DropdownOptionsAnimation/DropdownOptionsAnimation.tsx b/docs/src/combobox-examples/examples/DropdownOptionsAnimation/DropdownOptionsAnimation.tsx index 862c9e2cee2..6b99cb1dfd5 100644 --- a/docs/src/combobox-examples/examples/DropdownOptionsAnimation/DropdownOptionsAnimation.tsx +++ b/docs/src/combobox-examples/examples/DropdownOptionsAnimation/DropdownOptionsAnimation.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; import cx from 'clsx'; -import { Combobox, InputBase, Input, useCombobox } from '@mantine/core'; +import { Combobox, Input, InputBase, useCombobox } from '@mantine/core'; import classes from './DropdownOptionsAnimation.module.css'; const groceries = [ diff --git a/docs/src/combobox-examples/examples/DropdownOptionsAnimation/code.json b/docs/src/combobox-examples/examples/DropdownOptionsAnimation/code.json index 1b94a1af720..b15739a0c40 100644 --- a/docs/src/combobox-examples/examples/DropdownOptionsAnimation/code.json +++ b/docs/src/combobox-examples/examples/DropdownOptionsAnimation/code.json @@ -2,7 +2,7 @@ { "fileName": "DropdownOptionsAnimation.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport cx from 'clsx';\nimport { Combobox, InputBase, Input, useCombobox } from '@mantine/core';\nimport classes from './DropdownOptionsAnimation.module.css';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function DropdownOptionsAnimation() {\n const [animating, setAnimating] = useState(false);\n\n const combobox = useCombobox({\n onDropdownClose: () => {\n combobox.resetSelectedOption();\n setAnimating(false);\n },\n\n onDropdownOpen: () => setAnimating(true),\n });\n\n const [value, setValue] = useState(null);\n\n const options = groceries.map((item, index) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n \n {options}\n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport cx from 'clsx';\nimport { Combobox, Input, InputBase, useCombobox } from '@mantine/core';\nimport classes from './DropdownOptionsAnimation.module.css';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function DropdownOptionsAnimation() {\n const [animating, setAnimating] = useState(false);\n\n const combobox = useCombobox({\n onDropdownClose: () => {\n combobox.resetSelectedOption();\n setAnimating(false);\n },\n\n onDropdownOpen: () => setAnimating(true),\n });\n\n const [value, setValue] = useState(null);\n\n const options = groceries.map((item, index) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n \n {options}\n \n \n );\n}\n" }, { "fileName": "DropdownOptionsAnimation.module.css", diff --git a/docs/src/combobox-examples/examples/DropdownPositionStyles/DropdownPositionStyles.tsx b/docs/src/combobox-examples/examples/DropdownPositionStyles/DropdownPositionStyles.tsx index f87ae4b77b7..696e7508060 100644 --- a/docs/src/combobox-examples/examples/DropdownPositionStyles/DropdownPositionStyles.tsx +++ b/docs/src/combobox-examples/examples/DropdownPositionStyles/DropdownPositionStyles.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Combobox, InputBase, Input, useCombobox } from '@mantine/core'; +import { Combobox, Input, InputBase, useCombobox } from '@mantine/core'; import classes from './DropdownPositionStyles.module.css'; const groceries = [ diff --git a/docs/src/combobox-examples/examples/DropdownPositionStyles/code.json b/docs/src/combobox-examples/examples/DropdownPositionStyles/code.json index b2b5fba953c..898ab0b26d6 100644 --- a/docs/src/combobox-examples/examples/DropdownPositionStyles/code.json +++ b/docs/src/combobox-examples/examples/DropdownPositionStyles/code.json @@ -2,7 +2,7 @@ { "fileName": "DropdownPositionStyles.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { Combobox, InputBase, Input, useCombobox } from '@mantine/core';\nimport classes from './DropdownPositionStyles.module.css';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function DropdownPositionStyles() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n\n const options = groceries.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n classNames={{ input: classes.input }}\n >\n {value || Pick value}\n \n \n\n \n {options}\n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Combobox, Input, InputBase, useCombobox } from '@mantine/core';\nimport classes from './DropdownPositionStyles.module.css';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function DropdownPositionStyles() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n\n const options = groceries.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n classNames={{ input: classes.input }}\n >\n {value || Pick value}\n \n \n\n \n {options}\n \n \n );\n}\n" }, { "fileName": "DropdownPositionStyles.module.css", diff --git a/docs/src/combobox-examples/examples/DropdownScrollArea/DropdownScrollArea.tsx b/docs/src/combobox-examples/examples/DropdownScrollArea/DropdownScrollArea.tsx index a2d06c6a93b..7f5af6cc681 100644 --- a/docs/src/combobox-examples/examples/DropdownScrollArea/DropdownScrollArea.tsx +++ b/docs/src/combobox-examples/examples/DropdownScrollArea/DropdownScrollArea.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Combobox, TextInput, ScrollArea, useCombobox } from '@mantine/core'; +import { Combobox, ScrollArea, TextInput, useCombobox } from '@mantine/core'; const groceries = [ '🍎 Apples', diff --git a/docs/src/combobox-examples/examples/DropdownScrollArea/code.json b/docs/src/combobox-examples/examples/DropdownScrollArea/code.json index c15f7343ca5..28b3ecf75eb 100644 --- a/docs/src/combobox-examples/examples/DropdownScrollArea/code.json +++ b/docs/src/combobox-examples/examples/DropdownScrollArea/code.json @@ -2,6 +2,6 @@ { "fileName": "DropdownScrollArea.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { Combobox, TextInput, ScrollArea, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n '🍋 Lemon',\n '🥬 Lettuce',\n '🍄 Mushrooms',\n '🍊 Oranges',\n '🥔 Potatoes',\n '🍅 Tomatoes',\n '🥚 Eggs',\n '🥛 Milk',\n '🍞 Bread',\n '🍗 Chicken',\n '🍔 Hamburger',\n '🧀 Cheese',\n '🥩 Steak',\n '🍟 French Fries',\n '🍕 Pizza',\n '🥦 Cauliflower',\n '🥜 Peanuts',\n '🍦 Ice Cream',\n '🍯 Honey',\n '🥖 Baguette',\n '🍣 Sushi',\n '🥝 Kiwi',\n '🍓 Strawberries',\n];\n\nexport function DropdownScrollArea() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState('');\n const shouldFilterOptions = !groceries.some((item) => item === value);\n const filteredOptions = shouldFilterOptions\n ? groceries.filter((item) => item.toLowerCase().includes(value.toLowerCase().trim()))\n : groceries;\n\n const options = filteredOptions.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(optionValue);\n combobox.closeDropdown();\n }}\n store={combobox}\n withinPortal={false}\n >\n \n {\n setValue(event.currentTarget.value);\n combobox.openDropdown();\n combobox.updateSelectedOptionIndex();\n }}\n onClick={() => combobox.openDropdown()}\n onFocus={() => combobox.openDropdown()}\n onBlur={() => combobox.closeDropdown()}\n />\n \n\n \n \n \n {options.length === 0 ? Nothing found : options}\n \n \n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Combobox, ScrollArea, TextInput, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n '🍋 Lemon',\n '🥬 Lettuce',\n '🍄 Mushrooms',\n '🍊 Oranges',\n '🥔 Potatoes',\n '🍅 Tomatoes',\n '🥚 Eggs',\n '🥛 Milk',\n '🍞 Bread',\n '🍗 Chicken',\n '🍔 Hamburger',\n '🧀 Cheese',\n '🥩 Steak',\n '🍟 French Fries',\n '🍕 Pizza',\n '🥦 Cauliflower',\n '🥜 Peanuts',\n '🍦 Ice Cream',\n '🍯 Honey',\n '🥖 Baguette',\n '🍣 Sushi',\n '🥝 Kiwi',\n '🍓 Strawberries',\n];\n\nexport function DropdownScrollArea() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState('');\n const shouldFilterOptions = !groceries.some((item) => item === value);\n const filteredOptions = shouldFilterOptions\n ? groceries.filter((item) => item.toLowerCase().includes(value.toLowerCase().trim()))\n : groceries;\n\n const options = filteredOptions.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(optionValue);\n combobox.closeDropdown();\n }}\n store={combobox}\n withinPortal={false}\n >\n \n {\n setValue(event.currentTarget.value);\n combobox.openDropdown();\n combobox.updateSelectedOptionIndex();\n }}\n onClick={() => combobox.openDropdown()}\n onFocus={() => combobox.openDropdown()}\n onBlur={() => combobox.closeDropdown()}\n />\n \n\n \n \n \n {options.length === 0 ? Nothing found : options}\n \n \n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/DropdownSmoothScroll/DropdownSmoothScroll.tsx b/docs/src/combobox-examples/examples/DropdownSmoothScroll/DropdownSmoothScroll.tsx index d6489c86c14..2c38ac83093 100644 --- a/docs/src/combobox-examples/examples/DropdownSmoothScroll/DropdownSmoothScroll.tsx +++ b/docs/src/combobox-examples/examples/DropdownSmoothScroll/DropdownSmoothScroll.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Combobox, TextInput, ScrollArea, useCombobox } from '@mantine/core'; +import { Combobox, ScrollArea, TextInput, useCombobox } from '@mantine/core'; const groceries = [ '🍎 Apples', diff --git a/docs/src/combobox-examples/examples/DropdownSmoothScroll/code.json b/docs/src/combobox-examples/examples/DropdownSmoothScroll/code.json index e368a947244..756a08be479 100644 --- a/docs/src/combobox-examples/examples/DropdownSmoothScroll/code.json +++ b/docs/src/combobox-examples/examples/DropdownSmoothScroll/code.json @@ -2,6 +2,6 @@ { "fileName": "DropdownSmoothScroll.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { Combobox, TextInput, ScrollArea, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n '🍋 Lemon',\n '🥬 Lettuce',\n '🍄 Mushrooms',\n '🍊 Oranges',\n '🥔 Potatoes',\n '🍅 Tomatoes',\n '🥚 Eggs',\n '🥛 Milk',\n '🍞 Bread',\n '🍗 Chicken',\n '🍔 Hamburger',\n '🧀 Cheese',\n '🥩 Steak',\n '🍟 French Fries',\n '🍕 Pizza',\n '🥦 Cauliflower',\n '🥜 Peanuts',\n '🍦 Ice Cream',\n '🍯 Honey',\n '🥖 Baguette',\n '🍣 Sushi',\n '🥝 Kiwi',\n '🍓 Strawberries',\n];\n\nexport function DropdownSmoothScroll() {\n const combobox = useCombobox({\n scrollBehavior: 'smooth',\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState('');\n const shouldFilterOptions = !groceries.some((item) => item === value);\n const filteredOptions = shouldFilterOptions\n ? groceries.filter((item) => item.toLowerCase().includes(value.toLowerCase().trim()))\n : groceries;\n\n const options = filteredOptions.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(optionValue);\n combobox.closeDropdown();\n }}\n store={combobox}\n withinPortal={false}\n >\n \n {\n setValue(event.currentTarget.value);\n combobox.openDropdown();\n combobox.updateSelectedOptionIndex();\n }}\n onClick={() => combobox.openDropdown()}\n onFocus={() => combobox.openDropdown()}\n onBlur={() => combobox.closeDropdown()}\n />\n \n\n \n \n \n {options.length === 0 ? Nothing found : options}\n \n \n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Combobox, ScrollArea, TextInput, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n '🍋 Lemon',\n '🥬 Lettuce',\n '🍄 Mushrooms',\n '🍊 Oranges',\n '🥔 Potatoes',\n '🍅 Tomatoes',\n '🥚 Eggs',\n '🥛 Milk',\n '🍞 Bread',\n '🍗 Chicken',\n '🍔 Hamburger',\n '🧀 Cheese',\n '🥩 Steak',\n '🍟 French Fries',\n '🍕 Pizza',\n '🥦 Cauliflower',\n '🥜 Peanuts',\n '🍦 Ice Cream',\n '🍯 Honey',\n '🥖 Baguette',\n '🍣 Sushi',\n '🥝 Kiwi',\n '🍓 Strawberries',\n];\n\nexport function DropdownSmoothScroll() {\n const combobox = useCombobox({\n scrollBehavior: 'smooth',\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState('');\n const shouldFilterOptions = !groceries.some((item) => item === value);\n const filteredOptions = shouldFilterOptions\n ? groceries.filter((item) => item.toLowerCase().includes(value.toLowerCase().trim()))\n : groceries;\n\n const options = filteredOptions.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(optionValue);\n combobox.closeDropdown();\n }}\n store={combobox}\n withinPortal={false}\n >\n \n {\n setValue(event.currentTarget.value);\n combobox.openDropdown();\n combobox.updateSelectedOptionIndex();\n }}\n onClick={() => combobox.openDropdown()}\n onFocus={() => combobox.openDropdown()}\n onBlur={() => combobox.closeDropdown()}\n />\n \n\n \n \n \n {options.length === 0 ? Nothing found : options}\n \n \n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/MaxDisplayedItems/MaxDisplayedItems.tsx b/docs/src/combobox-examples/examples/MaxDisplayedItems/MaxDisplayedItems.tsx index 70c775bdeef..b6ee20a3d83 100644 --- a/docs/src/combobox-examples/examples/MaxDisplayedItems/MaxDisplayedItems.tsx +++ b/docs/src/combobox-examples/examples/MaxDisplayedItems/MaxDisplayedItems.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { PillsInput, Pill, Input, Combobox, CheckIcon, Group, useCombobox } from '@mantine/core'; +import { CheckIcon, Combobox, Group, Input, Pill, PillsInput, useCombobox } from '@mantine/core'; const groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate']; diff --git a/docs/src/combobox-examples/examples/MaxDisplayedItems/code.json b/docs/src/combobox-examples/examples/MaxDisplayedItems/code.json index 4c0815cb077..ef7cb72c937 100644 --- a/docs/src/combobox-examples/examples/MaxDisplayedItems/code.json +++ b/docs/src/combobox-examples/examples/MaxDisplayedItems/code.json @@ -2,6 +2,6 @@ { "fileName": "MaxDisplayedItems.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { PillsInput, Pill, Input, Combobox, CheckIcon, Group, useCombobox } from '@mantine/core';\n\nconst groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate'];\n\nconst MAX_DISPLAYED_VALUES = 2;\n\nexport function MaxDisplayedItems() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n });\n\n const [value, setValue] = useState([]);\n\n const handleValueSelect = (val: string) =>\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n\n const handleValueRemove = (val: string) =>\n setValue((current) => current.filter((v) => v !== val));\n\n const values = value\n .slice(\n 0,\n MAX_DISPLAYED_VALUES === value.length ? MAX_DISPLAYED_VALUES : MAX_DISPLAYED_VALUES - 1\n )\n .map((item) => (\n handleValueRemove(item)}>\n {item}\n \n ));\n\n const options = groceries.map((item) => (\n \n \n {value.includes(item) ? : null}\n {item}\n \n \n ));\n\n return (\n \n \n combobox.toggleDropdown()}>\n \n {value.length > 0 ? (\n <>\n {values}\n {value.length > MAX_DISPLAYED_VALUES && (\n +{value.length - (MAX_DISPLAYED_VALUES - 1)} more\n )}\n \n ) : (\n Pick one or more values\n )}\n\n \n combobox.closeDropdown()}\n onKeyDown={(event) => {\n if (event.key === 'Backspace') {\n event.preventDefault();\n handleValueRemove(value[value.length - 1]);\n }\n }}\n />\n \n \n \n \n\n \n {options}\n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { CheckIcon, Combobox, Group, Input, Pill, PillsInput, useCombobox } from '@mantine/core';\n\nconst groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate'];\n\nconst MAX_DISPLAYED_VALUES = 2;\n\nexport function MaxDisplayedItems() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n });\n\n const [value, setValue] = useState([]);\n\n const handleValueSelect = (val: string) =>\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n\n const handleValueRemove = (val: string) =>\n setValue((current) => current.filter((v) => v !== val));\n\n const values = value\n .slice(\n 0,\n MAX_DISPLAYED_VALUES === value.length ? MAX_DISPLAYED_VALUES : MAX_DISPLAYED_VALUES - 1\n )\n .map((item) => (\n handleValueRemove(item)}>\n {item}\n \n ));\n\n const options = groceries.map((item) => (\n \n \n {value.includes(item) ? : null}\n {item}\n \n \n ));\n\n return (\n \n \n combobox.toggleDropdown()}>\n \n {value.length > 0 ? (\n <>\n {values}\n {value.length > MAX_DISPLAYED_VALUES && (\n +{value.length - (MAX_DISPLAYED_VALUES - 1)} more\n )}\n \n ) : (\n Pick one or more values\n )}\n\n \n combobox.closeDropdown()}\n onKeyDown={(event) => {\n if (event.key === 'Backspace') {\n event.preventDefault();\n handleValueRemove(value[value.length - 1]);\n }\n }}\n />\n \n \n \n \n\n \n {options}\n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/MaxSelectedItems/MaxSelectedItems.tsx b/docs/src/combobox-examples/examples/MaxSelectedItems/MaxSelectedItems.tsx index e6fc039ad1e..44d44bbf1ef 100644 --- a/docs/src/combobox-examples/examples/MaxSelectedItems/MaxSelectedItems.tsx +++ b/docs/src/combobox-examples/examples/MaxSelectedItems/MaxSelectedItems.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { PillsInput, Pill, Input, Combobox, CheckIcon, Group, useCombobox } from '@mantine/core'; +import { CheckIcon, Combobox, Group, Input, Pill, PillsInput, useCombobox } from '@mantine/core'; const groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate']; diff --git a/docs/src/combobox-examples/examples/MaxSelectedItems/code.json b/docs/src/combobox-examples/examples/MaxSelectedItems/code.json index 985bfb15c2b..aaf33a5a0f3 100644 --- a/docs/src/combobox-examples/examples/MaxSelectedItems/code.json +++ b/docs/src/combobox-examples/examples/MaxSelectedItems/code.json @@ -2,6 +2,6 @@ { "fileName": "MaxSelectedItems.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { PillsInput, Pill, Input, Combobox, CheckIcon, Group, useCombobox } from '@mantine/core';\n\nconst groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate'];\n\nconst ITEMS_LIMIT = 2;\n\nexport function MaxSelectedItems() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n });\n\n const [value, setValue] = useState([]);\n\n const handleValueSelect = (val: string) =>\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n\n const handleValueRemove = (val: string) =>\n setValue((current) => current.filter((v) => v !== val));\n\n const values = value.map((item) => (\n handleValueRemove(item)}>\n {item}\n \n ));\n\n const options = groceries.map((item) => (\n = ITEMS_LIMIT && !value.includes(item)}\n >\n \n {value.includes(item) ? : null}\n {item}\n \n \n ));\n\n return (\n \n \n combobox.toggleDropdown()}>\n \n {values.length > 0 ? (\n values\n ) : (\n Pick one or more values\n )}\n\n \n combobox.closeDropdown()}\n onKeyDown={(event) => {\n if (event.key === 'Backspace') {\n event.preventDefault();\n handleValueRemove(value[value.length - 1]);\n }\n }}\n />\n \n \n \n \n\n \n \n You can select up to 2 items, currently selected: {value.length}\n \n {options}\n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { CheckIcon, Combobox, Group, Input, Pill, PillsInput, useCombobox } from '@mantine/core';\n\nconst groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate'];\n\nconst ITEMS_LIMIT = 2;\n\nexport function MaxSelectedItems() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n });\n\n const [value, setValue] = useState([]);\n\n const handleValueSelect = (val: string) =>\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n\n const handleValueRemove = (val: string) =>\n setValue((current) => current.filter((v) => v !== val));\n\n const values = value.map((item) => (\n handleValueRemove(item)}>\n {item}\n \n ));\n\n const options = groceries.map((item) => (\n = ITEMS_LIMIT && !value.includes(item)}\n >\n \n {value.includes(item) ? : null}\n {item}\n \n \n ));\n\n return (\n \n \n combobox.toggleDropdown()}>\n \n {values.length > 0 ? (\n values\n ) : (\n Pick one or more values\n )}\n\n \n combobox.closeDropdown()}\n onKeyDown={(event) => {\n if (event.key === 'Backspace') {\n event.preventDefault();\n handleValueRemove(value[value.length - 1]);\n }\n }}\n />\n \n \n \n \n\n \n \n You can select up to 2 items, currently selected: {value.length}\n \n {options}\n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/MultiSelectCheckbox/MultiSelectCheckbox.tsx b/docs/src/combobox-examples/examples/MultiSelectCheckbox/MultiSelectCheckbox.tsx index a9e2625a3f2..13dd22c55fe 100644 --- a/docs/src/combobox-examples/examples/MultiSelectCheckbox/MultiSelectCheckbox.tsx +++ b/docs/src/combobox-examples/examples/MultiSelectCheckbox/MultiSelectCheckbox.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { PillsInput, Pill, Input, Combobox, Group, useCombobox, Checkbox } from '@mantine/core'; +import { Checkbox, Combobox, Group, Input, Pill, PillsInput, useCombobox } from '@mantine/core'; const groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate']; diff --git a/docs/src/combobox-examples/examples/MultiSelectCheckbox/code.json b/docs/src/combobox-examples/examples/MultiSelectCheckbox/code.json index f4269e1a599..bf8e56a80c7 100644 --- a/docs/src/combobox-examples/examples/MultiSelectCheckbox/code.json +++ b/docs/src/combobox-examples/examples/MultiSelectCheckbox/code.json @@ -2,6 +2,6 @@ { "fileName": "MultiSelectCheckbox.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { PillsInput, Pill, Input, Combobox, Group, useCombobox, Checkbox } from '@mantine/core';\n\nconst groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate'];\n\nexport function MultiSelectCheckbox() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n });\n\n const [value, setValue] = useState([]);\n\n const handleValueSelect = (val: string) =>\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n\n const handleValueRemove = (val: string) =>\n setValue((current) => current.filter((v) => v !== val));\n\n const values = value.map((item) => (\n handleValueRemove(item)}>\n {item}\n \n ));\n\n const options = groceries.map((item) => (\n \n \n {}}\n aria-hidden\n tabIndex={-1}\n style={{ pointerEvents: 'none' }}\n />\n {item}\n \n \n ));\n\n return (\n \n \n combobox.toggleDropdown()}>\n \n {values.length > 0 ? (\n values\n ) : (\n Pick one or more values\n )}\n\n \n combobox.closeDropdown()}\n onKeyDown={(event) => {\n if (event.key === 'Backspace') {\n event.preventDefault();\n handleValueRemove(value[value.length - 1]);\n }\n }}\n />\n \n \n \n \n\n \n {options}\n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Checkbox, Combobox, Group, Input, Pill, PillsInput, useCombobox } from '@mantine/core';\n\nconst groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate'];\n\nexport function MultiSelectCheckbox() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n });\n\n const [value, setValue] = useState([]);\n\n const handleValueSelect = (val: string) =>\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n\n const handleValueRemove = (val: string) =>\n setValue((current) => current.filter((v) => v !== val));\n\n const values = value.map((item) => (\n handleValueRemove(item)}>\n {item}\n \n ));\n\n const options = groceries.map((item) => (\n \n \n {}}\n aria-hidden\n tabIndex={-1}\n style={{ pointerEvents: 'none' }}\n />\n {item}\n \n \n ));\n\n return (\n \n \n combobox.toggleDropdown()}>\n \n {values.length > 0 ? (\n values\n ) : (\n Pick one or more values\n )}\n\n \n combobox.closeDropdown()}\n onKeyDown={(event) => {\n if (event.key === 'Backspace') {\n event.preventDefault();\n handleValueRemove(value[value.length - 1]);\n }\n }}\n />\n \n \n \n \n\n \n {options}\n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/MultiSelectCreatable/MultiSelectCreatable.tsx b/docs/src/combobox-examples/examples/MultiSelectCreatable/MultiSelectCreatable.tsx index 2f8a0b8fbd9..56e3647285c 100644 --- a/docs/src/combobox-examples/examples/MultiSelectCreatable/MultiSelectCreatable.tsx +++ b/docs/src/combobox-examples/examples/MultiSelectCreatable/MultiSelectCreatable.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { PillsInput, Pill, Combobox, CheckIcon, Group, useCombobox } from '@mantine/core'; +import { CheckIcon, Combobox, Group, Pill, PillsInput, useCombobox } from '@mantine/core'; const groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate']; diff --git a/docs/src/combobox-examples/examples/MultiSelectCreatable/code.json b/docs/src/combobox-examples/examples/MultiSelectCreatable/code.json index 7fc3a7edda5..6be561a8f24 100644 --- a/docs/src/combobox-examples/examples/MultiSelectCreatable/code.json +++ b/docs/src/combobox-examples/examples/MultiSelectCreatable/code.json @@ -2,6 +2,6 @@ { "fileName": "MultiSelectCreatable.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { PillsInput, Pill, Combobox, CheckIcon, Group, useCombobox } from '@mantine/core';\n\nconst groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate'];\n\nexport function MultiSelectCreatable() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n });\n\n const [search, setSearch] = useState('');\n const [data, setData] = useState(groceries);\n const [value, setValue] = useState([]);\n\n const exactOptionMatch = data.some((item) => item === search);\n\n const handleValueSelect = (val: string) => {\n setSearch('');\n\n if (val === '$create') {\n setData((current) => [...current, search]);\n setValue((current) => [...current, search]);\n } else {\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n }\n };\n\n const handleValueRemove = (val: string) =>\n setValue((current) => current.filter((v) => v !== val));\n\n const values = value.map((item) => (\n handleValueRemove(item)}>\n {item}\n \n ));\n\n const options = data\n .filter((item) => item.toLowerCase().includes(search.trim().toLowerCase()))\n .map((item) => (\n \n \n {value.includes(item) ? : null}\n {item}\n \n \n ));\n\n return (\n \n \n combobox.openDropdown()}>\n \n {values}\n\n \n combobox.openDropdown()}\n onBlur={() => combobox.closeDropdown()}\n value={search}\n placeholder=\"Search values\"\n onChange={(event) => {\n combobox.updateSelectedOptionIndex();\n setSearch(event.currentTarget.value);\n }}\n onKeyDown={(event) => {\n if (event.key === 'Backspace' && search.length === 0) {\n event.preventDefault();\n handleValueRemove(value[value.length - 1]);\n }\n }}\n />\n \n \n \n \n\n \n \n {options}\n\n {!exactOptionMatch && search.trim().length > 0 && (\n + Create {search}\n )}\n\n {exactOptionMatch && search.trim().length > 0 && options.length === 0 && (\n Nothing found\n )}\n \n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { CheckIcon, Combobox, Group, Pill, PillsInput, useCombobox } from '@mantine/core';\n\nconst groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate'];\n\nexport function MultiSelectCreatable() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n });\n\n const [search, setSearch] = useState('');\n const [data, setData] = useState(groceries);\n const [value, setValue] = useState([]);\n\n const exactOptionMatch = data.some((item) => item === search);\n\n const handleValueSelect = (val: string) => {\n setSearch('');\n\n if (val === '$create') {\n setData((current) => [...current, search]);\n setValue((current) => [...current, search]);\n } else {\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n }\n };\n\n const handleValueRemove = (val: string) =>\n setValue((current) => current.filter((v) => v !== val));\n\n const values = value.map((item) => (\n handleValueRemove(item)}>\n {item}\n \n ));\n\n const options = data\n .filter((item) => item.toLowerCase().includes(search.trim().toLowerCase()))\n .map((item) => (\n \n \n {value.includes(item) ? : null}\n {item}\n \n \n ));\n\n return (\n \n \n combobox.openDropdown()}>\n \n {values}\n\n \n combobox.openDropdown()}\n onBlur={() => combobox.closeDropdown()}\n value={search}\n placeholder=\"Search values\"\n onChange={(event) => {\n combobox.updateSelectedOptionIndex();\n setSearch(event.currentTarget.value);\n }}\n onKeyDown={(event) => {\n if (event.key === 'Backspace' && search.length === 0) {\n event.preventDefault();\n handleValueRemove(value[value.length - 1]);\n }\n }}\n />\n \n \n \n \n\n \n \n {options}\n\n {!exactOptionMatch && search.trim().length > 0 && (\n + Create {search}\n )}\n\n {exactOptionMatch && search.trim().length > 0 && options.length === 0 && (\n Nothing found\n )}\n \n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/MultiSelectValueRenderer/MultiSelectValueRenderer.tsx b/docs/src/combobox-examples/examples/MultiSelectValueRenderer/MultiSelectValueRenderer.tsx index 3137ae1cd9f..d69128e2462 100644 --- a/docs/src/combobox-examples/examples/MultiSelectValueRenderer/MultiSelectValueRenderer.tsx +++ b/docs/src/combobox-examples/examples/MultiSelectValueRenderer/MultiSelectValueRenderer.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { PillsInput, Pill, Input, Combobox, CheckIcon, Group, useCombobox } from '@mantine/core'; +import { CheckIcon, Combobox, Group, Input, Pill, PillsInput, useCombobox } from '@mantine/core'; import { countriesData, flags } from './countries-data'; import { CountryPill } from './CountryPill'; diff --git a/docs/src/combobox-examples/examples/MultiSelectValueRenderer/code.json b/docs/src/combobox-examples/examples/MultiSelectValueRenderer/code.json index b42bd5008eb..6b4195d1ac4 100644 --- a/docs/src/combobox-examples/examples/MultiSelectValueRenderer/code.json +++ b/docs/src/combobox-examples/examples/MultiSelectValueRenderer/code.json @@ -2,7 +2,7 @@ { "fileName": "MultiSelectValueRenderer.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { PillsInput, Pill, Input, Combobox, CheckIcon, Group, useCombobox } from '@mantine/core';\nimport { countriesData, flags } from './countries-data';\nimport { CountryPill } from './CountryPill';\n\nexport function MultiSelectValueRenderer() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n });\n\n const [value, setValue] = useState([]);\n\n const handleValueSelect = (val: string) =>\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n\n const handleValueRemove = (val: string) =>\n setValue((current) => current.filter((v) => v !== val));\n\n const values = value.map((item) => (\n handleValueRemove(item)}>\n {item}\n \n ));\n\n const options = countriesData.map((item) => {\n const OptionFlag = flags[item.value];\n return (\n \n \n {value.includes(item.value) ? : null}\n \n \n {item.label}\n \n \n \n );\n });\n\n return (\n \n \n combobox.toggleDropdown()}>\n \n {values.length > 0 ? (\n values\n ) : (\n Pick one or more values\n )}\n\n \n combobox.closeDropdown()}\n onKeyDown={(event) => {\n if (event.key === 'Backspace') {\n event.preventDefault();\n handleValueRemove(value[value.length - 1]);\n }\n }}\n />\n \n \n \n \n\n \n {options}\n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { CheckIcon, Combobox, Group, Input, Pill, PillsInput, useCombobox } from '@mantine/core';\nimport { countriesData, flags } from './countries-data';\nimport { CountryPill } from './CountryPill';\n\nexport function MultiSelectValueRenderer() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n });\n\n const [value, setValue] = useState([]);\n\n const handleValueSelect = (val: string) =>\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n\n const handleValueRemove = (val: string) =>\n setValue((current) => current.filter((v) => v !== val));\n\n const values = value.map((item) => (\n handleValueRemove(item)}>\n {item}\n \n ));\n\n const options = countriesData.map((item) => {\n const OptionFlag = flags[item.value];\n return (\n \n \n {value.includes(item.value) ? : null}\n \n \n {item.label}\n \n \n \n );\n });\n\n return (\n \n \n combobox.toggleDropdown()}>\n \n {values.length > 0 ? (\n values\n ) : (\n Pick one or more values\n )}\n\n \n combobox.closeDropdown()}\n onKeyDown={(event) => {\n if (event.key === 'Backspace') {\n event.preventDefault();\n handleValueRemove(value[value.length - 1]);\n }\n }}\n />\n \n \n \n \n\n \n {options}\n \n \n );\n}\n" }, { "fileName": "CountryPill.module.css", diff --git a/docs/src/combobox-examples/examples/SearchableMultiSelect/SearchableMultiSelect.tsx b/docs/src/combobox-examples/examples/SearchableMultiSelect/SearchableMultiSelect.tsx index f54b7ab24a4..618a84a2f43 100644 --- a/docs/src/combobox-examples/examples/SearchableMultiSelect/SearchableMultiSelect.tsx +++ b/docs/src/combobox-examples/examples/SearchableMultiSelect/SearchableMultiSelect.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { PillsInput, Pill, Combobox, CheckIcon, Group, useCombobox } from '@mantine/core'; +import { CheckIcon, Combobox, Group, Pill, PillsInput, useCombobox } from '@mantine/core'; const groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate']; diff --git a/docs/src/combobox-examples/examples/SearchableMultiSelect/code.json b/docs/src/combobox-examples/examples/SearchableMultiSelect/code.json index 3bfcef26da9..6d47176f731 100644 --- a/docs/src/combobox-examples/examples/SearchableMultiSelect/code.json +++ b/docs/src/combobox-examples/examples/SearchableMultiSelect/code.json @@ -2,6 +2,6 @@ { "fileName": "SearchableMultiSelect.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { PillsInput, Pill, Combobox, CheckIcon, Group, useCombobox } from '@mantine/core';\n\nconst groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate'];\n\nexport function SearchableMultiSelect() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n });\n\n const [search, setSearch] = useState('');\n const [value, setValue] = useState([]);\n\n const handleValueSelect = (val: string) =>\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n\n const handleValueRemove = (val: string) =>\n setValue((current) => current.filter((v) => v !== val));\n\n const values = value.map((item) => (\n handleValueRemove(item)}>\n {item}\n \n ));\n\n const options = groceries\n .filter((item) => item.toLowerCase().includes(search.trim().toLowerCase()))\n .map((item) => (\n \n \n {value.includes(item) ? : null}\n {item}\n \n \n ));\n\n return (\n \n \n combobox.openDropdown()}>\n \n {values}\n\n \n combobox.openDropdown()}\n onBlur={() => combobox.closeDropdown()}\n value={search}\n placeholder=\"Search values\"\n onChange={(event) => {\n combobox.updateSelectedOptionIndex();\n setSearch(event.currentTarget.value);\n }}\n onKeyDown={(event) => {\n if (event.key === 'Backspace' && search.length === 0) {\n event.preventDefault();\n handleValueRemove(value[value.length - 1]);\n }\n }}\n />\n \n \n \n \n\n \n \n {options.length > 0 ? options : Nothing found...}\n \n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { CheckIcon, Combobox, Group, Pill, PillsInput, useCombobox } from '@mantine/core';\n\nconst groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate'];\n\nexport function SearchableMultiSelect() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n });\n\n const [search, setSearch] = useState('');\n const [value, setValue] = useState([]);\n\n const handleValueSelect = (val: string) =>\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n\n const handleValueRemove = (val: string) =>\n setValue((current) => current.filter((v) => v !== val));\n\n const values = value.map((item) => (\n handleValueRemove(item)}>\n {item}\n \n ));\n\n const options = groceries\n .filter((item) => item.toLowerCase().includes(search.trim().toLowerCase()))\n .map((item) => (\n \n \n {value.includes(item) ? : null}\n {item}\n \n \n ));\n\n return (\n \n \n combobox.openDropdown()}>\n \n {values}\n\n \n combobox.openDropdown()}\n onBlur={() => combobox.closeDropdown()}\n value={search}\n placeholder=\"Search values\"\n onChange={(event) => {\n combobox.updateSelectedOptionIndex();\n setSearch(event.currentTarget.value);\n }}\n onKeyDown={(event) => {\n if (event.key === 'Backspace' && search.length === 0) {\n event.preventDefault();\n handleValueRemove(value[value.length - 1]);\n }\n }}\n />\n \n \n \n \n\n \n \n {options.length > 0 ? options : Nothing found...}\n \n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/SelectActive/SelectActive.tsx b/docs/src/combobox-examples/examples/SelectActive/SelectActive.tsx index b714a9ac7c4..a278eafddd3 100644 --- a/docs/src/combobox-examples/examples/SelectActive/SelectActive.tsx +++ b/docs/src/combobox-examples/examples/SelectActive/SelectActive.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Combobox, InputBase, Input, Group, CheckIcon, useCombobox } from '@mantine/core'; +import { CheckIcon, Combobox, Group, Input, InputBase, useCombobox } from '@mantine/core'; const groceries = [ '🍎 Apples', diff --git a/docs/src/combobox-examples/examples/SelectActive/code.json b/docs/src/combobox-examples/examples/SelectActive/code.json index e84d6f19bb6..47a9ce04370 100644 --- a/docs/src/combobox-examples/examples/SelectActive/code.json +++ b/docs/src/combobox-examples/examples/SelectActive/code.json @@ -2,6 +2,6 @@ { "fileName": "SelectActive.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { Combobox, InputBase, Input, Group, CheckIcon, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function SelectActive() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: (eventSource) => {\n if (eventSource === 'keyboard') {\n combobox.selectActiveOption();\n } else {\n combobox.updateSelectedOptionIndex('active');\n }\n },\n });\n\n const [value, setValue] = useState('🥦 Broccoli');\n\n const options = groceries.map((item) => (\n \n \n {item === value && }\n {item}\n \n \n ));\n\n return (\n {\n setValue(val);\n combobox.updateSelectedOptionIndex('active');\n }}\n >\n \n }\n rightSectionPointerEvents=\"none\"\n onClick={() => combobox.toggleDropdown()}\n >\n {value || Pick value}\n \n \n\n \n {options}\n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { CheckIcon, Combobox, Group, Input, InputBase, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function SelectActive() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: (eventSource) => {\n if (eventSource === 'keyboard') {\n combobox.selectActiveOption();\n } else {\n combobox.updateSelectedOptionIndex('active');\n }\n },\n });\n\n const [value, setValue] = useState('🥦 Broccoli');\n\n const options = groceries.map((item) => (\n \n \n {item === value && }\n {item}\n \n \n ));\n\n return (\n {\n setValue(val);\n combobox.updateSelectedOptionIndex('active');\n }}\n >\n \n }\n rightSectionPointerEvents=\"none\"\n onClick={() => combobox.toggleDropdown()}\n >\n {value || Pick value}\n \n \n\n \n {options}\n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/SelectAsync/SelectAsync.tsx b/docs/src/combobox-examples/examples/SelectAsync/SelectAsync.tsx index 0d1c8ccf041..94fe43c3f80 100644 --- a/docs/src/combobox-examples/examples/SelectAsync/SelectAsync.tsx +++ b/docs/src/combobox-examples/examples/SelectAsync/SelectAsync.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Combobox, InputBase, Input, Loader, useCombobox } from '@mantine/core'; +import { Combobox, Input, InputBase, Loader, useCombobox } from '@mantine/core'; const MOCKDATA = [ '🍎 Apples', diff --git a/docs/src/combobox-examples/examples/SelectAsync/code.json b/docs/src/combobox-examples/examples/SelectAsync/code.json index ebee57955ec..ea1d8e013c9 100644 --- a/docs/src/combobox-examples/examples/SelectAsync/code.json +++ b/docs/src/combobox-examples/examples/SelectAsync/code.json @@ -2,6 +2,6 @@ { "fileName": "SelectAsync.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { Combobox, InputBase, Input, Loader, useCombobox } from '@mantine/core';\n\nconst MOCKDATA = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nfunction getAsyncData() {\n return new Promise((resolve) => {\n setTimeout(() => resolve(MOCKDATA), 2000);\n });\n}\n\nexport function SelectAsync() {\n const [value, setValue] = useState(null);\n const [loading, setLoading] = useState(false);\n const [data, setData] = useState([]);\n\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: () => {\n if (data.length === 0 && !loading) {\n setLoading(true);\n getAsyncData().then((response) => {\n setData(response);\n setLoading(false);\n combobox.resetSelectedOption();\n });\n }\n },\n });\n\n const options = data.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n : }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n \n \n {loading ? Loading.... : options}\n \n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Combobox, Input, InputBase, Loader, useCombobox } from '@mantine/core';\n\nconst MOCKDATA = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nfunction getAsyncData() {\n return new Promise((resolve) => {\n setTimeout(() => resolve(MOCKDATA), 2000);\n });\n}\n\nexport function SelectAsync() {\n const [value, setValue] = useState(null);\n const [loading, setLoading] = useState(false);\n const [data, setData] = useState([]);\n\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n onDropdownOpen: () => {\n if (data.length === 0 && !loading) {\n setLoading(true);\n getAsyncData().then((response) => {\n setData(response);\n setLoading(false);\n combobox.resetSelectedOption();\n });\n }\n },\n });\n\n const options = data.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n : }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n \n \n {loading ? Loading.... : options}\n \n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/SelectClearable/SelectClearable.tsx b/docs/src/combobox-examples/examples/SelectClearable/SelectClearable.tsx index f5f5fced108..9aafbb947e6 100644 --- a/docs/src/combobox-examples/examples/SelectClearable/SelectClearable.tsx +++ b/docs/src/combobox-examples/examples/SelectClearable/SelectClearable.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Combobox, InputBase, Input, CloseButton, useCombobox } from '@mantine/core'; +import { CloseButton, Combobox, Input, InputBase, useCombobox } from '@mantine/core'; const groceries = [ '🍎 Apples', diff --git a/docs/src/combobox-examples/examples/SelectClearable/code.json b/docs/src/combobox-examples/examples/SelectClearable/code.json index 67c6b92acf0..8da6f3f1fb2 100644 --- a/docs/src/combobox-examples/examples/SelectClearable/code.json +++ b/docs/src/combobox-examples/examples/SelectClearable/code.json @@ -2,6 +2,6 @@ { "fileName": "SelectClearable.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { Combobox, InputBase, Input, CloseButton, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function SelectClearable() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n\n const options = groceries.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n event.preventDefault()}\n onClick={() => setValue(null)}\n aria-label=\"Clear value\"\n />\n ) : (\n \n )\n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents={value === null ? 'none' : 'all'}\n >\n {value || Pick value}\n \n \n\n \n {options}\n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { CloseButton, Combobox, Input, InputBase, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function SelectClearable() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n\n const options = groceries.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n event.preventDefault()}\n onClick={() => setValue(null)}\n aria-label=\"Clear value\"\n />\n ) : (\n \n )\n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents={value === null ? 'none' : 'all'}\n >\n {value || Pick value}\n \n \n\n \n {options}\n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/SelectDropdownSearch/SelectDropdownSearch.tsx b/docs/src/combobox-examples/examples/SelectDropdownSearch/SelectDropdownSearch.tsx index 12142b424cb..fc198938b73 100644 --- a/docs/src/combobox-examples/examples/SelectDropdownSearch/SelectDropdownSearch.tsx +++ b/docs/src/combobox-examples/examples/SelectDropdownSearch/SelectDropdownSearch.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Combobox, InputBase, Input, useCombobox } from '@mantine/core'; +import { Combobox, Input, InputBase, useCombobox } from '@mantine/core'; const groceries = [ '🍎 Apples', diff --git a/docs/src/combobox-examples/examples/SelectDropdownSearch/code.json b/docs/src/combobox-examples/examples/SelectDropdownSearch/code.json index d932b2f0f6f..95e4ceb7044 100644 --- a/docs/src/combobox-examples/examples/SelectDropdownSearch/code.json +++ b/docs/src/combobox-examples/examples/SelectDropdownSearch/code.json @@ -2,6 +2,6 @@ { "fileName": "SelectDropdownSearch.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { Combobox, InputBase, Input, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function SelectDropdownSearch() {\n const [search, setSearch] = useState('');\n const combobox = useCombobox({\n onDropdownClose: () => {\n combobox.resetSelectedOption();\n combobox.focusTarget();\n setSearch('');\n },\n\n onDropdownOpen: () => {\n combobox.focusSearchInput();\n },\n });\n\n const [value, setValue] = useState(null);\n\n const options = groceries\n .filter((item) => item.toLowerCase().includes(search.toLowerCase().trim()))\n .map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n \n setSearch(event.currentTarget.value)}\n placeholder=\"Search groceries\"\n />\n \n {options.length > 0 ? options : Nothing found}\n \n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Combobox, Input, InputBase, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function SelectDropdownSearch() {\n const [search, setSearch] = useState('');\n const combobox = useCombobox({\n onDropdownClose: () => {\n combobox.resetSelectedOption();\n combobox.focusTarget();\n setSearch('');\n },\n\n onDropdownOpen: () => {\n combobox.focusSearchInput();\n },\n });\n\n const [value, setValue] = useState(null);\n\n const options = groceries\n .filter((item) => item.toLowerCase().includes(search.toLowerCase().trim()))\n .map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n \n setSearch(event.currentTarget.value)}\n placeholder=\"Search groceries\"\n />\n \n {options.length > 0 ? options : Nothing found}\n \n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/SelectGroups/SelectGroups.tsx b/docs/src/combobox-examples/examples/SelectGroups/SelectGroups.tsx index 60ca2c0d54d..2167e7b4067 100644 --- a/docs/src/combobox-examples/examples/SelectGroups/SelectGroups.tsx +++ b/docs/src/combobox-examples/examples/SelectGroups/SelectGroups.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Combobox, InputBase, Input, useCombobox } from '@mantine/core'; +import { Combobox, Input, InputBase, useCombobox } from '@mantine/core'; export function SelectGroups() { const combobox = useCombobox({ diff --git a/docs/src/combobox-examples/examples/SelectGroups/code.json b/docs/src/combobox-examples/examples/SelectGroups/code.json index 13f3515cc2f..bb7b9d0f397 100644 --- a/docs/src/combobox-examples/examples/SelectGroups/code.json +++ b/docs/src/combobox-examples/examples/SelectGroups/code.json @@ -2,6 +2,6 @@ { "fileName": "SelectGroups.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { Combobox, InputBase, Input, useCombobox } from '@mantine/core';\n\nexport function SelectGroups() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n \n \n \n 🍎 Apples\n 🍌 Bananas\n 🍇 Grapes\n \n\n \n 🥦 Broccoli\n 🥕 Carrots\n \n \n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Combobox, Input, InputBase, useCombobox } from '@mantine/core';\n\nexport function SelectGroups() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n \n \n \n 🍎 Apples\n 🍌 Bananas\n 🍇 Grapes\n \n\n \n 🥦 Broccoli\n 🥕 Carrots\n \n \n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/SelectGroupsStyles/SelectGroupsStyles.tsx b/docs/src/combobox-examples/examples/SelectGroupsStyles/SelectGroupsStyles.tsx index 433cdecd159..e235ac24957 100644 --- a/docs/src/combobox-examples/examples/SelectGroupsStyles/SelectGroupsStyles.tsx +++ b/docs/src/combobox-examples/examples/SelectGroupsStyles/SelectGroupsStyles.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Combobox, InputBase, Input, useCombobox } from '@mantine/core'; +import { Combobox, Input, InputBase, useCombobox } from '@mantine/core'; import classes from './SelectGroupsStyles.module.css'; export function SelectGroupsStyles() { diff --git a/docs/src/combobox-examples/examples/SelectGroupsStyles/code.json b/docs/src/combobox-examples/examples/SelectGroupsStyles/code.json index b879790075b..153bec5ca9f 100644 --- a/docs/src/combobox-examples/examples/SelectGroupsStyles/code.json +++ b/docs/src/combobox-examples/examples/SelectGroupsStyles/code.json @@ -2,7 +2,7 @@ { "fileName": "SelectGroupsStyles.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { Combobox, InputBase, Input, useCombobox } from '@mantine/core';\nimport classes from './SelectGroupsStyles.module.css';\n\nexport function SelectGroupsStyles() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n \n \n \n 🍎 Apples\n 🍌 Bananas\n \n\n \n 🥦 Broccoli\n 🥕 Carrots\n \n\n 🥩 Steak\n 🍗 Chicken\n \n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Combobox, Input, InputBase, useCombobox } from '@mantine/core';\nimport classes from './SelectGroupsStyles.module.css';\n\nexport function SelectGroupsStyles() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n \n \n \n 🍎 Apples\n 🍌 Bananas\n \n\n \n 🥦 Broccoli\n 🥕 Carrots\n \n\n 🥩 Steak\n 🍗 Chicken\n \n \n \n );\n}\n" }, { "fileName": "SelectGroupsStyles.module.css", diff --git a/docs/src/combobox-examples/examples/SelectList/SelectList.tsx b/docs/src/combobox-examples/examples/SelectList/SelectList.tsx index e22ff58d019..e16703b14ee 100644 --- a/docs/src/combobox-examples/examples/SelectList/SelectList.tsx +++ b/docs/src/combobox-examples/examples/SelectList/SelectList.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { TextInput, Combobox, useCombobox, Checkbox, Group } from '@mantine/core'; +import { Checkbox, Combobox, Group, TextInput, useCombobox } from '@mantine/core'; import classes from './SelectList.module.css'; const groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate']; diff --git a/docs/src/combobox-examples/examples/SelectList/code.json b/docs/src/combobox-examples/examples/SelectList/code.json index 3eed8880b68..e3473b8bab3 100644 --- a/docs/src/combobox-examples/examples/SelectList/code.json +++ b/docs/src/combobox-examples/examples/SelectList/code.json @@ -2,7 +2,7 @@ { "fileName": "SelectList.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { TextInput, Combobox, useCombobox, Checkbox, Group } from '@mantine/core';\nimport classes from './SelectList.module.css';\n\nconst groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate'];\n\nexport function SelectList() {\n const combobox = useCombobox();\n\n const [value, setValue] = useState([]);\n const [search, setSearch] = useState('');\n\n const handleValueSelect = (val: string) =>\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n\n const options = groceries\n .filter((item) => item.toLowerCase().includes(search.toLowerCase().trim()))\n .map((item) => (\n combobox.resetSelectedOption()}\n >\n \n {}}\n aria-hidden\n tabIndex={-1}\n style={{ pointerEvents: 'none' }}\n />\n {item}\n \n \n ));\n\n return (\n \n \n {\n setSearch(event.currentTarget.value);\n combobox.updateSelectedOptionIndex();\n }}\n />\n \n\n
\n \n {options.length > 0 ? options : Nothing found....}\n \n
\n
\n );\n}\n" + "code": "import { useState } from 'react';\nimport { Checkbox, Combobox, Group, TextInput, useCombobox } from '@mantine/core';\nimport classes from './SelectList.module.css';\n\nconst groceries = ['🍎 Apples', '🍌 Bananas', '🥦 Broccoli', '🥕 Carrots', '🍫 Chocolate'];\n\nexport function SelectList() {\n const combobox = useCombobox();\n\n const [value, setValue] = useState([]);\n const [search, setSearch] = useState('');\n\n const handleValueSelect = (val: string) =>\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n\n const options = groceries\n .filter((item) => item.toLowerCase().includes(search.toLowerCase().trim()))\n .map((item) => (\n combobox.resetSelectedOption()}\n >\n \n {}}\n aria-hidden\n tabIndex={-1}\n style={{ pointerEvents: 'none' }}\n />\n {item}\n \n \n ));\n\n return (\n \n \n {\n setSearch(event.currentTarget.value);\n combobox.updateSelectedOptionIndex();\n }}\n />\n \n\n
\n \n {options.length > 0 ? options : Nothing found....}\n \n
\n
\n );\n}\n" }, { "fileName": "SelectList.module.css", diff --git a/docs/src/combobox-examples/examples/SelectOptionComponent/SelectOptionComponent.tsx b/docs/src/combobox-examples/examples/SelectOptionComponent/SelectOptionComponent.tsx index 8640fab85c7..f92dd603d91 100644 --- a/docs/src/combobox-examples/examples/SelectOptionComponent/SelectOptionComponent.tsx +++ b/docs/src/combobox-examples/examples/SelectOptionComponent/SelectOptionComponent.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Combobox, InputBase, Input, useCombobox, Group, Text } from '@mantine/core'; +import { Combobox, Group, Input, InputBase, Text, useCombobox } from '@mantine/core'; interface Item { emoji: string; diff --git a/docs/src/combobox-examples/examples/SelectOptionComponent/code.json b/docs/src/combobox-examples/examples/SelectOptionComponent/code.json index c0d0c4aed7e..9d5d63c2beb 100644 --- a/docs/src/combobox-examples/examples/SelectOptionComponent/code.json +++ b/docs/src/combobox-examples/examples/SelectOptionComponent/code.json @@ -2,6 +2,6 @@ { "fileName": "SelectOptionComponent.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { Combobox, InputBase, Input, useCombobox, Group, Text } from '@mantine/core';\n\ninterface Item {\n emoji: string;\n value: string;\n description: string;\n}\n\nconst groceries: Item[] = [\n { emoji: '🍎', value: 'Apples', description: 'Crisp and refreshing fruit' },\n { emoji: '🍌', value: 'Bananas', description: 'Naturally sweet and potassium-rich fruit' },\n { emoji: '🥦', value: 'Broccoli', description: 'Nutrient-packed green vegetable' },\n { emoji: '🥕', value: 'Carrots', description: 'Crunchy and vitamin-rich root vegetable' },\n { emoji: '🍫', value: 'Chocolate', description: 'Indulgent and decadent treat' },\n];\n\nfunction SelectOption({ emoji, value, description }: Item) {\n return (\n \n {emoji}\n
\n \n {value}\n \n \n {description}\n \n
\n
\n );\n}\n\nexport function SelectOptionComponent() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n const selectedOption = groceries.find((item) => item.value === value);\n\n const options = groceries.map((item) => (\n \n \n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n multiline\n >\n {selectedOption ? (\n \n ) : (\n Pick value\n )}\n \n \n\n \n {options}\n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Combobox, Group, Input, InputBase, Text, useCombobox } from '@mantine/core';\n\ninterface Item {\n emoji: string;\n value: string;\n description: string;\n}\n\nconst groceries: Item[] = [\n { emoji: '🍎', value: 'Apples', description: 'Crisp and refreshing fruit' },\n { emoji: '🍌', value: 'Bananas', description: 'Naturally sweet and potassium-rich fruit' },\n { emoji: '🥦', value: 'Broccoli', description: 'Nutrient-packed green vegetable' },\n { emoji: '🥕', value: 'Carrots', description: 'Crunchy and vitamin-rich root vegetable' },\n { emoji: '🍫', value: 'Chocolate', description: 'Indulgent and decadent treat' },\n];\n\nfunction SelectOption({ emoji, value, description }: Item) {\n return (\n \n {emoji}\n
\n \n {value}\n \n \n {description}\n \n
\n
\n );\n}\n\nexport function SelectOptionComponent() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n const selectedOption = groceries.find((item) => item.value === value);\n\n const options = groceries.map((item) => (\n \n \n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n multiline\n >\n {selectedOption ? (\n \n ) : (\n Pick value\n )}\n \n \n\n \n {options}\n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/SelectOptionOnHover/SelectOptionOnHover.tsx b/docs/src/combobox-examples/examples/SelectOptionOnHover/SelectOptionOnHover.tsx index c96d6d14daa..46f8590f278 100644 --- a/docs/src/combobox-examples/examples/SelectOptionOnHover/SelectOptionOnHover.tsx +++ b/docs/src/combobox-examples/examples/SelectOptionOnHover/SelectOptionOnHover.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Combobox, InputBase, Input, useCombobox } from '@mantine/core'; +import { Combobox, Input, InputBase, useCombobox } from '@mantine/core'; const groceries = [ '🍎 Apples', diff --git a/docs/src/combobox-examples/examples/SelectOptionOnHover/code.json b/docs/src/combobox-examples/examples/SelectOptionOnHover/code.json index 46575a82bb9..f78fda2c562 100644 --- a/docs/src/combobox-examples/examples/SelectOptionOnHover/code.json +++ b/docs/src/combobox-examples/examples/SelectOptionOnHover/code.json @@ -2,6 +2,6 @@ { "fileName": "SelectOptionOnHover.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { Combobox, InputBase, Input, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function SelectOptionOnHover() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n\n const options = groceries.map((item, index) => (\n combobox.selectOption(index)}>\n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n combobox.resetSelectedOption()}>\n {options}\n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Combobox, Input, InputBase, useCombobox } from '@mantine/core';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function SelectOptionOnHover() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n\n const options = groceries.map((item, index) => (\n combobox.selectOption(index)}>\n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n combobox.resetSelectedOption()}>\n {options}\n \n \n );\n}\n" } ] \ No newline at end of file diff --git a/docs/src/combobox-examples/examples/SelectedAnimation/SelectedAnimation.tsx b/docs/src/combobox-examples/examples/SelectedAnimation/SelectedAnimation.tsx index 5997551a101..b44bacc7580 100644 --- a/docs/src/combobox-examples/examples/SelectedAnimation/SelectedAnimation.tsx +++ b/docs/src/combobox-examples/examples/SelectedAnimation/SelectedAnimation.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Combobox, InputBase, Input, useCombobox } from '@mantine/core'; +import { Combobox, Input, InputBase, useCombobox } from '@mantine/core'; import classes from './SelectedAnimation.module.css'; const groceries = [ diff --git a/docs/src/combobox-examples/examples/SelectedAnimation/code.json b/docs/src/combobox-examples/examples/SelectedAnimation/code.json index 78fa1b8c528..37786728903 100644 --- a/docs/src/combobox-examples/examples/SelectedAnimation/code.json +++ b/docs/src/combobox-examples/examples/SelectedAnimation/code.json @@ -2,7 +2,7 @@ { "fileName": "SelectedAnimation.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { Combobox, InputBase, Input, useCombobox } from '@mantine/core';\nimport classes from './SelectedAnimation.module.css';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function SelectedAnimation() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n\n const options = groceries.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n \n {options}\n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Combobox, Input, InputBase, useCombobox } from '@mantine/core';\nimport classes from './SelectedAnimation.module.css';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function SelectedAnimation() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n\n const options = groceries.map((item) => (\n \n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n \n {options}\n \n \n );\n}\n" }, { "fileName": "SelectedAnimation.module.css", diff --git a/docs/src/combobox-examples/examples/SelectedStyles/SelectedStyles.tsx b/docs/src/combobox-examples/examples/SelectedStyles/SelectedStyles.tsx index f847f270022..014f720e709 100644 --- a/docs/src/combobox-examples/examples/SelectedStyles/SelectedStyles.tsx +++ b/docs/src/combobox-examples/examples/SelectedStyles/SelectedStyles.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Combobox, InputBase, Input, useCombobox } from '@mantine/core'; +import { Combobox, Input, InputBase, useCombobox } from '@mantine/core'; import classes from './SelectedStyles.module.css'; const groceries = [ diff --git a/docs/src/combobox-examples/examples/SelectedStyles/code.json b/docs/src/combobox-examples/examples/SelectedStyles/code.json index 6e2f2a8477c..5e7f7ade0b5 100644 --- a/docs/src/combobox-examples/examples/SelectedStyles/code.json +++ b/docs/src/combobox-examples/examples/SelectedStyles/code.json @@ -2,7 +2,7 @@ { "fileName": "SelectedStyles.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { Combobox, InputBase, Input, useCombobox } from '@mantine/core';\nimport classes from './SelectedStyles.module.css';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function SelectedStyles() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n\n const options = groceries.map((item, index) => (\n combobox.selectOption(index)}\n >\n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n combobox.resetSelectedOption()}>\n {options}\n \n \n );\n}\n" + "code": "import { useState } from 'react';\nimport { Combobox, Input, InputBase, useCombobox } from '@mantine/core';\nimport classes from './SelectedStyles.module.css';\n\nconst groceries = [\n '🍎 Apples',\n '🍌 Bananas',\n '🥦 Broccoli',\n '🥕 Carrots',\n '🍫 Chocolate',\n '🍇 Grapes',\n];\n\nexport function SelectedStyles() {\n const combobox = useCombobox({\n onDropdownClose: () => combobox.resetSelectedOption(),\n });\n\n const [value, setValue] = useState(null);\n\n const options = groceries.map((item, index) => (\n combobox.selectOption(index)}\n >\n {item}\n \n ));\n\n return (\n {\n setValue(val);\n combobox.closeDropdown();\n }}\n >\n \n }\n onClick={() => combobox.toggleDropdown()}\n rightSectionPointerEvents=\"none\"\n >\n {value || Pick value}\n \n \n\n combobox.resetSelectedOption()}>\n {options}\n \n \n );\n}\n" }, { "fileName": "SelectedStyles.module.css", diff --git a/docs/src/combobox-examples/examples/TransferList/TransferList.tsx b/docs/src/combobox-examples/examples/TransferList/TransferList.tsx index 9f9090ae495..20df93e0006 100644 --- a/docs/src/combobox-examples/examples/TransferList/TransferList.tsx +++ b/docs/src/combobox-examples/examples/TransferList/TransferList.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; import { IconChevronRight } from '@tabler/icons-react'; -import { Combobox, TextInput, useCombobox, Checkbox, ActionIcon, Group } from '@mantine/core'; +import { ActionIcon, Checkbox, Combobox, Group, TextInput, useCombobox } from '@mantine/core'; import classes from './TransferList.module.css'; const fruits = ['🍎 Apples', '🍌 Bananas', '🍓 Strawberries']; diff --git a/docs/src/combobox-examples/examples/TransferList/code.json b/docs/src/combobox-examples/examples/TransferList/code.json index bed3c7ff148..83b40a6c58b 100644 --- a/docs/src/combobox-examples/examples/TransferList/code.json +++ b/docs/src/combobox-examples/examples/TransferList/code.json @@ -2,7 +2,7 @@ { "fileName": "TransferList.tsx", "language": "tsx", - "code": "import { useState } from 'react';\nimport { IconChevronRight } from '@tabler/icons-react';\nimport { Combobox, TextInput, useCombobox, Checkbox, ActionIcon, Group } from '@mantine/core';\nimport classes from './TransferList.module.css';\n\nconst fruits = ['🍎 Apples', '🍌 Bananas', '🍓 Strawberries'];\n\nconst vegetables = ['🥦 Broccoli', '🥕 Carrots', '🥬 Lettuce'];\n\ninterface RenderListProps {\n options: string[];\n onTransfer: (options: string[]) => void;\n type: 'forward' | 'backward';\n}\n\nfunction RenderList({ options, onTransfer, type }: RenderListProps) {\n const combobox = useCombobox();\n const [value, setValue] = useState([]);\n const [search, setSearch] = useState('');\n\n const handleValueSelect = (val: string) =>\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n\n const items = options\n .filter((item) => item.toLowerCase().includes(search.toLowerCase().trim()))\n .map((item) => (\n combobox.resetSelectedOption()}\n >\n \n {}}\n aria-hidden\n tabIndex={-1}\n style={{ pointerEvents: 'none' }}\n />\n {item}\n \n \n ));\n\n return (\n
\n \n \n \n {\n setSearch(event.currentTarget.value);\n combobox.updateSelectedOptionIndex();\n }}\n />\n {\n onTransfer(value);\n setValue([]);\n }}\n >\n \n \n \n \n\n
\n \n {items.length > 0 ? items : Nothing found....}\n \n
\n
\n
\n );\n}\n\nexport function TransferList() {\n const [data, setData] = useState<[string[], string[]]>([fruits, vegetables]);\n\n const handleTransfer = (transferFrom: number, options: string[]) =>\n setData((current) => {\n const transferTo = transferFrom === 0 ? 1 : 0;\n const transferFromData = current[transferFrom].filter((item) => !options.includes(item));\n const transferToData = [...current[transferTo], ...options];\n\n const result = [];\n result[transferFrom] = transferFromData;\n result[transferTo] = transferToData;\n return result as [string[], string[]];\n });\n\n return (\n
\n handleTransfer(0, options)}\n />\n handleTransfer(1, options)}\n />\n
\n );\n}\n" + "code": "import { useState } from 'react';\nimport { IconChevronRight } from '@tabler/icons-react';\nimport { ActionIcon, Checkbox, Combobox, Group, TextInput, useCombobox } from '@mantine/core';\nimport classes from './TransferList.module.css';\n\nconst fruits = ['🍎 Apples', '🍌 Bananas', '🍓 Strawberries'];\n\nconst vegetables = ['🥦 Broccoli', '🥕 Carrots', '🥬 Lettuce'];\n\ninterface RenderListProps {\n options: string[];\n onTransfer: (options: string[]) => void;\n type: 'forward' | 'backward';\n}\n\nfunction RenderList({ options, onTransfer, type }: RenderListProps) {\n const combobox = useCombobox();\n const [value, setValue] = useState([]);\n const [search, setSearch] = useState('');\n\n const handleValueSelect = (val: string) =>\n setValue((current) =>\n current.includes(val) ? current.filter((v) => v !== val) : [...current, val]\n );\n\n const items = options\n .filter((item) => item.toLowerCase().includes(search.toLowerCase().trim()))\n .map((item) => (\n combobox.resetSelectedOption()}\n >\n \n {}}\n aria-hidden\n tabIndex={-1}\n style={{ pointerEvents: 'none' }}\n />\n {item}\n \n \n ));\n\n return (\n
\n \n \n \n {\n setSearch(event.currentTarget.value);\n combobox.updateSelectedOptionIndex();\n }}\n />\n {\n onTransfer(value);\n setValue([]);\n }}\n >\n \n \n \n \n\n
\n \n {items.length > 0 ? items : Nothing found....}\n \n
\n
\n
\n );\n}\n\nexport function TransferList() {\n const [data, setData] = useState<[string[], string[]]>([fruits, vegetables]);\n\n const handleTransfer = (transferFrom: number, options: string[]) =>\n setData((current) => {\n const transferTo = transferFrom === 0 ? 1 : 0;\n const transferFromData = current[transferFrom].filter((item) => !options.includes(item));\n const transferToData = [...current[transferTo], ...options];\n\n const result = [];\n result[transferFrom] = transferFromData;\n result[transferTo] = transferToData;\n return result as [string[], string[]];\n });\n\n return (\n
\n handleTransfer(0, options)}\n />\n handleTransfer(1, options)}\n />\n
\n );\n}\n" }, { "fileName": "TransferList.module.css", diff --git a/docs/src/combobox-examples/examples/index.ts b/docs/src/combobox-examples/examples/index.ts index 7bcfe6e36ea..dc78517e0d9 100644 --- a/docs/src/combobox-examples/examples/index.ts +++ b/docs/src/combobox-examples/examples/index.ts @@ -1,91 +1,90 @@ import { ShikiLanguage } from '@mantinex/shiki'; -import { BasicSelect } from './BasicSelect/BasicSelect'; -import { BasicAutocomplete } from './BasicAutocomplete/BasicAutocomplete'; -import { SearchableSelect } from './SearchableSelect/SearchableSelect'; -import { AutocompleteLimit } from './AutocompleteLimit/AutocompleteLimit'; +import { ActiveOptionsFilter } from './ActiveOptionsFilter/ActiveOptionsFilter'; +import ActiveOptionsFilterCode from './ActiveOptionsFilter/code.json'; import { AsyncAutocomplete } from './AsyncAutocomplete/AsyncAutocomplete'; +import AsyncAutocompleteCode from './AsyncAutocomplete/code.json'; +import { AutocompleteClearable } from './AutocompleteClearable/AutocompleteClearable'; +import AutocompleteClearableCode from './AutocompleteClearable/code.json'; +import { AutocompleteDynamic } from './AutocompleteDynamic/AutocompleteDynamic'; +import AutocompleteDynamicCode from './AutocompleteDynamic/code.json'; import { AutocompleteHighlight } from './AutocompleteHighlight/AutocompleteHighlight'; -import { SelectActive } from './SelectActive/SelectActive'; -import { SelectOptionComponent } from './SelectOptionComponent/SelectOptionComponent'; -import { SelectLimit } from './SelectLimit/SelectLimit'; -import { SelectAsync } from './SelectAsync/SelectAsync'; +import AutocompleteHighlightCode from './AutocompleteHighlight/code.json'; +import { AutocompleteLimit } from './AutocompleteLimit/AutocompleteLimit'; +import AutocompleteLimitCode from './AutocompleteLimit/code.json'; import { AutocompleteSelectFirstOption } from './AutocompleteSelectFirstOption/AutocompleteSelectFirstOption'; -import { SelectClearable } from './SelectClearable/SelectClearable'; -import { DropdownScroll } from './DropdownScroll/DropdownScroll'; -import { DropdownScrollArea } from './DropdownScrollArea/DropdownScrollArea'; -import { AutocompleteDynamic } from './AutocompleteDynamic/AutocompleteDynamic'; -import { DropdownAnimation } from './DropdownAnimation/DropdownAnimation'; -import { DropdownPositionStyles } from './DropdownPositionStyles/DropdownPositionStyles'; -import { SelectDropdownSearch } from './SelectDropdownSearch/SelectDropdownSearch'; +import AutocompleteSelectFirstOptionCode from './AutocompleteSelectFirstOption/code.json'; +import { BasicAutocomplete } from './BasicAutocomplete/BasicAutocomplete'; +import BasicAutocompleteCode from './BasicAutocomplete/code.json'; import { BasicButton } from './BasicButton/BasicButton'; +import BasicButtonCode from './BasicButton/code.json'; +import { BasicMultiSelect } from './BasicMultiSelect/BasicMultiSelect'; +import BasicMultiSelectCode from './BasicMultiSelect/code.json'; +import { BasicSelect } from './BasicSelect/BasicSelect'; +import BasicSelectCode from './BasicSelect/code.json'; +import { ButtonMultiSelect } from './ButtonMultiSelect/ButtonMultiSelect'; +import ButtonMultiSelectCode from './ButtonMultiSelect/code.json'; import { ButtonSearch } from './ButtonSearch/ButtonSearch'; -import { DropdownOptionsAnimation } from './DropdownOptionsAnimation/DropdownOptionsAnimation'; -import { SelectOptionOnHover } from './SelectOptionOnHover/SelectOptionOnHover'; -import { SelectedStyles } from './SelectedStyles/SelectedStyles'; +import ButtonSearchCode from './ButtonSearch/code.json'; +import DropdownAnimationCode from './DropdownAnimation/code.json'; +import { DropdownAnimation } from './DropdownAnimation/DropdownAnimation'; +import DropdownFooterCode from './DropdownFooter/code.json'; import { DropdownFooter } from './DropdownFooter/DropdownFooter'; +import DropdownHeaderCode from './DropdownHeader/code.json'; import { DropdownHeader } from './DropdownHeader/DropdownHeader'; -import { SelectedAnimation } from './SelectedAnimation/SelectedAnimation'; -import { AutocompleteClearable } from './AutocompleteClearable/AutocompleteClearable'; -import { BasicMultiSelect } from './BasicMultiSelect/BasicMultiSelect'; -import { SearchableMultiSelect } from './SearchableMultiSelect/SearchableMultiSelect'; +import DropdownOptionsAnimationCode from './DropdownOptionsAnimation/code.json'; +import { DropdownOptionsAnimation } from './DropdownOptionsAnimation/DropdownOptionsAnimation'; +import DropdownPositionStylesCode from './DropdownPositionStyles/code.json'; +import { DropdownPositionStyles } from './DropdownPositionStyles/DropdownPositionStyles'; +import DropdownScrollCode from './DropdownScroll/code.json'; +import { DropdownScroll } from './DropdownScroll/DropdownScroll'; +import DropdownScrollAreaCode from './DropdownScrollArea/code.json'; +import { DropdownScrollArea } from './DropdownScrollArea/DropdownScrollArea'; +import DropdownSmoothScrollCode from './DropdownSmoothScroll/code.json'; import { DropdownSmoothScroll } from './DropdownSmoothScroll/DropdownSmoothScroll'; -import { ButtonMultiSelect } from './ButtonMultiSelect/ButtonMultiSelect'; +import MaxDisplayedItemsCode from './MaxDisplayedItems/code.json'; +import { MaxDisplayedItems } from './MaxDisplayedItems/MaxDisplayedItems'; +import MaxSelectedItemsCode from './MaxSelectedItems/code.json'; import { MaxSelectedItems } from './MaxSelectedItems/MaxSelectedItems'; +import MultiSelectCheckboxCode from './MultiSelectCheckbox/code.json'; import { MultiSelectCheckbox } from './MultiSelectCheckbox/MultiSelectCheckbox'; -import { ActiveOptionsFilter } from './ActiveOptionsFilter/ActiveOptionsFilter'; -import { MaxDisplayedItems } from './MaxDisplayedItems/MaxDisplayedItems'; -import { MultiSelectValueRenderer } from './MultiSelectValueRenderer/MultiSelectValueRenderer'; -import { SelectGroups } from './SelectGroups/SelectGroups'; -import { SelectGroupsSearchable } from './SelectGroupsSearchable/SelectGroupsSearchable'; -import { SelectGroupsStyles } from './SelectGroupsStyles/SelectGroupsStyles'; -import { SelectCreatable } from './SelectCreatable/SelectCreatable'; +import MultiSelectCreatableCode from './MultiSelectCreatable/code.json'; import { MultiSelectCreatable } from './MultiSelectCreatable/MultiSelectCreatable'; -import { SelectList } from './SelectList/SelectList'; -import { TransferList } from './TransferList/TransferList'; - -import BasicSelectCode from './BasicSelect/code.json'; -import BasicAutocompleteCode from './BasicAutocomplete/code.json'; +import MultiSelectValueRendererCode from './MultiSelectValueRenderer/code.json'; +import { MultiSelectValueRenderer } from './MultiSelectValueRenderer/MultiSelectValueRenderer'; +import SearchableMultiSelectCode from './SearchableMultiSelect/code.json'; +import { SearchableMultiSelect } from './SearchableMultiSelect/SearchableMultiSelect'; import SearchableSelectCode from './SearchableSelect/code.json'; -import AutocompleteLimitCode from './AutocompleteLimit/code.json'; -import AsyncAutocompleteCode from './AsyncAutocomplete/code.json'; -import AutocompleteHighlightCode from './AutocompleteHighlight/code.json'; +import { SearchableSelect } from './SearchableSelect/SearchableSelect'; import SelectActiveCode from './SelectActive/code.json'; -import SelectOptionComponentCode from './SelectOptionComponent/code.json'; -import SelectLimitCode from './SelectLimit/code.json'; +import { SelectActive } from './SelectActive/SelectActive'; import SelectAsyncCode from './SelectAsync/code.json'; -import AutocompleteSelectFirstOptionCode from './AutocompleteSelectFirstOption/code.json'; +import { SelectAsync } from './SelectAsync/SelectAsync'; import SelectClearableCode from './SelectClearable/code.json'; -import DropdownScrollCode from './DropdownScroll/code.json'; -import DropdownScrollAreaCode from './DropdownScrollArea/code.json'; -import AutocompleteDynamicCode from './AutocompleteDynamic/code.json'; -import DropdownAnimationCode from './DropdownAnimation/code.json'; -import DropdownPositionStylesCode from './DropdownPositionStyles/code.json'; +import { SelectClearable } from './SelectClearable/SelectClearable'; +import SelectCreatableCode from './SelectCreatable/code.json'; +import { SelectCreatable } from './SelectCreatable/SelectCreatable'; import SelectDropdownSearchCode from './SelectDropdownSearch/code.json'; -import BasicButtonCode from './BasicButton/code.json'; -import ButtonSearchCode from './ButtonSearch/code.json'; -import DropdownOptionsAnimationCode from './DropdownOptionsAnimation/code.json'; -import SelectOptionOnHoverCode from './SelectOptionOnHover/code.json'; -import SelectedStylesCode from './SelectedStyles/code.json'; -import DropdownFooterCode from './DropdownFooter/code.json'; -import DropdownHeaderCode from './DropdownHeader/code.json'; +import { SelectDropdownSearch } from './SelectDropdownSearch/SelectDropdownSearch'; import SelectedAnimationCode from './SelectedAnimation/code.json'; -import AutocompleteClearableCode from './AutocompleteClearable/code.json'; -import BasicMultiSelectCode from './BasicMultiSelect/code.json'; -import SearchableMultiSelectCode from './SearchableMultiSelect/code.json'; -import DropdownSmoothScrollCode from './DropdownSmoothScroll/code.json'; -import ButtonMultiSelectCode from './ButtonMultiSelect/code.json'; -import MaxSelectedItemsCode from './MaxSelectedItems/code.json'; -import MultiSelectCheckboxCode from './MultiSelectCheckbox/code.json'; -import ActiveOptionsFilterCode from './ActiveOptionsFilter/code.json'; -import MaxDisplayedItemsCode from './MaxDisplayedItems/code.json'; -import MultiSelectValueRendererCode from './MultiSelectValueRenderer/code.json'; +import { SelectedAnimation } from './SelectedAnimation/SelectedAnimation'; +import SelectedStylesCode from './SelectedStyles/code.json'; +import { SelectedStyles } from './SelectedStyles/SelectedStyles'; import SelectGroupsCode from './SelectGroups/code.json'; +import { SelectGroups } from './SelectGroups/SelectGroups'; import SelectGroupsSearchableCode from './SelectGroupsSearchable/code.json'; +import { SelectGroupsSearchable } from './SelectGroupsSearchable/SelectGroupsSearchable'; import SelectGroupsStylesCode from './SelectGroupsStyles/code.json'; -import SelectCreatableCode from './SelectCreatable/code.json'; -import MultiSelectCreatableCode from './MultiSelectCreatable/code.json'; +import { SelectGroupsStyles } from './SelectGroupsStyles/SelectGroupsStyles'; +import SelectLimitCode from './SelectLimit/code.json'; +import { SelectLimit } from './SelectLimit/SelectLimit'; import SelectListCode from './SelectList/code.json'; +import { SelectList } from './SelectList/SelectList'; +import SelectOptionComponentCode from './SelectOptionComponent/code.json'; +import { SelectOptionComponent } from './SelectOptionComponent/SelectOptionComponent'; +import SelectOptionOnHoverCode from './SelectOptionOnHover/code.json'; +import { SelectOptionOnHover } from './SelectOptionOnHover/SelectOptionOnHover'; import TransferListCode from './TransferList/code.json'; +import { TransferList } from './TransferList/TransferList'; interface ComboboxExampleComponent { component: () => JSX.Element; diff --git a/docs/src/components/ColorsGenerator/ColorsGenerator.tsx b/docs/src/components/ColorsGenerator/ColorsGenerator.tsx index 8744e57db84..db6e4a839b4 100644 --- a/docs/src/components/ColorsGenerator/ColorsGenerator.tsx +++ b/docs/src/components/ColorsGenerator/ColorsGenerator.tsx @@ -1,12 +1,12 @@ import React, { useEffect, useState } from 'react'; import { useRouter } from 'next/router'; -import { useLocalStorage } from '@mantine/hooks'; import { generateColorsMap } from '@mantine/colors-generator'; +import { useLocalStorage } from '@mantine/hooks'; import { MdxTitle } from '@/components/MdxProvider'; -import { ColorsList } from './ColorsList/ColorsList'; import { ColorsInput } from './ColorsInput/ColorsInput'; -import { ComponentsPreview } from './ComponentsPreview/ComponentsPreview'; +import { ColorsList } from './ColorsList/ColorsList'; import { ColorsOutput } from './ColorsOutput/ColorsOutput'; +import { ComponentsPreview } from './ComponentsPreview/ComponentsPreview'; export function ColorsGenerator() { const router = useRouter(); diff --git a/docs/src/components/ColorsGenerator/ColorsInput/ColorsInput.tsx b/docs/src/components/ColorsGenerator/ColorsInput/ColorsInput.tsx index d6c1b3abeed..514e46ee0f3 100644 --- a/docs/src/components/ColorsGenerator/ColorsInput/ColorsInput.tsx +++ b/docs/src/components/ColorsGenerator/ColorsInput/ColorsInput.tsx @@ -1,18 +1,18 @@ import React, { useState } from 'react'; import { useRouter } from 'next/router'; +import { IconCheck, IconCopy } from '@tabler/icons-react'; import chroma from 'chroma-js'; -import { IconCopy, IconCheck } from '@tabler/icons-react'; -import { useClipboard } from '@mantine/hooks'; import { - ColorPicker, - TextInput, - Input, Button, + ColorPicker, ColorSwatch, Group, - Switch, + Input, rem, + Switch, + TextInput, } from '@mantine/core'; +import { useClipboard } from '@mantine/hooks'; import { COLORS_PRESET } from './colors-preset'; import classes from './ColorsInput.module.css'; diff --git a/docs/src/components/ColorsGenerator/ComponentsPreview/ComponentsPreview.tsx b/docs/src/components/ColorsGenerator/ComponentsPreview/ComponentsPreview.tsx index 7c2437ee1b2..a3fd2572a62 100644 --- a/docs/src/components/ColorsGenerator/ComponentsPreview/ComponentsPreview.tsx +++ b/docs/src/components/ColorsGenerator/ComponentsPreview/ComponentsPreview.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { MantineColorsTuple, MantineProvider, Button, Input, Table } from '@mantine/core'; +import { Button, Input, MantineColorsTuple, MantineProvider, Table } from '@mantine/core'; import { useDebouncedValue } from '@mantine/hooks'; interface ComponentsPreviewProps { diff --git a/docs/src/components/CssVariablesList/CssVariablesList.tsx b/docs/src/components/CssVariablesList/CssVariablesList.tsx index 61fc4e194d1..e6cdb9c2693 100644 --- a/docs/src/components/CssVariablesList/CssVariablesList.tsx +++ b/docs/src/components/CssVariablesList/CssVariablesList.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { Code, DEFAULT_THEME, defaultCssVariablesResolver, keys } from '@mantine/core'; -import { MdxTitle, MdxDataTable } from '../MdxProvider'; +import { MdxDataTable, MdxTitle } from '../MdxProvider'; export function CssVariablesList() { const resolvedVariables = defaultCssVariablesResolver(DEFAULT_THEME); diff --git a/docs/src/components/CssVariablesTable/CssVariablesTable.tsx b/docs/src/components/CssVariablesTable/CssVariablesTable.tsx index 9b3cf4f8371..a541923f4ea 100644 --- a/docs/src/components/CssVariablesTable/CssVariablesTable.tsx +++ b/docs/src/components/CssVariablesTable/CssVariablesTable.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { DEFAULT_THEME, defaultCssVariablesResolver, Code } from '@mantine/core'; +import { Code, DEFAULT_THEME, defaultCssVariablesResolver } from '@mantine/core'; import { MdxDataTable } from '../MdxProvider'; interface CssVariablesTableProps { diff --git a/docs/src/components/Footer/Footer.tsx b/docs/src/components/Footer/Footer.tsx index a5dd2ecc708..ac74e895097 100644 --- a/docs/src/components/Footer/Footer.tsx +++ b/docs/src/components/Footer/Footer.tsx @@ -1,10 +1,10 @@ import React from 'react'; import cx from 'clsx'; -import { Container, Text, Group, Box, RemoveScroll } from '@mantine/core'; -import { TwitterButton, DiscordButton } from '../SocialButton'; +import { Box, Container, Group, RemoveScroll, Text } from '@mantine/core'; import { Logo } from '../Logo/Logo'; -import { LinksGroup } from './LinksGroup/LinksGroup'; +import { DiscordButton, TwitterButton } from '../SocialButton'; import { FOOTER_LINKS_DATA } from './data'; +import { LinksGroup } from './LinksGroup/LinksGroup'; import classes from './Footer.module.css'; interface FooterProps { diff --git a/docs/src/components/FrameworksGuides/FrameworksGuides.tsx b/docs/src/components/FrameworksGuides/FrameworksGuides.tsx index aa2bd5e07e0..4a2377ff605 100644 --- a/docs/src/components/FrameworksGuides/FrameworksGuides.tsx +++ b/docs/src/components/FrameworksGuides/FrameworksGuides.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { FrameworkLink } from './FrameworkLink/FrameworkLink'; import { FRAMEWORKS_GUIDES_DATA } from './data'; +import { FrameworkLink } from './FrameworkLink/FrameworkLink'; import classes from './FrameworksGuides.module.css'; export function FrameworksGuides() { diff --git a/docs/src/components/HomePage/Banner/Banner.tsx b/docs/src/components/HomePage/Banner/Banner.tsx index 16aa33e30e7..c42d15cdf2a 100644 --- a/docs/src/components/HomePage/Banner/Banner.tsx +++ b/docs/src/components/HomePage/Banner/Banner.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Title, Overlay, Text, Button, Container } from '@mantine/core'; +import { Button, Container, Overlay, Text, Title } from '@mantine/core'; import { GithubIcon } from '@mantinex/dev-icons'; import banner from './banner.webp'; import classes from './Banner.module.css'; diff --git a/docs/src/components/HomePage/Components/Components.tsx b/docs/src/components/HomePage/Components/Components.tsx index b5f4196e2ea..45196d4f1a3 100644 --- a/docs/src/components/HomePage/Components/Components.tsx +++ b/docs/src/components/HomePage/Components/Components.tsx @@ -1,19 +1,19 @@ import React from 'react'; import { - IconForms, - IconCalendar, - IconStack2, IconBold, + IconCalendar, + IconForms, IconNotebook, IconSlideshow, + IconStack2, } from '@tabler/icons-react'; -import { Inputs } from './demos/Inputs'; +import { DemoTabs } from '../DemoTabs/DemoTabs'; +import { Carousel } from './demos/Carousel'; +import { Content } from './demos/Content'; import { Dates } from './demos/Dates'; +import { Inputs } from './demos/Inputs'; import { Overlays } from './demos/Overlays'; -import { Content } from './demos/Content'; import { RichText } from './demos/RichText'; -import { Carousel } from './demos/Carousel'; -import { DemoTabs } from '../DemoTabs/DemoTabs'; const data = [ { demo: Inputs, icon: IconForms, name: 'Inputs', description: '20+ input components' }, diff --git a/docs/src/components/HomePage/Components/demos/Carousel.tsx b/docs/src/components/HomePage/Components/demos/Carousel.tsx index 2ee2d9fd9e4..0943f82c80e 100644 --- a/docs/src/components/HomePage/Components/demos/Carousel.tsx +++ b/docs/src/components/HomePage/Components/demos/Carousel.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { CarouselCardsDemos } from '@docs/demos'; import { Embla, useAnimationOffsetEffect } from '@mantine/carousel'; +import { CarouselCardsDemos } from '@docs/demos'; export function Carousel() { const [embla, setEmbla] = useState(null); diff --git a/docs/src/components/HomePage/Components/demos/Content.tsx b/docs/src/components/HomePage/Components/demos/Content.tsx index af8ee4b1f76..82b4e4a34e6 100644 --- a/docs/src/components/HomePage/Components/demos/Content.tsx +++ b/docs/src/components/HomePage/Components/demos/Content.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Text, Box } from '@mantine/core'; +import { Box, Text } from '@mantine/core'; import { AccordionDemo, TimelineBase } from '@docs/demos'; export function Content() { diff --git a/docs/src/components/HomePage/Components/demos/Dates.tsx b/docs/src/components/HomePage/Components/demos/Dates.tsx index a0e086f646c..63201ad594c 100644 --- a/docs/src/components/HomePage/Components/demos/Dates.tsx +++ b/docs/src/components/HomePage/Components/demos/Dates.tsx @@ -1,7 +1,7 @@ -import React from 'react'; -import { Paper, SimpleGrid, Input } from '@mantine/core'; -import { DatePickerInput, TimeInput, DatePicker, DateTimePicker } from '@mantine/dates'; import dayjs from 'dayjs'; +import React from 'react'; +import { Input, Paper, SimpleGrid } from '@mantine/core'; +import { DatePicker, DatePickerInput, DateTimePicker, TimeInput } from '@mantine/dates'; import classes from './Demos.module.css'; function CalendarWrapper() { diff --git a/docs/src/components/HomePage/Components/demos/Inputs.tsx b/docs/src/components/HomePage/Components/demos/Inputs.tsx index 69b794c2548..57c54f76022 100644 --- a/docs/src/components/HomePage/Components/demos/Inputs.tsx +++ b/docs/src/components/HomePage/Components/demos/Inputs.tsx @@ -1,13 +1,13 @@ import React from 'react'; import { - SimpleGrid, - TextInput, - PasswordInput, + Autocomplete, ColorInput, - Select, - NativeSelect, MultiSelect, - Autocomplete, + NativeSelect, + PasswordInput, + Select, + SimpleGrid, + TextInput, } from '@mantine/core'; export function Inputs() { diff --git a/docs/src/components/HomePage/Components/demos/Overlays.tsx b/docs/src/components/HomePage/Components/demos/Overlays.tsx index 3a91be90f02..43c7b7bbadd 100644 --- a/docs/src/components/HomePage/Components/demos/Overlays.tsx +++ b/docs/src/components/HomePage/Components/demos/Overlays.tsx @@ -1,19 +1,19 @@ import React, { useState } from 'react'; -import { IconPhoto, IconMessageCircle, IconSettings } from '@tabler/icons-react'; +import { IconMessageCircle, IconPhoto, IconSettings } from '@tabler/icons-react'; import { - Text, - Group, + Box, Button, - Modal, - Drawer, - Divider, CloseButton, + Divider, + Drawer, + Group, + Modal, + Pagination, Popover, SimpleGrid, - Tabs, Stepper, - Pagination, - Box, + Tabs, + Text, } from '@mantine/core'; import { AuthenticationForm, HoverCardHomePageDemo } from '@docs/demos'; diff --git a/docs/src/components/HomePage/CustomizeStyles/CustomizeStyles.tsx b/docs/src/components/HomePage/CustomizeStyles/CustomizeStyles.tsx index d385ad41054..dac7a3ba4bd 100644 --- a/docs/src/components/HomePage/CustomizeStyles/CustomizeStyles.tsx +++ b/docs/src/components/HomePage/CustomizeStyles/CustomizeStyles.tsx @@ -1,13 +1,13 @@ import React from 'react'; import Link from 'next/link'; import { IconArrowRight } from '@tabler/icons-react'; -import { Text, SimpleGrid, Slider, Button, rem } from '@mantine/core'; -import { CodeHighlightTabs, CodeHighlight } from '@mantinex/shiki'; +import { Button, rem, SimpleGrid, Slider, Text } from '@mantine/core'; import { getCodeFileIcon } from '@mantinex/dev-icons'; +import { CodeHighlight, CodeHighlightTabs } from '@mantinex/shiki'; import { SliderStylesApi } from '@docs/styles-api'; import { MdxDataTable } from '../../MdxProvider/MdxDataTable/MdxDataTable'; import { PageSection } from '../PageSection/PageSection'; -import { CustomizeSliderDemo, code } from './CustomizeSlider.demo'; +import { code, CustomizeSliderDemo } from './CustomizeSlider.demo'; import classes from './CustomizeStyles.module.css'; const marks = [ diff --git a/docs/src/components/HomePage/CustomizeWithProps/CustomizeWithProps.tsx b/docs/src/components/HomePage/CustomizeWithProps/CustomizeWithProps.tsx index 18e85d2a22d..6b81056c349 100644 --- a/docs/src/components/HomePage/CustomizeWithProps/CustomizeWithProps.tsx +++ b/docs/src/components/HomePage/CustomizeWithProps/CustomizeWithProps.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Box } from '@mantine/core'; -import { TimelineDemos } from '@docs/demos'; import { Demo } from '@mantinex/demo'; +import { TimelineDemos } from '@docs/demos'; import { PageSection } from '../PageSection/PageSection'; import classes from './CustomizeWithProps.module.css'; diff --git a/docs/src/components/HomePage/DarkTheme/DarkTheme.tsx b/docs/src/components/HomePage/DarkTheme/DarkTheme.tsx index dc83fa87b78..999a37e5eef 100644 --- a/docs/src/components/HomePage/DarkTheme/DarkTheme.tsx +++ b/docs/src/components/HomePage/DarkTheme/DarkTheme.tsx @@ -1,10 +1,10 @@ import React from 'react'; -import { Button, Image, SimpleGrid, Text, useMantineColorScheme, Group } from '@mantine/core'; -import { CodeHighlight } from '@mantinex/shiki'; import { IconMoonStars, IconSun } from '@tabler/icons-react'; +import { Button, Group, Image, SimpleGrid, Text, useMantineColorScheme } from '@mantine/core'; +import { CodeHighlight } from '@mantinex/shiki'; import { PageSection } from '../PageSection/PageSection'; -import classes from './DarkTheme.module.css'; import image from './dark-theme-image.png'; +import classes from './DarkTheme.module.css'; export function DarkTheme() { const { toggleColorScheme } = useMantineColorScheme(); diff --git a/docs/src/components/HomePage/DemoTabs/DemoTabs.tsx b/docs/src/components/HomePage/DemoTabs/DemoTabs.tsx index 75f8a152450..06d6db6876a 100644 --- a/docs/src/components/HomePage/DemoTabs/DemoTabs.tsx +++ b/docs/src/components/HomePage/DemoTabs/DemoTabs.tsx @@ -1,6 +1,6 @@ -import React, { useState, useRef } from 'react'; -import { Container, Grid, UnstyledButton, Text, Box, rem, useMantineTheme } from '@mantine/core'; +import React, { useRef, useState } from 'react'; import { IconForms } from '@tabler/icons-react'; +import { Box, Container, Grid, rem, Text, UnstyledButton, useMantineTheme } from '@mantine/core'; import { useMediaQuery } from '@mantine/hooks'; import { SectionTitle } from '../SectionTitle/SectionTitle'; import classes from './DemoTabs.module.css'; diff --git a/docs/src/components/HomePage/HomePage.tsx b/docs/src/components/HomePage/HomePage.tsx index 7691d98e564..dad36faf55c 100644 --- a/docs/src/components/HomePage/HomePage.tsx +++ b/docs/src/components/HomePage/HomePage.tsx @@ -1,18 +1,18 @@ import React from 'react'; import Head from 'next/head'; -import { Shell } from '../Shell'; import { Footer } from '../Footer'; -import { Jumbotron } from './Jumbotron/Jumbotron'; -import { Waves } from './Waves/Waves'; +import { Shell } from '../Shell'; +import { Banner } from './Banner/Banner'; import { Components } from './Components/Components'; -import { DarkTheme } from './DarkTheme/DarkTheme'; -import { CustomizeWithProps } from './CustomizeWithProps/CustomizeWithProps'; import { CustomizeStyles } from './CustomizeStyles/CustomizeStyles'; -import { Theming } from './Theming/Theming'; -import { Banner } from './Banner/Banner'; +import { CustomizeWithProps } from './CustomizeWithProps/CustomizeWithProps'; +import { DarkTheme } from './DarkTheme/DarkTheme'; import { Hooks } from './Hooks/Hooks'; -import { Usage } from './Usage/Usage'; import { JoinCommunity } from './JoinCommunity/JoinCommunity'; +import { Jumbotron } from './Jumbotron/Jumbotron'; +import { Theming } from './Theming/Theming'; +import { Usage } from './Usage/Usage'; +import { Waves } from './Waves/Waves'; import classes from './HomePage.module.css'; export function HomePage() { diff --git a/docs/src/components/HomePage/Hooks/Hooks.tsx b/docs/src/components/HomePage/Hooks/Hooks.tsx index 76e71cbc356..1f1e7ab3d16 100644 --- a/docs/src/components/HomePage/Hooks/Hooks.tsx +++ b/docs/src/components/HomePage/Hooks/Hooks.tsx @@ -1,5 +1,4 @@ import React from 'react'; -import { Box } from '@mantine/core'; import { IconArrowsMaximize, IconClock, @@ -8,6 +7,7 @@ import { IconMaximize, IconResize, } from '@tabler/icons-react'; +import { Box } from '@mantine/core'; import { Demo } from '@mantinex/demo'; import { FormDemos, HooksDemos } from '@docs/demos'; import { DemoTabs } from '../DemoTabs/DemoTabs'; diff --git a/docs/src/components/HomePage/JoinCommunity/JoinCommunity.tsx b/docs/src/components/HomePage/JoinCommunity/JoinCommunity.tsx index 0c3f4f5ef84..b84bc2d2c26 100644 --- a/docs/src/components/HomePage/JoinCommunity/JoinCommunity.tsx +++ b/docs/src/components/HomePage/JoinCommunity/JoinCommunity.tsx @@ -1,5 +1,5 @@ -import { Space } from '@mantine/core'; import React from 'react'; +import { Space } from '@mantine/core'; import { SocialCards } from '../../SocialCards'; import { PageSection } from '../PageSection/PageSection'; diff --git a/docs/src/components/HomePage/Jumbotron/Jumbotron.tsx b/docs/src/components/HomePage/Jumbotron/Jumbotron.tsx index 879f5d2174d..62ae6c3a6e9 100644 --- a/docs/src/components/HomePage/Jumbotron/Jumbotron.tsx +++ b/docs/src/components/HomePage/Jumbotron/Jumbotron.tsx @@ -1,9 +1,9 @@ import React from 'react'; import Link from 'next/link'; -import { Container, Group, Button, Text, SimpleGrid, rem } from '@mantine/core'; +import { Button, Container, Group, rem, SimpleGrid, Text } from '@mantine/core'; import { GithubIcon } from '@mantinex/dev-icons'; -import { Hero } from './Hero'; import { FEATURES_DATA } from './features'; +import { Hero } from './Hero'; import classes from './Jumbotron.module.css'; export function Jumbotron() { diff --git a/docs/src/components/HomePage/Jumbotron/features.ts b/docs/src/components/HomePage/Jumbotron/features.ts index 35459eddb36..84e17a0e608 100644 --- a/docs/src/components/HomePage/Jumbotron/features.ts +++ b/docs/src/components/HomePage/Jumbotron/features.ts @@ -1,4 +1,4 @@ -import { IconScale, IconRocket, IconLifebuoy } from '@tabler/icons-react'; +import { IconLifebuoy, IconRocket, IconScale } from '@tabler/icons-react'; export const FEATURES_DATA = [ { diff --git a/docs/src/components/HomePage/PageSection/PageSection.tsx b/docs/src/components/HomePage/PageSection/PageSection.tsx index dcc57d904a6..8befb48f3d9 100644 --- a/docs/src/components/HomePage/PageSection/PageSection.tsx +++ b/docs/src/components/HomePage/PageSection/PageSection.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Container, Text, BoxProps, ElementProps, Box } from '@mantine/core'; +import { Box, BoxProps, Container, ElementProps, Text } from '@mantine/core'; import { SectionTitle } from '../SectionTitle/SectionTitle'; import classes from './PageSection.module.css'; diff --git a/docs/src/components/HomePage/Theming/Theming.tsx b/docs/src/components/HomePage/Theming/Theming.tsx index 00663045ac1..6e154658f12 100644 --- a/docs/src/components/HomePage/Theming/Theming.tsx +++ b/docs/src/components/HomePage/Theming/Theming.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Group, Button, Badge } from '@mantine/core'; +import { Badge, Button, Group } from '@mantine/core'; import { CodeHighlight } from '@mantinex/shiki'; import { PageSection } from '../PageSection/PageSection'; import classes from './Theming.module.css'; diff --git a/docs/src/components/HotKeysHandler/HotKeysHandler.tsx b/docs/src/components/HotKeysHandler/HotKeysHandler.tsx index fac00189d4f..f083e9ed13b 100644 --- a/docs/src/components/HotKeysHandler/HotKeysHandler.tsx +++ b/docs/src/components/HotKeysHandler/HotKeysHandler.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { useRouter } from 'next/router'; +import { useComputedColorScheme, useDirection, useMantineColorScheme } from '@mantine/core'; import { useHotkeys } from '@mantine/hooks'; -import { useMantineColorScheme, useComputedColorScheme, useDirection } from '@mantine/core'; const EXCLUDE_RTL = ['/combobox']; diff --git a/docs/src/components/HtmlText/HtmlText.tsx b/docs/src/components/HtmlText/HtmlText.tsx index 32fc9fa935d..07c3a1ead4c 100644 --- a/docs/src/components/HtmlText/HtmlText.tsx +++ b/docs/src/components/HtmlText/HtmlText.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Text, TextProps, ElementProps } from '@mantine/core'; +import { ElementProps, Text, TextProps } from '@mantine/core'; interface HtmlTextProps extends TextProps, ElementProps<'span', 'color'> { children: string; diff --git a/docs/src/components/Logo/Logo.tsx b/docs/src/components/Logo/Logo.tsx index 08950cb7c20..ac87858e9f3 100644 --- a/docs/src/components/Logo/Logo.tsx +++ b/docs/src/components/Logo/Logo.tsx @@ -1,7 +1,7 @@ import React from 'react'; import Link from 'next/link'; import cx from 'clsx'; -import { VisuallyHidden, FOCUS_CLASS_NAMES } from '@mantine/core'; +import { FOCUS_CLASS_NAMES, VisuallyHidden } from '@mantine/core'; import { MantineLogo, MantineLogoProps } from '@mantinex/mantine-logo'; import classes from './Logo.module.css'; diff --git a/docs/src/components/LogoAssets/LogoAsset/LogoAsset.tsx b/docs/src/components/LogoAssets/LogoAsset/LogoAsset.tsx index e30beb45a5f..562027f9bb4 100644 --- a/docs/src/components/LogoAssets/LogoAsset/LogoAsset.tsx +++ b/docs/src/components/LogoAssets/LogoAsset/LogoAsset.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Group, Button } from '@mantine/core'; +import { Button, Group } from '@mantine/core'; import { useClipboard } from '@mantine/hooks'; import classes from './LogoAsset.module.css'; diff --git a/docs/src/components/LogoAssets/LogoAssets.tsx b/docs/src/components/LogoAssets/LogoAssets.tsx index abc477aa20d..77e5d8e3ec9 100644 --- a/docs/src/components/LogoAssets/LogoAssets.tsx +++ b/docs/src/components/LogoAssets/LogoAssets.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { LogoAsset } from './LogoAsset/LogoAsset'; import { logos } from './assets'; +import { LogoAsset } from './LogoAsset/LogoAsset'; import classes from './LogoAssets.module.css'; export function LogoAssets() { diff --git a/docs/src/components/LogoAssets/assets/index.ts b/docs/src/components/LogoAssets/assets/index.ts index 5e59dc35ead..f0b5e875591 100644 --- a/docs/src/components/LogoAssets/assets/index.ts +++ b/docs/src/components/LogoAssets/assets/index.ts @@ -1,7 +1,7 @@ +import { LogoAssetProps } from '../LogoAsset/LogoAsset'; import logoFull from './mantine-logo-full.svg'; import logoWhite from './mantine-logo-white.svg'; import logo from './mantine-logo.svg'; -import { LogoAssetProps } from '../LogoAsset/LogoAsset'; export const logos: LogoAssetProps[] = [ { diff --git a/docs/src/components/MdxLayout/MdxLayout.tsx b/docs/src/components/MdxLayout/MdxLayout.tsx index d38f376bbd5..37f4e49d133 100644 --- a/docs/src/components/MdxLayout/MdxLayout.tsx +++ b/docs/src/components/MdxLayout/MdxLayout.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { Frontmatter } from '@/types'; import { MdxPage } from '@/components/MdxPage'; +import { Frontmatter } from '@/types'; import { PageHead } from '../PageHead'; interface MdxLayoutProps { diff --git a/docs/src/components/MdxPage/MdxPage.tsx b/docs/src/components/MdxPage/MdxPage.tsx index 53da57083b1..37858d75f2c 100644 --- a/docs/src/components/MdxPage/MdxPage.tsx +++ b/docs/src/components/MdxPage/MdxPage.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { MdxPageHeader } from '@/components/MdxPageHeader'; -import { MdxTabs } from '@/components/MdxTabs'; import { MdxRawContent } from '@/components/MdxRawContent'; +import { MdxTabs } from '@/components/MdxTabs'; import { Frontmatter } from '@/types'; interface MdxPageProps { diff --git a/docs/src/components/MdxPageHeader/ImportStatement/ImportStatement.tsx b/docs/src/components/MdxPageHeader/ImportStatement/ImportStatement.tsx index 47729fc4a3d..94e430382de 100644 --- a/docs/src/components/MdxPageHeader/ImportStatement/ImportStatement.tsx +++ b/docs/src/components/MdxPageHeader/ImportStatement/ImportStatement.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { em, Tooltip, UnstyledButton } from '@mantine/core'; import { InlineCodeHighlight } from '@mantine/code-highlight'; +import { em, Tooltip, UnstyledButton } from '@mantine/core'; import { useClipboard, useMediaQuery } from '@mantine/hooks'; import { HeaderItem } from '../HeaderItem/HeaderItem'; import classes from './ImportStatement.module.css'; diff --git a/docs/src/components/MdxPageHeader/MdxPageHeader.tsx b/docs/src/components/MdxPageHeader/MdxPageHeader.tsx index cd89c7f304e..82001f5cd33 100644 --- a/docs/src/components/MdxPageHeader/MdxPageHeader.tsx +++ b/docs/src/components/MdxPageHeader/MdxPageHeader.tsx @@ -1,11 +1,11 @@ import React from 'react'; -import { Box, Title, Text, rem } from '@mantine/core'; -import { GithubIcon, NpmIcon } from '@mantinex/dev-icons'; import { IconCalendar, IconLicense, IconPencil, IconSwitch2 } from '@tabler/icons-react'; +import { Box, rem, Text, Title } from '@mantine/core'; +import { GithubIcon, NpmIcon } from '@mantinex/dev-icons'; import { Frontmatter } from '@/types'; +import { ImportStatement } from './ImportStatement/ImportStatement'; import { LinkItem } from './LinkItem/LinkItem'; import classes from './MdxPageHeader.module.css'; -import { ImportStatement } from './ImportStatement/ImportStatement'; const REPO_BASE = 'https://github.com/mantinedev/mantine/blob/master'; const DOCS_BASE = `${REPO_BASE}/docs/src/pages`; diff --git a/docs/src/components/MdxProvider/MdxDataTable/MdxDataTable.tsx b/docs/src/components/MdxProvider/MdxDataTable/MdxDataTable.tsx index f9489216525..56d5409d883 100644 --- a/docs/src/components/MdxProvider/MdxDataTable/MdxDataTable.tsx +++ b/docs/src/components/MdxProvider/MdxDataTable/MdxDataTable.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Table, rem } from '@mantine/core'; +import { rem, Table } from '@mantine/core'; import { DocsSection } from '@/components/DocsSection'; interface DataTableProps { diff --git a/docs/src/components/MdxProvider/MdxExamplesButton/MdxExamplesButton.tsx b/docs/src/components/MdxProvider/MdxExamplesButton/MdxExamplesButton.tsx index 330a9b9088d..a518c9e4390 100644 --- a/docs/src/components/MdxProvider/MdxExamplesButton/MdxExamplesButton.tsx +++ b/docs/src/components/MdxProvider/MdxExamplesButton/MdxExamplesButton.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { Button, rem } from '@mantine/core'; import { IconExternalLink } from '@tabler/icons-react'; +import { Button, rem } from '@mantine/core'; interface MdxExamplesButtonProps { label: string; diff --git a/docs/src/components/MdxProvider/MdxInfo/MdxInfo.tsx b/docs/src/components/MdxProvider/MdxInfo/MdxInfo.tsx index 7bb6ddc34f7..aa4a65b99f5 100644 --- a/docs/src/components/MdxProvider/MdxInfo/MdxInfo.tsx +++ b/docs/src/components/MdxProvider/MdxInfo/MdxInfo.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import cx from 'clsx'; import { IconInfoCircle } from '@tabler/icons-react'; +import cx from 'clsx'; import { Blockquote, BlockquoteProps, rgba, useMantineTheme } from '@mantine/core'; import classes from './MdxInfo.module.css'; diff --git a/docs/src/components/MdxProvider/MdxKeyboardEventsTable/MdxKeyboardEventsTable.tsx b/docs/src/components/MdxProvider/MdxKeyboardEventsTable/MdxKeyboardEventsTable.tsx index 7481c608908..052e7220dd6 100644 --- a/docs/src/components/MdxProvider/MdxKeyboardEventsTable/MdxKeyboardEventsTable.tsx +++ b/docs/src/components/MdxProvider/MdxKeyboardEventsTable/MdxKeyboardEventsTable.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Kbd, Table, Code, rem } from '@mantine/core'; +import { Code, Kbd, rem, Table } from '@mantine/core'; interface KeyboardEventsTableProps { data: { key: string; description: string; condition: string }[]; diff --git a/docs/src/components/MdxProvider/MdxNpmScript/MdxNpmScript.tsx b/docs/src/components/MdxProvider/MdxNpmScript/MdxNpmScript.tsx index 7788ce2f09d..0aa544feac0 100644 --- a/docs/src/components/MdxProvider/MdxNpmScript/MdxNpmScript.tsx +++ b/docs/src/components/MdxProvider/MdxNpmScript/MdxNpmScript.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { useLocalStorage } from '@mantine/hooks'; +import { NpmIcon, YarnIcon } from '@mantinex/dev-icons'; import { CodeHighlightTabs } from '@mantinex/shiki'; -import { YarnIcon, NpmIcon } from '@mantinex/dev-icons'; import classes from './MdxNpmScript.module.css'; interface MdxNpmScriptProps { diff --git a/docs/src/components/MdxProvider/MdxPackagesInstallation/MdxPackagesInstallation.tsx b/docs/src/components/MdxProvider/MdxPackagesInstallation/MdxPackagesInstallation.tsx index 06684d85fce..c61b0ae63ad 100644 --- a/docs/src/components/MdxProvider/MdxPackagesInstallation/MdxPackagesInstallation.tsx +++ b/docs/src/components/MdxProvider/MdxPackagesInstallation/MdxPackagesInstallation.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Checkbox, Code, Text, Table } from '@mantine/core'; +import { Checkbox, Code, Table, Text } from '@mantine/core'; import { MdxInstallScript } from '../MdxInstallScript/MdxInstallScript'; import { MdxParagraph } from '../MdxTypography/MdxTypography'; import { PACKAGES_DATA } from './data'; diff --git a/docs/src/components/MdxProvider/MdxProvider.tsx b/docs/src/components/MdxProvider/MdxProvider.tsx index dcf83042dcd..a01fd7b72f2 100644 --- a/docs/src/components/MdxProvider/MdxProvider.tsx +++ b/docs/src/components/MdxProvider/MdxProvider.tsx @@ -1,37 +1,37 @@ import React from 'react'; -import { Demo } from '@mantinex/demo'; import { MDXProvider } from '@mdx-js/react'; +import { Demo } from '@mantinex/demo'; import { MdxDataTable } from './MdxDataTable/MdxDataTable'; -import { MdxPre } from './MdxPre/MdxPre'; -import { MdxLink } from './MdxLink/MdxLink'; -import { MdxParagraph, MdxLi, MdxUl, MdxCode } from './MdxTypography/MdxTypography'; -import { h } from './MdxTitle/MdxTitle'; +import { MdxExamplesButton } from './MdxExamplesButton/MdxExamplesButton'; import { MdxInfo } from './MdxInfo/MdxInfo'; -import { MdxKeyboardEventsTable } from './MdxKeyboardEventsTable/MdxKeyboardEventsTable'; import { MdxInstallScript } from './MdxInstallScript/MdxInstallScript'; -import { MdxPackagesInstallation } from './MdxPackagesInstallation/MdxPackagesInstallation'; +import { MdxKeyboardEventsTable } from './MdxKeyboardEventsTable/MdxKeyboardEventsTable'; +import { MdxLink } from './MdxLink/MdxLink'; import { MdxNpmScript } from './MdxNpmScript/MdxNpmScript'; -import { MdxTemplatesList } from './MdxTemplatesList/MdxTemplatesList'; -import { MdxExamplesButton } from './MdxExamplesButton/MdxExamplesButton'; +import { MdxPackagesInstallation } from './MdxPackagesInstallation/MdxPackagesInstallation'; +import { MdxPre } from './MdxPre/MdxPre'; import { - MdxGetElementRef, - MdxPolymorphic, - MdxTargetComponent, - MdxInputFeatures, - MdxInputAccessibility, - MdxFlexboxGapSupport, - MdxGradient, - MdxStylesApiSelectors, - MdxGetTemplates, - MdxComboboxDisclaimer, MdxComboboxData, - MdxComboboxLargeData, + MdxComboboxDisclaimer, MdxComboboxFiltering, + MdxComboboxLargeData, MdxComboboxProps, + MdxFlexboxGapSupport, + MdxGetElementRef, + MdxGetTemplates, + MdxGradient, + MdxInputAccessibility, + MdxInputFeatures, + MdxInputSections, + MdxPolymorphic, MdxServerComponentsIncompatible, + MdxStylesApiSelectors, + MdxTargetComponent, MdxWrapperProps, - MdxInputSections, } from './MdxSharedContent'; +import { MdxTemplatesList } from './MdxTemplatesList/MdxTemplatesList'; +import { h } from './MdxTitle/MdxTitle'; +import { MdxCode, MdxLi, MdxParagraph, MdxUl } from './MdxTypography/MdxTypography'; export function MdxProvider({ children }: { children: React.ReactNode }) { return ( diff --git a/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxData.tsx b/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxData.tsx index 011aa9a7b62..dcec49abde0 100644 --- a/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxData.tsx +++ b/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxData.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MdxParagraph, MdxCode } from '../MdxTypography/MdxTypography'; import { MdxCodeHighlight } from '../MdxPre/MdxPre'; import { MdxTitle } from '../MdxTitle/MdxTitle'; +import { MdxCode, MdxParagraph } from '../MdxTypography/MdxTypography'; interface MdxComboboxDataProps { component: string; diff --git a/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxDisclaimer.tsx b/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxDisclaimer.tsx index 56d664eec34..84e3d203e32 100644 --- a/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxDisclaimer.tsx +++ b/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxDisclaimer.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MdxParagraph, MdxCode } from '../MdxTypography/MdxTypography'; import { MdxLink } from '../MdxLink/MdxLink'; import { MdxTitle } from '../MdxTitle/MdxTitle'; +import { MdxCode, MdxParagraph } from '../MdxTypography/MdxTypography'; interface MdxComboboxDisclaimerProps { component: string; diff --git a/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxFiltering.tsx b/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxFiltering.tsx index d94f1a766eb..4095e5b17fe 100644 --- a/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxFiltering.tsx +++ b/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxFiltering.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MdxParagraph, MdxCode, MdxLi, MdxUl } from '../MdxTypography/MdxTypography'; import { MdxTitle } from '../MdxTitle/MdxTitle'; +import { MdxCode, MdxLi, MdxParagraph, MdxUl } from '../MdxTypography/MdxTypography'; interface MdxComboboxFilteringProps { component: string; diff --git a/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxLargeData.tsx b/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxLargeData.tsx index cec0554d087..40040e4365a 100644 --- a/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxLargeData.tsx +++ b/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxLargeData.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MdxParagraph, MdxCode } from '../MdxTypography/MdxTypography'; import { MdxTitle } from '../MdxTitle/MdxTitle'; +import { MdxCode, MdxParagraph } from '../MdxTypography/MdxTypography'; interface MdxComboboxLargeDataProps { component: string; diff --git a/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxProps.tsx b/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxProps.tsx index dcac3d182e8..3892063b29f 100644 --- a/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxProps.tsx +++ b/docs/src/components/MdxProvider/MdxSharedContent/MdxComboboxProps.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import { MdxParagraph, MdxCode } from '../MdxTypography/MdxTypography'; +import { MdxLink } from '../MdxLink/MdxLink'; import { MdxCodeHighlight } from '../MdxPre/MdxPre'; import { MdxTitle } from '../MdxTitle/MdxTitle'; -import { MdxLink } from '../MdxLink/MdxLink'; +import { MdxCode, MdxParagraph } from '../MdxTypography/MdxTypography'; const getPortalCode = (component: string) => ` import { ${component} } from '@mantine/core'; diff --git a/docs/src/components/MdxProvider/MdxSharedContent/MdxFlexboxGapSupport.tsx b/docs/src/components/MdxProvider/MdxSharedContent/MdxFlexboxGapSupport.tsx index 96698783969..6af9c195d1b 100644 --- a/docs/src/components/MdxProvider/MdxSharedContent/MdxFlexboxGapSupport.tsx +++ b/docs/src/components/MdxProvider/MdxSharedContent/MdxFlexboxGapSupport.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MdxParagraph, MdxCode } from '../MdxTypography/MdxTypography'; import { MdxLink } from '../MdxLink/MdxLink'; import { MdxTitle } from '../MdxTitle/MdxTitle'; +import { MdxCode, MdxParagraph } from '../MdxTypography/MdxTypography'; interface MdxFlexboxGapSupportProps { component: string; diff --git a/docs/src/components/MdxProvider/MdxSharedContent/MdxGetElementRef.tsx b/docs/src/components/MdxProvider/MdxSharedContent/MdxGetElementRef.tsx index 0e558f5a1b3..a202958e257 100644 --- a/docs/src/components/MdxProvider/MdxSharedContent/MdxGetElementRef.tsx +++ b/docs/src/components/MdxProvider/MdxSharedContent/MdxGetElementRef.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MdxTitle } from '../MdxTitle/MdxTitle'; import { MdxCodeHighlight } from '../MdxPre/MdxPre'; +import { MdxTitle } from '../MdxTitle/MdxTitle'; interface MdxGetElementRefProps { component: string; diff --git a/docs/src/components/MdxProvider/MdxSharedContent/MdxGetTemplates.tsx b/docs/src/components/MdxProvider/MdxSharedContent/MdxGetTemplates.tsx index 1b6c5f0d49d..fce8bfb8453 100644 --- a/docs/src/components/MdxProvider/MdxSharedContent/MdxGetTemplates.tsx +++ b/docs/src/components/MdxProvider/MdxSharedContent/MdxGetTemplates.tsx @@ -1,9 +1,9 @@ import React from 'react'; +import { MdxLink } from '../MdxLink/MdxLink'; import { Template } from '../MdxTemplatesList/data'; import { MdxTemplatesList } from '../MdxTemplatesList/MdxTemplatesList'; import { MdxTitle } from '../MdxTitle/MdxTitle'; import { MdxParagraph } from '../MdxTypography/MdxTypography'; -import { MdxLink } from '../MdxLink/MdxLink'; interface MdxGetTemplatesProps { type: Template['type']; diff --git a/docs/src/components/MdxProvider/MdxSharedContent/MdxGradient.tsx b/docs/src/components/MdxProvider/MdxSharedContent/MdxGradient.tsx index 1a6cf19032f..34b2dc874e8 100644 --- a/docs/src/components/MdxProvider/MdxSharedContent/MdxGradient.tsx +++ b/docs/src/components/MdxProvider/MdxSharedContent/MdxGradient.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MdxParagraph, MdxCode } from '../MdxTypography/MdxTypography'; -import { MdxTitle } from '../MdxTitle/MdxTitle'; import { MdxLink } from '../MdxLink/MdxLink'; +import { MdxTitle } from '../MdxTitle/MdxTitle'; +import { MdxCode, MdxParagraph } from '../MdxTypography/MdxTypography'; interface MdxGradientProps { component: string; diff --git a/docs/src/components/MdxProvider/MdxSharedContent/MdxInputAccessibility.tsx b/docs/src/components/MdxProvider/MdxSharedContent/MdxInputAccessibility.tsx index 2b55df15853..302a886a44e 100644 --- a/docs/src/components/MdxProvider/MdxSharedContent/MdxInputAccessibility.tsx +++ b/docs/src/components/MdxProvider/MdxSharedContent/MdxInputAccessibility.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MdxParagraph, MdxCode } from '../MdxTypography/MdxTypography'; import { MdxCodeHighlight } from '../MdxPre/MdxPre'; import { MdxTitle } from '../MdxTitle/MdxTitle'; +import { MdxCode, MdxParagraph } from '../MdxTypography/MdxTypography'; interface MdxInputAccessibilityProps { component: string; diff --git a/docs/src/components/MdxProvider/MdxSharedContent/MdxInputFeatures.tsx b/docs/src/components/MdxProvider/MdxSharedContent/MdxInputFeatures.tsx index 316de942f83..413a09affc4 100644 --- a/docs/src/components/MdxProvider/MdxSharedContent/MdxInputFeatures.tsx +++ b/docs/src/components/MdxProvider/MdxSharedContent/MdxInputFeatures.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MdxParagraph, MdxCode } from '../MdxTypography/MdxTypography'; import { MdxLink } from '../MdxLink/MdxLink'; +import { MdxCode, MdxParagraph } from '../MdxTypography/MdxTypography'; interface MdxInputFeaturesProps { component: string; diff --git a/docs/src/components/MdxProvider/MdxSharedContent/MdxInputSections.tsx b/docs/src/components/MdxProvider/MdxSharedContent/MdxInputSections.tsx index 5fdc18bee4a..0507a368472 100644 --- a/docs/src/components/MdxProvider/MdxSharedContent/MdxInputSections.tsx +++ b/docs/src/components/MdxProvider/MdxSharedContent/MdxInputSections.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MdxParagraph, MdxCode, MdxLi, MdxUl } from '../MdxTypography/MdxTypography'; import { MdxTitle } from '../MdxTitle/MdxTitle'; +import { MdxCode, MdxLi, MdxParagraph, MdxUl } from '../MdxTypography/MdxTypography'; interface MdxInputSectionsProps { component: string; diff --git a/docs/src/components/MdxProvider/MdxSharedContent/MdxPolymorphic.tsx b/docs/src/components/MdxProvider/MdxSharedContent/MdxPolymorphic.tsx index f43f092969f..fcdefdfc937 100644 --- a/docs/src/components/MdxProvider/MdxSharedContent/MdxPolymorphic.tsx +++ b/docs/src/components/MdxProvider/MdxSharedContent/MdxPolymorphic.tsx @@ -1,10 +1,10 @@ import React from 'react'; import { TypeScriptCircleIcon } from '@mantinex/dev-icons'; -import { MdxTitle } from '../MdxTitle/MdxTitle'; -import { MdxCodeHighlight } from '../MdxPre/MdxPre'; -import { MdxParagraph, MdxCode } from '../MdxTypography/MdxTypography'; -import { MdxLink } from '../MdxLink/MdxLink'; import { MdxInfo } from '../MdxInfo/MdxInfo'; +import { MdxLink } from '../MdxLink/MdxLink'; +import { MdxCodeHighlight } from '../MdxPre/MdxPre'; +import { MdxTitle } from '../MdxTitle/MdxTitle'; +import { MdxCode, MdxParagraph } from '../MdxTypography/MdxTypography'; interface MdxPolymorphicProps { component: string; diff --git a/docs/src/components/MdxProvider/MdxSharedContent/MdxServerComponentsIncompatible.tsx b/docs/src/components/MdxProvider/MdxSharedContent/MdxServerComponentsIncompatible.tsx index fa0fea7657d..8702981d4e3 100644 --- a/docs/src/components/MdxProvider/MdxSharedContent/MdxServerComponentsIncompatible.tsx +++ b/docs/src/components/MdxProvider/MdxSharedContent/MdxServerComponentsIncompatible.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MdxParagraph, MdxCode } from '../MdxTypography/MdxTypography'; import { MdxTitle } from '../MdxTitle/MdxTitle'; +import { MdxCode, MdxParagraph } from '../MdxTypography/MdxTypography'; interface MdxServerComponentsIncompatibleProps { component: string; diff --git a/docs/src/components/MdxProvider/MdxSharedContent/MdxStylesApiSelectors.tsx b/docs/src/components/MdxProvider/MdxSharedContent/MdxStylesApiSelectors.tsx index c7765b02b3b..d4513040282 100644 --- a/docs/src/components/MdxProvider/MdxSharedContent/MdxStylesApiSelectors.tsx +++ b/docs/src/components/MdxProvider/MdxSharedContent/MdxStylesApiSelectors.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MdxParagraph, MdxCode } from '../MdxTypography/MdxTypography'; import { MdxLink } from '../MdxLink/MdxLink'; import { MdxTitle } from '../MdxTitle/MdxTitle'; +import { MdxCode, MdxParagraph } from '../MdxTypography/MdxTypography'; interface MdxStylesApiSelectorsProps { component: string; diff --git a/docs/src/components/MdxProvider/MdxSharedContent/MdxTargetComponent.tsx b/docs/src/components/MdxProvider/MdxSharedContent/MdxTargetComponent.tsx index 02321229acd..f70a4385908 100644 --- a/docs/src/components/MdxProvider/MdxSharedContent/MdxTargetComponent.tsx +++ b/docs/src/components/MdxProvider/MdxSharedContent/MdxTargetComponent.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { MdxCodeHighlight } from '../MdxPre/MdxPre'; import { MdxTitle } from '../MdxTitle/MdxTitle'; import { MdxCode, MdxParagraph } from '../MdxTypography/MdxTypography'; -import { MdxCodeHighlight } from '../MdxPre/MdxPre'; const getTargetCode = (component: string) => `import { ${component}, Button } from '@mantine/core'; diff --git a/docs/src/components/MdxProvider/MdxSharedContent/MdxWrapperProps.tsx b/docs/src/components/MdxProvider/MdxSharedContent/MdxWrapperProps.tsx index 883e23ce8ae..e1753090d81 100644 --- a/docs/src/components/MdxProvider/MdxSharedContent/MdxWrapperProps.tsx +++ b/docs/src/components/MdxProvider/MdxSharedContent/MdxWrapperProps.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MdxParagraph, MdxCode, MdxUl, MdxLi } from '../MdxTypography/MdxTypography'; -import { MdxTitle } from '../MdxTitle/MdxTitle'; import { MdxCodeHighlight } from '../MdxPre/MdxPre'; +import { MdxTitle } from '../MdxTitle/MdxTitle'; +import { MdxCode, MdxLi, MdxParagraph, MdxUl } from '../MdxTypography/MdxTypography'; const getCode = (component: string) => ` import { ${component} } from '@mantine/core'; diff --git a/docs/src/components/MdxProvider/MdxTemplatesList/MdxTemplatesList.tsx b/docs/src/components/MdxProvider/MdxTemplatesList/MdxTemplatesList.tsx index fda6814b373..56f61752105 100644 --- a/docs/src/components/MdxProvider/MdxTemplatesList/MdxTemplatesList.tsx +++ b/docs/src/components/MdxProvider/MdxTemplatesList/MdxTemplatesList.tsx @@ -1,10 +1,10 @@ import React from 'react'; import Link from 'next/link'; -import { Table, Button, Text } from '@mantine/core'; -import { IconExternalLink, IconCircleDashed } from '@tabler/icons-react'; +import { IconCircleDashed, IconExternalLink } from '@tabler/icons-react'; +import { Button, Table, Text } from '@mantine/core'; import { frameworkIcons } from '@/components/icons'; -import { TEMPLATES_DATA, Template } from './data'; import { COMMUNITY_TEMPLATES_DATA } from './community-data'; +import { Template, TEMPLATES_DATA } from './data'; import classes from './MdxTemplatesList.module.css'; interface MdxTemplatesListProps { diff --git a/docs/src/components/MdxProvider/MdxTitle/MdxTitle.tsx b/docs/src/components/MdxProvider/MdxTitle/MdxTitle.tsx index 780419fc711..a00bd42faac 100644 --- a/docs/src/components/MdxProvider/MdxTitle/MdxTitle.tsx +++ b/docs/src/components/MdxProvider/MdxTitle/MdxTitle.tsx @@ -1,6 +1,6 @@ import React from 'react'; import cx from 'clsx'; -import { Title, FOCUS_CLASS_NAMES } from '@mantine/core'; +import { FOCUS_CLASS_NAMES, Title } from '@mantine/core'; import classes from './MdxTitle.module.css'; export function MdxTitle({ diff --git a/docs/src/components/MdxRawContent/MdxRawContent.tsx b/docs/src/components/MdxRawContent/MdxRawContent.tsx index 1d38118616f..b3393086070 100644 --- a/docs/src/components/MdxRawContent/MdxRawContent.tsx +++ b/docs/src/components/MdxRawContent/MdxRawContent.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import { Frontmatter } from '@/types'; -import { TableOfContents } from '@/components/TableOfContents'; -import { PageBase } from '@/components/PageBase'; import { MdxSiblings } from '@/components/MdxSiblings'; +import { PageBase } from '@/components/PageBase'; +import { TableOfContents } from '@/components/TableOfContents'; +import { Frontmatter } from '@/types'; import classes from './MdxRawContent.module.css'; interface MdxRawContentProps { diff --git a/docs/src/components/MdxSiblings/MdxSiblings.tsx b/docs/src/components/MdxSiblings/MdxSiblings.tsx index 3a0f6f374a5..8bc07d95ab0 100644 --- a/docs/src/components/MdxSiblings/MdxSiblings.tsx +++ b/docs/src/components/MdxSiblings/MdxSiblings.tsx @@ -1,11 +1,11 @@ import React from 'react'; import Link from 'next/link'; -import cx from 'clsx'; import { IconArrowLeft, IconArrowRight } from '@tabler/icons-react'; -import { Text, Box, FOCUS_CLASS_NAMES } from '@mantine/core'; +import cx from 'clsx'; +import { Box, FOCUS_CLASS_NAMES, Text } from '@mantine/core'; +import { Frontmatter } from '@/types'; import { getMdxSiblings } from './get-mdx-siblings'; import classes from './MdxSiblings.module.css'; -import { Frontmatter } from '@/types'; interface MdxSiblingsProps { meta: Frontmatter; diff --git a/docs/src/components/MdxSiblings/get-mdx-siblings.ts b/docs/src/components/MdxSiblings/get-mdx-siblings.ts index bdbc6069294..847712bf5d7 100644 --- a/docs/src/components/MdxSiblings/get-mdx-siblings.ts +++ b/docs/src/components/MdxSiblings/get-mdx-siblings.ts @@ -1,5 +1,5 @@ -import { Frontmatter } from '@/types'; import { NAVIGATION_MDX_PAGES } from '@/mdx'; +import { Frontmatter } from '@/types'; export function getMdxSiblings(slug: string): { prev: Frontmatter | undefined; diff --git a/docs/src/components/MdxTabs/MdxTabs.tsx b/docs/src/components/MdxTabs/MdxTabs.tsx index 2d64af1677d..5d4852f2d16 100644 --- a/docs/src/components/MdxTabs/MdxTabs.tsx +++ b/docs/src/components/MdxTabs/MdxTabs.tsx @@ -1,11 +1,11 @@ -import React, { useState, useEffect } from 'react'; -import { Tabs, rem } from '@mantine/core'; +import React, { useEffect, useState } from 'react'; import { useRouter } from 'next/router'; -import { TableOfContents } from '@/components/TableOfContents'; -import { PageBase } from '@/components/PageBase'; +import { rem, Tabs } from '@mantine/core'; import { MdxSiblings } from '@/components/MdxSiblings'; +import { PageBase } from '@/components/PageBase'; import { PropsTablesList } from '@/components/PropsTable'; import { StylesApiTablesList } from '@/components/StylesApiTable'; +import { TableOfContents } from '@/components/TableOfContents'; import { Frontmatter } from '@/types'; import classes from './MdxTabs.module.css'; diff --git a/docs/src/components/ModalsProviderDemo/ModalsProviderDemo.tsx b/docs/src/components/ModalsProviderDemo/ModalsProviderDemo.tsx index 9ea44e717a6..cd792e5b7df 100644 --- a/docs/src/components/ModalsProviderDemo/ModalsProviderDemo.tsx +++ b/docs/src/components/ModalsProviderDemo/ModalsProviderDemo.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { Text, Button } from '@mantine/core'; -import { ModalsProvider, ContextModalProps } from '@mantine/modals'; +import { Button, Text } from '@mantine/core'; +import { ContextModalProps, ModalsProvider } from '@mantine/modals'; interface ModalsProviderDemoProps { children: React.ReactNode; diff --git a/docs/src/components/PropsTable/PropsTable.tsx b/docs/src/components/PropsTable/PropsTable.tsx index 5752d9972db..ef1c1dbbe20 100644 --- a/docs/src/components/PropsTable/PropsTable.tsx +++ b/docs/src/components/PropsTable/PropsTable.tsx @@ -1,10 +1,10 @@ import React from 'react'; -import { Table, Text, Highlight } from '@mantine/core'; +import { Highlight, Table, Text } from '@mantine/core'; +import docgenData from '@/.docgen/docgen.json'; import { DocsSection } from '@/components/DocsSection'; import { HtmlText } from '@/components/HtmlText'; -import { TableInlineCode } from '@/components/TableInlineCode'; import { TableError } from '@/components/TableError'; -import docgenData from '@/.docgen/docgen.json'; +import { TableInlineCode } from '@/components/TableInlineCode'; export interface DocgenProp { defaultValue: { diff --git a/docs/src/components/PropsTable/PropsTablesList.tsx b/docs/src/components/PropsTable/PropsTablesList.tsx index bc7b5f2a34e..6332482dcf7 100644 --- a/docs/src/components/PropsTable/PropsTablesList.tsx +++ b/docs/src/components/PropsTable/PropsTablesList.tsx @@ -1,8 +1,8 @@ import React, { useState } from 'react'; -import { TextInput, Title } from '@mantine/core'; import { IconSearch } from '@tabler/icons-react'; -import { PropsTable } from './PropsTable'; +import { TextInput, Title } from '@mantine/core'; import { getComponentName } from './getComponentName'; +import { PropsTable } from './PropsTable'; import classes from './PropsTablesList.module.css'; export interface PropsTablesListProps { diff --git a/docs/src/components/Search/Search.tsx b/docs/src/components/Search/Search.tsx index f43fe14cf74..6af3e66bcfc 100644 --- a/docs/src/components/Search/Search.tsx +++ b/docs/src/components/Search/Search.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { useRouter } from 'next/router'; import { IconSearch } from '@tabler/icons-react'; import { rem } from '@mantine/core'; -import { Spotlight, createSpotlight } from '@mantine/spotlight'; +import { createSpotlight, Spotlight } from '@mantine/spotlight'; import { SEARCH_MDX_PAGES } from '@/mdx'; export const [searchStore, searchHandlers] = createSpotlight(); diff --git a/docs/src/components/Shell/Header/Header.tsx b/docs/src/components/Shell/Header/Header.tsx index b13aed882b6..9db88b329dd 100644 --- a/docs/src/components/Shell/Header/Header.tsx +++ b/docs/src/components/Shell/Header/Header.tsx @@ -1,12 +1,12 @@ import React from 'react'; -import cx from 'clsx'; import { IconChevronDown, IconExternalLink } from '@tabler/icons-react'; -import { Code, Group, Burger, RemoveScroll, Menu, UnstyledButton, Text, Box } from '@mantine/core'; -import { HeaderControls, ColorSchemeControl, SearchMobileControl } from '@mantinex/mantine-header'; -import { meta, majorVersions } from '@mantinex/mantine-meta'; -import packageJson from '../../../../../package.json'; +import cx from 'clsx'; +import { Box, Burger, Code, Group, Menu, RemoveScroll, Text, UnstyledButton } from '@mantine/core'; +import { ColorSchemeControl, HeaderControls, SearchMobileControl } from '@mantinex/mantine-header'; +import { majorVersions, meta } from '@mantinex/mantine-meta'; import { Logo } from '@/components/Logo'; import { searchHandlers } from '@/components/Search'; +import packageJson from '../../../../../package.json'; import classes from './Header.module.css'; export type HeaderControlsProps = Partial>; diff --git a/docs/src/components/Shell/Navbar/Navbar.tsx b/docs/src/components/Shell/Navbar/Navbar.tsx index 706283bf245..99323bd570c 100644 --- a/docs/src/components/Shell/Navbar/Navbar.tsx +++ b/docs/src/components/Shell/Navbar/Navbar.tsx @@ -1,16 +1,16 @@ -import cx from 'clsx'; import React from 'react'; import { + IconApi, IconBrandMantine, IconCompass, - IconApi, IconHeartHandshake, IconPalette, } from '@tabler/icons-react'; -import { Box, ScrollArea, rem, RemoveScroll, useDirection } from '@mantine/core'; +import cx from 'clsx'; +import { Box, rem, RemoveScroll, ScrollArea, useDirection } from '@mantine/core'; import { MDX_PAGES_GROUPS } from '@/mdx'; -import { NavbarMainLink } from './NavbarMainLink/NavbarMainLink'; import { NavbarLinksGroup } from './NavbarLinksGroup/NavbarLinksGroup'; +import { NavbarMainLink } from './NavbarMainLink/NavbarMainLink'; import classes from './Navbar.module.css'; interface NavbarProps { diff --git a/docs/src/components/Shell/Navbar/NavbarLinksGroup/NavbarLinksGroup.tsx b/docs/src/components/Shell/Navbar/NavbarLinksGroup/NavbarLinksGroup.tsx index a04c132b825..3fd5b884005 100644 --- a/docs/src/components/Shell/Navbar/NavbarLinksGroup/NavbarLinksGroup.tsx +++ b/docs/src/components/Shell/Navbar/NavbarLinksGroup/NavbarLinksGroup.tsx @@ -2,8 +2,8 @@ import React, { useEffect, useRef, useState } from 'react'; import Link from 'next/link'; import { useRouter } from 'next/router'; import { IconChevronDown } from '@tabler/icons-react'; -import { UnstyledButton, Text, Box } from '@mantine/core'; -import { MdxPagesGroup, MdxPagesCategory, Frontmatter } from '@/types'; +import { Box, Text, UnstyledButton } from '@mantine/core'; +import { Frontmatter, MdxPagesCategory, MdxPagesGroup } from '@/types'; import { CATEGORY_ICONS } from './category-icons'; import classes from './NavbarLinksGroup.module.css'; diff --git a/docs/src/components/Shell/Navbar/NavbarLinksGroup/category-icons.ts b/docs/src/components/Shell/Navbar/NavbarLinksGroup/category-icons.ts index 0c4f8561b5d..e0466330a45 100644 --- a/docs/src/components/Shell/Navbar/NavbarLinksGroup/category-icons.ts +++ b/docs/src/components/Shell/Navbar/NavbarLinksGroup/category-icons.ts @@ -1,17 +1,17 @@ import { - IconRefresh, + IconBox, + IconBoxMultiple, IconBulb, + IconClick, + IconComponents, IconForms, - IconBox, IconLayout2, - IconClick, + IconLetterCase, IconMenu2, IconNotebook, - IconBoxMultiple, - IconLetterCase, - IconSpeakerphone, - IconComponents, + IconRefresh, IconSelector, + IconSpeakerphone, } from '@tabler/icons-react'; export const CATEGORY_ICONS: Record = { diff --git a/docs/src/components/Shell/Navbar/NavbarMainLink/NavbarMainLink.tsx b/docs/src/components/Shell/Navbar/NavbarMainLink/NavbarMainLink.tsx index 82a6948ae65..43c34f85856 100644 --- a/docs/src/components/Shell/Navbar/NavbarMainLink/NavbarMainLink.tsx +++ b/docs/src/components/Shell/Navbar/NavbarMainLink/NavbarMainLink.tsx @@ -1,7 +1,7 @@ import React from 'react'; import Link from 'next/link'; -import { UnstyledButton } from '@mantine/core'; import { useRouter } from 'next/router'; +import { UnstyledButton } from '@mantine/core'; import classes from './NavbarMainLink.module.css'; interface NavbarMainLinkProps extends React.ComponentPropsWithoutRef<'a'> { diff --git a/docs/src/components/SocialButton/SocialButton.tsx b/docs/src/components/SocialButton/SocialButton.tsx index 597bb06c87f..fb883f9109a 100644 --- a/docs/src/components/SocialButton/SocialButton.tsx +++ b/docs/src/components/SocialButton/SocialButton.tsx @@ -1,6 +1,6 @@ import React from 'react'; import cx from 'clsx'; -import { BoxProps, ElementProps, Button } from '@mantine/core'; +import { BoxProps, Button, ElementProps } from '@mantine/core'; import { DiscordIcon, TwitterIcon } from '@mantinex/dev-icons'; import { meta } from '@mantinex/mantine-meta'; import classes from './SocialButton.module.css'; diff --git a/docs/src/components/StylePropsTable/StylePropsTable.tsx b/docs/src/components/StylePropsTable/StylePropsTable.tsx index 6c751a73246..46740f09543 100644 --- a/docs/src/components/StylePropsTable/StylePropsTable.tsx +++ b/docs/src/components/StylePropsTable/StylePropsTable.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { STYlE_PROPS_DATA, Code, Breadcrumbs } from '@mantine/core'; +import { Breadcrumbs, Code, STYlE_PROPS_DATA } from '@mantine/core'; import { MdxDataTable } from '@/components/MdxProvider'; const THEME_KEYS: Record = { diff --git a/docs/src/components/StylesApiTable/StylesApiTable.tsx b/docs/src/components/StylesApiTable/StylesApiTable.tsx index 01fa5f4fbea..fd46b0e5cf0 100644 --- a/docs/src/components/StylesApiTable/StylesApiTable.tsx +++ b/docs/src/components/StylesApiTable/StylesApiTable.tsx @@ -2,11 +2,11 @@ import React from 'react'; import { Title } from '@mantine/core'; import * as stylesData from '@docs/styles-api'; import type { Modifier } from '@docs/styles-api'; -import { TableError } from '@/components/TableError'; import { getComponentName } from '@/components/PropsTable'; +import { TableError } from '@/components/TableError'; +import { ModifiersTable } from './ModifiersTable'; import { SelectorsTable } from './SelectorsTable'; import { VariablesTable } from './VariablesTable'; -import { ModifiersTable } from './ModifiersTable'; import classes from './StylesApiTable.module.css'; export interface StylesApiData { diff --git a/docs/src/components/StylesApiTable/StylesApiTablesList.tsx b/docs/src/components/StylesApiTable/StylesApiTablesList.tsx index 8103920124d..d5d5c15733d 100644 --- a/docs/src/components/StylesApiTable/StylesApiTablesList.tsx +++ b/docs/src/components/StylesApiTable/StylesApiTablesList.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { Code } from '@mantine/core'; -import { MdxParagraph, MdxLink, MdxTitle } from '@/components/MdxProvider'; +import { MdxLink, MdxParagraph, MdxTitle } from '@/components/MdxProvider'; import { StylesApiTable } from './StylesApiTable'; import classes from './StylesApiTable.module.css'; diff --git a/docs/src/components/TableError/TableError.tsx b/docs/src/components/TableError/TableError.tsx index c1c42efc890..a31190467d0 100644 --- a/docs/src/components/TableError/TableError.tsx +++ b/docs/src/components/TableError/TableError.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Text, Anchor } from '@mantine/core'; +import { Anchor, Text } from '@mantine/core'; interface TableErrorProps { errorOf: string; diff --git a/docs/src/components/TableInlineCode/TableInlineCode.tsx b/docs/src/components/TableInlineCode/TableInlineCode.tsx index 8dca25e005c..a1dd13d4a80 100644 --- a/docs/src/components/TableInlineCode/TableInlineCode.tsx +++ b/docs/src/components/TableInlineCode/TableInlineCode.tsx @@ -1,6 +1,6 @@ import React from 'react'; import cx from 'clsx'; -import { Text, TextProps, ElementProps } from '@mantine/core'; +import { ElementProps, Text, TextProps } from '@mantine/core'; import classes from './TableInlineCode.module.css'; interface TableInlineCodeProps extends TextProps, ElementProps<'span', 'color'> {} diff --git a/docs/src/components/TableOfContents/TableOfContents.tsx b/docs/src/components/TableOfContents/TableOfContents.tsx index 50ee1a77790..6f07ebe75c7 100644 --- a/docs/src/components/TableOfContents/TableOfContents.tsx +++ b/docs/src/components/TableOfContents/TableOfContents.tsx @@ -1,7 +1,7 @@ -import React, { useEffect, useState, useRef } from 'react'; +import React, { useEffect, useRef, useState } from 'react'; import { useRouter } from 'next/router'; -import { Text, ScrollArea, rem, Box } from '@mantine/core'; import { IconList } from '@tabler/icons-react'; +import { Box, rem, ScrollArea, Text } from '@mantine/core'; import { getHeadings, Heading } from './get-headings'; import classes from './TableOfContents.module.css'; diff --git a/docs/src/components/ThemeColors/ColorsGroup/ColorsGroup.tsx b/docs/src/components/ThemeColors/ColorsGroup/ColorsGroup.tsx index 9e5d425a05a..aa48ffec6a9 100644 --- a/docs/src/components/ThemeColors/ColorsGroup/ColorsGroup.tsx +++ b/docs/src/components/ThemeColors/ColorsGroup/ColorsGroup.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { useMantineTheme, Text, ColorSwatch, Box } from '@mantine/core'; +import { Box, ColorSwatch, Text, useMantineTheme } from '@mantine/core'; import classes from './ColorsGroup.module.css'; interface ColorsGroupProps { diff --git a/docs/src/components/VersionsList/VersionsList.tsx b/docs/src/components/VersionsList/VersionsList.tsx index 91fba330aaa..5b5be798dcc 100644 --- a/docs/src/components/VersionsList/VersionsList.tsx +++ b/docs/src/components/VersionsList/VersionsList.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import { Code, Group, Text, Button } from '@mantine/core'; -import { allVersions } from '@mantinex/mantine-meta'; -import { GithubIcon } from '@mantinex/dev-icons'; import { IconFileInvoice } from '@tabler/icons-react'; +import { Button, Code, Group, Text } from '@mantine/core'; +import { GithubIcon } from '@mantinex/dev-icons'; +import { allVersions } from '@mantinex/mantine-meta'; import classes from './VersionsList.module.css'; function getMinorXVersion(version: string) { diff --git a/docs/src/components/icons/index.ts b/docs/src/components/icons/index.ts index 7463713d269..1ca74479e3a 100644 --- a/docs/src/components/icons/index.ts +++ b/docs/src/components/icons/index.ts @@ -1,9 +1,9 @@ -import { NextIcon } from './NextIcon'; -import { ViteIcon } from './ViteIcon'; +import type { Template } from '../MdxProvider/MdxTemplatesList/data'; import { GatsbyIcon } from './GatsbyIcon'; -import { RemixIcon } from './RemixIcon'; +import { NextIcon } from './NextIcon'; import { RedwoodIcon } from './RedwoodIcon'; -import type { Template } from '../MdxProvider/MdxTemplatesList/data'; +import { RemixIcon } from './RemixIcon'; +import { ViteIcon } from './ViteIcon'; export const frameworkIcons: Record = { next: NextIcon, diff --git a/docs/src/mdx/mdx-data.ts b/docs/src/mdx/mdx-data.ts index ce5c6d1f517..2bd4a6c53d3 100644 --- a/docs/src/mdx/mdx-data.ts +++ b/docs/src/mdx/mdx-data.ts @@ -1,13 +1,13 @@ import { Frontmatter } from '@/types'; -import { MDX_META_DATA } from './data/mdx-meta-data'; -import { MDX_THEMING_DATA } from './data/mdx-theming-data'; -import { MDX_STYLES_DATA } from './data/mdx-styles-data'; -import { MDX_GUIDES_DATA } from './data/mdx-guides-data'; import { MDX_CORE_DATA } from './data/mdx-core-data'; -import { MDX_OTHERS_DATA } from './data/mdx-others-data'; -import { MDX_HOOKS_DATA } from './data/mdx-hooks-data'; -import { MDX_FORM_DATA } from './data/mdx-form-data'; import { MDX_DATES_DATA } from './data/mdx-dates-data'; +import { MDX_FORM_DATA } from './data/mdx-form-data'; +import { MDX_GUIDES_DATA } from './data/mdx-guides-data'; +import { MDX_HOOKS_DATA } from './data/mdx-hooks-data'; +import { MDX_META_DATA } from './data/mdx-meta-data'; +import { MDX_OTHERS_DATA } from './data/mdx-others-data'; +import { MDX_STYLES_DATA } from './data/mdx-styles-data'; +import { MDX_THEMING_DATA } from './data/mdx-theming-data'; export const MDX_DATA: Record = { ...MDX_META_DATA, diff --git a/docs/src/mdx/mdx-pages-group.ts b/docs/src/mdx/mdx-pages-group.ts index b6a24fa3eaf..2c195d2452e 100644 --- a/docs/src/mdx/mdx-pages-group.ts +++ b/docs/src/mdx/mdx-pages-group.ts @@ -1,6 +1,6 @@ import { Frontmatter, MdxPagesCategory, MdxPagesGroup } from '@/types'; -import { MDX_DATA } from './mdx-data'; import { MDX_META_DATA } from './data/mdx-meta-data'; +import { MDX_DATA } from './mdx-data'; export const MDX_PAGES_GROUPS: MdxPagesGroup[] = [ { diff --git a/docs/src/pages/_app.tsx b/docs/src/pages/_app.tsx index e4f23494ed6..c7b5ddd00ff 100644 --- a/docs/src/pages/_app.tsx +++ b/docs/src/pages/_app.tsx @@ -16,18 +16,19 @@ import '@docs/demos/styles.css'; import React from 'react'; import { AppProps } from 'next/app'; import Head from 'next/head'; -import { MantineProvider, DirectionProvider } from '@mantine/core'; +import { DirectionProvider, MantineProvider } from '@mantine/core'; import { useHotkeys, useLocalStorage } from '@mantine/hooks'; import { Notifications } from '@mantine/notifications'; import { ShikiProvider } from '@mantinex/shiki'; -import { MdxProvider } from '@/components/MdxProvider'; +import { GaScript } from '@/components/GaScript'; import { HotKeysHandler } from '@/components/HotKeysHandler'; +import { MdxProvider } from '@/components/MdxProvider'; +import { ModalsProviderDemo } from '@/components/ModalsProviderDemo'; import { Search } from '@/components/Search'; -import { FontsStyle } from '@/fonts'; import { Shell } from '@/components/Shell'; -import { GaScript } from '@/components/GaScript'; -import { ModalsProviderDemo } from '@/components/ModalsProviderDemo'; +import { FontsStyle } from '@/fonts'; import { theme } from '../../theme'; + import '../styles/variables.css'; import '../styles/global.css'; diff --git a/docs/src/pages/_document.tsx b/docs/src/pages/_document.tsx index 3af9f46a86a..70be95a0624 100644 --- a/docs/src/pages/_document.tsx +++ b/docs/src/pages/_document.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Html, Head, Main, NextScript } from 'next/document'; +import { Head, Html, Main, NextScript } from 'next/document'; import { ColorSchemeScript } from '@mantine/core'; export default function Document() { diff --git a/docs/src/pages/about.mdx b/docs/src/pages/about.mdx index 8de07fe4c68..a4c383b0c96 100644 --- a/docs/src/pages/about.mdx +++ b/docs/src/pages/about.mdx @@ -1,7 +1,7 @@ -import { Layout } from '@/layout'; -import { MDX_DATA } from '@/mdx'; import { GuidesDemos } from '@docs/demos'; import { LogoAssets } from '@/components/LogoAssets'; +import { Layout } from '@/layout'; +import { MDX_DATA } from '@/mdx'; export default Layout(MDX_DATA.About); diff --git a/docs/src/pages/changelog/7-0-0.mdx b/docs/src/pages/changelog/7-0-0.mdx index 3e957ed2290..8fe16016bda 100644 --- a/docs/src/pages/changelog/7-0-0.mdx +++ b/docs/src/pages/changelog/7-0-0.mdx @@ -1,25 +1,25 @@ -import { Layout } from '@/layout'; -import { MDX_DATA } from '@/mdx'; import { Button } from '@mantine/core'; import { - ThemingDemos, - LoaderDemos, - TableDemos, - GroupDemos, - StylesDemos, - FieldsetDemos, + CarouselDemos, + CodeHighlightDemos, ComboboxDemos, - TagsInputDemos, - InputDemos, - SimpleGridDemos, + FieldsetDemos, GridDemos, - ProgressDemos, - SpotlightDemos, + GroupDemos, ImageDemos, - CarouselDemos, + InputDemos, + LoaderDemos, NumberInputDemos, - CodeHighlightDemos, + ProgressDemos, + SimpleGridDemos, + SpotlightDemos, + StylesDemos, + TableDemos, + TagsInputDemos, + ThemingDemos, } from '@docs/demos'; +import { Layout } from '@/layout'; +import { MDX_DATA } from '@/mdx'; export default Layout(MDX_DATA.Changelog700); @@ -61,7 +61,7 @@ Note that `auto` is not the default value. You need to set it manually to enable both on [MantineProvider](/theming/mantine-provider) and in [ColorSchemeScript](/theming/color-schemes#colorschemescript): ```tsx -import { MantineProvider, ColorSchemeScript } from '@mantine/core'; +import { ColorSchemeScript, MantineProvider } from '@mantine/core'; function Demo() { return ( @@ -222,7 +222,7 @@ to set `scale` to `1 / (10 / 16)` (16 – default font-size) = `1 / 0.625` = `1. ``` ```tsx -import { MantineProvider, createTheme } from '@mantine/core'; +import { createTheme, MantineProvider } from '@mantine/core'; const theme = createTheme({ scale: 1.6, @@ -292,8 +292,8 @@ color palettes based on single color value. It is also available as [online tool Note that it is usually better to generate colors in advance to avoid contrast issues. ```tsx -import { MantineProvider } from '@mantine/core'; import { generateColors } from '@mantine/colors-generator'; +import { MantineProvider } from '@mantine/core'; function Demo() { return ( diff --git a/docs/src/pages/changelog/7-1-0.mdx b/docs/src/pages/changelog/7-1-0.mdx index b6829946dd9..68c9a8f7da7 100644 --- a/docs/src/pages/changelog/7-1-0.mdx +++ b/docs/src/pages/changelog/7-1-0.mdx @@ -16,6 +16,7 @@ regular styles. // they will be applied after Mantine styles. // Import order does not affect styles in this case import classes from './Demo.module.css'; + import '@mantine/core/styles.layer.css'; ``` @@ -26,6 +27,7 @@ you should not import both of them. ```tsx import '@mantine/core/styles.layer.css'; import '@mantine/dates/styles.layer.css'; + // ... other styles ``` @@ -58,8 +60,8 @@ to any other component or HTML tag with a callback function. It can be used in c ```tsx import cx from 'clsx'; -import { Button } from '@mantine/core'; import { NavLink } from 'react-router-dom'; +import { Button } from '@mantine/core'; function Demo() { return ( diff --git a/docs/src/pages/changelog/7-2-0.mdx b/docs/src/pages/changelog/7-2-0.mdx index 0129ea98c59..47ebe1dc4a1 100644 --- a/docs/src/pages/changelog/7-2-0.mdx +++ b/docs/src/pages/changelog/7-2-0.mdx @@ -1,11 +1,11 @@ -import { Layout } from '@/layout'; -import { MDX_DATA } from '@/mdx'; import { LoadingOverlayDemos, - StylesDemos, NumberFormatterDemos, + StylesDemos, TableDemos, } from '@docs/demos'; +import { Layout } from '@/layout'; +import { MDX_DATA } from '@/mdx'; export default Layout(MDX_DATA.Changelog720); @@ -61,8 +61,8 @@ Then call `createFormActions` function with the same form name as specified in ` ```tsx // Import type of form values from the file where you defined useForm -import type { DemoFormValues } from './DemoForm'; import { createFormActions } from '@mantine/form'; +import type { DemoFormValues } from './DemoForm'; export const demoFormActions = createFormActions('demo-form'); diff --git a/docs/src/pages/changelog/7-3-0.mdx b/docs/src/pages/changelog/7-3-0.mdx index 7bf51430d31..0e4d42de8b7 100644 --- a/docs/src/pages/changelog/7-3-0.mdx +++ b/docs/src/pages/changelog/7-3-0.mdx @@ -1,11 +1,11 @@ -import { Layout } from '@/layout'; -import { MDX_DATA } from '@/mdx'; import { + ButtonDemos, Changelog730Demos, ColorPickerDemos, - ButtonDemos, DrawerDemos, } from '@docs/demos'; +import { Layout } from '@/layout'; +import { MDX_DATA } from '@/mdx'; export default Layout(MDX_DATA.Changelog730); @@ -73,9 +73,9 @@ Example of zod resolver: ```tsx +import { zodResolver } from 'mantine-form-zod-resolver'; import { z } from 'zod'; import { useForm } from '@mantine/form'; -import { zodResolver } from 'mantine-form-zod-resolver'; const schema = z.object({ name: z diff --git a/docs/src/pages/changelog/all-releases.mdx b/docs/src/pages/changelog/all-releases.mdx index d3ae5e1c8f5..69c9beadb6f 100644 --- a/docs/src/pages/changelog/all-releases.mdx +++ b/docs/src/pages/changelog/all-releases.mdx @@ -1,6 +1,6 @@ +import { VersionsList } from '@/components/VersionsList'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { VersionsList } from '@/components/VersionsList'; export default Layout(MDX_DATA.AllReleases); diff --git a/docs/src/pages/changelog/previous-versions.mdx b/docs/src/pages/changelog/previous-versions.mdx index 8f65a861e61..a19db8caba0 100644 --- a/docs/src/pages/changelog/previous-versions.mdx +++ b/docs/src/pages/changelog/previous-versions.mdx @@ -1,6 +1,6 @@ +import { VersionsList } from '@/components/VersionsList'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { VersionsList } from '@/components/VersionsList'; export default Layout(MDX_DATA.PreviousChangelogs); diff --git a/docs/src/pages/colors-generator.tsx b/docs/src/pages/colors-generator.tsx index 75b9df9c134..6a1f24f07e4 100644 --- a/docs/src/pages/colors-generator.tsx +++ b/docs/src/pages/colors-generator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { ContentPageBase } from '@/components/ContentPageBase'; import { ColorsGenerator } from '@/components/ColorsGenerator'; +import { ContentPageBase } from '@/components/ContentPageBase'; export default function ColorsGeneratorPage() { return ( diff --git a/docs/src/pages/core/accordion.mdx b/docs/src/pages/core/accordion.mdx index 5e25476c9e9..b84ddc2bc2e 100644 --- a/docs/src/pages/core/accordion.mdx +++ b/docs/src/pages/core/accordion.mdx @@ -1,6 +1,6 @@ +import { AccordionDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { AccordionDemos } from '@docs/demos'; export default Layout(MDX_DATA.Accordion); diff --git a/docs/src/pages/core/action-icon.mdx b/docs/src/pages/core/action-icon.mdx index 394f0b59763..2d3a9ee40ea 100644 --- a/docs/src/pages/core/action-icon.mdx +++ b/docs/src/pages/core/action-icon.mdx @@ -1,6 +1,6 @@ +import { ActionIconDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ActionIconDemos } from '@docs/demos'; export default Layout(MDX_DATA.ActionIcon); @@ -127,8 +127,8 @@ To make `ActionIcon` accessible for screen readers, you need to either set `aria use [VisuallyHidden](/core/visually-hidden) component: ```tsx -import { ActionIcon, VisuallyHidden } from '@mantine/core'; import { IconHeart } from '@tabler/icons-react'; +import { ActionIcon, VisuallyHidden } from '@mantine/core'; function Demo() { return ( diff --git a/docs/src/pages/core/affix.mdx b/docs/src/pages/core/affix.mdx index cda6d45ef9c..d42449e5814 100644 --- a/docs/src/pages/core/affix.mdx +++ b/docs/src/pages/core/affix.mdx @@ -1,6 +1,6 @@ +import { AffixDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { AffixDemos } from '@docs/demos'; export default Layout(MDX_DATA.Affix); diff --git a/docs/src/pages/core/alert.mdx b/docs/src/pages/core/alert.mdx index 68cb74d881c..8c7236ecf11 100644 --- a/docs/src/pages/core/alert.mdx +++ b/docs/src/pages/core/alert.mdx @@ -1,6 +1,6 @@ +import { AlertDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { AlertDemos } from '@docs/demos'; export default Layout(MDX_DATA.Alert); diff --git a/docs/src/pages/core/anchor.mdx b/docs/src/pages/core/anchor.mdx index 8f7c8c5a016..4546d5a3fcf 100644 --- a/docs/src/pages/core/anchor.mdx +++ b/docs/src/pages/core/anchor.mdx @@ -1,6 +1,6 @@ +import { AnchorDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { AnchorDemos } from '@docs/demos'; export default Layout(MDX_DATA.Anchor); diff --git a/docs/src/pages/core/app-shell.mdx b/docs/src/pages/core/app-shell.mdx index dfb0ba76f99..d56b2a70113 100644 --- a/docs/src/pages/core/app-shell.mdx +++ b/docs/src/pages/core/app-shell.mdx @@ -23,8 +23,8 @@ the page. Navbar is hidden on mobile by default and toggled with the burger button. ```tsx -import { useDisclosure } from '@mantine/hooks'; import { AppShell, Burger } from '@mantine/core'; +import { useDisclosure } from '@mantine/hooks'; function Demo() { const [opened, { toggle }] = useDisclosure(); @@ -247,8 +247,8 @@ It is useful when you want to collapse `AppShell.Header` based on the scroll pos [use-headroom](/hooks/use-headroom) hook to collapse header when user scrolls down and expand it when user scrolls up ([example](/app-shell?e=Headroom)). ```tsx -import { useHeadroom } from '@mantine/hooks'; import { AppShell, rem } from '@mantine/core'; +import { useHeadroom } from '@mantine/hooks'; function Demo() { const pinned = useHeadroom({ fixedAt: 120 }); @@ -279,8 +279,8 @@ depending on the viewport width. [Example](/app-shell?e=CollapseDesktop) with separate collapsed state for mobile and desktop: ```tsx -import { useDisclosure } from '@mantine/hooks'; import { AppShell, Button } from '@mantine/core'; +import { useDisclosure } from '@mantine/hooks'; export function CollapseDesktop() { const [mobileOpened, { toggle: toggleMobile }] = useDisclosure(); diff --git a/docs/src/pages/core/aspect-ratio.mdx b/docs/src/pages/core/aspect-ratio.mdx index f1637bed0c4..ea850a6c57f 100644 --- a/docs/src/pages/core/aspect-ratio.mdx +++ b/docs/src/pages/core/aspect-ratio.mdx @@ -1,6 +1,6 @@ +import { AspectRatioDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { AspectRatioDemos } from '@docs/demos'; export default Layout(MDX_DATA.AspectRatio); diff --git a/docs/src/pages/core/autocomplete.mdx b/docs/src/pages/core/autocomplete.mdx index 361779b07b9..e32110e7525 100644 --- a/docs/src/pages/core/autocomplete.mdx +++ b/docs/src/pages/core/autocomplete.mdx @@ -1,6 +1,6 @@ +import { AutocompleteDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { AutocompleteDemos } from '@docs/demos'; export default Layout(MDX_DATA.Autocomplete); diff --git a/docs/src/pages/core/avatar.mdx b/docs/src/pages/core/avatar.mdx index bdbfbc8aa2e..09e0fd18b45 100644 --- a/docs/src/pages/core/avatar.mdx +++ b/docs/src/pages/core/avatar.mdx @@ -1,6 +1,6 @@ +import { AvatarDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { AvatarDemos } from '@docs/demos'; export default Layout(MDX_DATA.Avatar); diff --git a/docs/src/pages/core/background-image.mdx b/docs/src/pages/core/background-image.mdx index 38e5952cce1..1cd55550ada 100644 --- a/docs/src/pages/core/background-image.mdx +++ b/docs/src/pages/core/background-image.mdx @@ -1,6 +1,6 @@ +import { BackgroundImageDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { BackgroundImageDemos } from '@docs/demos'; export default Layout(MDX_DATA.BackgroundImage); diff --git a/docs/src/pages/core/badge.mdx b/docs/src/pages/core/badge.mdx index bb84c268cc3..4f24104d4c0 100644 --- a/docs/src/pages/core/badge.mdx +++ b/docs/src/pages/core/badge.mdx @@ -1,6 +1,6 @@ +import { BadgeDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { BadgeDemos } from '@docs/demos'; export default Layout(MDX_DATA.Badge); diff --git a/docs/src/pages/core/blockquote.mdx b/docs/src/pages/core/blockquote.mdx index 805b5a0aa0d..2b558faa46f 100644 --- a/docs/src/pages/core/blockquote.mdx +++ b/docs/src/pages/core/blockquote.mdx @@ -1,6 +1,6 @@ +import { BlockquoteDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { BlockquoteDemos } from '@docs/demos'; export default Layout(MDX_DATA.Blockquote); diff --git a/docs/src/pages/core/breadcrumbs.mdx b/docs/src/pages/core/breadcrumbs.mdx index 279153ff8c7..a9a2b61b220 100644 --- a/docs/src/pages/core/breadcrumbs.mdx +++ b/docs/src/pages/core/breadcrumbs.mdx @@ -1,6 +1,6 @@ +import { BreadcrumbsDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { BreadcrumbsDemos } from '@docs/demos'; export default Layout(MDX_DATA.Breadcrumbs); diff --git a/docs/src/pages/core/burger.mdx b/docs/src/pages/core/burger.mdx index 538b8b455da..b66eb87a552 100644 --- a/docs/src/pages/core/burger.mdx +++ b/docs/src/pages/core/burger.mdx @@ -1,6 +1,6 @@ +import { BurgerDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { BurgerDemos } from '@docs/demos'; export default Layout(MDX_DATA.Burger); diff --git a/docs/src/pages/core/button.mdx b/docs/src/pages/core/button.mdx index 303cdf79eb2..78e53151810 100644 --- a/docs/src/pages/core/button.mdx +++ b/docs/src/pages/core/button.mdx @@ -1,6 +1,6 @@ +import { ButtonDemos, StylesDemos, ThemingDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ButtonDemos, StylesDemos, ThemingDemos } from '@docs/demos'; export default Layout(MDX_DATA.Button); diff --git a/docs/src/pages/core/card.mdx b/docs/src/pages/core/card.mdx index b8aa44b39d6..a325bec42b7 100644 --- a/docs/src/pages/core/card.mdx +++ b/docs/src/pages/core/card.mdx @@ -1,6 +1,6 @@ +import { CardDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { CardDemos } from '@docs/demos'; export default Layout(MDX_DATA.Card); diff --git a/docs/src/pages/core/center.mdx b/docs/src/pages/core/center.mdx index 68395520b0c..dd8dae25723 100644 --- a/docs/src/pages/core/center.mdx +++ b/docs/src/pages/core/center.mdx @@ -1,6 +1,6 @@ +import { CenterDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { CenterDemos } from '@docs/demos'; export default Layout(MDX_DATA.Center); diff --git a/docs/src/pages/core/checkbox.mdx b/docs/src/pages/core/checkbox.mdx index 976bb8b514b..29b849ebf07 100644 --- a/docs/src/pages/core/checkbox.mdx +++ b/docs/src/pages/core/checkbox.mdx @@ -1,6 +1,6 @@ +import { CheckboxDemos, TableDemos, ThemingDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { CheckboxDemos, TableDemos, ThemingDemos } from '@docs/demos'; export default Layout(MDX_DATA.Checkbox); diff --git a/docs/src/pages/core/chip.mdx b/docs/src/pages/core/chip.mdx index 0738afb3096..d52f4562c31 100644 --- a/docs/src/pages/core/chip.mdx +++ b/docs/src/pages/core/chip.mdx @@ -1,6 +1,6 @@ +import { ChipDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ChipDemos } from '@docs/demos'; export default Layout(MDX_DATA.Chip); diff --git a/docs/src/pages/core/close-button.mdx b/docs/src/pages/core/close-button.mdx index 124b5d2f24b..621b3f1d0ad 100644 --- a/docs/src/pages/core/close-button.mdx +++ b/docs/src/pages/core/close-button.mdx @@ -1,6 +1,6 @@ +import { CloseButtonDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { CloseButtonDemos } from '@docs/demos'; export default Layout(MDX_DATA.CloseButton); diff --git a/docs/src/pages/core/code.mdx b/docs/src/pages/core/code.mdx index 2e33a84354f..c76ac52916c 100644 --- a/docs/src/pages/core/code.mdx +++ b/docs/src/pages/core/code.mdx @@ -1,6 +1,6 @@ +import { CodeDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { CodeDemos } from '@docs/demos'; export default Layout(MDX_DATA.Code); diff --git a/docs/src/pages/core/collapse.mdx b/docs/src/pages/core/collapse.mdx index cf4c3137138..72dcadcff87 100644 --- a/docs/src/pages/core/collapse.mdx +++ b/docs/src/pages/core/collapse.mdx @@ -1,6 +1,6 @@ +import { CollapseDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { CollapseDemos } from '@docs/demos'; export default Layout(MDX_DATA.Collapse); diff --git a/docs/src/pages/core/color-input.mdx b/docs/src/pages/core/color-input.mdx index b1674c4d83d..5dc4db2bcb8 100644 --- a/docs/src/pages/core/color-input.mdx +++ b/docs/src/pages/core/color-input.mdx @@ -1,6 +1,6 @@ +import { ColorInputDemos, ColorPickerDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ColorInputDemos, ColorPickerDemos } from '@docs/demos'; export default Layout(MDX_DATA.ColorInput); diff --git a/docs/src/pages/core/color-picker.mdx b/docs/src/pages/core/color-picker.mdx index 908c8a9c78e..a1351a1c7fc 100644 --- a/docs/src/pages/core/color-picker.mdx +++ b/docs/src/pages/core/color-picker.mdx @@ -1,6 +1,6 @@ +import { ColorPickerDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ColorPickerDemos } from '@docs/demos'; export default Layout(MDX_DATA.ColorPicker); diff --git a/docs/src/pages/core/color-swatch.mdx b/docs/src/pages/core/color-swatch.mdx index 3ec0871a141..6aa0277fe4c 100644 --- a/docs/src/pages/core/color-swatch.mdx +++ b/docs/src/pages/core/color-swatch.mdx @@ -1,6 +1,6 @@ +import { ColorSwatchDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ColorSwatchDemos } from '@docs/demos'; export default Layout(MDX_DATA.ColorSwatch); diff --git a/docs/src/pages/core/combobox.mdx b/docs/src/pages/core/combobox.mdx index f17dec90584..a992926f33e 100644 --- a/docs/src/pages/core/combobox.mdx +++ b/docs/src/pages/core/combobox.mdx @@ -1,6 +1,6 @@ +import { ComboboxDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ComboboxDemos } from '@docs/demos'; export default Layout(MDX_DATA.Combobox); @@ -27,7 +27,7 @@ The component is very flexible – you have full control of the rendering and lo and handlers to update it. Created store must be passed to the `store` prop of `Combobox`: ```tsx -import { useCombobox, Combobox } from '@mantine/core'; +import { Combobox, useCombobox } from '@mantine/core'; function Demo() { const combobox = useCombobox(); @@ -164,7 +164,7 @@ Combobox store handlers can be used to control `Combobox` state. For example, to open the dropdown, call `openDropdown` handler: ```tsx -import { useCombobox, Combobox, Button } from '@mantine/core'; +import { Button, Combobox, useCombobox } from '@mantine/core'; function Demo() { const combobox = useCombobox(); @@ -188,7 +188,7 @@ call `selectFirstOption` when the dropdown is opened and `resetSelectedOption` when it is closed: ```tsx -import { useCombobox, Combobox } from '@mantine/core'; +import { Combobox, useCombobox } from '@mantine/core'; function Demo() { const combobox = useCombobox({ diff --git a/docs/src/pages/core/container.mdx b/docs/src/pages/core/container.mdx index 1d3aea0cd71..a06248e7b83 100644 --- a/docs/src/pages/core/container.mdx +++ b/docs/src/pages/core/container.mdx @@ -1,6 +1,6 @@ +import { ContainerDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ContainerDemos } from '@docs/demos'; export default Layout(MDX_DATA.Container); diff --git a/docs/src/pages/core/copy-button.mdx b/docs/src/pages/core/copy-button.mdx index 967642f53e3..6d07ba31f1a 100644 --- a/docs/src/pages/core/copy-button.mdx +++ b/docs/src/pages/core/copy-button.mdx @@ -1,6 +1,6 @@ +import { CopyButtonDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { CopyButtonDemos } from '@docs/demos'; export default Layout(MDX_DATA.CopyButton); diff --git a/docs/src/pages/core/dialog.mdx b/docs/src/pages/core/dialog.mdx index a0f4a336797..57deedb9282 100644 --- a/docs/src/pages/core/dialog.mdx +++ b/docs/src/pages/core/dialog.mdx @@ -1,6 +1,6 @@ +import { DialogDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { DialogDemos } from '@docs/demos'; export default Layout(MDX_DATA.Dialog); diff --git a/docs/src/pages/core/divider.mdx b/docs/src/pages/core/divider.mdx index 1fbc4667595..b32685438ef 100644 --- a/docs/src/pages/core/divider.mdx +++ b/docs/src/pages/core/divider.mdx @@ -1,6 +1,6 @@ +import { DividerDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { DividerDemos } from '@docs/demos'; export default Layout(MDX_DATA.Divider); diff --git a/docs/src/pages/core/drawer.mdx b/docs/src/pages/core/drawer.mdx index b87286430a8..8943bc7ade2 100644 --- a/docs/src/pages/core/drawer.mdx +++ b/docs/src/pages/core/drawer.mdx @@ -1,6 +1,6 @@ +import { DrawerDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { DrawerDemos } from '@docs/demos'; export default Layout(MDX_DATA.Drawer); diff --git a/docs/src/pages/core/fieldset.mdx b/docs/src/pages/core/fieldset.mdx index 4b34cdee0c5..a296d9ce06b 100644 --- a/docs/src/pages/core/fieldset.mdx +++ b/docs/src/pages/core/fieldset.mdx @@ -1,6 +1,6 @@ +import { FieldsetDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { FieldsetDemos } from '@docs/demos'; export default Layout(MDX_DATA.Fieldset); diff --git a/docs/src/pages/core/file-button.mdx b/docs/src/pages/core/file-button.mdx index 51a9db9883f..b28ad0eaa95 100644 --- a/docs/src/pages/core/file-button.mdx +++ b/docs/src/pages/core/file-button.mdx @@ -1,6 +1,6 @@ +import { FileButtonDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { FileButtonDemos } from '@docs/demos'; export default Layout(MDX_DATA.FileButton); diff --git a/docs/src/pages/core/file-input.mdx b/docs/src/pages/core/file-input.mdx index 26693d23643..4f35d4146d9 100644 --- a/docs/src/pages/core/file-input.mdx +++ b/docs/src/pages/core/file-input.mdx @@ -1,6 +1,6 @@ +import { FileInputDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { FileInputDemos } from '@docs/demos'; export default Layout(MDX_DATA.FileInput); diff --git a/docs/src/pages/core/flex.mdx b/docs/src/pages/core/flex.mdx index d9fa96d28e3..74f180fdd8f 100644 --- a/docs/src/pages/core/flex.mdx +++ b/docs/src/pages/core/flex.mdx @@ -1,8 +1,8 @@ -import { Layout } from '@/layout'; -import { MDX_DATA } from '@/mdx'; -import { FlexDemos } from '@docs/demos'; import { FLEX_STYLE_PROPS_DATA } from '@mantine/core'; +import { FlexDemos } from '@docs/demos'; import { StylePropsTable } from '@/components/StylePropsTable'; +import { Layout } from '@/layout'; +import { MDX_DATA } from '@/mdx'; export default Layout(MDX_DATA.Flex); diff --git a/docs/src/pages/core/focus-trap.mdx b/docs/src/pages/core/focus-trap.mdx index c39325e05a1..eabfe4f4204 100644 --- a/docs/src/pages/core/focus-trap.mdx +++ b/docs/src/pages/core/focus-trap.mdx @@ -1,6 +1,6 @@ +import { FocusTrapDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { FocusTrapDemos } from '@docs/demos'; export default Layout(MDX_DATA.FocusTrap); diff --git a/docs/src/pages/core/grid.mdx b/docs/src/pages/core/grid.mdx index 7eeaedd4791..b488ed4ce98 100644 --- a/docs/src/pages/core/grid.mdx +++ b/docs/src/pages/core/grid.mdx @@ -1,6 +1,6 @@ +import { GridDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { GridDemos } from '@docs/demos'; export default Layout(MDX_DATA.Grid); diff --git a/docs/src/pages/core/group.mdx b/docs/src/pages/core/group.mdx index 004abd8b1c6..d92cc78bc8d 100644 --- a/docs/src/pages/core/group.mdx +++ b/docs/src/pages/core/group.mdx @@ -1,6 +1,6 @@ +import { GroupDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { GroupDemos } from '@docs/demos'; export default Layout(MDX_DATA.Group); diff --git a/docs/src/pages/core/highlight.mdx b/docs/src/pages/core/highlight.mdx index 29c1fc8f6dd..b49daaea7d6 100644 --- a/docs/src/pages/core/highlight.mdx +++ b/docs/src/pages/core/highlight.mdx @@ -1,6 +1,6 @@ +import { HighlightDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HighlightDemos } from '@docs/demos'; export default Layout(MDX_DATA.Highlight); diff --git a/docs/src/pages/core/hover-card.mdx b/docs/src/pages/core/hover-card.mdx index 76b2d883383..384b23969c3 100644 --- a/docs/src/pages/core/hover-card.mdx +++ b/docs/src/pages/core/hover-card.mdx @@ -1,6 +1,6 @@ +import { HoverCardDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HoverCardDemos } from '@docs/demos'; export default Layout(MDX_DATA.HoverCard); diff --git a/docs/src/pages/core/image.mdx b/docs/src/pages/core/image.mdx index f6b7655923a..0356d329d69 100644 --- a/docs/src/pages/core/image.mdx +++ b/docs/src/pages/core/image.mdx @@ -1,6 +1,6 @@ +import { ImageDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ImageDemos } from '@docs/demos'; export default Layout(MDX_DATA.Image); diff --git a/docs/src/pages/core/indicator.mdx b/docs/src/pages/core/indicator.mdx index 7de1c777ac6..b4e32b928ad 100644 --- a/docs/src/pages/core/indicator.mdx +++ b/docs/src/pages/core/indicator.mdx @@ -1,6 +1,6 @@ +import { IndicatorDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { IndicatorDemos } from '@docs/demos'; export default Layout(MDX_DATA.Indicator); diff --git a/docs/src/pages/core/input.mdx b/docs/src/pages/core/input.mdx index 281937f5e42..edd46b1981e 100644 --- a/docs/src/pages/core/input.mdx +++ b/docs/src/pages/core/input.mdx @@ -1,6 +1,6 @@ +import { InputDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { InputDemos } from '@docs/demos'; export default Layout(MDX_DATA.Input); @@ -211,8 +211,8 @@ function Demo() { You can use [use-id](/hooks/use-id) to generate unique ids: ```tsx -import { useId } from '@mantine/hooks'; import { Input } from '@mantine/core'; +import { useId } from '@mantine/hooks'; function Demo() { const id = useId(); diff --git a/docs/src/pages/core/json-input.mdx b/docs/src/pages/core/json-input.mdx index 6865c4da52a..94f6a73fde6 100644 --- a/docs/src/pages/core/json-input.mdx +++ b/docs/src/pages/core/json-input.mdx @@ -1,6 +1,6 @@ +import { JsonInputDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { JsonInputDemos } from '@docs/demos'; export default Layout(MDX_DATA.JsonInput); diff --git a/docs/src/pages/core/kbd.mdx b/docs/src/pages/core/kbd.mdx index 9969a0de449..5c3246fcd7f 100644 --- a/docs/src/pages/core/kbd.mdx +++ b/docs/src/pages/core/kbd.mdx @@ -1,6 +1,6 @@ +import { KbdDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { KbdDemos } from '@docs/demos'; export default Layout(MDX_DATA.Kbd); diff --git a/docs/src/pages/core/list.mdx b/docs/src/pages/core/list.mdx index 415a278f836..e196fe2c96b 100644 --- a/docs/src/pages/core/list.mdx +++ b/docs/src/pages/core/list.mdx @@ -1,6 +1,6 @@ +import { ListDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ListDemos } from '@docs/demos'; export default Layout(MDX_DATA.List); diff --git a/docs/src/pages/core/loader.mdx b/docs/src/pages/core/loader.mdx index ebb7d72c2e3..3768c485551 100644 --- a/docs/src/pages/core/loader.mdx +++ b/docs/src/pages/core/loader.mdx @@ -1,6 +1,6 @@ +import { LoaderDemos, LoadingOverlayDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { LoaderDemos, LoadingOverlayDemos } from '@docs/demos'; export default Layout(MDX_DATA.Loader); diff --git a/docs/src/pages/core/loading-overlay.mdx b/docs/src/pages/core/loading-overlay.mdx index b0da12cb0b9..79df45e1d78 100644 --- a/docs/src/pages/core/loading-overlay.mdx +++ b/docs/src/pages/core/loading-overlay.mdx @@ -1,6 +1,6 @@ +import { LoadingOverlayDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { LoadingOverlayDemos } from '@docs/demos'; export default Layout(MDX_DATA.LoadingOverlay); diff --git a/docs/src/pages/core/mark.mdx b/docs/src/pages/core/mark.mdx index 621ec684ae9..82afaaf8848 100644 --- a/docs/src/pages/core/mark.mdx +++ b/docs/src/pages/core/mark.mdx @@ -1,6 +1,6 @@ +import { MarkDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { MarkDemos } from '@docs/demos'; export default Layout(MDX_DATA.Mark); diff --git a/docs/src/pages/core/menu.mdx b/docs/src/pages/core/menu.mdx index 6540131f6ee..2f3b95f3aeb 100644 --- a/docs/src/pages/core/menu.mdx +++ b/docs/src/pages/core/menu.mdx @@ -1,6 +1,6 @@ +import { MenuDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { MenuDemos } from '@docs/demos'; export default Layout(MDX_DATA.Menu); diff --git a/docs/src/pages/core/modal.mdx b/docs/src/pages/core/modal.mdx index 1e9cbe82fd0..9793d9bde47 100644 --- a/docs/src/pages/core/modal.mdx +++ b/docs/src/pages/core/modal.mdx @@ -1,6 +1,6 @@ +import { ModalDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ModalDemos } from '@docs/demos'; export default Layout(MDX_DATA.Modal); diff --git a/docs/src/pages/core/multi-select.mdx b/docs/src/pages/core/multi-select.mdx index e36a29db68c..2e39ab8d0c3 100644 --- a/docs/src/pages/core/multi-select.mdx +++ b/docs/src/pages/core/multi-select.mdx @@ -1,6 +1,6 @@ +import { MultiSelectDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { MultiSelectDemos } from '@docs/demos'; export default Layout(MDX_DATA.MultiSelect); diff --git a/docs/src/pages/core/native-select.mdx b/docs/src/pages/core/native-select.mdx index 4c2d6e892a5..a6f0d4f6872 100644 --- a/docs/src/pages/core/native-select.mdx +++ b/docs/src/pages/core/native-select.mdx @@ -1,6 +1,6 @@ +import { NativeSelectDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { NativeSelectDemos } from '@docs/demos'; export default Layout(MDX_DATA.NativeSelect); diff --git a/docs/src/pages/core/nav-link.mdx b/docs/src/pages/core/nav-link.mdx index 18f84f031a8..6a475a0dbc1 100644 --- a/docs/src/pages/core/nav-link.mdx +++ b/docs/src/pages/core/nav-link.mdx @@ -1,6 +1,6 @@ +import { NavLinkDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { NavLinkDemos } from '@docs/demos'; export default Layout(MDX_DATA.NavLink); diff --git a/docs/src/pages/core/notification.mdx b/docs/src/pages/core/notification.mdx index ae56a03cbce..2a5019ab336 100644 --- a/docs/src/pages/core/notification.mdx +++ b/docs/src/pages/core/notification.mdx @@ -1,6 +1,6 @@ +import { NotificationDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { NotificationDemos } from '@docs/demos'; export default Layout(MDX_DATA.Notification); diff --git a/docs/src/pages/core/number-formatter.mdx b/docs/src/pages/core/number-formatter.mdx index 3671311c659..f2c5e43887b 100644 --- a/docs/src/pages/core/number-formatter.mdx +++ b/docs/src/pages/core/number-formatter.mdx @@ -1,6 +1,6 @@ +import { NumberFormatterDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { NumberFormatterDemos } from '@docs/demos'; export default Layout(MDX_DATA.NumberFormatter); diff --git a/docs/src/pages/core/number-input.mdx b/docs/src/pages/core/number-input.mdx index 572e8d8d57b..56f5e276886 100644 --- a/docs/src/pages/core/number-input.mdx +++ b/docs/src/pages/core/number-input.mdx @@ -1,6 +1,6 @@ +import { NumberInputDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { NumberInputDemos } from '@docs/demos'; export default Layout(MDX_DATA.NumberInput); diff --git a/docs/src/pages/core/overlay.mdx b/docs/src/pages/core/overlay.mdx index 5b34e39897c..f004608f7ef 100644 --- a/docs/src/pages/core/overlay.mdx +++ b/docs/src/pages/core/overlay.mdx @@ -1,6 +1,6 @@ +import { OverlayDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { OverlayDemos } from '@docs/demos'; export default Layout(MDX_DATA.Overlay); diff --git a/docs/src/pages/core/pagination.mdx b/docs/src/pages/core/pagination.mdx index 55551fc2211..d26679df1f6 100644 --- a/docs/src/pages/core/pagination.mdx +++ b/docs/src/pages/core/pagination.mdx @@ -1,6 +1,6 @@ +import { PaginationDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { PaginationDemos } from '@docs/demos'; export default Layout(MDX_DATA.Pagination); diff --git a/docs/src/pages/core/paper.mdx b/docs/src/pages/core/paper.mdx index e2f947d7ac0..2e6aa6eeea9 100644 --- a/docs/src/pages/core/paper.mdx +++ b/docs/src/pages/core/paper.mdx @@ -1,6 +1,6 @@ +import { PaperDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { PaperDemos } from '@docs/demos'; export default Layout(MDX_DATA.Paper); diff --git a/docs/src/pages/core/password-input.mdx b/docs/src/pages/core/password-input.mdx index 791d99b64e1..03be6d341d1 100644 --- a/docs/src/pages/core/password-input.mdx +++ b/docs/src/pages/core/password-input.mdx @@ -1,6 +1,6 @@ +import { PasswordInputDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { PasswordInputDemos } from '@docs/demos'; export default Layout(MDX_DATA.PasswordInput); diff --git a/docs/src/pages/core/pill.mdx b/docs/src/pages/core/pill.mdx index eef94f5f670..570af4d0309 100644 --- a/docs/src/pages/core/pill.mdx +++ b/docs/src/pages/core/pill.mdx @@ -1,6 +1,6 @@ +import { PillDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { PillDemos } from '@docs/demos'; export default Layout(MDX_DATA.Pill); diff --git a/docs/src/pages/core/pills-input.mdx b/docs/src/pages/core/pills-input.mdx index ce2a3cdcd24..5539885b785 100644 --- a/docs/src/pages/core/pills-input.mdx +++ b/docs/src/pages/core/pills-input.mdx @@ -1,6 +1,6 @@ +import { ComboboxDemos, PillsInputDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { PillsInputDemos, ComboboxDemos } from '@docs/demos'; export default Layout(MDX_DATA.PillsInput); diff --git a/docs/src/pages/core/pin-input.mdx b/docs/src/pages/core/pin-input.mdx index 80140fa3cad..42c55fefd01 100644 --- a/docs/src/pages/core/pin-input.mdx +++ b/docs/src/pages/core/pin-input.mdx @@ -1,6 +1,6 @@ +import { PinInputDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { PinInputDemos } from '@docs/demos'; export default Layout(MDX_DATA.PinInput); diff --git a/docs/src/pages/core/popover.mdx b/docs/src/pages/core/popover.mdx index cafe36b075f..7913be539f7 100644 --- a/docs/src/pages/core/popover.mdx +++ b/docs/src/pages/core/popover.mdx @@ -1,6 +1,6 @@ +import { PopoverDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { PopoverDemos } from '@docs/demos'; export default Layout(MDX_DATA.Popover); @@ -14,7 +14,7 @@ You can control Popover state with `opened` and `onChange` props: ```tsx import { useState } from 'react'; -import { Popover, Button } from '@mantine/core'; +import { Button, Popover } from '@mantine/core'; function Demo() { const [opened, setOpened] = useState(false); diff --git a/docs/src/pages/core/progress.mdx b/docs/src/pages/core/progress.mdx index 84643a0895a..e7c44d23715 100644 --- a/docs/src/pages/core/progress.mdx +++ b/docs/src/pages/core/progress.mdx @@ -1,6 +1,6 @@ +import { ProgressDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ProgressDemos } from '@docs/demos'; export default Layout(MDX_DATA.Progress); diff --git a/docs/src/pages/core/radio.mdx b/docs/src/pages/core/radio.mdx index 74619c41f1d..fb44d177ab6 100644 --- a/docs/src/pages/core/radio.mdx +++ b/docs/src/pages/core/radio.mdx @@ -1,6 +1,6 @@ +import { RadioDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { RadioDemos } from '@docs/demos'; export default Layout(MDX_DATA.Radio); @@ -47,7 +47,7 @@ By default, radio input and label have `cursor: default` (same as native `input[ To change cursor to pointer, set `cursorType` on [theme](/theming/theme-object/): ```tsx -import { MantineProvider, createTheme, Radio } from '@mantine/core'; +import { createTheme, MantineProvider, Radio } from '@mantine/core'; const theme = createTheme({ cursorType: 'pointer', diff --git a/docs/src/pages/core/rating.mdx b/docs/src/pages/core/rating.mdx index 25d75b97ff1..6838a36b50a 100644 --- a/docs/src/pages/core/rating.mdx +++ b/docs/src/pages/core/rating.mdx @@ -1,6 +1,6 @@ +import { RatingDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { RatingDemos } from '@docs/demos'; export default Layout(MDX_DATA.Rating); diff --git a/docs/src/pages/core/ring-progress.mdx b/docs/src/pages/core/ring-progress.mdx index 4caf55faf83..05cf683fbb6 100644 --- a/docs/src/pages/core/ring-progress.mdx +++ b/docs/src/pages/core/ring-progress.mdx @@ -1,6 +1,6 @@ +import { RingProgressDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { RingProgressDemos } from '@docs/demos'; export default Layout(MDX_DATA.RingProgress); diff --git a/docs/src/pages/core/scroll-area.mdx b/docs/src/pages/core/scroll-area.mdx index da93e2ac09e..4ffad8bad30 100644 --- a/docs/src/pages/core/scroll-area.mdx +++ b/docs/src/pages/core/scroll-area.mdx @@ -1,6 +1,6 @@ +import { ScrollAreaDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ScrollAreaDemos } from '@docs/demos'; export default Layout(MDX_DATA.ScrollArea); diff --git a/docs/src/pages/core/segmented-control.mdx b/docs/src/pages/core/segmented-control.mdx index 2f88cf04209..cb0018a7f1e 100644 --- a/docs/src/pages/core/segmented-control.mdx +++ b/docs/src/pages/core/segmented-control.mdx @@ -1,6 +1,6 @@ +import { SegmentedControlDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { SegmentedControlDemos } from '@docs/demos'; export default Layout(MDX_DATA.SegmentedControl); diff --git a/docs/src/pages/core/select.mdx b/docs/src/pages/core/select.mdx index 2744ee7d0fb..ae5f79da38c 100644 --- a/docs/src/pages/core/select.mdx +++ b/docs/src/pages/core/select.mdx @@ -1,6 +1,6 @@ +import { SelectDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { SelectDemos } from '@docs/demos'; export default Layout(MDX_DATA.Select); diff --git a/docs/src/pages/core/simple-grid.mdx b/docs/src/pages/core/simple-grid.mdx index cb35781d6db..3624d9179f2 100644 --- a/docs/src/pages/core/simple-grid.mdx +++ b/docs/src/pages/core/simple-grid.mdx @@ -1,6 +1,6 @@ +import { SimpleGridDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { SimpleGridDemos } from '@docs/demos'; export default Layout(MDX_DATA.SimpleGrid); diff --git a/docs/src/pages/core/skeleton.mdx b/docs/src/pages/core/skeleton.mdx index 1a752415eab..f535bcc8bdd 100644 --- a/docs/src/pages/core/skeleton.mdx +++ b/docs/src/pages/core/skeleton.mdx @@ -1,6 +1,6 @@ +import { SkeletonDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { SkeletonDemos } from '@docs/demos'; export default Layout(MDX_DATA.Skeleton); diff --git a/docs/src/pages/core/slider.mdx b/docs/src/pages/core/slider.mdx index 940d964e430..9477ac703b9 100644 --- a/docs/src/pages/core/slider.mdx +++ b/docs/src/pages/core/slider.mdx @@ -1,6 +1,6 @@ +import { SliderDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { SliderDemos } from '@docs/demos'; export default Layout(MDX_DATA.Slider); @@ -134,7 +134,7 @@ If you need this feature you can build it yourself with [use-move](/hooks/use-mo To label component for screen readers, add labels to thumbs: ```tsx -import { Slider, RangeSlider } from '@mantine/core'; +import { RangeSlider, Slider } from '@mantine/core'; function Demo() { return ( diff --git a/docs/src/pages/core/space.mdx b/docs/src/pages/core/space.mdx index de2494f90af..272ca88d87f 100644 --- a/docs/src/pages/core/space.mdx +++ b/docs/src/pages/core/space.mdx @@ -1,6 +1,6 @@ +import { SpaceDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { SpaceDemos } from '@docs/demos'; export default Layout(MDX_DATA.Space); @@ -19,7 +19,7 @@ Use `Space` component to add horizontal or vertical spacing between elements: In most cases, you would want to use margin props instead of `Space` when working with Mantine components: ```tsx -import { Text, Space } from '@mantine/core'; +import { Space, Text } from '@mantine/core'; // Space is not required as the same can be achieved with `mt` prop function Demo() { diff --git a/docs/src/pages/core/spoiler.mdx b/docs/src/pages/core/spoiler.mdx index a7e5b90a7c2..d65da1514d4 100644 --- a/docs/src/pages/core/spoiler.mdx +++ b/docs/src/pages/core/spoiler.mdx @@ -1,6 +1,6 @@ +import { SpoilerDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { SpoilerDemos } from '@docs/demos'; export default Layout(MDX_DATA.Spoiler); diff --git a/docs/src/pages/core/stack.mdx b/docs/src/pages/core/stack.mdx index 20c8ec943e3..bf8a53cd4c6 100644 --- a/docs/src/pages/core/stack.mdx +++ b/docs/src/pages/core/stack.mdx @@ -1,6 +1,6 @@ +import { StackDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { StackDemos } from '@docs/demos'; export default Layout(MDX_DATA.Stack); diff --git a/docs/src/pages/core/stepper.mdx b/docs/src/pages/core/stepper.mdx index 5278c0e2311..365cf904c68 100644 --- a/docs/src/pages/core/stepper.mdx +++ b/docs/src/pages/core/stepper.mdx @@ -1,6 +1,6 @@ +import { StepperDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { StepperDemos } from '@docs/demos'; export default Layout(MDX_DATA.Stepper); diff --git a/docs/src/pages/core/switch.mdx b/docs/src/pages/core/switch.mdx index 0e9bfcb22b0..a6871197368 100644 --- a/docs/src/pages/core/switch.mdx +++ b/docs/src/pages/core/switch.mdx @@ -1,6 +1,6 @@ +import { SwitchDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { SwitchDemos } from '@docs/demos'; export default Layout(MDX_DATA.Switch); @@ -49,7 +49,7 @@ By default, switch input and label have `cursor: default` (same as native `input To change cursor to pointer, set `cursorType` on [theme](/theming/theme-object/): ```tsx -import { MantineProvider, createTheme, Switch } from '@mantine/core'; +import { createTheme, MantineProvider, Switch } from '@mantine/core'; const theme = createTheme({ cursorType: 'pointer', diff --git a/docs/src/pages/core/table.mdx b/docs/src/pages/core/table.mdx index e314ba8d73a..b19eedd0cbf 100644 --- a/docs/src/pages/core/table.mdx +++ b/docs/src/pages/core/table.mdx @@ -1,6 +1,6 @@ +import { TableDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { TableDemos } from '@docs/demos'; export default Layout(MDX_DATA.Table); diff --git a/docs/src/pages/core/tabs.mdx b/docs/src/pages/core/tabs.mdx index 581bd61f5ac..db9b8791ed3 100644 --- a/docs/src/pages/core/tabs.mdx +++ b/docs/src/pages/core/tabs.mdx @@ -1,6 +1,6 @@ +import { TabsDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { TabsDemos } from '@docs/demos'; export default Layout(MDX_DATA.Tabs); @@ -218,8 +218,8 @@ If you use `Tabs.Tab` without text content, for example, only with icon, then se or use [VisuallyHidden](/core/visually-hidden) component: ```tsx -import { Tabs, VisuallyHidden } from '@mantine/core'; import { IconCoin } from '@tabler/icons-react'; +import { Tabs, VisuallyHidden } from '@mantine/core'; function Demo() { return ( diff --git a/docs/src/pages/core/tags-input.mdx b/docs/src/pages/core/tags-input.mdx index b9c8d0d7cbc..d60a410bd36 100644 --- a/docs/src/pages/core/tags-input.mdx +++ b/docs/src/pages/core/tags-input.mdx @@ -1,6 +1,6 @@ +import { TagsInputDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { TagsInputDemos } from '@docs/demos'; export default Layout(MDX_DATA.TagsInput); diff --git a/docs/src/pages/core/text-input.mdx b/docs/src/pages/core/text-input.mdx index 369be7f0566..3592be1bd8b 100644 --- a/docs/src/pages/core/text-input.mdx +++ b/docs/src/pages/core/text-input.mdx @@ -1,6 +1,6 @@ +import { TextInputDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { TextInputDemos } from '@docs/demos'; export default Layout(MDX_DATA.TextInput); diff --git a/docs/src/pages/core/text.mdx b/docs/src/pages/core/text.mdx index 8a8dd017f46..89e83a09529 100644 --- a/docs/src/pages/core/text.mdx +++ b/docs/src/pages/core/text.mdx @@ -1,6 +1,6 @@ +import { TextDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { TextDemos } from '@docs/demos'; export default Layout(MDX_DATA.Text); diff --git a/docs/src/pages/core/textarea.mdx b/docs/src/pages/core/textarea.mdx index 7f0cd3283ec..174ca2577a0 100644 --- a/docs/src/pages/core/textarea.mdx +++ b/docs/src/pages/core/textarea.mdx @@ -1,6 +1,6 @@ +import { TextareaDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { TextareaDemos } from '@docs/demos'; export default Layout(MDX_DATA.Textarea); diff --git a/docs/src/pages/core/theme-icon.mdx b/docs/src/pages/core/theme-icon.mdx index 2f8e03da2e6..1856335d832 100644 --- a/docs/src/pages/core/theme-icon.mdx +++ b/docs/src/pages/core/theme-icon.mdx @@ -1,6 +1,6 @@ +import { ThemeIconDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ThemeIconDemos } from '@docs/demos'; export default Layout(MDX_DATA.ThemeIcon); diff --git a/docs/src/pages/core/timeline.mdx b/docs/src/pages/core/timeline.mdx index f8d4db88757..73edbaf31dd 100644 --- a/docs/src/pages/core/timeline.mdx +++ b/docs/src/pages/core/timeline.mdx @@ -1,6 +1,6 @@ +import { TimelineDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { TimelineDemos } from '@docs/demos'; export default Layout(MDX_DATA.Timeline); diff --git a/docs/src/pages/core/title.mdx b/docs/src/pages/core/title.mdx index a66c8d55823..0f86bab9377 100644 --- a/docs/src/pages/core/title.mdx +++ b/docs/src/pages/core/title.mdx @@ -1,6 +1,6 @@ +import { TitleDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { TitleDemos } from '@docs/demos'; export default Layout(MDX_DATA.Title); diff --git a/docs/src/pages/core/tooltip.mdx b/docs/src/pages/core/tooltip.mdx index 7b9b39ef790..ee6819a9669 100644 --- a/docs/src/pages/core/tooltip.mdx +++ b/docs/src/pages/core/tooltip.mdx @@ -1,6 +1,6 @@ +import { TooltipDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { TooltipDemos } from '@docs/demos'; export default Layout(MDX_DATA.Tooltip); @@ -16,7 +16,7 @@ Custom components must provide a prop to get root element ref, all Mantine components support ref out of the box. ```tsx -import { Tooltip, Badge } from '@mantine/core'; +import { Badge, Tooltip } from '@mantine/core'; function Demo() { return ( @@ -167,7 +167,7 @@ Set `inline` prop to use `Tooltip` with inline elements: Tooltip is built with [Transition](/core/transition/) component, it supports `transitionProps` props: ```tsx -import { Tooltip, Button } from '@mantine/core'; +import { Button, Tooltip } from '@mantine/core'; function Demo() { return ( @@ -265,7 +265,7 @@ or navigate with keyboard will not be able to get tooltip content. Set `events` focus/blur tooltip events: ```tsx -import { Tooltip, Button } from '@mantine/core'; +import { Button, Tooltip } from '@mantine/core'; // Tooltip will be visible for screen readers function Demo() { diff --git a/docs/src/pages/core/transition.mdx b/docs/src/pages/core/transition.mdx index 31612ebfdd6..bffa6e97fd9 100644 --- a/docs/src/pages/core/transition.mdx +++ b/docs/src/pages/core/transition.mdx @@ -1,6 +1,6 @@ +import { TooltipDemos, TransitionDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { TooltipDemos, TransitionDemos } from '@docs/demos'; export default Layout(MDX_DATA.Transition); diff --git a/docs/src/pages/core/typography-styles-provider.mdx b/docs/src/pages/core/typography-styles-provider.mdx index 7594a75870e..e5fac76f7ef 100644 --- a/docs/src/pages/core/typography-styles-provider.mdx +++ b/docs/src/pages/core/typography-styles-provider.mdx @@ -1,6 +1,6 @@ +import { TypographyStylesProviderDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { TypographyStylesProviderDemos } from '@docs/demos'; export default Layout(MDX_DATA.TypographyStylesProvider); diff --git a/docs/src/pages/core/unstyled-button.mdx b/docs/src/pages/core/unstyled-button.mdx index bf37cfc42da..2014e4367f8 100644 --- a/docs/src/pages/core/unstyled-button.mdx +++ b/docs/src/pages/core/unstyled-button.mdx @@ -1,6 +1,6 @@ +import { UnstyledButtonDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { UnstyledButtonDemos } from '@docs/demos'; export default Layout(MDX_DATA.UnstyledButton); diff --git a/docs/src/pages/core/visually-hidden.mdx b/docs/src/pages/core/visually-hidden.mdx index 2a5dfbec2d3..6049dc3d6ca 100644 --- a/docs/src/pages/core/visually-hidden.mdx +++ b/docs/src/pages/core/visually-hidden.mdx @@ -10,8 +10,8 @@ export default Layout(MDX_DATA.VisuallyHidden); For example, it can be used with [ActionIcon](/core/action-icon) component: ```tsx -import { ActionIcon, VisuallyHidden } from '@mantine/core'; import { IconHeart } from '@tabler/icons'; +import { ActionIcon, VisuallyHidden } from '@mantine/core'; function Demo() { return ( diff --git a/docs/src/pages/dates/calendar.mdx b/docs/src/pages/dates/calendar.mdx index a2889670d3b..006f2151e13 100644 --- a/docs/src/pages/dates/calendar.mdx +++ b/docs/src/pages/dates/calendar.mdx @@ -1,6 +1,6 @@ +import { CalendarDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { CalendarDemos } from '@docs/demos'; export default Layout(MDX_DATA.Calendar); diff --git a/docs/src/pages/dates/date-input.mdx b/docs/src/pages/dates/date-input.mdx index ae93f43f510..a15c62dfbe8 100644 --- a/docs/src/pages/dates/date-input.mdx +++ b/docs/src/pages/dates/date-input.mdx @@ -1,6 +1,6 @@ +import { DateInputDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { DateInputDemos } from '@docs/demos'; export default Layout(MDX_DATA.DateInput); diff --git a/docs/src/pages/dates/date-picker-input.mdx b/docs/src/pages/dates/date-picker-input.mdx index 01174b942dc..65071267f03 100644 --- a/docs/src/pages/dates/date-picker-input.mdx +++ b/docs/src/pages/dates/date-picker-input.mdx @@ -1,6 +1,6 @@ +import { DatePickerInputDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { DatePickerInputDemos } from '@docs/demos'; export default Layout(MDX_DATA.DatePickerInput); diff --git a/docs/src/pages/dates/date-picker.mdx b/docs/src/pages/dates/date-picker.mdx index 612f2f11f13..f471fc8b563 100644 --- a/docs/src/pages/dates/date-picker.mdx +++ b/docs/src/pages/dates/date-picker.mdx @@ -1,6 +1,6 @@ +import { DatePickerDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { DatePickerDemos } from '@docs/demos'; export default Layout(MDX_DATA.DatePicker); diff --git a/docs/src/pages/dates/date-time-picker.mdx b/docs/src/pages/dates/date-time-picker.mdx index 73d58d78fa0..fb024bec17b 100644 --- a/docs/src/pages/dates/date-time-picker.mdx +++ b/docs/src/pages/dates/date-time-picker.mdx @@ -1,6 +1,6 @@ +import { DateTimePickerDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { DateTimePickerDemos } from '@docs/demos'; export default Layout(MDX_DATA.DateTimePicker); diff --git a/docs/src/pages/dates/dates-provider.mdx b/docs/src/pages/dates/dates-provider.mdx index 7f93f116f63..de7e864ca1a 100644 --- a/docs/src/pages/dates/dates-provider.mdx +++ b/docs/src/pages/dates/dates-provider.mdx @@ -1,6 +1,6 @@ +import { DatesProviderDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { DatesProviderDemos } from '@docs/demos'; export default Layout(MDX_DATA.DatesProvider); diff --git a/docs/src/pages/dates/getting-started.mdx b/docs/src/pages/dates/getting-started.mdx index 787236ba655..9aa29cebb52 100644 --- a/docs/src/pages/dates/getting-started.mdx +++ b/docs/src/pages/dates/getting-started.mdx @@ -1,6 +1,6 @@ +import { DatePickerInputDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { DatePickerInputDemos } from '@docs/demos'; export default Layout(MDX_DATA.GettingStartedDates); @@ -48,10 +48,11 @@ Example of setting locale on DatesProvider: ```tsx import 'dayjs/locale/ru'; + import { + DatePickerInput, DatesProvider, MonthPickerInput, - DatePickerInput, } from '@mantine/dates'; function Demo() { @@ -72,10 +73,11 @@ is required both on client and server. 'use client'; import 'dayjs/locale/ru'; + import { + DatePickerInput, DatesProvider, MonthPickerInput, - DatePickerInput, } from '@mantine/dates'; function Demo() { diff --git a/docs/src/pages/dates/month-picker-input.mdx b/docs/src/pages/dates/month-picker-input.mdx index cb49cbc0435..4ddf2c5d568 100644 --- a/docs/src/pages/dates/month-picker-input.mdx +++ b/docs/src/pages/dates/month-picker-input.mdx @@ -1,6 +1,6 @@ +import { MonthPickerInputDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { MonthPickerInputDemos } from '@docs/demos'; export default Layout(MDX_DATA.MonthPickerInput); diff --git a/docs/src/pages/dates/month-picker.mdx b/docs/src/pages/dates/month-picker.mdx index a6ddb9d5d99..c8823040895 100644 --- a/docs/src/pages/dates/month-picker.mdx +++ b/docs/src/pages/dates/month-picker.mdx @@ -1,6 +1,6 @@ +import { MonthPickerDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { MonthPickerDemos } from '@docs/demos'; export default Layout(MDX_DATA.MonthPicker); diff --git a/docs/src/pages/dates/time-input.mdx b/docs/src/pages/dates/time-input.mdx index f71fe2fd84e..61d820fb03b 100644 --- a/docs/src/pages/dates/time-input.mdx +++ b/docs/src/pages/dates/time-input.mdx @@ -1,6 +1,6 @@ +import { TimeInputDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { TimeInputDemos } from '@docs/demos'; export default Layout(MDX_DATA.TimeInput); diff --git a/docs/src/pages/dates/year-picker-input.mdx b/docs/src/pages/dates/year-picker-input.mdx index 5d137d898c5..246b2ee8e32 100644 --- a/docs/src/pages/dates/year-picker-input.mdx +++ b/docs/src/pages/dates/year-picker-input.mdx @@ -1,6 +1,6 @@ +import { YearPickerInputDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { YearPickerInputDemos } from '@docs/demos'; export default Layout(MDX_DATA.YearPickerInput); diff --git a/docs/src/pages/dates/year-picker.mdx b/docs/src/pages/dates/year-picker.mdx index ba237d27735..ace4cd8a2d5 100644 --- a/docs/src/pages/dates/year-picker.mdx +++ b/docs/src/pages/dates/year-picker.mdx @@ -1,6 +1,6 @@ +import { YearPickerDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { YearPickerDemos } from '@docs/demos'; export default Layout(MDX_DATA.YearPicker); diff --git a/docs/src/pages/form/actions.mdx b/docs/src/pages/form/actions.mdx index 1406e2aeab3..09e7a7a3c5f 100644 --- a/docs/src/pages/form/actions.mdx +++ b/docs/src/pages/form/actions.mdx @@ -34,8 +34,8 @@ Then call `createFormActions` function with the same form name as specified in ` ```tsx // Import type of form values from the file where you defined useForm -import type { DemoFormValues } from './DemoForm'; import { createFormActions } from '@mantine/form'; +import type { DemoFormValues } from './DemoForm'; export const demoFormActions = createFormActions('demo-form'); diff --git a/docs/src/pages/form/create-form-context.mdx b/docs/src/pages/form/create-form-context.mdx index bf5e7542b52..ed14f9d395a 100644 --- a/docs/src/pages/form/create-form-context.mdx +++ b/docs/src/pages/form/create-form-context.mdx @@ -1,6 +1,6 @@ +import { FormDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { FormDemos } from '@docs/demos'; export default Layout(MDX_DATA.createFormContext); @@ -9,8 +9,8 @@ export default Layout(MDX_DATA.createFormContext); `createFormContext` function creates context provider and hook to get form object from context: ```tsx -import { createFormContext } from '@mantine/form'; import { TextInput } from '@mantine/core'; +import { createFormContext } from '@mantine/form'; // Definition of form values is required interface FormValues { diff --git a/docs/src/pages/form/errors.mdx b/docs/src/pages/form/errors.mdx index 985c79d1f66..8b15af33527 100644 --- a/docs/src/pages/form/errors.mdx +++ b/docs/src/pages/form/errors.mdx @@ -1,6 +1,6 @@ +import { FormDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { FormDemos } from '@docs/demos'; export default Layout(MDX_DATA.formErrors); diff --git a/docs/src/pages/form/nested.mdx b/docs/src/pages/form/nested.mdx index f9d0802a453..5d7670f9afa 100644 --- a/docs/src/pages/form/nested.mdx +++ b/docs/src/pages/form/nested.mdx @@ -1,6 +1,6 @@ +import { FormDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { FormDemos } from '@docs/demos'; export default Layout(MDX_DATA.formNested); diff --git a/docs/src/pages/form/recipes.mdx b/docs/src/pages/form/recipes.mdx index dc23689ef84..fee853382e9 100644 --- a/docs/src/pages/form/recipes.mdx +++ b/docs/src/pages/form/recipes.mdx @@ -1,6 +1,6 @@ +import { FormDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { FormDemos } from '@docs/demos'; export default Layout(MDX_DATA.formRecipes); diff --git a/docs/src/pages/form/schema-validation.mdx b/docs/src/pages/form/schema-validation.mdx index 46b1c72085e..3a7f946b48d 100644 --- a/docs/src/pages/form/schema-validation.mdx +++ b/docs/src/pages/form/schema-validation.mdx @@ -25,9 +25,9 @@ Installation: Basic fields validation: ```tsx +import { zodResolver } from 'mantine-form-zod-resolver'; import { z } from 'zod'; import { useForm } from '@mantine/form'; -import { zodResolver } from 'mantine-form-zod-resolver'; const schema = z.object({ name: z @@ -60,9 +60,9 @@ form.errors; Nested fields validation ```tsx +import { zodResolver } from 'mantine-form-zod-resolver'; import { z } from 'zod'; import { useForm } from '@mantine/form'; -import { zodResolver } from 'mantine-form-zod-resolver'; const nestedSchema = z.object({ nested: z.object({ @@ -91,9 +91,9 @@ form.errors; List fields validation: ```tsx +import { zodResolver } from 'mantine-form-zod-resolver'; import { z } from 'zod'; import { useForm } from '@mantine/form'; -import { zodResolver } from 'mantine-form-zod-resolver'; const listSchema = z.object({ list: z.array( @@ -128,9 +128,9 @@ Installation: Basic fields validation: ```tsx +import { yupResolver } from 'mantine-form-yup-resolver'; import * as yup from 'yup'; import { useForm } from '@mantine/form'; -import { yupResolver } from 'mantine-form-yup-resolver'; const schema = yup.object().shape({ name: yup.string().min(2, 'Name should have at least 2 letters'), @@ -164,9 +164,9 @@ form.errors; Nested fields validation: ```tsx +import { yupResolver } from 'mantine-form-yup-resolver'; import * as yup from 'yup'; import { useForm } from '@mantine/form'; -import { yupResolver } from 'mantine-form-yup-resolver'; const nestedSchema = yup.object().shape({ nested: yup.object().shape({ @@ -195,9 +195,9 @@ form.errors; List fields validation: ```tsx +import { yupResolver } from 'mantine-form-yup-resolver'; import * as yup from 'yup'; import { useForm } from '@mantine/form'; -import { yupResolver } from 'mantine-form-yup-resolver'; const listSchema = yup.object().shape({ list: yup.array().of( @@ -233,8 +233,8 @@ Basic fields validation: ```tsx import Joi from 'joi'; -import { useForm } from '@mantine/form'; import { joiResolver } from 'mantine-form-joi-resolver'; +import { useForm } from '@mantine/form'; const schema = Joi.object({ name: Joi.string().min(2).messages({ @@ -274,8 +274,8 @@ Nested fields validation: ```tsx import Joi from 'joi'; -import { useForm } from '@mantine/form'; import { joiResolver } from 'mantine-form-joi-resolver'; +import { useForm } from '@mantine/form'; const nestedSchema = Joi.object({ nested: Joi.object({ @@ -305,8 +305,8 @@ List fields validation: ```tsx import Joi from 'joi'; -import { useForm } from '@mantine/form'; import { joiResolver } from 'mantine-form-joi-resolver'; +import { useForm } from '@mantine/form'; const listSchema = Joi.object({ list: Joi.array().items( @@ -342,9 +342,9 @@ Installation: Basic fields validation: ```tsx -import * as s from 'superstruct'; import isEmail from 'is-email'; import { superstructResolver } from 'mantine-form-superstruct-resolver'; +import * as s from 'superstruct'; const emailString = s.define('email', isEmail); @@ -375,9 +375,9 @@ form.errors; Nested fields validation: ```tsx +import { superstructResolver } from 'mantine-form-superstruct-resolver'; import * as s from 'superstruct'; import { useForm } from '@mantine/form'; -import { superstructResolver } from 'mantine-form-superstruct-resolver'; const nestedSchema = s.object({ nested: s.object({ @@ -404,9 +404,9 @@ form.errors; List fields validation: ```tsx +import { superstructResolver } from 'mantine-form-superstruct-resolver'; import * as s from 'superstruct'; import { useForm } from '@mantine/form'; -import { superstructResolver } from 'mantine-form-superstruct-resolver'; const listSchema = s.object({ list: s.array( diff --git a/docs/src/pages/form/status.mdx b/docs/src/pages/form/status.mdx index cdf618ecbf9..0832f4069cd 100644 --- a/docs/src/pages/form/status.mdx +++ b/docs/src/pages/form/status.mdx @@ -1,6 +1,6 @@ +import { FormDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { FormDemos } from '@docs/demos'; export default Layout(MDX_DATA.formStatus); diff --git a/docs/src/pages/form/use-form.mdx b/docs/src/pages/form/use-form.mdx index 9949f8afb27..6c7b39bdffd 100644 --- a/docs/src/pages/form/use-form.mdx +++ b/docs/src/pages/form/use-form.mdx @@ -1,6 +1,6 @@ +import { FormDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { FormDemos } from '@docs/demos'; export default Layout(MDX_DATA.useForm); diff --git a/docs/src/pages/form/validation.mdx b/docs/src/pages/form/validation.mdx index bee33285182..eab8fe0eb98 100644 --- a/docs/src/pages/form/validation.mdx +++ b/docs/src/pages/form/validation.mdx @@ -1,6 +1,6 @@ +import { FormDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { FormDemos } from '@docs/demos'; export default Layout(MDX_DATA.formValidation); diff --git a/docs/src/pages/form/validators.mdx b/docs/src/pages/form/validators.mdx index 28b7efb6c49..be3de47c2ba 100644 --- a/docs/src/pages/form/validators.mdx +++ b/docs/src/pages/form/validators.mdx @@ -1,6 +1,6 @@ +import { FormDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { FormDemos } from '@docs/demos'; export default Layout(MDX_DATA.formValidators); @@ -24,7 +24,7 @@ only have invalid styles without error message: values are considered to be empty. Strings are trimmed before validation. ```tsx -import { useForm, isNotEmpty } from '@mantine/form'; +import { isNotEmpty, useForm } from '@mantine/form'; const form = useForm({ initialValues: { @@ -55,7 +55,7 @@ const form = useForm({ `isEmail` uses `/^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,})+$/` regexp to determine whether form value is an email: ```tsx -import { useForm, isEmail } from '@mantine/form'; +import { isEmail, useForm } from '@mantine/form'; const form = useForm({ initialValues: { @@ -73,7 +73,7 @@ const form = useForm({ `matches` checks whether form value matches given regexp. If form value is not a string, validation will be failed. ```tsx -import { useForm, matches } from '@mantine/form'; +import { matches, useForm } from '@mantine/form'; const form = useForm({ initialValues: { @@ -91,7 +91,7 @@ const form = useForm({ `isInRange` checks whether form value is within given `min`-`max` range. If form value is not a number, validation will be failed. ```tsx -import { useForm, isInRange } from '@mantine/form'; +import { isInRange, useForm } from '@mantine/form'; const form = useForm({ initialValues: { @@ -143,7 +143,7 @@ const form = useForm({ Note that `matchesField` can only work with primitive values (arrays and objects cannot be compared). ```tsx -import { useForm, matchesField } from '@mantine/form'; +import { matchesField, useForm } from '@mantine/form'; const form = useForm({ initialValues: { diff --git a/docs/src/pages/form/values.mdx b/docs/src/pages/form/values.mdx index dd1fcc31917..023d78cf3b7 100644 --- a/docs/src/pages/form/values.mdx +++ b/docs/src/pages/form/values.mdx @@ -1,6 +1,6 @@ +import { FormDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { FormDemos } from '@docs/demos'; export default Layout(MDX_DATA.formValues); @@ -140,7 +140,7 @@ To get transformed values (output of [transformValues](#transformvalues)) use `T It is useful when you want to create a custom submit function: ```tsx -import { useForm, TransformedValues } from '@mantine/form'; +import { TransformedValues, useForm } from '@mantine/form'; function Demo() { const form = useForm({ diff --git a/docs/src/pages/getting-started.mdx b/docs/src/pages/getting-started.mdx index 755d7746ea8..1e83f2f9790 100644 --- a/docs/src/pages/getting-started.mdx +++ b/docs/src/pages/getting-started.mdx @@ -1,7 +1,7 @@ -import { Layout } from '@/layout'; -import { MDX_DATA } from '@/mdx'; import { FrameworksGuides } from '@/components/FrameworksGuides'; import { SocialCards } from '@/components/SocialCards'; +import { Layout } from '@/layout'; +import { MDX_DATA } from '@/mdx'; export default Layout(MDX_DATA.GettingStarted); @@ -98,7 +98,7 @@ import '@mantine/core/styles.css'; Wrap your application with [MantineProvider](/theming/mantine-provider/): ```tsx -import { MantineProvider, createTheme } from '@mantine/core'; +import { createTheme, MantineProvider } from '@mantine/core'; const theme = createTheme({ /** Put your mantine theme override here */ diff --git a/docs/src/pages/guides/6x-to-7x.mdx b/docs/src/pages/guides/6x-to-7x.mdx index 9015625d099..ed9fb428908 100644 --- a/docs/src/pages/guides/6x-to-7x.mdx +++ b/docs/src/pages/guides/6x-to-7x.mdx @@ -1,6 +1,6 @@ +import { ThemingDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ThemingDemos } from '@docs/demos'; export default Layout(MDX_DATA.SixToSeven); diff --git a/docs/src/pages/guides/gatsby.mdx b/docs/src/pages/guides/gatsby.mdx index e604390be6c..c9a01a0365b 100644 --- a/docs/src/pages/guides/gatsby.mdx +++ b/docs/src/pages/guides/gatsby.mdx @@ -94,6 +94,7 @@ Create `gatsby-browser.tsx` with the following content: // Import styles of packages that you've installed. // All packages except `@mantine/hooks` require styles imports import '@mantine/core/styles.css'; + import React from 'react'; import { MantineProvider } from '@mantine/core'; import { theme } from './src/theme'; diff --git a/docs/src/pages/guides/icons.mdx b/docs/src/pages/guides/icons.mdx index 8c2f8de9097..5d066bb5b15 100644 --- a/docs/src/pages/guides/icons.mdx +++ b/docs/src/pages/guides/icons.mdx @@ -1,6 +1,6 @@ +import { GuidesDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { GuidesDemos } from '@docs/demos'; export default Layout(MDX_DATA.Icons); diff --git a/docs/src/pages/guides/jest.mdx b/docs/src/pages/guides/jest.mdx index 19082c57fcb..b99e319c359 100644 --- a/docs/src/pages/guides/jest.mdx +++ b/docs/src/pages/guides/jest.mdx @@ -19,7 +19,6 @@ function: // ./test-utils/render.tsx import { render as testingLibraryRender } from '@testing-library/react'; import { MantineProvider } from '@mantine/core'; - // Import your theme object import { theme } from '../src/theme'; diff --git a/docs/src/pages/guides/next.mdx b/docs/src/pages/guides/next.mdx index 547914027f6..b31678716df 100644 --- a/docs/src/pages/guides/next.mdx +++ b/docs/src/pages/guides/next.mdx @@ -59,7 +59,7 @@ Add styles imports and [MantineProvider](/theming/mantine-provider) to the `page import '@mantine/core/styles.css'; import type { AppProps } from 'next/app'; -import { MantineProvider, createTheme } from '@mantine/core'; +import { createTheme, MantineProvider } from '@mantine/core'; const theme = createTheme({ /** Put your mantine theme override here */ @@ -78,7 +78,7 @@ Create `pages/_document.tsx` file with [ColorSchemeScript](/theming/color-scheme Note that it is required even if you use only one color scheme in your application. ```tsx -import { Html, Head, Main, NextScript } from 'next/document'; +import { Head, Html, Main, NextScript } from 'next/document'; import { ColorSchemeScript } from '@mantine/core'; export default function Document() { @@ -112,7 +112,7 @@ and styles imports to the `app/layout.tsx` file: // All packages except `@mantine/hooks` require styles imports import '@mantine/core/styles.css'; -import { MantineProvider, ColorSchemeScript } from '@mantine/core'; +import { ColorSchemeScript, MantineProvider } from '@mantine/core'; export const metadata = { title: 'My Mantine app', @@ -217,6 +217,7 @@ Example with `'use client';` directive: ```tsx 'use client'; + import { Popover } from '@mantine/core'; // No error @@ -235,8 +236,8 @@ Example with `ComponentXXX` syntax: ```tsx import { Popover, - PopoverTarget, PopoverDropdown, + PopoverTarget, } from '@mantine/core'; // No error diff --git a/docs/src/pages/guides/polymorphic.mdx b/docs/src/pages/guides/polymorphic.mdx index 83eb5b344ca..376d2c7f487 100644 --- a/docs/src/pages/guides/polymorphic.mdx +++ b/docs/src/pages/guides/polymorphic.mdx @@ -1,6 +1,6 @@ +import { GuidesDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { GuidesDemos } from '@docs/demos'; export default Layout(MDX_DATA.Polymorphic); @@ -125,8 +125,8 @@ incompatible with Mantine `component` prop, but you can use `renderRoot` prop in ```tsx import cx from 'clsx'; -import { Button } from '@mantine/core'; import { NavLink } from 'react-router-dom'; +import { Button } from '@mantine/core'; function Demo() { return ( @@ -203,9 +203,9 @@ as in the previous example: ```tsx import { + createPolymorphicComponent, Group, GroupProps, - createPolymorphicComponent, } from '@mantine/core'; const PolymorphicGroup = createPolymorphicComponent< diff --git a/docs/src/pages/guides/redwood.mdx b/docs/src/pages/guides/redwood.mdx index b6a2f47aca5..967675b4bb1 100644 --- a/docs/src/pages/guides/redwood.mdx +++ b/docs/src/pages/guides/redwood.mdx @@ -88,13 +88,11 @@ to `web/src/App.tsx` file: // All packages except `@mantine/hooks` require styles imports import '@mantine/core/styles.css'; -import { MantineProvider, ColorSchemeScript } from '@mantine/core'; - import { FatalErrorBoundary, RedwoodProvider } from '@redwoodjs/web'; import { RedwoodApolloProvider } from '@redwoodjs/web/apollo'; - import FatalErrorPage from 'src/pages/FatalErrorPage'; import Routes from 'src/Routes'; +import { ColorSchemeScript, MantineProvider } from '@mantine/core'; const App = () => ( diff --git a/docs/src/pages/guides/remix.mdx b/docs/src/pages/guides/remix.mdx index e7f6b1e7456..2a2dfd4051b 100644 --- a/docs/src/pages/guides/remix.mdx +++ b/docs/src/pages/guides/remix.mdx @@ -75,7 +75,7 @@ import { Scripts, ScrollRestoration, } from '@remix-run/react'; -import { MantineProvider, ColorSchemeScript } from '@mantine/core'; +import { ColorSchemeScript, MantineProvider } from '@mantine/core'; export const links: LinksFunction = () => [ ...(cssBundleHref diff --git a/docs/src/pages/guides/storybook.mdx b/docs/src/pages/guides/storybook.mdx index e852377adf0..91741bca6da 100644 --- a/docs/src/pages/guides/storybook.mdx +++ b/docs/src/pages/guides/storybook.mdx @@ -96,7 +96,6 @@ import { MantineProvider, useMantineColorScheme, } from '@mantine/core'; - // theme.ts file from previous step import { theme } from '../src/theme'; diff --git a/docs/src/pages/guides/typescript.mdx b/docs/src/pages/guides/typescript.mdx index 099d6f78b69..413885ce563 100644 --- a/docs/src/pages/guides/typescript.mdx +++ b/docs/src/pages/guides/typescript.mdx @@ -28,7 +28,7 @@ type, for example `'div'`. Example of extending regular component props: ```tsx -import { GroupProps, Group } from '@mantine/core'; +import { Group, GroupProps } from '@mantine/core'; // Interface includes `React.ComponentPropsWithoutRef<'div'>` interface MyGroupProps extends GroupProps { @@ -46,7 +46,7 @@ because their root element depends on the `component` prop value. Example of extending [polymorphic components](/guides/polymorphic) props: ```tsx -import { ButtonProps, Button, ElementProps } from '@mantine/core'; +import { Button, ButtonProps, ElementProps } from '@mantine/core'; interface MyButtonProps extends ButtonProps, @@ -66,7 +66,7 @@ features. It replaces native elements `style` prop with Mantine [style prop](/st allows omitting properties that are passed as a second type. ```tsx -import { ElementProps, ButtonProps } from '@mantine/core'; +import { ButtonProps, ElementProps } from '@mantine/core'; // Equivalent of `React.ComponentPropsWithoutRef<'button'>` type ButtonElementProps = ElementProps<'button'>; @@ -105,8 +105,8 @@ that accept theme override as an argument: ```tsx import { - MantineThemeOverride, createTheme, + MantineThemeOverride, mergeThemeOverrides, } from '@mantine/core'; @@ -191,8 +191,8 @@ To override `theme.colors`: ```tsx import { - MantineColorsTuple, DefaultMantineColor, + MantineColorsTuple, } from '@mantine/core'; type ExtendedCustomColors = diff --git a/docs/src/pages/hooks/use-click-outside.mdx b/docs/src/pages/hooks/use-click-outside.mdx index 962eae4d69d..7b67c5371f1 100644 --- a/docs/src/pages/hooks/use-click-outside.mdx +++ b/docs/src/pages/hooks/use-click-outside.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useClickOutside); @@ -42,8 +42,8 @@ you can change these events by passing an array of events as second argument: ```tsx // Will work only with useState, not useRef import { useState } from 'react'; -import { useClickOutside } from '@mantine/hooks'; import { Portal } from '@mantine/core'; +import { useClickOutside } from '@mantine/hooks'; function Demo() { const [dropdown, setDropdown] = useState( diff --git a/docs/src/pages/hooks/use-clipboard.mdx b/docs/src/pages/hooks/use-clipboard.mdx index 1e2924d0fa1..2e230d05052 100644 --- a/docs/src/pages/hooks/use-clipboard.mdx +++ b/docs/src/pages/hooks/use-clipboard.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useClipboard); diff --git a/docs/src/pages/hooks/use-color-scheme.mdx b/docs/src/pages/hooks/use-color-scheme.mdx index 89f70e035bd..44e208f2b64 100644 --- a/docs/src/pages/hooks/use-color-scheme.mdx +++ b/docs/src/pages/hooks/use-color-scheme.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useColorScheme); diff --git a/docs/src/pages/hooks/use-counter.mdx b/docs/src/pages/hooks/use-counter.mdx index 63ffe0d0fb4..04a248f6343 100644 --- a/docs/src/pages/hooks/use-counter.mdx +++ b/docs/src/pages/hooks/use-counter.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useCounter); diff --git a/docs/src/pages/hooks/use-debounced-state.mdx b/docs/src/pages/hooks/use-debounced-state.mdx index b3c44010f95..8471c299316 100644 --- a/docs/src/pages/hooks/use-debounced-state.mdx +++ b/docs/src/pages/hooks/use-debounced-state.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useDebouncedState); diff --git a/docs/src/pages/hooks/use-debounced-value.mdx b/docs/src/pages/hooks/use-debounced-value.mdx index 9ed0f79c1cf..a20282b41a9 100644 --- a/docs/src/pages/hooks/use-debounced-value.mdx +++ b/docs/src/pages/hooks/use-debounced-value.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useDebouncedValue); diff --git a/docs/src/pages/hooks/use-did-update.mdx b/docs/src/pages/hooks/use-did-update.mdx index 813835e5081..7e32b004aa9 100644 --- a/docs/src/pages/hooks/use-did-update.mdx +++ b/docs/src/pages/hooks/use-did-update.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useDidUpdate); diff --git a/docs/src/pages/hooks/use-disclosure.mdx b/docs/src/pages/hooks/use-disclosure.mdx index 3d3978849d1..52e1384254e 100644 --- a/docs/src/pages/hooks/use-disclosure.mdx +++ b/docs/src/pages/hooks/use-disclosure.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useDisclosure); diff --git a/docs/src/pages/hooks/use-document-title.mdx b/docs/src/pages/hooks/use-document-title.mdx index 89f866aec92..7870e3759cb 100644 --- a/docs/src/pages/hooks/use-document-title.mdx +++ b/docs/src/pages/hooks/use-document-title.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useDocumentTitle); diff --git a/docs/src/pages/hooks/use-document-visibility.mdx b/docs/src/pages/hooks/use-document-visibility.mdx index cc8b9f157ff..a3e867bb770 100644 --- a/docs/src/pages/hooks/use-document-visibility.mdx +++ b/docs/src/pages/hooks/use-document-visibility.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useDocumentVisibility); diff --git a/docs/src/pages/hooks/use-element-size.mdx b/docs/src/pages/hooks/use-element-size.mdx index 2fa74dbbb71..0ed94abf232 100644 --- a/docs/src/pages/hooks/use-element-size.mdx +++ b/docs/src/pages/hooks/use-element-size.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useElementSize); diff --git a/docs/src/pages/hooks/use-event-listener.mdx b/docs/src/pages/hooks/use-event-listener.mdx index ab5838f0b96..32ae914d64b 100644 --- a/docs/src/pages/hooks/use-event-listener.mdx +++ b/docs/src/pages/hooks/use-event-listener.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useEventListener); diff --git a/docs/src/pages/hooks/use-eye-dropper.mdx b/docs/src/pages/hooks/use-eye-dropper.mdx index b81d0cdc287..25dfd307f01 100644 --- a/docs/src/pages/hooks/use-eye-dropper.mdx +++ b/docs/src/pages/hooks/use-eye-dropper.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useEyeDropper); diff --git a/docs/src/pages/hooks/use-favicon.mdx b/docs/src/pages/hooks/use-favicon.mdx index 2f9d1a5e6f6..625d52facdc 100644 --- a/docs/src/pages/hooks/use-favicon.mdx +++ b/docs/src/pages/hooks/use-favicon.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useFavicon); diff --git a/docs/src/pages/hooks/use-focus-return.mdx b/docs/src/pages/hooks/use-focus-return.mdx index 2e4d87c74c0..e4b7fef242e 100644 --- a/docs/src/pages/hooks/use-focus-return.mdx +++ b/docs/src/pages/hooks/use-focus-return.mdx @@ -1,6 +1,6 @@ +import { ModalDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ModalDemos } from '@docs/demos'; export default Layout(MDX_DATA.useFocusReturn); diff --git a/docs/src/pages/hooks/use-focus-within.mdx b/docs/src/pages/hooks/use-focus-within.mdx index d9e3cc0d1d9..4bc923a5607 100644 --- a/docs/src/pages/hooks/use-focus-within.mdx +++ b/docs/src/pages/hooks/use-focus-within.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useFocusWithin); diff --git a/docs/src/pages/hooks/use-force-update.mdx b/docs/src/pages/hooks/use-force-update.mdx index f7325e81dc6..093c024bac6 100644 --- a/docs/src/pages/hooks/use-force-update.mdx +++ b/docs/src/pages/hooks/use-force-update.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useForceUpdate); diff --git a/docs/src/pages/hooks/use-fullscreen.mdx b/docs/src/pages/hooks/use-fullscreen.mdx index 7ec05ecef29..b093fc2d5d0 100644 --- a/docs/src/pages/hooks/use-fullscreen.mdx +++ b/docs/src/pages/hooks/use-fullscreen.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useFullscreen); diff --git a/docs/src/pages/hooks/use-hash.mdx b/docs/src/pages/hooks/use-hash.mdx index 53bb09bd1a0..1146a57f3ab 100644 --- a/docs/src/pages/hooks/use-hash.mdx +++ b/docs/src/pages/hooks/use-hash.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useHash); diff --git a/docs/src/pages/hooks/use-headroom.mdx b/docs/src/pages/hooks/use-headroom.mdx index a11c647f015..409952b7d96 100644 --- a/docs/src/pages/hooks/use-headroom.mdx +++ b/docs/src/pages/hooks/use-headroom.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useHeadroom); diff --git a/docs/src/pages/hooks/use-hotkeys.mdx b/docs/src/pages/hooks/use-hotkeys.mdx index f659dc03ed2..52ceee86162 100644 --- a/docs/src/pages/hooks/use-hotkeys.mdx +++ b/docs/src/pages/hooks/use-hotkeys.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useHotkeys); diff --git a/docs/src/pages/hooks/use-hover.mdx b/docs/src/pages/hooks/use-hover.mdx index 0362d133a13..2e65934f614 100644 --- a/docs/src/pages/hooks/use-hover.mdx +++ b/docs/src/pages/hooks/use-hover.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useHover); diff --git a/docs/src/pages/hooks/use-id.mdx b/docs/src/pages/hooks/use-id.mdx index 05109384ed5..64bf75efc53 100644 --- a/docs/src/pages/hooks/use-id.mdx +++ b/docs/src/pages/hooks/use-id.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useId); diff --git a/docs/src/pages/hooks/use-idle.mdx b/docs/src/pages/hooks/use-idle.mdx index 24182ec35c4..e0604795416 100644 --- a/docs/src/pages/hooks/use-idle.mdx +++ b/docs/src/pages/hooks/use-idle.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useIdle); diff --git a/docs/src/pages/hooks/use-input-state.mdx b/docs/src/pages/hooks/use-input-state.mdx index 19390c6f899..c4a216cea67 100644 --- a/docs/src/pages/hooks/use-input-state.mdx +++ b/docs/src/pages/hooks/use-input-state.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useInputState); @@ -11,8 +11,8 @@ Hook works with all Mantine and native inputs: ```tsx import { useState } from 'react'; +import { NumberInput, TextInput } from '@mantine/core'; import { useInputState } from '@mantine/hooks'; -import { TextInput, NumberInput } from '@mantine/core'; function WithUseInputState() { const [stringValue, setStringValue] = useInputState(''); diff --git a/docs/src/pages/hooks/use-intersection.mdx b/docs/src/pages/hooks/use-intersection.mdx index e94e54476e2..11064f2c0c1 100644 --- a/docs/src/pages/hooks/use-intersection.mdx +++ b/docs/src/pages/hooks/use-intersection.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useIntersection); diff --git a/docs/src/pages/hooks/use-interval.mdx b/docs/src/pages/hooks/use-interval.mdx index 1582355d669..4f4cd392819 100644 --- a/docs/src/pages/hooks/use-interval.mdx +++ b/docs/src/pages/hooks/use-interval.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useInterval); diff --git a/docs/src/pages/hooks/use-isomorphic-effect.mdx b/docs/src/pages/hooks/use-isomorphic-effect.mdx index f46c8b38330..f522fbc1b35 100644 --- a/docs/src/pages/hooks/use-isomorphic-effect.mdx +++ b/docs/src/pages/hooks/use-isomorphic-effect.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useIsomorphicEffect); diff --git a/docs/src/pages/hooks/use-list-state.mdx b/docs/src/pages/hooks/use-list-state.mdx index 6e237eff59f..7e7540c4d70 100644 --- a/docs/src/pages/hooks/use-list-state.mdx +++ b/docs/src/pages/hooks/use-list-state.mdx @@ -1,6 +1,6 @@ +import { CheckboxDemos, HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos, CheckboxDemos } from '@docs/demos'; export default Layout(MDX_DATA.useListState); diff --git a/docs/src/pages/hooks/use-local-storage.mdx b/docs/src/pages/hooks/use-local-storage.mdx index 9f34135e219..92dac99f352 100644 --- a/docs/src/pages/hooks/use-local-storage.mdx +++ b/docs/src/pages/hooks/use-local-storage.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useLocalStorage); @@ -33,9 +33,9 @@ Example of a color scheme toggle button that uses `use-local-storage` hook to store current color scheme in the `localStorage`: ```tsx -import { useLocalStorage } from '@mantine/hooks'; +import { IconMoonStars, IconSun } from '@tabler/icons-react'; import { ActionIcon, ColorScheme } from '@mantine/core'; -import { IconSun, IconMoonStars } from '@tabler/icons-react'; +import { useLocalStorage } from '@mantine/hooks'; function ColorSchemeToggle() { const [colorScheme, setColorScheme] = useLocalStorage({ diff --git a/docs/src/pages/hooks/use-logger.mdx b/docs/src/pages/hooks/use-logger.mdx index 81b31921554..9ba50b3e35a 100644 --- a/docs/src/pages/hooks/use-logger.mdx +++ b/docs/src/pages/hooks/use-logger.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useLogger); diff --git a/docs/src/pages/hooks/use-media-query.mdx b/docs/src/pages/hooks/use-media-query.mdx index b50ee1015a2..66cc516fff2 100644 --- a/docs/src/pages/hooks/use-media-query.mdx +++ b/docs/src/pages/hooks/use-media-query.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useMediaQuery); diff --git a/docs/src/pages/hooks/use-merged-ref.mdx b/docs/src/pages/hooks/use-merged-ref.mdx index 7d55ca90949..5af56a6da2f 100644 --- a/docs/src/pages/hooks/use-merged-ref.mdx +++ b/docs/src/pages/hooks/use-merged-ref.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useMergedRef); @@ -41,7 +41,7 @@ across two renders. To fix that issue, use `mergeRefs` function instead: ```tsx import { useRef } from 'react'; -import { useClickOutside, mergeRefs } from '@mantine/hooks'; +import { mergeRefs, useClickOutside } from '@mantine/hooks'; function Demo() { const myRef = useRef(); diff --git a/docs/src/pages/hooks/use-mouse.mdx b/docs/src/pages/hooks/use-mouse.mdx index 8d2ecde5c4d..678efb650c9 100644 --- a/docs/src/pages/hooks/use-mouse.mdx +++ b/docs/src/pages/hooks/use-mouse.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useMouse); diff --git a/docs/src/pages/hooks/use-move.mdx b/docs/src/pages/hooks/use-move.mdx index ae72167ec9d..c5324688275 100644 --- a/docs/src/pages/hooks/use-move.mdx +++ b/docs/src/pages/hooks/use-move.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useMove); diff --git a/docs/src/pages/hooks/use-network.mdx b/docs/src/pages/hooks/use-network.mdx index 56f0cd081be..be221601c13 100644 --- a/docs/src/pages/hooks/use-network.mdx +++ b/docs/src/pages/hooks/use-network.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useNetwork); diff --git a/docs/src/pages/hooks/use-os.mdx b/docs/src/pages/hooks/use-os.mdx index bcbb19102e4..bf6aeab34df 100644 --- a/docs/src/pages/hooks/use-os.mdx +++ b/docs/src/pages/hooks/use-os.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useOs); @@ -17,6 +17,7 @@ You can import `OS` union type from `@mantine/hooks`: ```tsx import type { OS } from '@mantine/hooks'; + // OS type is 'undetermined' | 'macos' | 'ios' | 'windows' | 'android' | 'linux' ``` diff --git a/docs/src/pages/hooks/use-page-leave.mdx b/docs/src/pages/hooks/use-page-leave.mdx index e74c1914b62..6743b0ab968 100644 --- a/docs/src/pages/hooks/use-page-leave.mdx +++ b/docs/src/pages/hooks/use-page-leave.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.usePageLeave); diff --git a/docs/src/pages/hooks/use-pagination.mdx b/docs/src/pages/hooks/use-pagination.mdx index 2ec7f3d002f..b97996ea1ed 100644 --- a/docs/src/pages/hooks/use-pagination.mdx +++ b/docs/src/pages/hooks/use-pagination.mdx @@ -1,6 +1,6 @@ +import { PaginationDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { PaginationDemos } from '@docs/demos'; export default Layout(MDX_DATA.usePagination); diff --git a/docs/src/pages/hooks/use-previous.mdx b/docs/src/pages/hooks/use-previous.mdx index 5c674e7f9c8..8127491002b 100644 --- a/docs/src/pages/hooks/use-previous.mdx +++ b/docs/src/pages/hooks/use-previous.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.usePrevious); diff --git a/docs/src/pages/hooks/use-queue.mdx b/docs/src/pages/hooks/use-queue.mdx index d32578babd5..2ad517fc8d7 100644 --- a/docs/src/pages/hooks/use-queue.mdx +++ b/docs/src/pages/hooks/use-queue.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useQueue); diff --git a/docs/src/pages/hooks/use-reduced-motion.mdx b/docs/src/pages/hooks/use-reduced-motion.mdx index c864e17266b..95fa138772e 100644 --- a/docs/src/pages/hooks/use-reduced-motion.mdx +++ b/docs/src/pages/hooks/use-reduced-motion.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useReducedMotion); diff --git a/docs/src/pages/hooks/use-resize-observer.mdx b/docs/src/pages/hooks/use-resize-observer.mdx index 92e566089be..924f7f895e5 100644 --- a/docs/src/pages/hooks/use-resize-observer.mdx +++ b/docs/src/pages/hooks/use-resize-observer.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useResizeObserver); diff --git a/docs/src/pages/hooks/use-scroll-into-view.mdx b/docs/src/pages/hooks/use-scroll-into-view.mdx index 10e5ec825e2..f2f38f0163c 100644 --- a/docs/src/pages/hooks/use-scroll-into-view.mdx +++ b/docs/src/pages/hooks/use-scroll-into-view.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useScrollIntoView); diff --git a/docs/src/pages/hooks/use-set-state.mdx b/docs/src/pages/hooks/use-set-state.mdx index f8aa54eff3b..e5b9fb5eb1d 100644 --- a/docs/src/pages/hooks/use-set-state.mdx +++ b/docs/src/pages/hooks/use-set-state.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useSetState); diff --git a/docs/src/pages/hooks/use-shallow-effect.mdx b/docs/src/pages/hooks/use-shallow-effect.mdx index cce7dbb2056..93282c37a6a 100644 --- a/docs/src/pages/hooks/use-shallow-effect.mdx +++ b/docs/src/pages/hooks/use-shallow-effect.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useShallowEffect); diff --git a/docs/src/pages/hooks/use-text-selection.mdx b/docs/src/pages/hooks/use-text-selection.mdx index 3bb60caf2d6..1fbd56af6ca 100644 --- a/docs/src/pages/hooks/use-text-selection.mdx +++ b/docs/src/pages/hooks/use-text-selection.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useTextSelection); diff --git a/docs/src/pages/hooks/use-timeout.mdx b/docs/src/pages/hooks/use-timeout.mdx index 80b5b5809c2..7460d4382ef 100644 --- a/docs/src/pages/hooks/use-timeout.mdx +++ b/docs/src/pages/hooks/use-timeout.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useTimeout); diff --git a/docs/src/pages/hooks/use-toggle.mdx b/docs/src/pages/hooks/use-toggle.mdx index 1e763ede871..0b93689ae61 100644 --- a/docs/src/pages/hooks/use-toggle.mdx +++ b/docs/src/pages/hooks/use-toggle.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useToggle); diff --git a/docs/src/pages/hooks/use-uncontrolled.mdx b/docs/src/pages/hooks/use-uncontrolled.mdx index 1e271c7a44c..60fa1743ad8 100644 --- a/docs/src/pages/hooks/use-uncontrolled.mdx +++ b/docs/src/pages/hooks/use-uncontrolled.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useUncontrolled); diff --git a/docs/src/pages/hooks/use-validated-state.mdx b/docs/src/pages/hooks/use-validated-state.mdx index a9634644b00..8b01a2280fe 100644 --- a/docs/src/pages/hooks/use-validated-state.mdx +++ b/docs/src/pages/hooks/use-validated-state.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useValidatedState); diff --git a/docs/src/pages/hooks/use-viewport-size.mdx b/docs/src/pages/hooks/use-viewport-size.mdx index cb30160fffb..5f61f17140c 100644 --- a/docs/src/pages/hooks/use-viewport-size.mdx +++ b/docs/src/pages/hooks/use-viewport-size.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useViewportSize); diff --git a/docs/src/pages/hooks/use-window-event.mdx b/docs/src/pages/hooks/use-window-event.mdx index 95fc2fec47c..a50893e2535 100644 --- a/docs/src/pages/hooks/use-window-event.mdx +++ b/docs/src/pages/hooks/use-window-event.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useWindowEvent); diff --git a/docs/src/pages/hooks/use-window-scroll.mdx b/docs/src/pages/hooks/use-window-scroll.mdx index 727b6d8293b..4bf4cbd65ed 100644 --- a/docs/src/pages/hooks/use-window-scroll.mdx +++ b/docs/src/pages/hooks/use-window-scroll.mdx @@ -1,6 +1,6 @@ +import { HooksDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { HooksDemos } from '@docs/demos'; export default Layout(MDX_DATA.useWindowScroll); diff --git a/docs/src/pages/others/carousel.mdx b/docs/src/pages/others/carousel.mdx index 7e086fba076..07a17885502 100644 --- a/docs/src/pages/others/carousel.mdx +++ b/docs/src/pages/others/carousel.mdx @@ -1,6 +1,6 @@ +import { CarouselDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { CarouselDemos } from '@docs/demos'; export default Layout(MDX_DATA.Carousel); diff --git a/docs/src/pages/others/code-highlight.mdx b/docs/src/pages/others/code-highlight.mdx index 143121f3e4f..2722ca5e64d 100644 --- a/docs/src/pages/others/code-highlight.mdx +++ b/docs/src/pages/others/code-highlight.mdx @@ -1,6 +1,6 @@ +import { CodeHighlightDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { CodeHighlightDemos } from '@docs/demos'; export default Layout(MDX_DATA.CodeHighlight); diff --git a/docs/src/pages/others/dropzone.mdx b/docs/src/pages/others/dropzone.mdx index d0390274562..1fa8b0f8d17 100644 --- a/docs/src/pages/others/dropzone.mdx +++ b/docs/src/pages/others/dropzone.mdx @@ -1,14 +1,14 @@ -import { Layout } from '@/layout'; -import { MDX_DATA } from '@/mdx'; -import { DropzoneDemos } from '@docs/demos'; import { - MIME_TYPES, IMAGE_MIME_TYPE, - PDF_MIME_TYPE, - MS_WORD_MIME_TYPE, + MIME_TYPES, MS_EXCEL_MIME_TYPE, MS_POWERPOINT_MIME_TYPE, + MS_WORD_MIME_TYPE, + PDF_MIME_TYPE, } from '@mantine/dropzone'; +import { DropzoneDemos } from '@docs/demos'; +import { Layout } from '@/layout'; +import { MDX_DATA } from '@/mdx'; export default Layout(MDX_DATA.Dropzone); @@ -156,7 +156,7 @@ Additionally you can use grouped mime types: /> ```tsx -import { IMAGE_MIME_TYPE, Dropzone } from '@mantine/dropzone'; +import { Dropzone, IMAGE_MIME_TYPE } from '@mantine/dropzone'; function Demo() { return ( @@ -183,7 +183,7 @@ function Demo() { ## Get ref ```tsx -import { useRef, useEffect } from 'react'; +import { useEffect, useRef } from 'react'; import { Dropzone } from '@mantine/dropzone'; function Demo() { diff --git a/docs/src/pages/others/modals.mdx b/docs/src/pages/others/modals.mdx index e76688477c9..5e86d175e94 100644 --- a/docs/src/pages/others/modals.mdx +++ b/docs/src/pages/others/modals.mdx @@ -1,6 +1,6 @@ +import { ModalsDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ModalsDemos } from '@docs/demos'; export default Layout(MDX_DATA.Modals); @@ -71,8 +71,8 @@ function Demo() { You can define any amount of modals in ModalsProvider context: ```tsx +import { Button, Text } from '@mantine/core'; import { ContextModalProps, ModalsProvider } from '@mantine/modals'; -import { Text, Button } from '@mantine/core'; const TestModal = ({ context, @@ -141,7 +141,8 @@ function Demo() { Typesafe context modals will force you to use the correct types for `openContextModal`: ```tsx -import { openContextModal, closeModal } from '@mantine/modals'; +import { closeModal, openContextModal } from '@mantine/modals'; + openContextModal({ modal: 'demonstration', title: 'Test modal from context', diff --git a/docs/src/pages/others/notifications.mdx b/docs/src/pages/others/notifications.mdx index 0ef08452291..8011f3c56a6 100644 --- a/docs/src/pages/others/notifications.mdx +++ b/docs/src/pages/others/notifications.mdx @@ -1,6 +1,6 @@ +import { NotificationDemos, NotificationsDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { NotificationsDemos, NotificationDemos } from '@docs/demos'; export default Layout(MDX_DATA.Notifications); @@ -60,12 +60,12 @@ You can also import these functions separately: ```tsx // alias functions import { - showNotification, // notifications.show + cleanNotifications, // notifications.clean + cleanNotificationsQueue, // notifications.cleanQueue hideNotification, // notifications.hide + showNotification, // notifications.show updateNotification, // notifications.update updateNotificationsState, // notifications.updateState - cleanNotifications, // notifications.clean - cleanNotificationsQueue, // notifications.cleanQueue } from '@mantine/notifications'; ``` diff --git a/docs/src/pages/others/nprogress.mdx b/docs/src/pages/others/nprogress.mdx index cceae0ff68d..a735a7fdc06 100644 --- a/docs/src/pages/others/nprogress.mdx +++ b/docs/src/pages/others/nprogress.mdx @@ -1,6 +1,6 @@ +import { NprogressDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { NprogressDemos } from '@docs/demos'; export default Layout(MDX_DATA.Nprogress); diff --git a/docs/src/pages/others/spotlight.mdx b/docs/src/pages/others/spotlight.mdx index b152a924fe4..bda4fe26ef6 100644 --- a/docs/src/pages/others/spotlight.mdx +++ b/docs/src/pages/others/spotlight.mdx @@ -1,6 +1,6 @@ +import { SpotlightDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { SpotlightDemos } from '@docs/demos'; export default Layout(MDX_DATA.Spotlight); @@ -38,8 +38,8 @@ These actions can be passed to event listeners or used anywhere in your applicat (not limited to React components): ```tsx -import { spotlight } from '@mantine/spotlight'; import { Button } from '@mantine/core'; +import { spotlight } from '@mantine/spotlight'; function Demo() { return ; @@ -50,8 +50,8 @@ You can also import actions directly from the `@mantine/spotlight` package, if y ```tsx import { - openSpotlight, closeSpotlight, + openSpotlight, toggleSpotlight, } from '@mantine/spotlight'; diff --git a/docs/src/pages/others/tiptap.mdx b/docs/src/pages/others/tiptap.mdx index 6fa8ea6aacf..9fb4b2fb2a4 100644 --- a/docs/src/pages/others/tiptap.mdx +++ b/docs/src/pages/others/tiptap.mdx @@ -1,6 +1,6 @@ +import { TipTapDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { TipTapDemos } from '@docs/demos'; export default Layout(MDX_DATA.TipTap); @@ -98,8 +98,8 @@ To use placeholder you will need to install [@tiptap/extension-placeholder](http ```tsx // Use Link extension exported from the @mantine/tiptap package -import { RichTextEditor, Link } from '@mantine/tiptap'; import { useEditor } from '@tiptap/react'; +import { Link, RichTextEditor } from '@mantine/tiptap'; function Demo() { const editor = useEditor({ @@ -143,8 +143,8 @@ By default, `RichTextEditor` renders content with [TypographyStylesProvider](/co You can disable these styles by setting `withTypographyStyles={false}`: ```tsx -import { RichTextEditor } from '@mantine/tiptap'; import { useEditor } from '@tiptap/react'; +import { RichTextEditor } from '@mantine/tiptap'; function Demo() { const editor = useEditor({ @@ -211,8 +211,8 @@ the context. This hook can be used to create custom control or run any operation by the Tiptap [editor API](https://tiptap.dev/api/editor). ```tsx -import { useRichTextEditorContext } from '@mantine/tiptap'; import { Button } from '@mantine/core'; +import { useRichTextEditorContext } from '@mantine/tiptap'; function Demo() { const { editor } = useRichTextEditorContext(); @@ -246,8 +246,8 @@ that must handle `size` prop: `RichTextEditor` supports changing labels for all controls with `labels` prop: ```tsx -import { RichTextEditor } from '@mantine/tiptap'; import { useEditor } from '@tiptap/react'; +import { RichTextEditor } from '@mantine/tiptap'; function Demo() { const editor = useEditor({ diff --git a/docs/src/pages/overview.mdx b/docs/src/pages/overview.mdx index dcbf2720d90..2fe0b802512 100644 --- a/docs/src/pages/overview.mdx +++ b/docs/src/pages/overview.mdx @@ -1,5 +1,3 @@ -import { Layout } from '@/layout'; -import { MDX_DATA } from '@/mdx'; import { StylesDemos, ThemingDemos } from '@docs/demos'; import { TextInputStylesApi } from '@docs/styles-api'; import { @@ -7,6 +5,8 @@ import { VariablesTable, } from '@/components/StylesApiTable'; import { ColorsGroup } from '@/components/ThemeColors'; +import { Layout } from '@/layout'; +import { MDX_DATA } from '@/mdx'; export default Layout(MDX_DATA.Overview); @@ -44,7 +44,7 @@ and other data that can be accessed by any Mantine component. Most of the `theme [CSS variables](/styles/css-variables) and can be accessed both in JavaScript and CSS. ```tsx -import { MantineProvider, createTheme } from '@mantine/core'; +import { createTheme, MantineProvider } from '@mantine/core'; // Your theme configuration is merged with default theme const theme = createTheme({ @@ -75,7 +75,7 @@ Access theme values in styles: Access theme values in JavaScript: ```tsx -import { useMantineTheme, lighten } from '@mantine/core'; +import { lighten, useMantineTheme } from '@mantine/core'; function Demo() { const theme = useMantineTheme(); diff --git a/docs/src/pages/styles/color-functions.mdx b/docs/src/pages/styles/color-functions.mdx index e890c0da974..d355dcc7f9a 100644 --- a/docs/src/pages/styles/color-functions.mdx +++ b/docs/src/pages/styles/color-functions.mdx @@ -86,9 +86,9 @@ or component body: ```tsx import { + MantineColor, parseThemeColor, useMantineTheme, - MantineColor, } from '@mantine/core'; interface DemoProps { @@ -149,7 +149,7 @@ function Demo() { `isLightColor` function can be used to achieve better contrast between text and background: ```tsx -import { isLightColor, Box } from '@mantine/core'; +import { Box, isLightColor } from '@mantine/core'; interface DemoProps { color: string; diff --git a/docs/src/pages/styles/css-files-list.mdx b/docs/src/pages/styles/css-files-list.mdx index f136a19e404..8900275ce34 100644 --- a/docs/src/pages/styles/css-files-list.mdx +++ b/docs/src/pages/styles/css-files-list.mdx @@ -1,6 +1,6 @@ +import { CssFilesList } from '@/components/CssFilesList'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { CssFilesList } from '@/components/CssFilesList'; export default Layout(MDX_DATA.CSSFilesList); diff --git a/docs/src/pages/styles/css-modules.mdx b/docs/src/pages/styles/css-modules.mdx index a0af567bcea..037e0ef9330 100644 --- a/docs/src/pages/styles/css-modules.mdx +++ b/docs/src/pages/styles/css-modules.mdx @@ -1,6 +1,6 @@ +import { StylesDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { StylesDemos } from '@docs/demos'; export default Layout(MDX_DATA.CSSModules); @@ -145,8 +145,8 @@ You can combine both approaches to achieve desired results, for example, a given component, and you can use static selectors to style inner elements: ```tsx -import { Slider } from '@mantine/core'; import styled from '@emotion/styled'; +import { Slider } from '@mantine/core'; const StyledSlider = styled(Slider)` & .mantine-Slider-bar { diff --git a/docs/src/pages/styles/css-variables-list.mdx b/docs/src/pages/styles/css-variables-list.mdx index 2e2e9e1d5d4..45f44921185 100644 --- a/docs/src/pages/styles/css-variables-list.mdx +++ b/docs/src/pages/styles/css-variables-list.mdx @@ -1,6 +1,6 @@ +import { CssVariablesList } from '@/components/CssVariablesList'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { CssVariablesList } from '@/components/CssVariablesList'; export default Layout(MDX_DATA.CSSVariablesList); diff --git a/docs/src/pages/styles/css-variables.mdx b/docs/src/pages/styles/css-variables.mdx index 823297b0b58..e09d6c63c52 100644 --- a/docs/src/pages/styles/css-variables.mdx +++ b/docs/src/pages/styles/css-variables.mdx @@ -1,6 +1,6 @@ +import { CssVariablesTable } from '@/components/CssVariablesTable'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { CssVariablesTable } from '@/components/CssVariablesTable'; export default Layout(MDX_DATA.CssVariables); @@ -224,9 +224,9 @@ Example of adding new CSS variables based on `theme.other`: ```tsx import { - MantineProvider, - CSSVariablesResolver, createTheme, + CSSVariablesResolver, + MantineProvider, rem, } from '@mantine/core'; diff --git a/docs/src/pages/styles/data-attributes.mdx b/docs/src/pages/styles/data-attributes.mdx index 0aa23d99e21..69528353f87 100644 --- a/docs/src/pages/styles/data-attributes.mdx +++ b/docs/src/pages/styles/data-attributes.mdx @@ -1,8 +1,8 @@ -import { Layout } from '@/layout'; -import { MDX_DATA } from '@/mdx'; import { StylesDemos } from '@docs/demos'; import { ButtonStylesApi } from '@docs/styles-api'; import { ModifiersTable } from '@/components/StylesApiTable'; +import { Layout } from '@/layout'; +import { MDX_DATA } from '@/mdx'; export default Layout(MDX_DATA.DataAttributes); diff --git a/docs/src/pages/styles/global-styles.mdx b/docs/src/pages/styles/global-styles.mdx index f8cefe3ae77..5d217a15f31 100644 --- a/docs/src/pages/styles/global-styles.mdx +++ b/docs/src/pages/styles/global-styles.mdx @@ -1,6 +1,6 @@ +import { StylesDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { StylesDemos } from '@docs/demos'; export default Layout(MDX_DATA.GlobalStyles); diff --git a/docs/src/pages/styles/mantine-styles.mdx b/docs/src/pages/styles/mantine-styles.mdx index 8b3300c772f..e64ffc18934 100644 --- a/docs/src/pages/styles/mantine-styles.mdx +++ b/docs/src/pages/styles/mantine-styles.mdx @@ -45,7 +45,6 @@ styles must always be imported before any other Mantine package styles: // ✅ Correct order import '@mantine/core/styles.css'; import '@mantine/dates/styles.css'; - // ❌ Incorrect order import '@mantine/dates/styles.css'; import '@mantine/core/styles.css'; @@ -78,6 +77,7 @@ All `@mantine/*` packages that export styles have an additional file in which al ```tsx import '@mantine/core/styles.layer.css'; import '@mantine/dates/styles.layer.css'; + // ... other styles ``` @@ -95,6 +95,7 @@ Similar to package styles, you can import individual component styles with `@lay ```tsx import '@mantine/core/styles/UnstyledButton.layer.css'; import '@mantine/core/styles/Button.layer.css'; + // ... other styles ``` @@ -108,6 +109,7 @@ regular styles. // ✅ If your styles are not wrapped in @layer directive, // they will be applied after Mantine styles import classes from './Demo.module.css'; + import '@mantine/core/styles.layer.css'; ``` diff --git a/docs/src/pages/styles/rem.mdx b/docs/src/pages/styles/rem.mdx index c63c414badb..027e1863ef3 100644 --- a/docs/src/pages/styles/rem.mdx +++ b/docs/src/pages/styles/rem.mdx @@ -1,6 +1,6 @@ +import { StylesDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { StylesDemos } from '@docs/demos'; export default Layout(MDX_DATA.Rem); @@ -29,7 +29,7 @@ to set `scale` to `1 / (10 / 16)` (16 – default font-size) = `1 / 0.625` = `1. ``` ```tsx -import { MantineProvider, createTheme } from '@mantine/core'; +import { createTheme, MantineProvider } from '@mantine/core'; const theme = createTheme({ scale: 1.6, @@ -85,7 +85,7 @@ function Demo() { `@mantine/core` package exports `rem` and `em` function that can be used to convert `px` into `rem`/`em`: ```tsx -import { rem, em } from '@mantine/core'; +import { em, rem } from '@mantine/core'; // numbers and values in px are converted to rem rem(32); // -> calc(2rem * var(--mantine-scale)) diff --git a/docs/src/pages/styles/responsive.mdx b/docs/src/pages/styles/responsive.mdx index 1850ce35c7d..680b3c829d4 100644 --- a/docs/src/pages/styles/responsive.mdx +++ b/docs/src/pages/styles/responsive.mdx @@ -1,7 +1,7 @@ -import { Layout } from '@/layout'; -import { MDX_DATA } from '@/mdx'; import { DEFAULT_THEME, px } from '@mantine/core'; import { StylesDemos } from '@docs/demos'; +import { Layout } from '@/layout'; +import { MDX_DATA } from '@/mdx'; export default Layout(MDX_DATA.ResponsiveStyles); @@ -17,7 +17,7 @@ export default Layout(MDX_DATA.ResponsiveStyles); You can configure these values with [MantineProvider](/theming/mantine-provider/): ```tsx -import { MantineProvider, createTheme } from '@mantine/core'; +import { createTheme, MantineProvider } from '@mantine/core'; const theme = createTheme({ breakpoints: { diff --git a/docs/src/pages/styles/rtl.mdx b/docs/src/pages/styles/rtl.mdx index 7b60680d319..d57527ecd30 100644 --- a/docs/src/pages/styles/rtl.mdx +++ b/docs/src/pages/styles/rtl.mdx @@ -1,6 +1,6 @@ +import { StylesDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { StylesDemos } from '@docs/demos'; export default Layout(MDX_DATA.Rtl); diff --git a/docs/src/pages/styles/style-props.mdx b/docs/src/pages/styles/style-props.mdx index d9910f70d0b..a952197d7ce 100644 --- a/docs/src/pages/styles/style-props.mdx +++ b/docs/src/pages/styles/style-props.mdx @@ -1,7 +1,7 @@ -import { Layout } from '@/layout'; -import { MDX_DATA } from '@/mdx'; import { StylesDemos } from '@docs/demos'; import { StylePropsTable } from '@/components/StylePropsTable'; +import { Layout } from '@/layout'; +import { MDX_DATA } from '@/mdx'; export default Layout(MDX_DATA.StyleProps); diff --git a/docs/src/pages/styles/styles-api.mdx b/docs/src/pages/styles/styles-api.mdx index 17b09063505..971d0ff0445 100644 --- a/docs/src/pages/styles/styles-api.mdx +++ b/docs/src/pages/styles/styles-api.mdx @@ -1,5 +1,3 @@ -import { Layout } from '@/layout'; -import { MDX_DATA } from '@/mdx'; import { Button } from '@mantine/core'; import { StylesDemos } from '@docs/demos'; import { ButtonStylesApi } from '@docs/styles-api'; @@ -7,6 +5,8 @@ import { SelectorsTable, VariablesTable, } from '@/components/StylesApiTable'; +import { Layout } from '@/layout'; +import { MDX_DATA } from '@/mdx'; export default Layout(MDX_DATA.StylesApi); @@ -108,9 +108,9 @@ components of a specific type: ```tsx import { useState } from 'react'; import { - TextInput, - MantineProvider, createTheme, + MantineProvider, + TextInput, } from '@mantine/core'; // Styles are the same as in previous example import classes from './Demo.module.css'; diff --git a/docs/src/pages/styles/styles-overview.mdx b/docs/src/pages/styles/styles-overview.mdx index bb55330a06e..543e7fb42ac 100644 --- a/docs/src/pages/styles/styles-overview.mdx +++ b/docs/src/pages/styles/styles-overview.mdx @@ -1,6 +1,6 @@ +import { ButtonDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ButtonDemos } from '@docs/demos'; export default Layout(MDX_DATA.StylesOverview); @@ -89,7 +89,7 @@ CSS properties as well as CSS variables. It is useful in the following cases: - You want to apply a single CSS property to a component: ```tsx -import { Flex, Button } from '@mantine/core'; +import { Button, Flex } from '@mantine/core'; function Demo() { return ( diff --git a/docs/src/pages/styles/styles-performance.mdx b/docs/src/pages/styles/styles-performance.mdx index d9daf52f358..6239aa9b471 100644 --- a/docs/src/pages/styles/styles-performance.mdx +++ b/docs/src/pages/styles/styles-performance.mdx @@ -1,6 +1,6 @@ +import { StylesDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { StylesDemos } from '@docs/demos'; export default Layout(MDX_DATA.StylesPerformance); diff --git a/docs/src/pages/styles/unstyled.mdx b/docs/src/pages/styles/unstyled.mdx index 66f6907bf65..37f264d3ee1 100644 --- a/docs/src/pages/styles/unstyled.mdx +++ b/docs/src/pages/styles/unstyled.mdx @@ -1,6 +1,6 @@ +import { StylesDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { StylesDemos } from '@docs/demos'; export default Layout(MDX_DATA.UnstyledComponents); diff --git a/docs/src/pages/styles/vanilla-extract.mdx b/docs/src/pages/styles/vanilla-extract.mdx index 1ac354b4dfd..aa8dbb37911 100644 --- a/docs/src/pages/styles/vanilla-extract.mdx +++ b/docs/src/pages/styles/vanilla-extract.mdx @@ -77,8 +77,8 @@ Import `vars` object in `*.css.ts` files to access Mantine [CSS variables](/styl ```tsx // Demo.css.ts -import { vars } from './theme'; import { style } from '@vanilla-extract/css'; +import { vars } from './theme'; export const demo = style({ fontSize: vars.fontSizes.xl, @@ -93,8 +93,8 @@ To convert px to [rem or em](/styles/rem) use `rem` and `em` functions from `@ma ```tsx // Demo.css.ts -import { rem } from '@mantine/core'; import { style } from '@vanilla-extract/css'; +import { rem } from '@mantine/core'; export const demo = style({ fontSize: rem(16), @@ -114,8 +114,8 @@ apply styles only in light or dark color scheme: ```tsx // Demo.css.ts -import { vars } from './theme'; import { style } from '@vanilla-extract/css'; +import { vars } from './theme'; export const demo = style({ fontSize: vars.fontSizes.xl, @@ -140,8 +140,8 @@ with `vars.darkSelector` (or vice versa): ```tsx // Demo.css.ts -import { vars } from './theme'; import { style } from '@vanilla-extract/css'; +import { vars } from './theme'; export const demo = style({ fontSize: vars.fontSizes.xl, @@ -164,8 +164,8 @@ export const demo = style({ ```tsx // Demo.css.ts -import { vars } from './theme'; import { style } from '@vanilla-extract/css'; +import { vars } from './theme'; export const demo = style({ fontSize: vars.fontSizes.sm, @@ -197,8 +197,8 @@ Use `vars.rtlSelector` to apply styles only in rtl direction: ```tsx // Demo.css.ts -import { vars } from './theme'; import { style } from '@vanilla-extract/css'; +import { vars } from './theme'; export const demo = style({ paddingRight: vars.spacing.md, diff --git a/docs/src/pages/styles/variants-sizes.mdx b/docs/src/pages/styles/variants-sizes.mdx index 09991914882..90bc5ab6d82 100644 --- a/docs/src/pages/styles/variants-sizes.mdx +++ b/docs/src/pages/styles/variants-sizes.mdx @@ -1,10 +1,10 @@ -import { Layout } from '@/layout'; -import { MDX_DATA } from '@/mdx'; import { + ActionIconDemos, StylesDemos, ThemingDemos, - ActionIconDemos, } from '@docs/demos'; +import { Layout } from '@/layout'; +import { MDX_DATA } from '@/mdx'; export default Layout(MDX_DATA.VariantsAndSizes); diff --git a/docs/src/pages/theming/color-schemes.mdx b/docs/src/pages/theming/color-schemes.mdx index f3056d06884..a2d1b112301 100644 --- a/docs/src/pages/theming/color-schemes.mdx +++ b/docs/src/pages/theming/color-schemes.mdx @@ -1,6 +1,6 @@ +import { StylesDemos, ThemingDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ThemingDemos, StylesDemos } from '@docs/demos'; export default Layout(MDX_DATA.ColorSchemes); @@ -149,7 +149,7 @@ Set `defaultColorScheme="auto"` on `MantineProvider` and `ColorSchemeScript` to In this case color scheme value will be controlled by the user OS: ```tsx -import { MantineProvider, ColorSchemeScript } from '@mantine/core'; +import { ColorSchemeScript, MantineProvider } from '@mantine/core'; function Demo() { return ( @@ -196,9 +196,9 @@ configure it. Default local storage based color scheme manager example: ```tsx import { + isMantineColorScheme, MantineColorScheme, MantineColorSchemeManager, - isMantineColorScheme, } from '@mantine/core'; export interface LocalStorageColorSchemeManagerOptions { @@ -290,7 +290,7 @@ It is required to be set both on [MantineProvider](/theming/mantine-provider/) a `ColorSchemeScript`. If `defaultColorScheme` is not set, then `light` is used. ```tsx -import { MantineProvider, ColorSchemeScript } from '@mantine/core'; +import { ColorSchemeScript, MantineProvider } from '@mantine/core'; function Demo() { return ( @@ -312,7 +312,7 @@ It is required to be set both on [MantineProvider](/theming/mantine-provider/) a When `forceColorScheme` is set, it is not possible to change color scheme value with `setColorScheme` function. ```tsx -import { MantineProvider, ColorSchemeScript } from '@mantine/core'; +import { ColorSchemeScript, MantineProvider } from '@mantine/core'; function Demo() { return ( @@ -342,7 +342,8 @@ Example with Next.js app router that supports disabled JavaScript: ```tsx import '@mantine/core/styles.css'; -import { MantineProvider, ColorSchemeScript } from '@mantine/core'; + +import { ColorSchemeScript, MantineProvider } from '@mantine/core'; export const metadata = { title: 'My Mantine app', diff --git a/docs/src/pages/theming/colors.mdx b/docs/src/pages/theming/colors.mdx index e5218dba359..21390f15fbf 100644 --- a/docs/src/pages/theming/colors.mdx +++ b/docs/src/pages/theming/colors.mdx @@ -1,7 +1,7 @@ +import { ThemingDemos } from '@docs/demos'; +import { ThemeColors } from '@/components/ThemeColors'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ThemeColors } from '@/components/ThemeColors'; -import { ThemingDemos } from '@docs/demos'; export default Layout(MDX_DATA.Colors); @@ -183,8 +183,8 @@ colors with poor contrast for lighter colors (yellow, teal, orange). Usually, it colors in advance to avoid contrast issues. ```tsx -import { MantineProvider } from '@mantine/core'; import { generateColors } from '@mantine/colors-generator'; +import { MantineProvider } from '@mantine/core'; function Demo() { return ( diff --git a/docs/src/pages/theming/default-props.mdx b/docs/src/pages/theming/default-props.mdx index dfcef46f7ea..2f38bce1a10 100644 --- a/docs/src/pages/theming/default-props.mdx +++ b/docs/src/pages/theming/default-props.mdx @@ -1,6 +1,6 @@ +import { ThemingDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ThemingDemos } from '@docs/demos'; export default Layout(MDX_DATA.DefaultProps); @@ -18,9 +18,9 @@ for a part of your application: ```tsx import { - MantineThemeProvider, Button, createTheme, + MantineThemeProvider, } from '@mantine/core'; const theme = createTheme({ diff --git a/docs/src/pages/theming/default-theme.mdx b/docs/src/pages/theming/default-theme.mdx index 8f1b07d94dc..d6ec6230e97 100644 --- a/docs/src/pages/theming/default-theme.mdx +++ b/docs/src/pages/theming/default-theme.mdx @@ -1,6 +1,6 @@ +import { DefaultThemeData } from '@/components/DefaultThemeData'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { DefaultThemeData } from '@/components/DefaultThemeData'; export default Layout(MDX_DATA.DefaultTheme); diff --git a/docs/src/pages/theming/mantine-provider.mdx b/docs/src/pages/theming/mantine-provider.mdx index beb110987ac..ea8457eb255 100644 --- a/docs/src/pages/theming/mantine-provider.mdx +++ b/docs/src/pages/theming/mantine-provider.mdx @@ -1,6 +1,6 @@ +import { ThemingDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ThemingDemos } from '@docs/demos'; export default Layout(MDX_DATA.MantineProvider); @@ -13,7 +13,7 @@ application and should be used only once. ## Usage ```tsx -import { MantineProvider, createTheme } from '@mantine/core'; +import { createTheme, MantineProvider } from '@mantine/core'; const theme = createTheme({ /** Your theme override here */ @@ -72,7 +72,7 @@ Pass [theme object](/theming/theme-object) override to `theme` prop. It will be theme and used in all components. ```tsx -import { MantineProvider, createTheme } from '@mantine/core'; +import { createTheme, MantineProvider } from '@mantine/core'; const theme = createTheme({ fontFamily: 'Open Sans, sans-serif', @@ -97,8 +97,8 @@ implementation to `colorSchemeManager` prop. You can learn more about color sche ```tsx import { - MantineProvider, localStorageColorSchemeManager, + MantineProvider, } from '@mantine/core'; const colorSchemeManager = localStorageColorSchemeManager({ @@ -199,7 +199,7 @@ function Demo() { Default value is `mantine` – all components will have `mantine-` prefix in their **static classes**. ```tsx -import { Text, MantineProvider } from '@mantine/core'; +import { MantineProvider, Text } from '@mantine/core'; function Demo() { return ( @@ -219,7 +219,7 @@ In this case (default `classNamesPrefix`), [Text](/core/text) component will hav With `classNamesPrefix` you can change only **static class**: ```tsx -import { Text, MantineProvider } from '@mantine/core'; +import { MantineProvider, Text } from '@mantine/core'; function Demo() { return ( diff --git a/docs/src/pages/theming/theme-object.mdx b/docs/src/pages/theming/theme-object.mdx index a876a556d2f..1117522885d 100644 --- a/docs/src/pages/theming/theme-object.mdx +++ b/docs/src/pages/theming/theme-object.mdx @@ -1,6 +1,6 @@ +import { ThemingDemos } from '@docs/demos'; import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx'; -import { ThemingDemos } from '@docs/demos'; export default Layout(MDX_DATA.ThemeObject); @@ -134,7 +134,7 @@ To customize theme, pass theme override object to [MantineProvider](/theming/man Theme override will be deeply merged with the default theme. ```tsx -import { MantineProvider, createTheme, rem } from '@mantine/core'; +import { createTheme, MantineProvider, rem } from '@mantine/core'; const theme = createTheme({ colors: { @@ -285,8 +285,8 @@ Use `mergeThemeOverrides` function to merge multiple themes into one theme overr ```tsx import { createTheme, - mergeThemeOverrides, MantineProvider, + mergeThemeOverrides, } from '@mantine/core'; const theme1 = createTheme({ @@ -345,8 +345,8 @@ To access theme outside of components, you need to create a full theme object // theme.ts import { createTheme, - mergeMantineTheme, DEFAULT_THEME, + mergeMantineTheme, } from '@mantine/theme'; const themeOverride = createTheme({ diff --git a/docs/src/pages/theming/typography.mdx b/docs/src/pages/theming/typography.mdx index 85a521db8cc..23a8a02170c 100644 --- a/docs/src/pages/theming/typography.mdx +++ b/docs/src/pages/theming/typography.mdx @@ -1,7 +1,7 @@ -import { Layout } from '@/layout'; -import { MDX_DATA } from '@/mdx'; import { DEFAULT_THEME, px } from '@mantine/core'; import { ThemingDemos } from '@docs/demos'; +import { Layout } from '@/layout'; +import { MDX_DATA } from '@/mdx'; export default Layout(MDX_DATA.Typography); diff --git a/docs/theme.ts b/docs/theme.ts index c529cffc328..1985d26ed3d 100644 --- a/docs/theme.ts +++ b/docs/theme.ts @@ -1,4 +1,4 @@ -import { DEFAULT_THEME, createTheme } from '@mantine/core'; +import { createTheme, DEFAULT_THEME } from '@mantine/core'; export const theme = createTheme({ fontFamilyMonospace: `Menlo, Monaco, ${DEFAULT_THEME.fontFamilyMonospace}`, diff --git a/package.json b/package.json index dfec614463e..40e8355e48c 100644 --- a/package.json +++ b/package.json @@ -101,6 +101,7 @@ "@babel/preset-react": "^7.23.3", "@babel/preset-typescript": "^7.23.3", "@hello-pangea/dnd": "^16.3.0", + "@ianvs/prettier-plugin-sort-imports": "^4.1.1", "@rollup/plugin-alias": "^5.0.1", "@rollup/plugin-node-resolve": "^15.2.3", "@rollup/plugin-replace": "^5.0.5", diff --git a/packages/@docs/demos/src/demos/carousel/Carousel.demo.animationOffset.tsx b/packages/@docs/demos/src/demos/carousel/Carousel.demo.animationOffset.tsx index 186e6b8f020..6d39977febe 100644 --- a/packages/@docs/demos/src/demos/carousel/Carousel.demo.animationOffset.tsx +++ b/packages/@docs/demos/src/demos/carousel/Carousel.demo.animationOffset.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; +import { Carousel, Embla, useAnimationOffsetEffect } from '@mantine/carousel'; import { Button, Modal, rem } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Carousel, Embla, useAnimationOffsetEffect } from '@mantine/carousel'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/carousel/Carousel.demo.autoplay.tsx b/packages/@docs/demos/src/demos/carousel/Carousel.demo.autoplay.tsx index dcc2595a2cc..b1184fb13c9 100644 --- a/packages/@docs/demos/src/demos/carousel/Carousel.demo.autoplay.tsx +++ b/packages/@docs/demos/src/demos/carousel/Carousel.demo.autoplay.tsx @@ -1,6 +1,6 @@ import React, { useRef } from 'react'; -import { Carousel } from '@mantine/carousel'; import Autoplay from 'embla-carousel-autoplay'; +import { Carousel } from '@mantine/carousel'; import { MantineDemo } from '@mantinex/demo'; import { Slides } from './_slides'; diff --git a/packages/@docs/demos/src/demos/carousel/Carousel.demo.brokenAnimation.tsx b/packages/@docs/demos/src/demos/carousel/Carousel.demo.brokenAnimation.tsx index 14b4b34513c..5990c22870e 100644 --- a/packages/@docs/demos/src/demos/carousel/Carousel.demo.brokenAnimation.tsx +++ b/packages/@docs/demos/src/demos/carousel/Carousel.demo.brokenAnimation.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; +import { Carousel } from '@mantine/carousel'; import { Button, Modal, rem } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Carousel } from '@mantine/carousel'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/carousel/Carousel.demo.cards.tsx b/packages/@docs/demos/src/demos/carousel/Carousel.demo.cards.tsx index 4e29e8d3355..953e068a722 100644 --- a/packages/@docs/demos/src/demos/carousel/Carousel.demo.cards.tsx +++ b/packages/@docs/demos/src/demos/carousel/Carousel.demo.cards.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Carousel, CarouselProps } from '@mantine/carousel'; +import { Button, Paper, Text, Title, useMantineTheme } from '@mantine/core'; import { useMediaQuery } from '@mantine/hooks'; -import { Button, Paper, Title, useMantineTheme, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import classes from './Carousel.demo.cards.module.css'; diff --git a/packages/@docs/demos/src/demos/carousel/Carousel.demo.icons.tsx b/packages/@docs/demos/src/demos/carousel/Carousel.demo.icons.tsx index 12c2a1c261e..7ab537efda6 100644 --- a/packages/@docs/demos/src/demos/carousel/Carousel.demo.icons.tsx +++ b/packages/@docs/demos/src/demos/carousel/Carousel.demo.icons.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { rem } from '@mantine/core'; +import { IconArrowLeft, IconArrowRight } from '@tabler/icons-react'; import { Carousel } from '@mantine/carousel'; -import { IconArrowRight, IconArrowLeft } from '@tabler/icons-react'; +import { rem } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { Slides } from './_slides'; diff --git a/packages/@docs/demos/src/demos/carousel/Carousel.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/carousel/Carousel.demo.stylesApi.tsx index d8915cacb93..4ca2ca10834 100644 --- a/packages/@docs/demos/src/demos/carousel/Carousel.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/carousel/Carousel.demo.stylesApi.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Carousel } from '@mantine/carousel'; +import { MantineDemo } from '@mantinex/demo'; import { CarouselStylesApi } from '@docs/styles-api'; import { Slides } from './_slides'; diff --git a/packages/@docs/demos/src/demos/carousel/Carousel.demos.story.tsx b/packages/@docs/demos/src/demos/carousel/Carousel.demos.story.tsx index 59882ca68f7..42de39aff49 100644 --- a/packages/@docs/demos/src/demos/carousel/Carousel.demos.story.tsx +++ b/packages/@docs/demos/src/demos/carousel/Carousel.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../render-demo'; +import * as demos from './index'; export default { title: 'Carousel' }; diff --git a/packages/@docs/demos/src/demos/carousel/_slides.tsx b/packages/@docs/demos/src/demos/carousel/_slides.tsx index 948540ed6d7..c98530f0794 100644 --- a/packages/@docs/demos/src/demos/carousel/_slides.tsx +++ b/packages/@docs/demos/src/demos/carousel/_slides.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { Box, rem } from '@mantine/core'; import { Carousel } from '@mantine/carousel'; +import { Box, rem } from '@mantine/core'; function Slide({ children }: { children: React.ReactNode }) { return ( diff --git a/packages/@docs/demos/src/demos/changelog/7-3-0/Changelog730.demo.checkboxRadioVariant.tsx b/packages/@docs/demos/src/demos/changelog/7-3-0/Changelog730.demo.checkboxRadioVariant.tsx index 3c516cffe11..a1908edc4ef 100644 --- a/packages/@docs/demos/src/demos/changelog/7-3-0/Changelog730.demo.checkboxRadioVariant.tsx +++ b/packages/@docs/demos/src/demos/changelog/7-3-0/Changelog730.demo.checkboxRadioVariant.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Checkbox, Radio, Stack } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Radio, Checkbox, Stack } from '@mantine/core'; const code = ` import { Radio, Checkbox, Stack } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/changelog/7-3-0/CodeHighlight.demos.story.tsx b/packages/@docs/demos/src/demos/changelog/7-3-0/CodeHighlight.demos.story.tsx index 93f3f7f2726..31abf963369 100644 --- a/packages/@docs/demos/src/demos/changelog/7-3-0/CodeHighlight.demos.story.tsx +++ b/packages/@docs/demos/src/demos/changelog/7-3-0/CodeHighlight.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Changelog 7.3.0' }; diff --git a/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.copy.tsx b/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.copy.tsx index 865a6e8c7a2..346871aadbf 100644 --- a/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.copy.tsx +++ b/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.copy.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { CodeHighlight } from '@mantine/code-highlight'; +import { MantineDemo } from '@mantinex/demo'; const exampleCode = ` function Button() { diff --git a/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.expand.tsx b/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.expand.tsx index 5ac30add76b..2e9b43ea814 100644 --- a/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.expand.tsx +++ b/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.expand.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { CodeHighlightTabs } from '@mantine/code-highlight'; +import { MantineDemo } from '@mantinex/demo'; const tsxCode = ` import { Group, Button, MantineProvider, createTheme } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.inline.tsx b/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.inline.tsx index 961a56fba9d..83188d69f27 100644 --- a/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.inline.tsx +++ b/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.inline.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Text } from '@mantine/core'; import { InlineCodeHighlight } from '@mantine/code-highlight'; +import { Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.tabs.tsx b/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.tabs.tsx index 52ddd2ec44e..c4906f97789 100644 --- a/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.tabs.tsx +++ b/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.tabs.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { CodeHighlightTabs } from '@mantine/code-highlight'; +import { MantineDemo } from '@mantinex/demo'; const tsxCode = ` import { Group, Button, MantineProvider, createTheme } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.tabsGetIcons.tsx b/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.tabsGetIcons.tsx index 64aa8c8c577..aa3fff39c5c 100644 --- a/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.tabsGetIcons.tsx +++ b/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.tabsGetIcons.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { TypeScriptIcon, CssIcon } from '@mantinex/dev-icons'; import { CodeHighlightTabs } from '@mantine/code-highlight'; +import { MantineDemo } from '@mantinex/demo'; +import { CssIcon, TypeScriptIcon } from '@mantinex/dev-icons'; const tsxCode = ` function Button() { diff --git a/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.tabsIcons.tsx b/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.tabsIcons.tsx index 326b398b7a3..2bac3fd71f0 100644 --- a/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.tabsIcons.tsx +++ b/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.tabsIcons.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { TypeScriptIcon, CssIcon } from '@mantinex/dev-icons'; import { CodeHighlightTabs } from '@mantine/code-highlight'; +import { MantineDemo } from '@mantinex/demo'; +import { CssIcon, TypeScriptIcon } from '@mantinex/dev-icons'; const tsxCode = ` function Button() { diff --git a/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.usage.tsx b/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.usage.tsx index a9cc9419dc4..251d129a97d 100644 --- a/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { CodeHighlight } from '@mantine/code-highlight'; +import { MantineDemo } from '@mantinex/demo'; const exampleCode = ` // VisuallyHidden component source code diff --git a/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demos.story.tsx b/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demos.story.tsx index 202571a1efa..918fefea24b 100644 --- a/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demos.story.tsx +++ b/packages/@docs/demos/src/demos/code-highlight/CodeHighlight.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../render-demo'; +import * as demos from './index'; export default { title: 'CodeHighlight' }; diff --git a/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.chevron.tsx b/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.chevron.tsx index f091a2dc818..bb51fd589ba 100644 --- a/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.chevron.tsx +++ b/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.chevron.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Accordion } from '@mantine/core'; import { IconPlus } from '@tabler/icons-react'; +import { Accordion } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { groceries } from './_base'; import classes from './Accordion.demo.chevron.module.css'; diff --git a/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.configurator.tsx index de595b7f31c..b124f223566 100644 --- a/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.configurator.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { AccordionProps, Accordion } from '@mantine/core'; +import { Accordion, AccordionProps } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { groceries } from './_base'; diff --git a/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.customize.tsx b/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.customize.tsx index a67f17b32a6..93db335abca 100644 --- a/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.customize.tsx +++ b/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.customize.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Accordion } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { groceries } from './_base'; import classes from './Accordion.demo.customize.module.css'; diff --git a/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.disabled.tsx index 17001b782b9..3f8c9de9625 100644 --- a/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Accordion } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { groceries } from './_base'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.icons.tsx b/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.icons.tsx index c5934cf43bd..e36897cbb04 100644 --- a/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.icons.tsx +++ b/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.icons.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { IconPhoto, IconPrinter, IconCameraSelfie } from '@tabler/icons-react'; -import { MantineDemo } from '@mantinex/demo'; +import { IconCameraSelfie, IconPhoto, IconPrinter } from '@tabler/icons-react'; import { Accordion, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { IconPhoto, IconPrinter, IconCameraSelfie } from '@tabler/icons-react'; diff --git a/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.label.tsx b/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.label.tsx index 30208397faf..ed633a1aa0a 100644 --- a/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.label.tsx +++ b/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.label.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Group, Avatar, Text, Accordion, AccordionProps } from '@mantine/core'; +import { Accordion, AccordionProps, Avatar, Group, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; const charactersList = [ diff --git a/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.sideControls.tsx b/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.sideControls.tsx index 72a6fa2b3f5..025e259762a 100644 --- a/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.sideControls.tsx +++ b/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.sideControls.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { Accordion, ActionIcon, AccordionControlProps, Center } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { IconDots } from '@tabler/icons-react'; +import { Accordion, AccordionControlProps, ActionIcon, Center } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Accordion, ActionIcon, AccordionControlProps, Center } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.stylesApi.tsx index 50deadc5b31..795d733792e 100644 --- a/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Accordion/Accordion.demo.stylesApi.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Accordion, AccordionProps } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { AccordionStylesApi } from '@docs/styles-api'; import { groceries } from './_base'; diff --git a/packages/@docs/demos/src/demos/core/Accordion/Accordion.demos.story.tsx b/packages/@docs/demos/src/demos/core/Accordion/Accordion.demos.story.tsx index ec484ee1365..32876a960d7 100644 --- a/packages/@docs/demos/src/demos/core/Accordion/Accordion.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Accordion/Accordion.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Accordion' }; diff --git a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.customSize.tsx b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.customSize.tsx index 213e1554a98..fca653a34d7 100644 --- a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.customSize.tsx +++ b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.customSize.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { ActionIcon, createTheme, Group, MantineThemeProvider, rem } from '@mantine/core'; import { IconHeart } from '@tabler/icons-react'; +import { ActionIcon, createTheme, Group, MantineThemeProvider, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import classes from './ActionIcon.demo.customSize.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.customVariant.tsx b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.customVariant.tsx index 6f92e85e6c6..b75b948c96d 100644 --- a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.customVariant.tsx +++ b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.customVariant.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Group, ActionIcon, MantineThemeProvider, createTheme } from '@mantine/core'; import { IconHeart } from '@tabler/icons-react'; +import { ActionIcon, createTheme, Group, MantineThemeProvider } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import classes from './ActionIcon.demo.customVariant.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.disabled.tsx index 6e9a5c6f432..d5f1f3c4898 100644 --- a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.disabled.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { ActionIcon, Group } from '@mantine/core'; import { IconHeart } from '@tabler/icons-react'; +import { ActionIcon, Group } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ActionIcon, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.disabledLink.tsx b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.disabledLink.tsx index 830fe25eb0a..b987c4a2e71 100644 --- a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.disabledLink.tsx +++ b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.disabledLink.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { ActionIcon } from '@mantine/core'; import { IconExternalLink } from '@tabler/icons-react'; +import { ActionIcon } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ActionIcon } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.disabledStyles.tsx b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.disabledStyles.tsx index 869ba6fdf7d..ee0ea9c614d 100644 --- a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.disabledStyles.tsx +++ b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.disabledStyles.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { ActionIcon } from '@mantine/core'; import { IconHeart } from '@tabler/icons-react'; +import { ActionIcon } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import classes from './ActionIcon.demo.disabledStyles.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.disabledTooltip.tsx b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.disabledTooltip.tsx index dac1a25bb1f..a9fb2e887d9 100644 --- a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.disabledTooltip.tsx +++ b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.disabledTooltip.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { ActionIcon, Tooltip } from '@mantine/core'; import { IconHeart } from '@tabler/icons-react'; +import { ActionIcon, Tooltip } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ActionIcon, Tooltip } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.gradient.tsx b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.gradient.tsx index 5fe428722fc..3df5a6e1900 100644 --- a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.gradient.tsx +++ b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.gradient.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { ActionIcon } from '@mantine/core'; import { IconHeart } from '@tabler/icons-react'; +import { ActionIcon } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { gradientControls } from '../../../shared'; const code = (props: any) => ` diff --git a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.group.tsx b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.group.tsx index 7a83c7013b9..72caca9c165 100644 --- a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.group.tsx +++ b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.group.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { IconHeart, IconPhoto, IconSettings } from '@tabler/icons-react'; import { ActionIcon, rem } from '@mantine/core'; -import { IconPhoto, IconSettings, IconHeart } from '@tabler/icons-react'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ActionIcon, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.loaderProps.tsx b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.loaderProps.tsx index 1feeb39e226..d91ca84d001 100644 --- a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.loaderProps.tsx +++ b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.loaderProps.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ActionIcon } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ActionIcon } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.loading.tsx b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.loading.tsx index fe3dfede261..d9885adb983 100644 --- a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.loading.tsx +++ b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.loading.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ActionIcon, Group } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ActionIcon, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.size.tsx b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.size.tsx index c8f4c6c6fc0..70e5522eae9 100644 --- a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.size.tsx +++ b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.size.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { ActionIcon, rem } from '@mantine/core'; import { IconHeart } from '@tabler/icons-react'; +import { ActionIcon, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ActionIcon, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.usage.tsx b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.usage.tsx index 72cb0d39e8d..0401097cae6 100644 --- a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { IconAdjustments } from '@tabler/icons-react'; import { ActionIcon } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { interactiveVariantsControl } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demos.story.tsx b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demos.story.tsx index fc9cb23fe46..f8cc19a3a6c 100644 --- a/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/ActionIcon/ActionIcon.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'ActionIcon' }; diff --git a/packages/@docs/demos/src/demos/core/Affix/Affix.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Affix/Affix.demo.usage.tsx index 0951e375925..44456edaca8 100644 --- a/packages/@docs/demos/src/demos/core/Affix/Affix.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Affix/Affix.demo.usage.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { IconArrowUp } from '@tabler/icons-react'; +import { Affix, Button, rem, Text, Transition } from '@mantine/core'; import { useWindowScroll } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { Button, Text, Transition, Affix, rem } from '@mantine/core'; const code = ` import { IconArrowUp } from '@tabler/icons-react'; diff --git a/packages/@docs/demos/src/demos/core/Affix/Affix.demos.story.tsx b/packages/@docs/demos/src/demos/core/Affix/Affix.demos.story.tsx index ef53679685f..be856ce6b04 100644 --- a/packages/@docs/demos/src/demos/core/Affix/Affix.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Affix/Affix.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Affix' }; diff --git a/packages/@docs/demos/src/demos/core/Alert/Alert.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Alert/Alert.demo.configurator.tsx index 009af46ff95..fb3e3f75541 100644 --- a/packages/@docs/demos/src/demos/core/Alert/Alert.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Alert/Alert.demo.configurator.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Alert } from '@mantine/core'; import { IconInfoCircle } from '@tabler/icons-react'; +import { Alert } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { staticVariantsControl } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Alert/Alert.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Alert/Alert.demo.stylesApi.tsx index a2e03f16ff8..b22874017a4 100644 --- a/packages/@docs/demos/src/demos/core/Alert/Alert.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Alert/Alert.demo.stylesApi.tsx @@ -1,8 +1,8 @@ import React from 'react'; +import { IconHeart } from '@tabler/icons-react'; +import { Alert } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { AlertStylesApi } from '@docs/styles-api'; -import { Alert } from '@mantine/core'; -import { IconHeart } from '@tabler/icons-react'; const code = ` import { Alert } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Alert/Alert.demos.story.tsx b/packages/@docs/demos/src/demos/core/Alert/Alert.demos.story.tsx index a7f5fd5fe15..772df0d22f4 100644 --- a/packages/@docs/demos/src/demos/core/Alert/Alert.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Alert/Alert.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Alert' }; diff --git a/packages/@docs/demos/src/demos/core/Anchor/Anchor.demo.decoration.tsx b/packages/@docs/demos/src/demos/core/Anchor/Anchor.demo.decoration.tsx index 7bcdb40ffee..adcb74cc48c 100644 --- a/packages/@docs/demos/src/demos/core/Anchor/Anchor.demo.decoration.tsx +++ b/packages/@docs/demos/src/demos/core/Anchor/Anchor.demo.decoration.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Anchor, Group } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Anchor, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Anchor/Anchor.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Anchor/Anchor.demo.usage.tsx index 636feba4c5b..e8a629a0610 100644 --- a/packages/@docs/demos/src/demos/core/Anchor/Anchor.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Anchor/Anchor.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Anchor } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Anchor } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Anchor/Anchor.demos.story.tsx b/packages/@docs/demos/src/demos/core/Anchor/Anchor.demos.story.tsx index 4b7fb791668..39972d92a3f 100644 --- a/packages/@docs/demos/src/demos/core/Anchor/Anchor.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Anchor/Anchor.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Anchor' }; diff --git a/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demo.flex.tsx b/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demo.flex.tsx index ae67c16878a..4e969c2a76f 100644 --- a/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demo.flex.tsx +++ b/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demo.flex.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { AspectRatio, Image, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { AspectRatio, Image, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demo.image.tsx b/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demo.image.tsx index e0a8758b2fd..056834ade24 100644 --- a/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demo.image.tsx +++ b/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demo.image.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { AspectRatio } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { AspectRatio } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demo.map.tsx b/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demo.map.tsx index 54c11bad30e..06f12354b9d 100644 --- a/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demo.map.tsx +++ b/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demo.map.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { AspectRatio } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { AspectRatio } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demo.video.tsx b/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demo.video.tsx index 23d1fc10df7..f0b31111d3a 100644 --- a/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demo.video.tsx +++ b/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demo.video.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { AspectRatio } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { AspectRatio } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demos.story.tsx b/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demos.story.tsx index 7afe43e8280..35270933df2 100644 --- a/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/AspectRatio/AspectRatio.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'AspectRatio' }; diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.configurator.tsx index a01d1913d1e..09fdbe39c69 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Autocomplete } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { inputControls } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.disabled.tsx index 6351d340bc4..7441c70d628 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Autocomplete } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Autocomplete } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.disabledOptions.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.disabledOptions.tsx index fd907b4afb6..d630ff65f85 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.disabledOptions.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.disabledOptions.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Autocomplete } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Autocomplete } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownAnimation.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownAnimation.tsx index d9f89d8defd..fa217275659 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownAnimation.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownAnimation.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Autocomplete } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Autocomplete } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownOpened.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownOpened.tsx index 47220692a67..63a0de0e29b 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownOpened.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownOpened.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { useDisclosure } from '@mantine/hooks'; import { Autocomplete, Button } from '@mantine/core'; +import { useDisclosure } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Autocomplete, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownPadding.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownPadding.tsx index 673f1ad6ad3..e7bc30cc202 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownPadding.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownPadding.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Autocomplete } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Autocomplete } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownPosition.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownPosition.tsx index 9c4bf5aa243..b4401d396cb 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownPosition.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownPosition.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Autocomplete } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Autocomplete } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownShadow.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownShadow.tsx index b8318d51925..e8a6f3cfa58 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownShadow.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.dropdownShadow.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Autocomplete } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Autocomplete } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.error.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.error.tsx index 635c64e87f5..3f778c8a259 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.error.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.error.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Autocomplete } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Autocomplete } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.groups.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.groups.tsx index 5b5502a7fdd..b521eab2201 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.groups.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.groups.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Autocomplete } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Autocomplete } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.limit.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.limit.tsx index 77633a62ce3..3e4a403f865 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.limit.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.limit.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Autocomplete } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Autocomplete } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.readOnly.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.readOnly.tsx index a479d030903..e1afd4e3789 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.readOnly.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.readOnly.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Autocomplete } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Autocomplete } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.scrollArea.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.scrollArea.tsx index e8a51497d5c..f3ebe375581 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.scrollArea.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.scrollArea.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Autocomplete } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Autocomplete } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.search.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.search.tsx index 0d3869c22f2..00b5ba52bef 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.search.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.search.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Autocomplete, ComboboxItem, OptionsFilter } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Autocomplete, ComboboxItem, OptionsFilter } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.sections.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.sections.tsx index 5f38e0c7328..53c2d57e305 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.sections.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.sections.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Autocomplete, rem } from '@mantine/core'; import { IconComponents } from '@tabler/icons-react'; +import { Autocomplete, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Autocomplete, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.sort.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.sort.tsx index 203ffac20a3..6066a9225a2 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.sort.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.sort.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Autocomplete, ComboboxItem, OptionsFilter } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Autocomplete, ComboboxItem, OptionsFilter } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.stylesApi.tsx index 7bf36a47078..14ccdbcfe71 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.stylesApi.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { IconAt } from '@tabler/icons-react'; import { Autocomplete, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { AutocompleteStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.usage.tsx index 112eaf079c9..3de7d5f4ded 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Autocomplete } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Autocomplete } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.withinPopover.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.withinPopover.tsx index ee485759ab1..950d1b4c271 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.withinPopover.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demo.withinPopover.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Autocomplete, Button, Popover } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Popover, Button, Autocomplete } from '@mantine/core'; const code = ` import { Popover, Button, Autocomplete } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demos.story.tsx b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demos.story.tsx index 16954f8f779..5f5d0701acd 100644 --- a/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Autocomplete/Autocomplete.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Autocomplete' }; diff --git a/packages/@docs/demos/src/demos/core/Avatar/Avatar.demo.gradient.tsx b/packages/@docs/demos/src/demos/core/Avatar/Avatar.demo.gradient.tsx index 6a22c2aa94a..774f9c0c5b7 100644 --- a/packages/@docs/demos/src/demos/core/Avatar/Avatar.demo.gradient.tsx +++ b/packages/@docs/demos/src/demos/core/Avatar/Avatar.demo.gradient.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Avatar } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { gradientControls } from '../../../shared'; const code = (props: any) => ` diff --git a/packages/@docs/demos/src/demos/core/Avatar/Avatar.demo.placeholders.tsx b/packages/@docs/demos/src/demos/core/Avatar/Avatar.demo.placeholders.tsx index 4b19a56f4e8..3a5b5f17506 100644 --- a/packages/@docs/demos/src/demos/core/Avatar/Avatar.demo.placeholders.tsx +++ b/packages/@docs/demos/src/demos/core/Avatar/Avatar.demo.placeholders.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { IconStar } from '@tabler/icons-react'; -import { MantineDemo } from '@mantinex/demo'; import { Avatar, Group } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Avatar } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Avatar/Avatar.demos.story.tsx b/packages/@docs/demos/src/demos/core/Avatar/Avatar.demos.story.tsx index fea3861c9ee..9067b75dd69 100644 --- a/packages/@docs/demos/src/demos/core/Avatar/Avatar.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Avatar/Avatar.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Avatar' }; diff --git a/packages/@docs/demos/src/demos/core/BackgroundImage/BackgroundImage.demo.usage.tsx b/packages/@docs/demos/src/demos/core/BackgroundImage/BackgroundImage.demo.usage.tsx index bd8b9cbc994..ef0c1bb9b98 100644 --- a/packages/@docs/demos/src/demos/core/BackgroundImage/BackgroundImage.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/BackgroundImage/BackgroundImage.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { BackgroundImage, BackgroundImageProps, Box, Center, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { BackgroundImage, BackgroundImageProps, Center, Text, Box } from '@mantine/core'; function Wrapper(props: BackgroundImageProps) { return ( diff --git a/packages/@docs/demos/src/demos/core/BackgroundImage/BackgroundImage.demos.story.tsx b/packages/@docs/demos/src/demos/core/BackgroundImage/BackgroundImage.demos.story.tsx index 7ec386883f4..b69fe1b4ebe 100644 --- a/packages/@docs/demos/src/demos/core/BackgroundImage/BackgroundImage.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/BackgroundImage/BackgroundImage.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'BackgroundImage' }; diff --git a/packages/@docs/demos/src/demos/core/Badge/Badge.demo.fullWidth.tsx b/packages/@docs/demos/src/demos/core/Badge/Badge.demo.fullWidth.tsx index 7582720039c..783a881f85a 100644 --- a/packages/@docs/demos/src/demos/core/Badge/Badge.demo.fullWidth.tsx +++ b/packages/@docs/demos/src/demos/core/Badge/Badge.demo.fullWidth.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Badge } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Badge } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Badge/Badge.demo.gradient.tsx b/packages/@docs/demos/src/demos/core/Badge/Badge.demo.gradient.tsx index 371f4926b98..95a44f775ea 100644 --- a/packages/@docs/demos/src/demos/core/Badge/Badge.demo.gradient.tsx +++ b/packages/@docs/demos/src/demos/core/Badge/Badge.demo.gradient.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Badge } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { gradientControls } from '../../../shared'; const code = (props: any) => ` diff --git a/packages/@docs/demos/src/demos/core/Badge/Badge.demo.sections.tsx b/packages/@docs/demos/src/demos/core/Badge/Badge.demo.sections.tsx index feaec1e5393..1a4563e099b 100644 --- a/packages/@docs/demos/src/demos/core/Badge/Badge.demo.sections.tsx +++ b/packages/@docs/demos/src/demos/core/Badge/Badge.demo.sections.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Badge, Group, rem } from '@mantine/core'; import { IconAt } from '@tabler/icons-react'; +import { Badge, Group, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Badge, Group, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Badge/Badge.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Badge/Badge.demo.stylesApi.tsx index b323b8a373a..227b8401c7f 100644 --- a/packages/@docs/demos/src/demos/core/Badge/Badge.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Badge/Badge.demo.stylesApi.tsx @@ -1,8 +1,8 @@ import React from 'react'; +import { IconAt } from '@tabler/icons-react'; +import { Badge, rem } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { BadgeStylesApi } from '@docs/styles-api'; -import { Badge, rem } from '@mantine/core'; -import { IconAt } from '@tabler/icons-react'; const code = ` import { Badge, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Badge/Badge.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Badge/Badge.demo.usage.tsx index 938f8056c3f..16b15a28763 100644 --- a/packages/@docs/demos/src/demos/core/Badge/Badge.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Badge/Badge.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Badge } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Badge } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Badge/Badge.demos.story.tsx b/packages/@docs/demos/src/demos/core/Badge/Badge.demos.story.tsx index 5467cd782fa..94868f59edf 100644 --- a/packages/@docs/demos/src/demos/core/Badge/Badge.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Badge/Badge.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Badge' }; diff --git a/packages/@docs/demos/src/demos/core/Blockquote/Blockquote.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Blockquote/Blockquote.demo.usage.tsx index ab7ed782728..62b319d6329 100644 --- a/packages/@docs/demos/src/demos/core/Blockquote/Blockquote.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Blockquote/Blockquote.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Blockquote } from '@mantine/core'; import { IconInfoCircle } from '@tabler/icons-react'; +import { Blockquote } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Blockquote } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Blockquote/Blockquote.demos.story.tsx b/packages/@docs/demos/src/demos/core/Blockquote/Blockquote.demos.story.tsx index 59306f1e352..6b30d843314 100644 --- a/packages/@docs/demos/src/demos/core/Blockquote/Blockquote.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Blockquote/Blockquote.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Blockquote' }; diff --git a/packages/@docs/demos/src/demos/core/Breadcrumbs/Breadcrumbs.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Breadcrumbs/Breadcrumbs.demo.usage.tsx index 4063471f6da..928505530c1 100644 --- a/packages/@docs/demos/src/demos/core/Breadcrumbs/Breadcrumbs.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Breadcrumbs/Breadcrumbs.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Anchor, Breadcrumbs } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Breadcrumbs, Anchor } from '@mantine/core'; const code = ` import { Breadcrumbs, Anchor } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Breadcrumbs/Breadcrumbs.demos.story.tsx b/packages/@docs/demos/src/demos/core/Breadcrumbs/Breadcrumbs.demos.story.tsx index e05b2217794..9a3cdd1fedb 100644 --- a/packages/@docs/demos/src/demos/core/Breadcrumbs/Breadcrumbs.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Breadcrumbs/Breadcrumbs.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Breadcrumbs' }; diff --git a/packages/@docs/demos/src/demos/core/Burger/Burger.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Burger/Burger.demo.usage.tsx index ce789557dbe..5836a54cf2c 100644 --- a/packages/@docs/demos/src/demos/core/Burger/Burger.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Burger/Burger.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { useDisclosure } from '@mantine/hooks'; import { Burger } from '@mantine/core'; +import { useDisclosure } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useDisclosure } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/core/Burger/Burger.demos.story.tsx b/packages/@docs/demos/src/demos/core/Burger/Burger.demos.story.tsx index b2e133f19f5..dda6a7bb5d2 100644 --- a/packages/@docs/demos/src/demos/core/Burger/Burger.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Burger/Burger.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Burger' }; diff --git a/packages/@docs/demos/src/demos/core/Button/Button.demo.compact.tsx b/packages/@docs/demos/src/demos/core/Button/Button.demo.compact.tsx index 743888ee23a..d3a0c359bc5 100644 --- a/packages/@docs/demos/src/demos/core/Button/Button.demo.compact.tsx +++ b/packages/@docs/demos/src/demos/core/Button/Button.demo.compact.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button, Group } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = (props: any) => ` import { Button, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Button/Button.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Button/Button.demo.configurator.tsx index 861d37086b6..24329e10d40 100644 --- a/packages/@docs/demos/src/demos/core/Button/Button.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Button/Button.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { interactiveVariantsControl } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Button/Button.demo.customVariant.tsx b/packages/@docs/demos/src/demos/core/Button/Button.demo.customVariant.tsx index 6e9912b7530..1d8e2190cef 100644 --- a/packages/@docs/demos/src/demos/core/Button/Button.demo.customVariant.tsx +++ b/packages/@docs/demos/src/demos/core/Button/Button.demo.customVariant.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, createTheme, Group, MantineThemeProvider } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Group, Button, MantineThemeProvider, createTheme } from '@mantine/core'; import classes from './Button.demo.customVariant.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Button/Button.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/Button/Button.demo.disabled.tsx index 4d22a1a5341..d16a8e1f967 100644 --- a/packages/@docs/demos/src/demos/core/Button/Button.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/Button/Button.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Button/Button.demo.disabledLink.tsx b/packages/@docs/demos/src/demos/core/Button/Button.demo.disabledLink.tsx index 283a9adab0e..86d098de87a 100644 --- a/packages/@docs/demos/src/demos/core/Button/Button.demo.disabledLink.tsx +++ b/packages/@docs/demos/src/demos/core/Button/Button.demo.disabledLink.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Button/Button.demo.disabledStyles.tsx b/packages/@docs/demos/src/demos/core/Button/Button.demo.disabledStyles.tsx index a8ca7469785..f4d5882bdbe 100644 --- a/packages/@docs/demos/src/demos/core/Button/Button.demo.disabledStyles.tsx +++ b/packages/@docs/demos/src/demos/core/Button/Button.demo.disabledStyles.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import classes from './Button.demo.disabledStyles.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Button/Button.demo.disabledTooltip.tsx b/packages/@docs/demos/src/demos/core/Button/Button.demo.disabledTooltip.tsx index 42cc99d29c7..2d073a08c6b 100644 --- a/packages/@docs/demos/src/demos/core/Button/Button.demo.disabledTooltip.tsx +++ b/packages/@docs/demos/src/demos/core/Button/Button.demo.disabledTooltip.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button, Tooltip } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button, Tooltip } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Button/Button.demo.fullWidth.tsx b/packages/@docs/demos/src/demos/core/Button/Button.demo.fullWidth.tsx index 97dd54df4d7..99308dd1007 100644 --- a/packages/@docs/demos/src/demos/core/Button/Button.demo.fullWidth.tsx +++ b/packages/@docs/demos/src/demos/core/Button/Button.demo.fullWidth.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Button/Button.demo.gradient.tsx b/packages/@docs/demos/src/demos/core/Button/Button.demo.gradient.tsx index 8e16ad1cedb..c10091b4d3a 100644 --- a/packages/@docs/demos/src/demos/core/Button/Button.demo.gradient.tsx +++ b/packages/@docs/demos/src/demos/core/Button/Button.demo.gradient.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { gradientControls } from '../../../shared'; const code = (props: any) => ` diff --git a/packages/@docs/demos/src/demos/core/Button/Button.demo.group.tsx b/packages/@docs/demos/src/demos/core/Button/Button.demo.group.tsx index ecd23343442..d8590facf43 100644 --- a/packages/@docs/demos/src/demos/core/Button/Button.demo.group.tsx +++ b/packages/@docs/demos/src/demos/core/Button/Button.demo.group.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Button/Button.demo.loaderProps.tsx b/packages/@docs/demos/src/demos/core/Button/Button.demo.loaderProps.tsx index ebd8c7491bb..839d55706b8 100644 --- a/packages/@docs/demos/src/demos/core/Button/Button.demo.loaderProps.tsx +++ b/packages/@docs/demos/src/demos/core/Button/Button.demo.loaderProps.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Button/Button.demo.loading.tsx b/packages/@docs/demos/src/demos/core/Button/Button.demo.loading.tsx index c8737649ad9..1630026579f 100644 --- a/packages/@docs/demos/src/demos/core/Button/Button.demo.loading.tsx +++ b/packages/@docs/demos/src/demos/core/Button/Button.demo.loading.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { useDisclosure } from '@mantine/hooks'; import { Button, Group, Switch } from '@mantine/core'; +import { useDisclosure } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Button/Button.demo.sections.tsx b/packages/@docs/demos/src/demos/core/Button/Button.demo.sections.tsx index a3a6f59fdb0..31d7df63818 100644 --- a/packages/@docs/demos/src/demos/core/Button/Button.demo.sections.tsx +++ b/packages/@docs/demos/src/demos/core/Button/Button.demo.sections.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { IconArrowRight, IconDownload, IconPhoto } from '@tabler/icons-react'; +import { Button, Group } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Group, Button } from '@mantine/core'; -import { IconPhoto, IconDownload, IconArrowRight } from '@tabler/icons-react'; const code = ` import { Group, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Button/Button.demo.sectionsJustify.tsx b/packages/@docs/demos/src/demos/core/Button/Button.demo.sectionsJustify.tsx index 50a534319f1..5ae918f0458 100644 --- a/packages/@docs/demos/src/demos/core/Button/Button.demo.sectionsJustify.tsx +++ b/packages/@docs/demos/src/demos/core/Button/Button.demo.sectionsJustify.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Button } from '@mantine/core'; import { IconPhoto } from '@tabler/icons-react'; +import { Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = (props: any) => ` import { Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Button/Button.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Button/Button.demo.stylesApi.tsx index 924d8078785..a5b5fe74078 100644 --- a/packages/@docs/demos/src/demos/core/Button/Button.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Button/Button.demo.stylesApi.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { IconAt } from '@tabler/icons-react'; import { Button, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { ButtonStylesApi } from '@docs/styles-api'; -import { IconAt } from '@tabler/icons-react'; const code = ` import { Button, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Button/Button.demos.story.tsx b/packages/@docs/demos/src/demos/core/Button/Button.demos.story.tsx index 01f1e7e56b4..3922eb9af2c 100644 --- a/packages/@docs/demos/src/demos/core/Button/Button.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Button/Button.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Button' }; diff --git a/packages/@docs/demos/src/demos/core/Card/Card.demo.linkSection.tsx b/packages/@docs/demos/src/demos/core/Card/Card.demo.linkSection.tsx index bcd01abfa56..124b7cd9202 100644 --- a/packages/@docs/demos/src/demos/core/Card/Card.demo.linkSection.tsx +++ b/packages/@docs/demos/src/demos/core/Card/Card.demo.linkSection.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Card, Image, Text, Badge, Button, Group } from '@mantine/core'; +import { Badge, Button, Card, Group, Image, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Card/Card.demo.section.tsx b/packages/@docs/demos/src/demos/core/Card/Card.demo.section.tsx index fe22e7bc49d..01cff5db7d3 100644 --- a/packages/@docs/demos/src/demos/core/Card/Card.demo.section.tsx +++ b/packages/@docs/demos/src/demos/core/Card/Card.demo.section.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { Card, Group, Text, Menu, ActionIcon, Image, SimpleGrid, rem } from '@mantine/core'; import { IconDots, IconEye, IconFileZip, IconTrash } from '@tabler/icons-react'; +import { ActionIcon, Card, Group, Image, Menu, rem, SimpleGrid, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Card/Card.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Card/Card.demo.usage.tsx index f08e1683003..cbd325844f7 100644 --- a/packages/@docs/demos/src/demos/core/Card/Card.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Card/Card.demo.usage.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Card, Image, Text, Badge, Button, Group } from '@mantine/core'; +import { Badge, Button, Card, Group, Image, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Card/Card.demos.story.tsx b/packages/@docs/demos/src/demos/core/Card/Card.demos.story.tsx index 1c536d07d11..f5b0fe4b87b 100644 --- a/packages/@docs/demos/src/demos/core/Card/Card.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Card/Card.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Card' }; diff --git a/packages/@docs/demos/src/demos/core/Center/Center.demo.inline.tsx b/packages/@docs/demos/src/demos/core/Center/Center.demo.inline.tsx index 74868c3bb08..20100628b5c 100644 --- a/packages/@docs/demos/src/demos/core/Center/Center.demo.inline.tsx +++ b/packages/@docs/demos/src/demos/core/Center/Center.demo.inline.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { IconArrowLeft } from '@tabler/icons-react'; +import { Anchor, Box, Center, rem } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Center, Anchor, Box, rem } from '@mantine/core'; const code = ` import { Center, Anchor, Box, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Center/Center.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Center/Center.demo.usage.tsx index 30de11206f1..5dd1adbcb86 100644 --- a/packages/@docs/demos/src/demos/core/Center/Center.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Center/Center.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Box, Center } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Center, Box } from '@mantine/core'; const code = ` import { Center, Box } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Center/Center.demos.story.tsx b/packages/@docs/demos/src/demos/core/Center/Center.demos.story.tsx index a4f4303bdb7..423009ecde0 100644 --- a/packages/@docs/demos/src/demos/core/Center/Center.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Center/Center.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Center' }; diff --git a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.anchor.tsx b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.anchor.tsx index 8e6ae7e92bf..7099392e291 100644 --- a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.anchor.tsx +++ b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.anchor.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Anchor, Checkbox } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Checkbox, Anchor } from '@mantine/core'; const code = ` import { Checkbox, Anchor } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.card.tsx b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.card.tsx index 2db9cbe2608..c6fdbfe0d0c 100644 --- a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.card.tsx +++ b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.card.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Checkbox, Text, UnstyledButton } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Checkbox, UnstyledButton, Text } from '@mantine/core'; import classes from './Checkbox.demo.card.module.css'; const cssCode = `.root { diff --git a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.configurator.tsx index e795ac1e307..8f07fa70de3 100644 --- a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Checkbox, CheckboxProps } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Checkbox } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.customSize.tsx b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.customSize.tsx index f93a905e12e..142c343aaff 100644 --- a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.customSize.tsx +++ b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.customSize.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Checkbox, createTheme, MantineThemeProvider } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { MantineThemeProvider, Checkbox, createTheme } from '@mantine/core'; import classes from './Checkbox.demo.customSize.module.css'; const cssCode = `.root { diff --git a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.customize.tsx b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.customize.tsx index fb2f09ea918..129580ec632 100644 --- a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.customize.tsx +++ b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.customize.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Checkbox } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import classes from './Checkbox.demo.customize.module.css'; const cssCode = ` diff --git a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.groupConfigurator.tsx b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.groupConfigurator.tsx index 0e235980552..14356860801 100644 --- a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.groupConfigurator.tsx +++ b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.groupConfigurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Checkbox, CheckboxGroupProps, Group } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { CheckboxGroupProps, Checkbox, Group } from '@mantine/core'; const code = ` import { Checkbox, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.icon.tsx b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.icon.tsx index 17b6419d14e..4ab4ee3e57d 100644 --- a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.icon.tsx +++ b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.icon.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { IconBiohazard, IconRadioactive } from '@tabler/icons-react'; -import { MantineDemo } from '@mantinex/demo'; import { Checkbox, CheckboxProps } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Checkbox, CheckboxProps } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.iconColor.tsx b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.iconColor.tsx index f0c648228b8..b4f3b470e56 100644 --- a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.iconColor.tsx +++ b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.iconColor.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Checkbox } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Checkbox } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.indeterminate.tsx b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.indeterminate.tsx index ebc8ad9b9e4..64c0d6dc346 100644 --- a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.indeterminate.tsx +++ b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.indeterminate.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { useListState, randomId } from '@mantine/hooks'; +import { Box, Checkbox } from '@mantine/core'; +import { randomId, useListState } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { Checkbox, Box } from '@mantine/core'; const code = ` import { useListState, randomId } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.states.tsx b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.states.tsx index b3507526abc..f9667d43920 100644 --- a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.states.tsx +++ b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.states.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Checkbox, Stack } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Checkbox, Stack } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.stylesApi.tsx index 42ff40a9a6a..12ca5f20b40 100644 --- a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.stylesApi.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Checkbox } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { CheckboxStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.tooltip.tsx b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.tooltip.tsx index 76dce27b50e..24344f41d7d 100644 --- a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.tooltip.tsx +++ b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demo.tooltip.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Checkbox, Tooltip } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Tooltip, Checkbox } from '@mantine/core'; const code = ` import { Tooltip, Checkbox } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demos.story.tsx b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demos.story.tsx index 904f10e7d1b..b61bf0b173d 100644 --- a/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Checkbox/Checkbox.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Checkbox' }; diff --git a/packages/@docs/demos/src/demos/core/Chip/Chip.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Chip/Chip.demo.configurator.tsx index aa0a69180d5..5c69e7ebc0b 100644 --- a/packages/@docs/demos/src/demos/core/Chip/Chip.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Chip/Chip.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Chip, ChipProps } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; function Wrapper(props: ChipProps) { return ( diff --git a/packages/@docs/demos/src/demos/core/Chip/Chip.demo.group.tsx b/packages/@docs/demos/src/demos/core/Chip/Chip.demo.group.tsx index 76080205dab..d255d8cbfd8 100644 --- a/packages/@docs/demos/src/demos/core/Chip/Chip.demo.group.tsx +++ b/packages/@docs/demos/src/demos/core/Chip/Chip.demo.group.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Chip, Group } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Chip } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Chip/Chip.demo.icon.tsx b/packages/@docs/demos/src/demos/core/Chip/Chip.demo.icon.tsx index 835ea0f84d3..ac7dd2c45b7 100644 --- a/packages/@docs/demos/src/demos/core/Chip/Chip.demo.icon.tsx +++ b/packages/@docs/demos/src/demos/core/Chip/Chip.demo.icon.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Chip, rem } from '@mantine/core'; import { IconX } from '@tabler/icons-react'; +import { Chip, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Chip, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Chip/Chip.demo.states.tsx b/packages/@docs/demos/src/demos/core/Chip/Chip.demo.states.tsx index 3131f9a5114..56adcae3b4b 100644 --- a/packages/@docs/demos/src/demos/core/Chip/Chip.demo.states.tsx +++ b/packages/@docs/demos/src/demos/core/Chip/Chip.demo.states.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Chip, Group } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; function Demo() { return ( diff --git a/packages/@docs/demos/src/demos/core/Chip/Chip.demo.tooltip.tsx b/packages/@docs/demos/src/demos/core/Chip/Chip.demo.tooltip.tsx index c063f93d952..3d2f6e09575 100644 --- a/packages/@docs/demos/src/demos/core/Chip/Chip.demo.tooltip.tsx +++ b/packages/@docs/demos/src/demos/core/Chip/Chip.demo.tooltip.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Chip, Tooltip } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Tooltip, Chip } from '@mantine/core'; const code = ` import { Tooltip, Chip } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Chip/Chip.demos.story.tsx b/packages/@docs/demos/src/demos/core/Chip/Chip.demos.story.tsx index fbc04a2225f..55b26fb9f6c 100644 --- a/packages/@docs/demos/src/demos/core/Chip/Chip.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Chip/Chip.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Chip' }; diff --git a/packages/@docs/demos/src/demos/core/CloseButton/CloseButton.demo.usage.tsx b/packages/@docs/demos/src/demos/core/CloseButton/CloseButton.demo.usage.tsx index 8815fc26f4d..25da4d6d241 100644 --- a/packages/@docs/demos/src/demos/core/CloseButton/CloseButton.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/CloseButton/CloseButton.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { CloseButton } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { CloseButton } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/CloseButton/CloseButton.demos.story.tsx b/packages/@docs/demos/src/demos/core/CloseButton/CloseButton.demos.story.tsx index 2d1d09ea5ea..5d62d322945 100644 --- a/packages/@docs/demos/src/demos/core/CloseButton/CloseButton.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/CloseButton/CloseButton.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'CloseButton' }; diff --git a/packages/@docs/demos/src/demos/core/Code/Code.demo.block.tsx b/packages/@docs/demos/src/demos/core/Code/Code.demo.block.tsx index 89a2e9bd3f0..a26f7cfe47c 100644 --- a/packages/@docs/demos/src/demos/core/Code/Code.demo.block.tsx +++ b/packages/@docs/demos/src/demos/core/Code/Code.demo.block.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Code } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Code } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Code/Code.demo.colors.tsx b/packages/@docs/demos/src/demos/core/Code/Code.demo.colors.tsx index 7cca7af6324..4452dea5afe 100644 --- a/packages/@docs/demos/src/demos/core/Code/Code.demo.colors.tsx +++ b/packages/@docs/demos/src/demos/core/Code/Code.demo.colors.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Code, Group } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Code, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Code/Code.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Code/Code.demo.usage.tsx index 8219c478da3..dec6b6ab019 100644 --- a/packages/@docs/demos/src/demos/core/Code/Code.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Code/Code.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Code } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Code } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Code/Code.demos.story.tsx b/packages/@docs/demos/src/demos/core/Code/Code.demos.story.tsx index 87c75c05793..31e6648c149 100644 --- a/packages/@docs/demos/src/demos/core/Code/Code.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Code/Code.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Code' }; diff --git a/packages/@docs/demos/src/demos/core/Collapse/Collapse.demo.nested.tsx b/packages/@docs/demos/src/demos/core/Collapse/Collapse.demo.nested.tsx index 140c69ef60b..9b6fe5e82a6 100644 --- a/packages/@docs/demos/src/demos/core/Collapse/Collapse.demo.nested.tsx +++ b/packages/@docs/demos/src/demos/core/Collapse/Collapse.demo.nested.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Box, Button, Collapse, CollapseProps, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Button, Text, Collapse, CollapseProps, Box } from '@mantine/core'; export function CollapsedDemo({ children, diff --git a/packages/@docs/demos/src/demos/core/Collapse/Collapse.demo.transition.tsx b/packages/@docs/demos/src/demos/core/Collapse/Collapse.demo.transition.tsx index 94e45b99b83..247d15b7949 100644 --- a/packages/@docs/demos/src/demos/core/Collapse/Collapse.demo.transition.tsx +++ b/packages/@docs/demos/src/demos/core/Collapse/Collapse.demo.transition.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { Box, Button, Collapse, Group, Text } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { Button, Group, Text, Collapse, Box } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useDisclosure } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/core/Collapse/Collapse.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Collapse/Collapse.demo.usage.tsx index dc69bc67440..0dc1afdbe74 100644 --- a/packages/@docs/demos/src/demos/core/Collapse/Collapse.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Collapse/Collapse.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { Box, Button, Collapse, Group, Text } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { Button, Group, Text, Collapse, Box } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button, Group, Text, Collapse, Box } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Collapse/Collapse.demos.story.tsx b/packages/@docs/demos/src/demos/core/Collapse/Collapse.demos.story.tsx index dc509124973..9f254e5404a 100644 --- a/packages/@docs/demos/src/demos/core/Collapse/Collapse.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Collapse/Collapse.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Collapse' }; diff --git a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.closeOnColorSwatchClick.tsx b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.closeOnColorSwatchClick.tsx index da4c73d77b8..1c3cd2a8dc5 100644 --- a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.closeOnColorSwatchClick.tsx +++ b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.closeOnColorSwatchClick.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorInput, DEFAULT_THEME } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ColorInput, DEFAULT_THEME } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.disabled.tsx index d5deeeb2006..378cdc14218 100644 --- a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ColorInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.disallowInput.tsx b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.disallowInput.tsx index e26e680f9bd..9499728cc8f 100644 --- a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.disallowInput.tsx +++ b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.disallowInput.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ColorInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.error.tsx b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.error.tsx index 4dfa120d4ab..23e660de5fb 100644 --- a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.error.tsx +++ b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.error.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ColorInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.eyeDropperIcon.tsx b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.eyeDropperIcon.tsx index 2628ea5ea94..c77469bd39f 100644 --- a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.eyeDropperIcon.tsx +++ b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.eyeDropperIcon.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { ColorInput, rem } from '@mantine/core'; import { IconFocus2 } from '@tabler/icons-react'; +import { ColorInput, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ColorInput, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.fixOnBlur.tsx b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.fixOnBlur.tsx index 9bf72120376..0f606feb649 100644 --- a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.fixOnBlur.tsx +++ b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.fixOnBlur.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ColorInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.formatsConfigurator.tsx b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.formatsConfigurator.tsx index 2825ed402f7..50d393c1248 100644 --- a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.formatsConfigurator.tsx +++ b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.formatsConfigurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorInput, ColorInputProps } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; function Wrapper(props: ColorInputProps) { return ( diff --git a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.noEyeDropper.tsx b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.noEyeDropper.tsx index c513461fbad..654322f2466 100644 --- a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.noEyeDropper.tsx +++ b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.noEyeDropper.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ColorInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.onChangeEnd.tsx b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.onChangeEnd.tsx index 4ce01bc4f42..084a853e84e 100644 --- a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.onChangeEnd.tsx +++ b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.onChangeEnd.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorInput, Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ColorInput, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.readOnly.tsx b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.readOnly.tsx index 2329a7cb5a1..e6d04eb098b 100644 --- a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.readOnly.tsx +++ b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.readOnly.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ColorInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.rightSection.tsx b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.rightSection.tsx index d9add424c60..d5be05c4493 100644 --- a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.rightSection.tsx +++ b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.rightSection.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; import { IconRefresh } from '@tabler/icons-react'; -import { MantineDemo } from '@mantinex/demo'; import { ActionIcon, ColorInput, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.sections.tsx b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.sections.tsx index 126a2d01a3a..cae0cc07355 100644 --- a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.sections.tsx +++ b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.sections.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { ColorInput, rem } from '@mantine/core'; import { IconColorPicker } from '@tabler/icons-react'; +import { ColorInput, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ColorInput, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.stylesApi.tsx index 91820c0436d..e1003ec17d5 100644 --- a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.stylesApi.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { ColorInputStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.swatches.tsx b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.swatches.tsx index 1c51c0779b3..23676d86cdb 100644 --- a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.swatches.tsx +++ b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.swatches.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorInput, DEFAULT_THEME } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ColorInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.swatchesOnly.tsx b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.swatchesOnly.tsx index ab288a360a5..195b5e40376 100644 --- a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.swatchesOnly.tsx +++ b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.swatchesOnly.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorInput, DEFAULT_THEME } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ColorInput, DEFAULT_THEME } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.usage.tsx b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.usage.tsx index 40e5f1da775..bb92d7f33b6 100644 --- a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { inputControls } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.withPicker.tsx b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.withPicker.tsx index 2f8fb39387c..617cdb3c617 100644 --- a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.withPicker.tsx +++ b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demo.withPicker.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ColorInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demos.story.tsx b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demos.story.tsx index a135afd1f49..961dce73497 100644 --- a/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/ColorInput/ColorInput.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'ColorInput' }; diff --git a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.alphaSlider.tsx b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.alphaSlider.tsx index b8dd2de65d8..d47ab71ebb4 100644 --- a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.alphaSlider.tsx +++ b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.alphaSlider.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { AlphaSlider, Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.formatsConfigurator.tsx b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.formatsConfigurator.tsx index 1fc3deea383..652172b3c79 100644 --- a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.formatsConfigurator.tsx +++ b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.formatsConfigurator.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { ColorPicker, ColorPickerProps, Stack, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Stack, Text, ColorPicker, ColorPickerProps } from '@mantine/core'; function Wrapper(props: ColorPickerProps) { const [value, onChange] = useState('#C5D899'); diff --git a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.fullWidth.tsx b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.fullWidth.tsx index aa800f56ae7..0e8dee4e485 100644 --- a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.fullWidth.tsx +++ b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.fullWidth.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorPicker } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ColorPicker } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.hueSlider.tsx b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.hueSlider.tsx index 041ddabe01c..15ff8fbb61d 100644 --- a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.hueSlider.tsx +++ b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.hueSlider.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { HueSlider, Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.sizeConfigurator.tsx b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.sizeConfigurator.tsx index 22057c1ff19..db45be9aaed 100644 --- a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.sizeConfigurator.tsx +++ b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.sizeConfigurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { ColorPicker, ColorPickerProps, DEFAULT_THEME } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { DEFAULT_THEME, ColorPicker, ColorPickerProps } from '@mantine/core'; function Wrapper(props: ColorPickerProps) { return ( diff --git a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.stylesApi.tsx index 4eba613b02d..4e340dec6c8 100644 --- a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.stylesApi.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorPicker } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { ColorPickerStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.swatches.tsx b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.swatches.tsx index 9b433f4f51d..408cd87e5ac 100644 --- a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.swatches.tsx +++ b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.swatches.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { ColorPicker, DEFAULT_THEME, Stack } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { DEFAULT_THEME, Stack, ColorPicker } from '@mantine/core'; const code = ` import { ColorPicker } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.swatchesConfigurator.tsx b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.swatchesConfigurator.tsx index e11b7221a12..f466d92a055 100644 --- a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.swatchesConfigurator.tsx +++ b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.swatchesConfigurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { ColorPicker, ColorPickerProps, DEFAULT_THEME } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { DEFAULT_THEME, ColorPicker, ColorPickerProps } from '@mantine/core'; function Wrapper(props: ColorPickerProps) { return ( diff --git a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.swatchesOnly.tsx b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.swatchesOnly.tsx index a9646a56888..11773ef6e1c 100644 --- a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.swatchesOnly.tsx +++ b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.swatchesOnly.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { ColorPicker, DEFAULT_THEME, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { DEFAULT_THEME, Text, ColorPicker } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.usage.tsx b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.usage.tsx index 8c9f0b83c60..e4b07e21d30 100644 --- a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demo.usage.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorPicker, Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demos.story.tsx b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demos.story.tsx index 162faa01c41..1fba0ba2a35 100644 --- a/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/ColorPicker/ColorPicker.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'ColorPicker' }; diff --git a/packages/@docs/demos/src/demos/core/ColorSwatch/ColorSwatch.demo.component.tsx b/packages/@docs/demos/src/demos/core/ColorSwatch/ColorSwatch.demo.component.tsx index 54207a51f21..4389836a696 100644 --- a/packages/@docs/demos/src/demos/core/ColorSwatch/ColorSwatch.demo.component.tsx +++ b/packages/@docs/demos/src/demos/core/ColorSwatch/ColorSwatch.demo.component.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { CheckIcon, ColorSwatch, rem } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { ColorSwatch, CheckIcon, rem } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/ColorSwatch/ColorSwatch.demo.shadow.tsx b/packages/@docs/demos/src/demos/core/ColorSwatch/ColorSwatch.demo.shadow.tsx index 15fdec16c6a..af6bf7d225a 100644 --- a/packages/@docs/demos/src/demos/core/ColorSwatch/ColorSwatch.demo.shadow.tsx +++ b/packages/@docs/demos/src/demos/core/ColorSwatch/ColorSwatch.demo.shadow.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorSwatch } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ColorSwatch } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ColorSwatch/ColorSwatch.demo.usage.tsx b/packages/@docs/demos/src/demos/core/ColorSwatch/ColorSwatch.demo.usage.tsx index ac6d8113fcd..0d88f19c75c 100644 --- a/packages/@docs/demos/src/demos/core/ColorSwatch/ColorSwatch.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/ColorSwatch/ColorSwatch.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { ColorSwatch, Group } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ColorSwatch, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/ColorSwatch/ColorSwatch.demos.story.tsx b/packages/@docs/demos/src/demos/core/ColorSwatch/ColorSwatch.demos.story.tsx index c9b40762744..5b07667e5cf 100644 --- a/packages/@docs/demos/src/demos/core/ColorSwatch/ColorSwatch.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/ColorSwatch/ColorSwatch.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'ColorSwatch' }; diff --git a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.activeOption.tsx b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.activeOption.tsx index d211c929367..43ce134a653 100644 --- a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.activeOption.tsx +++ b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.activeOption.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { CheckIcon, Combobox, Group, Input, InputBase, useCombobox } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Input, InputBase, Combobox, useCombobox, CheckIcon, Group } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.autocomplete.tsx b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.autocomplete.tsx index b6d9ef36098..2fe538bae81 100644 --- a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.autocomplete.tsx +++ b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.autocomplete.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Combobox, TextInput, useCombobox } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.button.tsx b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.button.tsx index 802cfaeb096..c8ce0d6393f 100644 --- a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.button.tsx +++ b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.button.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Box, Button, Combobox, Text, useCombobox } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Button, Combobox, useCombobox, Text, Box } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.buttonSearch.tsx b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.buttonSearch.tsx index 7a67eb80a1d..687ea044c63 100644 --- a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.buttonSearch.tsx +++ b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.buttonSearch.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Box, Button, Combobox, Text, useCombobox } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Button, Combobox, useCombobox, Text, Box } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.controlledDropdown.tsx b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.controlledDropdown.tsx index 335c04fffc0..c4998951139 100644 --- a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.controlledDropdown.tsx +++ b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.controlledDropdown.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Button, Combobox, TextInput, useCombobox } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { TextInput, Button, Combobox, useCombobox } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.groups.tsx b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.groups.tsx index 84fb759f066..360b17e40a3 100644 --- a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.groups.tsx +++ b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.groups.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Combobox, Input, InputBase, useCombobox } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Input, InputBase, Combobox, useCombobox } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.hiddenDropdown.tsx b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.hiddenDropdown.tsx index 66151b14741..c784c17deb3 100644 --- a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.hiddenDropdown.tsx +++ b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.hiddenDropdown.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Combobox, TextInput, useCombobox } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.multiselect.tsx b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.multiselect.tsx index b5d4061c6aa..f0d8c7ebaff 100644 --- a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.multiselect.tsx +++ b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.multiselect.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { CheckIcon, Combobox, Group, Input, Pill, PillsInput, useCombobox } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { PillsInput, Pill, Input, Combobox, CheckIcon, Group, useCombobox } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.nativeScroll.tsx b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.nativeScroll.tsx index b1917a4527a..ae0ed6ec187 100644 --- a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.nativeScroll.tsx +++ b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.nativeScroll.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Combobox, Input, InputBase, useCombobox } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Input, InputBase, Combobox, useCombobox } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.noDropdown.tsx b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.noDropdown.tsx index a6ea6a198f8..378bc5db7ed 100644 --- a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.noDropdown.tsx +++ b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.noDropdown.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Combobox, TextInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.scrollArea.tsx b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.scrollArea.tsx index 7180f9d771c..a695ebd82aa 100644 --- a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.scrollArea.tsx +++ b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.scrollArea.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Combobox, Input, InputBase, ScrollArea, useCombobox } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Input, InputBase, Combobox, useCombobox, ScrollArea } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.searchableMultiselect.tsx b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.searchableMultiselect.tsx index 293ac9477e0..25f2f192225 100644 --- a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.searchableMultiselect.tsx +++ b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.searchableMultiselect.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { CheckIcon, Combobox, Group, Pill, PillsInput, useCombobox } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { PillsInput, Pill, Combobox, CheckIcon, Group, useCombobox } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.searchableSelect.tsx b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.searchableSelect.tsx index c397a72fe7a..e9f8d93826c 100644 --- a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.searchableSelect.tsx +++ b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.searchableSelect.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Combobox, InputBase, useCombobox } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { InputBase, Combobox, useCombobox } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.select.tsx b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.select.tsx index 8a358310364..5bb16451335 100644 --- a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.select.tsx +++ b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.select.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Combobox, Input, InputBase, useCombobox } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Input, InputBase, Combobox, useCombobox } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.selectFirstOption.tsx b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.selectFirstOption.tsx index ff696a64cd3..a7cf9864d97 100644 --- a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.selectFirstOption.tsx +++ b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.selectFirstOption.tsx @@ -1,6 +1,6 @@ import React, { useEffect, useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Combobox, TextInput, useCombobox } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState, useEffect } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.stylesApi.tsx index 29e0deb0131..ff3339fd09b 100644 --- a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demo.stylesApi.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Combobox, TextInput, useCombobox } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { ComboboxStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demos.story.tsx b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demos.story.tsx index f192acd9afc..57c56304d48 100644 --- a/packages/@docs/demos/src/demos/core/Combobox/Combobox.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Combobox/Combobox.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Combobox' }; diff --git a/packages/@docs/demos/src/demos/core/Container/Container.demo.fluid.tsx b/packages/@docs/demos/src/demos/core/Container/Container.demo.fluid.tsx index e47bdc69cc4..97f1a186e38 100644 --- a/packages/@docs/demos/src/demos/core/Container/Container.demo.fluid.tsx +++ b/packages/@docs/demos/src/demos/core/Container/Container.demo.fluid.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Container } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Container } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Container/Container.demo.responsive.tsx b/packages/@docs/demos/src/demos/core/Container/Container.demo.responsive.tsx index 07c2fb65932..e86a3a603d7 100644 --- a/packages/@docs/demos/src/demos/core/Container/Container.demo.responsive.tsx +++ b/packages/@docs/demos/src/demos/core/Container/Container.demo.responsive.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import cx from 'clsx'; -import { MantineThemeProvider, Container, createTheme } from '@mantine/core'; +import { Container, createTheme, MantineThemeProvider } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import classes from './Container.demo.responsive.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Container/Container.demo.sizes.tsx b/packages/@docs/demos/src/demos/core/Container/Container.demo.sizes.tsx index c48b25b0c07..37042e1a93d 100644 --- a/packages/@docs/demos/src/demos/core/Container/Container.demo.sizes.tsx +++ b/packages/@docs/demos/src/demos/core/Container/Container.demo.sizes.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Container, createTheme, MantineThemeProvider, rem } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Container, MantineThemeProvider, createTheme, rem } from '@mantine/core'; const code = ` import { Container, MantineProvider, createTheme, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Container/Container.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Container/Container.demo.usage.tsx index d6a2e118baa..b6c9ff28272 100644 --- a/packages/@docs/demos/src/demos/core/Container/Container.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Container/Container.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Container } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Container } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Container/Container.demos.story.tsx b/packages/@docs/demos/src/demos/core/Container/Container.demos.story.tsx index 5c82892e31b..fe51bc9d526 100644 --- a/packages/@docs/demos/src/demos/core/Container/Container.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Container/Container.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Container' }; diff --git a/packages/@docs/demos/src/demos/core/CopyButton/CopyButton.demo.timeout.tsx b/packages/@docs/demos/src/demos/core/CopyButton/CopyButton.demo.timeout.tsx index 2d4c668e4eb..9846878ce8d 100644 --- a/packages/@docs/demos/src/demos/core/CopyButton/CopyButton.demo.timeout.tsx +++ b/packages/@docs/demos/src/demos/core/CopyButton/CopyButton.demo.timeout.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { IconCheck, IconCopy } from '@tabler/icons-react'; +import { ActionIcon, CopyButton, rem, Tooltip } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { CopyButton, ActionIcon, Tooltip, rem } from '@mantine/core'; -import { IconCopy, IconCheck } from '@tabler/icons-react'; const code = ` import { CopyButton, ActionIcon, Tooltip, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/CopyButton/CopyButton.demo.usage.tsx b/packages/@docs/demos/src/demos/core/CopyButton/CopyButton.demo.usage.tsx index 3cdd7dd3b5b..0375b112a1b 100644 --- a/packages/@docs/demos/src/demos/core/CopyButton/CopyButton.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/CopyButton/CopyButton.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, CopyButton } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { CopyButton, Button } from '@mantine/core'; const code = ` import { CopyButton, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/CopyButton/CopyButton.demos.story.tsx b/packages/@docs/demos/src/demos/core/CopyButton/CopyButton.demos.story.tsx index 4b2d1718c16..b2e44a1a138 100644 --- a/packages/@docs/demos/src/demos/core/CopyButton/CopyButton.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/CopyButton/CopyButton.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'CopyButton' }; diff --git a/packages/@docs/demos/src/demos/core/Dialog/Dialog.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Dialog/Dialog.demo.usage.tsx index 6eec9926287..a022c12706b 100644 --- a/packages/@docs/demos/src/demos/core/Dialog/Dialog.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Dialog/Dialog.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Dialog, Group, Button, TextInput, Text } from '@mantine/core'; +import { Button, Dialog, Group, Text, TextInput } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useDisclosure } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/core/Dialog/Dialog.demos.story.tsx b/packages/@docs/demos/src/demos/core/Dialog/Dialog.demos.story.tsx index d6d45a06213..7f697d424a5 100644 --- a/packages/@docs/demos/src/demos/core/Dialog/Dialog.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Dialog/Dialog.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Dialog' }; diff --git a/packages/@docs/demos/src/demos/core/Divider/Divider.demo.labels.tsx b/packages/@docs/demos/src/demos/core/Divider/Divider.demo.labels.tsx index 6706be6020d..994b4e85180 100644 --- a/packages/@docs/demos/src/demos/core/Divider/Divider.demo.labels.tsx +++ b/packages/@docs/demos/src/demos/core/Divider/Divider.demo.labels.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { IconSearch } from '@tabler/icons-react'; +import { Anchor, Box, Divider } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Divider, Box, Anchor } from '@mantine/core'; const code = ` import { Divider, Box, Anchor } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Divider/Divider.demo.orientation.tsx b/packages/@docs/demos/src/demos/core/Divider/Divider.demo.orientation.tsx index 476c25f69d3..205cb95c1f0 100644 --- a/packages/@docs/demos/src/demos/core/Divider/Divider.demo.orientation.tsx +++ b/packages/@docs/demos/src/demos/core/Divider/Divider.demo.orientation.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Divider, Group, Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Divider, Group, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Divider/Divider.demo.sizes.tsx b/packages/@docs/demos/src/demos/core/Divider/Divider.demo.sizes.tsx index 270f913e58c..605aa1bd308 100644 --- a/packages/@docs/demos/src/demos/core/Divider/Divider.demo.sizes.tsx +++ b/packages/@docs/demos/src/demos/core/Divider/Divider.demo.sizes.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Divider } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Divider } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Divider/Divider.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Divider/Divider.demo.usage.tsx index 63207c60cd6..00efa70d368 100644 --- a/packages/@docs/demos/src/demos/core/Divider/Divider.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Divider/Divider.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Divider, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Text, Divider } from '@mantine/core'; const code = ` import { Text, Divider } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Divider/Divider.demo.variants.tsx b/packages/@docs/demos/src/demos/core/Divider/Divider.demo.variants.tsx index 8ef810c7863..55489fa0e77 100644 --- a/packages/@docs/demos/src/demos/core/Divider/Divider.demo.variants.tsx +++ b/packages/@docs/demos/src/demos/core/Divider/Divider.demo.variants.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Divider } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Divider } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Divider/Divider.demos.story.tsx b/packages/@docs/demos/src/demos/core/Divider/Divider.demos.story.tsx index 5c78be44b3f..2e473cb0407 100644 --- a/packages/@docs/demos/src/demos/core/Divider/Divider.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Divider/Divider.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Divider' }; diff --git a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.composition.tsx b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.composition.tsx index 1be879d34c0..dfe1783b438 100644 --- a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.composition.tsx +++ b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.composition.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Drawer, Button } from '@mantine/core'; +import { Button, Drawer } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; diff --git a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.header.tsx b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.header.tsx index 7cb49529646..c37dd8d4323 100644 --- a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.header.tsx +++ b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.header.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { Button, Drawer } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { Drawer, Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useDisclosure } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.initialFocus.tsx b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.initialFocus.tsx index 64c1aa01ff5..d5e7a1a97c9 100644 --- a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.initialFocus.tsx +++ b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.initialFocus.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Drawer, Button, TextInput } from '@mantine/core'; +import { Button, Drawer, TextInput } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; diff --git a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.offset.tsx b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.offset.tsx index ab1956e9f8a..aa8b8d50246 100644 --- a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.offset.tsx +++ b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.offset.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { Drawer, Button } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Button, Drawer } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; import { AuthenticationForm } from '../../../shared/AuthenticationForm/AuthenticationForm'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.overflow.tsx b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.overflow.tsx index 136662d3526..1ee6b98fe62 100644 --- a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.overflow.tsx +++ b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.overflow.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Drawer } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { Drawer, Button } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.overlay.tsx b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.overlay.tsx index bf05373bbcf..8578655ee20 100644 --- a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.overlay.tsx +++ b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.overlay.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { Drawer, Button } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Button, Drawer } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; import { AuthenticationForm } from '../../../shared/AuthenticationForm/AuthenticationForm'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.positions.tsx b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.positions.tsx index 2924b1492f1..b3b751e6bfa 100644 --- a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.positions.tsx +++ b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.positions.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Button, Drawer, Group } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Drawer, Button, Group } from '@mantine/core'; function Demo() { const [opened, setOpened] = useState(false); diff --git a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.scrollarea.tsx b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.scrollarea.tsx index 1485d3ff95c..5aecf13ae82 100644 --- a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.scrollarea.tsx +++ b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.scrollarea.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Drawer, ScrollArea } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { Drawer, Button, ScrollArea } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.sizes.tsx b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.sizes.tsx index ac97ca4c959..67e3fdb8099 100644 --- a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.sizes.tsx +++ b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.sizes.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Button, Drawer, Group } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Drawer, Button, Group } from '@mantine/core'; function Demo() { const [opened, setOpened] = useState(false); diff --git a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.transitions.tsx b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.transitions.tsx index b9ae5f30c0f..1c2101e8983 100644 --- a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.transitions.tsx +++ b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.transitions.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { Drawer, Button } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Button, Drawer } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; import { AuthenticationForm } from '../../../shared/AuthenticationForm/AuthenticationForm'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.usage.tsx index b2fa9d1af70..b23bb192724 100644 --- a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { Drawer, Button } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Button, Drawer } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; import { AuthenticationForm } from '../../../shared/AuthenticationForm/AuthenticationForm'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demos.story.tsx b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demos.story.tsx index e124434f8db..1816b0063a8 100644 --- a/packages/@docs/demos/src/demos/core/Drawer/Drawer.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Drawer/Drawer.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Drawer' }; diff --git a/packages/@docs/demos/src/demos/core/Fieldset/Fieldset.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/Fieldset/Fieldset.demo.disabled.tsx index 8f264b5afbe..4340360ff64 100644 --- a/packages/@docs/demos/src/demos/core/Fieldset/Fieldset.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/Fieldset/Fieldset.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Fieldset, Group, TextInput } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Fieldset, TextInput, Button, Group } from '@mantine/core'; const code = ` import { Fieldset, TextInput, Button, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Fieldset/Fieldset.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Fieldset/Fieldset.demo.usage.tsx index 5adef420fec..90dc6a8a086 100644 --- a/packages/@docs/demos/src/demos/core/Fieldset/Fieldset.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Fieldset/Fieldset.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Fieldset, TextInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Fieldset } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Fieldset/Fieldset.demos.story.tsx b/packages/@docs/demos/src/demos/core/Fieldset/Fieldset.demos.story.tsx index d0d2cdfe780..c217528fd98 100644 --- a/packages/@docs/demos/src/demos/core/Fieldset/Fieldset.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Fieldset/Fieldset.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Fieldset' }; diff --git a/packages/@docs/demos/src/demos/core/FileButton/FileButton.demo.multiple.tsx b/packages/@docs/demos/src/demos/core/FileButton/FileButton.demo.multiple.tsx index b986d949c21..3846bcb8f07 100644 --- a/packages/@docs/demos/src/demos/core/FileButton/FileButton.demo.multiple.tsx +++ b/packages/@docs/demos/src/demos/core/FileButton/FileButton.demo.multiple.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Button, FileButton, Group, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { FileButton, Button, Group, Text } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/FileButton/FileButton.demo.reset.tsx b/packages/@docs/demos/src/demos/core/FileButton/FileButton.demo.reset.tsx index e081c44be32..5bd26a7da59 100644 --- a/packages/@docs/demos/src/demos/core/FileButton/FileButton.demo.reset.tsx +++ b/packages/@docs/demos/src/demos/core/FileButton/FileButton.demo.reset.tsx @@ -1,8 +1,7 @@ -import React, { useState, useRef } from 'react'; +import React, { useRef, useState } from 'react'; +import { Button, FileButton, Group, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { FileButton, Button, Group, Text } from '@mantine/core'; - const code = ` import { useState, useRef } from 'react'; import { FileButton, Button, Group, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/FileButton/FileButton.demo.usage.tsx b/packages/@docs/demos/src/demos/core/FileButton/FileButton.demo.usage.tsx index b726b6426f3..f865c2de165 100644 --- a/packages/@docs/demos/src/demos/core/FileButton/FileButton.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/FileButton/FileButton.demo.usage.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Button, FileButton, Group, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { FileButton, Button, Group, Text } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/FileButton/FileButton.demos.story.tsx b/packages/@docs/demos/src/demos/core/FileButton/FileButton.demos.story.tsx index 29cce200fe9..04717935d07 100644 --- a/packages/@docs/demos/src/demos/core/FileButton/FileButton.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/FileButton/FileButton.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'FileButton' }; diff --git a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.accept.tsx b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.accept.tsx index d68c0350a23..e5476aa5594 100644 --- a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.accept.tsx +++ b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.accept.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { FileInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { FileInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.clearable.tsx b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.clearable.tsx index 0f994fbc4f1..806a7f36ab1 100644 --- a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.clearable.tsx +++ b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.clearable.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { FileInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { FileInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.disabled.tsx index 351d8a9dedb..b83d003087b 100644 --- a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { FileInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { FileInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.error.tsx b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.error.tsx index ee2ab25f596..41f6f198ed8 100644 --- a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.error.tsx +++ b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.error.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { FileInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { FileInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.multiple.tsx b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.multiple.tsx index 759a15683bd..b69464156a8 100644 --- a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.multiple.tsx +++ b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.multiple.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { FileInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { FileInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.sections.tsx b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.sections.tsx index 55b06a400f4..58254df17c5 100644 --- a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.sections.tsx +++ b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.sections.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { FileInput, rem } from '@mantine/core'; import { IconFileCv } from '@tabler/icons-react'; +import { FileInput, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { FileInput, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.stylesApi.tsx index a9bb3deab7e..490a98576fb 100644 --- a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.stylesApi.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { FileInput, rem } from '@mantine/core'; import { IconAt } from '@tabler/icons-react'; +import { FileInput, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { FileInputStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.usage.tsx b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.usage.tsx index 7c53de212df..99738a87505 100644 --- a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { FileInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { inputControls } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.valueComponent.tsx b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.valueComponent.tsx index 369ce563b73..08e730b2666 100644 --- a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.valueComponent.tsx +++ b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demo.valueComponent.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { FileInput, FileInputProps, Pill } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { FileInput, FileInputProps, Pill } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demos.story.tsx b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demos.story.tsx index fdffab49332..d7386fcd7a6 100644 --- a/packages/@docs/demos/src/demos/core/FileInput/FileInput.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/FileInput/FileInput.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'FileInput' }; diff --git a/packages/@docs/demos/src/demos/core/Flex/Flex.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Flex/Flex.demo.configurator.tsx index 30cac074f06..f876f39885d 100644 --- a/packages/@docs/demos/src/demos/core/Flex/Flex.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Flex/Flex.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Flex, FlexProps } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { FlexProps, Button, Flex } from '@mantine/core'; function Wrapper(props: FlexProps) { return ( diff --git a/packages/@docs/demos/src/demos/core/Flex/Flex.demo.responsive.tsx b/packages/@docs/demos/src/demos/core/Flex/Flex.demo.responsive.tsx index c4cd8a04c45..513599ba4b1 100644 --- a/packages/@docs/demos/src/demos/core/Flex/Flex.demo.responsive.tsx +++ b/packages/@docs/demos/src/demos/core/Flex/Flex.demo.responsive.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Flex } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Flex, Button } from '@mantine/core'; const code = ` import { Flex, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Flex/Flex.demos.story.tsx b/packages/@docs/demos/src/demos/core/Flex/Flex.demos.story.tsx index 3300bab8d88..6a15e37dd60 100644 --- a/packages/@docs/demos/src/demos/core/Flex/Flex.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Flex/Flex.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Flex' }; diff --git a/packages/@docs/demos/src/demos/core/FocusTrap/FocusTrap.demo.initial.tsx b/packages/@docs/demos/src/demos/core/FocusTrap/FocusTrap.demo.initial.tsx index 3f73be7bae1..afa52331c50 100644 --- a/packages/@docs/demos/src/demos/core/FocusTrap/FocusTrap.demo.initial.tsx +++ b/packages/@docs/demos/src/demos/core/FocusTrap/FocusTrap.demo.initial.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Box, Button, FocusTrap, TextInput } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { FocusTrap, TextInput, Button, Box } from '@mantine/core'; const code = ` import { useDisclosure } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/core/FocusTrap/FocusTrap.demo.usage.tsx b/packages/@docs/demos/src/demos/core/FocusTrap/FocusTrap.demo.usage.tsx index 30857d68a19..9074970fefb 100644 --- a/packages/@docs/demos/src/demos/core/FocusTrap/FocusTrap.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/FocusTrap/FocusTrap.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Box, Button, FocusTrap, TextInput } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { FocusTrap, TextInput, Button, Box } from '@mantine/core'; const code = ` import { useDisclosure } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/core/FocusTrap/FocusTrap.demos.story.tsx b/packages/@docs/demos/src/demos/core/FocusTrap/FocusTrap.demos.story.tsx index afe55601ee1..290175ccb69 100644 --- a/packages/@docs/demos/src/demos/core/FocusTrap/FocusTrap.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/FocusTrap/FocusTrap.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'FocusTrap' }; diff --git a/packages/@docs/demos/src/demos/core/Grid/Grid.demos.story.tsx b/packages/@docs/demos/src/demos/core/Grid/Grid.demos.story.tsx index 64941b040c8..aa7dbe4cca9 100644 --- a/packages/@docs/demos/src/demos/core/Grid/Grid.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Grid/Grid.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Grid' }; diff --git a/packages/@docs/demos/src/demos/core/Group/Group.demo.preventGrowOverflow.tsx b/packages/@docs/demos/src/demos/core/Group/Group.demo.preventGrowOverflow.tsx index 8409f2a5b17..6eb21d1400f 100644 --- a/packages/@docs/demos/src/demos/core/Group/Group.demo.preventGrowOverflow.tsx +++ b/packages/@docs/demos/src/demos/core/Group/Group.demo.preventGrowOverflow.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Box, Button, Group, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Group, Button, Box, Text } from '@mantine/core'; const code = ` import { Group, Button, Box, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Group/Group.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Group/Group.demo.usage.tsx index a5b8f60da28..5cf4e293448 100644 --- a/packages/@docs/demos/src/demos/core/Group/Group.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Group/Group.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Group } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Group, Button } from '@mantine/core'; const code = ` import { Group, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Group/Group.demos.story.tsx b/packages/@docs/demos/src/demos/core/Group/Group.demos.story.tsx index fa20ce79c06..38dbd6526f7 100644 --- a/packages/@docs/demos/src/demos/core/Group/Group.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Group/Group.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Group' }; diff --git a/packages/@docs/demos/src/demos/core/Highlight/Highlight.demo.multiple.tsx b/packages/@docs/demos/src/demos/core/Highlight/Highlight.demo.multiple.tsx index 77fd2b6639d..075f7a84cf7 100644 --- a/packages/@docs/demos/src/demos/core/Highlight/Highlight.demo.multiple.tsx +++ b/packages/@docs/demos/src/demos/core/Highlight/Highlight.demo.multiple.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Highlight } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Highlight } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Highlight/Highlight.demo.props.tsx b/packages/@docs/demos/src/demos/core/Highlight/Highlight.demo.props.tsx index 2b48faf6ff7..e2c1bfac64a 100644 --- a/packages/@docs/demos/src/demos/core/Highlight/Highlight.demo.props.tsx +++ b/packages/@docs/demos/src/demos/core/Highlight/Highlight.demo.props.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Highlight } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Highlight } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Highlight/Highlight.demo.styles.tsx b/packages/@docs/demos/src/demos/core/Highlight/Highlight.demo.styles.tsx index 3e90739983c..e20c42f5ae3 100644 --- a/packages/@docs/demos/src/demos/core/Highlight/Highlight.demo.styles.tsx +++ b/packages/@docs/demos/src/demos/core/Highlight/Highlight.demo.styles.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Highlight } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Highlight } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Highlight/Highlight.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Highlight/Highlight.demo.usage.tsx index 361d850ae50..7609fef0f3b 100644 --- a/packages/@docs/demos/src/demos/core/Highlight/Highlight.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Highlight/Highlight.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Highlight, HighlightProps } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; function Wrapper(props: HighlightProps) { return ; diff --git a/packages/@docs/demos/src/demos/core/Highlight/Highlight.demos.story.tsx b/packages/@docs/demos/src/demos/core/Highlight/Highlight.demos.story.tsx index 7ae7ee46215..e15fad52ae4 100644 --- a/packages/@docs/demos/src/demos/core/Highlight/Highlight.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Highlight/Highlight.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Highlight' }; diff --git a/packages/@docs/demos/src/demos/core/HoverCard/HoverCard.demo.delay.tsx b/packages/@docs/demos/src/demos/core/HoverCard/HoverCard.demo.delay.tsx index 8eabbb08cff..ab29ee4c813 100644 --- a/packages/@docs/demos/src/demos/core/HoverCard/HoverCard.demo.delay.tsx +++ b/packages/@docs/demos/src/demos/core/HoverCard/HoverCard.demo.delay.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Group, HoverCard, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { HoverCard, Button, Text, Group } from '@mantine/core'; const code = ` import { HoverCard, Button, Text, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/HoverCard/HoverCard.demo.profile.tsx b/packages/@docs/demos/src/demos/core/HoverCard/HoverCard.demo.profile.tsx index 3774feb86b5..a7bfb3d62a1 100644 --- a/packages/@docs/demos/src/demos/core/HoverCard/HoverCard.demo.profile.tsx +++ b/packages/@docs/demos/src/demos/core/HoverCard/HoverCard.demo.profile.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Anchor, Avatar, Group, HoverCard, Stack, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { HoverCard, Avatar, Text, Group, Anchor, Stack } from '@mantine/core'; const code = ` import { HoverCard, Avatar, Text, Group, Anchor, Stack } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/HoverCard/HoverCard.demo.usage.tsx b/packages/@docs/demos/src/demos/core/HoverCard/HoverCard.demo.usage.tsx index fe2838e9dbc..714b3bd7bf8 100644 --- a/packages/@docs/demos/src/demos/core/HoverCard/HoverCard.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/HoverCard/HoverCard.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Group, HoverCard, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { HoverCard, Button, Text, Group } from '@mantine/core'; const code = ` import { HoverCard, Button, Text, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/HoverCard/HoverCard.demos.story.tsx b/packages/@docs/demos/src/demos/core/HoverCard/HoverCard.demos.story.tsx index 310ab53705c..5ea564801e4 100644 --- a/packages/@docs/demos/src/demos/core/HoverCard/HoverCard.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/HoverCard/HoverCard.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'HoverCard' }; diff --git a/packages/@docs/demos/src/demos/core/Image/Image.demo.contain.tsx b/packages/@docs/demos/src/demos/core/Image/Image.demo.contain.tsx index 5ff952b4798..57ad4d090bb 100644 --- a/packages/@docs/demos/src/demos/core/Image/Image.demo.contain.tsx +++ b/packages/@docs/demos/src/demos/core/Image/Image.demo.contain.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Image } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Image } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Image/Image.demo.fallback.tsx b/packages/@docs/demos/src/demos/core/Image/Image.demo.fallback.tsx index f0dd87b5ac1..0bf5871af7c 100644 --- a/packages/@docs/demos/src/demos/core/Image/Image.demo.fallback.tsx +++ b/packages/@docs/demos/src/demos/core/Image/Image.demo.fallback.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Image } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Image } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Image/Image.demo.height.tsx b/packages/@docs/demos/src/demos/core/Image/Image.demo.height.tsx index bf8c4c23428..f173bd5d8bc 100644 --- a/packages/@docs/demos/src/demos/core/Image/Image.demo.height.tsx +++ b/packages/@docs/demos/src/demos/core/Image/Image.demo.height.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Image } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Image } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Image/Image.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Image/Image.demo.usage.tsx index 9145e82aa38..0c164621aa0 100644 --- a/packages/@docs/demos/src/demos/core/Image/Image.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Image/Image.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Image } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Image } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Image/Image.demos.story.tsx b/packages/@docs/demos/src/demos/core/Image/Image.demos.story.tsx index 3274eb0deee..17f31f79114 100644 --- a/packages/@docs/demos/src/demos/core/Image/Image.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Image/Image.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Image' }; diff --git a/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.configurator.tsx index 12ff9e9ab70..667f08d5191 100644 --- a/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Avatar, Indicator, IndicatorProps } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Indicator, IndicatorProps, Avatar } from '@mantine/core'; function Demo(props: IndicatorProps) { return ( diff --git a/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.disabled.tsx index bc620ab4298..5cea7f47b5c 100644 --- a/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.disabled.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { Avatar, Button, Indicator, Stack } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { Avatar, Indicator, Button, Stack } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useDisclosure } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.inline.tsx b/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.inline.tsx index fc1885612eb..c1862416341 100644 --- a/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.inline.tsx +++ b/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.inline.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Avatar, Indicator } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Avatar, Indicator } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.offset.tsx b/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.offset.tsx index 0e6f314844b..df4f4c35710 100644 --- a/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.offset.tsx +++ b/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.offset.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Avatar, Indicator } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Avatar, Indicator } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.processing.tsx b/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.processing.tsx index bee5ffebbf7..023e46eb49a 100644 --- a/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.processing.tsx +++ b/packages/@docs/demos/src/demos/core/Indicator/Indicator.demo.processing.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Avatar, Indicator } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Avatar, Indicator } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Indicator/Indicator.demos.story.tsx b/packages/@docs/demos/src/demos/core/Indicator/Indicator.demos.story.tsx index c1409a68575..2c45d8a30cc 100644 --- a/packages/@docs/demos/src/demos/core/Indicator/Indicator.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Indicator/Indicator.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Indicator' }; diff --git a/packages/@docs/demos/src/demos/core/Input/Input.demo.component.tsx b/packages/@docs/demos/src/demos/core/Input/Input.demo.component.tsx index 020d1fbe188..bb1986306df 100644 --- a/packages/@docs/demos/src/demos/core/Input/Input.demo.component.tsx +++ b/packages/@docs/demos/src/demos/core/Input/Input.demo.component.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Input } from '@mantine/core'; import { IconChevronDown } from '@tabler/icons-react'; +import { Input } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Input } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Input/Input.demo.compound.tsx b/packages/@docs/demos/src/demos/core/Input/Input.demo.compound.tsx index 40630926c30..969c772f4d4 100644 --- a/packages/@docs/demos/src/demos/core/Input/Input.demo.compound.tsx +++ b/packages/@docs/demos/src/demos/core/Input/Input.demo.compound.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Input } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Input } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Input/Input.demo.defaultProps.tsx b/packages/@docs/demos/src/demos/core/Input/Input.demo.defaultProps.tsx index 60f9e08ade0..e11b90b2aa4 100644 --- a/packages/@docs/demos/src/demos/core/Input/Input.demo.defaultProps.tsx +++ b/packages/@docs/demos/src/demos/core/Input/Input.demo.defaultProps.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { createTheme, Input, MantineThemeProvider, NativeSelect, TextInput } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { TextInput, NativeSelect, MantineThemeProvider, createTheme, Input } from '@mantine/core'; const code = ` import { TextInput, NativeSelect, MantineProvider, createTheme, Input } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Input/Input.demo.error.tsx b/packages/@docs/demos/src/demos/core/Input/Input.demo.error.tsx index a6345069938..0af876d2a38 100644 --- a/packages/@docs/demos/src/demos/core/Input/Input.demo.error.tsx +++ b/packages/@docs/demos/src/demos/core/Input/Input.demo.error.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { TextInput, rem } from '@mantine/core'; import { IconExclamationCircle } from '@tabler/icons-react'; +import { rem, TextInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TextInput, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Input/Input.demo.focusStyles.tsx b/packages/@docs/demos/src/demos/core/Input/Input.demo.focusStyles.tsx index 6ea963447c6..86728805cf5 100644 --- a/packages/@docs/demos/src/demos/core/Input/Input.demo.focusStyles.tsx +++ b/packages/@docs/demos/src/demos/core/Input/Input.demo.focusStyles.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Input, TextInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import classes from './Input.demo.focusStyles.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Input/Input.demo.inputBase.tsx b/packages/@docs/demos/src/demos/core/Input/Input.demo.inputBase.tsx index 4895ac6f0a9..259bf8dd57c 100644 --- a/packages/@docs/demos/src/demos/core/Input/Input.demo.inputBase.tsx +++ b/packages/@docs/demos/src/demos/core/Input/Input.demo.inputBase.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { InputBase } from '@mantine/core'; import { IMaskInput } from 'react-imask'; +import { InputBase } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { InputBase } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Input/Input.demo.inputContainer.tsx b/packages/@docs/demos/src/demos/core/Input/Input.demo.inputContainer.tsx index 53ed95aaa83..0e1e593e155 100644 --- a/packages/@docs/demos/src/demos/core/Input/Input.demo.inputContainer.tsx +++ b/packages/@docs/demos/src/demos/core/Input/Input.demo.inputContainer.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TextInput, Tooltip } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Input/Input.demo.inputWrapperOrder.tsx b/packages/@docs/demos/src/demos/core/Input/Input.demo.inputWrapperOrder.tsx index 8c9f41ff02a..59369f012c8 100644 --- a/packages/@docs/demos/src/demos/core/Input/Input.demo.inputWrapperOrder.tsx +++ b/packages/@docs/demos/src/demos/core/Input/Input.demo.inputWrapperOrder.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TextInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TextInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Input/Input.demo.mask.tsx b/packages/@docs/demos/src/demos/core/Input/Input.demo.mask.tsx index 3c114f21726..dcd8eb55b66 100644 --- a/packages/@docs/demos/src/demos/core/Input/Input.demo.mask.tsx +++ b/packages/@docs/demos/src/demos/core/Input/Input.demo.mask.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Input } from '@mantine/core'; import { IMaskInput } from 'react-imask'; +import { Input } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Input } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Input/Input.demo.placeholder.tsx b/packages/@docs/demos/src/demos/core/Input/Input.demo.placeholder.tsx index 4cfb5e705a8..83c834c61f8 100644 --- a/packages/@docs/demos/src/demos/core/Input/Input.demo.placeholder.tsx +++ b/packages/@docs/demos/src/demos/core/Input/Input.demo.placeholder.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Input } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Input } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Input/Input.demo.sections.tsx b/packages/@docs/demos/src/demos/core/Input/Input.demo.sections.tsx index 02427df1b8d..9bd67920019 100644 --- a/packages/@docs/demos/src/demos/core/Input/Input.demo.sections.tsx +++ b/packages/@docs/demos/src/demos/core/Input/Input.demo.sections.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Input, CloseButton } from '@mantine/core'; import { IconAt } from '@tabler/icons-react'; +import { CloseButton, Input } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Input/Input.demo.sharedStyles.tsx b/packages/@docs/demos/src/demos/core/Input/Input.demo.sharedStyles.tsx index 414bfca279a..105c91f95be 100644 --- a/packages/@docs/demos/src/demos/core/Input/Input.demo.sharedStyles.tsx +++ b/packages/@docs/demos/src/demos/core/Input/Input.demo.sharedStyles.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { createTheme, Input, MantineThemeProvider, NativeSelect, TextInput } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { TextInput, NativeSelect, MantineThemeProvider, createTheme, Input } from '@mantine/core'; import classes from './Input.demo.sharedStyles.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Input/Input.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Input/Input.demo.stylesApi.tsx index 9b017311c79..b5af2f7c8b9 100644 --- a/packages/@docs/demos/src/demos/core/Input/Input.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Input/Input.demo.stylesApi.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { IconAt, IconChevronDown } from '@tabler/icons-react'; import { Input, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { InputStylesApi } from '@docs/styles-api'; -import { IconAt, IconChevronDown } from '@tabler/icons-react'; const code = ` import { Input, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Input/Input.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Input/Input.demo.usage.tsx index e59f9faf20e..e1bfb388bc2 100644 --- a/packages/@docs/demos/src/demos/core/Input/Input.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Input/Input.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Input } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { inputOnlyControls } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Input/Input.demo.wrapper.tsx b/packages/@docs/demos/src/demos/core/Input/Input.demo.wrapper.tsx index 42168d89060..b8736dc45f2 100644 --- a/packages/@docs/demos/src/demos/core/Input/Input.demo.wrapper.tsx +++ b/packages/@docs/demos/src/demos/core/Input/Input.demo.wrapper.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Input } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { inputWrapperOnlyControls } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Input/Input.demo.wrapperStylesApi.tsx b/packages/@docs/demos/src/demos/core/Input/Input.demo.wrapperStylesApi.tsx index 56075b250ab..a53c97a5620 100644 --- a/packages/@docs/demos/src/demos/core/Input/Input.demo.wrapperStylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Input/Input.demo.wrapperStylesApi.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Input } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { InputWrapperStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Input/Input.demos.story.tsx b/packages/@docs/demos/src/demos/core/Input/Input.demos.story.tsx index 3fafb459b06..6a7a9b8f7c8 100644 --- a/packages/@docs/demos/src/demos/core/Input/Input.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Input/Input.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Input' }; diff --git a/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demo.configurator.tsx index d4504cd42fd..6696bcfdec1 100644 --- a/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { JsonInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { inputControls } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demo.disabled.tsx index 8cb3365329d..222fea7af41 100644 --- a/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demo.disabled.tsx @@ -1,6 +1,6 @@ +import React from 'react'; import { JsonInput } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import React from 'react'; const code = ` import { JsonInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demo.stylesApi.tsx index 8a1cec5c6e9..26b8ba69ee8 100644 --- a/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demo.stylesApi.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { JsonInput, rem } from '@mantine/core'; import { IconAt } from '@tabler/icons-react'; +import { JsonInput, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { JsonInputStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demo.usage.tsx b/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demo.usage.tsx index ddd11e30df4..2eeb84feb12 100644 --- a/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { JsonInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { JsonInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demos.story.tsx b/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demos.story.tsx index a8a6c4afb09..0eee08fb86a 100644 --- a/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/JsonInput/JsonInput.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'JsonInput' }; diff --git a/packages/@docs/demos/src/demos/core/Kbd/Kbd.demos.story.tsx b/packages/@docs/demos/src/demos/core/Kbd/Kbd.demos.story.tsx index 52e44b38988..ba2c5c17ec0 100644 --- a/packages/@docs/demos/src/demos/core/Kbd/Kbd.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Kbd/Kbd.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Kbd' }; diff --git a/packages/@docs/demos/src/demos/core/Kbd/Kdb.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Kbd/Kdb.demo.usage.tsx index fe2cabbcecc..0ebd59ea714 100644 --- a/packages/@docs/demos/src/demos/core/Kbd/Kdb.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Kbd/Kdb.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Kbd } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Kbd } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/List/List.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/List/List.demo.configurator.tsx index 18ae81e7aa9..1fa83c22571 100644 --- a/packages/@docs/demos/src/demos/core/List/List.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/List/List.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { List, ListProps } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; function Wrapper(props: ListProps) { return ( diff --git a/packages/@docs/demos/src/demos/core/List/List.demo.icon.tsx b/packages/@docs/demos/src/demos/core/List/List.demo.icon.tsx index f7c263b4c26..3a47923df77 100644 --- a/packages/@docs/demos/src/demos/core/List/List.demo.icon.tsx +++ b/packages/@docs/demos/src/demos/core/List/List.demo.icon.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { IconCircleCheck, IconCircleDashed } from '@tabler/icons-react'; +import { List, rem, ThemeIcon } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { ThemeIcon, List, rem } from '@mantine/core'; const code = ` import { List, ThemeIcon, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/List/List.demo.nested.tsx b/packages/@docs/demos/src/demos/core/List/List.demo.nested.tsx index 909a3b06940..013aedea5fe 100644 --- a/packages/@docs/demos/src/demos/core/List/List.demo.nested.tsx +++ b/packages/@docs/demos/src/demos/core/List/List.demo.nested.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { List } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { List } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/List/List.demos.story.tsx b/packages/@docs/demos/src/demos/core/List/List.demos.story.tsx index c58cb70672b..73a2bb0cb6f 100644 --- a/packages/@docs/demos/src/demos/core/List/List.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/List/List.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'List' }; diff --git a/packages/@docs/demos/src/demos/core/Loader/Loader.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Loader/Loader.demo.configurator.tsx index 2968d073232..adf75e791cd 100644 --- a/packages/@docs/demos/src/demos/core/Loader/Loader.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Loader/Loader.demo.configurator.tsx @@ -1,5 +1,5 @@ -import { MantineDemo } from '@mantinex/demo'; import { Loader } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Loader } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Loader/Loader.demo.cssLoader.tsx b/packages/@docs/demos/src/demos/core/Loader/Loader.demo.cssLoader.tsx index 7155b3b3b6c..a19f56c093c 100644 --- a/packages/@docs/demos/src/demos/core/Loader/Loader.demo.cssLoader.tsx +++ b/packages/@docs/demos/src/demos/core/Loader/Loader.demo.cssLoader.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Loader, MantineThemeProvider } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { CssLoader, cssLoaderModuleCssCode, cssLoaderTsxCode } from './_CssLoader'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Loader/Loader.demo.customType.tsx b/packages/@docs/demos/src/demos/core/Loader/Loader.demo.customType.tsx index fb892860853..bfe9529d82b 100644 --- a/packages/@docs/demos/src/demos/core/Loader/Loader.demo.customType.tsx +++ b/packages/@docs/demos/src/demos/core/Loader/Loader.demo.customType.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Loader, MantineThemeProvider } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { RingLoader, ringLoaderCode } from './_RingLoader'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Loader/Loader.demo.size.tsx b/packages/@docs/demos/src/demos/core/Loader/Loader.demo.size.tsx index 966fd50b386..7cdc2630f19 100644 --- a/packages/@docs/demos/src/demos/core/Loader/Loader.demo.size.tsx +++ b/packages/@docs/demos/src/demos/core/Loader/Loader.demo.size.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Loader } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Loader } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Loader/Loader.demos.story.tsx b/packages/@docs/demos/src/demos/core/Loader/Loader.demos.story.tsx index 913fbb85a57..b68c03c788b 100644 --- a/packages/@docs/demos/src/demos/core/Loader/Loader.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Loader/Loader.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Loader' }; diff --git a/packages/@docs/demos/src/demos/core/LoadingOverlay/LoadingOverlay.demo.customLoader.tsx b/packages/@docs/demos/src/demos/core/LoadingOverlay/LoadingOverlay.demo.customLoader.tsx index 37465196164..db546285959 100644 --- a/packages/@docs/demos/src/demos/core/LoadingOverlay/LoadingOverlay.demo.customLoader.tsx +++ b/packages/@docs/demos/src/demos/core/LoadingOverlay/LoadingOverlay.demo.customLoader.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { LoadingOverlay, Button, Group, Box } from '@mantine/core'; +import { Box, Button, Group, LoadingOverlay } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; import { AuthenticationForm } from '../../../shared/AuthenticationForm/AuthenticationForm'; diff --git a/packages/@docs/demos/src/demos/core/LoadingOverlay/LoadingOverlay.demo.loaderProps.tsx b/packages/@docs/demos/src/demos/core/LoadingOverlay/LoadingOverlay.demo.loaderProps.tsx index 2c126765b4d..6e2df9ea1ef 100644 --- a/packages/@docs/demos/src/demos/core/LoadingOverlay/LoadingOverlay.demo.loaderProps.tsx +++ b/packages/@docs/demos/src/demos/core/LoadingOverlay/LoadingOverlay.demo.loaderProps.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { LoadingOverlay, Button, Group, Box } from '@mantine/core'; +import { Box, Button, Group, LoadingOverlay } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; import { AuthenticationForm } from '../../../shared/AuthenticationForm/AuthenticationForm'; diff --git a/packages/@docs/demos/src/demos/core/LoadingOverlay/LoadingOverlay.demo.usage.tsx b/packages/@docs/demos/src/demos/core/LoadingOverlay/LoadingOverlay.demo.usage.tsx index a5ae15308fe..2ca11d8e203 100644 --- a/packages/@docs/demos/src/demos/core/LoadingOverlay/LoadingOverlay.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/LoadingOverlay/LoadingOverlay.demo.usage.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { LoadingOverlay, Button, Group, Box } from '@mantine/core'; +import { Box, Button, Group, LoadingOverlay } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; import { AuthenticationForm } from '../../../shared/AuthenticationForm/AuthenticationForm'; diff --git a/packages/@docs/demos/src/demos/core/LoadingOverlay/LoadingOverlay.demos.story.tsx b/packages/@docs/demos/src/demos/core/LoadingOverlay/LoadingOverlay.demos.story.tsx index 324d54aad4a..ee004fd519e 100644 --- a/packages/@docs/demos/src/demos/core/LoadingOverlay/LoadingOverlay.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/LoadingOverlay/LoadingOverlay.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'LoadingOverlay' }; diff --git a/packages/@docs/demos/src/demos/core/Mark/Mark.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Mark/Mark.demo.usage.tsx index c2ca2edd475..cd168a9f24e 100644 --- a/packages/@docs/demos/src/demos/core/Mark/Mark.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Mark/Mark.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Mark, MarkProps, Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; function Wrapper(props: MarkProps) { return ( diff --git a/packages/@docs/demos/src/demos/core/Mark/Mark.demos.story.tsx b/packages/@docs/demos/src/demos/core/Mark/Mark.demos.story.tsx index c1c0427e9dd..a1055450079 100644 --- a/packages/@docs/demos/src/demos/core/Mark/Mark.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Mark/Mark.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Mark' }; diff --git a/packages/@docs/demos/src/demos/core/Menu/Menu.demo.component.tsx b/packages/@docs/demos/src/demos/core/Menu/Menu.demo.component.tsx index 504649a4067..56d8247e2c2 100644 --- a/packages/@docs/demos/src/demos/core/Menu/Menu.demo.component.tsx +++ b/packages/@docs/demos/src/demos/core/Menu/Menu.demo.component.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { IconExternalLink } from '@tabler/icons-react'; +import { Button, Menu, rem } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Menu, Button, rem } from '@mantine/core'; const code = ` import { Menu, Button, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Menu/Menu.demo.customControl.tsx b/packages/@docs/demos/src/demos/core/Menu/Menu.demo.customControl.tsx index 3b09a62d0e7..eed117b0c08 100644 --- a/packages/@docs/demos/src/demos/core/Menu/Menu.demo.customControl.tsx +++ b/packages/@docs/demos/src/demos/core/Menu/Menu.demo.customControl.tsx @@ -1,6 +1,6 @@ import React, { forwardRef } from 'react'; import { IconChevronRight } from '@tabler/icons-react'; -import { Group, Avatar, Text, UnstyledButton, Menu } from '@mantine/core'; +import { Avatar, Group, Menu, Text, UnstyledButton } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { DemoMenuItems } from './_menu-items'; diff --git a/packages/@docs/demos/src/demos/core/Menu/Menu.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/Menu/Menu.demo.disabled.tsx index 753d7e6a27a..f15e3146859 100644 --- a/packages/@docs/demos/src/demos/core/Menu/Menu.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/Menu/Menu.demo.disabled.tsx @@ -1,14 +1,14 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Menu, Button, rem } from '@mantine/core'; import { - IconSettings, - IconSearch, - IconPhoto, + IconArrowsLeftRight, IconMessageCircle, + IconPhoto, + IconSearch, + IconSettings, IconTrash, - IconArrowsLeftRight, } from '@tabler/icons-react'; +import { Button, Menu, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Menu, Button, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Menu/Menu.demo.navigation.tsx b/packages/@docs/demos/src/demos/core/Menu/Menu.demo.navigation.tsx index ae3099503b5..e2e184ca3f2 100644 --- a/packages/@docs/demos/src/demos/core/Menu/Menu.demo.navigation.tsx +++ b/packages/@docs/demos/src/demos/core/Menu/Menu.demo.navigation.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Menu, Group } from '@mantine/core'; +import { Group, Menu } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { DemoMenuItems } from './_menu-items'; diff --git a/packages/@docs/demos/src/demos/core/Menu/Menu.demo.positionConfigurator.tsx b/packages/@docs/demos/src/demos/core/Menu/Menu.demo.positionConfigurator.tsx index a78499ae5de..d299010765b 100644 --- a/packages/@docs/demos/src/demos/core/Menu/Menu.demo.positionConfigurator.tsx +++ b/packages/@docs/demos/src/demos/core/Menu/Menu.demo.positionConfigurator.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { Menu, MenuProps } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { DemoMenuItems } from './_menu-items'; import { FLOATING_ARROW_POSITION_DATA } from '../../../shared/floating-position-data'; +import { DemoMenuItems } from './_menu-items'; function Wrapper(props: MenuProps) { return ( diff --git a/packages/@docs/demos/src/demos/core/Menu/Menu.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Menu/Menu.demo.stylesApi.tsx index f21b81d2a2a..36120b73a76 100644 --- a/packages/@docs/demos/src/demos/core/Menu/Menu.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Menu/Menu.demo.stylesApi.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Menu } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { MenuStylesApi } from '@docs/styles-api'; import { DemoMenuItems } from './_menu-items'; diff --git a/packages/@docs/demos/src/demos/core/Menu/Menu.demos.story.tsx b/packages/@docs/demos/src/demos/core/Menu/Menu.demos.story.tsx index 48d4ec10396..d226d6b2cd1 100644 --- a/packages/@docs/demos/src/demos/core/Menu/Menu.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Menu/Menu.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Menu' }; diff --git a/packages/@docs/demos/src/demos/core/Menu/_menu-items.tsx b/packages/@docs/demos/src/demos/core/Menu/_menu-items.tsx index 11c89525a74..92edd34be3e 100644 --- a/packages/@docs/demos/src/demos/core/Menu/_menu-items.tsx +++ b/packages/@docs/demos/src/demos/core/Menu/_menu-items.tsx @@ -1,13 +1,13 @@ import React from 'react'; import { - IconSettings, - IconSearch, - IconPhoto, + IconArrowsLeftRight, IconMessageCircle, + IconPhoto, + IconSearch, + IconSettings, IconTrash, - IconArrowsLeftRight, } from '@tabler/icons-react'; -import { Menu, Text, Button, rem } from '@mantine/core'; +import { Button, Menu, rem, Text } from '@mantine/core'; export function DemoMenuItems({ widthRightSection = true, withTarget = true }) { const iconProps = { style: { width: rem(14), height: rem(14) } }; diff --git a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.centered.tsx b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.centered.tsx index a72527a7131..d6942d54617 100644 --- a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.centered.tsx +++ b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.centered.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Modal } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { Modal, Button } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { AuthenticationForm } from '../../../shared/AuthenticationForm/AuthenticationForm'; diff --git a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.composition.tsx b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.composition.tsx index f588d7a2ec2..40b9c55718b 100644 --- a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.composition.tsx +++ b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.composition.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Modal, Button } from '@mantine/core'; +import { Button, Modal } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; diff --git a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.fullScreen.tsx b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.fullScreen.tsx index 935b746ebd2..098347aa89d 100644 --- a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.fullScreen.tsx +++ b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.fullScreen.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Modal, Text } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { Modal, Button, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { AuthenticationForm } from '../../../shared/AuthenticationForm/AuthenticationForm'; diff --git a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.fullScreenMobile.tsx b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.fullScreenMobile.tsx index b8e5a934801..50e1744bebc 100644 --- a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.fullScreenMobile.tsx +++ b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.fullScreenMobile.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, em, Modal } from '@mantine/core'; import { useDisclosure, useMediaQuery } from '@mantine/hooks'; -import { Modal, Button, em } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.header.tsx b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.header.tsx index 736ac142602..c6a9351e4db 100644 --- a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.header.tsx +++ b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.header.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { Button, Modal } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { Modal, Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useDisclosure } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.initialFocus.tsx b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.initialFocus.tsx index 77482b2a0c9..c6edea93488 100644 --- a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.initialFocus.tsx +++ b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.initialFocus.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Modal, Button, TextInput } from '@mantine/core'; +import { Button, Modal, TextInput } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; diff --git a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.offset.tsx b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.offset.tsx index 2973aee2706..341b7fb8e36 100644 --- a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.offset.tsx +++ b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.offset.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Modal, Button } from '@mantine/core'; +import { Button, Modal } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; import { AuthenticationForm } from '../../../shared/AuthenticationForm/AuthenticationForm'; diff --git a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.overflow.tsx b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.overflow.tsx index d9bf359f712..bb3049d4cbb 100644 --- a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.overflow.tsx +++ b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.overflow.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Modal } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { Modal, Button } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.overlay.tsx b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.overlay.tsx index 97216b67e9d..e1dc6ee0337 100644 --- a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.overlay.tsx +++ b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.overlay.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Modal, Button } from '@mantine/core'; +import { Button, Modal } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; import { AuthenticationForm } from '../../../shared/AuthenticationForm/AuthenticationForm'; diff --git a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.scrollarea.tsx b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.scrollarea.tsx index f53320d2f5f..ecbf8a68aab 100644 --- a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.scrollarea.tsx +++ b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.scrollarea.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Modal, ScrollArea } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { Modal, Button, ScrollArea } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.sizeAuto.tsx b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.sizeAuto.tsx index b0365a65ecb..1b7ad647bdd 100644 --- a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.sizeAuto.tsx +++ b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.sizeAuto.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { useDisclosure, useCounter } from '@mantine/hooks'; +import { Badge, Button, Group, Modal, Text } from '@mantine/core'; +import { useCounter, useDisclosure } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { Modal, Button, Group, Text, Badge } from '@mantine/core'; const code = ` import { useDisclosure, useCounter } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.sizes.tsx b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.sizes.tsx index 2de3f76363d..29fd7d615d5 100644 --- a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.sizes.tsx +++ b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.sizes.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Modal, Group, Button } from '@mantine/core'; +import { Button, Group, Modal } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { AuthenticationForm } from '../../../shared/AuthenticationForm/AuthenticationForm'; diff --git a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.transitions.tsx b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.transitions.tsx index abd6fb45cad..97ba2f9e335 100644 --- a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.transitions.tsx +++ b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.transitions.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Button, Group, Modal } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Modal, Group, Button } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.usage.tsx index 0d21ce34d45..249112d45c1 100644 --- a/packages/@docs/demos/src/demos/core/Modal/Modal.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Modal/Modal.demo.usage.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Modal, Button } from '@mantine/core'; +import { Button, Modal } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; import { AuthenticationForm } from '../../../shared/AuthenticationForm/AuthenticationForm'; diff --git a/packages/@docs/demos/src/demos/core/Modal/Modal.demos.story.tsx b/packages/@docs/demos/src/demos/core/Modal/Modal.demos.story.tsx index 39fbbf509eb..72c01185f10 100644 --- a/packages/@docs/demos/src/demos/core/Modal/Modal.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Modal/Modal.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Modal' }; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.checkIcon.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.checkIcon.tsx index b16f7704d5f..66d904f6a32 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.checkIcon.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.checkIcon.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.clearable.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.clearable.tsx index 3258b9cf6f5..6c01a040779 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.clearable.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.clearable.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.configurator.tsx index 80fc1734fd8..3924e8a6207 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { inputControls } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.disabled.tsx index 61e93ee5435..5693b827a15 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.disabledOptions.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.disabledOptions.tsx index 3e2d9293666..6640063655a 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.disabledOptions.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.disabledOptions.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownAnimation.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownAnimation.tsx index d7d376f3fcc..741cb427b24 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownAnimation.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownAnimation.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownOffset.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownOffset.tsx index 7a0af72a3fa..76d060baa62 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownOffset.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownOffset.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import classes from './MultiSelect.demo.dropdownOffset.module.css'; const cssCode = `.dropdown { diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownOpened.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownOpened.tsx index bdfd042a4ce..abc3c0b0eab 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownOpened.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownOpened.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { Button, MultiSelect } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { MultiSelect, Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownPadding.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownPadding.tsx index f3350251137..3d669e84968 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownPadding.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownPadding.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownPosition.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownPosition.tsx index ea90da5fc00..d298507b257 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownPosition.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownPosition.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownShadow.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownShadow.tsx index d986a36e069..c150e3ed4d4 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownShadow.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.dropdownShadow.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.error.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.error.tsx index 43783d1c794..653c900d115 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.error.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.error.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.groups.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.groups.tsx index 0693ff8991b..817db7e5ae4 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.groups.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.groups.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.hidePickedOptions.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.hidePickedOptions.tsx index 8de57cfde74..ceaff493e78 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.hidePickedOptions.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.hidePickedOptions.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.limit.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.limit.tsx index c438e70e68f..5e06d1beff2 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.limit.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.limit.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.maxValues.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.maxValues.tsx index d82a994c66b..1b7c2a9ba9e 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.maxValues.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.maxValues.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.nothingFound.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.nothingFound.tsx index df58ad04b92..43aae3c08a8 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.nothingFound.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.nothingFound.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.readOnly.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.readOnly.tsx index d156ce6df68..4fba8dee11e 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.readOnly.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.readOnly.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.scrollArea.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.scrollArea.tsx index d917f7a538c..ae19e63717f 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.scrollArea.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.scrollArea.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.search.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.search.tsx index c2de40f9a76..a720ad744e5 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.search.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.search.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { ComboboxItem, MultiSelect, OptionsFilter } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { MultiSelect, ComboboxItem, OptionsFilter } from '@mantine/core'; const code = ` import { MultiSelect, ComboboxItem, OptionsFilter } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.searchable.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.searchable.tsx index 172843ef9d7..a6e25342671 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.searchable.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.searchable.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.sections.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.sections.tsx index 6072a16932d..55e15757244 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.sections.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.sections.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { MultiSelect, rem } from '@mantine/core'; import { IconComponents } from '@tabler/icons-react'; +import { MultiSelect, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.sort.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.sort.tsx index bcf992efaa0..14ddc885d4a 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.sort.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.sort.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { ComboboxItem, MultiSelect, OptionsFilter } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { MultiSelect, ComboboxItem, OptionsFilter } from '@mantine/core'; const code = ` import { MultiSelect, ComboboxItem, OptionsFilter } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.stylesApi.tsx index 2984731c88f..cacc752ac38 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.stylesApi.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { IconAt } from '@tabler/icons-react'; import { MultiSelect, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { MultiSelectStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.usage.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.usage.tsx index ea2c8b2ac05..13926e37209 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MultiSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.withinPopover.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.withinPopover.tsx index 058190f091d..9e22bcb262c 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.withinPopover.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demo.withinPopover.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, MultiSelect, Popover } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Popover, Button, MultiSelect } from '@mantine/core'; const code = ` import { Popover, Button, MultiSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demos.story.tsx b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demos.story.tsx index 656327d6a10..b328fd193da 100644 --- a/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/MultiSelect/MultiSelect.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'MultiSelect' }; diff --git a/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.data.tsx b/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.data.tsx index 0a29231bd76..fd226b595fd 100644 --- a/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.data.tsx +++ b/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.data.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NativeSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NativeSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.disabled.tsx index 78987fe187e..284b3f776f2 100644 --- a/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NativeSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NativeSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.error.tsx b/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.error.tsx index b5b77f8a63b..e7e1d9e7f1a 100644 --- a/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.error.tsx +++ b/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.error.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NativeSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NativeSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.options.tsx b/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.options.tsx index 9e054a51591..c4f5d8cfab2 100644 --- a/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.options.tsx +++ b/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.options.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NativeSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NativeSelect } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.sections.tsx b/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.sections.tsx index 9a609caf383..9a6a2e45eb9 100644 --- a/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.sections.tsx +++ b/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.sections.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { NativeSelect, rem } from '@mantine/core'; import { IconChevronDown, IconHash } from '@tabler/icons-react'; +import { NativeSelect, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NativeSelect, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.stylesApi.tsx index fff3ac4ce66..c2a7aeaa413 100644 --- a/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.stylesApi.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NativeSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { NativeSelectStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.usage.tsx b/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.usage.tsx index 4ae020705ee..98fc6640181 100644 --- a/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NativeSelect } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { inputControls } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demos.story.tsx b/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demos.story.tsx index 102fb955519..8f187614a6d 100644 --- a/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/NativeSelect/NativeSelect.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'NativeSelect' }; diff --git a/packages/@docs/demos/src/demos/core/NavLink/NavLink.demo.active.tsx b/packages/@docs/demos/src/demos/core/NavLink/NavLink.demo.active.tsx index 881d591841e..1432f912033 100644 --- a/packages/@docs/demos/src/demos/core/NavLink/NavLink.demo.active.tsx +++ b/packages/@docs/demos/src/demos/core/NavLink/NavLink.demo.active.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { IconGauge, IconFingerprint, IconActivity, IconChevronRight } from '@tabler/icons-react'; +import { IconActivity, IconChevronRight, IconFingerprint, IconGauge } from '@tabler/icons-react'; +import { Box, Group, NavLink } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Box, NavLink, Group } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/NavLink/NavLink.demo.nested.tsx b/packages/@docs/demos/src/demos/core/NavLink/NavLink.demo.nested.tsx index ac4e6261ca4..d22475c0b26 100644 --- a/packages/@docs/demos/src/demos/core/NavLink/NavLink.demo.nested.tsx +++ b/packages/@docs/demos/src/demos/core/NavLink/NavLink.demo.nested.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { IconFingerprint, IconGauge } from '@tabler/icons-react'; import { NavLink } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { IconGauge, IconFingerprint } from '@tabler/icons-react'; const code = ` import { NavLink } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NavLink/NavLink.demo.usage.tsx b/packages/@docs/demos/src/demos/core/NavLink/NavLink.demo.usage.tsx index b37478610cc..1d34c7c5ebb 100644 --- a/packages/@docs/demos/src/demos/core/NavLink/NavLink.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/NavLink/NavLink.demo.usage.tsx @@ -1,13 +1,13 @@ import React from 'react'; -import { Badge, NavLink } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { - IconHome2, - IconGauge, - IconChevronRight, IconActivity, + IconChevronRight, IconCircleOff, + IconGauge, + IconHome2, } from '@tabler/icons-react'; +import { Badge, NavLink } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Badge, NavLink } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NavLink/NavLink.demos.story.tsx b/packages/@docs/demos/src/demos/core/NavLink/NavLink.demos.story.tsx index 02420ddbb21..c2cd8d45787 100644 --- a/packages/@docs/demos/src/demos/core/NavLink/NavLink.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/NavLink/NavLink.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'NavLink' }; diff --git a/packages/@docs/demos/src/demos/core/Notification/Notification.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Notification/Notification.demo.configurator.tsx index 9f49712cc35..35283561a3c 100644 --- a/packages/@docs/demos/src/demos/core/Notification/Notification.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Notification/Notification.demo.configurator.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Notification, NotificationProps, Box } from '@mantine/core'; +import { Box, Notification, NotificationProps } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; function Wrapper(props: NotificationProps) { diff --git a/packages/@docs/demos/src/demos/core/Notification/Notification.demo.icon.tsx b/packages/@docs/demos/src/demos/core/Notification/Notification.demo.icon.tsx index 7f4860dd355..a60a5ba9dc5 100644 --- a/packages/@docs/demos/src/demos/core/Notification/Notification.demo.icon.tsx +++ b/packages/@docs/demos/src/demos/core/Notification/Notification.demo.icon.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { IconX, IconCheck } from '@tabler/icons-react'; +import { IconCheck, IconX } from '@tabler/icons-react'; import { Notification, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { IconX, IconCheck } from '@tabler/icons-react'; diff --git a/packages/@docs/demos/src/demos/core/Notification/Notification.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Notification/Notification.demo.stylesApi.tsx index f3e7746c093..7c353d2a3b1 100644 --- a/packages/@docs/demos/src/demos/core/Notification/Notification.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Notification/Notification.demo.stylesApi.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { IconCheck } from '@tabler/icons-react'; import { Box, Notification } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { NotificationStylesApi } from '@docs/styles-api'; -import { IconCheck } from '@tabler/icons-react'; const code = ` import { Notification } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Notification/Notification.demos.story.tsx b/packages/@docs/demos/src/demos/core/Notification/Notification.demos.story.tsx index 00aacb273bb..02f89b99b43 100644 --- a/packages/@docs/demos/src/demos/core/Notification/Notification.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Notification/Notification.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Notification' }; diff --git a/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demo.decimalScale.tsx b/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demo.decimalScale.tsx index a3664ca7ef8..7416d598efc 100644 --- a/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demo.decimalScale.tsx +++ b/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demo.decimalScale.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NumberFormatter } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NumberFormatter } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demo.prefixSuffix.tsx b/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demo.prefixSuffix.tsx index 4c1ba32a73b..cd7396fe898 100644 --- a/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demo.prefixSuffix.tsx +++ b/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demo.prefixSuffix.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NumberFormatter } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NumberFormatter } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demo.thousandsSeparator.tsx b/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demo.thousandsSeparator.tsx index c73d445816a..6f45c751593 100644 --- a/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demo.thousandsSeparator.tsx +++ b/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demo.thousandsSeparator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NumberFormatter } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NumberFormatter } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demo.usage.tsx b/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demo.usage.tsx index 76e43e39c24..7b80418eb8c 100644 --- a/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NumberFormatter } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NumberFormatter } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demos.story.tsx b/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demos.story.tsx index baa64e90c2f..5c5db56039b 100644 --- a/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/NumberFormatter/NumberFormatter.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'NumberFormatter' }; diff --git a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.allowDecimal.tsx b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.allowDecimal.tsx index c148871e049..77028706737 100644 --- a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.allowDecimal.tsx +++ b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.allowDecimal.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NumberInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NumberInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.allowNegative.tsx b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.allowNegative.tsx index 8e40f2d4987..5385174aace 100644 --- a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.allowNegative.tsx +++ b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.allowNegative.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NumberInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NumberInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.decimalScale.tsx b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.decimalScale.tsx index a5edd8d3f3f..132a7b62590 100644 --- a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.decimalScale.tsx +++ b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.decimalScale.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NumberInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NumberInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.decimalSeparator.tsx b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.decimalSeparator.tsx index 4d0c05822b0..3e818132ca2 100644 --- a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.decimalSeparator.tsx +++ b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.decimalSeparator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NumberInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NumberInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.disabled.tsx index 179070d0cf1..6034dcc14c0 100644 --- a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NumberInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NumberInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.error.tsx b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.error.tsx index 9ca64836d1d..84585acada2 100644 --- a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.error.tsx +++ b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.error.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NumberInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NumberInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.fixedDecimalScale.tsx b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.fixedDecimalScale.tsx index 897dccbf884..968cd2a71b0 100644 --- a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.fixedDecimalScale.tsx +++ b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.fixedDecimalScale.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NumberInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NumberInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.handlers.tsx b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.handlers.tsx index d8e51df9d39..678b6675997 100644 --- a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.handlers.tsx +++ b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.handlers.tsx @@ -1,6 +1,6 @@ import React, { useRef } from 'react'; +import { Button, Group, NumberInput, NumberInputHandlers } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { NumberInput, Group, Button, NumberInputHandlers } from '@mantine/core'; const code = ` import { useRef } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.minMax.tsx b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.minMax.tsx index 28d738a8aa6..c80d908943f 100644 --- a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.minMax.tsx +++ b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.minMax.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NumberInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NumberInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.prefixSuffix.tsx b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.prefixSuffix.tsx index 6645b16d4a9..92c0e5936d1 100644 --- a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.prefixSuffix.tsx +++ b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.prefixSuffix.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NumberInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NumberInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.rightSection.tsx b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.rightSection.tsx index 552288eedcd..885ff6f0a13 100644 --- a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.rightSection.tsx +++ b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.rightSection.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { NumberInput } from '@mantine/core'; import { IconChartBubble } from '@tabler/icons-react'; +import { NumberInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NumberInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.sections.tsx b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.sections.tsx index dd1a8c041b1..4d5374453f1 100644 --- a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.sections.tsx +++ b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.sections.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { NumberInput, rem } from '@mantine/core'; import { IconCurrencyDram } from '@tabler/icons-react'; +import { NumberInput, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NumberInput, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.strictClamp.tsx b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.strictClamp.tsx index c0bfe3f8540..320984c2313 100644 --- a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.strictClamp.tsx +++ b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.strictClamp.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NumberInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NumberInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.stylesApi.tsx index 42cab3d0e51..fe090cd728f 100644 --- a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.stylesApi.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { NumberInput, rem } from '@mantine/core'; import { IconAt } from '@tabler/icons-react'; +import { NumberInput, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { NumberInputStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.thousandsSeparator.tsx b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.thousandsSeparator.tsx index 55bc8a8decc..a4e5d3d754b 100644 --- a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.thousandsSeparator.tsx +++ b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.thousandsSeparator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NumberInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { NumberInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.usage.tsx b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.usage.tsx index 8163a19e46a..9a268d0979d 100644 --- a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { NumberInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { inputControls } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demos.story.tsx b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demos.story.tsx index 2e3e24aaadf..8f031227154 100644 --- a/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/NumberInput/NumberInput.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'NumberInput' }; diff --git a/packages/@docs/demos/src/demos/core/Overlay/Overlay.demo.blur.tsx b/packages/@docs/demos/src/demos/core/Overlay/Overlay.demo.blur.tsx index b1453a7c15f..2026ed4cbd3 100644 --- a/packages/@docs/demos/src/demos/core/Overlay/Overlay.demo.blur.tsx +++ b/packages/@docs/demos/src/demos/core/Overlay/Overlay.demo.blur.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { AspectRatio, Overlay } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Overlay, AspectRatio } from '@mantine/core'; const code = ` import { Overlay, AspectRatio } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Overlay/Overlay.demo.gradient.tsx b/packages/@docs/demos/src/demos/core/Overlay/Overlay.demo.gradient.tsx index 4c6b3dd70c5..29380bdfbea 100644 --- a/packages/@docs/demos/src/demos/core/Overlay/Overlay.demo.gradient.tsx +++ b/packages/@docs/demos/src/demos/core/Overlay/Overlay.demo.gradient.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { AspectRatio, Button, Overlay } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Button, Overlay, AspectRatio } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Overlay/Overlay.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Overlay/Overlay.demo.usage.tsx index 3e24088efaf..5bf3770b740 100644 --- a/packages/@docs/demos/src/demos/core/Overlay/Overlay.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Overlay/Overlay.demo.usage.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { AspectRatio, Button, Overlay } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Button, Overlay, AspectRatio } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Overlay/Overlay.demos.story.tsx b/packages/@docs/demos/src/demos/core/Overlay/Overlay.demos.story.tsx index 15e6f3abf76..918cb351128 100644 --- a/packages/@docs/demos/src/demos/core/Overlay/Overlay.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Overlay/Overlay.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Overlay' }; diff --git a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.boundaries.tsx b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.boundaries.tsx index 10761b7343e..45d6e665240 100644 --- a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.boundaries.tsx +++ b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.boundaries.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Pagination, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Text, Pagination } from '@mantine/core'; const code = ` import { Text, Pagination } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.composition.tsx b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.composition.tsx index 23b54e2e02e..00beae80320 100644 --- a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.composition.tsx +++ b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.composition.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Group, Pagination } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Group, Pagination } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.configurator.tsx index 470a71559e9..9d3e248fbce 100644 --- a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Pagination } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; function Wrapper(props: any) { return ; diff --git a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.icons.tsx b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.icons.tsx index 9913b74ff0c..43d8f428cbf 100644 --- a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.icons.tsx +++ b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.icons.tsx @@ -1,13 +1,13 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Group, Pagination } from '@mantine/core'; import { - IconArrowBarToRight, IconArrowBarToLeft, + IconArrowBarToRight, IconArrowLeft, IconArrowRight, IconGripHorizontal, } from '@tabler/icons-react'; +import { Group, Pagination } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Group, Pagination } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.links.tsx b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.links.tsx index c0fb0d28e62..9ad9b27f4a1 100644 --- a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.links.tsx +++ b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.links.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Group, Pagination } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Group, Pagination } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.siblings.tsx b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.siblings.tsx index 9092fbfa8dc..6d9468a15bd 100644 --- a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.siblings.tsx +++ b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.siblings.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Pagination, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Text, Pagination } from '@mantine/core'; const code = ` import { Text, Pagination } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.stylesApi.tsx index c48d5579d4d..57f5a3979a3 100644 --- a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.stylesApi.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Pagination } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { PaginationStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.usage.tsx index 9007faef887..12b7bd21d08 100644 --- a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Pagination } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; function Demo() { return ; diff --git a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.withContent.tsx b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.withContent.tsx index 6a090e7b511..3f1e95c4f68 100644 --- a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.withContent.tsx +++ b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demo.withContent.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { randomId } from '@mantine/hooks'; import { Pagination, Text } from '@mantine/core'; +import { randomId } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { randomId } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demos.story.tsx b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demos.story.tsx index 8322c3dc510..ba52da3d08e 100644 --- a/packages/@docs/demos/src/demos/core/Pagination/Pagination.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Pagination/Pagination.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Pagination' }; diff --git a/packages/@docs/demos/src/demos/core/Paper/Paper.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Paper/Paper.demo.usage.tsx index 53cff9d8ac8..4a35517aac4 100644 --- a/packages/@docs/demos/src/demos/core/Paper/Paper.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Paper/Paper.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Box, Paper, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Text, Paper, Box } from '@mantine/core'; function Wrapper(props: any) { return ( diff --git a/packages/@docs/demos/src/demos/core/Paper/Paper.demos.story.tsx b/packages/@docs/demos/src/demos/core/Paper/Paper.demos.story.tsx index f19877e79c9..8700ab2c285 100644 --- a/packages/@docs/demos/src/demos/core/Paper/Paper.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Paper/Paper.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Paper' }; diff --git a/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.controlledVisibility.tsx b/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.controlledVisibility.tsx index af1f8e399be..167170ae02d 100644 --- a/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.controlledVisibility.tsx +++ b/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.controlledVisibility.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { PasswordInput, Stack } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { PasswordInput, Stack } from '@mantine/core'; const code = ` import { useDisclosure } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.disabled.tsx index 6fd61981389..1641960b106 100644 --- a/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { PasswordInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { PasswordInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.error.tsx b/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.error.tsx index 1605ba55b7d..d24af0fd8f9 100644 --- a/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.error.tsx +++ b/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.error.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { PasswordInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { PasswordInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.sections.tsx b/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.sections.tsx index 72c52d03cc9..cc4beb06ff7 100644 --- a/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.sections.tsx +++ b/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.sections.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { PasswordInput, rem } from '@mantine/core'; import { IconLock } from '@tabler/icons-react'; +import { PasswordInput, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { PasswordInput, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.strengthMeter.tsx b/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.strengthMeter.tsx index 2bfabc1fa27..5a2ebb0080b 100644 --- a/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.strengthMeter.tsx +++ b/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.strengthMeter.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { IconX, IconCheck } from '@tabler/icons-react'; +import { IconCheck, IconX } from '@tabler/icons-react'; +import { Box, PasswordInput, Popover, Progress, rem, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { PasswordInput, Progress, Text, Popover, Box, rem } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.stylesApi.tsx index 413caf3f3ac..18c77bec206 100644 --- a/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.stylesApi.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { PasswordInput, rem } from '@mantine/core'; import { IconLock } from '@tabler/icons-react'; +import { PasswordInput, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { PasswordInputStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.usage.tsx b/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.usage.tsx index 7a315c491e3..fb87e5154ee 100644 --- a/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { PasswordInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { inputControls } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.visibilityIcon.tsx b/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.visibilityIcon.tsx index e667726f0f5..ac7472b880d 100644 --- a/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.visibilityIcon.tsx +++ b/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demo.visibilityIcon.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { IconEyeCheck, IconEyeOff } from '@tabler/icons-react'; -import { MantineDemo } from '@mantinex/demo'; import { PasswordInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { PasswordInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demos.story.tsx b/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demos.story.tsx index 58348d554f3..a7cd08a0c60 100644 --- a/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/PasswordInput/PasswordInput.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'PasswordInput' }; diff --git a/packages/@docs/demos/src/demos/core/Pill/Pill.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Pill/Pill.demo.stylesApi.tsx index 402ac815bf3..b1d2e4da009 100644 --- a/packages/@docs/demos/src/demos/core/Pill/Pill.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Pill/Pill.demo.stylesApi.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Pill } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { PillStylesApi } from '@docs/styles-api'; import classes from './_demo.module.css'; diff --git a/packages/@docs/demos/src/demos/core/Pill/Pill.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Pill/Pill.demo.usage.tsx index 46415540204..f3fbd46d1cd 100644 --- a/packages/@docs/demos/src/demos/core/Pill/Pill.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Pill/Pill.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Pill } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import classes from './_demo.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Pill/Pill.demo.withinInput.tsx b/packages/@docs/demos/src/demos/core/Pill/Pill.demo.withinInput.tsx index ddfb5d63517..a1dae0255ce 100644 --- a/packages/@docs/demos/src/demos/core/Pill/Pill.demo.withinInput.tsx +++ b/packages/@docs/demos/src/demos/core/Pill/Pill.demo.withinInput.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { InputBase, Pill } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Pill, InputBase } from '@mantine/core'; const code = ` import { Pill, InputBase } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Pill/Pill.demos.story.tsx b/packages/@docs/demos/src/demos/core/Pill/Pill.demos.story.tsx index 4b71ffaccaa..2298c89e922 100644 --- a/packages/@docs/demos/src/demos/core/Pill/Pill.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Pill/Pill.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Pill' }; diff --git a/packages/@docs/demos/src/demos/core/PillsInput/PillsInput.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/PillsInput/PillsInput.demo.configurator.tsx index 55fff1b505e..47b7d378b75 100644 --- a/packages/@docs/demos/src/demos/core/PillsInput/PillsInput.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/PillsInput/PillsInput.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Pill, PillsInput } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { PillsInput, Pill } from '@mantine/core'; import { inputControls } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/PillsInput/PillsInput.demo.usage.tsx b/packages/@docs/demos/src/demos/core/PillsInput/PillsInput.demo.usage.tsx index 4917418ee59..783a7a0c463 100644 --- a/packages/@docs/demos/src/demos/core/PillsInput/PillsInput.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/PillsInput/PillsInput.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Pill, PillsInput } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { PillsInput, Pill } from '@mantine/core'; const code = ` import { PillsInput, Pill } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/PillsInput/PillsInput.demos.story.tsx b/packages/@docs/demos/src/demos/core/PillsInput/PillsInput.demos.story.tsx index b735fd2a4f4..b4ad99bffa1 100644 --- a/packages/@docs/demos/src/demos/core/PillsInput/PillsInput.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/PillsInput/PillsInput.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'PillsInput' }; diff --git a/packages/@docs/demos/src/demos/core/PinInput/PinInput.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/PinInput/PinInput.demo.configurator.tsx index dc469a61466..b538c2446d3 100644 --- a/packages/@docs/demos/src/demos/core/PinInput/PinInput.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/PinInput/PinInput.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { PinInput, PinInputProps } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { PinInputProps, PinInput } from '@mantine/core'; const code = ` import { PinInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/PinInput/PinInput.demo.regexp.tsx b/packages/@docs/demos/src/demos/core/PinInput/PinInput.demo.regexp.tsx index ba9c304d37e..0ce5fe2cc07 100644 --- a/packages/@docs/demos/src/demos/core/PinInput/PinInput.demo.regexp.tsx +++ b/packages/@docs/demos/src/demos/core/PinInput/PinInput.demo.regexp.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { PinInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { PinInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/PinInput/PinInput.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/PinInput/PinInput.demo.stylesApi.tsx index d89b2863317..75262675fc6 100644 --- a/packages/@docs/demos/src/demos/core/PinInput/PinInput.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/PinInput/PinInput.demo.stylesApi.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { PinInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { PinInputStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/PinInput/PinInput.demos.story.tsx b/packages/@docs/demos/src/demos/core/PinInput/PinInput.demos.story.tsx index 13acb14313a..8b58fb82802 100644 --- a/packages/@docs/demos/src/demos/core/PinInput/PinInput.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/PinInput/PinInput.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'PinInput' }; diff --git a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.arrow.tsx b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.arrow.tsx index 0282e742e60..e31782623ba 100644 --- a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.arrow.tsx +++ b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.arrow.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Popover, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Popover, Button, Text } from '@mantine/core'; const code = ` import { Popover } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.clickOutsideEvents.tsx b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.clickOutsideEvents.tsx index 9f533f0a4e6..f65a92e3856 100644 --- a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.clickOutsideEvents.tsx +++ b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.clickOutsideEvents.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Popover, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Popover, Text, Button } from '@mantine/core'; const code = ` import { Popover, Text, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.disabled.tsx index bdf41f7b5c5..4335efebc03 100644 --- a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Popover, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Popover, Text, Button } from '@mantine/core'; const code = ` import { Popover, Text, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.form.tsx b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.form.tsx index 27e272daf92..0c1bc2ca5b1 100644 --- a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.form.tsx +++ b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.form.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Popover, TextInput } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Popover, Button, TextInput } from '@mantine/core'; const code = ` import { Popover, Button, TextInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.hover.tsx b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.hover.tsx index 3e60ad48954..b56ac90fff0 100644 --- a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.hover.tsx +++ b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.hover.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Button, Popover, Text } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { Popover, Text, Button } from '@mantine/core'; const code = ` import { useDisclosure } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.inline.tsx b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.inline.tsx index a7548177e2c..eee2698dcdb 100644 --- a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.inline.tsx +++ b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.inline.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Mark, Popover, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Popover, Mark, Text } from '@mantine/core'; const code = ` import { Popover, Mark, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.offset.tsx b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.offset.tsx index 45919c3a191..9cca52e53df 100644 --- a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.offset.tsx +++ b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.offset.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Popover, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Popover, Button, Text } from '@mantine/core'; import { FLOATING_POSITION_DATA } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.offsetAxis.tsx b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.offsetAxis.tsx index 4cfab93caae..5f207cd2338 100644 --- a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.offsetAxis.tsx +++ b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.offsetAxis.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Popover, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Popover, Button, Text } from '@mantine/core'; import { FLOATING_POSITION_DATA } from '../../../shared'; const code = (props: any) => ` diff --git a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.portalChildren.tsx b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.portalChildren.tsx index 26443febba8..dfca308f78d 100644 --- a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.portalChildren.tsx +++ b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.portalChildren.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button, Popover, Select } from '@mantine/core'; import { DatePickerInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button, Popover, Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.sameWidth.tsx b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.sameWidth.tsx index 39029d1fa23..fc9c248ade9 100644 --- a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.sameWidth.tsx +++ b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.sameWidth.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Popover, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Popover, Text, Button } from '@mantine/core'; const code = ` import { Popover, Text, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.usage.tsx index edce821d4bb..641e5cdf100 100644 --- a/packages/@docs/demos/src/demos/core/Popover/Popover.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Popover/Popover.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Popover, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Popover, Text, Button } from '@mantine/core'; const code = ` import { Popover, Text, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Popover/Popover.demos.story.tsx b/packages/@docs/demos/src/demos/core/Popover/Popover.demos.story.tsx index ea5027f49df..5be87080127 100644 --- a/packages/@docs/demos/src/demos/core/Popover/Popover.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Popover/Popover.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Popover' }; diff --git a/packages/@docs/demos/src/demos/core/Progress/Progress.demo.compound.tsx b/packages/@docs/demos/src/demos/core/Progress/Progress.demo.compound.tsx index 1c36c63acff..dcbc40dea10 100644 --- a/packages/@docs/demos/src/demos/core/Progress/Progress.demo.compound.tsx +++ b/packages/@docs/demos/src/demos/core/Progress/Progress.demo.compound.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Progress } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Progress } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Progress/Progress.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Progress/Progress.demo.stylesApi.tsx index cf517242fbc..9912ea82e41 100644 --- a/packages/@docs/demos/src/demos/core/Progress/Progress.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Progress/Progress.demo.stylesApi.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Progress } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { ProgressStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Progress/Progress.demo.tooltips.tsx b/packages/@docs/demos/src/demos/core/Progress/Progress.demo.tooltips.tsx index 45ad6dd6b8c..3cd5ed26e2d 100644 --- a/packages/@docs/demos/src/demos/core/Progress/Progress.demo.tooltips.tsx +++ b/packages/@docs/demos/src/demos/core/Progress/Progress.demo.tooltips.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Progress, Tooltip } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Progress, Tooltip } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Progress/Progress.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Progress/Progress.demo.usage.tsx index 5cc2d167595..0f4bea2e97b 100644 --- a/packages/@docs/demos/src/demos/core/Progress/Progress.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Progress/Progress.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Progress } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Progress } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Progress/Progress.demos.story.tsx b/packages/@docs/demos/src/demos/core/Progress/Progress.demos.story.tsx index 55434aafe02..28f97bb8f79 100644 --- a/packages/@docs/demos/src/demos/core/Progress/Progress.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Progress/Progress.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Progress' }; diff --git a/packages/@docs/demos/src/demos/core/Radio/Radio.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Radio/Radio.demo.configurator.tsx index fd82a11e5c2..9f572496cb3 100644 --- a/packages/@docs/demos/src/demos/core/Radio/Radio.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Radio/Radio.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Radio, RadioProps } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { RadioProps, Radio } from '@mantine/core'; const code = ` import { Radio } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Radio/Radio.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/Radio/Radio.demo.disabled.tsx index 338d2fb8b08..17752a05d86 100644 --- a/packages/@docs/demos/src/demos/core/Radio/Radio.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/Radio/Radio.demo.disabled.tsx @@ -1,6 +1,6 @@ -import { Radio, Group } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import React from 'react'; +import { Group, Radio } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Radio, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Radio/Radio.demo.groupConfigurator.tsx b/packages/@docs/demos/src/demos/core/Radio/Radio.demo.groupConfigurator.tsx index ce77b1d2232..57e7ffecd97 100644 --- a/packages/@docs/demos/src/demos/core/Radio/Radio.demo.groupConfigurator.tsx +++ b/packages/@docs/demos/src/demos/core/Radio/Radio.demo.groupConfigurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Group, Radio, RadioGroupProps } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { RadioGroupProps, Radio, Group } from '@mantine/core'; const code = ` import { Radio } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Radio/Radio.demo.icon.tsx b/packages/@docs/demos/src/demos/core/Radio/Radio.demo.icon.tsx index fbdba3a9924..9c5e66a5732 100644 --- a/packages/@docs/demos/src/demos/core/Radio/Radio.demo.icon.tsx +++ b/packages/@docs/demos/src/demos/core/Radio/Radio.demo.icon.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { CheckIcon, Radio } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Radio, CheckIcon } from '@mantine/core'; const code = ` import { Radio, CheckIcon } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Radio/Radio.demo.iconColor.tsx b/packages/@docs/demos/src/demos/core/Radio/Radio.demo.iconColor.tsx index 85fe73888af..865f2912c6b 100644 --- a/packages/@docs/demos/src/demos/core/Radio/Radio.demo.iconColor.tsx +++ b/packages/@docs/demos/src/demos/core/Radio/Radio.demo.iconColor.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Radio } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Radio } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Radio/Radio.demo.states.tsx b/packages/@docs/demos/src/demos/core/Radio/Radio.demo.states.tsx index aab1870b2dd..3e2baa3b38b 100644 --- a/packages/@docs/demos/src/demos/core/Radio/Radio.demo.states.tsx +++ b/packages/@docs/demos/src/demos/core/Radio/Radio.demo.states.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Radio, Stack } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Radio, Stack } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Radio/Radio.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Radio/Radio.demo.stylesApi.tsx index 6fe291df045..7815a4d01dc 100644 --- a/packages/@docs/demos/src/demos/core/Radio/Radio.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Radio/Radio.demo.stylesApi.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Radio } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { RadioStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Radio/Radio.demo.tooltip.tsx b/packages/@docs/demos/src/demos/core/Radio/Radio.demo.tooltip.tsx index fafdac661fb..e598f3d21cd 100644 --- a/packages/@docs/demos/src/demos/core/Radio/Radio.demo.tooltip.tsx +++ b/packages/@docs/demos/src/demos/core/Radio/Radio.demo.tooltip.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Radio, Tooltip } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Tooltip, Radio } from '@mantine/core'; const code = ` import { Tooltip, Radio } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Radio/Radio.demos.story.tsx b/packages/@docs/demos/src/demos/core/Radio/Radio.demos.story.tsx index 92ed595df49..02569ca4129 100644 --- a/packages/@docs/demos/src/demos/core/Radio/Radio.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Radio/Radio.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Radio' }; diff --git a/packages/@docs/demos/src/demos/core/Rating/Rating.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Rating/Rating.demo.configurator.tsx index 701f8c1fd4e..993d02a1a05 100644 --- a/packages/@docs/demos/src/demos/core/Rating/Rating.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Rating/Rating.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Rating, RatingProps } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { RatingProps, Rating } from '@mantine/core'; const code = ` import { Rating } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Rating/Rating.demo.customSymbol.tsx b/packages/@docs/demos/src/demos/core/Rating/Rating.demo.customSymbol.tsx index b85ece8b529..e43c6e5ea1f 100644 --- a/packages/@docs/demos/src/demos/core/Rating/Rating.demo.customSymbol.tsx +++ b/packages/@docs/demos/src/demos/core/Rating/Rating.demo.customSymbol.tsx @@ -1,13 +1,13 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Rating, rem } from '@mantine/core'; import { + IconMoodCrazyHappy, IconMoodCry, + IconMoodHappy, IconMoodSad, IconMoodSmile, - IconMoodHappy, - IconMoodCrazyHappy, } from '@tabler/icons-react'; +import { Rating, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Rating, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Rating/Rating.demo.fractions.tsx b/packages/@docs/demos/src/demos/core/Rating/Rating.demo.fractions.tsx index 99d39f74414..34d8d4c6f1d 100644 --- a/packages/@docs/demos/src/demos/core/Rating/Rating.demo.fractions.tsx +++ b/packages/@docs/demos/src/demos/core/Rating/Rating.demo.fractions.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Group, Rating, Stack } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Rating, Group, Stack } from '@mantine/core'; const code = ` import { Rating, Group, Stack } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Rating/Rating.demo.readOnly.tsx b/packages/@docs/demos/src/demos/core/Rating/Rating.demo.readOnly.tsx index 53e2fb1bdf3..91c900e7a00 100644 --- a/packages/@docs/demos/src/demos/core/Rating/Rating.demo.readOnly.tsx +++ b/packages/@docs/demos/src/demos/core/Rating/Rating.demo.readOnly.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Rating } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Rating } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Rating/Rating.demo.symbol.tsx b/packages/@docs/demos/src/demos/core/Rating/Rating.demo.symbol.tsx index cc9e4bdccd3..b74ec6f1e92 100644 --- a/packages/@docs/demos/src/demos/core/Rating/Rating.demo.symbol.tsx +++ b/packages/@docs/demos/src/demos/core/Rating/Rating.demo.symbol.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { IconMoon, IconSun } from '@tabler/icons-react'; import { Rating } from '@mantine/core'; -import { IconSun, IconMoon } from '@tabler/icons-react'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Rating } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Rating/Rating.demos.story.tsx b/packages/@docs/demos/src/demos/core/Rating/Rating.demos.story.tsx index fdeb80743e8..39fc4aa6d86 100644 --- a/packages/@docs/demos/src/demos/core/Rating/Rating.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Rating/Rating.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Rating' }; diff --git a/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.configurator.tsx index 7fdde9e80a8..5de277e216d 100644 --- a/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { RingProgress, RingProgressProps } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; function Wrapper(props: RingProgressProps) { return ( diff --git a/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.label.tsx b/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.label.tsx index 8d6a0c42678..902ac752316 100644 --- a/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.label.tsx +++ b/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.label.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { IconCheck } from '@tabler/icons-react'; +import { ActionIcon, Center, Group, rem, RingProgress, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { ActionIcon, RingProgress, Group, Text, Center, rem } from '@mantine/core'; const code = ` import { ActionIcon, RingProgress, Text, Center } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.rootColor.tsx b/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.rootColor.tsx index 6dea8b708bf..25b702ee7b7 100644 --- a/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.rootColor.tsx +++ b/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.rootColor.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { RingProgress } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { RingProgress } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.sectionsProps.tsx b/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.sectionsProps.tsx index f1eb4ba114b..b2b37cb3987 100644 --- a/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.sectionsProps.tsx +++ b/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.sectionsProps.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { RingProgress, Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.tooltip.tsx b/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.tooltip.tsx index 5f5b1142b56..f8b6474354e 100644 --- a/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.tooltip.tsx +++ b/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.tooltip.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { RingProgress, Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { RingProgress, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.usage.tsx b/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.usage.tsx index 8cfdbda798c..1380114309f 100644 --- a/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { RingProgress, Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { RingProgress, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demos.story.tsx b/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demos.story.tsx index 258209ec040..8c4d57edc2e 100644 --- a/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/RingProgress/RingProgress.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'RingProgress' }; diff --git a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.autosizePopover.tsx b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.autosizePopover.tsx index aab3a58a973..fa40273d8e9 100644 --- a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.autosizePopover.tsx +++ b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.autosizePopover.tsx @@ -1,6 +1,6 @@ -import React, { useState, useRef } from 'react'; +import React, { useRef, useState } from 'react'; +import { Box, Popover, ScrollArea, Text, TextInput, UnstyledButton } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { ScrollArea, Popover, TextInput, UnstyledButton, Text, Box } from '@mantine/core'; const code = ` import { useState, useRef } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.horizontal.tsx b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.horizontal.tsx index c5fd0239fae..df73be83377 100644 --- a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.horizontal.tsx +++ b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.horizontal.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { ScrollArea, Box } from '@mantine/core'; +import { Box, ScrollArea } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { Content } from './_content'; diff --git a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.maxHeight.tsx b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.maxHeight.tsx index 02304ccb0c9..f340d7210c8 100644 --- a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.maxHeight.tsx +++ b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.maxHeight.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Button, Group, ScrollArea } from '@mantine/core'; import { useCounter } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { ScrollArea, Button, Group } from '@mantine/core'; const lorem = 'Lorem ipsum, dolor sit amet consectetur adipisicing elit. Dicta perspiciatis reiciendis voluptate eaque itaque quos. Natus iure tenetur libero, reprehenderit ad, sequi, in aliquam eos necessitatibus expedita delectus veniam culpa!'; diff --git a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.scrollIntoView.tsx b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.scrollIntoView.tsx index 154e4c360e6..d20bfb7f92d 100644 --- a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.scrollIntoView.tsx +++ b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.scrollIntoView.tsx @@ -1,6 +1,6 @@ -import React, { useState, useRef } from 'react'; +import React, { useRef, useState } from 'react'; +import { ScrollArea, TextInput, UnstyledButton } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { ScrollArea, UnstyledButton, TextInput } from '@mantine/core'; const code = ` import { useState, useRef } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.scrollPosition.tsx b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.scrollPosition.tsx index afc60937e98..4a719e3b9f9 100644 --- a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.scrollPosition.tsx +++ b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.scrollPosition.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Stack, Code, Text, ScrollArea, Box } from '@mantine/core'; +import { Box, Code, ScrollArea, Stack, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { Content } from './_content'; diff --git a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.scrollTo.tsx b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.scrollTo.tsx index 48474fd0880..479b888e292 100644 --- a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.scrollTo.tsx +++ b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.scrollTo.tsx @@ -1,5 +1,5 @@ import React, { useRef } from 'react'; -import { ScrollArea, Button, Stack, Group } from '@mantine/core'; +import { Button, Group, ScrollArea, Stack } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { Content } from './_content'; diff --git a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.scrollbars.tsx b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.scrollbars.tsx index 4e8e85c80f8..13a91885a37 100644 --- a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.scrollbars.tsx +++ b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.scrollbars.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { ScrollArea, Box } from '@mantine/core'; +import { Box, ScrollArea } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { Content } from './_content'; diff --git a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.stylesApi.tsx index 3f92be5a0d5..8ab92c959cf 100644 --- a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.stylesApi.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { ScrollArea, Box } from '@mantine/core'; +import { Box, ScrollArea } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { Content } from './_content'; import classes from './ScrollArea.demo.stylesApi.module.css'; diff --git a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.usage.tsx b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.usage.tsx index 550b3eab582..4034146ffe7 100644 --- a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demo.usage.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { ScrollArea, ScrollAreaProps, Box } from '@mantine/core'; +import { Box, ScrollArea, ScrollAreaProps } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { Content } from './_content'; diff --git a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demos.story.tsx b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demos.story.tsx index 0f76a67d431..68e01633d0c 100644 --- a/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/ScrollArea/ScrollArea.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'ScrollArea' }; diff --git a/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.configurator.tsx index 8e59c1c3717..1837e4f1709 100644 --- a/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { SegmentedControl } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { SegmentedControl } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.disabled.tsx index f1b0569a030..97bbcc00dff 100644 --- a/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { SegmentedControl, Stack, Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { SegmentedControl } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.iconsOnly.tsx b/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.iconsOnly.tsx index 6a2a26be900..b32321454c0 100644 --- a/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.iconsOnly.tsx +++ b/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.iconsOnly.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { IconEye, IconCode, IconExternalLink } from '@tabler/icons-react'; +import { IconCode, IconExternalLink, IconEye } from '@tabler/icons-react'; +import { rem, SegmentedControl, VisuallyHidden } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { SegmentedControl, VisuallyHidden, rem } from '@mantine/core'; const code = ` import { SegmentedControl, VisuallyHidden, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.labels.tsx b/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.labels.tsx index d879b368163..f47aff7e366 100644 --- a/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.labels.tsx +++ b/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.labels.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { IconEye, IconCode, IconExternalLink } from '@tabler/icons-react'; +import { IconCode, IconExternalLink, IconEye } from '@tabler/icons-react'; +import { Center, rem, SegmentedControl } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Center, SegmentedControl, rem } from '@mantine/core'; const code = ` import { Center, SegmentedControl, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.readOnly.tsx b/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.readOnly.tsx index 6cc13736b87..260ad8d0b92 100644 --- a/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.readOnly.tsx +++ b/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.readOnly.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { SegmentedControl } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { SegmentedControl } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.stylesApi.tsx index 7a559353074..a3cb0470dd7 100644 --- a/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.stylesApi.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { SegmentedControl } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { SegmentedControlStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.transitions.tsx b/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.transitions.tsx index b6b6b8d1112..8a53653dc34 100644 --- a/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.transitions.tsx +++ b/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.transitions.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { SegmentedControl, Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { SegmentedControl } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.usage.tsx b/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.usage.tsx index fa277ade686..b8b18a4bdea 100644 --- a/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { SegmentedControl } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { SegmentedControl } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demos.story.tsx b/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demos.story.tsx index 837fe7e3001..3e75eb2f0e6 100644 --- a/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/SegmentedControl/SegmentedControl.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'SegmentedControl' }; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.allowDeselect.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.allowDeselect.tsx index 76501720f8b..a8ef57efe11 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.allowDeselect.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.allowDeselect.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.checkIcon.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.checkIcon.tsx index f9a3c709874..e0e9a03584c 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.checkIcon.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.checkIcon.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.clearable.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.clearable.tsx index e42fd04bc55..669f6845ed4 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.clearable.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.clearable.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.configurator.tsx index 326c84a5aec..06e7e405dcd 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { inputControls } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.disabled.tsx index df032663474..c7c079c2fb7 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.disabledOptions.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.disabledOptions.tsx index f6f9594a5de..571a47d7e77 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.disabledOptions.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.disabledOptions.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownAnimation.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownAnimation.tsx index 323abc13f88..f121bbb71cc 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownAnimation.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownAnimation.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownOffset.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownOffset.tsx index 74ba9469b17..81b613365c9 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownOffset.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownOffset.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import classes from './Select.demo.dropdownOffset.module.css'; const cssCode = `.dropdown { diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownOpened.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownOpened.tsx index fdda3dedaa2..ea41cbcee02 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownOpened.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownOpened.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { Button, Select } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { Select, Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownPadding.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownPadding.tsx index 9725cfce32e..c24a9e1dc4c 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownPadding.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownPadding.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownPosition.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownPosition.tsx index 110024087b0..b44f08956ac 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownPosition.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownPosition.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownShadow.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownShadow.tsx index b60b0917cee..688b9d8da61 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownShadow.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.dropdownShadow.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.error.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.error.tsx index 89c63c11259..da493ac7175 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.error.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.error.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.groups.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.groups.tsx index 9fb6da606b0..74c61ffc686 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.groups.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.groups.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.limit.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.limit.tsx index 4f57033e019..6d3566fd8b9 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.limit.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.limit.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.nothingFound.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.nothingFound.tsx index 62e7b80611e..1daacb3f18d 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.nothingFound.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.nothingFound.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.readOnly.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.readOnly.tsx index 27a2543e315..75376c3565d 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.readOnly.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.readOnly.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.scrollArea.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.scrollArea.tsx index 27dba98dc4f..f1525301fd9 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.scrollArea.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.scrollArea.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.search.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.search.tsx index 2adf9ad5602..04deee98008 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.search.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.search.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { ComboboxItem, OptionsFilter, Select } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Select, ComboboxItem, OptionsFilter } from '@mantine/core'; const code = ` import { Select, ComboboxItem, OptionsFilter } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.searchable.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.searchable.tsx index 9b2cc472f7d..65939a975f0 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.searchable.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.searchable.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.sections.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.sections.tsx index e0ead5320ea..103fb5ce50d 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.sections.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.sections.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Select, rem } from '@mantine/core'; import { IconComponents } from '@tabler/icons-react'; +import { rem, Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.sort.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.sort.tsx index fc48df5df2c..63144835165 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.sort.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.sort.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { ComboboxItem, OptionsFilter, Select } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Select, ComboboxItem, OptionsFilter } from '@mantine/core'; const code = ` import { Select, ComboboxItem, OptionsFilter } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.stylesApi.tsx index 63ce5a4093a..4225d44d497 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.stylesApi.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { IconAt } from '@tabler/icons-react'; -import { Select, rem } from '@mantine/core'; +import { rem, Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { SelectStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.usage.tsx index 6eff791894f..3e506d062a8 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Select } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demo.withinPopover.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demo.withinPopover.tsx index 7f0d9e3751c..33b366830d6 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demo.withinPopover.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demo.withinPopover.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Popover, Select } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Popover, Button, Select } from '@mantine/core'; const code = ` import { Popover, Button, Select } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Select/Select.demos.story.tsx b/packages/@docs/demos/src/demos/core/Select/Select.demos.story.tsx index 714009cefde..3257aa4d7b1 100644 --- a/packages/@docs/demos/src/demos/core/Select/Select.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Select/Select.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Select' }; diff --git a/packages/@docs/demos/src/demos/core/SimpleGrid/SimpleGrid.demo.responsive.tsx b/packages/@docs/demos/src/demos/core/SimpleGrid/SimpleGrid.demo.responsive.tsx index 8b3cf8b4c1a..2ff4b95b303 100644 --- a/packages/@docs/demos/src/demos/core/SimpleGrid/SimpleGrid.demo.responsive.tsx +++ b/packages/@docs/demos/src/demos/core/SimpleGrid/SimpleGrid.demo.responsive.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { SimpleGrid } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { defaultItems } from './_demo-item'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/SimpleGrid/SimpleGrid.demos.story.tsx b/packages/@docs/demos/src/demos/core/SimpleGrid/SimpleGrid.demos.story.tsx index e181ee6bbf5..d84685542f4 100644 --- a/packages/@docs/demos/src/demos/core/SimpleGrid/SimpleGrid.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/SimpleGrid/SimpleGrid.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'SimpleGrid' }; diff --git a/packages/@docs/demos/src/demos/core/SimpleGrid/_demo-item.tsx b/packages/@docs/demos/src/demos/core/SimpleGrid/_demo-item.tsx index 0a097cb514d..c7fad5ac164 100644 --- a/packages/@docs/demos/src/demos/core/SimpleGrid/_demo-item.tsx +++ b/packages/@docs/demos/src/demos/core/SimpleGrid/_demo-item.tsx @@ -1,6 +1,6 @@ import React from 'react'; import cx from 'clsx'; -import { Box, Text, BoxProps, ElementProps } from '@mantine/core'; +import { Box, BoxProps, ElementProps, Text } from '@mantine/core'; import classes from './_item.module.css'; interface GridItemProps extends BoxProps, ElementProps<'div'> {} diff --git a/packages/@docs/demos/src/demos/core/Skeleton/Skeleton.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Skeleton/Skeleton.demo.configurator.tsx index db2dd1ea97c..a6342c6cdc9 100644 --- a/packages/@docs/demos/src/demos/core/Skeleton/Skeleton.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Skeleton/Skeleton.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Skeleton, SkeletonProps } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; function Wrapper(props: Partial) { return ( diff --git a/packages/@docs/demos/src/demos/core/Skeleton/Skeleton.demo.content.tsx b/packages/@docs/demos/src/demos/core/Skeleton/Skeleton.demo.content.tsx index d20ac8aa06f..b5a1bd29079 100644 --- a/packages/@docs/demos/src/demos/core/Skeleton/Skeleton.demo.content.tsx +++ b/packages/@docs/demos/src/demos/core/Skeleton/Skeleton.demo.content.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Button, Group, Skeleton, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Group, Button, Text, Skeleton } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Skeleton/Skeleton.demos.story.tsx b/packages/@docs/demos/src/demos/core/Skeleton/Skeleton.demos.story.tsx index 6e1fa97f4b0..dbb45efff3e 100644 --- a/packages/@docs/demos/src/demos/core/Skeleton/Skeleton.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Skeleton/Skeleton.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Skeleton' }; diff --git a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.changeEnd.tsx b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.changeEnd.tsx index 425f6a11ab6..16f5cefd782 100644 --- a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.changeEnd.tsx +++ b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.changeEnd.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Box, Slider, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Slider, Text, Box } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.configurator.tsx index 2f7ffa85736..09c77913bba 100644 --- a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Slider } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; function Wrapper(props: any) { return ( diff --git a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.customize.tsx b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.customize.tsx index 8127f2e8995..430def15c88 100644 --- a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.customize.tsx +++ b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.customize.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Box, Slider } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Slider, Box } from '@mantine/core'; import classes from './Slider.demo.customize.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.decimal.tsx b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.decimal.tsx index 43339405743..a241fc70a58 100644 --- a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.decimal.tsx +++ b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.decimal.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Slider } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Slider } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.decimalRange.tsx b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.decimalRange.tsx index 69a77f7d02a..1560b90fa01 100644 --- a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.decimalRange.tsx +++ b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.decimalRange.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { RangeSlider } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { RangeSlider } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.disabled.tsx index feb3694a8ac..13d5cef4dce 100644 --- a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Box, RangeSlider, Slider } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Slider, RangeSlider, Box } from '@mantine/core'; const code = ` import { Slider, RangeSlider } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.inverted.tsx b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.inverted.tsx index e077cf68160..7c4b9880e46 100644 --- a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.inverted.tsx +++ b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.inverted.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { RangeSlider, Slider } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { RangeSlider, Slider } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.label.tsx b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.label.tsx index 56cf7d15bcd..56097de91cc 100644 --- a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.label.tsx +++ b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.label.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Slider, Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Slider, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.marks.tsx b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.marks.tsx index 10bb96cf44f..c604fe566fe 100644 --- a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.marks.tsx +++ b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.marks.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { RangeSlider, Slider } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Slider, RangeSlider } from '@mantine/core'; const code = ` import { Slider, RangeSlider } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.scale.tsx b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.scale.tsx index b023a8a84a6..fe4502da934 100644 --- a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.scale.tsx +++ b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.scale.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { RangeSlider, Slider } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { RangeSlider, Slider } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.step.tsx b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.step.tsx index 6bced44d763..e86f97ede65 100644 --- a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.step.tsx +++ b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.step.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Slider, Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Slider, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.stylesApi.tsx index b5c195d3bea..f9efa06ec35 100644 --- a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.stylesApi.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Slider } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { SliderStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.thumbChildren.tsx b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.thumbChildren.tsx index f25fcd4b888..fdaf51c0591 100644 --- a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.thumbChildren.tsx +++ b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.thumbChildren.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { Slider, RangeSlider, rem } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { IconHeart, IconHeartBroken } from '@tabler/icons-react'; +import { RangeSlider, rem, Slider } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Slider, RangeSlider, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.thumbSize.tsx b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.thumbSize.tsx index f73d50c8c63..bc2237172b7 100644 --- a/packages/@docs/demos/src/demos/core/Slider/Slider.demo.thumbSize.tsx +++ b/packages/@docs/demos/src/demos/core/Slider/Slider.demo.thumbSize.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Slider } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; function Wrapper(props: any) { return ; diff --git a/packages/@docs/demos/src/demos/core/Slider/Slider.demos.story.tsx b/packages/@docs/demos/src/demos/core/Slider/Slider.demos.story.tsx index 510bce876cf..933538a4dbc 100644 --- a/packages/@docs/demos/src/demos/core/Slider/Slider.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Slider/Slider.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Slider' }; diff --git a/packages/@docs/demos/src/demos/core/Space/Space.demo.horizontal.tsx b/packages/@docs/demos/src/demos/core/Space/Space.demo.horizontal.tsx index 165735540ad..baa804c2a72 100644 --- a/packages/@docs/demos/src/demos/core/Space/Space.demo.horizontal.tsx +++ b/packages/@docs/demos/src/demos/core/Space/Space.demo.horizontal.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Space, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Text, Space } from '@mantine/core'; function Wrapper(props: any) { return ( diff --git a/packages/@docs/demos/src/demos/core/Space/Space.demo.vertical.tsx b/packages/@docs/demos/src/demos/core/Space/Space.demo.vertical.tsx index 88e6b9d4d0e..adc33abb716 100644 --- a/packages/@docs/demos/src/demos/core/Space/Space.demo.vertical.tsx +++ b/packages/@docs/demos/src/demos/core/Space/Space.demo.vertical.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Space, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Text, Space } from '@mantine/core'; function Wrapper(props: any) { return ( diff --git a/packages/@docs/demos/src/demos/core/Space/Space.demos.story.tsx b/packages/@docs/demos/src/demos/core/Space/Space.demos.story.tsx index ea3f3e24ea6..b95ac48870d 100644 --- a/packages/@docs/demos/src/demos/core/Space/Space.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Space/Space.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Space' }; diff --git a/packages/@docs/demos/src/demos/core/Spoiler/Spoiler.demos.story.tsx b/packages/@docs/demos/src/demos/core/Spoiler/Spoiler.demos.story.tsx index 8057f0c7d41..04291885da5 100644 --- a/packages/@docs/demos/src/demos/core/Spoiler/Spoiler.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Spoiler/Spoiler.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Spoiler' }; diff --git a/packages/@docs/demos/src/demos/core/Spoiler/_wrapper.tsx b/packages/@docs/demos/src/demos/core/Spoiler/_wrapper.tsx index d69655d69a7..1f4fee4d260 100644 --- a/packages/@docs/demos/src/demos/core/Spoiler/_wrapper.tsx +++ b/packages/@docs/demos/src/demos/core/Spoiler/_wrapper.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Text, Box, Spoiler, SpoilerProps } from '@mantine/core'; +import { Box, Spoiler, SpoilerProps, Text } from '@mantine/core'; const content = (
diff --git a/packages/@docs/demos/src/demos/core/Stack/Stack.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Stack/Stack.demo.configurator.tsx index 6c7bc140095..f1f6e0a0ae1 100644 --- a/packages/@docs/demos/src/demos/core/Stack/Stack.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Stack/Stack.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Stack, StackProps } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Stack, StackProps, Button } from '@mantine/core'; function Wrapper(props: StackProps) { return ( diff --git a/packages/@docs/demos/src/demos/core/Stack/Stack.demos.story.tsx b/packages/@docs/demos/src/demos/core/Stack/Stack.demos.story.tsx index b08ce4e3930..8eb25ac5046 100644 --- a/packages/@docs/demos/src/demos/core/Stack/Stack.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Stack/Stack.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Stack' }; diff --git a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.allowNextStepsSelect.tsx b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.allowNextStepsSelect.tsx index 754de39f08a..40de571cc0a 100644 --- a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.allowNextStepsSelect.tsx +++ b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.allowNextStepsSelect.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Stepper, Button, Group } from '@mantine/core'; +import { Button, Group, Stepper } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { Content } from './_content'; diff --git a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.allowStepSelect.tsx b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.allowStepSelect.tsx index e0df0bf3842..cc2457d70de 100644 --- a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.allowStepSelect.tsx +++ b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.allowStepSelect.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Stepper, Button, Group } from '@mantine/core'; +import { Button, Group, Stepper } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { Content } from './_content'; diff --git a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.configurator.tsx index 3d7cfcd39b9..ea0fc6efabe 100644 --- a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Stepper, StepperProps } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; function Wrapper(props: Partial) { return ( diff --git a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.iconPosition.tsx b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.iconPosition.tsx index b9b57ffc087..56a0b63d52b 100644 --- a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.iconPosition.tsx +++ b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.iconPosition.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Stepper } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.iconSizeConfigurator.tsx b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.iconSizeConfigurator.tsx index 86559b81d4c..c6b9089482b 100644 --- a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.iconSizeConfigurator.tsx +++ b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.iconSizeConfigurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Stepper, StepperProps } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; function Wrapper(props: Partial) { return ( diff --git a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.icons.tsx b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.icons.tsx index 7244b03d538..2bdf07eb189 100644 --- a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.icons.tsx +++ b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.icons.tsx @@ -1,12 +1,12 @@ import React, { useState } from 'react'; import { - IconUserCheck, + IconCircleCheck, IconMailOpened, IconShieldCheck, - IconCircleCheck, + IconUserCheck, } from '@tabler/icons-react'; +import { rem, Stepper } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Stepper, rem } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.iconsOnly.tsx b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.iconsOnly.tsx index 0c79e682ed3..97c10618df9 100644 --- a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.iconsOnly.tsx +++ b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.iconsOnly.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { IconUserCheck, IconMailOpened, IconShieldCheck } from '@tabler/icons-react'; +import { IconMailOpened, IconShieldCheck, IconUserCheck } from '@tabler/icons-react'; +import { rem, Stepper } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Stepper, rem } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.loading.tsx b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.loading.tsx index ada0c12f2bf..1c0eb6db8a3 100644 --- a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.loading.tsx +++ b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.loading.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Stepper } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Stepper } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.orientation.tsx b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.orientation.tsx index f35b29a3ab4..890b66c4c55 100644 --- a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.orientation.tsx +++ b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.orientation.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Stepper } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.stepColor.tsx b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.stepColor.tsx index a8b01cbcbcb..b1cb479a5e4 100644 --- a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.stepColor.tsx +++ b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.stepColor.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { IconCircleX } from '@tabler/icons-react'; +import { rem, Stepper } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Stepper, rem } from '@mantine/core'; const code = ` import { Stepper, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.stylesApi.tsx index 5e25c7091c5..1d07e393fd4 100644 --- a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.stylesApi.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button, Group, Stepper } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { StepperStylesApi } from '@docs/styles-api'; import { Content } from './_content'; diff --git a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.stylesApi2.tsx b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.stylesApi2.tsx index 113a557c388..c29b8deaf29 100644 --- a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.stylesApi2.tsx +++ b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.stylesApi2.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { rem, Stepper, StepperProps } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Stepper, StepperProps, rem } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.stylesApi3.tsx b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.stylesApi3.tsx index 43a2ef1cce2..3829a09d5b7 100644 --- a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.stylesApi3.tsx +++ b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.stylesApi3.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Stepper } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import classes from './Stepper.demo.stylesApi3.module.css'; const cssCode = `.separator { diff --git a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.usage.tsx index 0a4f5f0deed..f24355c34be 100644 --- a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demo.usage.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Stepper, Button, Group } from '@mantine/core'; +import { Button, Group, Stepper } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { Content } from './_content'; diff --git a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demos.story.tsx b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demos.story.tsx index 3b37e5f4c41..f757466b9ae 100644 --- a/packages/@docs/demos/src/demos/core/Stepper/Stepper.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Stepper/Stepper.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Stepper' }; diff --git a/packages/@docs/demos/src/demos/core/Switch/Switch.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Switch/Switch.demo.configurator.tsx index 040569e321a..a5866da6f6c 100644 --- a/packages/@docs/demos/src/demos/core/Switch/Switch.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Switch/Switch.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Switch } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Switch } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Switch/Switch.demo.groupConfigurator.tsx b/packages/@docs/demos/src/demos/core/Switch/Switch.demo.groupConfigurator.tsx index d9c64dbf622..683baa20cb9 100644 --- a/packages/@docs/demos/src/demos/core/Switch/Switch.demo.groupConfigurator.tsx +++ b/packages/@docs/demos/src/demos/core/Switch/Switch.demo.groupConfigurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Group, Switch, SwitchGroupProps } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { SwitchGroupProps, Switch, Group } from '@mantine/core'; const code = ` import { Switch, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Switch/Switch.demo.iconLabels.tsx b/packages/@docs/demos/src/demos/core/Switch/Switch.demo.iconLabels.tsx index 88514a06805..3d20c21a9eb 100644 --- a/packages/@docs/demos/src/demos/core/Switch/Switch.demo.iconLabels.tsx +++ b/packages/@docs/demos/src/demos/core/Switch/Switch.demo.iconLabels.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { IconMoonStars, IconSun } from '@tabler/icons-react'; +import { rem, Switch, useMantineTheme } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Switch, useMantineTheme, rem } from '@mantine/core'; -import { IconSun, IconMoonStars } from '@tabler/icons-react'; const code = ` import { Switch, useMantineTheme, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Switch/Switch.demo.labels.tsx b/packages/@docs/demos/src/demos/core/Switch/Switch.demo.labels.tsx index 10fa8c3d35a..a79212875aa 100644 --- a/packages/@docs/demos/src/demos/core/Switch/Switch.demo.labels.tsx +++ b/packages/@docs/demos/src/demos/core/Switch/Switch.demo.labels.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Group, Switch } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Switch, Group } from '@mantine/core'; const code = ` import { Switch, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Switch/Switch.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Switch/Switch.demo.stylesApi.tsx index 22e22ef2641..72b51e43ad7 100644 --- a/packages/@docs/demos/src/demos/core/Switch/Switch.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Switch/Switch.demo.stylesApi.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Switch } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { SwitchStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Switch/Switch.demo.thumbIcon.tsx b/packages/@docs/demos/src/demos/core/Switch/Switch.demo.thumbIcon.tsx index e4d58342f3e..25fa808e041 100644 --- a/packages/@docs/demos/src/demos/core/Switch/Switch.demo.thumbIcon.tsx +++ b/packages/@docs/demos/src/demos/core/Switch/Switch.demo.thumbIcon.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Switch, useMantineTheme, rem } from '@mantine/core'; import { IconCheck, IconX } from '@tabler/icons-react'; +import { rem, Switch, useMantineTheme } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Switch/Switch.demo.tooltip.tsx b/packages/@docs/demos/src/demos/core/Switch/Switch.demo.tooltip.tsx index 1430f396a10..9b6b2bffb94 100644 --- a/packages/@docs/demos/src/demos/core/Switch/Switch.demo.tooltip.tsx +++ b/packages/@docs/demos/src/demos/core/Switch/Switch.demo.tooltip.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Switch, Tooltip } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Switch, Tooltip } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Switch/Switch.demos.story.tsx b/packages/@docs/demos/src/demos/core/Switch/Switch.demos.story.tsx index 4c9edbf0af5..eb9af24575a 100644 --- a/packages/@docs/demos/src/demos/core/Switch/Switch.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Switch/Switch.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Switch' }; diff --git a/packages/@docs/demos/src/demos/core/Table/Table.demo.data.tsx b/packages/@docs/demos/src/demos/core/Table/Table.demo.data.tsx index 3c28fbe02cf..1b6d687e71d 100644 --- a/packages/@docs/demos/src/demos/core/Table/Table.demo.data.tsx +++ b/packages/@docs/demos/src/demos/core/Table/Table.demo.data.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Table, TableData } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Table, TableData } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Table/Table.demo.rowSelection.tsx b/packages/@docs/demos/src/demos/core/Table/Table.demo.rowSelection.tsx index 941980954ff..de4875d9237 100644 --- a/packages/@docs/demos/src/demos/core/Table/Table.demo.rowSelection.tsx +++ b/packages/@docs/demos/src/demos/core/Table/Table.demo.rowSelection.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Checkbox, Table } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Table, Checkbox } from '@mantine/core'; const code = ` import { Table, Checkbox } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Table/Table.demos.story.tsx b/packages/@docs/demos/src/demos/core/Table/Table.demos.story.tsx index 5f9327a0eff..2022e966c6d 100644 --- a/packages/@docs/demos/src/demos/core/Table/Table.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Table/Table.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Table' }; diff --git a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.colors.tsx b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.colors.tsx index 88a5200ad67..0a18bc17c6e 100644 --- a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.colors.tsx +++ b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.colors.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Tabs } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Tabs } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.customize.tsx b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.customize.tsx index 18aa03cc585..d5b71af1f04 100644 --- a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.customize.tsx +++ b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.customize.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { IconMessageCircle, IconPhoto, IconSettings } from '@tabler/icons-react'; +import { rem, Tabs } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Tabs, rem } from '@mantine/core'; -import { IconPhoto, IconMessageCircle, IconSettings } from '@tabler/icons-react'; import classes from './Tabs.demo.customize.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.deactivate.tsx b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.deactivate.tsx index a3a25adef9a..1fc89f341f8 100644 --- a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.deactivate.tsx +++ b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.deactivate.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Tabs } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Tabs } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.disabled.tsx index 1d400d92c55..e99201bcf29 100644 --- a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Tabs } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Tabs } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.inverted.tsx b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.inverted.tsx index 159105d1716..be842c18901 100644 --- a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.inverted.tsx +++ b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.inverted.tsx @@ -1,7 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; - import { Tabs } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Tabs } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.keyboardActivation.tsx b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.keyboardActivation.tsx index 9aeba7e5b5a..2a2654a3162 100644 --- a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.keyboardActivation.tsx +++ b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.keyboardActivation.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Tabs } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Tabs } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.placement.tsx b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.placement.tsx index e5e05a26db0..90c1ebec8e0 100644 --- a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.placement.tsx +++ b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.placement.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Tabs, TabsProps } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; function Wrapper(props: TabsProps) { const panelProps = props.placement === 'left' ? { pl: 'xs' } : { pr: 'xs' }; diff --git a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.position.tsx b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.position.tsx index 85515b7c55b..de6c37a4759 100644 --- a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.position.tsx +++ b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.position.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Tabs, TabsListProps } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; function Wrapper(props: TabsListProps) { return ( diff --git a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.pull.tsx b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.pull.tsx index 6af995cae71..31d3219ee01 100644 --- a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.pull.tsx +++ b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.pull.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Tabs } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Tabs } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.stylesApi.tsx index 07b0fc13726..ca0fea49e71 100644 --- a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.stylesApi.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { IconMessageCircle, IconPhoto, IconSettings } from '@tabler/icons-react'; +import { rem, Tabs, TabsProps } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Tabs, TabsProps, rem } from '@mantine/core'; -import { IconPhoto, IconMessageCircle, IconSettings } from '@tabler/icons-react'; import { TabsStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.usage.tsx index eb9cbba45e4..86d695834ff 100644 --- a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { IconPhoto, IconMessageCircle, IconSettings } from '@tabler/icons-react'; +import { IconMessageCircle, IconPhoto, IconSettings } from '@tabler/icons-react'; +import { rem, Tabs, TabsProps, useDirection } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Tabs, TabsProps, rem, useDirection } from '@mantine/core'; function Wrapper(props: TabsProps) { const { dir } = useDirection(); diff --git a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demos.story.tsx b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demos.story.tsx index bc91f376b49..fe2a183344d 100644 --- a/packages/@docs/demos/src/demos/core/Tabs/Tabs.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Tabs/Tabs.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Tabs' }; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.allowDuplicates.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.allowDuplicates.tsx index 2f9f8a69b1d..3af05649ea1 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.allowDuplicates.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.allowDuplicates.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.clearable.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.clearable.tsx index 4e5c76409ec..b2b22e20fe0 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.clearable.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.clearable.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.configurator.tsx index 4cc5754f7ed..1b8baec4095 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { inputControls } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.data.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.data.tsx index 879829f26ab..135b5175bbb 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.data.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.data.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.disabled.tsx index 585d45de0c6..208e2c3072b 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.disabledOptions.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.disabledOptions.tsx index 63592e93a8a..373d680fc86 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.disabledOptions.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.disabledOptions.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownAnimation.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownAnimation.tsx index 89db696bf88..5bcb57cb285 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownAnimation.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownAnimation.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownOpened.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownOpened.tsx index 69fcc75ab82..652e6cad437 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownOpened.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownOpened.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { Button, TagsInput } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { TagsInput, Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownPadding.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownPadding.tsx index 72f181a3a3f..ded198e66b1 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownPadding.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownPadding.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownPosition.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownPosition.tsx index f6584c99af3..8c9f153f9a7 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownPosition.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownPosition.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownShadow.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownShadow.tsx index 946138e30d3..f49b55ce90d 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownShadow.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.dropdownShadow.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.error.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.error.tsx index 0e0cb107c0a..05bc6f49bc3 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.error.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.error.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.groups.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.groups.tsx index 7d915c042af..993813ebb19 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.groups.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.groups.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.limit.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.limit.tsx index e512038800a..8c6fd573a5c 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.limit.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.limit.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.maxTags.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.maxTags.tsx index 71e67d415c8..23445822962 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.maxTags.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.maxTags.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.readOnly.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.readOnly.tsx index e95d96d191d..6962eacc077 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.readOnly.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.readOnly.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.scrollArea.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.scrollArea.tsx index 54b75619311..60d5e7de638 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.scrollArea.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.scrollArea.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.search.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.search.tsx index 3e9c857e1ed..a4303c681b9 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.search.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.search.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { ComboboxItem, OptionsFilter, TagsInput } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { TagsInput, ComboboxItem, OptionsFilter } from '@mantine/core'; const code = ` import { TagsInput, ComboboxItem, OptionsFilter } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.sections.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.sections.tsx index 45c6d680bb2..2c941051743 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.sections.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.sections.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { TagsInput, rem } from '@mantine/core'; import { IconComponents } from '@tabler/icons-react'; +import { rem, TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.sort.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.sort.tsx index 916c5feefe5..aa0496a9c20 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.sort.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.sort.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { ComboboxItem, OptionsFilter, TagsInput } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { TagsInput, ComboboxItem, OptionsFilter } from '@mantine/core'; const code = ` import { TagsInput, ComboboxItem, OptionsFilter } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.splitChars.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.splitChars.tsx index 920ccdbe33f..e47df099ab8 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.splitChars.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.splitChars.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.stylesApi.tsx index c69b4cb1878..5f70c810caa 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.stylesApi.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { IconAt } from '@tabler/icons-react'; -import { TagsInput, rem } from '@mantine/core'; +import { rem, TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { TagsInputStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.usage.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.usage.tsx index f8f644ac02b..4a37e826654 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TagsInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TagsInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.withinPopover.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.withinPopover.tsx index 361d04adc84..d26c8b9833b 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.withinPopover.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demo.withinPopover.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Popover, TagsInput } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Popover, Button, TagsInput } from '@mantine/core'; const code = ` import { Popover, Button, TagsInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demos.story.tsx b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demos.story.tsx index 6861a84a8e8..76ae3b33e53 100644 --- a/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/TagsInput/TagsInput.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'TagsInput' }; diff --git a/packages/@docs/demos/src/demos/core/Text/Text.demo.gradient.tsx b/packages/@docs/demos/src/demos/core/Text/Text.demo.gradient.tsx index 89809dbff42..353b159311e 100644 --- a/packages/@docs/demos/src/demos/core/Text/Text.demo.gradient.tsx +++ b/packages/@docs/demos/src/demos/core/Text/Text.demo.gradient.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { gradientControls } from '../../../shared'; const code = (props: any) => ` diff --git a/packages/@docs/demos/src/demos/core/Text/Text.demo.inherit.tsx b/packages/@docs/demos/src/demos/core/Text/Text.demo.inherit.tsx index 1e2b145eb12..e96dd6182d8 100644 --- a/packages/@docs/demos/src/demos/core/Text/Text.demo.inherit.tsx +++ b/packages/@docs/demos/src/demos/core/Text/Text.demo.inherit.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Text, Title } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Text, Title } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Text/Text.demo.lineClamp.tsx b/packages/@docs/demos/src/demos/core/Text/Text.demo.lineClamp.tsx index 0dc543a0d41..846188952be 100644 --- a/packages/@docs/demos/src/demos/core/Text/Text.demo.lineClamp.tsx +++ b/packages/@docs/demos/src/demos/core/Text/Text.demo.lineClamp.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Text, TypographyStylesProvider } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { TypographyStylesProvider, Text } from '@mantine/core'; const code = ` import { TypographyStylesProvider, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Text/Text.demo.linesConfigurator.tsx b/packages/@docs/demos/src/demos/core/Text/Text.demo.linesConfigurator.tsx index bc889616de8..0b934f1c1bd 100644 --- a/packages/@docs/demos/src/demos/core/Text/Text.demo.linesConfigurator.tsx +++ b/packages/@docs/demos/src/demos/core/Text/Text.demo.linesConfigurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Box, Text, TextProps } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Text, TextProps, Box } from '@mantine/core'; function Wrapper(props: TextProps) { return ( diff --git a/packages/@docs/demos/src/demos/core/Text/Text.demo.truncate.tsx b/packages/@docs/demos/src/demos/core/Text/Text.demo.truncate.tsx index 36c5bbabde0..84c8da2e092 100644 --- a/packages/@docs/demos/src/demos/core/Text/Text.demo.truncate.tsx +++ b/packages/@docs/demos/src/demos/core/Text/Text.demo.truncate.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Box, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Text, Box } from '@mantine/core'; const code = ` import { Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Text/Text.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Text/Text.demo.usage.tsx index 9fb4119a9b5..f87f7038cea 100644 --- a/packages/@docs/demos/src/demos/core/Text/Text.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Text/Text.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Text/Text.demos.story.tsx b/packages/@docs/demos/src/demos/core/Text/Text.demos.story.tsx index 0e240e99d14..87664c89945 100644 --- a/packages/@docs/demos/src/demos/core/Text/Text.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Text/Text.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Text' }; diff --git a/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.disabled.tsx index 7cc378bb1ac..518d2511a0d 100644 --- a/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TextInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TextInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.error.tsx b/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.error.tsx index 6d415c0bf4e..9c468ffd710 100644 --- a/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.error.tsx +++ b/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.error.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TextInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TextInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.sections.tsx b/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.sections.tsx index 6015a52f2c4..3ae7df6ca45 100644 --- a/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.sections.tsx +++ b/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.sections.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { TextInput, rem } from '@mantine/core'; import { IconAt } from '@tabler/icons-react'; +import { rem, TextInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TextInput, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.stylesApi.tsx index 686db757e85..00998c2c6e0 100644 --- a/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.stylesApi.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { TextInput, rem } from '@mantine/core'; import { IconAt } from '@tabler/icons-react'; +import { rem, TextInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { TextInputStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.type.tsx b/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.type.tsx index 5000b415a2f..f9037eb073d 100644 --- a/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.type.tsx +++ b/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.type.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TextInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TextInput } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.usage.tsx b/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.usage.tsx index d22f3d3d6aa..1f3c1405830 100644 --- a/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/TextInput/TextInput.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TextInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { inputControls } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/TextInput/TextInput.demos.story.tsx b/packages/@docs/demos/src/demos/core/TextInput/TextInput.demos.story.tsx index 731dd6748a3..195e2bf54f8 100644 --- a/packages/@docs/demos/src/demos/core/TextInput/TextInput.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/TextInput/TextInput.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'TextInput' }; diff --git a/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.autosize.tsx b/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.autosize.tsx index 652b01c28f9..aa30deb88f7 100644 --- a/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.autosize.tsx +++ b/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.autosize.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Textarea } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Textarea } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.configurator.tsx index e95a2ff24fe..6c0db2749aa 100644 --- a/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Textarea } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { inputControls } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.disabled.tsx b/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.disabled.tsx index e943323f663..d380a867116 100644 --- a/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.disabled.tsx @@ -1,6 +1,6 @@ +import React from 'react'; import { Box, Textarea } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import React from 'react'; const code = ` import { Textarea } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.error.tsx b/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.error.tsx index ffdda1638f7..873de39b2b2 100644 --- a/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.error.tsx +++ b/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.error.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Textarea } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Textarea } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.stylesApi.tsx index c9324d60804..9412f646a78 100644 --- a/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/core/Textarea/Textarea.demo.stylesApi.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Textarea, rem } from '@mantine/core'; import { IconAt } from '@tabler/icons-react'; +import { rem, Textarea } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { TextareaStylesApi } from '@docs/styles-api'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Textarea/Textarea.demos.story.tsx b/packages/@docs/demos/src/demos/core/Textarea/Textarea.demos.story.tsx index a04a9d843c8..d2451d08bae 100644 --- a/packages/@docs/demos/src/demos/core/Textarea/Textarea.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Textarea/Textarea.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Textarea' }; diff --git a/packages/@docs/demos/src/demos/core/ThemeIcon/ThemeIcon.demo.gradient.tsx b/packages/@docs/demos/src/demos/core/ThemeIcon/ThemeIcon.demo.gradient.tsx index 1a80e7d0444..2754cef2a92 100644 --- a/packages/@docs/demos/src/demos/core/ThemeIcon/ThemeIcon.demo.gradient.tsx +++ b/packages/@docs/demos/src/demos/core/ThemeIcon/ThemeIcon.demo.gradient.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { ThemeIcon } from '@mantine/core'; import { IconHeart } from '@tabler/icons-react'; +import { ThemeIcon } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { gradientControls } from '../../../shared'; const code = (props: any) => ` diff --git a/packages/@docs/demos/src/demos/core/ThemeIcon/ThemeIcon.demo.usage.tsx b/packages/@docs/demos/src/demos/core/ThemeIcon/ThemeIcon.demo.usage.tsx index 5372c41a254..2b7923f3cce 100644 --- a/packages/@docs/demos/src/demos/core/ThemeIcon/ThemeIcon.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/ThemeIcon/ThemeIcon.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { IconPhoto } from '@tabler/icons-react'; -import { MantineDemo } from '@mantinex/demo'; import { ThemeIcon, ThemeIconProps } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; function Wrapper(props: ThemeIconProps) { return ( diff --git a/packages/@docs/demos/src/demos/core/ThemeIcon/ThemeIcon.demos.story.tsx b/packages/@docs/demos/src/demos/core/ThemeIcon/ThemeIcon.demos.story.tsx index d94b5390efd..0655ddf8842 100644 --- a/packages/@docs/demos/src/demos/core/ThemeIcon/ThemeIcon.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/ThemeIcon/ThemeIcon.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'ThemeIcon' }; diff --git a/packages/@docs/demos/src/demos/core/Timeline/Timeline.demo.bullet.tsx b/packages/@docs/demos/src/demos/core/Timeline/Timeline.demo.bullet.tsx index 34470e30e9c..a1835472f2d 100644 --- a/packages/@docs/demos/src/demos/core/Timeline/Timeline.demo.bullet.tsx +++ b/packages/@docs/demos/src/demos/core/Timeline/Timeline.demo.bullet.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { ThemeIcon, Text, Avatar, Timeline } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { IconSun, IconVideo } from '@tabler/icons-react'; +import { Avatar, Text, ThemeIcon, Timeline } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ThemeIcon, Text, Avatar, Timeline } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Timeline/Timeline.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Timeline/Timeline.demo.configurator.tsx index 6f62370dcda..6b284b82349 100644 --- a/packages/@docs/demos/src/demos/core/Timeline/Timeline.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Timeline/Timeline.demo.configurator.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { TimelineProps, Box } from '@mantine/core'; +import { Box, TimelineProps } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; import { TimelineBase } from './_base'; diff --git a/packages/@docs/demos/src/demos/core/Timeline/Timeline.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Timeline/Timeline.demo.usage.tsx index 3eef7d9f6ee..782df3c8f1e 100644 --- a/packages/@docs/demos/src/demos/core/Timeline/Timeline.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Timeline/Timeline.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Box } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { TimelineBase } from './_base'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Timeline/Timeline.demos.story.tsx b/packages/@docs/demos/src/demos/core/Timeline/Timeline.demos.story.tsx index 158834f1646..a718fad74a4 100644 --- a/packages/@docs/demos/src/demos/core/Timeline/Timeline.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Timeline/Timeline.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Timeline' }; diff --git a/packages/@docs/demos/src/demos/core/Timeline/_base.tsx b/packages/@docs/demos/src/demos/core/Timeline/_base.tsx index e2b54062c92..af1a58ea09e 100644 --- a/packages/@docs/demos/src/demos/core/Timeline/_base.tsx +++ b/packages/@docs/demos/src/demos/core/Timeline/_base.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { IconGitBranch, - IconGitPullRequest, IconGitCommit, + IconGitPullRequest, IconMessageDots, } from '@tabler/icons-react'; import { Text, Timeline, TimelineProps } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Title/Title.demo.lineClamp.tsx b/packages/@docs/demos/src/demos/core/Title/Title.demo.lineClamp.tsx index cf66a1ce1d4..ff6fe00626d 100644 --- a/packages/@docs/demos/src/demos/core/Title/Title.demo.lineClamp.tsx +++ b/packages/@docs/demos/src/demos/core/Title/Title.demo.lineClamp.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Box, Title } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Title, Box } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Title/Title.demo.size.tsx b/packages/@docs/demos/src/demos/core/Title/Title.demo.size.tsx index 7e3e71f872c..30b464df04f 100644 --- a/packages/@docs/demos/src/demos/core/Title/Title.demo.size.tsx +++ b/packages/@docs/demos/src/demos/core/Title/Title.demo.size.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Title } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Title } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Title/Title.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Title/Title.demo.usage.tsx index c99e05ac9bb..57fb939c8f4 100644 --- a/packages/@docs/demos/src/demos/core/Title/Title.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Title/Title.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Title } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Title } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Title/Title.demos.story.tsx b/packages/@docs/demos/src/demos/core/Title/Title.demos.story.tsx index 76949d47cc3..cf0a860c79d 100644 --- a/packages/@docs/demos/src/demos/core/Title/Title.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Title/Title.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Title' }; diff --git a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.arrow.tsx b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.arrow.tsx index 7ab284b0c59..d0111f2ca34 100644 --- a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.arrow.tsx +++ b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.arrow.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Tooltip } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Tooltip, Button } from '@mantine/core'; const code = ` import { Tooltip, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.configurator.tsx b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.configurator.tsx index 00fe8ade3e9..bc50d63fe86 100644 --- a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.configurator.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Tooltip, Button } from '@mantine/core'; +import { Button, Tooltip } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; function Wrapper(props: any) { diff --git a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.controlled.tsx b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.controlled.tsx index f8983ddc7e2..27a0c475138 100644 --- a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.controlled.tsx +++ b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.controlled.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; +import { Button, Tooltip } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Tooltip, Button } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.delay.tsx b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.delay.tsx index 9454ec01941..e06cf76c2b3 100644 --- a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.delay.tsx +++ b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.delay.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Group, Tooltip } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Tooltip, Button, Group } from '@mantine/core'; const code = ` import { Button, Tooltip, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.floating.tsx b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.floating.tsx index 9457eb8e9e2..9be1f49bd51 100644 --- a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.floating.tsx +++ b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.floating.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Box, Tooltip } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Box, Tooltip } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.group.tsx b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.group.tsx index 6d7f953df47..b0109cbec32 100644 --- a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.group.tsx +++ b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.group.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Group, Tooltip } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Tooltip, Button, Group } from '@mantine/core'; const code = ` import { Tooltip, Button, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.inline.tsx b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.inline.tsx index 73101bfa8ff..a1fa01e3892 100644 --- a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.inline.tsx +++ b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.inline.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Mark, Text, Tooltip } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Tooltip, Mark, Text } from '@mantine/core'; const code = ` import { Tooltip, Mark, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.multiline.tsx b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.multiline.tsx index 0ad6311d59a..e7d2ee1420f 100644 --- a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.multiline.tsx +++ b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.multiline.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Tooltip } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Tooltip, Button } from '@mantine/core'; const code = ` import { Tooltip, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.nested.tsx b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.nested.tsx index b9231807110..a1ee9d86a90 100644 --- a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.nested.tsx +++ b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.nested.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Tooltip } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Tooltip, Button } from '@mantine/core'; const code = ` import { Tooltip, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.offset.tsx b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.offset.tsx index a3e66ff8824..dadce22b118 100644 --- a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.offset.tsx +++ b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.offset.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Tooltip } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Tooltip, Button } from '@mantine/core'; import { FLOATING_POSITION_DATA } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.offsetAxis.tsx b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.offsetAxis.tsx index 6dc885240d1..9b666ce85da 100644 --- a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.offsetAxis.tsx +++ b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.offsetAxis.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Tooltip } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Tooltip, Button } from '@mantine/core'; import { FLOATING_POSITION_DATA } from '../../../shared'; const code = (props: any) => ` diff --git a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.transitions.tsx b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.transitions.tsx index be74d51a8d7..2f7e5771b01 100644 --- a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.transitions.tsx +++ b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.transitions.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Badge, Group, keys, MANTINE_TRANSITIONS, Tooltip } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Tooltip, Badge, Group, keys, MANTINE_TRANSITIONS } from '@mantine/core'; export function Demo() { const transitions = keys(MANTINE_TRANSITIONS).map((transition) => ( diff --git a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.usage.tsx b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.usage.tsx index 7ab9b138d36..163e829e75b 100644 --- a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Tooltip } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Tooltip, Button } from '@mantine/core'; const code = ` import { Tooltip, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demos.story.tsx b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demos.story.tsx index ca79d9c33dc..bf17705975b 100644 --- a/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Tooltip/Tooltip.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Tooltip' }; diff --git a/packages/@docs/demos/src/demos/core/Transition/Transition.demo.custom.tsx b/packages/@docs/demos/src/demos/core/Transition/Transition.demo.custom.tsx index c29a1e59475..202fa7e5577 100644 --- a/packages/@docs/demos/src/demos/core/Transition/Transition.demo.custom.tsx +++ b/packages/@docs/demos/src/demos/core/Transition/Transition.demo.custom.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { Box, Button, Paper, Transition } from '@mantine/core'; import { useClickOutside } from '@mantine/hooks'; -import { Transition, Paper, Button, Box } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/core/Transition/Transition.demos.story.tsx b/packages/@docs/demos/src/demos/core/Transition/Transition.demos.story.tsx index 608ab6709fd..d76661b6b03 100644 --- a/packages/@docs/demos/src/demos/core/Transition/Transition.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/Transition/Transition.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Transition' }; diff --git a/packages/@docs/demos/src/demos/core/TypographyStylesProvider/TypographyStylesProvider.demo.usage.tsx b/packages/@docs/demos/src/demos/core/TypographyStylesProvider/TypographyStylesProvider.demo.usage.tsx index e168b61559d..10d1cdb1341 100644 --- a/packages/@docs/demos/src/demos/core/TypographyStylesProvider/TypographyStylesProvider.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/TypographyStylesProvider/TypographyStylesProvider.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Box, TypographyStylesProvider } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { TypographyStylesProvider, Box } from '@mantine/core'; const html = `

Example article

diff --git a/packages/@docs/demos/src/demos/core/TypographyStylesProvider/TypographyStylesProvider.demos.story.tsx b/packages/@docs/demos/src/demos/core/TypographyStylesProvider/TypographyStylesProvider.demos.story.tsx index c84419cd676..c60de0475fc 100644 --- a/packages/@docs/demos/src/demos/core/TypographyStylesProvider/TypographyStylesProvider.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/TypographyStylesProvider/TypographyStylesProvider.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'TypographyStylesProvider' }; diff --git a/packages/@docs/demos/src/demos/core/UnstyledButton/UnstyledButton.demo.usage.tsx b/packages/@docs/demos/src/demos/core/UnstyledButton/UnstyledButton.demo.usage.tsx index 0da0697dead..fe9d4abd4f4 100644 --- a/packages/@docs/demos/src/demos/core/UnstyledButton/UnstyledButton.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/core/UnstyledButton/UnstyledButton.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { UnstyledButton } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { UnstyledButton } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/core/UnstyledButton/UnstyledButton.demos.story.tsx b/packages/@docs/demos/src/demos/core/UnstyledButton/UnstyledButton.demos.story.tsx index 3e12646066f..6ba29d055e4 100644 --- a/packages/@docs/demos/src/demos/core/UnstyledButton/UnstyledButton.demos.story.tsx +++ b/packages/@docs/demos/src/demos/core/UnstyledButton/UnstyledButton.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'UnstyledButton' }; diff --git a/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demo.isStatic.tsx b/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demo.isStatic.tsx index 6cfd05f054c..20dd567adfe 100644 --- a/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demo.isStatic.tsx +++ b/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demo.isStatic.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Indicator } from '@mantine/core'; import { Calendar } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Indicator } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demo.picker.tsx b/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demo.picker.tsx index 286e56d54a3..749fa9108a9 100644 --- a/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demo.picker.tsx +++ b/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demo.picker.tsx @@ -1,7 +1,7 @@ import dayjs from 'dayjs'; import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Calendar } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import dayjs from 'dayjs'; diff --git a/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demo.usage.tsx b/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demo.usage.tsx index 92e036370fd..0d6ae2848d6 100644 --- a/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Calendar } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Calendar } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demo.weekPicker.tsx b/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demo.weekPicker.tsx index e55c1640625..d77c499e80e 100644 --- a/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demo.weekPicker.tsx +++ b/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demo.weekPicker.tsx @@ -1,7 +1,7 @@ +import dayjs from 'dayjs'; import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Calendar } from '@mantine/dates'; -import dayjs from 'dayjs'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demos.story.tsx b/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demos.story.tsx index b72dc5ae82e..c39de891cbf 100644 --- a/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demos.story.tsx +++ b/packages/@docs/demos/src/demos/dates/Calendar/Calendar.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'Calendar' }; diff --git a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.clearable.tsx b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.clearable.tsx index 1ede291ca6a..ccd13ff54d6 100644 --- a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.clearable.tsx +++ b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.clearable.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DateInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { DateInput } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.configurator.tsx b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.configurator.tsx index a433012fc77..79faa0811fe 100644 --- a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DateInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; import { inputControls } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.deselect.tsx b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.deselect.tsx index b8c15dedd5b..5f76ac5fb69 100644 --- a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.deselect.tsx +++ b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.deselect.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DateInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { DateInput } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.disabled.tsx b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.disabled.tsx index 6b4c441a315..069b24a9f3f 100644 --- a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DateInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { DateInput } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.format.tsx b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.format.tsx index 85e6638f32c..2ef1a49cc9c 100644 --- a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.format.tsx +++ b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.format.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DateInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { DateInput } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.minMax.tsx b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.minMax.tsx index d1c76d7301f..2d176752fe9 100644 --- a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.minMax.tsx +++ b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.minMax.tsx @@ -1,7 +1,7 @@ import dayjs from 'dayjs'; import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DateInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import dayjs from 'dayjs'; diff --git a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.parser.tsx b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.parser.tsx index 28086f83959..09529ddd212 100644 --- a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.parser.tsx +++ b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.parser.tsx @@ -1,7 +1,7 @@ import dayjs from 'dayjs'; import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DateInput, DateInputProps } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import dayjs from 'dayjs'; diff --git a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.time.tsx b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.time.tsx index 913de9b9067..b0b6837ea6d 100644 --- a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.time.tsx +++ b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.time.tsx @@ -1,8 +1,8 @@ import dayjs from 'dayjs'; import customParseFormat from 'dayjs/plugin/customParseFormat'; import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DateInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; dayjs.extend(customParseFormat); diff --git a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.usage.tsx b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.usage.tsx index 34ae94431f0..bcc0c2a1e0d 100644 --- a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demo.usage.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DateInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demos.story.tsx b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demos.story.tsx index 0a58d2a92e9..c1c4438dd07 100644 --- a/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demos.story.tsx +++ b/packages/@docs/demos/src/demos/dates/DateInput/DateInput.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'DateInput' }; diff --git a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.controlProps.tsx b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.controlProps.tsx index dc8ec877395..cc49dc8350f 100644 --- a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.controlProps.tsx +++ b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.controlProps.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DatePicker, DatePickerProps } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.controlledDate.tsx b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.controlledDate.tsx index 0a9dc7e7aa3..1d2072c9dcb 100644 --- a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.controlledDate.tsx +++ b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.controlledDate.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DatePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.defaultDate.tsx b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.defaultDate.tsx index 0bfe189e0d8..100eeded928 100644 --- a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.defaultDate.tsx +++ b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.defaultDate.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DatePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.defaultLevel.tsx b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.defaultLevel.tsx index 0cafd02c3bb..437ea7c5c70 100644 --- a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.defaultLevel.tsx +++ b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.defaultLevel.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Group } from '@mantine/core'; import { DatePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.firstDayOfWeek.tsx b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.firstDayOfWeek.tsx index 7242a657b1b..2b6e363ae0f 100644 --- a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.firstDayOfWeek.tsx +++ b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.firstDayOfWeek.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Group } from '@mantine/core'; import { DatePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.hideOutsideDates.tsx b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.hideOutsideDates.tsx index ba5dd538636..13feb5aa59b 100644 --- a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.hideOutsideDates.tsx +++ b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.hideOutsideDates.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DatePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { DatePicker } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.hideWeekdays.tsx b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.hideWeekdays.tsx index f834cfaaa6e..accf0fce1b3 100644 --- a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.hideWeekdays.tsx +++ b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.hideWeekdays.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DatePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { DatePicker } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.labelFormat.tsx b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.labelFormat.tsx index 69ed40af840..e759b3244f1 100644 --- a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.labelFormat.tsx +++ b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.labelFormat.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DatePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.listFormat.tsx b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.listFormat.tsx index 1b2bdcddefd..1e91ab41006 100644 --- a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.listFormat.tsx +++ b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.listFormat.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DatePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { DatePicker } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.locale.tsx b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.locale.tsx index 1e1dd37e550..297f2bd93ce 100644 --- a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.locale.tsx +++ b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.locale.tsx @@ -1,7 +1,8 @@ import 'dayjs/locale/ru'; + import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DatePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import 'dayjs/locale/ru'; diff --git a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.maxLevel.tsx b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.maxLevel.tsx index b6e7dbea015..613b1b05a09 100644 --- a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.maxLevel.tsx +++ b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.maxLevel.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Group } from '@mantine/core'; import { DatePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.minMax.tsx b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.minMax.tsx index 304c36b33a4..1c0c309b70f 100644 --- a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.minMax.tsx +++ b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.minMax.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DatePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.renderDay.tsx b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.renderDay.tsx index 7867a34ace4..637338846c0 100644 --- a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.renderDay.tsx +++ b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.renderDay.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Indicator } from '@mantine/core'; import { DatePicker, DatePickerProps } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Indicator } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.weekendDays.tsx b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.weekendDays.tsx index 75566ba2b1a..901f04dc039 100644 --- a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.weekendDays.tsx +++ b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demo.weekendDays.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DatePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { DatePicker } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demos.story.tsx b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demos.story.tsx index c37b3f18cfd..862daf795d7 100644 --- a/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demos.story.tsx +++ b/packages/@docs/demos/src/demos/dates/DatePicker/DatePicker.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'DatePicker' }; diff --git a/packages/@docs/demos/src/demos/dates/DatePickerInput/DatePickerInput.demo.disabled.tsx b/packages/@docs/demos/src/demos/dates/DatePickerInput/DatePickerInput.demo.disabled.tsx index 0f076816811..fe5acfaac29 100644 --- a/packages/@docs/demos/src/demos/dates/DatePickerInput/DatePickerInput.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/dates/DatePickerInput/DatePickerInput.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DatePickerInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { DatePickerInput } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/DatePickerInput/DatePickerInput.demo.valueFormat.tsx b/packages/@docs/demos/src/demos/dates/DatePickerInput/DatePickerInput.demo.valueFormat.tsx index 00f3103ce78..b9ce2ecdf8a 100644 --- a/packages/@docs/demos/src/demos/dates/DatePickerInput/DatePickerInput.demo.valueFormat.tsx +++ b/packages/@docs/demos/src/demos/dates/DatePickerInput/DatePickerInput.demo.valueFormat.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DatePickerInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { DatePickerInput } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/DatePickerInput/DatePickerInput.demos.story.tsx b/packages/@docs/demos/src/demos/dates/DatePickerInput/DatePickerInput.demos.story.tsx index 80c0b6a114e..f1928936c7f 100644 --- a/packages/@docs/demos/src/demos/dates/DatePickerInput/DatePickerInput.demos.story.tsx +++ b/packages/@docs/demos/src/demos/dates/DatePickerInput/DatePickerInput.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'DatePickerInput' }; diff --git a/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.clearable.tsx b/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.clearable.tsx index c42e867b623..ca5194f613f 100644 --- a/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.clearable.tsx +++ b/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.clearable.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DateTimePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { DateTimePicker } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.configurator.tsx b/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.configurator.tsx index cde98666aa1..88847aa16d0 100644 --- a/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DateTimePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; import { inputControls } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.disabled.tsx b/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.disabled.tsx index c412ea3cdc9..24c62e993eb 100644 --- a/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DateTimePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { DateTimePicker } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.format.tsx b/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.format.tsx index c9c1794bc23..f2ffbf27393 100644 --- a/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.format.tsx +++ b/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.format.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DateTimePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { DateTimePicker } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.modal.tsx b/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.modal.tsx index 66c2449506d..080af6b68db 100644 --- a/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.modal.tsx +++ b/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.modal.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DateTimePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { DateTimePicker } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.usage.tsx b/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.usage.tsx index dbf223b3d18..0715f479ca8 100644 --- a/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DateTimePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { DateTimePicker } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.withSeconds.tsx b/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.withSeconds.tsx index 02f2b896b08..ff0a9f591d5 100644 --- a/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.withSeconds.tsx +++ b/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demo.withSeconds.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DateTimePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { DateTimePicker } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demos.story.tsx b/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demos.story.tsx index bc3a592e382..19dbc3db95d 100644 --- a/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demos.story.tsx +++ b/packages/@docs/demos/src/demos/dates/DateTimePicker/DateTimePicker.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'DateTimePicker' }; diff --git a/packages/@docs/demos/src/demos/dates/DatesProvider/DatesProvider.demo.timezone.tsx b/packages/@docs/demos/src/demos/dates/DatesProvider/DatesProvider.demo.timezone.tsx index 3ceed3d9837..f1f1c7ec67f 100644 --- a/packages/@docs/demos/src/demos/dates/DatesProvider/DatesProvider.demo.timezone.tsx +++ b/packages/@docs/demos/src/demos/dates/DatesProvider/DatesProvider.demo.timezone.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { DatesProvider, DateTimePicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { DatesProvider, DateTimePicker } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/DatesProvider/DatesProvider.demo.usage.tsx b/packages/@docs/demos/src/demos/dates/DatesProvider/DatesProvider.demo.usage.tsx index 1826a42c9af..f64081a24e8 100644 --- a/packages/@docs/demos/src/demos/dates/DatesProvider/DatesProvider.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/dates/DatesProvider/DatesProvider.demo.usage.tsx @@ -1,7 +1,8 @@ import 'dayjs/locale/ru'; + import React from 'react'; +import { DatePickerInput, DatesProvider, MonthPickerInput } from '@mantine/dates'; import { MantineDemo } from '@mantinex/demo'; -import { DatesProvider, MonthPickerInput, DatePickerInput } from '@mantine/dates'; const code = ` import 'dayjs/locale/ru'; diff --git a/packages/@docs/demos/src/demos/dates/DatesProvider/DatesProvider.demos.story.tsx b/packages/@docs/demos/src/demos/dates/DatesProvider/DatesProvider.demos.story.tsx index 7f3cd14bde0..fcd8c8f5b9b 100644 --- a/packages/@docs/demos/src/demos/dates/DatesProvider/DatesProvider.demos.story.tsx +++ b/packages/@docs/demos/src/demos/dates/DatesProvider/DatesProvider.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'DatesProvider' }; diff --git a/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.controlProps.tsx b/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.controlProps.tsx index 7f46be1d52f..7d2e8686ad1 100644 --- a/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.controlProps.tsx +++ b/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.controlProps.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MonthPicker, MonthPickerProps } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.controlledDate.tsx b/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.controlledDate.tsx index c7f9799a366..a98e126ca52 100644 --- a/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.controlledDate.tsx +++ b/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.controlledDate.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MonthPicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.defaultDate.tsx b/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.defaultDate.tsx index 61dd87ea338..61cf444855e 100644 --- a/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.defaultDate.tsx +++ b/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.defaultDate.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MonthPicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.labelFormat.tsx b/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.labelFormat.tsx index 801be6a9be3..0607e6a530e 100644 --- a/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.labelFormat.tsx +++ b/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.labelFormat.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MonthPicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.listFormat.tsx b/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.listFormat.tsx index d2cfe6d2438..5b011814585 100644 --- a/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.listFormat.tsx +++ b/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.listFormat.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MonthPicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MonthPicker } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.locale.tsx b/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.locale.tsx index c67e5a72f26..22c96d35219 100644 --- a/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.locale.tsx +++ b/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.locale.tsx @@ -1,7 +1,8 @@ import 'dayjs/locale/ru'; + import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MonthPicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import 'dayjs/locale/ru'; diff --git a/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.maxLevel.tsx b/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.maxLevel.tsx index 6d7e3b1e317..584c1f80347 100644 --- a/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.maxLevel.tsx +++ b/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.maxLevel.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MonthPicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MonthPicker } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.minMax.tsx b/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.minMax.tsx index bb62077f422..8309a11449f 100644 --- a/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.minMax.tsx +++ b/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demo.minMax.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MonthPicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demos.story.tsx b/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demos.story.tsx index 1a44f9ad5d8..53fef3cf4d0 100644 --- a/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demos.story.tsx +++ b/packages/@docs/demos/src/demos/dates/MonthPicker/MonthPicker.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'MonthPicker' }; diff --git a/packages/@docs/demos/src/demos/dates/MonthPickerInput/MonthPickerInput.demo.disabled.tsx b/packages/@docs/demos/src/demos/dates/MonthPickerInput/MonthPickerInput.demo.disabled.tsx index e3cb6ed0970..82f32059cf7 100644 --- a/packages/@docs/demos/src/demos/dates/MonthPickerInput/MonthPickerInput.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/dates/MonthPickerInput/MonthPickerInput.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MonthPickerInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MonthPickerInput } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/MonthPickerInput/MonthPickerInput.demo.valueFormat.tsx b/packages/@docs/demos/src/demos/dates/MonthPickerInput/MonthPickerInput.demo.valueFormat.tsx index 2a5e6e0a749..7ebb256e48a 100644 --- a/packages/@docs/demos/src/demos/dates/MonthPickerInput/MonthPickerInput.demo.valueFormat.tsx +++ b/packages/@docs/demos/src/demos/dates/MonthPickerInput/MonthPickerInput.demo.valueFormat.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { MonthPickerInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { MonthPickerInput } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/MonthPickerInput/MonthPickerInput.demos.story.tsx b/packages/@docs/demos/src/demos/dates/MonthPickerInput/MonthPickerInput.demos.story.tsx index e796182cc50..1b0014d4430 100644 --- a/packages/@docs/demos/src/demos/dates/MonthPickerInput/MonthPickerInput.demos.story.tsx +++ b/packages/@docs/demos/src/demos/dates/MonthPickerInput/MonthPickerInput.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'MonthPickerInput' }; diff --git a/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.configurator.tsx b/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.configurator.tsx index a4148c23c1a..1cf6832fc78 100644 --- a/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.configurator.tsx +++ b/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.configurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TimeInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; import { inputControls } from '../../../shared'; const code = ` diff --git a/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.disabled.tsx b/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.disabled.tsx index be1a0322841..e994d18f6cc 100644 --- a/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TimeInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TimeInput } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.icon.tsx b/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.icon.tsx index 395363b5a1b..8fce97edd84 100644 --- a/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.icon.tsx +++ b/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.icon.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { IconClock } from '@tabler/icons-react'; -import { TimeInput } from '@mantine/dates'; import { rem } from '@mantine/core'; +import { TimeInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { IconClock } from '@tabler/icons-react'; diff --git a/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.picker.tsx b/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.picker.tsx index fef84d52acf..348887ed264 100644 --- a/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.picker.tsx +++ b/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.picker.tsx @@ -1,8 +1,8 @@ import React, { useRef } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { IconClock } from '@tabler/icons-react'; import { ActionIcon, rem } from '@mantine/core'; import { TimeInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useRef } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.withSeconds.tsx b/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.withSeconds.tsx index 96e797f6d30..c0b0c73deb6 100644 --- a/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.withSeconds.tsx +++ b/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demo.withSeconds.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TimeInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TimeInput } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demos.story.tsx b/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demos.story.tsx index 9a76db3bac7..cd635cac287 100644 --- a/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demos.story.tsx +++ b/packages/@docs/demos/src/demos/dates/TimeInput/TimeInput.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'TimeInput' }; diff --git a/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.controlProps.tsx b/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.controlProps.tsx index 43719d90814..71007dd9ef8 100644 --- a/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.controlProps.tsx +++ b/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.controlProps.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { YearPicker, YearPickerProps } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.controlledDate.tsx b/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.controlledDate.tsx index 38973a113dc..98650628732 100644 --- a/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.controlledDate.tsx +++ b/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.controlledDate.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { YearPicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.decadeLabelFormat.tsx b/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.decadeLabelFormat.tsx index ceca4298304..5228258b365 100644 --- a/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.decadeLabelFormat.tsx +++ b/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.decadeLabelFormat.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { YearPicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.defaultDate.tsx b/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.defaultDate.tsx index 7c200a280fc..573227b19a3 100644 --- a/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.defaultDate.tsx +++ b/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.defaultDate.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { YearPicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.minMax.tsx b/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.minMax.tsx index 02caf078211..c00ab71c12d 100644 --- a/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.minMax.tsx +++ b/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.minMax.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { YearPicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.yearsListFormat.tsx b/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.yearsListFormat.tsx index aaa86541940..0112db61ce0 100644 --- a/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.yearsListFormat.tsx +++ b/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demo.yearsListFormat.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { YearPicker } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demos.story.tsx b/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demos.story.tsx index 4d94e8cca2a..1971353a29b 100644 --- a/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demos.story.tsx +++ b/packages/@docs/demos/src/demos/dates/YearPicker/YearPicker.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'YearPicker' }; diff --git a/packages/@docs/demos/src/demos/dates/YearPickerInput/YearPickerInput.demo.disabled.tsx b/packages/@docs/demos/src/demos/dates/YearPickerInput/YearPickerInput.demo.disabled.tsx index 8f2ed72fc61..6928ea8253e 100644 --- a/packages/@docs/demos/src/demos/dates/YearPickerInput/YearPickerInput.demo.disabled.tsx +++ b/packages/@docs/demos/src/demos/dates/YearPickerInput/YearPickerInput.demo.disabled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { YearPickerInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { YearPickerInput } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/YearPickerInput/YearPickerInput.demo.valueFormat.tsx b/packages/@docs/demos/src/demos/dates/YearPickerInput/YearPickerInput.demo.valueFormat.tsx index 21cadcc191f..2a059c4f7f0 100644 --- a/packages/@docs/demos/src/demos/dates/YearPickerInput/YearPickerInput.demo.valueFormat.tsx +++ b/packages/@docs/demos/src/demos/dates/YearPickerInput/YearPickerInput.demo.valueFormat.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { YearPickerInput } from '@mantine/dates'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { YearPickerInput } from '@mantine/dates'; diff --git a/packages/@docs/demos/src/demos/dates/YearPickerInput/YearPickerInput.demos.story.tsx b/packages/@docs/demos/src/demos/dates/YearPickerInput/YearPickerInput.demos.story.tsx index 953da6deb02..fd42948826d 100644 --- a/packages/@docs/demos/src/demos/dates/YearPickerInput/YearPickerInput.demos.story.tsx +++ b/packages/@docs/demos/src/demos/dates/YearPickerInput/YearPickerInput.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../../render-demo'; +import * as demos from './index'; export default { title: 'YearPickerInput' }; diff --git a/packages/@docs/demos/src/demos/dates/_shared/get-shared-picker-demos.ts b/packages/@docs/demos/src/demos/dates/_shared/get-shared-picker-demos.ts index ca91f9e3431..2e2ca37e2a3 100644 --- a/packages/@docs/demos/src/demos/dates/_shared/get-shared-picker-demos.ts +++ b/packages/@docs/demos/src/demos/dates/_shared/get-shared-picker-demos.ts @@ -1,11 +1,11 @@ import React from 'react'; import { getPickerDeselectDemo } from './picker-deselect.demo'; import { getPickerMultipleDemo } from './picker-multiple.demo'; +import { getPickerNumberOfColumnsDemo } from './picker-numberOfColumns.demo'; import { getPickerRangeDemo } from './picker-range.demo'; -import { getPickerUsageDemo } from './picker-usage.demo'; import { getPickerSingleRangeDemo } from './picker-singleRange.demo'; -import { getPickerNumberOfColumnsDemo } from './picker-numberOfColumns.demo'; import { getPickerSizeConfiguratorDemo } from './picker-sizeConfigurator.demo'; +import { getPickerUsageDemo } from './picker-usage.demo'; export function getSharedPickerDemos(component: React.FC) { return { diff --git a/packages/@docs/demos/src/demos/dates/_shared/get-shared-picker-input-demos.ts b/packages/@docs/demos/src/demos/dates/_shared/get-shared-picker-input-demos.ts index 4b2967c5c0e..87bcf52c181 100644 --- a/packages/@docs/demos/src/demos/dates/_shared/get-shared-picker-input-demos.ts +++ b/packages/@docs/demos/src/demos/dates/_shared/get-shared-picker-input-demos.ts @@ -1,11 +1,11 @@ import React from 'react'; -import { getPickerInputUsageDemo } from './picker-input-usage.demo'; -import { getPickerInputMultipleDemo } from './picker-input-multiple.demo'; -import { getPickerInputRangeDemo } from './picker-input-range.demo'; +import { getPickerInputClearableDemo } from './picker-input-clearable.demo'; import { getPickerInputConfiguratorDemo } from './picker-input-configurator.demo'; -import { getPickerInputModalDemo } from './picker-input-modal.demo'; import { getPickerInputIconDemo } from './picker-input-icon.demo'; -import { getPickerInputClearableDemo } from './picker-input-clearable.demo'; +import { getPickerInputModalDemo } from './picker-input-modal.demo'; +import { getPickerInputMultipleDemo } from './picker-input-multiple.demo'; +import { getPickerInputRangeDemo } from './picker-input-range.demo'; +import { getPickerInputUsageDemo } from './picker-input-usage.demo'; export function getSharedPickerInputDemos(component: React.FC) { return { diff --git a/packages/@docs/demos/src/demos/dates/_shared/picker-input-icon.demo.tsx b/packages/@docs/demos/src/demos/dates/_shared/picker-input-icon.demo.tsx index 2f28b2d9023..4b4fcd7c144 100644 --- a/packages/@docs/demos/src/demos/dates/_shared/picker-input-icon.demo.tsx +++ b/packages/@docs/demos/src/demos/dates/_shared/picker-input-icon.demo.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { IconCalendar } from '@tabler/icons-react'; import { rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const getCode = (name: string) => ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dates/_shared/picker-numberOfColumns.demo.tsx b/packages/@docs/demos/src/demos/dates/_shared/picker-numberOfColumns.demo.tsx index 1e8aba879d7..fae7494ccfd 100644 --- a/packages/@docs/demos/src/demos/dates/_shared/picker-numberOfColumns.demo.tsx +++ b/packages/@docs/demos/src/demos/dates/_shared/picker-numberOfColumns.demo.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const getCode = (name: string) => ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dropzone/Dropzone.demo.preview.tsx b/packages/@docs/demos/src/demos/dropzone/Dropzone.demo.preview.tsx index 66fffca73d4..45462c13f54 100644 --- a/packages/@docs/demos/src/demos/dropzone/Dropzone.demo.preview.tsx +++ b/packages/@docs/demos/src/demos/dropzone/Dropzone.demo.preview.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { Text, Image, SimpleGrid } from '@mantine/core'; +import { Image, SimpleGrid, Text } from '@mantine/core'; +import { Dropzone, FileWithPath, IMAGE_MIME_TYPE } from '@mantine/dropzone'; import { MantineDemo } from '@mantinex/demo'; -import { Dropzone, IMAGE_MIME_TYPE, FileWithPath } from '@mantine/dropzone'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/dropzone/Dropzone.demo.stylesApi.tsx b/packages/@docs/demos/src/demos/dropzone/Dropzone.demo.stylesApi.tsx index b2da3c7e3dd..efc01720f9f 100644 --- a/packages/@docs/demos/src/demos/dropzone/Dropzone.demo.stylesApi.tsx +++ b/packages/@docs/demos/src/demos/dropzone/Dropzone.demo.stylesApi.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Text } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { Dropzone, IMAGE_MIME_TYPE } from '@mantine/dropzone'; +import { MantineDemo } from '@mantinex/demo'; import classes from './Dropzone.demo.stylesApi.module.css'; const cssCode = ` diff --git a/packages/@docs/demos/src/demos/dropzone/_base.tsx b/packages/@docs/demos/src/demos/dropzone/_base.tsx index e1aebac4ff9..86d4ae26cdc 100644 --- a/packages/@docs/demos/src/demos/dropzone/_base.tsx +++ b/packages/@docs/demos/src/demos/dropzone/_base.tsx @@ -1,7 +1,7 @@ /* eslint-disable no-console */ import React from 'react'; -import { Group, Text, rem } from '@mantine/core'; -import { IconUpload, IconPhoto, IconX } from '@tabler/icons-react'; +import { IconPhoto, IconUpload, IconX } from '@tabler/icons-react'; +import { Group, rem, Text } from '@mantine/core'; import { Dropzone, DropzoneProps, IMAGE_MIME_TYPE } from '@mantine/dropzone'; export function DropzoneDemoChildren() { diff --git a/packages/@docs/demos/src/demos/form/Form.demo.asyncSetValues.tsx b/packages/@docs/demos/src/demos/form/Form.demo.asyncSetValues.tsx index 549f9783b18..85f6da4c2cf 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.asyncSetValues.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.asyncSetValues.tsx @@ -1,7 +1,7 @@ import React, { useEffect } from 'react'; +import { Box, Checkbox, TextInput } from '@mantine/core'; import { useForm } from '@mantine/form'; import { MantineDemo } from '@mantinex/demo'; -import { TextInput, Checkbox, Box } from '@mantine/core'; const code = ` import { useEffect } from 'react'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.blurFieldValidation.tsx b/packages/@docs/demos/src/demos/form/Form.demo.blurFieldValidation.tsx index aad13207832..b0adc6cb329 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.blurFieldValidation.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.blurFieldValidation.tsx @@ -1,8 +1,8 @@ /* eslint-disable no-console */ import React from 'react'; -import { useForm, FORM_INDEX } from '@mantine/form'; +import { Box, Button, NumberInput, TextInput } from '@mantine/core'; +import { FORM_INDEX, useForm } from '@mantine/form'; import { MantineDemo } from '@mantinex/demo'; -import { NumberInput, TextInput, Button, Box } from '@mantine/core'; const code = ` import { useForm, FORM_INDEX } from '@mantine/form'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.blurValidation.tsx b/packages/@docs/demos/src/demos/form/Form.demo.blurValidation.tsx index f3efd967f92..f7ba83b53c5 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.blurValidation.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.blurValidation.tsx @@ -1,8 +1,8 @@ /* eslint-disable no-console */ import React from 'react'; +import { Box, Button, NumberInput, TextInput } from '@mantine/core'; import { useForm } from '@mantine/form'; import { MantineDemo } from '@mantinex/demo'; -import { NumberInput, TextInput, Button, Box } from '@mantine/core'; const code = ` import { useForm } from '@mantine/form'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.clearErrorOnChange.tsx b/packages/@docs/demos/src/demos/form/Form.demo.clearErrorOnChange.tsx index 8a9dfa78fe5..a553ef04c20 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.clearErrorOnChange.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.clearErrorOnChange.tsx @@ -1,8 +1,8 @@ /* eslint-disable no-console */ import React from 'react'; -import { TextInput, Checkbox, Button, Group, Box } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Box, Button, Checkbox, Group, TextInput } from '@mantine/core'; import { useForm } from '@mantine/form'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TextInput, Checkbox, Button, Group, Box } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.dnd.tsx b/packages/@docs/demos/src/demos/form/Form.demo.dnd.tsx index 289ece592f9..329fa57f706 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.dnd.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.dnd.tsx @@ -1,9 +1,9 @@ import React from 'react'; -import { Group, TextInput, Box, Text, Code, Button, Center } from '@mantine/core'; +import { DragDropContext, Draggable, Droppable } from '@hello-pangea/dnd'; +import { IconGripVertical } from '@tabler/icons-react'; +import { Box, Button, Center, Code, Group, Text, TextInput } from '@mantine/core'; import { useForm } from '@mantine/form'; -import { DragDropContext, Droppable, Draggable } from '@hello-pangea/dnd'; import { MantineDemo } from '@mantinex/demo'; -import { IconGripVertical } from '@tabler/icons-react'; const code = ` import { Group, TextInput, Box, Text, Code, Button, Center } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.lists.tsx b/packages/@docs/demos/src/demos/form/Form.demo.lists.tsx index e3543153cf1..e4d3ea00d1f 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.lists.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.lists.tsx @@ -1,9 +1,9 @@ import React from 'react'; +import { IconTrash } from '@tabler/icons-react'; +import { ActionIcon, Box, Button, Code, Group, Switch, Text, TextInput } from '@mantine/core'; import { useForm } from '@mantine/form'; -import { TextInput, Switch, Group, ActionIcon, Box, Text, Button, Code } from '@mantine/core'; import { randomId } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { IconTrash } from '@tabler/icons-react'; const code = ` import { useForm } from '@mantine/form'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.liveFieldValidation.tsx b/packages/@docs/demos/src/demos/form/Form.demo.liveFieldValidation.tsx index 68f23eefade..bb7eb3f4873 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.liveFieldValidation.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.liveFieldValidation.tsx @@ -1,8 +1,8 @@ /* eslint-disable no-console */ import React from 'react'; +import { Box, Button, NumberInput, TextInput } from '@mantine/core'; import { FORM_INDEX, useForm } from '@mantine/form'; import { MantineDemo } from '@mantinex/demo'; -import { NumberInput, TextInput, Button, Box } from '@mantine/core'; const code = ` import { useForm, FORM_INDEX } from '@mantine/form'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.liveValidation.tsx b/packages/@docs/demos/src/demos/form/Form.demo.liveValidation.tsx index 2cc9677bb6b..86c1dd66d78 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.liveValidation.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.liveValidation.tsx @@ -1,8 +1,8 @@ /* eslint-disable no-console */ import React from 'react'; +import { Box, Button, NumberInput, TextInput } from '@mantine/core'; import { useForm } from '@mantine/form'; import { MantineDemo } from '@mantinex/demo'; -import { NumberInput, TextInput, Button, Box } from '@mantine/core'; const code = ` import { useForm } from '@mantine/form'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.localStorage.tsx b/packages/@docs/demos/src/demos/form/Form.demo.localStorage.tsx index 980d7b2b697..971ea49fce2 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.localStorage.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.localStorage.tsx @@ -1,7 +1,7 @@ import React, { useEffect } from 'react'; +import { Box, TextInput } from '@mantine/core'; import { useForm } from '@mantine/form'; import { MantineDemo } from '@mantinex/demo'; -import { TextInput, Box } from '@mantine/core'; const code = ` import { useEffect } from 'react'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.nested.tsx b/packages/@docs/demos/src/demos/form/Form.demo.nested.tsx index d6d29efb425..3b16c1cab51 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.nested.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.nested.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Box, Checkbox, Code, Text, TextInput } from '@mantine/core'; import { useForm } from '@mantine/form'; import { MantineDemo } from '@mantinex/demo'; -import { TextInput, Checkbox, Code, Text, Box } from '@mantine/core'; const code = ` import { useForm } from '@mantine/form'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.onSubmitErrors.tsx b/packages/@docs/demos/src/demos/form/Form.demo.onSubmitErrors.tsx index eb8baf1c2ac..1a51937856a 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.onSubmitErrors.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.onSubmitErrors.tsx @@ -1,9 +1,9 @@ /* eslint-disable no-console */ import React from 'react'; +import { Box, Button, TextInput } from '@mantine/core'; import { useForm } from '@mantine/form'; -import { TextInput, Button, Box } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { notifications } from '@mantine/notifications'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useForm } from '@mantine/form'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.password.tsx b/packages/@docs/demos/src/demos/form/Form.demo.password.tsx index a880ae6af8d..fdf3f56b7f5 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.password.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.password.tsx @@ -1,8 +1,8 @@ /* eslint-disable no-console */ import React from 'react'; -import { PasswordInput, Group, Button, Box } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Box, Button, Group, PasswordInput } from '@mantine/core'; import { useForm } from '@mantine/form'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useForm } from '@mantine/form'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.reset.tsx b/packages/@docs/demos/src/demos/form/Form.demo.reset.tsx index 61f0650c8a4..d4f71428b42 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.reset.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.reset.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Box, Button, Group, TextInput } from '@mantine/core'; import { useForm } from '@mantine/form'; import { MantineDemo } from '@mantinex/demo'; -import { TextInput, Button, Group, Box } from '@mantine/core'; const code = ` import { useForm } from '@mantine/form'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.rulesValidation.tsx b/packages/@docs/demos/src/demos/form/Form.demo.rulesValidation.tsx index a4abc98e04c..7f51cbbcdf6 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.rulesValidation.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.rulesValidation.tsx @@ -1,8 +1,8 @@ /* eslint-disable no-console */ import React from 'react'; +import { Box, Button, NumberInput, TextInput } from '@mantine/core'; import { useForm } from '@mantine/form'; import { MantineDemo } from '@mantinex/demo'; -import { NumberInput, TextInput, Button, Box } from '@mantine/core'; const code = ` import { useForm } from '@mantine/form'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.setFieldValue.tsx b/packages/@docs/demos/src/demos/form/Form.demo.setFieldValue.tsx index 3e17a181702..19c5e296e4d 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.setFieldValue.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.setFieldValue.tsx @@ -1,8 +1,8 @@ import React from 'react'; +import { Box, Button, Group, TextInput } from '@mantine/core'; import { useForm } from '@mantine/form'; -import { TextInput, Button, Group, Box } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { randomId } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useForm } from '@mantine/form'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.setValues.tsx b/packages/@docs/demos/src/demos/form/Form.demo.setValues.tsx index 46174c5943d..187b1c17b42 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.setValues.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.setValues.tsx @@ -1,8 +1,8 @@ import React from 'react'; +import { Box, Button, Group, TextInput } from '@mantine/core'; import { useForm } from '@mantine/form'; -import { TextInput, Button, Group, Box } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { randomId } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useForm } from '@mantine/form'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.status.tsx b/packages/@docs/demos/src/demos/form/Form.demo.status.tsx index ae67c7d6f06..07dd90e1c8e 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.status.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.status.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Box, Text, TextInput } from '@mantine/core'; import { useForm } from '@mantine/form'; import { MantineDemo } from '@mantinex/demo'; -import { TextInput, Text, Box } from '@mantine/core'; const code = ` import { useForm } from '@mantine/form'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.stepper.tsx b/packages/@docs/demos/src/demos/form/Form.demo.stepper.tsx index 37e75350949..983fde64674 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.stepper.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.stepper.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { Stepper, Button, Group, TextInput, PasswordInput, Code } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Button, Code, Group, PasswordInput, Stepper, TextInput } from '@mantine/core'; import { useForm } from '@mantine/form'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.transformValues.tsx b/packages/@docs/demos/src/demos/form/Form.demo.transformValues.tsx index fd6d41ac858..1dc3c678708 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.transformValues.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.transformValues.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { Box, Button, Code, TextInput } from '@mantine/core'; import { useForm } from '@mantine/form'; -import { TextInput, Button, Box, Code } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.usage.tsx b/packages/@docs/demos/src/demos/form/Form.demo.usage.tsx index 1fcb37405b7..df5975df7d2 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.usage.tsx @@ -1,8 +1,8 @@ /* eslint-disable no-console */ import React from 'react'; -import { TextInput, Checkbox, Button, Group, Box } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Box, Button, Checkbox, Group, TextInput } from '@mantine/core'; import { useForm } from '@mantine/form'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TextInput, Checkbox, Button, Group, Box } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.validateFunction.tsx b/packages/@docs/demos/src/demos/form/Form.demo.validateFunction.tsx index 25bf3cd769c..0f20649b426 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.validateFunction.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.validateFunction.tsx @@ -1,8 +1,8 @@ /* eslint-disable no-console */ import React from 'react'; +import { Box, Button, Group, NumberInput, TextInput } from '@mantine/core'; import { useForm } from '@mantine/form'; import { MantineDemo } from '@mantinex/demo'; -import { Box, TextInput, NumberInput, Button, Group } from '@mantine/core'; const code = ` import { useForm } from '@mantine/form'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.validators.tsx b/packages/@docs/demos/src/demos/form/Form.demo.validators.tsx index 6fee2fd38c4..af5cd169794 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.validators.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.validators.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Box, Button, Group, NumberInput, TextInput } from '@mantine/core'; +import { hasLength, isEmail, isInRange, isNotEmpty, matches, useForm } from '@mantine/form'; import { MantineDemo } from '@mantinex/demo'; -import { useForm, isNotEmpty, isEmail, isInRange, hasLength, matches } from '@mantine/form'; -import { Button, Group, TextInput, NumberInput, Box } from '@mantine/core'; const code = ` import { useForm, isNotEmpty, isEmail, isInRange, hasLength, matches } from '@mantine/form'; diff --git a/packages/@docs/demos/src/demos/form/Form.demo.validatorsEmpty.tsx b/packages/@docs/demos/src/demos/form/Form.demo.validatorsEmpty.tsx index 15f873fae51..0dc41295616 100644 --- a/packages/@docs/demos/src/demos/form/Form.demo.validatorsEmpty.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demo.validatorsEmpty.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Box, Button, Group, NumberInput, TextInput } from '@mantine/core'; +import { hasLength, isEmail, isInRange, isNotEmpty, matches, useForm } from '@mantine/form'; import { MantineDemo } from '@mantinex/demo'; -import { useForm, isNotEmpty, isEmail, isInRange, hasLength, matches } from '@mantine/form'; -import { Button, Group, TextInput, NumberInput, Box } from '@mantine/core'; const code = ` import { useForm, isNotEmpty, isEmail, isInRange, hasLength, matches } from '@mantine/form'; diff --git a/packages/@docs/demos/src/demos/form/Form.demos.story.tsx b/packages/@docs/demos/src/demos/form/Form.demos.story.tsx index a0a7ee352ae..a789a7933a1 100644 --- a/packages/@docs/demos/src/demos/form/Form.demos.story.tsx +++ b/packages/@docs/demos/src/demos/form/Form.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../render-demo'; +import * as demos from './index'; export default { title: 'Form' }; diff --git a/packages/@docs/demos/src/demos/guides/Guides.demo.createPolymorphic.tsx b/packages/@docs/demos/src/demos/guides/Guides.demo.createPolymorphic.tsx index 75c828dddb4..77fb22fe6b1 100644 --- a/packages/@docs/demos/src/demos/guides/Guides.demo.createPolymorphic.tsx +++ b/packages/@docs/demos/src/demos/guides/Guides.demo.createPolymorphic.tsx @@ -1,6 +1,6 @@ import React, { forwardRef } from 'react'; +import { Button, ButtonProps, createPolymorphicComponent, Group } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { createPolymorphicComponent, Button, ButtonProps, Group } from '@mantine/core'; const code = ` import { forwardRef } from 'react'; diff --git a/packages/@docs/demos/src/demos/guides/Guides.demo.customIcon.tsx b/packages/@docs/demos/src/demos/guides/Guides.demo.customIcon.tsx index 06f60843762..7f58d9e3f27 100644 --- a/packages/@docs/demos/src/demos/guides/Guides.demo.customIcon.tsx +++ b/packages/@docs/demos/src/demos/guides/Guides.demo.customIcon.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import { AddressBookIcon } from './_CustomIcon'; const code = ` diff --git a/packages/@docs/demos/src/demos/guides/Guides.demo.icon.tsx b/packages/@docs/demos/src/demos/guides/Guides.demo.icon.tsx index c26342bfce6..446d7c256c4 100644 --- a/packages/@docs/demos/src/demos/guides/Guides.demo.icon.tsx +++ b/packages/@docs/demos/src/demos/guides/Guides.demo.icon.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { IconBrandMantine } from '@tabler/icons-react'; import { rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/guides/Guides.demo.newPolymorphic.tsx b/packages/@docs/demos/src/demos/guides/Guides.demo.newPolymorphic.tsx index 9be4227aa90..2ec50204281 100644 --- a/packages/@docs/demos/src/demos/guides/Guides.demo.newPolymorphic.tsx +++ b/packages/@docs/demos/src/demos/guides/Guides.demo.newPolymorphic.tsx @@ -1,6 +1,6 @@ import React, { forwardRef } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Box, BoxProps, createPolymorphicComponent, Group } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { forwardRef } from 'react'; diff --git a/packages/@docs/demos/src/demos/guides/Guides.demo.polymorphic.tsx b/packages/@docs/demos/src/demos/guides/Guides.demo.polymorphic.tsx index 96a983fd216..37cc4f96319 100644 --- a/packages/@docs/demos/src/demos/guides/Guides.demo.polymorphic.tsx +++ b/packages/@docs/demos/src/demos/guides/Guides.demo.polymorphic.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/guides/Guides.demo.staticPolymorphic.tsx b/packages/@docs/demos/src/demos/guides/Guides.demo.staticPolymorphic.tsx index 47c68e7e94b..dc561b33c4a 100644 --- a/packages/@docs/demos/src/demos/guides/Guides.demo.staticPolymorphic.tsx +++ b/packages/@docs/demos/src/demos/guides/Guides.demo.staticPolymorphic.tsx @@ -1,6 +1,6 @@ import React, { forwardRef } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button, ButtonProps } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { forwardRef } from 'react'; diff --git a/packages/@docs/demos/src/demos/guides/Guides.demos.story.tsx b/packages/@docs/demos/src/demos/guides/Guides.demos.story.tsx index 4331d020359..ebe42a68dea 100644 --- a/packages/@docs/demos/src/demos/guides/Guides.demos.story.tsx +++ b/packages/@docs/demos/src/demos/guides/Guides.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../render-demo'; +import * as demos from './index'; export default { title: 'Guides' }; diff --git a/packages/@docs/demos/src/demos/hooks/Hooks.demos.story.tsx b/packages/@docs/demos/src/demos/hooks/Hooks.demos.story.tsx index a64911260be..d1f2e228279 100644 --- a/packages/@docs/demos/src/demos/hooks/Hooks.demos.story.tsx +++ b/packages/@docs/demos/src/demos/hooks/Hooks.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../render-demo'; +import * as demos from './index'; export default { title: 'Hooks' }; diff --git a/packages/@docs/demos/src/demos/hooks/use-click-outside.demo.events.tsx b/packages/@docs/demos/src/demos/hooks/use-click-outside.demo.events.tsx index 73bf9d71063..daece5cfb9e 100644 --- a/packages/@docs/demos/src/demos/hooks/use-click-outside.demo.events.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-click-outside.demo.events.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { Paper, Button, Group, rem } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Button, Group, Paper, rem } from '@mantine/core'; import { useClickOutside } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-click-outside.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-click-outside.demo.usage.tsx index d3f29ac6ca3..7a7e90a3a8c 100644 --- a/packages/@docs/demos/src/demos/hooks/use-click-outside.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-click-outside.demo.usage.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { Paper, Button, Group, rem } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Button, Group, Paper, rem } from '@mantine/core'; import { useClickOutside } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-clipboard.usage.demo.tsx b/packages/@docs/demos/src/demos/hooks/use-clipboard.usage.demo.tsx index f48688add2a..6147b3172f6 100644 --- a/packages/@docs/demos/src/demos/hooks/use-clipboard.usage.demo.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-clipboard.usage.demo.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Button } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { useClipboard } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/hooks/use-color-scheme.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-color-scheme.demo.usage.tsx index 8de0329d682..c38912467bf 100644 --- a/packages/@docs/demos/src/demos/hooks/use-color-scheme.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-color-scheme.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Badge } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { useColorScheme } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Badge } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/hooks/use-counter.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-counter.demo.usage.tsx index 72b00d91166..911c1760fd5 100644 --- a/packages/@docs/demos/src/demos/hooks/use-counter.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-counter.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { Group, Button, Text } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Button, Group, Text } from '@mantine/core'; import { useCounter } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Group, Button, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/hooks/use-debounced-state.demo.leading.tsx b/packages/@docs/demos/src/demos/hooks/use-debounced-state.demo.leading.tsx index 2b68c37cb79..0c6cf135f3a 100644 --- a/packages/@docs/demos/src/demos/hooks/use-debounced-state.demo.leading.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-debounced-state.demo.leading.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Box, Text, TextInput } from '@mantine/core'; import { useDebouncedState } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { TextInput, Text, Box } from '@mantine/core'; const code = ` import { useDebouncedState } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/hooks/use-debounced-state.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-debounced-state.demo.usage.tsx index d1277f5e2d2..16b65503d1d 100644 --- a/packages/@docs/demos/src/demos/hooks/use-debounced-state.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-debounced-state.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Box, Text, TextInput } from '@mantine/core'; import { useDebouncedState } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { TextInput, Text, Box } from '@mantine/core'; const code = ` import { useDebouncedState } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/hooks/use-debounced-value.demo.cancel.tsx b/packages/@docs/demos/src/demos/hooks/use-debounced-value.demo.cancel.tsx index 8d20e7592db..5d1be27c2fb 100644 --- a/packages/@docs/demos/src/demos/hooks/use-debounced-value.demo.cancel.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-debounced-value.demo.cancel.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; +import { Box, Button, Group, Text, TextInput } from '@mantine/core'; import { useDebouncedValue } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { TextInput, Text, Button, Group, Box } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-debounced-value.demo.leading.tsx b/packages/@docs/demos/src/demos/hooks/use-debounced-value.demo.leading.tsx index 4813dcc00a3..73d73b931c4 100644 --- a/packages/@docs/demos/src/demos/hooks/use-debounced-value.demo.leading.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-debounced-value.demo.leading.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; +import { Box, Text, TextInput } from '@mantine/core'; import { useDebouncedValue } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { TextInput, Text, Box } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-debounced-value.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-debounced-value.demo.usage.tsx index b1c4b8af77e..f07f6262a13 100644 --- a/packages/@docs/demos/src/demos/hooks/use-debounced-value.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-debounced-value.demo.usage.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; +import { Box, Text, TextInput } from '@mantine/core'; import { useDebouncedValue } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { TextInput, Text, Box } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-document-title.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-document-title.demo.usage.tsx index a485dc91fdc..549845eb26c 100644 --- a/packages/@docs/demos/src/demos/hooks/use-document-title.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-document-title.demo.usage.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { useDocumentTitle, randomId } from '@mantine/hooks'; -import { MantineDemo } from '@mantinex/demo'; import { Button } from '@mantine/core'; +import { randomId, useDocumentTitle } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-document-visibility.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-document-visibility.demo.usage.tsx index 63abbb458b1..0761ab378f7 100644 --- a/packages/@docs/demos/src/demos/hooks/use-document-visibility.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-document-visibility.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Text } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { useDocumentTitle, useDocumentVisibility } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/hooks/use-element-size.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-element-size.demo.usage.tsx index 9baa68d548c..b15740b0d24 100644 --- a/packages/@docs/demos/src/demos/hooks/use-element-size.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-element-size.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { useMantineTheme, Text, Group, rem } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Group, rem, Text, useMantineTheme } from '@mantine/core'; import { useElementSize } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useElementSize } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/hooks/use-event-listener.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-event-listener.demo.usage.tsx index fca078efdcf..7fcbf72fb8d 100644 --- a/packages/@docs/demos/src/demos/hooks/use-event-listener.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-event-listener.demo.usage.tsx @@ -1,7 +1,7 @@ -import React, { useState, useCallback } from 'react'; +import React, { useCallback, useState } from 'react'; import { Button } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { useEventListener } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState, useCallback } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-eye-dropper.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-eye-dropper.demo.usage.tsx index d675019c37c..e9b2001608a 100644 --- a/packages/@docs/demos/src/demos/hooks/use-eye-dropper.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-eye-dropper.demo.usage.tsx @@ -1,8 +1,8 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { ActionIcon, Group, ColorSwatch, Text } from '@mantine/core'; import { IconColorPicker } from '@tabler/icons-react'; +import { ActionIcon, ColorSwatch, Group, Text } from '@mantine/core'; import { useEyeDropper } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-favicon.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-favicon.demo.usage.tsx index 5e27ae39772..352f77b1fef 100644 --- a/packages/@docs/demos/src/demos/hooks/use-favicon.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-favicon.demo.usage.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { Button, Group } from '@mantine/core'; import { useFavicon } from '@mantine/hooks'; -import { Group, Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-focus-within.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-focus-within.demo.usage.tsx index f22ced52ade..6134109ef2a 100644 --- a/packages/@docs/demos/src/demos/hooks/use-focus-within.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-focus-within.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Box, Button, Text, TextInput } from '@mantine/core'; import { useFocusWithin } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { TextInput, Button, Box, Text } from '@mantine/core'; const code = ` import { useFocusWithin } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/hooks/use-force-update.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-force-update.demo.usage.tsx index 1c7557e6935..fa2eb7143c4 100644 --- a/packages/@docs/demos/src/demos/hooks/use-force-update.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-force-update.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { Button, Text, Group } from '@mantine/core'; +import { Button, Group, Text } from '@mantine/core'; +import { randomId, useForceUpdate } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { useForceUpdate, randomId } from '@mantine/hooks'; const code = ` import { Button, Text, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/hooks/use-fullscreen.demo.ref.tsx b/packages/@docs/demos/src/demos/hooks/use-fullscreen.demo.ref.tsx index 93763807d97..70f5111f1db 100644 --- a/packages/@docs/demos/src/demos/hooks/use-fullscreen.demo.ref.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-fullscreen.demo.ref.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { useFullscreen } from '@mantine/hooks'; import { Button, Stack } from '@mantine/core'; +import { useFullscreen } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; const refCode = ` diff --git a/packages/@docs/demos/src/demos/hooks/use-fullscreen.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-fullscreen.demo.usage.tsx index a11010357b2..4bf72e7f705 100644 --- a/packages/@docs/demos/src/demos/hooks/use-fullscreen.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-fullscreen.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Button } from '@mantine/core'; import { useFullscreen } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { Button } from '@mantine/core'; const code = ` import { useFullscreen } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/hooks/use-hash.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-hash.demo.usage.tsx index aa3b6a8ba84..a168c6349ab 100644 --- a/packages/@docs/demos/src/demos/hooks/use-hash.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-hash.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { useHash, randomId } from '@mantine/hooks'; +import { Button, Code, Group, Text } from '@mantine/core'; +import { randomId, useHash } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { Group, Button, Text, Code } from '@mantine/core'; const code = ` import { useHash, randomId } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/hooks/use-hotkeys.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-hotkeys.demo.usage.tsx index 1ade00af6be..8e280e4c6af 100644 --- a/packages/@docs/demos/src/demos/hooks/use-hotkeys.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-hotkeys.demo.usage.tsx @@ -1,8 +1,8 @@ import React, { useState } from 'react'; +import { TextInput } from '@mantine/core'; import { getHotkeyHandler, useHotkeys } from '@mantine/hooks'; import { notifications } from '@mantine/notifications'; import { MantineDemo } from '@mantinex/demo'; -import { TextInput } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-hover.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-hover.demo.usage.tsx index f0d9d3b256b..48e4cbbcab1 100644 --- a/packages/@docs/demos/src/demos/hooks/use-hover.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-hover.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { rem, Text } from '@mantine/core'; import { useHover } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { Text, rem } from '@mantine/core'; const code = ` import { useHover } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/hooks/use-idle.demo.events.tsx b/packages/@docs/demos/src/demos/hooks/use-idle.demo.events.tsx index 92df24a047b..d0a2742d3b8 100644 --- a/packages/@docs/demos/src/demos/hooks/use-idle.demo.events.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-idle.demo.events.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Badge } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { useIdle } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const eventsCode = ` import { Badge } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/hooks/use-idle.demo.state.tsx b/packages/@docs/demos/src/demos/hooks/use-idle.demo.state.tsx index c6c0e006067..af9597fb8c8 100644 --- a/packages/@docs/demos/src/demos/hooks/use-idle.demo.state.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-idle.demo.state.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Badge } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { useIdle } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const initialStateCode = ` import { Badge } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/hooks/use-idle.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-idle.demo.usage.tsx index dd34b9ca867..267f3ef3eb9 100644 --- a/packages/@docs/demos/src/demos/hooks/use-idle.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-idle.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Badge } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { useIdle } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Badge } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/hooks/use-intersection.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-intersection.demo.usage.tsx index 7674e35875b..8424e72b181 100644 --- a/packages/@docs/demos/src/demos/hooks/use-intersection.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-intersection.demo.usage.tsx @@ -1,7 +1,7 @@ import React, { useRef } from 'react'; +import { Box, Paper, Text } from '@mantine/core'; import { useIntersection } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { Text, Paper, Box } from '@mantine/core'; const code = ` import { useRef } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-interval.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-interval.demo.usage.tsx index 4a7b250b048..2e99569c805 100644 --- a/packages/@docs/demos/src/demos/hooks/use-interval.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-interval.demo.usage.tsx @@ -1,7 +1,7 @@ -import React, { useState, useEffect } from 'react'; -import { Stack, Button, Text } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import React, { useEffect, useState } from 'react'; +import { Button, Stack, Text } from '@mantine/core'; import { useInterval } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState, useEffect } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-logger.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-logger.demo.usage.tsx index 216954cd8c9..d4583e22e1d 100644 --- a/packages/@docs/demos/src/demos/hooks/use-logger.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-logger.demo.usage.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; +import { Button } from '@mantine/core'; import { useLogger } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { Button } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-media-query.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-media-query.demo.usage.tsx index 0dd2a0aa497..dee34db03d7 100644 --- a/packages/@docs/demos/src/demos/hooks/use-media-query.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-media-query.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Badge, em } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { useMediaQuery } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Badge } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/hooks/use-mouse.demo.ref.tsx b/packages/@docs/demos/src/demos/hooks/use-mouse.demo.ref.tsx index 30aacb7e188..36c14772696 100644 --- a/packages/@docs/demos/src/demos/hooks/use-mouse.demo.ref.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-mouse.demo.ref.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { Group, Text, Code, Box } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Box, Code, Group, Text } from '@mantine/core'; import { useMouse } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Text, Code, Group, Box } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/hooks/use-mouse.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-mouse.demo.usage.tsx index e4cbde96f3f..7b931bc6983 100644 --- a/packages/@docs/demos/src/demos/hooks/use-mouse.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-mouse.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { Text, Code } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Code, Text } from '@mantine/core'; import { useMouse } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Text, Code } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/hooks/use-move.demo.color.tsx b/packages/@docs/demos/src/demos/hooks/use-move.demo.color.tsx index faf79118ac9..875887f1de6 100644 --- a/packages/@docs/demos/src/demos/hooks/use-move.demo.color.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-move.demo.color.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; import { rem } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { useMove } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-move.demo.horizontal.tsx b/packages/@docs/demos/src/demos/hooks/use-move.demo.horizontal.tsx index dedc21d6beb..f701256282a 100644 --- a/packages/@docs/demos/src/demos/hooks/use-move.demo.horizontal.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-move.demo.horizontal.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Group, Text, rem } from '@mantine/core'; +import { Group, rem, Text } from '@mantine/core'; import { useMove } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-move.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-move.demo.usage.tsx index cbe6a625a86..ec252363d6d 100644 --- a/packages/@docs/demos/src/demos/hooks/use-move.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-move.demo.usage.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Group, Text, Code, rem } from '@mantine/core'; +import { Code, Group, rem, Text } from '@mantine/core'; import { useMove } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-move.demo.vertical.tsx b/packages/@docs/demos/src/demos/hooks/use-move.demo.vertical.tsx index f282a935898..6ceac132c2a 100644 --- a/packages/@docs/demos/src/demos/hooks/use-move.demo.vertical.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-move.demo.vertical.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Group, Text, rem } from '@mantine/core'; +import { Group, rem, Text } from '@mantine/core'; import { useMove } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-network.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-network.demo.usage.tsx index 09e93c36bb2..0289895def0 100644 --- a/packages/@docs/demos/src/demos/hooks/use-network.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-network.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { Text, Table } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Table, Text } from '@mantine/core'; import { useNetwork } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Text, Table } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/hooks/use-os.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-os.demo.usage.tsx index b0dfbdcf3dc..78ee825b38b 100644 --- a/packages/@docs/demos/src/demos/hooks/use-os.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-os.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Text } from '@mantine/core'; import { useOs } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { Text } from '@mantine/core'; const code = ` import { useOs } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/hooks/use-page-leave.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-page-leave.demo.usage.tsx index ed8d7cf22ab..5042da8ea3f 100644 --- a/packages/@docs/demos/src/demos/hooks/use-page-leave.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-page-leave.demo.usage.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; +import { Text } from '@mantine/core'; import { usePageLeave } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { Text } from '@mantine/core'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-previous.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-previous.demo.usage.tsx index 3ede0dc657a..7ff39a8467d 100644 --- a/packages/@docs/demos/src/demos/hooks/use-previous.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-previous.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { TextInput, Text } from '@mantine/core'; +import { Text, TextInput } from '@mantine/core'; +import { useInputState, usePrevious } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { usePrevious, useInputState } from '@mantine/hooks'; const code = ` import { TextInput, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/hooks/use-reduced-motion.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-reduced-motion.demo.usage.tsx index f579ec15d17..760aabc39f9 100644 --- a/packages/@docs/demos/src/demos/hooks/use-reduced-motion.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-reduced-motion.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Badge } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { useReducedMotion } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Badge } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/hooks/use-resize-observer.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-resize-observer.demo.usage.tsx index 1a7ae129a08..26b095e87fd 100644 --- a/packages/@docs/demos/src/demos/hooks/use-resize-observer.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-resize-observer.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { useMantineTheme, Text, Group, Code, rem } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Code, Group, rem, Text, useMantineTheme } from '@mantine/core'; import { useResizeObserver } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Text, Code, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/hooks/use-scroll-into-view.demo.axis.tsx b/packages/@docs/demos/src/demos/hooks/use-scroll-into-view.demo.axis.tsx index 21dd82e9d3f..27e1db69446 100644 --- a/packages/@docs/demos/src/demos/hooks/use-scroll-into-view.demo.axis.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-scroll-into-view.demo.axis.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Box, Button, Group, Paper, Text } from '@mantine/core'; import { useScrollIntoView } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { Button, Text, Group, Paper, Box } from '@mantine/core'; const code = ` import { useScrollIntoView } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/hooks/use-scroll-into-view.demo.parent.tsx b/packages/@docs/demos/src/demos/hooks/use-scroll-into-view.demo.parent.tsx index a1ef985c2e9..615bb6fbaf1 100644 --- a/packages/@docs/demos/src/demos/hooks/use-scroll-into-view.demo.parent.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-scroll-into-view.demo.parent.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Box, Button, Group, Paper, Text } from '@mantine/core'; import { useScrollIntoView } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { Button, Text, Group, Paper, Box } from '@mantine/core'; const code = ` import { useScrollIntoView } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/hooks/use-scroll-into-view.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-scroll-into-view.demo.usage.tsx index d6e556582c3..546406ef611 100644 --- a/packages/@docs/demos/src/demos/hooks/use-scroll-into-view.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-scroll-into-view.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Box, Button, Group, Text } from '@mantine/core'; import { useScrollIntoView } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { Button, Text, Group, Box } from '@mantine/core'; const code = ` import { useScrollIntoView } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/hooks/use-text-selection.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-text-selection.demo.usage.tsx index 7387966fa88..8d68cb98489 100644 --- a/packages/@docs/demos/src/demos/hooks/use-text-selection.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-text-selection.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { useTextSelection } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useTextSelection } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/hooks/use-timeout.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-timeout.demo.usage.tsx index 75b852569f0..996693df300 100644 --- a/packages/@docs/demos/src/demos/hooks/use-timeout.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-timeout.demo.usage.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { Button, Text, Group } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Button, Group, Text } from '@mantine/core'; import { randomId, useTimeout } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/hooks/use-toggle.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-toggle.demo.usage.tsx index 0c71b56bd93..7ffb30565a5 100644 --- a/packages/@docs/demos/src/demos/hooks/use-toggle.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-toggle.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Button } from '@mantine/core'; +import { upperFirst, useToggle } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { useToggle, upperFirst } from '@mantine/hooks'; const code = ` import { Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/hooks/use-validated-state.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-validated-state.demo.usage.tsx index b0971bed3c4..b9efda893f2 100644 --- a/packages/@docs/demos/src/demos/hooks/use-validated-state.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-validated-state.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { TextInput, Text, Box } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Box, Text, TextInput } from '@mantine/core'; import { useValidatedState } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TextInput, Text, Box } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/hooks/use-viewport-size.demo.tsx b/packages/@docs/demos/src/demos/hooks/use-viewport-size.demo.tsx index 5af521d8b89..7fe8e947dfe 100644 --- a/packages/@docs/demos/src/demos/hooks/use-viewport-size.demo.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-viewport-size.demo.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Text } from '@mantine/core'; import { useViewportSize } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { Text } from '@mantine/core'; const code = ` import { useViewportSize } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/hooks/use-window-scroll.demo.usage.tsx b/packages/@docs/demos/src/demos/hooks/use-window-scroll.demo.usage.tsx index 06493162185..eea3491a429 100644 --- a/packages/@docs/demos/src/demos/hooks/use-window-scroll.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/hooks/use-window-scroll.demo.usage.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { Button, Group, Text } from '@mantine/core'; import { useWindowScroll } from '@mantine/hooks'; import { MantineDemo } from '@mantinex/demo'; -import { Button, Text, Group } from '@mantine/core'; const code = ` import { useWindowScroll } from '@mantine/hooks'; diff --git a/packages/@docs/demos/src/demos/modals/Modals.demo.confirm.tsx b/packages/@docs/demos/src/demos/modals/Modals.demo.confirm.tsx index d0620102099..5fae4c9580f 100644 --- a/packages/@docs/demos/src/demos/modals/Modals.demo.confirm.tsx +++ b/packages/@docs/demos/src/demos/modals/Modals.demo.confirm.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { Button, Text } from '@mantine/core'; import { modals } from '@mantine/modals'; -import { MantineDemo } from '@mantinex/demo'; import { notifications } from '@mantine/notifications'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/modals/Modals.demo.confirmCustomize.tsx b/packages/@docs/demos/src/demos/modals/Modals.demo.confirmCustomize.tsx index e67a314ce6f..29ce4dadc43 100644 --- a/packages/@docs/demos/src/demos/modals/Modals.demo.confirmCustomize.tsx +++ b/packages/@docs/demos/src/demos/modals/Modals.demo.confirmCustomize.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { Button, Text } from '@mantine/core'; import { modals } from '@mantine/modals'; -import { MantineDemo } from '@mantinex/demo'; import { notifications } from '@mantine/notifications'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/modals/Modals.demo.content.tsx b/packages/@docs/demos/src/demos/modals/Modals.demo.content.tsx index e6252af0ded..4f88123c91a 100644 --- a/packages/@docs/demos/src/demos/modals/Modals.demo.content.tsx +++ b/packages/@docs/demos/src/demos/modals/Modals.demo.content.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { TextInput, Button } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Button, TextInput } from '@mantine/core'; import { modals } from '@mantine/modals'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { TextInput, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/modals/Modals.demo.context.tsx b/packages/@docs/demos/src/demos/modals/Modals.demo.context.tsx index 23d24e06a7e..50087c7c35b 100644 --- a/packages/@docs/demos/src/demos/modals/Modals.demo.context.tsx +++ b/packages/@docs/demos/src/demos/modals/Modals.demo.context.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Button } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { modals } from '@mantine/modals'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/modals/Modals.demo.modalProps.tsx b/packages/@docs/demos/src/demos/modals/Modals.demo.modalProps.tsx index 3e2ccb61783..465be8731df 100644 --- a/packages/@docs/demos/src/demos/modals/Modals.demo.modalProps.tsx +++ b/packages/@docs/demos/src/demos/modals/Modals.demo.modalProps.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { Button, Text } from '@mantine/core'; import { modals } from '@mantine/modals'; -import { MantineDemo } from '@mantinex/demo'; import { notifications } from '@mantine/notifications'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/modals/Modals.demo.multipleSteps.tsx b/packages/@docs/demos/src/demos/modals/Modals.demo.multipleSteps.tsx index e934db49a65..42f7683263f 100644 --- a/packages/@docs/demos/src/demos/modals/Modals.demo.multipleSteps.tsx +++ b/packages/@docs/demos/src/demos/modals/Modals.demo.multipleSteps.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Button, Text } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { modals } from '@mantine/modals'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/modals/Modals.demos.story.tsx b/packages/@docs/demos/src/demos/modals/Modals.demos.story.tsx index 72a73e516cd..6907010d4eb 100644 --- a/packages/@docs/demos/src/demos/modals/Modals.demos.story.tsx +++ b/packages/@docs/demos/src/demos/modals/Modals.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../render-demo'; +import * as demos from './index'; export default { title: 'Modals' }; diff --git a/packages/@docs/demos/src/demos/notifications/Notifications.demo.autoclose.tsx b/packages/@docs/demos/src/demos/notifications/Notifications.demo.autoclose.tsx index 166bd7521bd..ebef98bd52d 100644 --- a/packages/@docs/demos/src/demos/notifications/Notifications.demo.autoclose.tsx +++ b/packages/@docs/demos/src/demos/notifications/Notifications.demo.autoclose.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { Group, Button } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; +import { Button, Group } from '@mantine/core'; import { notifications } from '@mantine/notifications'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Group, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/notifications/Notifications.demo.base.tsx b/packages/@docs/demos/src/demos/notifications/Notifications.demo.base.tsx index f7c52c79a3f..55be0887f52 100644 --- a/packages/@docs/demos/src/demos/notifications/Notifications.demo.base.tsx +++ b/packages/@docs/demos/src/demos/notifications/Notifications.demo.base.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Button } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { notifications } from '@mantine/notifications'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/notifications/Notifications.demo.clean.tsx b/packages/@docs/demos/src/demos/notifications/Notifications.demo.clean.tsx index dd4abc527ee..57b98cb9606 100644 --- a/packages/@docs/demos/src/demos/notifications/Notifications.demo.clean.tsx +++ b/packages/@docs/demos/src/demos/notifications/Notifications.demo.clean.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Group, Button } from '@mantine/core'; +import { Button, Group } from '@mantine/core'; import { notifications } from '@mantine/notifications'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Group, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/notifications/Notifications.demo.customize.tsx b/packages/@docs/demos/src/demos/notifications/Notifications.demo.customize.tsx index 450f0d5ea51..d219cc0f81c 100644 --- a/packages/@docs/demos/src/demos/notifications/Notifications.demo.customize.tsx +++ b/packages/@docs/demos/src/demos/notifications/Notifications.demo.customize.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Button, Group } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { notifications } from '@mantine/notifications'; +import { MantineDemo } from '@mantinex/demo'; import classes from './Notifications.demo.customize.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/notifications/Notifications.demo.limit.tsx b/packages/@docs/demos/src/demos/notifications/Notifications.demo.limit.tsx index 2ea8a69019a..eefdd107a05 100644 --- a/packages/@docs/demos/src/demos/notifications/Notifications.demo.limit.tsx +++ b/packages/@docs/demos/src/demos/notifications/Notifications.demo.limit.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Button } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { notifications } from '@mantine/notifications'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/notifications/Notifications.demo.update.tsx b/packages/@docs/demos/src/demos/notifications/Notifications.demo.update.tsx index 3d6ff1ef050..372483c271d 100644 --- a/packages/@docs/demos/src/demos/notifications/Notifications.demo.update.tsx +++ b/packages/@docs/demos/src/demos/notifications/Notifications.demo.update.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { IconCheck } from '@tabler/icons-react'; import { Button, rem } from '@mantine/core'; -import { MantineDemo } from '@mantinex/demo'; import { notifications } from '@mantine/notifications'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/notifications/Notifications.demos.story.tsx b/packages/@docs/demos/src/demos/notifications/Notifications.demos.story.tsx index 432868933ea..c9aa68ffc04 100644 --- a/packages/@docs/demos/src/demos/notifications/Notifications.demos.story.tsx +++ b/packages/@docs/demos/src/demos/notifications/Notifications.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../render-demo'; +import * as demos from './index'; export default { title: 'Notifications' }; diff --git a/packages/@docs/demos/src/demos/nprogress/NProgress.demo.usage.tsx b/packages/@docs/demos/src/demos/nprogress/NProgress.demo.usage.tsx index 551b1bce491..89ef09a73d0 100644 --- a/packages/@docs/demos/src/demos/nprogress/NProgress.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/nprogress/NProgress.demo.usage.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { Button, Group } from '@mantine/core'; -import { nprogress, NavigationProgress } from '@mantine/nprogress'; +import { NavigationProgress, nprogress } from '@mantine/nprogress'; import { MantineDemo } from '@mantinex/demo'; const code = ` diff --git a/packages/@docs/demos/src/demos/nprogress/NProgress.demos.story.tsx b/packages/@docs/demos/src/demos/nprogress/NProgress.demos.story.tsx index 23dfc876101..e2e7b399232 100644 --- a/packages/@docs/demos/src/demos/nprogress/NProgress.demos.story.tsx +++ b/packages/@docs/demos/src/demos/nprogress/NProgress.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../render-demo'; +import * as demos from './index'; export default { title: 'NProgress' }; diff --git a/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.compound.tsx b/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.compound.tsx index 317defd6690..1ec70aa1b77 100644 --- a/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.compound.tsx +++ b/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.compound.tsx @@ -1,8 +1,8 @@ import React, { useMemo, useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Spotlight, createSpotlight } from '@mantine/spotlight'; -import { Button } from '@mantine/core'; import { IconSearch } from '@tabler/icons-react'; +import { Button } from '@mantine/core'; +import { createSpotlight, Spotlight } from '@mantine/spotlight'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.customAction.tsx b/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.customAction.tsx index 48a3b96f6e1..28ef9291892 100644 --- a/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.customAction.tsx +++ b/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.customAction.tsx @@ -1,9 +1,9 @@ /* eslint-disable no-console */ import React, { useMemo, useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Spotlight, createSpotlight } from '@mantine/spotlight'; -import { Badge, Button, Center, Group, Text } from '@mantine/core'; import { IconSearch } from '@tabler/icons-react'; +import { Badge, Button, Center, Group, Text } from '@mantine/core'; +import { createSpotlight, Spotlight } from '@mantine/spotlight'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useState } from 'react'; diff --git a/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.groups.tsx b/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.groups.tsx index e8a39f10097..d8d6da8e897 100644 --- a/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.groups.tsx +++ b/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.groups.tsx @@ -1,9 +1,9 @@ /* eslint-disable no-console */ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { IconSearch } from '@tabler/icons-react'; import { rem } from '@mantine/core'; import { SpotlightActionData, SpotlightActionGroupData } from '@mantine/spotlight'; +import { MantineDemo } from '@mantinex/demo'; import { SpotlightDemoBase } from './_demo-base'; const code = ` diff --git a/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.limit.tsx b/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.limit.tsx index f87634265b9..20a9c78402a 100644 --- a/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.limit.tsx +++ b/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.limit.tsx @@ -1,9 +1,9 @@ /* eslint-disable no-console */ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { IconSearch } from '@tabler/icons-react'; import { rem } from '@mantine/core'; import { SpotlightActionData } from '@mantine/spotlight'; +import { MantineDemo } from '@mantinex/demo'; import { SpotlightDemoBase } from './_demo-base'; const code = ` diff --git a/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.scrollable.tsx b/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.scrollable.tsx index 04294527a90..1cde15922d7 100644 --- a/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.scrollable.tsx +++ b/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.scrollable.tsx @@ -1,9 +1,9 @@ /* eslint-disable no-console */ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { IconSearch } from '@tabler/icons-react'; import { rem } from '@mantine/core'; import { SpotlightActionData } from '@mantine/spotlight'; +import { MantineDemo } from '@mantinex/demo'; import { SpotlightDemoBase } from './_demo-base'; const code = ` diff --git a/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.usage.tsx b/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.usage.tsx index 848a4821f1c..afdf5e1c1a4 100644 --- a/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/spotlight/Spotlight.demo.usage.tsx @@ -1,9 +1,9 @@ /* eslint-disable no-console */ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { IconHome, IconDashboard, IconFileText, IconSearch } from '@tabler/icons-react'; +import { IconDashboard, IconFileText, IconHome, IconSearch } from '@tabler/icons-react'; import { rem } from '@mantine/core'; import { SpotlightActionData } from '@mantine/spotlight'; +import { MantineDemo } from '@mantinex/demo'; import { SpotlightDemoBase } from './_demo-base'; const actions: SpotlightActionData[] = [ diff --git a/packages/@docs/demos/src/demos/spotlight/Spotlight.demos.story.tsx b/packages/@docs/demos/src/demos/spotlight/Spotlight.demos.story.tsx index f0bd36e55a1..98f9c424bf3 100644 --- a/packages/@docs/demos/src/demos/spotlight/Spotlight.demos.story.tsx +++ b/packages/@docs/demos/src/demos/spotlight/Spotlight.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../render-demo'; +import * as demos from './index'; export default { title: 'Spotlight' }; diff --git a/packages/@docs/demos/src/demos/spotlight/_demo-base.tsx b/packages/@docs/demos/src/demos/spotlight/_demo-base.tsx index b5901ae41d1..680014009d8 100644 --- a/packages/@docs/demos/src/demos/spotlight/_demo-base.tsx +++ b/packages/@docs/demos/src/demos/spotlight/_demo-base.tsx @@ -1,6 +1,6 @@ import React, { useMemo } from 'react'; import { Button, Group } from '@mantine/core'; -import { createSpotlight, SpotlightProps, Spotlight } from '@mantine/spotlight'; +import { createSpotlight, Spotlight, SpotlightProps } from '@mantine/spotlight'; export function SpotlightDemoBase(props: Partial) { const [store, actions] = useMemo(createSpotlight, []); diff --git a/packages/@docs/demos/src/demos/styles/Styles.demo.className.tsx b/packages/@docs/demos/src/demos/styles/Styles.demo.className.tsx index 6bc353260a2..1914747c173 100644 --- a/packages/@docs/demos/src/demos/styles/Styles.demo.className.tsx +++ b/packages/@docs/demos/src/demos/styles/Styles.demo.className.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Box } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import classes from './Styles.demo.className.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/styles/Styles.demo.classNames.tsx b/packages/@docs/demos/src/demos/styles/Styles.demo.classNames.tsx index 7d605f684a5..47ce4b523d7 100644 --- a/packages/@docs/demos/src/demos/styles/Styles.demo.classNames.tsx +++ b/packages/@docs/demos/src/demos/styles/Styles.demo.classNames.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TextInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import classes from './Styles.demo.classNames.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/styles/Styles.demo.classNamesProps.tsx b/packages/@docs/demos/src/demos/styles/Styles.demo.classNamesProps.tsx index bb7d3fbc756..11d5eaa0f76 100644 --- a/packages/@docs/demos/src/demos/styles/Styles.demo.classNamesProps.tsx +++ b/packages/@docs/demos/src/demos/styles/Styles.demo.classNamesProps.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import cx from 'clsx'; -import { MantineThemeProvider, createTheme, TextInput } from '@mantine/core'; +import { createTheme, MantineThemeProvider, TextInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import classes from './Styles.demo.classNamesProps.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/styles/Styles.demo.customVariant.tsx b/packages/@docs/demos/src/demos/styles/Styles.demo.customVariant.tsx index 592d9cabd50..b119f9d1c50 100644 --- a/packages/@docs/demos/src/demos/styles/Styles.demo.customVariant.tsx +++ b/packages/@docs/demos/src/demos/styles/Styles.demo.customVariant.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Input } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import classes from './Styles.demo.customVariant.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/styles/Styles.demo.dataAttributes.tsx b/packages/@docs/demos/src/demos/styles/Styles.demo.dataAttributes.tsx index 4e53c8f1c2b..1abd8eb9a5f 100644 --- a/packages/@docs/demos/src/demos/styles/Styles.demo.dataAttributes.tsx +++ b/packages/@docs/demos/src/demos/styles/Styles.demo.dataAttributes.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Button, ButtonProps, Group, rem } from '@mantine/core'; import { IconArrowRight } from '@tabler/icons-react'; +import { Button, ButtonProps, Group, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import classes from './Styles.demo.dataAttributes.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/styles/Styles.demo.dataSize.tsx b/packages/@docs/demos/src/demos/styles/Styles.demo.dataSize.tsx index 39a221fb186..c1bfc589acb 100644 --- a/packages/@docs/demos/src/demos/styles/Styles.demo.dataSize.tsx +++ b/packages/@docs/demos/src/demos/styles/Styles.demo.dataSize.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { createTheme, Input, MantineThemeProvider } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Input, createTheme, MantineThemeProvider } from '@mantine/core'; import classes from './Styles.demo.dataSize.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/styles/Styles.demo.directionControl.tsx b/packages/@docs/demos/src/demos/styles/Styles.demo.directionControl.tsx index 624dfb57a74..e6818b7eb9e 100644 --- a/packages/@docs/demos/src/demos/styles/Styles.demo.directionControl.tsx +++ b/packages/@docs/demos/src/demos/styles/Styles.demo.directionControl.tsx @@ -1,7 +1,7 @@ import React, { useEffect } from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { ActionIcon, useDirection } from '@mantine/core'; import { IconTextDirectionLtr, IconTextDirectionRtl } from '@tabler/icons-react'; +import { ActionIcon, useDirection } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { ActionIcon, useDirection } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/styles/Styles.demo.globalClasses.tsx b/packages/@docs/demos/src/demos/styles/Styles.demo.globalClasses.tsx index 7cc04e86229..21ddbdecd18 100644 --- a/packages/@docs/demos/src/demos/styles/Styles.demo.globalClasses.tsx +++ b/packages/@docs/demos/src/demos/styles/Styles.demo.globalClasses.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Group } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/styles/Styles.demo.hiddenVisible.tsx b/packages/@docs/demos/src/demos/styles/Styles.demo.hiddenVisible.tsx index 0042044c027..4dc4a8fd096 100644 --- a/packages/@docs/demos/src/demos/styles/Styles.demo.hiddenVisible.tsx +++ b/packages/@docs/demos/src/demos/styles/Styles.demo.hiddenVisible.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button, Group } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/styles/Styles.demo.lightDarkHidden.tsx b/packages/@docs/demos/src/demos/styles/Styles.demo.lightDarkHidden.tsx index ab76ee974ad..e661e351435 100644 --- a/packages/@docs/demos/src/demos/styles/Styles.demo.lightDarkHidden.tsx +++ b/packages/@docs/demos/src/demos/styles/Styles.demo.lightDarkHidden.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/styles/Styles.demo.remSlider.tsx b/packages/@docs/demos/src/demos/styles/Styles.demo.remSlider.tsx index 3dd73b751e8..fd560de6bc6 100644 --- a/packages/@docs/demos/src/demos/styles/Styles.demo.remSlider.tsx +++ b/packages/@docs/demos/src/demos/styles/Styles.demo.remSlider.tsx @@ -1,6 +1,6 @@ import React, { useEffect } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Slider } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Slider } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/styles/Styles.demo.responsiveStyleProps.tsx b/packages/@docs/demos/src/demos/styles/Styles.demo.responsiveStyleProps.tsx index b9531f1b9e8..e291158c522 100644 --- a/packages/@docs/demos/src/demos/styles/Styles.demo.responsiveStyleProps.tsx +++ b/packages/@docs/demos/src/demos/styles/Styles.demo.responsiveStyleProps.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Box } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Box } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/styles/Styles.demo.sizesMedia.tsx b/packages/@docs/demos/src/demos/styles/Styles.demo.sizesMedia.tsx index 8f546691a2d..12f2fbf0a40 100644 --- a/packages/@docs/demos/src/demos/styles/Styles.demo.sizesMedia.tsx +++ b/packages/@docs/demos/src/demos/styles/Styles.demo.sizesMedia.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { TextInput } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import classes from './Styles.demo.sizesMedia.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/styles/Styles.demo.styles.tsx b/packages/@docs/demos/src/demos/styles/Styles.demo.styles.tsx index d8da2457e29..cd5b731fd95 100644 --- a/packages/@docs/demos/src/demos/styles/Styles.demo.styles.tsx +++ b/packages/@docs/demos/src/demos/styles/Styles.demo.styles.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button, rem } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button, rem } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/styles/Styles.demo.unstyled.tsx b/packages/@docs/demos/src/demos/styles/Styles.demo.unstyled.tsx index 45bbd0d529e..65223b3579c 100644 --- a/packages/@docs/demos/src/demos/styles/Styles.demo.unstyled.tsx +++ b/packages/@docs/demos/src/demos/styles/Styles.demo.unstyled.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Tabs } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Tabs } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/styles/Styles.demo.useMediaQueryHook.tsx b/packages/@docs/demos/src/demos/styles/Styles.demo.useMediaQueryHook.tsx index 26cae4165e5..67c9a4d2f08 100644 --- a/packages/@docs/demos/src/demos/styles/Styles.demo.useMediaQueryHook.tsx +++ b/packages/@docs/demos/src/demos/styles/Styles.demo.useMediaQueryHook.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { Tooltip, Button, em } from '@mantine/core'; +import { Button, em, Tooltip } from '@mantine/core'; import { useMediaQuery } from '@mantine/hooks'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Tooltip, Button, em } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/styles/Styles.demo.vars.tsx b/packages/@docs/demos/src/demos/styles/Styles.demo.vars.tsx index 4350450d0f5..e607bbeb63b 100644 --- a/packages/@docs/demos/src/demos/styles/Styles.demo.vars.tsx +++ b/packages/@docs/demos/src/demos/styles/Styles.demo.vars.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, ButtonFactory, Group, PartialVarsResolver, rem } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Button, rem, PartialVarsResolver, ButtonFactory, Group } from '@mantine/core'; const inlineCode = ` import { Button, rem, PartialVarsResolver, ButtonFactory, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/styles/Styles.demos.story.tsx b/packages/@docs/demos/src/demos/styles/Styles.demos.story.tsx index da4c56eb19b..e9d31a2d68a 100644 --- a/packages/@docs/demos/src/demos/styles/Styles.demos.story.tsx +++ b/packages/@docs/demos/src/demos/styles/Styles.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../render-demo'; +import * as demos from './index'; export default { title: 'Styles' }; diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.activeClassName.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.activeClassName.tsx index 34479bd9577..b2d99ab3004 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.activeClassName.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.activeClassName.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, MantineThemeProvider } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { MantineThemeProvider, Button } from '@mantine/core'; import classes from './Theming.demo.activeClassName.module.css'; const tsxCode = ` diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.activeClassNameEmpty.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.activeClassNameEmpty.tsx index ee495cca77a..df20dfe85b0 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.activeClassNameEmpty.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.activeClassNameEmpty.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, MantineThemeProvider } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { MantineThemeProvider, Button } from '@mantine/core'; const code = ` import { MantineProvider, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.colorAndCProps.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.colorAndCProps.tsx index b25706c292a..a245959c956 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.colorAndCProps.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.colorAndCProps.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.colorProp.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.colorProp.tsx index d1d4d05447c..8b687d8cec3 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.colorProp.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.colorProp.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Group, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Group, Button, Text } from '@mantine/core'; const code = ` import { Group, Button, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.colorScheme.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.colorScheme.tsx index 927b1ee1241..5fc90e59076 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.colorScheme.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.colorScheme.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Group, useMantineColorScheme } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { useMantineColorScheme, Button, Group } from '@mantine/core'; const code = ` import { useMantineColorScheme, Button, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.colorSchemeControl.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.colorSchemeControl.tsx index 3117f6019e4..319af7d413a 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.colorSchemeControl.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.colorSchemeControl.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { IconMoon, IconSun } from '@tabler/icons-react'; import cx from 'clsx'; -import { IconSun, IconMoon } from '@tabler/icons-react'; -import { ActionIcon, useMantineColorScheme, useComputedColorScheme } from '@mantine/core'; +import { ActionIcon, useComputedColorScheme, useMantineColorScheme } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; import classes from './Theming.demo.colorSchemeControl.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.colorsIndexConfigurator.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.colorsIndexConfigurator.tsx index a25918a1ea9..acdcfc2f6a0 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.colorsIndexConfigurator.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.colorsIndexConfigurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button, Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = (props: any) => ` import { Button, Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.colorsOverride.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.colorsOverride.tsx index ca43e238351..75e0400862a 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.colorsOverride.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.colorsOverride.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Group } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Group, Button } from '@mantine/core'; const code = ` import { Group, Button, MantineProvider } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.cursorType.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.cursorType.tsx index f51c6db64aa..91b64ee42d7 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.cursorType.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.cursorType.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Checkbox, createTheme, MantineThemeProvider } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { MantineThemeProvider, createTheme, Checkbox } from '@mantine/core'; const code = ` import { MantineProvider, createTheme, Checkbox } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.defaultGradient.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.defaultGradient.tsx index 5343fdf2a35..3c5b2ebe16a 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.defaultGradient.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.defaultGradient.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, createTheme, MantineThemeProvider } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { MantineThemeProvider, createTheme, Button } from '@mantine/core'; const code = ` import { MantineProvider, createTheme, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.defaultProps.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.defaultProps.tsx index 9ee1c2401b2..04eb7116ff9 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.defaultProps.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.defaultProps.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, createTheme, Group, MantineThemeProvider } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { MantineThemeProvider, Button, Group, createTheme } from '@mantine/core'; const code = ` import { MantineProvider, Button, Group, createTheme } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.defaultRadiusConfigurator.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.defaultRadiusConfigurator.tsx index bc865f84abb..af9266950e2 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.defaultRadiusConfigurator.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.defaultRadiusConfigurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, TextInput } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { TextInput, Button } from '@mantine/core'; const code = (props: Record) => ` import { MantineProvider, TextInput, Button } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.focusClassName.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.focusClassName.tsx index cde5ff92a5b..d4d6e6bd594 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.focusClassName.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.focusClassName.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, MantineThemeProvider } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { MantineThemeProvider, Button } from '@mantine/core'; import classes from './Theming.demo.focusClassName.module.css'; const tsxCode = ` diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.focusRing.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.focusRing.tsx index ee132bdde18..30aec1c5361 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.focusRing.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.focusRing.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Code, Group, MantineThemeProvider, Text } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Text, Group, Button, Code, MantineThemeProvider } from '@mantine/core'; function Demo() { return ( diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.fontSizeConfigurator.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.fontSizeConfigurator.tsx index 487980fca92..75ec059c236 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.fontSizeConfigurator.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.fontSizeConfigurator.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Text } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = (props: any) => ` import { Text } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.fonts.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.fonts.tsx index 431299103ee..63816e89e8f 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.fonts.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.fonts.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Code, Group, Title } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Button, Code, Title, Group } from '@mantine/core'; const code = ` import { Button, Code, Title, MantineProvider } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.headingsStyles.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.headingsStyles.tsx index c897c4c3fc2..0a6c0f45118 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.headingsStyles.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.headingsStyles.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { MantineThemeProvider, Title } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Title, MantineThemeProvider } from '@mantine/core'; import classes from './Theming.demo.headingStyles.module.css'; const code = ` diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.primaryColor.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.primaryColor.tsx index e537642df69..84578f929ff 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.primaryColor.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.primaryColor.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Group } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { Group, Button } from '@mantine/core'; const code = ` import { Group, Button, MantineProvider } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.primaryShadeConfigurator.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.primaryShadeConfigurator.tsx index feeaf06bd93..2eb7f159bed 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.primaryShadeConfigurator.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.primaryShadeConfigurator.tsx @@ -1,6 +1,6 @@ import React, { useEffect, useState } from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button, Group, MantineProvider, useMantineColorScheme } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = (props: any) => ` import { MantineProvider, Button, Group } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.usePropsHook.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.usePropsHook.tsx index 10f3597bfb3..c36b7c808fd 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.usePropsHook.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.usePropsHook.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { createTheme, MantineThemeProvider, useProps } from '@mantine/core'; import { MantineDemo } from '@mantinex/demo'; -import { useProps, MantineThemeProvider, createTheme } from '@mantine/core'; const code = ` import { useProps, MantineThemeProvider, createTheme } from '@mantine/core'; diff --git a/packages/@docs/demos/src/demos/theming/Theming.demo.variantColorsResolver.tsx b/packages/@docs/demos/src/demos/theming/Theming.demo.variantColorsResolver.tsx index e036ca68d9b..1fb4b8404d9 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demo.variantColorsResolver.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demo.variantColorsResolver.tsx @@ -1,16 +1,16 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; import { Button, + darken, + defaultVariantColorsResolver, Group, MantineThemeProvider, - defaultVariantColorsResolver, - VariantColorsResolver, parseThemeColor, rem, rgba, - darken, + VariantColorsResolver, } from '@mantine/core'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { diff --git a/packages/@docs/demos/src/demos/theming/Theming.demos.story.tsx b/packages/@docs/demos/src/demos/theming/Theming.demos.story.tsx index 069f5ed1c71..04c6cc4ba5a 100644 --- a/packages/@docs/demos/src/demos/theming/Theming.demos.story.tsx +++ b/packages/@docs/demos/src/demos/theming/Theming.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../render-demo'; +import * as demos from './index'; export default { title: 'Theming' }; diff --git a/packages/@docs/demos/src/demos/tiptap/TipTap.demo.bubbleMenu.tsx b/packages/@docs/demos/src/demos/tiptap/TipTap.demo.bubbleMenu.tsx index f09fb9da549..d18c077fa1b 100644 --- a/packages/@docs/demos/src/demos/tiptap/TipTap.demo.bubbleMenu.tsx +++ b/packages/@docs/demos/src/demos/tiptap/TipTap.demo.bubbleMenu.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { useEditor, BubbleMenu } from '@tiptap/react'; +import { BubbleMenu, useEditor } from '@tiptap/react'; import StarterKit from '@tiptap/starter-kit'; -import { RichTextEditor, Link } from '@mantine/tiptap'; +import { Link, RichTextEditor } from '@mantine/tiptap'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useEditor, BubbleMenu } from '@tiptap/react'; diff --git a/packages/@docs/demos/src/demos/tiptap/TipTap.demo.codeHighlight.tsx b/packages/@docs/demos/src/demos/tiptap/TipTap.demo.codeHighlight.tsx index a956188933a..5aa4bc894c1 100644 --- a/packages/@docs/demos/src/demos/tiptap/TipTap.demo.codeHighlight.tsx +++ b/packages/@docs/demos/src/demos/tiptap/TipTap.demo.codeHighlight.tsx @@ -1,11 +1,11 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { RichTextEditor } from '@mantine/tiptap'; +import CodeBlockLowlight from '@tiptap/extension-code-block-lowlight'; import { useEditor } from '@tiptap/react'; import StarterKit from '@tiptap/starter-kit'; -import CodeBlockLowlight from '@tiptap/extension-code-block-lowlight'; -import { createLowlight } from 'lowlight'; import tsLanguageSyntax from 'highlight.js/lib/languages/typescript'; +import { createLowlight } from 'lowlight'; +import { RichTextEditor } from '@mantine/tiptap'; +import { MantineDemo } from '@mantinex/demo'; const lowlight = createLowlight(); diff --git a/packages/@docs/demos/src/demos/tiptap/TipTap.demo.colors.tsx b/packages/@docs/demos/src/demos/tiptap/TipTap.demo.colors.tsx index b7051599ffe..2b8c11b56ee 100644 --- a/packages/@docs/demos/src/demos/tiptap/TipTap.demo.colors.tsx +++ b/packages/@docs/demos/src/demos/tiptap/TipTap.demo.colors.tsx @@ -1,11 +1,11 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { useEditor } from '@tiptap/react'; import { IconColorPicker } from '@tabler/icons-react'; import { Color } from '@tiptap/extension-color'; import TextStyle from '@tiptap/extension-text-style'; +import { useEditor } from '@tiptap/react'; import StarterKit from '@tiptap/starter-kit'; import { RichTextEditor } from '@mantine/tiptap'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useEditor } from '@tiptap/react'; diff --git a/packages/@docs/demos/src/demos/tiptap/TipTap.demo.customControl.tsx b/packages/@docs/demos/src/demos/tiptap/TipTap.demo.customControl.tsx index 1336fd1c0da..707afd2489a 100644 --- a/packages/@docs/demos/src/demos/tiptap/TipTap.demo.customControl.tsx +++ b/packages/@docs/demos/src/demos/tiptap/TipTap.demo.customControl.tsx @@ -1,9 +1,9 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { IconStar } from '@tabler/icons-react'; import { useEditor } from '@tiptap/react'; import StarterKit from '@tiptap/starter-kit'; import { RichTextEditor, useRichTextEditorContext } from '@mantine/tiptap'; -import { IconStar } from '@tabler/icons-react'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useEditor } from '@tiptap/react'; diff --git a/packages/@docs/demos/src/demos/tiptap/TipTap.demo.floatingMenu.tsx b/packages/@docs/demos/src/demos/tiptap/TipTap.demo.floatingMenu.tsx index 187faa885f2..27ceccb3a80 100644 --- a/packages/@docs/demos/src/demos/tiptap/TipTap.demo.floatingMenu.tsx +++ b/packages/@docs/demos/src/demos/tiptap/TipTap.demo.floatingMenu.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { useEditor, FloatingMenu } from '@tiptap/react'; +import { FloatingMenu, useEditor } from '@tiptap/react'; import StarterKit from '@tiptap/starter-kit'; -import { RichTextEditor, Link } from '@mantine/tiptap'; +import { Link, RichTextEditor } from '@mantine/tiptap'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useEditor, FloatingMenu } from '@tiptap/react'; diff --git a/packages/@docs/demos/src/demos/tiptap/TipTap.demo.icons.tsx b/packages/@docs/demos/src/demos/tiptap/TipTap.demo.icons.tsx index ea2b88a29d4..7f094e133f9 100644 --- a/packages/@docs/demos/src/demos/tiptap/TipTap.demo.icons.tsx +++ b/packages/@docs/demos/src/demos/tiptap/TipTap.demo.icons.tsx @@ -1,9 +1,9 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; +import { IconBold, IconItalic } from '@tabler/icons-react'; import { useEditor } from '@tiptap/react'; import StarterKit from '@tiptap/starter-kit'; import { RichTextEditor } from '@mantine/tiptap'; -import { IconBold, IconItalic } from '@tabler/icons-react'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { useEditor } from '@tiptap/react'; diff --git a/packages/@docs/demos/src/demos/tiptap/TipTap.demo.placeholder.tsx b/packages/@docs/demos/src/demos/tiptap/TipTap.demo.placeholder.tsx index 45ad549c17c..afb71b4f4c0 100644 --- a/packages/@docs/demos/src/demos/tiptap/TipTap.demo.placeholder.tsx +++ b/packages/@docs/demos/src/demos/tiptap/TipTap.demo.placeholder.tsx @@ -1,9 +1,9 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { RichTextEditor } from '@mantine/tiptap'; +import Placeholder from '@tiptap/extension-placeholder'; import { useEditor } from '@tiptap/react'; import StarterKit from '@tiptap/starter-kit'; -import Placeholder from '@tiptap/extension-placeholder'; +import { RichTextEditor } from '@mantine/tiptap'; +import { MantineDemo } from '@mantinex/demo'; const code = ` import { RichTextEditor } from '@mantine/tiptap'; diff --git a/packages/@docs/demos/src/demos/tiptap/TipTap.demo.usage.tsx b/packages/@docs/demos/src/demos/tiptap/TipTap.demo.usage.tsx index 67336f47b70..912ea8272e9 100644 --- a/packages/@docs/demos/src/demos/tiptap/TipTap.demo.usage.tsx +++ b/packages/@docs/demos/src/demos/tiptap/TipTap.demo.usage.tsx @@ -1,13 +1,13 @@ import React from 'react'; -import { MantineDemo } from '@mantinex/demo'; -import { useEditor } from '@tiptap/react'; import Highlight from '@tiptap/extension-highlight'; -import StarterKit from '@tiptap/starter-kit'; -import Underline from '@tiptap/extension-underline'; -import TextAlign from '@tiptap/extension-text-align'; -import Superscript from '@tiptap/extension-superscript'; import SubScript from '@tiptap/extension-subscript'; -import { RichTextEditor, Link } from '@mantine/tiptap'; +import Superscript from '@tiptap/extension-superscript'; +import TextAlign from '@tiptap/extension-text-align'; +import Underline from '@tiptap/extension-underline'; +import { useEditor } from '@tiptap/react'; +import StarterKit from '@tiptap/starter-kit'; +import { Link, RichTextEditor } from '@mantine/tiptap'; +import { MantineDemo } from '@mantinex/demo'; const content = '

Welcome to Mantine rich text editor

RichTextEditor component focuses on usability and is designed to be as simple as possible to bring a familiar editing experience to regular users. RichTextEditor is based on Tiptap.dev and supports all of its features:

  • General text formatting: bold, italic, underline, strike-through
  • Headings (h1-h6)
  • Sub and super scripts (<sup /> and <sub /> tags)
  • Ordered and bullet lists
  • Text align 
  • And all other extensions
'; diff --git a/packages/@docs/demos/src/demos/tiptap/TipTap.demos.story.tsx b/packages/@docs/demos/src/demos/tiptap/TipTap.demos.story.tsx index c811e889b44..4a84d907a6f 100644 --- a/packages/@docs/demos/src/demos/tiptap/TipTap.demos.story.tsx +++ b/packages/@docs/demos/src/demos/tiptap/TipTap.demos.story.tsx @@ -1,5 +1,5 @@ -import * as demos from './index'; import { renderDemo } from '../../render-demo'; +import * as demos from './index'; export default { title: 'TipTap' }; diff --git a/packages/@docs/demos/src/render-demo.tsx b/packages/@docs/demos/src/render-demo.tsx index e5a7caefed0..726077bce54 100644 --- a/packages/@docs/demos/src/render-demo.tsx +++ b/packages/@docs/demos/src/render-demo.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { Demo, MantineDemo } from '@mantinex/demo'; -import { ArgsStoryFn } from '@storybook/types'; import { R as ReactRenderer } from '@storybook/react/dist/types-0a347bb9'; +import { ArgsStoryFn } from '@storybook/types'; +import { Demo, MantineDemo } from '@mantinex/demo'; export function renderDemo(demo: MantineDemo): ArgsStoryFn { return () => ( diff --git a/packages/@docs/demos/src/shared/AuthenticationForm/AuthenticationForm.tsx b/packages/@docs/demos/src/shared/AuthenticationForm/AuthenticationForm.tsx index 98a68ec26ee..0940b0c752a 100644 --- a/packages/@docs/demos/src/shared/AuthenticationForm/AuthenticationForm.tsx +++ b/packages/@docs/demos/src/shared/AuthenticationForm/AuthenticationForm.tsx @@ -1,17 +1,17 @@ import React, { useState } from 'react'; -import { useForm } from '@mantine/form'; -import { IconLock, IconAt } from '@tabler/icons-react'; +import { IconAt, IconLock } from '@tabler/icons-react'; import { - TextInput, - PasswordInput, - Group, - Checkbox, + Anchor, Button, + Checkbox, + Group, + LoadingOverlay, Paper, + PasswordInput, Text, - LoadingOverlay, - Anchor, + TextInput, } from '@mantine/core'; +import { useForm } from '@mantine/form'; export interface AuthenticationFormProps { noShadow?: boolean; diff --git a/packages/@docs/styles-api/src/data/Autocomplete.styles-api.ts b/packages/@docs/styles-api/src/data/Autocomplete.styles-api.ts index ece97647a8f..06a52ec83a5 100644 --- a/packages/@docs/styles-api/src/data/Autocomplete.styles-api.ts +++ b/packages/@docs/styles-api/src/data/Autocomplete.styles-api.ts @@ -1,7 +1,7 @@ import type { AutocompleteFactory } from '@mantine/core'; import type { StylesApiData } from '../types'; -import { InputStylesApi, InputWrapperStylesApi } from './Input.styles-api'; import { ComboboxLikeSelectors } from './Combobox.styles-api'; +import { InputStylesApi, InputWrapperStylesApi } from './Input.styles-api'; export const AutocompleteStylesApi: StylesApiData = { selectors: { diff --git a/packages/@docs/styles-api/src/data/CodeHighlight.styles-api.ts b/packages/@docs/styles-api/src/data/CodeHighlight.styles-api.ts index a3de140ee89..16af5fb0d2b 100644 --- a/packages/@docs/styles-api/src/data/CodeHighlight.styles-api.ts +++ b/packages/@docs/styles-api/src/data/CodeHighlight.styles-api.ts @@ -1,6 +1,6 @@ import type { - CodeHighlightTabsFactory, CodeHighlightFactory, + CodeHighlightTabsFactory, InlineCodeHighlightFactory, } from '@mantine/code-highlight'; import type { StylesApiData } from '../types'; diff --git a/packages/@docs/styles-api/src/data/ColorInput.styles-api.ts b/packages/@docs/styles-api/src/data/ColorInput.styles-api.ts index dd313f75a7e..e3dbf958c48 100644 --- a/packages/@docs/styles-api/src/data/ColorInput.styles-api.ts +++ b/packages/@docs/styles-api/src/data/ColorInput.styles-api.ts @@ -1,7 +1,7 @@ import type { ColorInputFactory } from '@mantine/core'; import type { StylesApiData } from '../types'; -import { InputStylesApi, InputWrapperStylesApi } from './Input.styles-api'; import { ColorPickerStylesApi } from './ColorPicker.styles-api'; +import { InputStylesApi, InputWrapperStylesApi } from './Input.styles-api'; export const ColorInputStylesApi: StylesApiData = { selectors: { diff --git a/packages/@docs/styles-api/src/data/Dates.styles-api.ts b/packages/@docs/styles-api/src/data/Dates.styles-api.ts index f55c9e2f3a7..dad56cacb96 100644 --- a/packages/@docs/styles-api/src/data/Dates.styles-api.ts +++ b/packages/@docs/styles-api/src/data/Dates.styles-api.ts @@ -1,22 +1,22 @@ import type { - MonthFactory, + CalendarFactory, CalendarHeaderFactory, + DateInputFactory, + DatePickerFactory, + DatePickerInputFactory, + DateTimePickerFactory, DecadeLevelGroupFactory, - YearLevelGroupFactory, + MonthFactory, MonthLevelGroupFactory, - CalendarFactory, - YearPickerFactory, MonthPickerFactory, - DatePickerFactory, - YearPickerInputFactory, MonthPickerInputFactory, - DatePickerInputFactory, - DateInputFactory, - DateTimePickerFactory, TimeInputFactory, + YearLevelGroupFactory, + YearPickerFactory, + YearPickerInputFactory, } from '@mantine/dates'; -import { InputBaseStylesApi } from './InputBase.styles-api'; import type { StylesApiData } from '../types'; +import { InputBaseStylesApi } from './InputBase.styles-api'; export const MonthStylesApi: StylesApiData = { selectors: { diff --git a/packages/@docs/styles-api/src/data/Menu.styles-api.ts b/packages/@docs/styles-api/src/data/Menu.styles-api.ts index ebdd5d64b7e..f57c260ee93 100644 --- a/packages/@docs/styles-api/src/data/Menu.styles-api.ts +++ b/packages/@docs/styles-api/src/data/Menu.styles-api.ts @@ -1,6 +1,6 @@ import type { MenuFactory } from '@mantine/core'; -import { PopoverStylesApi } from './Popover.styles-api'; import type { StylesApiData } from '../types'; +import { PopoverStylesApi } from './Popover.styles-api'; export const MenuStylesApi: StylesApiData = { selectors: { diff --git a/packages/@docs/styles-api/src/data/MultiSelect.styles-api.ts b/packages/@docs/styles-api/src/data/MultiSelect.styles-api.ts index dc0951c384e..42e5fc6f8da 100644 --- a/packages/@docs/styles-api/src/data/MultiSelect.styles-api.ts +++ b/packages/@docs/styles-api/src/data/MultiSelect.styles-api.ts @@ -1,7 +1,7 @@ import type { MultiSelectFactory } from '@mantine/core'; import type { StylesApiData } from '../types'; -import { InputStylesApi, InputWrapperStylesApi } from './Input.styles-api'; import { ComboboxLikeSelectors } from './Combobox.styles-api'; +import { InputStylesApi, InputWrapperStylesApi } from './Input.styles-api'; export const MultiSelectStylesApi: StylesApiData = { selectors: { diff --git a/packages/@docs/styles-api/src/data/Select.styles-api.ts b/packages/@docs/styles-api/src/data/Select.styles-api.ts index 6b62e506484..ef63d37cf09 100644 --- a/packages/@docs/styles-api/src/data/Select.styles-api.ts +++ b/packages/@docs/styles-api/src/data/Select.styles-api.ts @@ -1,7 +1,7 @@ import type { SelectFactory } from '@mantine/core'; import type { StylesApiData } from '../types'; -import { InputStylesApi, InputWrapperStylesApi } from './Input.styles-api'; import { ComboboxLikeSelectors } from './Combobox.styles-api'; +import { InputStylesApi, InputWrapperStylesApi } from './Input.styles-api'; export const SelectStylesApi: StylesApiData = { selectors: { diff --git a/packages/@docs/styles-api/src/data/TagsInput.styles-api.ts b/packages/@docs/styles-api/src/data/TagsInput.styles-api.ts index 2f764cf87b8..f4afd910f36 100644 --- a/packages/@docs/styles-api/src/data/TagsInput.styles-api.ts +++ b/packages/@docs/styles-api/src/data/TagsInput.styles-api.ts @@ -1,7 +1,7 @@ import type { TagsInputFactory } from '@mantine/core'; import type { StylesApiData } from '../types'; -import { InputStylesApi, InputWrapperStylesApi } from './Input.styles-api'; import { ComboboxLikeSelectors } from './Combobox.styles-api'; +import { InputStylesApi, InputWrapperStylesApi } from './Input.styles-api'; export const TagsInputStylesApi: StylesApiData = { selectors: { diff --git a/packages/@mantine-tests/core/src/index.ts b/packages/@mantine-tests/core/src/index.ts index 1c116ef1d0a..204bbc95214 100644 --- a/packages/@mantine-tests/core/src/index.ts +++ b/packages/@mantine-tests/core/src/index.ts @@ -1,47 +1,43 @@ import userEvent from '@testing-library/user-event'; - +import { axe } from './axe'; +import { itConnectsLabelAndInput } from './inputs/it-connects-label-and-input'; +import { itHandlesCheckboxState } from './inputs/it-handles-checkbox-state'; +import { itSupportsInputAsterisk } from './inputs/it-supports-input-asterisk'; +import { itSupportsInputContainer } from './inputs/it-supports-input-container'; +import { itSupportsInputProps } from './inputs/it-supports-input-props'; +// Inputs tests +import { itSupportsInputSections } from './inputs/it-supports-input-sections'; +import { itSupportsInputWrapperElements } from './inputs/it-supports-input-wrapper-elements'; +import { itSupportsInputWrapperOrder } from './inputs/it-supports-input-wrapper-order'; +import { itSupportsInputWrapperProps } from './inputs/it-supports-input-wrapper-props'; +// High level tests +import { itSupportsSystemProps } from './it-supports-system-props'; +import { itHasClasses } from './shared/it-has-classes'; +import { itHasExtend } from './shared/it-has-extend'; // Shared tests import { itIsPolymorphic } from './shared/it-is-polymorphic'; import { itRendersChildren } from './shared/it-renders-children'; import { itSupportsClassName } from './shared/it-supports-classname'; +import { itSupportsFocusEvents } from './shared/it-supports-focus-events'; +import { itSupportsHiddenVisible } from './shared/it-supports-hidden-visible'; +import { itSupportsId } from './shared/it-supports-id'; +import { itSupportsLightDarkHidden } from './shared/it-supports-light-dark-hidden'; import { itSupportsOthers } from './shared/it-supports-others'; +import { itSupportsProviderDefaultProps } from './shared/it-supports-provider-default-props'; import { itSupportsRef } from './shared/it-supports-ref'; +import { itSupportsSize } from './shared/it-supports-size'; import { itSupportsStyle } from './shared/it-supports-style'; -import { itSupportsFocusEvents } from './shared/it-supports-focus-events'; -import { itSupportsProviderDefaultProps } from './shared/it-supports-provider-default-props'; import { itSupportsStylesApi } from './shared/it-supports-style-api'; -import { itThrowsContextError } from './shared/it-throws-context-error'; import { itSupportsVariant } from './shared/it-supports-variant'; -import { itSupportsSize } from './shared/it-supports-size'; -import { itHasExtend } from './shared/it-has-extend'; -import { itHasClasses } from './shared/it-has-classes'; -import { itSupportsHiddenVisible } from './shared/it-supports-hidden-visible'; -import { itSupportsLightDarkHidden } from './shared/it-supports-light-dark-hidden'; -import { itSupportsId } from './shared/it-supports-id'; - +import { itThrowsContextError } from './shared/it-throws-context-error'; +import { itSupportsBackgroundProps } from './style-props/it-supports-background-props'; +import { itSupportsColorsProps } from './style-props/it-supports-colors-props'; +import { itSupportsFontsProps } from './style-props/it-supports-fonts-props'; // Style props tests import { itSupportsMarginsProps } from './style-props/it-supports-margins-props'; import { itSupportsPaddingsProps } from './style-props/it-supports-paddings-props'; -import { itSupportsColorsProps } from './style-props/it-supports-colors-props'; -import { itSupportsFontsProps } from './style-props/it-supports-fonts-props'; -import { itSupportsSizeProps } from './style-props/it-supports-size-props'; -import { itSupportsBackgroundProps } from './style-props/it-supports-background-props'; import { itSupportsPositionProps } from './style-props/it-supports-position-props'; - -// Inputs tests -import { itSupportsInputSections } from './inputs/it-supports-input-sections'; -import { itSupportsInputContainer } from './inputs/it-supports-input-container'; -import { itSupportsInputAsterisk } from './inputs/it-supports-input-asterisk'; -import { itSupportsInputWrapperOrder } from './inputs/it-supports-input-wrapper-order'; -import { itSupportsInputWrapperElements } from './inputs/it-supports-input-wrapper-elements'; -import { itHandlesCheckboxState } from './inputs/it-handles-checkbox-state'; -import { itConnectsLabelAndInput } from './inputs/it-connects-label-and-input'; - -// High level tests -import { itSupportsSystemProps } from './it-supports-system-props'; -import { itSupportsInputWrapperProps } from './inputs/it-supports-input-wrapper-props'; -import { itSupportsInputProps } from './inputs/it-supports-input-props'; -import { axe } from './axe'; +import { itSupportsSizeProps } from './style-props/it-supports-size-props'; export const tests = { itIsPolymorphic, diff --git a/packages/@mantine-tests/core/src/inputs/it-supports-input-props.tsx b/packages/@mantine-tests/core/src/inputs/it-supports-input-props.tsx index 97229b7edaa..ffe0ac2ff22 100644 --- a/packages/@mantine-tests/core/src/inputs/it-supports-input-props.tsx +++ b/packages/@mantine-tests/core/src/inputs/it-supports-input-props.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { itSupportsInputWrapperProps } from './it-supports-input-wrapper-props'; -import { itSupportsInputSections } from './it-supports-input-sections'; import { itSupportsFocusEvents } from '../shared/it-supports-focus-events'; +import { itSupportsInputSections } from './it-supports-input-sections'; +import { itSupportsInputWrapperProps } from './it-supports-input-wrapper-props'; interface Options { component: React.ComponentType; diff --git a/packages/@mantine-tests/core/src/it-supports-system-props.tsx b/packages/@mantine-tests/core/src/it-supports-system-props.tsx index fa3d324db8a..13516e8fa0e 100644 --- a/packages/@mantine-tests/core/src/it-supports-system-props.tsx +++ b/packages/@mantine-tests/core/src/it-supports-system-props.tsx @@ -1,26 +1,25 @@ -import { itSupportsClassName } from './shared/it-supports-classname'; -import { itSupportsStyle } from './shared/it-supports-style'; -import { itSupportsRef } from './shared/it-supports-ref'; -import { itSupportsOthers } from './shared/it-supports-others'; +import { itHasClasses } from './shared/it-has-classes'; +import { itHasExtend } from './shared/it-has-extend'; import { itIsPolymorphic } from './shared/it-is-polymorphic'; import { itRendersChildren } from './shared/it-renders-children'; +import { itSupportsClassName } from './shared/it-supports-classname'; +import { itSupportsHiddenVisible } from './shared/it-supports-hidden-visible'; +import { itSupportsId } from './shared/it-supports-id'; +import { itSupportsLightDarkHidden } from './shared/it-supports-light-dark-hidden'; +import { itSupportsOthers } from './shared/it-supports-others'; import { itSupportsProviderDefaultProps } from './shared/it-supports-provider-default-props'; +import { itSupportsRef } from './shared/it-supports-ref'; +import { itSupportsSize } from './shared/it-supports-size'; +import { itSupportsStyle } from './shared/it-supports-style'; import { itSupportsStylesApi } from './shared/it-supports-style-api'; import { itSupportsVariant } from './shared/it-supports-variant'; -import { itSupportsSize } from './shared/it-supports-size'; -import { itHasExtend } from './shared/it-has-extend'; -import { itHasClasses } from './shared/it-has-classes'; -import { itSupportsHiddenVisible } from './shared/it-supports-hidden-visible'; -import { itSupportsLightDarkHidden } from './shared/it-supports-light-dark-hidden'; -import { itSupportsId } from './shared/it-supports-id'; - -import { itSupportsMarginsProps } from './style-props/it-supports-margins-props'; -import { itSupportsPaddingsProps } from './style-props/it-supports-paddings-props'; +import { itSupportsBackgroundProps } from './style-props/it-supports-background-props'; import { itSupportsColorsProps } from './style-props/it-supports-colors-props'; import { itSupportsFontsProps } from './style-props/it-supports-fonts-props'; -import { itSupportsSizeProps } from './style-props/it-supports-size-props'; -import { itSupportsBackgroundProps } from './style-props/it-supports-background-props'; +import { itSupportsMarginsProps } from './style-props/it-supports-margins-props'; +import { itSupportsPaddingsProps } from './style-props/it-supports-paddings-props'; import { itSupportsPositionProps } from './style-props/it-supports-position-props'; +import { itSupportsSizeProps } from './style-props/it-supports-size-props'; interface Options, StylesApiSelectors extends string> { component: React.ComponentType; diff --git a/packages/@mantine-tests/core/src/render.tsx b/packages/@mantine-tests/core/src/render.tsx index 40774b21869..171cdd80c1d 100644 --- a/packages/@mantine-tests/core/src/render.tsx +++ b/packages/@mantine-tests/core/src/render.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { render as testingLibraryRender, act, RenderResult } from '@testing-library/react'; -import { MantineProvider, MantineThemeOverride, MantineProviderProps } from '@mantine/core'; +import { act, RenderResult, render as testingLibraryRender } from '@testing-library/react'; +import { MantineProvider, MantineProviderProps, MantineThemeOverride } from '@mantine/core'; export function render( ui: React.ReactNode, diff --git a/packages/@mantine-tests/core/src/shared/it-supports-style-api.tsx b/packages/@mantine-tests/core/src/shared/it-supports-style-api.tsx index e9e3a68ccbf..82a90285515 100644 --- a/packages/@mantine-tests/core/src/shared/it-supports-style-api.tsx +++ b/packages/@mantine-tests/core/src/shared/it-supports-style-api.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { MantineTheme, DEFAULT_THEME } from '@mantine/core'; +import { DEFAULT_THEME, MantineTheme } from '@mantine/core'; import { render } from '../render'; const randomNumber = (min = 10, max = 100) => Math.floor(Math.random() * (max - min + 1) + min); diff --git a/packages/@mantine-tests/core/src/shared/it-supports-style.tsx b/packages/@mantine-tests/core/src/shared/it-supports-style.tsx index 9a046901823..06553328514 100644 --- a/packages/@mantine-tests/core/src/shared/it-supports-style.tsx +++ b/packages/@mantine-tests/core/src/shared/it-supports-style.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { MantineTheme, DEFAULT_THEME } from '@mantine/core'; +import { DEFAULT_THEME, MantineTheme } from '@mantine/core'; import { render } from '../render'; interface Options { diff --git a/packages/@mantine-tests/core/src/shared/it-throws-context-error.tsx b/packages/@mantine-tests/core/src/shared/it-throws-context-error.tsx index 5fa9d274b4b..f86b15f8194 100644 --- a/packages/@mantine-tests/core/src/shared/it-throws-context-error.tsx +++ b/packages/@mantine-tests/core/src/shared/it-throws-context-error.tsx @@ -1,7 +1,7 @@ /* eslint-disable no-console */ import React from 'react'; -import { render } from '../render'; import { patchConsoleError } from '../patch-console-error'; +import { render } from '../render'; interface Options { component: React.ComponentType; diff --git a/packages/@mantine-tests/dates/src/index.ts b/packages/@mantine-tests/dates/src/index.ts index 66cee575e02..33eb3ff39f7 100644 --- a/packages/@mantine-tests/dates/src/index.ts +++ b/packages/@mantine-tests/dates/src/index.ts @@ -1,20 +1,20 @@ -import { itSupportsWeekdaysProps } from './it-supports-weekdays-props'; -import { itSupportsMonthProps } from './it-supports-month-props'; +import { itHandlesControlsKeyboardEvents } from './it-handles-controls-keyboard-events'; +import { itHandlesMonthKeyboardEvents } from './it-handles-month-keyboard-events'; import { itSupportsHeaderProps } from './it-support-header-props'; -import { itSupportsGetDayRef } from './it-supports-get-day-ref'; -import { itSupportsWithNextPrevious } from './it-supports-with-next-previous'; -import { itSupportsOnDayKeydown } from './it-supports-on-day-keydown'; +import { itSupportsClearableProps } from './it-supports-clearable-props'; +import { itSupportsDateInputProps } from './it-supports-date-input-props'; import { itSupportsGetControlRef } from './it-supports-get-control-ref'; +import { itSupportsGetDayRef } from './it-supports-get-day-ref'; +import { itSupportsMonthProps } from './it-supports-month-props'; import { itSupportsMonthsListProps } from './it-supports-months-list-props'; -import { itSupportsYearsListProps } from './it-supports-years-list-props'; -import { itSupportsOnControlKeydown } from './it-supports-on-control-key-down'; import { itSupportsOnControlClick } from './it-supports-on-control-click'; -import { itSupportsOnDayClick } from './it-supports-on-day-click'; -import { itHandlesMonthKeyboardEvents } from './it-handles-month-keyboard-events'; -import { itHandlesControlsKeyboardEvents } from './it-handles-controls-keyboard-events'; +import { itSupportsOnControlKeydown } from './it-supports-on-control-key-down'; import { itSupportsOnControlMouseEnter } from './it-supports-on-control-mouse-enter'; -import { itSupportsClearableProps } from './it-supports-clearable-props'; -import { itSupportsDateInputProps } from './it-supports-date-input-props'; +import { itSupportsOnDayClick } from './it-supports-on-day-click'; +import { itSupportsOnDayKeydown } from './it-supports-on-day-keydown'; +import { itSupportsWeekdaysProps } from './it-supports-weekdays-props'; +import { itSupportsWithNextPrevious } from './it-supports-with-next-previous'; +import { itSupportsYearsListProps } from './it-supports-years-list-props'; export const datesTests = { itSupportsWeekdaysProps, diff --git a/packages/@mantine-tests/dates/src/it-supports-date-input-props.tsx b/packages/@mantine-tests/dates/src/it-supports-date-input-props.tsx index 694e3a88b4b..df550eb908a 100644 --- a/packages/@mantine-tests/dates/src/it-supports-date-input-props.tsx +++ b/packages/@mantine-tests/dates/src/it-supports-date-input-props.tsx @@ -2,14 +2,14 @@ import React from 'react'; import { screen } from '@testing-library/react'; import { render } from '@mantine-tests/core'; import { - getInputValue, + clickControl, clickInput, - expectOpenedPopover, + expectNoModal, expectNoPopover, expectOpenedModal, - expectNoModal, - clickControl, + expectOpenedPopover, expectValue, + getInputValue, } from './date-input-test-helpers'; interface Options { diff --git a/packages/@mantine-tests/dates/src/it-supports-month-props.tsx b/packages/@mantine-tests/dates/src/it-supports-month-props.tsx index 74daee7337f..eec5748741e 100644 --- a/packages/@mantine-tests/dates/src/it-supports-month-props.tsx +++ b/packages/@mantine-tests/dates/src/it-supports-month-props.tsx @@ -1,8 +1,9 @@ import 'dayjs/locale/ru'; + import dayjs from 'dayjs'; import React from 'react'; -import userEvent from '@testing-library/user-event'; import { screen } from '@testing-library/react'; +import userEvent from '@testing-library/user-event'; import { DatesProvider } from '@mantine/dates'; import { render } from '@mantine-tests/core'; import { itSupportsWeekdaysProps } from './it-supports-weekdays-props'; diff --git a/packages/@mantine-tests/dates/src/it-supports-weekdays-props.tsx b/packages/@mantine-tests/dates/src/it-supports-weekdays-props.tsx index 108bae82363..9a1bcbf8635 100644 --- a/packages/@mantine-tests/dates/src/it-supports-weekdays-props.tsx +++ b/packages/@mantine-tests/dates/src/it-supports-weekdays-props.tsx @@ -1,7 +1,8 @@ import 'dayjs/locale/ru'; + +import dayjs from 'dayjs'; import React from 'react'; import { screen } from '@testing-library/react'; -import dayjs from 'dayjs'; import { DatesProvider } from '@mantine/dates'; import { render } from '@mantine-tests/core'; diff --git a/packages/@mantine/carousel/src/Carousel.story.tsx b/packages/@mantine/carousel/src/Carousel.story.tsx index 5063ef381de..d3feefe4100 100644 --- a/packages/@mantine/carousel/src/Carousel.story.tsx +++ b/packages/@mantine/carousel/src/Carousel.story.tsx @@ -1,7 +1,7 @@ import React, { useRef, useState } from 'react'; -import { Button, Modal } from '@mantine/core'; import Autoplay from 'embla-carousel-autoplay'; import type { EmblaCarouselType } from 'embla-carousel-react'; +import { Button, Modal } from '@mantine/core'; import { Carousel } from './Carousel'; import { useAnimationOffsetEffect } from './use-animation-offset-effect'; diff --git a/packages/@mantine/carousel/src/Carousel.test.tsx b/packages/@mantine/carousel/src/Carousel.test.tsx index a49f10c28cf..38493de28e5 100644 --- a/packages/@mantine/carousel/src/Carousel.test.tsx +++ b/packages/@mantine/carousel/src/Carousel.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen, userEvent } from '@mantine-tests/core'; +import { render, screen, tests, userEvent } from '@mantine-tests/core'; import { Carousel, CarouselProps, CarouselStylesNames } from './Carousel'; const defaultProps: CarouselProps = { diff --git a/packages/@mantine/carousel/src/Carousel.tsx b/packages/@mantine/carousel/src/Carousel.tsx index d54eb5e448f..57e2cb8220d 100644 --- a/packages/@mantine/carousel/src/Carousel.tsx +++ b/packages/@mantine/carousel/src/Carousel.tsx @@ -1,29 +1,29 @@ import React, { Children, useCallback, useEffect, useState } from 'react'; +import useEmblaCarousel, { EmblaCarouselType, EmblaPluginType } from 'embla-carousel-react'; import { + AccordionChevron, Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, + getSpacing, MantineSpacing, + rem, StyleProp, - useDirection, + StylesApiProps, UnstyledButton, - AccordionChevron, + useDirection, + useProps, useRandomClassName, - rem, - getSpacing, + useStyles, } from '@mantine/core'; import { clamp } from '@mantine/hooks'; -import useEmblaCarousel, { EmblaPluginType, EmblaCarouselType } from 'embla-carousel-react'; -import { getChevronRotation } from './get-chevron-rotation'; import { CarouselProvider } from './Carousel.context'; import { CarouselSlide } from './CarouselSlide/CarouselSlide'; import { CarouselVariables } from './CarouselVariables/CarouselVariables'; +import { getChevronRotation } from './get-chevron-rotation'; import classes from './Carousel.module.css'; export type CarouselStylesNames = diff --git a/packages/@mantine/carousel/src/CarouselSlide/CarouselSlide.test.tsx b/packages/@mantine/carousel/src/CarouselSlide/CarouselSlide.test.tsx index 812e2be6a3b..bc32829fc1a 100644 --- a/packages/@mantine/carousel/src/CarouselSlide/CarouselSlide.test.tsx +++ b/packages/@mantine/carousel/src/CarouselSlide/CarouselSlide.test.tsx @@ -1,6 +1,6 @@ import { createContextContainer, tests } from '@mantine-tests/core'; -import { CarouselSlide, CarouselSlideProps, CarouselSlideStylesNames } from './CarouselSlide'; import { Carousel } from '../Carousel'; +import { CarouselSlide, CarouselSlideProps, CarouselSlideStylesNames } from './CarouselSlide'; const TestContainer = createContextContainer(CarouselSlide, Carousel, {}); diff --git a/packages/@mantine/carousel/src/CarouselSlide/CarouselSlide.tsx b/packages/@mantine/carousel/src/CarouselSlide/CarouselSlide.tsx index 4ac96c32215..8478edd7dd4 100644 --- a/packages/@mantine/carousel/src/CarouselSlide/CarouselSlide.tsx +++ b/packages/@mantine/carousel/src/CarouselSlide/CarouselSlide.tsx @@ -3,10 +3,10 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '@mantine/core'; import { useCarouselContext } from '../Carousel.context'; import classes from '../Carousel.module.css'; diff --git a/packages/@mantine/carousel/src/CarouselVariables/CarouselVariables.tsx b/packages/@mantine/carousel/src/CarouselVariables/CarouselVariables.tsx index ad2d66fa195..ccb8eead3c0 100644 --- a/packages/@mantine/carousel/src/CarouselVariables/CarouselVariables.tsx +++ b/packages/@mantine/carousel/src/CarouselVariables/CarouselVariables.tsx @@ -1,14 +1,14 @@ import React from 'react'; import { + filterProps, + getBaseValue, getSortedBreakpoints, - useMantineTheme, - keys, getSpacing, - MantineBreakpoint, - filterProps, InlineStyles, - getBaseValue, + keys, + MantineBreakpoint, rem, + useMantineTheme, } from '@mantine/core'; import type { CarouselProps } from '../Carousel'; diff --git a/packages/@mantine/code-highlight/src/CodeHighlight.story.tsx b/packages/@mantine/code-highlight/src/CodeHighlight.story.tsx index 38763ebe752..e1f4599b872 100644 --- a/packages/@mantine/code-highlight/src/CodeHighlight.story.tsx +++ b/packages/@mantine/code-highlight/src/CodeHighlight.story.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { CodeHighlightTabs } from './CodeHighlightTabs'; import { CodeHighlight } from './CodeHighlight'; +import { CodeHighlightTabs } from './CodeHighlightTabs'; import { InlineCodeHighlight } from './InlineCodeHighlight'; export default { title: 'CodeHighlight' }; diff --git a/packages/@mantine/code-highlight/src/CodeHighlight.tsx b/packages/@mantine/code-highlight/src/CodeHighlight.tsx index f21b2dd5561..a2e18a35765 100644 --- a/packages/@mantine/code-highlight/src/CodeHighlight.tsx +++ b/packages/@mantine/code-highlight/src/CodeHighlight.tsx @@ -1,21 +1,21 @@ import React from 'react'; import cx from 'clsx'; import { + ActionIcon, Box, BoxProps, - StylesApiProps, - factory, + CopyButton, ElementProps, + factory, + Factory, + ScrollArea, + StylesApiProps, + Tooltip, useProps, useStyles, - CopyButton, - Tooltip, - ActionIcon, - ScrollArea, - Factory, } from '@mantine/core'; -import { useHighlight } from './use-highlight'; import { CopyIcon } from './CopyIcon'; +import { useHighlight } from './use-highlight'; import _classes from './CodeHighlight.module.css'; import themeClasses from './CodeHighlight.theme.module.css'; diff --git a/packages/@mantine/code-highlight/src/CodeHighlightTabs.tsx b/packages/@mantine/code-highlight/src/CodeHighlightTabs.tsx index ae28d4bfb0e..d88ff9cf577 100644 --- a/packages/@mantine/code-highlight/src/CodeHighlightTabs.tsx +++ b/packages/@mantine/code-highlight/src/CodeHighlightTabs.tsx @@ -1,27 +1,27 @@ import React from 'react'; -import hljs from 'highlight.js'; import cx from 'clsx'; -import { useUncontrolled } from '@mantine/hooks'; +import hljs from 'highlight.js'; import { + ActionIcon, Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, CopyButton, - Tooltip, - ActionIcon, - UnstyledButton, - ScrollArea, createVarsResolver, - rem, + ElementProps, + factory, Factory, + rem, + ScrollArea, + StylesApiProps, + Tooltip, + UnstyledButton, + useProps, + useStyles, } from '@mantine/core'; +import { useUncontrolled } from '@mantine/hooks'; import { CopyIcon } from './CopyIcon'; -import { FileIcon } from './FileIcon'; import { ExpandIcon } from './ExpandIcon'; +import { FileIcon } from './FileIcon'; import _classes from './CodeHighlight.module.css'; import themeClasses from './CodeHighlight.theme.module.css'; diff --git a/packages/@mantine/code-highlight/src/CopyIcon.tsx b/packages/@mantine/code-highlight/src/CopyIcon.tsx index 599ccb85a59..b3faf677840 100644 --- a/packages/@mantine/code-highlight/src/CopyIcon.tsx +++ b/packages/@mantine/code-highlight/src/CopyIcon.tsx @@ -1,5 +1,5 @@ -import { rem } from '@mantine/core'; import React from 'react'; +import { rem } from '@mantine/core'; interface CopyIconProps extends React.ComponentPropsWithoutRef<'svg'> { copied: boolean; diff --git a/packages/@mantine/code-highlight/src/ExpandIcon.tsx b/packages/@mantine/code-highlight/src/ExpandIcon.tsx index 3e253c0732f..651b874e6f9 100644 --- a/packages/@mantine/code-highlight/src/ExpandIcon.tsx +++ b/packages/@mantine/code-highlight/src/ExpandIcon.tsx @@ -1,5 +1,5 @@ -import { rem } from '@mantine/core'; import React from 'react'; +import { rem } from '@mantine/core'; interface ExpandIconProps extends React.ComponentPropsWithoutRef<'svg'> { expanded: boolean; diff --git a/packages/@mantine/code-highlight/src/InlineCodeHighlight.tsx b/packages/@mantine/code-highlight/src/InlineCodeHighlight.tsx index 1578696772b..0de85953485 100644 --- a/packages/@mantine/code-highlight/src/InlineCodeHighlight.tsx +++ b/packages/@mantine/code-highlight/src/InlineCodeHighlight.tsx @@ -1,16 +1,16 @@ import React from 'react'; import cx from 'clsx'; +import hljs from 'highlight.js'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, + factory, + Factory, + StylesApiProps, useProps, useStyles, - Factory, } from '@mantine/core'; -import hljs from 'highlight.js'; import _classes from './CodeHighlight.module.css'; import themeClasses from './CodeHighlight.theme.module.css'; diff --git a/packages/@mantine/code-highlight/src/use-highlight.ts b/packages/@mantine/code-highlight/src/use-highlight.ts index 905ac26a0f5..96caf39f4e1 100644 --- a/packages/@mantine/code-highlight/src/use-highlight.ts +++ b/packages/@mantine/code-highlight/src/use-highlight.ts @@ -1,4 +1,4 @@ -import { useState, useEffect } from 'react'; +import { useEffect, useState } from 'react'; import hljs from 'highlight.js'; interface UseHighlightInput { diff --git a/packages/@mantine/core/src/components/Accordion/Accordion.context.ts b/packages/@mantine/core/src/components/Accordion/Accordion.context.ts index 347cacb098d..625e4c48ecd 100644 --- a/packages/@mantine/core/src/components/Accordion/Accordion.context.ts +++ b/packages/@mantine/core/src/components/Accordion/Accordion.context.ts @@ -1,6 +1,6 @@ import { createSafeContext, GetStylesApi } from '../../core'; -import { AccordionChevronPosition, AccordionHeadingOrder } from './Accordion.types'; import type { AccordionFactory } from './Accordion'; +import { AccordionChevronPosition, AccordionHeadingOrder } from './Accordion.types'; interface AccordionContext { loop: boolean | undefined; diff --git a/packages/@mantine/core/src/components/Accordion/Accordion.test.tsx b/packages/@mantine/core/src/components/Accordion/Accordion.test.tsx index 2d5308d0da1..821736eb8dd 100644 --- a/packages/@mantine/core/src/components/Accordion/Accordion.test.tsx +++ b/packages/@mantine/core/src/components/Accordion/Accordion.test.tsx @@ -1,10 +1,10 @@ import React from 'react'; -import { render, tests, userEvent, screen } from '@mantine-tests/core'; +import { render, screen, tests, userEvent } from '@mantine-tests/core'; +import { Accordion, AccordionProps, AccordionStylesNames } from './Accordion'; import { AccordionChevron } from './AccordionChevron'; import { AccordionControl } from './AccordionControl/AccordionControl'; import { AccordionItem } from './AccordionItem/AccordionItem'; import { AccordionPanel } from './AccordionPanel/AccordionPanel'; -import { Accordion, AccordionProps, AccordionStylesNames } from './Accordion'; const defaultProps = { transitionDuration: 0, diff --git a/packages/@mantine/core/src/components/Accordion/Accordion.tsx b/packages/@mantine/core/src/components/Accordion/Accordion.tsx index 2d16a8b56dd..8ee248b8aa7 100644 --- a/packages/@mantine/core/src/components/Accordion/Accordion.tsx +++ b/packages/@mantine/core/src/components/Accordion/Accordion.tsx @@ -3,26 +3,26 @@ import { useId, useUncontrolled } from '@mantine/hooks'; import { Box, BoxProps, - StylesApiProps, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + ExtendComponent, Factory, - MantineRadius, + getRadius, getSafeId, - ExtendComponent, + MantineRadius, MantineThemeComponent, rem, - getRadius, + StylesApiProps, + useProps, + useStyles, } from '../../core'; +import { AccordionProvider } from './Accordion.context'; +import { AccordionChevronPosition, AccordionHeadingOrder, AccordionValue } from './Accordion.types'; import { AccordionChevron } from './AccordionChevron'; +import { AccordionControl } from './AccordionControl/AccordionControl'; import { AccordionItem } from './AccordionItem/AccordionItem'; import { AccordionPanel } from './AccordionPanel/AccordionPanel'; -import { AccordionControl } from './AccordionControl/AccordionControl'; -import { AccordionChevronPosition, AccordionHeadingOrder, AccordionValue } from './Accordion.types'; import classes from './Accordion.module.css'; -import { AccordionProvider } from './Accordion.context'; export type AccordionStylesNames = | 'root' diff --git a/packages/@mantine/core/src/components/Accordion/AccordionControl/AccordionControl.test.tsx b/packages/@mantine/core/src/components/Accordion/AccordionControl/AccordionControl.test.tsx index c9d21418d8b..55bec42eb27 100644 --- a/packages/@mantine/core/src/components/Accordion/AccordionControl/AccordionControl.test.tsx +++ b/packages/@mantine/core/src/components/Accordion/AccordionControl/AccordionControl.test.tsx @@ -1,11 +1,11 @@ -import { tests, createContextContainer } from '@mantine-tests/core'; +import { createContextContainer, tests } from '@mantine-tests/core'; +import { Accordion } from '../Accordion'; import { AccordionItem } from '../AccordionItem/AccordionItem'; import { AccordionControl, AccordionControlProps, AccordionControlStylesNames, } from './AccordionControl'; -import { Accordion } from '../Accordion'; const defaultProps: AccordionControlProps = { icon: '$', diff --git a/packages/@mantine/core/src/components/Accordion/AccordionControl/AccordionControl.tsx b/packages/@mantine/core/src/components/Accordion/AccordionControl/AccordionControl.tsx index 92dc0ef9aa8..e6a0ebe49ca 100644 --- a/packages/@mantine/core/src/components/Accordion/AccordionControl/AccordionControl.tsx +++ b/packages/@mantine/core/src/components/Accordion/AccordionControl/AccordionControl.tsx @@ -3,11 +3,11 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, + createScopedKeydownHandler, ElementProps, - useProps, + factory, Factory, - createScopedKeydownHandler, + useProps, } from '../../../core'; import { UnstyledButton } from '../../UnstyledButton'; import { useAccordionContext } from '../Accordion.context'; diff --git a/packages/@mantine/core/src/components/Accordion/AccordionItem/AccordionItem.test.tsx b/packages/@mantine/core/src/components/Accordion/AccordionItem/AccordionItem.test.tsx index c40ac64ed9e..f1e93f42408 100644 --- a/packages/@mantine/core/src/components/Accordion/AccordionItem/AccordionItem.test.tsx +++ b/packages/@mantine/core/src/components/Accordion/AccordionItem/AccordionItem.test.tsx @@ -1,6 +1,6 @@ -import { tests, createContextContainer } from '@mantine-tests/core'; -import { AccordionItem, AccordionItemProps, AccordionItemStylesNames } from './AccordionItem'; +import { createContextContainer, tests } from '@mantine-tests/core'; import { Accordion } from '../Accordion'; +import { AccordionItem, AccordionItemProps, AccordionItemStylesNames } from './AccordionItem'; const defaultProps: AccordionItemProps = { value: 'test', diff --git a/packages/@mantine/core/src/components/Accordion/AccordionItem/AccordionItem.tsx b/packages/@mantine/core/src/components/Accordion/AccordionItem/AccordionItem.tsx index bd2845cfd97..cbd9e747d90 100644 --- a/packages/@mantine/core/src/components/Accordion/AccordionItem/AccordionItem.tsx +++ b/packages/@mantine/core/src/components/Accordion/AccordionItem/AccordionItem.tsx @@ -3,10 +3,10 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '../../../core'; import { useAccordionContext } from '../Accordion.context'; import { AccordionItemProvider } from '../AccordionItem.context'; diff --git a/packages/@mantine/core/src/components/Accordion/AccordionPanel/AccordionPanel.test.tsx b/packages/@mantine/core/src/components/Accordion/AccordionPanel/AccordionPanel.test.tsx index 889632379e1..4bfc302a99a 100644 --- a/packages/@mantine/core/src/components/Accordion/AccordionPanel/AccordionPanel.test.tsx +++ b/packages/@mantine/core/src/components/Accordion/AccordionPanel/AccordionPanel.test.tsx @@ -1,7 +1,7 @@ -import { tests, createContextContainer } from '@mantine-tests/core'; +import { createContextContainer, tests } from '@mantine-tests/core'; +import { Accordion } from '../Accordion'; import { AccordionItem } from '../AccordionItem/AccordionItem'; import { AccordionPanel, AccordionPanelProps, AccordionPanelStylesNames } from './AccordionPanel'; -import { Accordion } from '../Accordion'; const defaultProps: AccordionPanelProps = {}; diff --git a/packages/@mantine/core/src/components/Accordion/AccordionPanel/AccordionPanel.tsx b/packages/@mantine/core/src/components/Accordion/AccordionPanel/AccordionPanel.tsx index 5b8bc14cb29..58e4805b870 100644 --- a/packages/@mantine/core/src/components/Accordion/AccordionPanel/AccordionPanel.tsx +++ b/packages/@mantine/core/src/components/Accordion/AccordionPanel/AccordionPanel.tsx @@ -2,10 +2,10 @@ import React from 'react'; import { BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '../../../core'; import { Collapse } from '../../Collapse'; import { useAccordionContext } from '../Accordion.context'; diff --git a/packages/@mantine/core/src/components/ActionIcon/ActionIcon.story.tsx b/packages/@mantine/core/src/components/ActionIcon/ActionIcon.story.tsx index 609dbbe158f..f7b0cc8872c 100644 --- a/packages/@mantine/core/src/components/ActionIcon/ActionIcon.story.tsx +++ b/packages/@mantine/core/src/components/ActionIcon/ActionIcon.story.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { ActionIcon, ActionIconProps } from './ActionIcon'; import { DEFAULT_THEME, MantineThemeProvider, rem } from '../../core'; +import { ActionIcon, ActionIconProps } from './ActionIcon'; export default { title: 'ActionIcon' }; diff --git a/packages/@mantine/core/src/components/ActionIcon/ActionIcon.test.tsx b/packages/@mantine/core/src/components/ActionIcon/ActionIcon.test.tsx index 90807bcf8c9..5be93ad403d 100644 --- a/packages/@mantine/core/src/components/ActionIcon/ActionIcon.test.tsx +++ b/packages/@mantine/core/src/components/ActionIcon/ActionIcon.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { tests, render } from '@mantine-tests/core'; +import { render, tests } from '@mantine-tests/core'; import { ActionIcon, ActionIconProps, ActionIconStylesNames } from './ActionIcon'; import { ActionIconGroup } from './ActionIconGroup/ActionIconGroup'; diff --git a/packages/@mantine/core/src/components/ActionIcon/ActionIcon.tsx b/packages/@mantine/core/src/components/ActionIcon/ActionIcon.tsx index 2d2218065fb..83d16d83a90 100644 --- a/packages/@mantine/core/src/components/ActionIcon/ActionIcon.tsx +++ b/packages/@mantine/core/src/components/ActionIcon/ActionIcon.tsx @@ -1,21 +1,21 @@ import React from 'react'; import { BoxProps, - useProps, - StylesApiProps, - useStyles, - MantineSize, - MantineColor, - MantineGradient, + createVarsResolver, getRadius, - polymorphicFactory, getSize, - createVarsResolver, + MantineColor, + MantineGradient, MantineRadius, + MantineSize, + polymorphicFactory, PolymorphicFactory, + StylesApiProps, + useProps, + useStyles, } from '../../core'; +import { Loader, LoaderProps } from '../Loader'; import { UnstyledButton } from '../UnstyledButton'; -import { LoaderProps, Loader } from '../Loader'; import { ActionIconGroup } from './ActionIconGroup/ActionIconGroup'; import classes from './ActionIcon.module.css'; diff --git a/packages/@mantine/core/src/components/ActionIcon/ActionIconGroup/ActionIconGroup.test.tsx b/packages/@mantine/core/src/components/ActionIcon/ActionIconGroup/ActionIconGroup.test.tsx index e703dcc6c8a..9e138f92b06 100644 --- a/packages/@mantine/core/src/components/ActionIcon/ActionIconGroup/ActionIconGroup.test.tsx +++ b/packages/@mantine/core/src/components/ActionIcon/ActionIconGroup/ActionIconGroup.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { tests, render, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { ActionIconGroup, ActionIconGroupProps, diff --git a/packages/@mantine/core/src/components/ActionIcon/ActionIconGroup/ActionIconGroup.tsx b/packages/@mantine/core/src/components/ActionIcon/ActionIconGroup/ActionIconGroup.tsx index b1a923bc872..19813c37530 100644 --- a/packages/@mantine/core/src/components/ActionIcon/ActionIconGroup/ActionIconGroup.tsx +++ b/packages/@mantine/core/src/components/ActionIcon/ActionIconGroup/ActionIconGroup.tsx @@ -1,14 +1,14 @@ import React from 'react'; import { - factory, Box, BoxProps, + createVarsResolver, + factory, + Factory, + rem, StylesApiProps, useProps, useStyles, - rem, - createVarsResolver, - Factory, } from '../../../core'; import classes from '../ActionIcon.module.css'; diff --git a/packages/@mantine/core/src/components/Affix/Affix.tsx b/packages/@mantine/core/src/components/Affix/Affix.tsx index 749dce08f3a..f808ed92411 100644 --- a/packages/@mantine/core/src/components/Affix/Affix.tsx +++ b/packages/@mantine/core/src/components/Affix/Affix.tsx @@ -2,15 +2,15 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, getDefaultZIndex, rem, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import { OptionalPortal, PortalProps } from '../Portal'; import classes from './Affix.module.css'; diff --git a/packages/@mantine/core/src/components/Alert/Alert.story.tsx b/packages/@mantine/core/src/components/Alert/Alert.story.tsx index fe377f26aef..759654e4fc7 100644 --- a/packages/@mantine/core/src/components/Alert/Alert.story.tsx +++ b/packages/@mantine/core/src/components/Alert/Alert.story.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { Alert } from './Alert'; import { MantineThemeProvider } from '../../core'; +import { Alert } from './Alert'; export default { title: 'Alert' }; diff --git a/packages/@mantine/core/src/components/Alert/Alert.tsx b/packages/@mantine/core/src/components/Alert/Alert.tsx index 4e3f8f60c33..084b7d6148f 100644 --- a/packages/@mantine/core/src/components/Alert/Alert.tsx +++ b/packages/@mantine/core/src/components/Alert/Alert.tsx @@ -3,19 +3,19 @@ import { useId } from '@mantine/hooks'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, getRadius, - MantineRadius, MantineColor, + MantineRadius, + StylesApiProps, + useProps, + useStyles, } from '../../core'; -import classes from './Alert.module.css'; import { CloseButton } from '../CloseButton'; +import classes from './Alert.module.css'; export type AlertStylesNames = | 'root' diff --git a/packages/@mantine/core/src/components/Anchor/Anchor.tsx b/packages/@mantine/core/src/components/Anchor/Anchor.tsx index 9c9cd1e8838..11106ef4c39 100644 --- a/packages/@mantine/core/src/components/Anchor/Anchor.tsx +++ b/packages/@mantine/core/src/components/Anchor/Anchor.tsx @@ -1,7 +1,7 @@ import React from 'react'; import cx from 'clsx'; -import { polymorphicFactory, useProps, PolymorphicFactory } from '../../core'; -import { Text, TextProps, TextCssVariables, TextStylesNames, TextVariant } from '../Text'; +import { polymorphicFactory, PolymorphicFactory, useProps } from '../../core'; +import { Text, TextCssVariables, TextProps, TextStylesNames, TextVariant } from '../Text'; import classes from './Anchor.module.css'; export type AnchorStylesNames = TextStylesNames; diff --git a/packages/@mantine/core/src/components/AppShell/AppShell.story.tsx b/packages/@mantine/core/src/components/AppShell/AppShell.story.tsx index 0feb1d8ba77..acbe01dbbb1 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShell.story.tsx +++ b/packages/@mantine/core/src/components/AppShell/AppShell.story.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { useDisclosure } from '@mantine/hooks'; -import { Group } from '../Group'; import { Button } from '../Button'; +import { Group } from '../Group'; import { AppShell } from './AppShell'; export default { title: 'AppShell' }; diff --git a/packages/@mantine/core/src/components/AppShell/AppShell.test.tsx b/packages/@mantine/core/src/components/AppShell/AppShell.test.tsx index b660aff67b6..455ed537987 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShell.test.tsx +++ b/packages/@mantine/core/src/components/AppShell/AppShell.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { tests, render } from '@mantine-tests/core'; +import { render, tests } from '@mantine-tests/core'; import { AppShell, AppShellProps, AppShellStylesNames } from './AppShell'; const defaultProps: AppShellProps = {}; diff --git a/packages/@mantine/core/src/components/AppShell/AppShell.tsx b/packages/@mantine/core/src/components/AppShell/AppShell.tsx index 91ec5342635..38787c67ce0 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShell.tsx +++ b/packages/@mantine/core/src/components/AppShell/AppShell.tsx @@ -2,32 +2,32 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - MantineSpacing, getDefaultZIndex, + MantineSpacing, + StylesApiProps, + useProps, + useStyles, } from '../../core'; -import { AppShellNavbar } from './AppShellNavbar/AppShellNavbar'; -import { AppShellHeader } from './AppShellHeader/AppShellHeader'; -import { AppShellFooter } from './AppShellFooter/AppShellFooter'; -import { AppShellAside } from './AppShellAside/AppShellAside'; -import { AppShellMain } from './AppShellMain/AppShellMain'; -import { AppShellSection } from './AppShellSection/AppShellSection'; -import { AppShellMediaStyles } from './AppShellMediaStyles/AppShellMediaStyles'; import { AppShellProvider } from './AppShell.context'; -import { useResizing } from './use-resizing/use-resizing'; import { AppShellAsideConfiguration, + AppShellFooterConfiguration, AppShellHeaderConfiguration, AppShellNavbarConfiguration, - AppShellFooterConfiguration, AppShellResponsiveSize, } from './AppShell.types'; +import { AppShellAside } from './AppShellAside/AppShellAside'; +import { AppShellFooter } from './AppShellFooter/AppShellFooter'; +import { AppShellHeader } from './AppShellHeader/AppShellHeader'; +import { AppShellMain } from './AppShellMain/AppShellMain'; +import { AppShellMediaStyles } from './AppShellMediaStyles/AppShellMediaStyles'; +import { AppShellNavbar } from './AppShellNavbar/AppShellNavbar'; +import { AppShellSection } from './AppShellSection/AppShellSection'; +import { useResizing } from './use-resizing/use-resizing'; import classes from './AppShell.module.css'; export type AppShellStylesNames = diff --git a/packages/@mantine/core/src/components/AppShell/AppShellAside/AppShellAside.test.tsx b/packages/@mantine/core/src/components/AppShell/AppShellAside/AppShellAside.test.tsx index f39cb3b250f..d5a45a771c1 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellAside/AppShellAside.test.tsx +++ b/packages/@mantine/core/src/components/AppShell/AppShellAside/AppShellAside.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { render, tests, createContextContainer } from '@mantine-tests/core'; -import { AppShellAside, AppShellAsideProps, AppShellAsideStylesNames } from './AppShellAside'; +import { createContextContainer, render, tests } from '@mantine-tests/core'; import { AppShell } from '../AppShell'; +import { AppShellAside, AppShellAsideProps, AppShellAsideStylesNames } from './AppShellAside'; const TestContainer = createContextContainer(AppShellAside, AppShell, {}); diff --git a/packages/@mantine/core/src/components/AppShell/AppShellAside/AppShellAside.tsx b/packages/@mantine/core/src/components/AppShell/AppShellAside/AppShellAside.tsx index 361248781b2..8864e3c9be1 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellAside/AppShellAside.tsx +++ b/packages/@mantine/core/src/components/AppShell/AppShellAside/AppShellAside.tsx @@ -2,11 +2,11 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + StylesApiProps, + useProps, } from '../../../core'; import { useAppShellContext } from '../AppShell.context'; import classes from '../AppShell.module.css'; diff --git a/packages/@mantine/core/src/components/AppShell/AppShellFooter/AppShellFooter.test.tsx b/packages/@mantine/core/src/components/AppShell/AppShellFooter/AppShellFooter.test.tsx index 2e111a4bbc7..96bf7074de6 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellFooter/AppShellFooter.test.tsx +++ b/packages/@mantine/core/src/components/AppShell/AppShellFooter/AppShellFooter.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { render, tests, createContextContainer } from '@mantine-tests/core'; -import { AppShellFooter, AppShellFooterProps, AppShellFooterStylesNames } from './AppShellFooter'; +import { createContextContainer, render, tests } from '@mantine-tests/core'; import { AppShell } from '../AppShell'; +import { AppShellFooter, AppShellFooterProps, AppShellFooterStylesNames } from './AppShellFooter'; const TestContainer = createContextContainer(AppShellFooter, AppShell, {}); diff --git a/packages/@mantine/core/src/components/AppShell/AppShellFooter/AppShellFooter.tsx b/packages/@mantine/core/src/components/AppShell/AppShellFooter/AppShellFooter.tsx index 7ff0ee65494..5fbee379764 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellFooter/AppShellFooter.tsx +++ b/packages/@mantine/core/src/components/AppShell/AppShellFooter/AppShellFooter.tsx @@ -1,17 +1,17 @@ -import cx from 'clsx'; import React from 'react'; +import cx from 'clsx'; import { RemoveScroll } from 'react-remove-scroll'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + StylesApiProps, + useProps, } from '../../../core'; -import classes from '../AppShell.module.css'; import { useAppShellContext } from '../AppShell.context'; +import classes from '../AppShell.module.css'; export type AppShellFooterStylesNames = 'footer'; export type AppShellFooterVariant = string; diff --git a/packages/@mantine/core/src/components/AppShell/AppShellHeader/AppShellHeader.test.tsx b/packages/@mantine/core/src/components/AppShell/AppShellHeader/AppShellHeader.test.tsx index 430508a74cf..fefd1ba3f0d 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellHeader/AppShellHeader.test.tsx +++ b/packages/@mantine/core/src/components/AppShell/AppShellHeader/AppShellHeader.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { render, tests, createContextContainer } from '@mantine-tests/core'; -import { AppShellHeader, AppShellHeaderProps, AppShellHeaderStylesNames } from './AppShellHeader'; +import { createContextContainer, render, tests } from '@mantine-tests/core'; import { AppShell } from '../AppShell'; +import { AppShellHeader, AppShellHeaderProps, AppShellHeaderStylesNames } from './AppShellHeader'; const TestContainer = createContextContainer(AppShellHeader, AppShell, {}); diff --git a/packages/@mantine/core/src/components/AppShell/AppShellHeader/AppShellHeader.tsx b/packages/@mantine/core/src/components/AppShell/AppShellHeader/AppShellHeader.tsx index 9ca237c1d84..c238858e415 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellHeader/AppShellHeader.tsx +++ b/packages/@mantine/core/src/components/AppShell/AppShellHeader/AppShellHeader.tsx @@ -1,17 +1,17 @@ -import cx from 'clsx'; import React from 'react'; +import cx from 'clsx'; import { RemoveScroll } from 'react-remove-scroll'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + StylesApiProps, + useProps, } from '../../../core'; -import classes from '../AppShell.module.css'; import { useAppShellContext } from '../AppShell.context'; +import classes from '../AppShell.module.css'; export type AppShellHeaderStylesNames = 'header'; export type AppShellHeaderVariant = string; diff --git a/packages/@mantine/core/src/components/AppShell/AppShellMain/AppShellMain.test.tsx b/packages/@mantine/core/src/components/AppShell/AppShellMain/AppShellMain.test.tsx index 74f04656ed4..cbf2765e82f 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellMain/AppShellMain.test.tsx +++ b/packages/@mantine/core/src/components/AppShell/AppShellMain/AppShellMain.test.tsx @@ -1,6 +1,6 @@ -import { tests, createContextContainer } from '@mantine-tests/core'; -import { AppShellMain, AppShellMainProps, AppShellMainStylesNames } from './AppShellMain'; +import { createContextContainer, tests } from '@mantine-tests/core'; import { AppShell } from '../AppShell'; +import { AppShellMain, AppShellMainProps, AppShellMainStylesNames } from './AppShellMain'; const TestContainer = createContextContainer(AppShellMain, AppShell, {}); diff --git a/packages/@mantine/core/src/components/AppShell/AppShellMain/AppShellMain.tsx b/packages/@mantine/core/src/components/AppShell/AppShellMain/AppShellMain.tsx index 85e5da77ca7..129bae6826c 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellMain/AppShellMain.tsx +++ b/packages/@mantine/core/src/components/AppShell/AppShellMain/AppShellMain.tsx @@ -3,10 +3,10 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '../../../core'; import { useAppShellContext } from '../AppShell.context'; import classes from '../AppShell.module.css'; diff --git a/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/AppShellMediaStyles.tsx b/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/AppShellMediaStyles.tsx index e313132b799..2777c92cde4 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/AppShellMediaStyles.tsx +++ b/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/AppShellMediaStyles.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { useMantineTheme, useMantineContext, InlineStyles } from '../../../core'; +import { InlineStyles, useMantineContext, useMantineTheme } from '../../../core'; import type { AppShellProps } from '../AppShell'; import { getVariables } from './get-variables/get-variables'; diff --git a/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/assign-aside-variables/assign-aside-variables.ts b/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/assign-aside-variables/assign-aside-variables.ts index 223f4c384b2..d7e109e4f0f 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/assign-aside-variables/assign-aside-variables.ts +++ b/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/assign-aside-variables/assign-aside-variables.ts @@ -1,9 +1,9 @@ -import { MantineTheme, keys, rem, getBreakpointValue } from '../../../../core'; -import type { CSSVariables, MediaQueryVariables } from '../get-variables/get-variables'; +import { getBreakpointValue, keys, MantineTheme, rem } from '../../../../core'; import type { AppShellProps } from '../../AppShell'; -import { isResponsiveSize } from '../is-responsive-size/is-responsive-size'; -import { isPrimitiveSize } from '../is-primitive-size/is-primitive-size'; import { getBaseSize } from '../get-base-size/get-base-size'; +import type { CSSVariables, MediaQueryVariables } from '../get-variables/get-variables'; +import { isPrimitiveSize } from '../is-primitive-size/is-primitive-size'; +import { isResponsiveSize } from '../is-responsive-size/is-responsive-size'; interface AssignAsideVariablesInput { baseStyles: CSSVariables; diff --git a/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/assign-footer-variables/assign-footer-variables.ts b/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/assign-footer-variables/assign-footer-variables.ts index dc21efd9044..e688d4ad81a 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/assign-footer-variables/assign-footer-variables.ts +++ b/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/assign-footer-variables/assign-footer-variables.ts @@ -1,9 +1,9 @@ import { keys, rem } from '../../../../core'; -import type { CSSVariables, MediaQueryVariables } from '../get-variables/get-variables'; import type { AppShellProps } from '../../AppShell'; -import { isResponsiveSize } from '../is-responsive-size/is-responsive-size'; -import { isPrimitiveSize } from '../is-primitive-size/is-primitive-size'; import { getBaseSize } from '../get-base-size/get-base-size'; +import type { CSSVariables, MediaQueryVariables } from '../get-variables/get-variables'; +import { isPrimitiveSize } from '../is-primitive-size/is-primitive-size'; +import { isResponsiveSize } from '../is-responsive-size/is-responsive-size'; interface AssignFooterVariablesInput { baseStyles: CSSVariables; diff --git a/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/assign-header-variables/assign-header-variables.ts b/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/assign-header-variables/assign-header-variables.ts index e018bc439f4..b6ca24a6d44 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/assign-header-variables/assign-header-variables.ts +++ b/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/assign-header-variables/assign-header-variables.ts @@ -1,9 +1,9 @@ import { keys, rem } from '../../../../core'; -import type { CSSVariables, MediaQueryVariables } from '../get-variables/get-variables'; import type { AppShellProps } from '../../AppShell'; -import { isResponsiveSize } from '../is-responsive-size/is-responsive-size'; -import { isPrimitiveSize } from '../is-primitive-size/is-primitive-size'; import { getBaseSize } from '../get-base-size/get-base-size'; +import type { CSSVariables, MediaQueryVariables } from '../get-variables/get-variables'; +import { isPrimitiveSize } from '../is-primitive-size/is-primitive-size'; +import { isResponsiveSize } from '../is-responsive-size/is-responsive-size'; interface AssignHeaderVariablesInput { baseStyles: CSSVariables; diff --git a/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/assign-navbar-variables/assign-navbar-variables.ts b/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/assign-navbar-variables/assign-navbar-variables.ts index 048e67ec79e..90874512024 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/assign-navbar-variables/assign-navbar-variables.ts +++ b/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/assign-navbar-variables/assign-navbar-variables.ts @@ -1,9 +1,9 @@ -import { MantineTheme, keys, rem, getBreakpointValue } from '../../../../core'; -import type { CSSVariables, MediaQueryVariables } from '../get-variables/get-variables'; +import { getBreakpointValue, keys, MantineTheme, rem } from '../../../../core'; import type { AppShellProps } from '../../AppShell'; -import { isResponsiveSize } from '../is-responsive-size/is-responsive-size'; -import { isPrimitiveSize } from '../is-primitive-size/is-primitive-size'; import { getBaseSize } from '../get-base-size/get-base-size'; +import type { CSSVariables, MediaQueryVariables } from '../get-variables/get-variables'; +import { isPrimitiveSize } from '../is-primitive-size/is-primitive-size'; +import { isResponsiveSize } from '../is-responsive-size/is-responsive-size'; interface AssignNavbarVariablesInput { baseStyles: CSSVariables; diff --git a/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/get-base-size/get-base-size.ts b/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/get-base-size/get-base-size.ts index 76cb54b900c..61417e6488a 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/get-base-size/get-base-size.ts +++ b/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/get-base-size/get-base-size.ts @@ -1,4 +1,4 @@ -import type { AppShellSize, AppShellResponsiveSize } from '../../AppShell.types'; +import type { AppShellResponsiveSize, AppShellSize } from '../../AppShell.types'; export function getBaseSize(size: AppShellSize | AppShellResponsiveSize) { if (typeof size === 'object') { diff --git a/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/get-variables/get-variables.ts b/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/get-variables/get-variables.ts index 6c01d2373d3..2fa815ce76a 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/get-variables/get-variables.ts +++ b/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/get-variables/get-variables.ts @@ -1,4 +1,4 @@ -import { MantineTheme, em, keys, getSortedBreakpoints } from '../../../../core'; +import { em, getSortedBreakpoints, keys, MantineTheme } from '../../../../core'; import type { AppShellProps } from '../../AppShell'; import { assignAsideVariables } from '../assign-aside-variables/assign-aside-variables'; import { assignFooterVariables } from '../assign-footer-variables/assign-footer-variables'; diff --git a/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/is-primitive-size/is-primitive-size.ts b/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/is-primitive-size/is-primitive-size.ts index c18208266c8..e7822bf185c 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/is-primitive-size/is-primitive-size.ts +++ b/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/is-primitive-size/is-primitive-size.ts @@ -1,4 +1,4 @@ -import type { AppShellSize, AppShellResponsiveSize } from '../../AppShell.types'; +import type { AppShellResponsiveSize, AppShellSize } from '../../AppShell.types'; export function isPrimitiveSize( size: AppShellSize | AppShellResponsiveSize | undefined diff --git a/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/is-responsive-size/is-responsive-size.ts b/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/is-responsive-size/is-responsive-size.ts index 6870c4a9183..1bfa5ca841b 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/is-responsive-size/is-responsive-size.ts +++ b/packages/@mantine/core/src/components/AppShell/AppShellMediaStyles/is-responsive-size/is-responsive-size.ts @@ -1,4 +1,4 @@ -import type { AppShellSize, AppShellResponsiveSize } from '../../AppShell.types'; +import type { AppShellResponsiveSize, AppShellSize } from '../../AppShell.types'; export function isResponsiveSize( size: AppShellSize | AppShellResponsiveSize | undefined diff --git a/packages/@mantine/core/src/components/AppShell/AppShellNavbar/AppShellNavbar.test.tsx b/packages/@mantine/core/src/components/AppShell/AppShellNavbar/AppShellNavbar.test.tsx index 5e9e93b6920..9c4c295ea8a 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellNavbar/AppShellNavbar.test.tsx +++ b/packages/@mantine/core/src/components/AppShell/AppShellNavbar/AppShellNavbar.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { render, tests, createContextContainer } from '@mantine-tests/core'; -import { AppShellNavbar, AppShellNavbarProps, AppShellNavbarStylesNames } from './AppShellNavbar'; +import { createContextContainer, render, tests } from '@mantine-tests/core'; import { AppShell } from '../AppShell'; +import { AppShellNavbar, AppShellNavbarProps, AppShellNavbarStylesNames } from './AppShellNavbar'; const TestContainer = createContextContainer(AppShellNavbar, AppShell, {}); diff --git a/packages/@mantine/core/src/components/AppShell/AppShellNavbar/AppShellNavbar.tsx b/packages/@mantine/core/src/components/AppShell/AppShellNavbar/AppShellNavbar.tsx index 79ae93fdd57..29770d13c01 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellNavbar/AppShellNavbar.tsx +++ b/packages/@mantine/core/src/components/AppShell/AppShellNavbar/AppShellNavbar.tsx @@ -2,11 +2,11 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + StylesApiProps, + useProps, } from '../../../core'; import { useAppShellContext } from '../AppShell.context'; import classes from '../AppShell.module.css'; diff --git a/packages/@mantine/core/src/components/AppShell/AppShellSection/AppShellSection.test.tsx b/packages/@mantine/core/src/components/AppShell/AppShellSection/AppShellSection.test.tsx index 6dabece7dbe..5ae9d789946 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellSection/AppShellSection.test.tsx +++ b/packages/@mantine/core/src/components/AppShell/AppShellSection/AppShellSection.test.tsx @@ -1,11 +1,11 @@ import React from 'react'; -import { render, tests, createContextContainer } from '@mantine-tests/core'; +import { createContextContainer, render, tests } from '@mantine-tests/core'; +import { AppShell } from '../AppShell'; import { AppShellSection, AppShellSectionProps, AppShellSectionStylesNames, } from './AppShellSection'; -import { AppShell } from '../AppShell'; const TestContainer = createContextContainer(AppShellSection, AppShell, {}); diff --git a/packages/@mantine/core/src/components/AppShell/AppShellSection/AppShellSection.tsx b/packages/@mantine/core/src/components/AppShell/AppShellSection/AppShellSection.tsx index 5c07a2d9d71..c977524e269 100644 --- a/packages/@mantine/core/src/components/AppShell/AppShellSection/AppShellSection.tsx +++ b/packages/@mantine/core/src/components/AppShell/AppShellSection/AppShellSection.tsx @@ -4,8 +4,8 @@ import { BoxProps, CompoundStylesApiProps, polymorphicFactory, - useProps, PolymorphicFactory, + useProps, } from '../../../core'; import { useAppShellContext } from '../AppShell.context'; import classes from '../AppShell.module.css'; diff --git a/packages/@mantine/core/src/components/AppShell/use-resizing/use-resizing.tsx b/packages/@mantine/core/src/components/AppShell/use-resizing/use-resizing.tsx index 3ebc2ebb9a8..5115a1c9a84 100644 --- a/packages/@mantine/core/src/components/AppShell/use-resizing/use-resizing.tsx +++ b/packages/@mantine/core/src/components/AppShell/use-resizing/use-resizing.tsx @@ -1,5 +1,5 @@ -import { useState, useRef } from 'react'; -import { useWindowEvent, useIsomorphicEffect } from '@mantine/hooks'; +import { useRef, useState } from 'react'; +import { useIsomorphicEffect, useWindowEvent } from '@mantine/hooks'; interface UseResizingInput { transitionDuration: number | undefined; diff --git a/packages/@mantine/core/src/components/AspectRatio/AspectRatio.tsx b/packages/@mantine/core/src/components/AspectRatio/AspectRatio.tsx index 837197b324c..fdb2be8f528 100644 --- a/packages/@mantine/core/src/components/AspectRatio/AspectRatio.tsx +++ b/packages/@mantine/core/src/components/AspectRatio/AspectRatio.tsx @@ -2,13 +2,13 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, + createVarsResolver, ElementProps, + factory, + Factory, + StylesApiProps, useProps, useStyles, - createVarsResolver, - Factory, } from '../../core'; import classes from './AspectRatio.module.css'; diff --git a/packages/@mantine/core/src/components/Autocomplete/Autocomplete.story.tsx b/packages/@mantine/core/src/components/Autocomplete/Autocomplete.story.tsx index 0643bd66e2e..cb936c7a60d 100644 --- a/packages/@mantine/core/src/components/Autocomplete/Autocomplete.story.tsx +++ b/packages/@mantine/core/src/components/Autocomplete/Autocomplete.story.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { Autocomplete } from './Autocomplete'; import { Button } from '../Button'; +import { Autocomplete } from './Autocomplete'; export default { title: 'Autocomplete' }; diff --git a/packages/@mantine/core/src/components/Autocomplete/Autocomplete.test.tsx b/packages/@mantine/core/src/components/Autocomplete/Autocomplete.test.tsx index 0f969f00550..2d90c11439a 100644 --- a/packages/@mantine/core/src/components/Autocomplete/Autocomplete.test.tsx +++ b/packages/@mantine/core/src/components/Autocomplete/Autocomplete.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { tests, inputDefaultProps, inputStylesApiSelectors } from '@mantine-tests/core'; +import { inputDefaultProps, inputStylesApiSelectors, tests } from '@mantine-tests/core'; import { Autocomplete, AutocompleteProps, AutocompleteStylesNames } from './Autocomplete'; const defaultProps: AutocompleteProps = { diff --git a/packages/@mantine/core/src/components/Autocomplete/Autocomplete.tsx b/packages/@mantine/core/src/components/Autocomplete/Autocomplete.tsx index 3a186b8cf0f..1f12660d506 100644 --- a/packages/@mantine/core/src/components/Autocomplete/Autocomplete.tsx +++ b/packages/@mantine/core/src/components/Autocomplete/Autocomplete.tsx @@ -1,25 +1,25 @@ import React, { useEffect } from 'react'; -import { useUncontrolled, useId } from '@mantine/hooks'; +import { useId, useUncontrolled } from '@mantine/hooks'; import { BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + StylesApiProps, + useProps, useResolvedStylesApi, } from '../../core'; -import { InputBase } from '../InputBase'; -import { __InputStylesNames, __BaseInputProps, InputVariant } from '../Input'; import { Combobox, - OptionsDropdown, - useCombobox, - getParsedComboboxData, - getOptionsLockup, ComboboxLikeProps, ComboboxLikeStylesNames, + getOptionsLockup, + getParsedComboboxData, + OptionsDropdown, + useCombobox, } from '../Combobox'; +import { __BaseInputProps, __InputStylesNames, InputVariant } from '../Input'; +import { InputBase } from '../InputBase'; export type AutocompleteStylesNames = __InputStylesNames | ComboboxLikeStylesNames; diff --git a/packages/@mantine/core/src/components/Avatar/Avatar.story.tsx b/packages/@mantine/core/src/components/Avatar/Avatar.story.tsx index 44ba6c0c024..a68361070e3 100644 --- a/packages/@mantine/core/src/components/Avatar/Avatar.story.tsx +++ b/packages/@mantine/core/src/components/Avatar/Avatar.story.tsx @@ -1,10 +1,10 @@ import React from 'react'; -import { Tooltip } from '../Tooltip'; +import { Box } from '../../core'; import { Center } from '../Center'; import { Group } from '../Group'; import { Stack } from '../Stack'; -import { Box } from '../../core'; import { Text } from '../Text'; +import { Tooltip } from '../Tooltip'; import { Avatar } from './Avatar'; export default { title: 'Avatar' }; diff --git a/packages/@mantine/core/src/components/Avatar/Avatar.test.tsx b/packages/@mantine/core/src/components/Avatar/Avatar.test.tsx index b0cd7ee7187..ee3db849470 100644 --- a/packages/@mantine/core/src/components/Avatar/Avatar.test.tsx +++ b/packages/@mantine/core/src/components/Avatar/Avatar.test.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { render, tests } from '@mantine-tests/core'; import { fireEvent } from '@testing-library/react'; +import { render, tests } from '@mantine-tests/core'; import { Avatar, AvatarProps, AvatarStylesNames } from './Avatar'; import { AvatarGroup } from './AvatarGroup/AvatarGroup'; diff --git a/packages/@mantine/core/src/components/Avatar/Avatar.tsx b/packages/@mantine/core/src/components/Avatar/Avatar.tsx index 97fe1cccc80..8bc9e5514d7 100644 --- a/packages/@mantine/core/src/components/Avatar/Avatar.tsx +++ b/packages/@mantine/core/src/components/Avatar/Avatar.tsx @@ -2,18 +2,18 @@ import React, { useEffect, useState } from 'react'; import { Box, BoxProps, - StylesApiProps, - polymorphicFactory, - useProps, - useStyles, createVarsResolver, - PolymorphicFactory, - getSize, getRadius, - MantineSize, - MantineRadius, + getSize, MantineColor, MantineGradient, + MantineRadius, + MantineSize, + polymorphicFactory, + PolymorphicFactory, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import { AvatarGroup } from './AvatarGroup/AvatarGroup'; import { useAvatarGroupContext } from './AvatarGroup/AvatarGroup.context'; diff --git a/packages/@mantine/core/src/components/Avatar/AvatarGroup/AvatarGroup.tsx b/packages/@mantine/core/src/components/Avatar/AvatarGroup/AvatarGroup.tsx index 9a603fe2ad6..65aad5d8687 100644 --- a/packages/@mantine/core/src/components/Avatar/AvatarGroup/AvatarGroup.tsx +++ b/packages/@mantine/core/src/components/Avatar/AvatarGroup/AvatarGroup.tsx @@ -2,15 +2,15 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - MantineSpacing, getSpacing, + MantineSpacing, + StylesApiProps, + useProps, + useStyles, } from '../../../core'; import { AvatarGroupProvider } from './AvatarGroup.context'; import classes from '../Avatar.module.css'; diff --git a/packages/@mantine/core/src/components/BackgroundImage/BackgroundImage.tsx b/packages/@mantine/core/src/components/BackgroundImage/BackgroundImage.tsx index fdf851e5d49..46a2f79bc7a 100644 --- a/packages/@mantine/core/src/components/BackgroundImage/BackgroundImage.tsx +++ b/packages/@mantine/core/src/components/BackgroundImage/BackgroundImage.tsx @@ -2,14 +2,14 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, + createVarsResolver, + getRadius, + MantineRadius, polymorphicFactory, + PolymorphicFactory, + StylesApiProps, useProps, useStyles, - MantineRadius, - getRadius, - createVarsResolver, - PolymorphicFactory, } from '../../core'; import classes from './BackgroundImage.module.css'; diff --git a/packages/@mantine/core/src/components/Badge/Badge.tsx b/packages/@mantine/core/src/components/Badge/Badge.tsx index 75168b3140d..1e2291efe64 100644 --- a/packages/@mantine/core/src/components/Badge/Badge.tsx +++ b/packages/@mantine/core/src/components/Badge/Badge.tsx @@ -2,19 +2,19 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - polymorphicFactory, - useProps, - useStyles, createVarsResolver, - PolymorphicFactory, - getSize, getRadius, - MantineSize, - MantineRadius, + getSize, + getThemeColor, MantineColor, MantineGradient, - getThemeColor, + MantineRadius, + MantineSize, + polymorphicFactory, + PolymorphicFactory, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import classes from './Badge.module.css'; diff --git a/packages/@mantine/core/src/components/Blockquote/Blockquote.story.tsx b/packages/@mantine/core/src/components/Blockquote/Blockquote.story.tsx index 019d474da6b..58a86d41eef 100644 --- a/packages/@mantine/core/src/components/Blockquote/Blockquote.story.tsx +++ b/packages/@mantine/core/src/components/Blockquote/Blockquote.story.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { IconInfoCircle } from '@tabler/icons-react'; -import { Blockquote } from './Blockquote'; import { rem } from '../../core'; +import { Blockquote } from './Blockquote'; export default { title: 'Blockquote' }; diff --git a/packages/@mantine/core/src/components/Blockquote/Blockquote.tsx b/packages/@mantine/core/src/components/Blockquote/Blockquote.tsx index 6acda400db1..408924d6afd 100644 --- a/packages/@mantine/core/src/components/Blockquote/Blockquote.tsx +++ b/packages/@mantine/core/src/components/Blockquote/Blockquote.tsx @@ -2,20 +2,20 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - MantineColor, + getRadius, getThemeColor, + MantineColor, + MantineRadius, parseThemeColor, - rgba, rem, - MantineRadius, - getRadius, + rgba, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import classes from './Blockquote.module.css'; diff --git a/packages/@mantine/core/src/components/Breadcrumbs/Breadcrumbs.test.tsx b/packages/@mantine/core/src/components/Breadcrumbs/Breadcrumbs.test.tsx index 7d484aafbe5..390f64e962d 100644 --- a/packages/@mantine/core/src/components/Breadcrumbs/Breadcrumbs.test.tsx +++ b/packages/@mantine/core/src/components/Breadcrumbs/Breadcrumbs.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { Breadcrumbs, BreadcrumbsProps, BreadcrumbsStylesNames } from './Breadcrumbs'; const defaultProps: BreadcrumbsProps = { diff --git a/packages/@mantine/core/src/components/Breadcrumbs/Breadcrumbs.tsx b/packages/@mantine/core/src/components/Breadcrumbs/Breadcrumbs.tsx index 27d27b358c0..e2625e85260 100644 --- a/packages/@mantine/core/src/components/Breadcrumbs/Breadcrumbs.tsx +++ b/packages/@mantine/core/src/components/Breadcrumbs/Breadcrumbs.tsx @@ -2,16 +2,16 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, + getSpacing, isElement, MantineSpacing, - getSpacing, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import classes from './Breadcrumbs.module.css'; diff --git a/packages/@mantine/core/src/components/Burger/Burger.test.tsx b/packages/@mantine/core/src/components/Burger/Burger.test.tsx index ae85acbe3b4..49cb507f873 100644 --- a/packages/@mantine/core/src/components/Burger/Burger.test.tsx +++ b/packages/@mantine/core/src/components/Burger/Burger.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { VisuallyHidden } from '../VisuallyHidden'; import { Burger, BurgerProps, BurgerStylesNames } from './Burger'; diff --git a/packages/@mantine/core/src/components/Burger/Burger.tsx b/packages/@mantine/core/src/components/Burger/Burger.tsx index e72f3359ae0..596d79d7c01 100644 --- a/packages/@mantine/core/src/components/Burger/Burger.tsx +++ b/packages/@mantine/core/src/components/Burger/Burger.tsx @@ -2,20 +2,20 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - MantineSize, - MantineColor, - getThemeColor, getSize, + getThemeColor, + MantineColor, + MantineSize, + StylesApiProps, + useProps, + useStyles, } from '../../core'; -import classes from './Burger.module.css'; import { UnstyledButton } from '../UnstyledButton'; +import classes from './Burger.module.css'; export type BurgerStylesNames = 'root' | 'burger'; export type BurgerCssVariables = { diff --git a/packages/@mantine/core/src/components/Button/Button.story.tsx b/packages/@mantine/core/src/components/Button/Button.story.tsx index f6a5fca7e8d..fb58ce001db 100644 --- a/packages/@mantine/core/src/components/Button/Button.story.tsx +++ b/packages/@mantine/core/src/components/Button/Button.story.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { Button, ButtonProps } from './Button'; import { DEFAULT_THEME, rem } from '../../core'; +import { Button, ButtonProps } from './Button'; export default { title: 'Button' }; diff --git a/packages/@mantine/core/src/components/Button/Button.test.tsx b/packages/@mantine/core/src/components/Button/Button.test.tsx index e81389a4869..69717f9296b 100644 --- a/packages/@mantine/core/src/components/Button/Button.test.tsx +++ b/packages/@mantine/core/src/components/Button/Button.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { tests, render } from '@mantine-tests/core'; +import { render, tests } from '@mantine-tests/core'; import { Button, ButtonProps, ButtonStylesNames } from './Button'; import { ButtonGroup } from './ButtonGroup/ButtonGroup'; diff --git a/packages/@mantine/core/src/components/Button/Button.tsx b/packages/@mantine/core/src/components/Button/Button.tsx index 93c4ac696a5..8c932914a41 100644 --- a/packages/@mantine/core/src/components/Button/Button.tsx +++ b/packages/@mantine/core/src/components/Button/Button.tsx @@ -1,23 +1,23 @@ import React from 'react'; import { + Box, BoxProps, - StylesApiProps, - polymorphicFactory, - useProps, - useStyles, createVarsResolver, - PolymorphicFactory, - MantineSize, - MantineColor, - MantineRadius, - MantineGradient, - Box, + getFontSize, getRadius, getSize, - getFontSize, + MantineColor, + MantineGradient, + MantineRadius, + MantineSize, + polymorphicFactory, + PolymorphicFactory, + StylesApiProps, + useProps, + useStyles, } from '../../core'; -import { UnstyledButton } from '../UnstyledButton'; import { Loader, LoaderProps } from '../Loader'; +import { UnstyledButton } from '../UnstyledButton'; import { ButtonGroup } from './ButtonGroup/ButtonGroup'; import classes from './Button.module.css'; diff --git a/packages/@mantine/core/src/components/Button/ButtonGroup/ButtonGroup.test.tsx b/packages/@mantine/core/src/components/Button/ButtonGroup/ButtonGroup.test.tsx index 2e0ae3ac203..e239bc21fdc 100644 --- a/packages/@mantine/core/src/components/Button/ButtonGroup/ButtonGroup.test.tsx +++ b/packages/@mantine/core/src/components/Button/ButtonGroup/ButtonGroup.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { tests, render, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { ButtonGroup, ButtonGroupProps, ButtonGroupStylesNames } from './ButtonGroup'; const defaultProps: ButtonGroupProps = {}; diff --git a/packages/@mantine/core/src/components/Button/ButtonGroup/ButtonGroup.tsx b/packages/@mantine/core/src/components/Button/ButtonGroup/ButtonGroup.tsx index 55ff8f7776b..1f9f8c06eb8 100644 --- a/packages/@mantine/core/src/components/Button/ButtonGroup/ButtonGroup.tsx +++ b/packages/@mantine/core/src/components/Button/ButtonGroup/ButtonGroup.tsx @@ -1,14 +1,14 @@ import React from 'react'; import { - factory, Box, BoxProps, + createVarsResolver, + factory, + Factory, + rem, StylesApiProps, useProps, useStyles, - rem, - createVarsResolver, - Factory, } from '../../../core'; import classes from '../Button.module.css'; diff --git a/packages/@mantine/core/src/components/Card/Card.tsx b/packages/@mantine/core/src/components/Card/Card.tsx index d19878c8d94..0578d3070f0 100644 --- a/packages/@mantine/core/src/components/Card/Card.tsx +++ b/packages/@mantine/core/src/components/Card/Card.tsx @@ -1,20 +1,20 @@ import React, { Children, cloneElement } from 'react'; import { BoxProps, - StylesApiProps, - polymorphicFactory, - useProps, - useStyles, createVarsResolver, - PolymorphicFactory, - MantineShadow, + getSpacing, MantineRadius, + MantineShadow, MantineSpacing, - getSpacing, + polymorphicFactory, + PolymorphicFactory, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import { Paper } from '../Paper'; -import { CardSection } from './CardSection/CardSection'; import { CardProvider } from './Card.context'; +import { CardSection } from './CardSection/CardSection'; import classes from './Card.module.css'; export type CardStylesNames = 'root' | 'section'; diff --git a/packages/@mantine/core/src/components/Card/CardSection/CardSection.test.tsx b/packages/@mantine/core/src/components/Card/CardSection/CardSection.test.tsx index 9bd6f8fb09a..dcc6217561a 100644 --- a/packages/@mantine/core/src/components/Card/CardSection/CardSection.test.tsx +++ b/packages/@mantine/core/src/components/Card/CardSection/CardSection.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { render, tests, createContextContainer } from '@mantine-tests/core'; -import { CardSection, CardSectionProps, CardSectionStylesNames } from './CardSection'; +import { createContextContainer, render, tests } from '@mantine-tests/core'; import { Card } from '../Card'; +import { CardSection, CardSectionProps, CardSectionStylesNames } from './CardSection'; const TestContainer = createContextContainer(CardSection, Card, {}); diff --git a/packages/@mantine/core/src/components/Card/CardSection/CardSection.tsx b/packages/@mantine/core/src/components/Card/CardSection/CardSection.tsx index f75e81b8b72..2d8f739ec7c 100644 --- a/packages/@mantine/core/src/components/Card/CardSection/CardSection.tsx +++ b/packages/@mantine/core/src/components/Card/CardSection/CardSection.tsx @@ -4,8 +4,8 @@ import { BoxProps, CompoundStylesApiProps, polymorphicFactory, - useProps, PolymorphicFactory, + useProps, } from '../../../core'; import { useCardContext } from '../Card.context'; import classes from '../Card.module.css'; diff --git a/packages/@mantine/core/src/components/Center/Center.tsx b/packages/@mantine/core/src/components/Center/Center.tsx index 9f7e2aa25f2..13343aada1f 100644 --- a/packages/@mantine/core/src/components/Center/Center.tsx +++ b/packages/@mantine/core/src/components/Center/Center.tsx @@ -2,11 +2,11 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, polymorphicFactory, + PolymorphicFactory, + StylesApiProps, useProps, useStyles, - PolymorphicFactory, } from '../../core'; import classes from './Center.module.css'; diff --git a/packages/@mantine/core/src/components/Checkbox/Checkbox.story.tsx b/packages/@mantine/core/src/components/Checkbox/Checkbox.story.tsx index 7805672d607..e20707fcce7 100644 --- a/packages/@mantine/core/src/components/Checkbox/Checkbox.story.tsx +++ b/packages/@mantine/core/src/components/Checkbox/Checkbox.story.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { MantineThemeProvider } from '../../core'; -import { Checkbox } from './Checkbox'; import { Stack } from '../Stack'; import { Tooltip } from '../Tooltip'; +import { Checkbox } from './Checkbox'; export default { title: 'Checkbox' }; diff --git a/packages/@mantine/core/src/components/Checkbox/Checkbox.test.tsx b/packages/@mantine/core/src/components/Checkbox/Checkbox.test.tsx index 0dbdaaf061f..5bc6f02f028 100644 --- a/packages/@mantine/core/src/components/Checkbox/Checkbox.test.tsx +++ b/packages/@mantine/core/src/components/Checkbox/Checkbox.test.tsx @@ -1,5 +1,5 @@ import React, { createRef } from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { Checkbox, CheckboxProps, CheckboxStylesNames } from './Checkbox'; const defaultProps: CheckboxProps = { diff --git a/packages/@mantine/core/src/components/Checkbox/Checkbox.tsx b/packages/@mantine/core/src/components/Checkbox/Checkbox.tsx index 82daa206ddf..ca7c3eb6fe4 100644 --- a/packages/@mantine/core/src/components/Checkbox/Checkbox.tsx +++ b/packages/@mantine/core/src/components/Checkbox/Checkbox.tsx @@ -1,25 +1,25 @@ import React from 'react'; import { useId } from '@mantine/hooks'; import { + Box, BoxProps, - StylesApiProps, - factory, + createVarsResolver, ElementProps, - useProps, - useStyles, - MantineColor, - MantineSize, - MantineRadius, extractStyleProps, + factory, + Factory, getRadius, getSize, getThemeColor, - createVarsResolver, - Factory, - Box, + MantineColor, + MantineRadius, + MantineSize, parseThemeColor, + StylesApiProps, + useProps, + useStyles, } from '../../core'; -import { InlineInput, InlineInputStylesNames, InlineInputClasses } from '../InlineInput'; +import { InlineInput, InlineInputClasses, InlineInputStylesNames } from '../InlineInput'; import { useCheckboxGroupContext } from './CheckboxGroup.context'; import { CheckboxGroup } from './CheckboxGroup/CheckboxGroup'; import { CheckboxIcon } from './CheckIcon'; diff --git a/packages/@mantine/core/src/components/Checkbox/CheckboxGroup/CheckboxGroup.test.tsx b/packages/@mantine/core/src/components/Checkbox/CheckboxGroup/CheckboxGroup.test.tsx index bf83924bc1e..2bb6ae17b96 100644 --- a/packages/@mantine/core/src/components/Checkbox/CheckboxGroup/CheckboxGroup.test.tsx +++ b/packages/@mantine/core/src/components/Checkbox/CheckboxGroup/CheckboxGroup.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, userEvent, screen } from '@mantine-tests/core'; +import { render, screen, tests, userEvent } from '@mantine-tests/core'; import { Checkbox } from '../Checkbox'; import { CheckboxGroup, CheckboxGroupProps, CheckboxGroupStylesNames } from './CheckboxGroup'; diff --git a/packages/@mantine/core/src/components/Checkbox/CheckboxGroup/CheckboxGroup.tsx b/packages/@mantine/core/src/components/Checkbox/CheckboxGroup/CheckboxGroup.tsx index 3f3a6ebe7a1..eb2c852fad8 100644 --- a/packages/@mantine/core/src/components/Checkbox/CheckboxGroup/CheckboxGroup.tsx +++ b/packages/@mantine/core/src/components/Checkbox/CheckboxGroup/CheckboxGroup.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { useUncontrolled } from '@mantine/hooks'; -import { factory, useProps, MantineSize, Factory } from '../../../core'; -import { InputWrapperStylesNames, Input, InputWrapperProps } from '../../Input'; +import { factory, Factory, MantineSize, useProps } from '../../../core'; +import { Input, InputWrapperProps, InputWrapperStylesNames } from '../../Input'; import { InputsGroupFieldset } from '../../InputsGroupFieldset'; import { CheckboxGroupProvider } from '../CheckboxGroup.context'; diff --git a/packages/@mantine/core/src/components/Chip/Chip.story.tsx b/packages/@mantine/core/src/components/Chip/Chip.story.tsx index b1e017374fa..1ee8841a959 100644 --- a/packages/@mantine/core/src/components/Chip/Chip.story.tsx +++ b/packages/@mantine/core/src/components/Chip/Chip.story.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { IconCheck } from '@tabler/icons-react'; -import { Chip } from './Chip'; import { Tooltip } from '../Tooltip'; +import { Chip } from './Chip'; export default { title: 'Chip' }; diff --git a/packages/@mantine/core/src/components/Chip/Chip.tsx b/packages/@mantine/core/src/components/Chip/Chip.tsx index 3abb9f4d480..fcd79b731fe 100644 --- a/packages/@mantine/core/src/components/Chip/Chip.tsx +++ b/packages/@mantine/core/src/components/Chip/Chip.tsx @@ -3,20 +3,20 @@ import { useId, useUncontrolled } from '@mantine/hooks'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + extractStyleProps, + factory, Factory, + getFontSize, + getRadius, + getSize, + MantineColor, MantineRadius, MantineSize, - MantineColor, - extractStyleProps, - getSize, - getRadius, - getFontSize, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import { CheckIcon } from '../Checkbox'; import { useChipGroupContext } from './ChipGroup.context'; diff --git a/packages/@mantine/core/src/components/Chip/ChipGroup/ChipGroup.test.tsx b/packages/@mantine/core/src/components/Chip/ChipGroup/ChipGroup.test.tsx index 8c4014a340b..af8f2307390 100644 --- a/packages/@mantine/core/src/components/Chip/ChipGroup/ChipGroup.test.tsx +++ b/packages/@mantine/core/src/components/Chip/ChipGroup/ChipGroup.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { tests, render, screen, userEvent } from '@mantine-tests/core'; -import { ChipGroup } from './ChipGroup'; +import { render, screen, tests, userEvent } from '@mantine-tests/core'; import { Chip } from '../Chip'; +import { ChipGroup } from './ChipGroup'; const defaultProps = { children: ( diff --git a/packages/@mantine/core/src/components/CloseButton/CloseButton.test.tsx b/packages/@mantine/core/src/components/CloseButton/CloseButton.test.tsx index 41852daa855..18de438d6b6 100644 --- a/packages/@mantine/core/src/components/CloseButton/CloseButton.test.tsx +++ b/packages/@mantine/core/src/components/CloseButton/CloseButton.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { tests, render } from '@mantine-tests/core'; +import { render, tests } from '@mantine-tests/core'; import { CloseButton, CloseButtonProps, CloseButtonStylesNames } from './CloseButton'; import { CloseIcon } from './CloseIcon'; diff --git a/packages/@mantine/core/src/components/CloseButton/CloseButton.tsx b/packages/@mantine/core/src/components/CloseButton/CloseButton.tsx index 769e2d4e4ac..b70090005dc 100644 --- a/packages/@mantine/core/src/components/CloseButton/CloseButton.tsx +++ b/packages/@mantine/core/src/components/CloseButton/CloseButton.tsx @@ -1,16 +1,16 @@ import React from 'react'; import { + BoxProps, + createVarsResolver, + getRadius, + getSize, + MantineRadius, + MantineSize, polymorphicFactory, - useProps, - rem, PolymorphicFactory, - MantineSize, - MantineRadius, - BoxProps, + rem, StylesApiProps, - getSize, - getRadius, - createVarsResolver, + useProps, useStyles, } from '../../core'; import { UnstyledButton } from '../UnstyledButton'; diff --git a/packages/@mantine/core/src/components/Code/Code.test.tsx b/packages/@mantine/core/src/components/Code/Code.test.tsx index 83431fa82bd..3797f3aecc6 100644 --- a/packages/@mantine/core/src/components/Code/Code.test.tsx +++ b/packages/@mantine/core/src/components/Code/Code.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { Code, CodeProps, CodeStylesNames } from './Code'; const defaultProps: CodeProps = {}; diff --git a/packages/@mantine/core/src/components/Code/Code.tsx b/packages/@mantine/core/src/components/Code/Code.tsx index 6a87045629f..ddb45e2f461 100644 --- a/packages/@mantine/core/src/components/Code/Code.tsx +++ b/packages/@mantine/core/src/components/Code/Code.tsx @@ -2,15 +2,15 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, + createVarsResolver, ElementProps, + factory, + Factory, + getThemeColor, + MantineColor, + StylesApiProps, useProps, useStyles, - MantineColor, - getThemeColor, - createVarsResolver, - Factory, } from '../../core'; import classes from './Code.module.css'; diff --git a/packages/@mantine/core/src/components/Collapse/Collapse.tsx b/packages/@mantine/core/src/components/Collapse/Collapse.tsx index d426fa0ba95..be44d4891cf 100644 --- a/packages/@mantine/core/src/components/Collapse/Collapse.tsx +++ b/packages/@mantine/core/src/components/Collapse/Collapse.tsx @@ -1,13 +1,13 @@ import React from 'react'; import { useReducedMotion } from '@mantine/hooks'; import { - BoxProps, - useProps, - useMantineTheme, Box, - getStyleObject, + BoxProps, Factory, factory, + getStyleObject, + useMantineTheme, + useProps, } from '../../core'; import { useCollapse } from './use-collapse'; diff --git a/packages/@mantine/core/src/components/Collapse/use-collapse.ts b/packages/@mantine/core/src/components/Collapse/use-collapse.ts index 0135ac1b786..167617f3439 100644 --- a/packages/@mantine/core/src/components/Collapse/use-collapse.ts +++ b/packages/@mantine/core/src/components/Collapse/use-collapse.ts @@ -1,6 +1,6 @@ -import React, { useState, useRef } from 'react'; +import React, { useRef, useState } from 'react'; import { flushSync } from 'react-dom'; -import { useDidUpdate, mergeRefs } from '@mantine/hooks'; +import { mergeRefs, useDidUpdate } from '@mantine/hooks'; import { CSSProperties } from '../../core'; function getAutoHeightDuration(height: number | string) { diff --git a/packages/@mantine/core/src/components/ColorInput/ColorInput.test.tsx b/packages/@mantine/core/src/components/ColorInput/ColorInput.test.tsx index d6dd6bc480f..923577071a6 100644 --- a/packages/@mantine/core/src/components/ColorInput/ColorInput.test.tsx +++ b/packages/@mantine/core/src/components/ColorInput/ColorInput.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { tests, inputDefaultProps, inputStylesApiSelectors } from '@mantine-tests/core'; -import { ColorInput, ColorInputProps } from './ColorInput'; +import { inputDefaultProps, inputStylesApiSelectors, tests } from '@mantine-tests/core'; import { __InputStylesNames } from '../Input'; +import { ColorInput, ColorInputProps } from './ColorInput'; const defaultProps: ColorInputProps = { ...inputDefaultProps, diff --git a/packages/@mantine/core/src/components/ColorInput/ColorInput.tsx b/packages/@mantine/core/src/components/ColorInput/ColorInput.tsx index 4560e8b7834..1850523c8e4 100644 --- a/packages/@mantine/core/src/components/ColorInput/ColorInput.tsx +++ b/packages/@mantine/core/src/components/ColorInput/ColorInput.tsx @@ -2,30 +2,30 @@ import React, { useEffect, useState } from 'react'; import { useDidUpdate, useEyeDropper, useUncontrolled } from '@mantine/hooks'; import { BoxProps, - StylesApiProps, - factory, + createVarsResolver, ElementProps, + factory, Factory, - useResolvedStylesApi, + getSize, + StylesApiProps, useProps, + useResolvedStylesApi, useStyles, - createVarsResolver, - getSize, } from '../../core'; -import { InputBase } from '../InputBase'; +import { ActionIcon } from '../ActionIcon'; import { __ColorPickerProps, - ColorPickerStylesNames, ColorPicker, + ColorPickerStylesNames, convertHsvaTo, isColorValid, parseColor, } from '../ColorPicker'; -import { __BaseInputProps, Input, InputVariant, __InputStylesNames, useInputProps } from '../Input'; +import { ColorSwatch } from '../ColorSwatch'; +import { __BaseInputProps, __InputStylesNames, Input, InputVariant, useInputProps } from '../Input'; +import { InputBase } from '../InputBase'; import { Popover, PopoverProps } from '../Popover'; import { EyeDropperIcon } from './EyeDropperIcon'; -import { ActionIcon } from '../ActionIcon'; -import { ColorSwatch } from '../ColorSwatch'; import classes from './ColorInput.module.css'; export type ColorInputStylesNames = diff --git a/packages/@mantine/core/src/components/ColorPicker/AlphaSlider/AlphaSlider.tsx b/packages/@mantine/core/src/components/ColorPicker/AlphaSlider/AlphaSlider.tsx index 3190a769a19..010abd8f5a9 100644 --- a/packages/@mantine/core/src/components/ColorPicker/AlphaSlider/AlphaSlider.tsx +++ b/packages/@mantine/core/src/components/ColorPicker/AlphaSlider/AlphaSlider.tsx @@ -1,5 +1,5 @@ import React, { forwardRef } from 'react'; -import { useProps, rem } from '../../../core'; +import { rem, useProps } from '../../../core'; import { ColorSlider, ColorSliderProps } from '../ColorSlider/ColorSlider'; import { round } from '../converters/parsers'; diff --git a/packages/@mantine/core/src/components/ColorPicker/ColorPicker.story.tsx b/packages/@mantine/core/src/components/ColorPicker/ColorPicker.story.tsx index 4fca74b9321..0564cebcb29 100644 --- a/packages/@mantine/core/src/components/ColorPicker/ColorPicker.story.tsx +++ b/packages/@mantine/core/src/components/ColorPicker/ColorPicker.story.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { ColorPicker } from './ColorPicker'; import { AlphaSlider } from './AlphaSlider/AlphaSlider'; +import { ColorPicker } from './ColorPicker'; import { HueSlider } from './HueSlider/HueSlider'; export default { title: 'ColorPicker' }; diff --git a/packages/@mantine/core/src/components/ColorPicker/ColorPicker.tsx b/packages/@mantine/core/src/components/ColorPicker/ColorPicker.tsx index 6e26e7beed2..452128dcfd6 100644 --- a/packages/@mantine/core/src/components/ColorPicker/ColorPicker.tsx +++ b/packages/@mantine/core/src/components/ColorPicker/ColorPicker.tsx @@ -3,25 +3,25 @@ import { useDidUpdate, useUncontrolled } from '@mantine/hooks'; import { Box, BoxProps, - StylesApiProps, - factory, + createVarsResolver, ElementProps, - useProps, - useStyles, - MantineSize, + factory, + Factory, getSize, getSpacing, - createVarsResolver, - Factory, + MantineSize, + StylesApiProps, + useProps, + useStyles, } from '../../core'; +import { ColorSwatch } from '../ColorSwatch'; import { AlphaSlider } from './AlphaSlider/AlphaSlider'; +import { ColorPickerProvider } from './ColorPicker.context'; +import { ColorFormat, HsvaColor } from './ColorPicker.types'; +import { convertHsvaTo, isColorValid, parseColor } from './converters'; import { HueSlider } from './HueSlider/HueSlider'; import { Saturation } from './Saturation/Saturation'; import { Swatches } from './Swatches/Swatches'; -import { ColorFormat, HsvaColor } from './ColorPicker.types'; -import { convertHsvaTo, isColorValid, parseColor } from './converters'; -import { ColorSwatch } from '../ColorSwatch'; -import { ColorPickerProvider } from './ColorPicker.context'; import classes from './ColorPicker.module.css'; export type ColorPickerStylesNames = diff --git a/packages/@mantine/core/src/components/ColorPicker/ColorSlider/ColorSlider.tsx b/packages/@mantine/core/src/components/ColorPicker/ColorSlider/ColorSlider.tsx index f5ea4336ed0..d9333334a28 100644 --- a/packages/@mantine/core/src/components/ColorPicker/ColorSlider/ColorSlider.tsx +++ b/packages/@mantine/core/src/components/ColorPicker/ColorSlider/ColorSlider.tsx @@ -1,28 +1,28 @@ import React, { useRef, useState } from 'react'; import { - UseMovePosition, clampUseMovePosition, useDidUpdate, useMergedRef, useMove, + UseMovePosition, } from '@mantine/hooks'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, MantineSize, - useMantineTheme, rem, + StylesApiProps, + useMantineTheme, + useProps, + useStyles, } from '../../../core'; -import classes from '../ColorPicker.module.css'; import { useColorPickerContext } from '../ColorPicker.context'; import { Thumb } from '../Thumb/Thumb'; +import classes from '../ColorPicker.module.css'; export type ColorSliderStylesNames = 'slider' | 'sliderOverlay' | 'thumb'; export type ColorSliderVariant = string; diff --git a/packages/@mantine/core/src/components/ColorPicker/HueSlider/HueSlider.tsx b/packages/@mantine/core/src/components/ColorPicker/HueSlider/HueSlider.tsx index 368c54db48c..ee373c0770f 100644 --- a/packages/@mantine/core/src/components/ColorPicker/HueSlider/HueSlider.tsx +++ b/packages/@mantine/core/src/components/ColorPicker/HueSlider/HueSlider.tsx @@ -1,5 +1,5 @@ import React, { forwardRef } from 'react'; -import { useProps, rem } from '../../../core'; +import { rem, useProps } from '../../../core'; import { ColorSlider, ColorSliderProps } from '../ColorSlider/ColorSlider'; export interface HueSliderProps extends Omit {} diff --git a/packages/@mantine/core/src/components/ColorPicker/Saturation/Saturation.tsx b/packages/@mantine/core/src/components/ColorPicker/Saturation/Saturation.tsx index b633e2728be..bd604054d72 100644 --- a/packages/@mantine/core/src/components/ColorPicker/Saturation/Saturation.tsx +++ b/packages/@mantine/core/src/components/ColorPicker/Saturation/Saturation.tsx @@ -1,10 +1,10 @@ import React, { useEffect, useRef, useState } from 'react'; -import { UseMovePosition, clampUseMovePosition, useMove } from '@mantine/hooks'; +import { clampUseMovePosition, useMove, UseMovePosition } from '@mantine/hooks'; import { Box, ElementProps, MantineSize } from '../../../core'; +import { useColorPickerContext } from '../ColorPicker.context'; import { HsvaColor } from '../ColorPicker.types'; import { convertHsvaTo } from '../converters'; import { Thumb } from '../Thumb/Thumb'; -import { useColorPickerContext } from '../ColorPicker.context'; export interface SaturationProps extends ElementProps<'div', 'onChange'> { value: HsvaColor; diff --git a/packages/@mantine/core/src/components/ColorPicker/converters/converters.ts b/packages/@mantine/core/src/components/ColorPicker/converters/converters.ts index 5007c26f96d..b951f13884b 100644 --- a/packages/@mantine/core/src/components/ColorPicker/converters/converters.ts +++ b/packages/@mantine/core/src/components/ColorPicker/converters/converters.ts @@ -1,4 +1,4 @@ -import { HsvaColor, RgbaColor, ColorFormat } from '../ColorPicker.types'; +import { ColorFormat, HsvaColor, RgbaColor } from '../ColorPicker.types'; import { round } from './parsers'; export function hsvaToRgbaObject({ h, s, v, a }: HsvaColor): RgbaColor { diff --git a/packages/@mantine/core/src/components/ColorPicker/converters/parsers.ts b/packages/@mantine/core/src/components/ColorPicker/converters/parsers.ts index 0c0213a2ca9..128db64350a 100644 --- a/packages/@mantine/core/src/components/ColorPicker/converters/parsers.ts +++ b/packages/@mantine/core/src/components/ColorPicker/converters/parsers.ts @@ -1,4 +1,4 @@ -import { HsvaColor, RgbaColor, ColorFormat, HslaColor } from '../ColorPicker.types'; +import { ColorFormat, HslaColor, HsvaColor, RgbaColor } from '../ColorPicker.types'; export function round(number: number, digits = 0, base = 10 ** digits) { return Math.round(base * number) / base; diff --git a/packages/@mantine/core/src/components/ColorSwatch/ColorSwatch.tsx b/packages/@mantine/core/src/components/ColorSwatch/ColorSwatch.tsx index 60b96c5f110..0352ed9c02c 100644 --- a/packages/@mantine/core/src/components/ColorSwatch/ColorSwatch.tsx +++ b/packages/@mantine/core/src/components/ColorSwatch/ColorSwatch.tsx @@ -2,15 +2,15 @@ import React from 'react'; import { Box, BoxProps, - MantineRadius, - StylesApiProps, + createVarsResolver, getRadius, + MantineRadius, polymorphicFactory, + PolymorphicFactory, rem, + StylesApiProps, useProps, useStyles, - createVarsResolver, - PolymorphicFactory, } from '../../core'; import classes from './ColorSwatch.module.css'; diff --git a/packages/@mantine/core/src/components/Combobox/Combobox.story.tsx b/packages/@mantine/core/src/components/Combobox/Combobox.story.tsx index 3771094b193..db11aaad650 100644 --- a/packages/@mantine/core/src/components/Combobox/Combobox.story.tsx +++ b/packages/@mantine/core/src/components/Combobox/Combobox.story.tsx @@ -1,8 +1,8 @@ /* eslint-disable no-console */ import React from 'react'; -import { TextInput } from '../TextInput'; import { Button } from '../Button'; import { ScrollArea } from '../ScrollArea'; +import { TextInput } from '../TextInput'; import { Combobox } from './Combobox'; import { useCombobox } from './use-combobox/use-combobox'; diff --git a/packages/@mantine/core/src/components/Combobox/Combobox.tsx b/packages/@mantine/core/src/components/Combobox/Combobox.tsx index ffecff5b231..5e8ea26daf8 100644 --- a/packages/@mantine/core/src/components/Combobox/Combobox.tsx +++ b/packages/@mantine/core/src/components/Combobox/Combobox.tsx @@ -1,33 +1,33 @@ import React from 'react'; import { - StylesApiProps, - useProps, - useStyles, - Factory, createVarsResolver, - MantineSize, + ExtendComponent, + Factory, getFontSize, - rem, getSize, - ExtendComponent, + MantineSize, MantineThemeComponent, + rem, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import { __PopoverProps, Popover } from '../Popover'; -import { useCombobox, ComboboxStore } from './use-combobox/use-combobox'; import { ComboboxProvider } from './Combobox.context'; -import { ComboboxTarget } from './ComboboxTarget/ComboboxTarget'; +import { ComboboxChevron } from './ComboboxChevron/ComboboxChevron'; +import { ComboboxClearButton } from './ComboboxClearButton/ComboboxClearButton'; import { ComboboxDropdown } from './ComboboxDropdown/ComboboxDropdown'; -import { ComboboxOptions } from './ComboboxOptions/ComboboxOptions'; -import { ComboboxOption, ComboboxOptionProps } from './ComboboxOption/ComboboxOption'; -import { ComboboxSearch } from './ComboboxSearch/ComboboxSearch'; +import { ComboboxDropdownTarget } from './ComboboxDropdownTarget/ComboboxDropdownTarget'; import { ComboboxEmpty } from './ComboboxEmpty/ComboboxEmpty'; -import { ComboboxChevron } from './ComboboxChevron/ComboboxChevron'; -import { ComboboxFooter } from './ComboboxFooter/ComboboxFooter'; -import { ComboboxHeader } from './ComboboxHeader/ComboboxHeader'; import { ComboboxEventsTarget } from './ComboboxEventsTarget/ComboboxEventsTarget'; -import { ComboboxDropdownTarget } from './ComboboxDropdownTarget/ComboboxDropdownTarget'; +import { ComboboxFooter } from './ComboboxFooter/ComboboxFooter'; import { ComboboxGroup } from './ComboboxGroup/ComboboxGroup'; -import { ComboboxClearButton } from './ComboboxClearButton/ComboboxClearButton'; +import { ComboboxHeader } from './ComboboxHeader/ComboboxHeader'; +import { ComboboxOption, ComboboxOptionProps } from './ComboboxOption/ComboboxOption'; +import { ComboboxOptions } from './ComboboxOptions/ComboboxOptions'; +import { ComboboxSearch } from './ComboboxSearch/ComboboxSearch'; +import { ComboboxTarget } from './ComboboxTarget/ComboboxTarget'; +import { ComboboxStore, useCombobox } from './use-combobox/use-combobox'; import classes from './Combobox.module.css'; export type ComboboxStylesNames = diff --git a/packages/@mantine/core/src/components/Combobox/Combobox.virtualized.story.tsx b/packages/@mantine/core/src/components/Combobox/Combobox.virtualized.story.tsx index c8586da9c74..c765dcfcf60 100644 --- a/packages/@mantine/core/src/components/Combobox/Combobox.virtualized.story.tsx +++ b/packages/@mantine/core/src/components/Combobox/Combobox.virtualized.story.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { Virtuoso } from 'react-virtuoso'; -import { Combobox } from './Combobox'; -import { TextInput } from '../TextInput'; import { ScrollArea } from '../ScrollArea'; +import { TextInput } from '../TextInput'; +import { Combobox } from './Combobox'; import { useVirtualizedCombobox } from './use-combobox/use-virtualized-combobox'; export default { title: 'Combobox' }; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxChevron/ComboboxChevron.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxChevron/ComboboxChevron.tsx index c3e51fb91a8..c693e5fbc69 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxChevron/ComboboxChevron.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxChevron/ComboboxChevron.tsx @@ -1,15 +1,15 @@ import React from 'react'; import { - MantineSize, Box, BoxProps, + createVarsResolver, ElementProps, - getSize, - useProps, Factory, factory, - createVarsResolver, + getSize, + MantineSize, StylesApiProps, + useProps, useStyles, } from '../../../core'; import classes from '../Combobox.module.css'; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxClearButton/ComboboxClearButton.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxClearButton/ComboboxClearButton.tsx index f15968a903d..48776ddf2ac 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxClearButton/ComboboxClearButton.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxClearButton/ComboboxClearButton.tsx @@ -1,6 +1,6 @@ import React, { forwardRef } from 'react'; -import { CloseButton, __CloseButtonProps } from '../../CloseButton'; import { ElementProps, MantineSize } from '../../../core'; +import { __CloseButtonProps, CloseButton } from '../../CloseButton'; export interface ComboboxClearButtonProps extends __CloseButtonProps, ElementProps<'button'> { size?: MantineSize | (string & {}) | number; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxDropdown/ComboboxDropdown.test.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxDropdown/ComboboxDropdown.test.tsx index fc16bc34db2..ad6f74146ef 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxDropdown/ComboboxDropdown.test.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxDropdown/ComboboxDropdown.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, createContextContainer } from '@mantine-tests/core'; +import { createContextContainer, render, tests } from '@mantine-tests/core'; import { Combobox } from '../Combobox'; import { ComboboxDropdown, diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxDropdown/ComboboxDropdown.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxDropdown/ComboboxDropdown.tsx index 7b043dd2bed..45352d28a9b 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxDropdown/ComboboxDropdown.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxDropdown/ComboboxDropdown.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { factory, useProps, Factory } from '../../../core'; +import { factory, Factory, useProps } from '../../../core'; import { Popover, PopoverDropdownProps } from '../../Popover'; import { useComboboxContext } from '../Combobox.context'; import classes from '../Combobox.module.css'; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxDropdownTarget/ComboboxDropdownTarget.test.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxDropdownTarget/ComboboxDropdownTarget.test.tsx index 4c772b7a63d..3957a6667d7 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxDropdownTarget/ComboboxDropdownTarget.test.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxDropdownTarget/ComboboxDropdownTarget.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, patchConsoleError, createContextContainer } from '@mantine-tests/core'; +import { createContextContainer, patchConsoleError, render, tests } from '@mantine-tests/core'; import { Combobox } from '../Combobox'; import { ComboboxDropdownTarget, ComboboxDropdownTargetProps } from './ComboboxDropdownTarget'; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxDropdownTarget/ComboboxDropdownTarget.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxDropdownTarget/ComboboxDropdownTarget.tsx index b2c3a45413e..8868aff6b7d 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxDropdownTarget/ComboboxDropdownTarget.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxDropdownTarget/ComboboxDropdownTarget.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { factory, Factory, isElement, useProps } from '../../../core'; import { Popover } from '../../Popover'; -import { isElement, useProps, factory, Factory } from '../../../core'; import { useComboboxContext } from '../Combobox.context'; export interface ComboboxDropdownTargetProps { diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxEmpty/ComboboxEmpty.test.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxEmpty/ComboboxEmpty.test.tsx index 050c3ac0fee..61026902937 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxEmpty/ComboboxEmpty.test.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxEmpty/ComboboxEmpty.test.tsx @@ -1,4 +1,4 @@ -import { tests, createContextContainer } from '@mantine-tests/core'; +import { createContextContainer, tests } from '@mantine-tests/core'; import { Combobox } from '../Combobox'; import { ComboboxEmpty, ComboboxEmptyProps, ComboboxEmptyStylesNames } from './ComboboxEmpty'; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxEmpty/ComboboxEmpty.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxEmpty/ComboboxEmpty.tsx index 3f182c44cc9..5499cdc29c3 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxEmpty/ComboboxEmpty.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxEmpty/ComboboxEmpty.tsx @@ -3,13 +3,13 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '../../../core'; -import classes from '../Combobox.module.css'; import { useComboboxContext } from '../Combobox.context'; +import classes from '../Combobox.module.css'; export type ComboboxEmptyStylesNames = 'empty'; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxEventsTarget/ComboboxEventsTarget.test.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxEventsTarget/ComboboxEventsTarget.test.tsx index eb7893f479b..17a042cd926 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxEventsTarget/ComboboxEventsTarget.test.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxEventsTarget/ComboboxEventsTarget.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, patchConsoleError, createContextContainer } from '@mantine-tests/core'; +import { createContextContainer, patchConsoleError, render, tests } from '@mantine-tests/core'; import { Combobox } from '../Combobox'; import { ComboboxEventsTarget, ComboboxEventsTargetProps } from './ComboboxEventsTarget'; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxEventsTarget/ComboboxEventsTarget.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxEventsTarget/ComboboxEventsTarget.tsx index 6871025bc84..54f09170c9b 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxEventsTarget/ComboboxEventsTarget.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxEventsTarget/ComboboxEventsTarget.tsx @@ -1,8 +1,8 @@ import React, { cloneElement } from 'react'; import { useMergedRef } from '@mantine/hooks'; -import { isElement, useProps, factory, Factory } from '../../../core'; -import { useComboboxTargetProps } from '../use-combobox-target-props/use-combobox-target-props'; +import { factory, Factory, isElement, useProps } from '../../../core'; import { useComboboxContext } from '../Combobox.context'; +import { useComboboxTargetProps } from '../use-combobox-target-props/use-combobox-target-props'; export interface ComboboxEventsTargetProps { /** Target element */ diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxFooter/ComboboxFooter.test.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxFooter/ComboboxFooter.test.tsx index 6a112d60808..ee6353bcf8c 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxFooter/ComboboxFooter.test.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxFooter/ComboboxFooter.test.tsx @@ -1,4 +1,4 @@ -import { tests, createContextContainer } from '@mantine-tests/core'; +import { createContextContainer, tests } from '@mantine-tests/core'; import { Combobox } from '../Combobox'; import { ComboboxFooter, ComboboxFooterProps, ComboboxFooterStylesNames } from './ComboboxFooter'; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxFooter/ComboboxFooter.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxFooter/ComboboxFooter.tsx index 5d961ded5df..98986d70da0 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxFooter/ComboboxFooter.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxFooter/ComboboxFooter.tsx @@ -3,10 +3,10 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '../../../core'; import { useComboboxContext } from '../Combobox.context'; import classes from '../Combobox.module.css'; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxGroup/ComboboxGroup.test.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxGroup/ComboboxGroup.test.tsx index d86e3d4a4b5..9da6535295c 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxGroup/ComboboxGroup.test.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxGroup/ComboboxGroup.test.tsx @@ -1,4 +1,4 @@ -import { tests, createContextContainer } from '@mantine-tests/core'; +import { createContextContainer, tests } from '@mantine-tests/core'; import { Combobox } from '../Combobox'; import { ComboboxGroup, ComboboxGroupProps, ComboboxGroupStylesNames } from './ComboboxGroup'; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxGroup/ComboboxGroup.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxGroup/ComboboxGroup.tsx index 454eccd6cef..4578e513623 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxGroup/ComboboxGroup.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxGroup/ComboboxGroup.tsx @@ -3,10 +3,10 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '../../../core'; import { useComboboxContext } from '../Combobox.context'; import classes from '../Combobox.module.css'; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxHeader/ComboboxHeader.test.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxHeader/ComboboxHeader.test.tsx index 5c86601a806..1ed46029140 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxHeader/ComboboxHeader.test.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxHeader/ComboboxHeader.test.tsx @@ -1,4 +1,4 @@ -import { tests, createContextContainer } from '@mantine-tests/core'; +import { createContextContainer, tests } from '@mantine-tests/core'; import { Combobox } from '../Combobox'; import { ComboboxHeader, ComboboxHeaderProps, ComboboxHeaderStylesNames } from './ComboboxHeader'; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxHeader/ComboboxHeader.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxHeader/ComboboxHeader.tsx index 4add2a42e41..24b377db140 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxHeader/ComboboxHeader.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxHeader/ComboboxHeader.tsx @@ -3,10 +3,10 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '../../../core'; import { useComboboxContext } from '../Combobox.context'; import classes from '../Combobox.module.css'; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxOption/ComboboxOption.test.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxOption/ComboboxOption.test.tsx index 343fd272d19..3160bcf8f33 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxOption/ComboboxOption.test.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxOption/ComboboxOption.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { tests, render, screen, userEvent, createContextContainer } from '@mantine-tests/core'; +import { createContextContainer, render, screen, tests, userEvent } from '@mantine-tests/core'; import { Combobox } from '../Combobox'; import { ComboboxOption, ComboboxOptionProps, ComboboxOptionStylesNames } from './ComboboxOption'; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxOption/ComboboxOption.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxOption/ComboboxOption.tsx index dbd0377d56d..7a35cbb33d7 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxOption/ComboboxOption.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxOption/ComboboxOption.tsx @@ -3,10 +3,10 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '../../../core'; import { useComboboxContext } from '../Combobox.context'; import classes from '../Combobox.module.css'; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxOptions/ComboboxOptions.test.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxOptions/ComboboxOptions.test.tsx index db94f371eb6..a085c18d084 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxOptions/ComboboxOptions.test.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxOptions/ComboboxOptions.test.tsx @@ -1,4 +1,4 @@ -import { tests, createContextContainer } from '@mantine-tests/core'; +import { createContextContainer, tests } from '@mantine-tests/core'; import { Combobox } from '../Combobox'; import { ComboboxOptions, diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxOptions/ComboboxOptions.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxOptions/ComboboxOptions.tsx index ebca0c71242..56c592ba468 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxOptions/ComboboxOptions.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxOptions/ComboboxOptions.tsx @@ -4,10 +4,10 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '../../../core'; import { useComboboxContext } from '../Combobox.context'; import classes from '../Combobox.module.css'; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxSearch/ComboboxSearch.test.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxSearch/ComboboxSearch.test.tsx index 09540a3a463..4b82ef5bd58 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxSearch/ComboboxSearch.test.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxSearch/ComboboxSearch.test.tsx @@ -1,4 +1,4 @@ -import { tests, createContextContainer } from '@mantine-tests/core'; +import { createContextContainer, tests } from '@mantine-tests/core'; import { Combobox } from '../Combobox'; import { ComboboxSearch, ComboboxSearchProps, ComboboxSearchStylesNames } from './ComboboxSearch'; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxSearch/ComboboxSearch.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxSearch/ComboboxSearch.tsx index 92928f70486..5ff26ea044d 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxSearch/ComboboxSearch.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxSearch/ComboboxSearch.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { useMergedRef } from '@mantine/hooks'; -import { factory, ElementProps, useProps, Factory } from '../../../core'; +import { ElementProps, factory, Factory, useProps } from '../../../core'; import { Input, InputProps, InputStylesNames } from '../../Input/Input'; import { useComboboxContext } from '../Combobox.context'; import { useComboboxTargetProps } from '../use-combobox-target-props/use-combobox-target-props'; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxTarget/ComboboxTarget.test.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxTarget/ComboboxTarget.test.tsx index c3ba3e9fe42..23a4786c538 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxTarget/ComboboxTarget.test.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxTarget/ComboboxTarget.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, patchConsoleError, createContextContainer } from '@mantine-tests/core'; +import { createContextContainer, patchConsoleError, render, tests } from '@mantine-tests/core'; import { Combobox } from '../Combobox'; import { ComboboxTarget, ComboboxTargetProps } from './ComboboxTarget'; diff --git a/packages/@mantine/core/src/components/Combobox/ComboboxTarget/ComboboxTarget.tsx b/packages/@mantine/core/src/components/Combobox/ComboboxTarget/ComboboxTarget.tsx index 507c6040b1e..658f5388ab7 100644 --- a/packages/@mantine/core/src/components/Combobox/ComboboxTarget/ComboboxTarget.tsx +++ b/packages/@mantine/core/src/components/Combobox/ComboboxTarget/ComboboxTarget.tsx @@ -1,7 +1,7 @@ import React, { cloneElement } from 'react'; import { useMergedRef } from '@mantine/hooks'; +import { factory, Factory, isElement, useProps } from '../../../core'; import { Popover } from '../../Popover'; -import { isElement, useProps, factory, Factory } from '../../../core'; import { useComboboxContext } from '../Combobox.context'; import { useComboboxTargetProps } from '../use-combobox-target-props/use-combobox-target-props'; diff --git a/packages/@mantine/core/src/components/Combobox/OptionsDropdown/OptionsDropdown.tsx b/packages/@mantine/core/src/components/Combobox/OptionsDropdown/OptionsDropdown.tsx index fae04f2072a..c9b6d1f0e9b 100644 --- a/packages/@mantine/core/src/components/Combobox/OptionsDropdown/OptionsDropdown.tsx +++ b/packages/@mantine/core/src/components/Combobox/OptionsDropdown/OptionsDropdown.tsx @@ -1,7 +1,7 @@ import React from 'react'; import cx from 'clsx'; -import { ScrollArea } from '../../ScrollArea/ScrollArea'; import { CheckIcon } from '../../Checkbox'; +import { ScrollArea } from '../../ScrollArea/ScrollArea'; import { Combobox } from '../Combobox'; import { ComboboxItem, ComboboxParsedItem } from '../Combobox.types'; import { defaultOptionsFilter, FilterOptionsInput } from './default-options-filter'; diff --git a/packages/@mantine/core/src/components/Combobox/get-options-lockup/get-options-lockup.ts b/packages/@mantine/core/src/components/Combobox/get-options-lockup/get-options-lockup.ts index cfc33a394d1..ff2f2f53696 100644 --- a/packages/@mantine/core/src/components/Combobox/get-options-lockup/get-options-lockup.ts +++ b/packages/@mantine/core/src/components/Combobox/get-options-lockup/get-options-lockup.ts @@ -1,4 +1,4 @@ -import { ComboboxParsedItem, ComboboxItem } from '../Combobox.types'; +import { ComboboxItem, ComboboxParsedItem } from '../Combobox.types'; export function getOptionsLockup(options: ComboboxParsedItem[]): Record { return options.reduce>((acc, item) => { diff --git a/packages/@mantine/core/src/components/Combobox/get-parsed-combobox-data/get-parsed-combobox-data.ts b/packages/@mantine/core/src/components/Combobox/get-parsed-combobox-data/get-parsed-combobox-data.ts index 22ab1057439..524dd847f31 100644 --- a/packages/@mantine/core/src/components/Combobox/get-parsed-combobox-data/get-parsed-combobox-data.ts +++ b/packages/@mantine/core/src/components/Combobox/get-parsed-combobox-data/get-parsed-combobox-data.ts @@ -1,8 +1,8 @@ import { ComboboxData, - ComboboxParsedItem, ComboboxItem, ComboboxItemGroup, + ComboboxParsedItem, ComboboxParsedItemGroup, } from '../Combobox.types'; diff --git a/packages/@mantine/core/src/components/Combobox/use-combobox/get-index/get-index.test.ts b/packages/@mantine/core/src/components/Combobox/use-combobox/get-index/get-index.test.ts index cffce1912ec..2dab5d3655d 100644 --- a/packages/@mantine/core/src/components/Combobox/use-combobox/get-index/get-index.test.ts +++ b/packages/@mantine/core/src/components/Combobox/use-combobox/get-index/get-index.test.ts @@ -1,4 +1,4 @@ -import { getNextIndex, getFirstIndex, getPreviousIndex } from './get-index'; +import { getFirstIndex, getNextIndex, getPreviousIndex } from './get-index'; function getElements(count: number = 5, disabledIndices: number[] = []) { return Array(count) diff --git a/packages/@mantine/core/src/components/Combobox/use-combobox/use-combobox.test.ts b/packages/@mantine/core/src/components/Combobox/use-combobox/use-combobox.test.ts index 80ce5c788c7..ef3bb7c824d 100644 --- a/packages/@mantine/core/src/components/Combobox/use-combobox/use-combobox.test.ts +++ b/packages/@mantine/core/src/components/Combobox/use-combobox/use-combobox.test.ts @@ -1,4 +1,4 @@ -import { renderHook, act } from '@testing-library/react'; +import { act, renderHook } from '@testing-library/react'; import { useCombobox } from './use-combobox'; describe('@mantine/core/Combobox/use-combobox', () => { diff --git a/packages/@mantine/core/src/components/Combobox/use-combobox/use-combobox.ts b/packages/@mantine/core/src/components/Combobox/use-combobox/use-combobox.ts index 68d4f9826ad..63d7661c206 100644 --- a/packages/@mantine/core/src/components/Combobox/use-combobox/use-combobox.ts +++ b/packages/@mantine/core/src/components/Combobox/use-combobox/use-combobox.ts @@ -1,6 +1,6 @@ -import { useEffect, useRef, useCallback } from 'react'; +import { useCallback, useEffect, useRef } from 'react'; import { useUncontrolled } from '@mantine/hooks'; -import { getPreviousIndex, getNextIndex, getFirstIndex } from './get-index/get-index'; +import { getFirstIndex, getNextIndex, getPreviousIndex } from './get-index/get-index'; export type ComboboxDropdownEventSource = 'keyboard' | 'mouse' | 'unknown'; diff --git a/packages/@mantine/core/src/components/Combobox/use-combobox/use-virtualized-combobox.ts b/packages/@mantine/core/src/components/Combobox/use-combobox/use-virtualized-combobox.ts index b7e3f3b8252..840fd757b86 100644 --- a/packages/@mantine/core/src/components/Combobox/use-combobox/use-virtualized-combobox.ts +++ b/packages/@mantine/core/src/components/Combobox/use-combobox/use-virtualized-combobox.ts @@ -1,7 +1,7 @@ // WIP, not planned to be released in 7.0, maybe in 7.x import { useCallback, useEffect, useRef } from 'react'; import { useUncontrolled } from '@mantine/hooks'; -import { getPreviousIndex, getNextIndex, getFirstIndex } from './get-index/get-virtualized-index'; +import { getFirstIndex, getNextIndex, getPreviousIndex } from './get-index/get-virtualized-index'; import { ComboboxStore } from './use-combobox'; interface UseComboboxOptions { diff --git a/packages/@mantine/core/src/components/Container/Container.story.tsx b/packages/@mantine/core/src/components/Container/Container.story.tsx index ed549863a42..b2bc3c0c359 100644 --- a/packages/@mantine/core/src/components/Container/Container.story.tsx +++ b/packages/@mantine/core/src/components/Container/Container.story.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { createTheme, MantineThemeProvider, rem } from '../../core'; import { Container } from './Container'; -import { MantineThemeProvider, createTheme, rem } from '../../core'; const CONTAINER_SIZES: Record = { xxs: rem(200), diff --git a/packages/@mantine/core/src/components/Container/Container.tsx b/packages/@mantine/core/src/components/Container/Container.tsx index 58a81addbd3..e4b267dcae9 100644 --- a/packages/@mantine/core/src/components/Container/Container.tsx +++ b/packages/@mantine/core/src/components/Container/Container.tsx @@ -2,15 +2,15 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, + Factory, getSize, MantineSize, - Factory, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import classes from './Container.module.css'; diff --git a/packages/@mantine/core/src/components/Dialog/Dialog.story.tsx b/packages/@mantine/core/src/components/Dialog/Dialog.story.tsx index a1282dc9e11..0e2e716a0a8 100644 --- a/packages/@mantine/core/src/components/Dialog/Dialog.story.tsx +++ b/packages/@mantine/core/src/components/Dialog/Dialog.story.tsx @@ -1,6 +1,6 @@ import React from 'react'; +import { Button, Group, Text, TextInput } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { Group, Button, TextInput, Text } from '@mantine/core'; import { Dialog } from './Dialog'; export default { title: 'Dialog' }; diff --git a/packages/@mantine/core/src/components/Dialog/Dialog.test.tsx b/packages/@mantine/core/src/components/Dialog/Dialog.test.tsx index bd668b8b200..04abb31bf3e 100644 --- a/packages/@mantine/core/src/components/Dialog/Dialog.test.tsx +++ b/packages/@mantine/core/src/components/Dialog/Dialog.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, userEvent, screen } from '@mantine-tests/core'; +import { render, screen, tests, userEvent } from '@mantine-tests/core'; import { Dialog, DialogProps, DialogStylesNames } from './Dialog'; const defaultProps: DialogProps = { diff --git a/packages/@mantine/core/src/components/Dialog/Dialog.tsx b/packages/@mantine/core/src/components/Dialog/Dialog.tsx index 638aaeb0169..7531d720ff7 100644 --- a/packages/@mantine/core/src/components/Dialog/Dialog.tsx +++ b/packages/@mantine/core/src/components/Dialog/Dialog.tsx @@ -1,21 +1,21 @@ import React from 'react'; import { BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - MantineSize, getSize, + MantineSize, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import { Affix, AffixBaseProps } from '../Affix'; +import { CloseButton } from '../CloseButton'; import { Paper, PaperBaseProps } from '../Paper'; -import classes from './Dialog.module.css'; import { Transition, TransitionOverride } from '../Transition'; -import { CloseButton } from '../CloseButton'; +import classes from './Dialog.module.css'; export type DialogStylesNames = 'root' | 'closeButton'; export type DialogCssVariables = { diff --git a/packages/@mantine/core/src/components/Divider/Divider.tsx b/packages/@mantine/core/src/components/Divider/Divider.tsx index 824f3910f0a..e7b6c5cc699 100644 --- a/packages/@mantine/core/src/components/Divider/Divider.tsx +++ b/packages/@mantine/core/src/components/Divider/Divider.tsx @@ -2,17 +2,17 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - MantineColor, - getThemeColor, getSize, + getThemeColor, + MantineColor, MantineSize, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import classes from './Divider.module.css'; diff --git a/packages/@mantine/core/src/components/Drawer/Drawer.story.tsx b/packages/@mantine/core/src/components/Drawer/Drawer.story.tsx index 8fd6a9650b5..5a8f8ffa2d8 100644 --- a/packages/@mantine/core/src/components/Drawer/Drawer.story.tsx +++ b/packages/@mantine/core/src/components/Drawer/Drawer.story.tsx @@ -2,8 +2,8 @@ import React from 'react'; import { useDisclosure } from '@mantine/hooks'; import { Button } from '../Button'; import { ScrollArea } from '../ScrollArea'; -import { Drawer } from './Drawer'; import { Tabs } from '../Tabs'; +import { Drawer } from './Drawer'; export default { title: 'Drawer' }; diff --git a/packages/@mantine/core/src/components/Drawer/Drawer.tsx b/packages/@mantine/core/src/components/Drawer/Drawer.tsx index d28a78ac858..631da969f62 100644 --- a/packages/@mantine/core/src/components/Drawer/Drawer.tsx +++ b/packages/@mantine/core/src/components/Drawer/Drawer.tsx @@ -1,18 +1,18 @@ import React from 'react'; -import { factory, useProps, Factory, getDefaultZIndex } from '../../core'; -import { ModalBaseOverlayProps, ModalBaseCloseButtonProps } from '../ModalBase'; +import { factory, Factory, getDefaultZIndex, useProps } from '../../core'; +import { ModalBaseCloseButtonProps, ModalBaseOverlayProps } from '../ModalBase'; +import { DrawerBody } from './DrawerBody'; +import { DrawerCloseButton } from './DrawerCloseButton'; +import { DrawerContent } from './DrawerContent'; +import { DrawerHeader } from './DrawerHeader'; +import { DrawerOverlay } from './DrawerOverlay'; import { DrawerRoot, - DrawerRootProps, DrawerRootCssVariables, + DrawerRootProps, DrawerRootStylesNames, } from './DrawerRoot'; -import { DrawerBody } from './DrawerBody'; -import { DrawerCloseButton } from './DrawerCloseButton'; -import { DrawerOverlay } from './DrawerOverlay'; -import { DrawerContent } from './DrawerContent'; import { DrawerTitle } from './DrawerTitle'; -import { DrawerHeader } from './DrawerHeader'; import classes from './Drawer.module.css'; export type DrawerStylesNames = DrawerRootStylesNames; diff --git a/packages/@mantine/core/src/components/Drawer/DrawerBody.tsx b/packages/@mantine/core/src/components/Drawer/DrawerBody.tsx index 219b6066f17..592e74140ce 100644 --- a/packages/@mantine/core/src/components/Drawer/DrawerBody.tsx +++ b/packages/@mantine/core/src/components/Drawer/DrawerBody.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { CompoundStylesApiProps, factory, useProps, Factory } from '../../core'; +import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core'; import { ModalBaseBody, ModalBaseBodyProps } from '../ModalBase'; import { useDrawerContext } from './Drawer.context'; import classes from './Drawer.module.css'; diff --git a/packages/@mantine/core/src/components/Drawer/DrawerCloseButton.tsx b/packages/@mantine/core/src/components/Drawer/DrawerCloseButton.tsx index 580b5e3de7b..1480748db6e 100644 --- a/packages/@mantine/core/src/components/Drawer/DrawerCloseButton.tsx +++ b/packages/@mantine/core/src/components/Drawer/DrawerCloseButton.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { CompoundStylesApiProps, factory, useProps, Factory } from '../../core'; +import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core'; import { ModalBaseCloseButton, ModalBaseCloseButtonProps } from '../ModalBase'; import { useDrawerContext } from './Drawer.context'; import classes from './Drawer.module.css'; diff --git a/packages/@mantine/core/src/components/Drawer/DrawerContent.tsx b/packages/@mantine/core/src/components/Drawer/DrawerContent.tsx index ba733579834..bf1359f72a9 100644 --- a/packages/@mantine/core/src/components/Drawer/DrawerContent.tsx +++ b/packages/@mantine/core/src/components/Drawer/DrawerContent.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { CompoundStylesApiProps, factory, useProps, Factory } from '../../core'; +import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core'; import { ModalBaseContent, ModalBaseContentProps, NativeScrollArea } from '../ModalBase'; import { useDrawerContext } from './Drawer.context'; import classes from './Drawer.module.css'; diff --git a/packages/@mantine/core/src/components/Drawer/DrawerHeader.tsx b/packages/@mantine/core/src/components/Drawer/DrawerHeader.tsx index 088ecfeef23..b3458a699e0 100644 --- a/packages/@mantine/core/src/components/Drawer/DrawerHeader.tsx +++ b/packages/@mantine/core/src/components/Drawer/DrawerHeader.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { CompoundStylesApiProps, factory, useProps, Factory } from '../../core'; +import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core'; import { ModalBaseHeader, ModalBaseHeaderProps } from '../ModalBase'; import { useDrawerContext } from './Drawer.context'; import classes from './Drawer.module.css'; diff --git a/packages/@mantine/core/src/components/Drawer/DrawerOverlay.tsx b/packages/@mantine/core/src/components/Drawer/DrawerOverlay.tsx index d0b7e0fd587..073be40b5af 100644 --- a/packages/@mantine/core/src/components/Drawer/DrawerOverlay.tsx +++ b/packages/@mantine/core/src/components/Drawer/DrawerOverlay.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { CompoundStylesApiProps, factory, useProps, Factory } from '../../core'; +import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core'; import { ModalBaseOverlay, ModalBaseOverlayProps } from '../ModalBase'; import { useDrawerContext } from './Drawer.context'; import classes from './Drawer.module.css'; diff --git a/packages/@mantine/core/src/components/Drawer/DrawerRoot.tsx b/packages/@mantine/core/src/components/Drawer/DrawerRoot.tsx index b6696484955..7291a038585 100644 --- a/packages/@mantine/core/src/components/Drawer/DrawerRoot.tsx +++ b/packages/@mantine/core/src/components/Drawer/DrawerRoot.tsx @@ -1,19 +1,19 @@ import React from 'react'; import { - StylesApiProps, - factory, - useProps, - useStyles, createVarsResolver, + factory, Factory, getDefaultZIndex, getSize, - useDirection, MantineRadius, rem, + StylesApiProps, + useDirection, + useProps, + useStyles, } from '../../core'; +import { ModalBase, ModalBaseProps, ModalBaseStylesNames } from '../ModalBase'; import { MantineTransition } from '../Transition'; -import { ModalBaseProps, ModalBase, ModalBaseStylesNames } from '../ModalBase'; import { DrawerProvider, ScrollAreaComponent } from './Drawer.context'; import classes from './Drawer.module.css'; diff --git a/packages/@mantine/core/src/components/Drawer/DrawerTitle.tsx b/packages/@mantine/core/src/components/Drawer/DrawerTitle.tsx index e38a60c734d..0f18d03aa2f 100644 --- a/packages/@mantine/core/src/components/Drawer/DrawerTitle.tsx +++ b/packages/@mantine/core/src/components/Drawer/DrawerTitle.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { CompoundStylesApiProps, factory, useProps, Factory } from '../../core'; +import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core'; import { ModalBaseTitle, ModalBaseTitleProps } from '../ModalBase'; import { useDrawerContext } from './Drawer.context'; import classes from './Drawer.module.css'; diff --git a/packages/@mantine/core/src/components/Fieldset/Fieldset.story.tsx b/packages/@mantine/core/src/components/Fieldset/Fieldset.story.tsx index 5f2b017ede1..a4427965631 100644 --- a/packages/@mantine/core/src/components/Fieldset/Fieldset.story.tsx +++ b/packages/@mantine/core/src/components/Fieldset/Fieldset.story.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { Fieldset } from './Fieldset'; import { TextInput } from '../TextInput'; +import { Fieldset } from './Fieldset'; export default { title: 'Fieldset' }; diff --git a/packages/@mantine/core/src/components/Fieldset/Fieldset.test.tsx b/packages/@mantine/core/src/components/Fieldset/Fieldset.test.tsx index 82d36d15247..a5717440c5f 100644 --- a/packages/@mantine/core/src/components/Fieldset/Fieldset.test.tsx +++ b/packages/@mantine/core/src/components/Fieldset/Fieldset.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { Fieldset, FieldsetProps, FieldsetStylesNames } from './Fieldset'; const defaultProps: FieldsetProps = { diff --git a/packages/@mantine/core/src/components/Fieldset/Fieldset.tsx b/packages/@mantine/core/src/components/Fieldset/Fieldset.tsx index bbcde476f8a..f65be30a2ae 100644 --- a/packages/@mantine/core/src/components/Fieldset/Fieldset.tsx +++ b/packages/@mantine/core/src/components/Fieldset/Fieldset.tsx @@ -2,15 +2,15 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - MantineRadius, getRadius, + MantineRadius, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import classes from './Fieldset.module.css'; diff --git a/packages/@mantine/core/src/components/FileButton/FileButton.test.tsx b/packages/@mantine/core/src/components/FileButton/FileButton.test.tsx index 023da5eb422..215dbf28b8e 100644 --- a/packages/@mantine/core/src/components/FileButton/FileButton.test.tsx +++ b/packages/@mantine/core/src/components/FileButton/FileButton.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { tests, render } from '@mantine-tests/core'; +import { render, tests } from '@mantine-tests/core'; import { FileButton, FileButtonProps } from './FileButton'; const defaultProps: FileButtonProps = { diff --git a/packages/@mantine/core/src/components/FileButton/FileButton.tsx b/packages/@mantine/core/src/components/FileButton/FileButton.tsx index a72bcf0f65c..0150be68b1a 100644 --- a/packages/@mantine/core/src/components/FileButton/FileButton.tsx +++ b/packages/@mantine/core/src/components/FileButton/FileButton.tsx @@ -1,4 +1,4 @@ -import React, { useRef, forwardRef } from 'react'; +import React, { forwardRef, useRef } from 'react'; import { assignRef, useMergedRef } from '@mantine/hooks'; import { useProps } from '../../core'; diff --git a/packages/@mantine/core/src/components/FileInput/FileInput.test.tsx b/packages/@mantine/core/src/components/FileInput/FileInput.test.tsx index 53ccf580486..7eb30421b76 100644 --- a/packages/@mantine/core/src/components/FileInput/FileInput.test.tsx +++ b/packages/@mantine/core/src/components/FileInput/FileInput.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { tests, inputDefaultProps, inputStylesApiSelectors } from '@mantine-tests/core'; -import { FileInput, FileInputProps } from './FileInput'; +import { inputDefaultProps, inputStylesApiSelectors, tests } from '@mantine-tests/core'; import { __InputStylesNames } from '../Input'; +import { FileInput, FileInputProps } from './FileInput'; const defaultProps: FileInputProps = { ...inputDefaultProps, diff --git a/packages/@mantine/core/src/components/FileInput/FileInput.tsx b/packages/@mantine/core/src/components/FileInput/FileInput.tsx index 6d341576479..30c9f5a5a19 100644 --- a/packages/@mantine/core/src/components/FileInput/FileInput.tsx +++ b/packages/@mantine/core/src/components/FileInput/FileInput.tsx @@ -1,10 +1,10 @@ import React, { useEffect, useRef } from 'react'; import { useUncontrolled } from '@mantine/hooks'; -import { factory, ElementProps, useProps, Factory, BoxProps, StylesApiProps } from '../../core'; -import { __InputStylesNames, Input, InputVariant, __BaseInputProps } from '../Input'; -import { InputBase } from '../InputBase/InputBase'; +import { BoxProps, ElementProps, factory, Factory, StylesApiProps, useProps } from '../../core'; import { CloseButton } from '../CloseButton'; import { FileButton } from '../FileButton'; +import { __BaseInputProps, __InputStylesNames, Input, InputVariant } from '../Input'; +import { InputBase } from '../InputBase/InputBase'; export interface FileInputProps extends BoxProps, diff --git a/packages/@mantine/core/src/components/Flex/Flex.tsx b/packages/@mantine/core/src/components/Flex/Flex.tsx index b3554338577..5c4842a3251 100644 --- a/packages/@mantine/core/src/components/Flex/Flex.tsx +++ b/packages/@mantine/core/src/components/Flex/Flex.tsx @@ -2,19 +2,19 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, ElementProps, - useProps, - useStyles, + filterProps, InlineStyles, - useRandomClassName, - parseStyleProps, - StyleProp, MantineSize, - useMantineTheme, - filterProps, + parseStyleProps, polymorphicFactory, PolymorphicFactory, + StyleProp, + StylesApiProps, + useMantineTheme, + useProps, + useRandomClassName, + useStyles, } from '../../core'; import { FLEX_STYLE_PROPS_DATA } from './flex-props'; import classes from './Flex.module.css'; diff --git a/packages/@mantine/core/src/components/Floating/FloatingArrow/FloatingArrow.tsx b/packages/@mantine/core/src/components/Floating/FloatingArrow/FloatingArrow.tsx index 6b41ed55694..3e33ba6b047 100644 --- a/packages/@mantine/core/src/components/Floating/FloatingArrow/FloatingArrow.tsx +++ b/packages/@mantine/core/src/components/Floating/FloatingArrow/FloatingArrow.tsx @@ -1,7 +1,7 @@ import React, { forwardRef } from 'react'; import { useDirection } from '../../../core'; -import { getArrowPositionStyles } from './get-arrow-position-styles'; import { ArrowPosition, FloatingPosition } from '../types'; +import { getArrowPositionStyles } from './get-arrow-position-styles'; interface FloatingArrowProps extends React.ComponentPropsWithoutRef<'div'> { position: FloatingPosition; diff --git a/packages/@mantine/core/src/components/Floating/FloatingArrow/get-arrow-position-styles.ts b/packages/@mantine/core/src/components/Floating/FloatingArrow/get-arrow-position-styles.ts index 7bcfc1f36f0..130102664ab 100644 --- a/packages/@mantine/core/src/components/Floating/FloatingArrow/get-arrow-position-styles.ts +++ b/packages/@mantine/core/src/components/Floating/FloatingArrow/get-arrow-position-styles.ts @@ -1,5 +1,5 @@ import { rem } from '../../../core'; -import type { FloatingPosition, FloatingSide, FloatingPlacement, ArrowPosition } from '../types'; +import type { ArrowPosition, FloatingPlacement, FloatingPosition, FloatingSide } from '../types'; function horizontalSide( placement: FloatingPlacement | 'center', diff --git a/packages/@mantine/core/src/components/Floating/get-floating-position/get-floating-position.ts b/packages/@mantine/core/src/components/Floating/get-floating-position/get-floating-position.ts index 14a700b014b..6dea8422756 100644 --- a/packages/@mantine/core/src/components/Floating/get-floating-position/get-floating-position.ts +++ b/packages/@mantine/core/src/components/Floating/get-floating-position/get-floating-position.ts @@ -1,4 +1,4 @@ -import type { FloatingPosition, FloatingSide, FloatingPlacement } from '../types'; +import type { FloatingPlacement, FloatingPosition, FloatingSide } from '../types'; export function getFloatingPosition( dir: 'rtl' | 'ltr', diff --git a/packages/@mantine/core/src/components/Floating/use-delayed-hover.ts b/packages/@mantine/core/src/components/Floating/use-delayed-hover.ts index 1feb2bdb636..fe5df66a665 100644 --- a/packages/@mantine/core/src/components/Floating/use-delayed-hover.ts +++ b/packages/@mantine/core/src/components/Floating/use-delayed-hover.ts @@ -1,4 +1,4 @@ -import { useRef, useEffect } from 'react'; +import { useEffect, useRef } from 'react'; interface UseDelayedHoverInput { open: () => void; diff --git a/packages/@mantine/core/src/components/Floating/use-floating-auto-update.ts b/packages/@mantine/core/src/components/Floating/use-floating-auto-update.ts index b6c711d8a45..70ca3ed66fa 100644 --- a/packages/@mantine/core/src/components/Floating/use-floating-auto-update.ts +++ b/packages/@mantine/core/src/components/Floating/use-floating-auto-update.ts @@ -1,4 +1,4 @@ -import { useState, useEffect } from 'react'; +import { useEffect, useState } from 'react'; import { autoUpdate } from '@floating-ui/react'; import { useDidUpdate } from '@mantine/hooks'; import { FloatingPosition } from './types'; diff --git a/packages/@mantine/core/src/components/Grid/Grid.story.tsx b/packages/@mantine/core/src/components/Grid/Grid.story.tsx index bf2ec97f395..7846e0533cb 100644 --- a/packages/@mantine/core/src/components/Grid/Grid.story.tsx +++ b/packages/@mantine/core/src/components/Grid/Grid.story.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { MantineThemeProvider } from '../../core'; -import { Grid } from './Grid'; import { Button } from '../Button'; +import { Grid } from './Grid'; export default { title: 'Grid' }; diff --git a/packages/@mantine/core/src/components/Grid/Grid.tsx b/packages/@mantine/core/src/components/Grid/Grid.tsx index 39ecad6e43e..4c128119a40 100644 --- a/packages/@mantine/core/src/components/Grid/Grid.tsx +++ b/packages/@mantine/core/src/components/Grid/Grid.tsx @@ -2,19 +2,19 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - StyleProp, MantineSpacing, + StyleProp, + StylesApiProps, + useProps, useRandomClassName, + useStyles, } from '../../core'; -import { GridCol } from './GridCol/GridCol'; import { GridProvider } from './Grid.context'; +import { GridCol } from './GridCol/GridCol'; import { GridVariables } from './GridVariables'; import classes from './Grid.module.css'; diff --git a/packages/@mantine/core/src/components/Grid/GridCol/GridCol.test.tsx b/packages/@mantine/core/src/components/Grid/GridCol/GridCol.test.tsx index 46f06b0261c..121a9f32df8 100644 --- a/packages/@mantine/core/src/components/Grid/GridCol/GridCol.test.tsx +++ b/packages/@mantine/core/src/components/Grid/GridCol/GridCol.test.tsx @@ -1,6 +1,6 @@ -import { tests, createContextContainer } from '@mantine-tests/core'; -import { GridCol, GridColProps, GridColStylesNames } from './GridCol'; +import { createContextContainer, tests } from '@mantine-tests/core'; import { Grid } from '../Grid'; +import { GridCol, GridColProps, GridColStylesNames } from './GridCol'; const TestContainer = createContextContainer(GridCol, Grid, {}); diff --git a/packages/@mantine/core/src/components/Grid/GridCol/GridCol.tsx b/packages/@mantine/core/src/components/Grid/GridCol/GridCol.tsx index cf476f24cb3..6d20798b482 100644 --- a/packages/@mantine/core/src/components/Grid/GridCol/GridCol.tsx +++ b/packages/@mantine/core/src/components/Grid/GridCol/GridCol.tsx @@ -4,11 +4,11 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, StyleProp, + useProps, useRandomClassName, } from '../../../core'; import { useGridContext } from '../Grid.context'; diff --git a/packages/@mantine/core/src/components/Grid/GridCol/GridColVariables.tsx b/packages/@mantine/core/src/components/Grid/GridCol/GridColVariables.tsx index f3806cbec94..52e3843488c 100644 --- a/packages/@mantine/core/src/components/Grid/GridCol/GridColVariables.tsx +++ b/packages/@mantine/core/src/components/Grid/GridCol/GridColVariables.tsx @@ -1,15 +1,15 @@ import React from 'react'; import { + filterProps, + getBaseValue, getSortedBreakpoints, - useMantineTheme, + InlineStyles, keys, MantineBreakpoint, - filterProps, - InlineStyles, - getBaseValue, + useMantineTheme, } from '../../../core'; -import type { GridColProps, ColSpan } from './GridCol'; import { useGridContext } from '../Grid.context'; +import type { ColSpan, GridColProps } from './GridCol'; interface GridColVariablesProps { selector: string; diff --git a/packages/@mantine/core/src/components/Grid/GridVariables.tsx b/packages/@mantine/core/src/components/Grid/GridVariables.tsx index dba2992ba7e..3c287aa1169 100644 --- a/packages/@mantine/core/src/components/Grid/GridVariables.tsx +++ b/packages/@mantine/core/src/components/Grid/GridVariables.tsx @@ -1,13 +1,13 @@ import React from 'react'; import { + filterProps, + getBaseValue, getSortedBreakpoints, - useMantineTheme, - keys, getSpacing, - MantineBreakpoint, - filterProps, InlineStyles, - getBaseValue, + keys, + MantineBreakpoint, + useMantineTheme, } from '../../core'; import type { GridProps } from './Grid'; diff --git a/packages/@mantine/core/src/components/Group/Group.test.tsx b/packages/@mantine/core/src/components/Group/Group.test.tsx index ccce0478681..102e02f4864 100644 --- a/packages/@mantine/core/src/components/Group/Group.test.tsx +++ b/packages/@mantine/core/src/components/Group/Group.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { Group, GroupProps, GroupStylesNames } from './Group'; const defaultProps: GroupProps = {}; diff --git a/packages/@mantine/core/src/components/Group/Group.tsx b/packages/@mantine/core/src/components/Group/Group.tsx index 630a5f7aed3..2f99c57cf26 100644 --- a/packages/@mantine/core/src/components/Group/Group.tsx +++ b/packages/@mantine/core/src/components/Group/Group.tsx @@ -2,15 +2,15 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, + createVarsResolver, ElementProps, + factory, + Factory, + getSpacing, + MantineSpacing, + StylesApiProps, useProps, useStyles, - MantineSpacing, - getSpacing, - createVarsResolver, - Factory, } from '../../core'; import { filterFalsyChildren } from './filter-falsy-children/filter-falsy-children'; import classes from './Group.module.css'; diff --git a/packages/@mantine/core/src/components/Highlight/Highlight.tsx b/packages/@mantine/core/src/components/Highlight/Highlight.tsx index 9826f536378..a1c219641e8 100644 --- a/packages/@mantine/core/src/components/Highlight/Highlight.tsx +++ b/packages/@mantine/core/src/components/Highlight/Highlight.tsx @@ -1,13 +1,13 @@ import React from 'react'; import { - polymorphicFactory, - useProps, MantineColor, MantineTheme, + polymorphicFactory, PolymorphicFactory, + useProps, } from '../../core'; -import { Text, TextStylesNames, TextProps, TextVariant } from '../Text'; import { Mark } from '../Mark'; +import { Text, TextProps, TextStylesNames, TextVariant } from '../Text'; import { highlighter } from './highlighter/highlighter'; export interface HighlightProps extends Omit { diff --git a/packages/@mantine/core/src/components/HoverCard/HoverCard.story.tsx b/packages/@mantine/core/src/components/HoverCard/HoverCard.story.tsx index 1f48580094f..0c95fbde823 100644 --- a/packages/@mantine/core/src/components/HoverCard/HoverCard.story.tsx +++ b/packages/@mantine/core/src/components/HoverCard/HoverCard.story.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { Button } from '../Button'; +import { Switch } from '../Switch'; import { Tooltip } from '../Tooltip'; import { HoverCard } from './HoverCard'; -import { Switch } from '../Switch'; export default { title: 'HoverCard' }; diff --git a/packages/@mantine/core/src/components/HoverCard/HoverCard.test.tsx b/packages/@mantine/core/src/components/HoverCard/HoverCard.test.tsx index 5dd394b3afb..4b5f971cce8 100644 --- a/packages/@mantine/core/src/components/HoverCard/HoverCard.test.tsx +++ b/packages/@mantine/core/src/components/HoverCard/HoverCard.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { tests, render, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { HoverCard, HoverCardProps } from './HoverCard'; import { HoverCardDropdown } from './HoverCardDropdown/HoverCardDropdown'; import { HoverCardTarget } from './HoverCardTarget/HoverCardTarget'; diff --git a/packages/@mantine/core/src/components/HoverCard/HoverCard.tsx b/packages/@mantine/core/src/components/HoverCard/HoverCard.tsx index 10229e741f2..50b381b78cf 100644 --- a/packages/@mantine/core/src/components/HoverCard/HoverCard.tsx +++ b/packages/@mantine/core/src/components/HoverCard/HoverCard.tsx @@ -1,12 +1,12 @@ import React from 'react'; import { useDisclosure } from '@mantine/hooks'; -import { ExtendComponent, useProps, Factory } from '../../core'; +import { ExtendComponent, Factory, useProps } from '../../core'; import { useDelayedHover } from '../Floating'; import { Popover, PopoverProps, PopoverStylesNames } from '../Popover'; +import { PopoverCssVariables } from '../Popover/Popover'; import { HoverCardContextProvider } from './HoverCard.context'; import { HoverCardDropdown } from './HoverCardDropdown/HoverCardDropdown'; import { HoverCardTarget } from './HoverCardTarget/HoverCardTarget'; -import { PopoverCssVariables } from '../Popover/Popover'; export interface HoverCardProps extends Omit { variant?: string; diff --git a/packages/@mantine/core/src/components/HoverCard/HoverCardTarget/HoverCardTarget.test.tsx b/packages/@mantine/core/src/components/HoverCard/HoverCardTarget/HoverCardTarget.test.tsx index 2bfa1c2deb2..d39ba3b385c 100644 --- a/packages/@mantine/core/src/components/HoverCard/HoverCardTarget/HoverCardTarget.test.tsx +++ b/packages/@mantine/core/src/components/HoverCard/HoverCardTarget/HoverCardTarget.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { render, tests, patchConsoleError, createContextContainer } from '@mantine-tests/core'; -import { HoverCardTarget, HoverCardTargetProps } from './HoverCardTarget'; +import { createContextContainer, patchConsoleError, render, tests } from '@mantine-tests/core'; import { HoverCard } from '../HoverCard'; +import { HoverCardTarget, HoverCardTargetProps } from './HoverCardTarget'; const defaultProps: HoverCardTargetProps = { children:
test
, diff --git a/packages/@mantine/core/src/components/HoverCard/HoverCardTarget/HoverCardTarget.tsx b/packages/@mantine/core/src/components/HoverCard/HoverCardTarget/HoverCardTarget.tsx index 5718f9a9e2e..fb867020d50 100644 --- a/packages/@mantine/core/src/components/HoverCard/HoverCardTarget/HoverCardTarget.tsx +++ b/packages/@mantine/core/src/components/HoverCard/HoverCardTarget/HoverCardTarget.tsx @@ -1,5 +1,5 @@ import React, { cloneElement, forwardRef } from 'react'; -import { isElement, createEventHandler, useProps } from '../../../core'; +import { createEventHandler, isElement, useProps } from '../../../core'; import { Popover, PopoverTargetProps } from '../../Popover'; import { useHoverCardContext } from '../HoverCard.context'; diff --git a/packages/@mantine/core/src/components/Image/Image.story.tsx b/packages/@mantine/core/src/components/Image/Image.story.tsx index 4e23ae956a7..80fb06f9db2 100644 --- a/packages/@mantine/core/src/components/Image/Image.story.tsx +++ b/packages/@mantine/core/src/components/Image/Image.story.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { Image } from './Image'; import { Group } from '../Group'; +import { Image } from './Image'; export default { title: 'Image' }; diff --git a/packages/@mantine/core/src/components/Image/Image.test.tsx b/packages/@mantine/core/src/components/Image/Image.test.tsx index 159f2ee5258..15d95319364 100644 --- a/packages/@mantine/core/src/components/Image/Image.test.tsx +++ b/packages/@mantine/core/src/components/Image/Image.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { Image, ImageProps, ImageStylesNames } from './Image'; const defaultProps: ImageProps = {}; diff --git a/packages/@mantine/core/src/components/Image/Image.tsx b/packages/@mantine/core/src/components/Image/Image.tsx index b6f3746c8ae..7590b59f5df 100644 --- a/packages/@mantine/core/src/components/Image/Image.tsx +++ b/packages/@mantine/core/src/components/Image/Image.tsx @@ -2,14 +2,14 @@ import React, { useEffect, useState } from 'react'; import { Box, BoxProps, - StylesApiProps, + createVarsResolver, + getRadius, + MantineRadius, polymorphicFactory, + PolymorphicFactory, + StylesApiProps, useProps, useStyles, - createVarsResolver, - PolymorphicFactory, - MantineRadius, - getRadius, } from '../../core'; import classes from './Image.module.css'; diff --git a/packages/@mantine/core/src/components/Indicator/Indicator.story.tsx b/packages/@mantine/core/src/components/Indicator/Indicator.story.tsx index de647f72aaa..55efe85fceb 100644 --- a/packages/@mantine/core/src/components/Indicator/Indicator.story.tsx +++ b/packages/@mantine/core/src/components/Indicator/Indicator.story.tsx @@ -1,9 +1,9 @@ import React from 'react'; -import { Avatar } from '../Avatar'; import { Box } from '../../core'; +import { Avatar } from '../Avatar'; import { Group } from '../Group'; -import { Indicator } from './Indicator'; import { Text } from '../Text'; +import { Indicator } from './Indicator'; export default { title: 'Indicator' }; diff --git a/packages/@mantine/core/src/components/Indicator/Indicator.test.tsx b/packages/@mantine/core/src/components/Indicator/Indicator.test.tsx index db02acacbd2..1f59c0c5081 100644 --- a/packages/@mantine/core/src/components/Indicator/Indicator.test.tsx +++ b/packages/@mantine/core/src/components/Indicator/Indicator.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { Indicator, IndicatorProps, IndicatorStylesNames } from './Indicator'; const defaultProps: IndicatorProps = {}; diff --git a/packages/@mantine/core/src/components/Indicator/Indicator.tsx b/packages/@mantine/core/src/components/Indicator/Indicator.tsx index 303a03217ec..6bc457f971c 100644 --- a/packages/@mantine/core/src/components/Indicator/Indicator.tsx +++ b/packages/@mantine/core/src/components/Indicator/Indicator.tsx @@ -2,18 +2,18 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - MantineRadius, - MantineColor, + getRadius, getThemeColor, + MantineColor, + MantineRadius, rem, - getRadius, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import { getPositionVariables } from './get-position-variables/get-position-variables'; import { IndicatorPosition } from './Indicator.types'; diff --git a/packages/@mantine/core/src/components/Indicator/get-position-variables/get-position-variables.ts b/packages/@mantine/core/src/components/Indicator/get-position-variables/get-position-variables.ts index 4dedffc90ed..cfc90f8923f 100644 --- a/packages/@mantine/core/src/components/Indicator/get-position-variables/get-position-variables.ts +++ b/packages/@mantine/core/src/components/Indicator/get-position-variables/get-position-variables.ts @@ -1,6 +1,6 @@ import { rem } from '../../../core'; -import type { IndicatorPosition } from '../Indicator.types'; import type { IndicatorPositionVariables } from '../Indicator'; +import type { IndicatorPosition } from '../Indicator.types'; export function getPositionVariables(_position: IndicatorPosition = 'top-end', offset = 0) { const variables: Record = { diff --git a/packages/@mantine/core/src/components/InlineInput/InlineInput.tsx b/packages/@mantine/core/src/components/InlineInput/InlineInput.tsx index ff5b249afd4..d0db89a6588 100644 --- a/packages/@mantine/core/src/components/InlineInput/InlineInput.tsx +++ b/packages/@mantine/core/src/components/InlineInput/InlineInput.tsx @@ -2,13 +2,13 @@ import React, { forwardRef } from 'react'; import { Box, BoxProps, - useStyles, - StylesApiProps, ElementProps, - MantineSize, + Factory, getFontSize, getSize, - Factory, + MantineSize, + StylesApiProps, + useStyles, } from '../../core'; import { Input } from '../Input'; import classes from './InlineInput.module.css'; diff --git a/packages/@mantine/core/src/components/Input/Input.test.tsx b/packages/@mantine/core/src/components/Input/Input.test.tsx index 4a4458ba7d7..c0fd251008d 100644 --- a/packages/@mantine/core/src/components/Input/Input.test.tsx +++ b/packages/@mantine/core/src/components/Input/Input.test.tsx @@ -1,11 +1,11 @@ import React from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { Input, InputProps, InputStylesNames } from './Input'; -import { InputWrapper } from './InputWrapper/InputWrapper'; -import { InputLabel } from './InputLabel/InputLabel'; import { InputDescription } from './InputDescription/InputDescription'; import { InputError } from './InputError/InputError'; +import { InputLabel } from './InputLabel/InputLabel'; import { InputPlaceholder } from './InputPlaceholder/InputPlaceholder'; +import { InputWrapper } from './InputWrapper/InputWrapper'; const defaultProps: InputProps = { rightSection: 'right', diff --git a/packages/@mantine/core/src/components/Input/Input.tsx b/packages/@mantine/core/src/components/Input/Input.tsx index 6692a42e03a..fabc088421e 100644 --- a/packages/@mantine/core/src/components/Input/Input.tsx +++ b/packages/@mantine/core/src/components/Input/Input.tsx @@ -2,28 +2,28 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - polymorphicFactory, - useProps, - useStyles, - MantineRadius, - MantineSize, + createVarsResolver, extractStyleProps, - getSize, getFontSize, getRadius, - rem, - createVarsResolver, + getSize, + MantineRadius, + MantineSize, + polymorphicFactory, PolymorphicFactory, + rem, + StylesApiProps, + useProps, + useStyles, } from '../../core'; -import { useInputWrapperContext } from './InputWrapper.context'; -import { InputLabel } from './InputLabel/InputLabel'; -import { InputError } from './InputError/InputError'; import { InputDescription } from './InputDescription/InputDescription'; +import { InputError } from './InputError/InputError'; +import { InputLabel } from './InputLabel/InputLabel'; import { InputPlaceholder } from './InputPlaceholder/InputPlaceholder'; +import { useInputWrapperContext } from './InputWrapper.context'; import { - InputWrapper, __InputWrapperProps, + InputWrapper, InputWrapperStylesNames, } from './InputWrapper/InputWrapper'; import classes from './Input.module.css'; diff --git a/packages/@mantine/core/src/components/Input/InputDescription/InputDescription.tsx b/packages/@mantine/core/src/components/Input/InputDescription/InputDescription.tsx index e5f628574e7..7039486de34 100644 --- a/packages/@mantine/core/src/components/Input/InputDescription/InputDescription.tsx +++ b/packages/@mantine/core/src/components/Input/InputDescription/InputDescription.tsx @@ -2,16 +2,16 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, + createVarsResolver, ElementProps, - useProps, - useStyles, - MantineSize, + factory, + Factory, getFontSize, + MantineSize, rem, - createVarsResolver, - Factory, + StylesApiProps, + useProps, + useStyles, } from '../../../core'; import { useInputWrapperContext } from '../InputWrapper.context'; import classes from '../Input.module.css'; diff --git a/packages/@mantine/core/src/components/Input/InputError/InputError.tsx b/packages/@mantine/core/src/components/Input/InputError/InputError.tsx index 792e112a58c..6a072f08604 100644 --- a/packages/@mantine/core/src/components/Input/InputError/InputError.tsx +++ b/packages/@mantine/core/src/components/Input/InputError/InputError.tsx @@ -2,16 +2,16 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, + createVarsResolver, ElementProps, - useProps, - useStyles, - MantineSize, + factory, + Factory, getFontSize, + MantineSize, rem, - createVarsResolver, - Factory, + StylesApiProps, + useProps, + useStyles, } from '../../../core'; import { useInputWrapperContext } from '../InputWrapper.context'; import classes from '../Input.module.css'; diff --git a/packages/@mantine/core/src/components/Input/InputLabel/InputLabel.test.tsx b/packages/@mantine/core/src/components/Input/InputLabel/InputLabel.test.tsx index bda554a4bc3..f8ec4d0388d 100644 --- a/packages/@mantine/core/src/components/Input/InputLabel/InputLabel.test.tsx +++ b/packages/@mantine/core/src/components/Input/InputLabel/InputLabel.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, userEvent, screen } from '@mantine-tests/core'; +import { render, screen, tests, userEvent } from '@mantine-tests/core'; import { InputLabel, InputLabelProps, InputLabelStylesNames } from './InputLabel'; const defaultProps: InputLabelProps = { diff --git a/packages/@mantine/core/src/components/Input/InputLabel/InputLabel.tsx b/packages/@mantine/core/src/components/Input/InputLabel/InputLabel.tsx index e018091a5b3..bb38fe1054e 100644 --- a/packages/@mantine/core/src/components/Input/InputLabel/InputLabel.tsx +++ b/packages/@mantine/core/src/components/Input/InputLabel/InputLabel.tsx @@ -2,15 +2,15 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, + createVarsResolver, ElementProps, + factory, + Factory, + getFontSize, + MantineSize, + StylesApiProps, useProps, useStyles, - MantineSize, - getFontSize, - createVarsResolver, - Factory, } from '../../../core'; import { useInputWrapperContext } from '../InputWrapper.context'; import classes from '../Input.module.css'; diff --git a/packages/@mantine/core/src/components/Input/InputPlaceholder/InputPlaceholder.tsx b/packages/@mantine/core/src/components/Input/InputPlaceholder/InputPlaceholder.tsx index c99f5b1a517..96314fa9644 100644 --- a/packages/@mantine/core/src/components/Input/InputPlaceholder/InputPlaceholder.tsx +++ b/packages/@mantine/core/src/components/Input/InputPlaceholder/InputPlaceholder.tsx @@ -2,12 +2,12 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, + factory, + Factory, + StylesApiProps, useProps, useStyles, - Factory, } from '../../../core'; import classes from '../Input.module.css'; diff --git a/packages/@mantine/core/src/components/Input/InputWrapper.context.ts b/packages/@mantine/core/src/components/Input/InputWrapper.context.ts index 3a5400bf5ba..37fbf62dd91 100644 --- a/packages/@mantine/core/src/components/Input/InputWrapper.context.ts +++ b/packages/@mantine/core/src/components/Input/InputWrapper.context.ts @@ -1,4 +1,4 @@ -import { GetStylesApi, createOptionalContext } from '../../core'; +import { createOptionalContext, GetStylesApi } from '../../core'; import type { InputWrapperFactory } from './InputWrapper/InputWrapper'; interface InputWrapperContextValue { diff --git a/packages/@mantine/core/src/components/Input/InputWrapper/InputWrapper.test.tsx b/packages/@mantine/core/src/components/Input/InputWrapper/InputWrapper.test.tsx index ec48e686955..5827f52f325 100644 --- a/packages/@mantine/core/src/components/Input/InputWrapper/InputWrapper.test.tsx +++ b/packages/@mantine/core/src/components/Input/InputWrapper/InputWrapper.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, inputWrapperQueries } from '@mantine-tests/core'; +import { inputWrapperQueries, render, tests } from '@mantine-tests/core'; import { Input } from '../Input'; import { InputWrapper, InputWrapperProps, InputWrapperStylesNames } from './InputWrapper'; diff --git a/packages/@mantine/core/src/components/Input/InputWrapper/InputWrapper.tsx b/packages/@mantine/core/src/components/Input/InputWrapper/InputWrapper.tsx index b50ce88e196..37530a2c799 100644 --- a/packages/@mantine/core/src/components/Input/InputWrapper/InputWrapper.tsx +++ b/packages/@mantine/core/src/components/Input/InputWrapper/InputWrapper.tsx @@ -3,32 +3,32 @@ import { useId } from '@mantine/hooks'; import { Box, BoxProps, - StylesApiProps, - factory, + createVarsResolver, ElementProps, - useProps, - useStyles, - MantineSize, + factory, Factory, - createVarsResolver, getFontSize, + MantineSize, rem, + StylesApiProps, + useProps, + useStyles, } from '../../../core'; -import { - InputLabel, - InputLabelStylesNames, - InputLabelCssVariables, -} from '../InputLabel/InputLabel'; import { InputDescription, - InputDescriptionStylesNames, InputDescriptionCssVariables, + InputDescriptionStylesNames, } from '../InputDescription/InputDescription'; import { InputError, - InputErrorStylesNames, InputErrorCssVariables, + InputErrorStylesNames, } from '../InputError/InputError'; +import { + InputLabel, + InputLabelCssVariables, + InputLabelStylesNames, +} from '../InputLabel/InputLabel'; import { InputWrapperProvider } from '../InputWrapper.context'; import { getInputOffsets } from './get-input-offsets/get-input-offsets'; import classes from '../Input.module.css'; diff --git a/packages/@mantine/core/src/components/Input/use-input-props.ts b/packages/@mantine/core/src/components/Input/use-input-props.ts index ee4e8bffed4..a9f8b2b3705 100644 --- a/packages/@mantine/core/src/components/Input/use-input-props.ts +++ b/packages/@mantine/core/src/components/Input/use-input-props.ts @@ -1,4 +1,4 @@ -import { extractStyleProps, useProps, BoxProps, StylesApiProps } from '../../core'; +import { BoxProps, extractStyleProps, StylesApiProps, useProps } from '../../core'; import { __BaseInputProps } from './Input'; interface BaseProps diff --git a/packages/@mantine/core/src/components/InputBase/InputBase.test.tsx b/packages/@mantine/core/src/components/InputBase/InputBase.test.tsx index 0508d79b90f..ccfe719284b 100644 --- a/packages/@mantine/core/src/components/InputBase/InputBase.test.tsx +++ b/packages/@mantine/core/src/components/InputBase/InputBase.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { tests, inputDefaultProps, inputStylesApiSelectors } from '@mantine-tests/core'; -import { InputBase, InputBaseProps } from './InputBase'; +import { inputDefaultProps, inputStylesApiSelectors, tests } from '@mantine-tests/core'; import { __InputStylesNames } from '../Input'; +import { InputBase, InputBaseProps } from './InputBase'; const defaultProps: InputBaseProps = { ...inputDefaultProps, diff --git a/packages/@mantine/core/src/components/InputBase/InputBase.tsx b/packages/@mantine/core/src/components/InputBase/InputBase.tsx index 956b2aa1fa8..06238f041c8 100644 --- a/packages/@mantine/core/src/components/InputBase/InputBase.tsx +++ b/packages/@mantine/core/src/components/InputBase/InputBase.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { BoxProps, StylesApiProps, polymorphicFactory, PolymorphicFactory } from '../../core'; -import { __InputStylesNames, __BaseInputProps, InputVariant, useInputProps, Input } from '../Input'; +import { BoxProps, polymorphicFactory, PolymorphicFactory, StylesApiProps } from '../../core'; +import { __BaseInputProps, __InputStylesNames, Input, InputVariant, useInputProps } from '../Input'; export interface InputBaseProps extends BoxProps, diff --git a/packages/@mantine/core/src/components/JsonInput/JsonInput.test.tsx b/packages/@mantine/core/src/components/JsonInput/JsonInput.test.tsx index cfca09f9777..e58ad833dff 100644 --- a/packages/@mantine/core/src/components/JsonInput/JsonInput.test.tsx +++ b/packages/@mantine/core/src/components/JsonInput/JsonInput.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { tests, inputDefaultProps, inputStylesApiSelectors } from '@mantine-tests/core'; -import { JsonInput, JsonInputProps } from './JsonInput'; +import { inputDefaultProps, inputStylesApiSelectors, tests } from '@mantine-tests/core'; import { __InputStylesNames } from '../Input'; +import { JsonInput, JsonInputProps } from './JsonInput'; const defaultProps: JsonInputProps = { ...inputDefaultProps, diff --git a/packages/@mantine/core/src/components/JsonInput/JsonInput.tsx b/packages/@mantine/core/src/components/JsonInput/JsonInput.tsx index 8e8683c5993..d617417e7c9 100644 --- a/packages/@mantine/core/src/components/JsonInput/JsonInput.tsx +++ b/packages/@mantine/core/src/components/JsonInput/JsonInput.tsx @@ -1,9 +1,9 @@ import React, { useState } from 'react'; import { useUncontrolled } from '@mantine/hooks'; -import { factory, useProps, Factory } from '../../core'; +import { factory, Factory, useProps } from '../../core'; +import { __InputStylesNames } from '../Input'; import { InputBase } from '../InputBase'; import { Textarea, TextareaProps } from '../Textarea'; -import { __InputStylesNames } from '../Input'; import { validateJson } from './validate-json/validate-json'; export interface JsonInputProps extends Omit { diff --git a/packages/@mantine/core/src/components/Kbd/Kbd.tsx b/packages/@mantine/core/src/components/Kbd/Kbd.tsx index c3134c0eb74..4ecc376e234 100644 --- a/packages/@mantine/core/src/components/Kbd/Kbd.tsx +++ b/packages/@mantine/core/src/components/Kbd/Kbd.tsx @@ -2,15 +2,15 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, getSize, MantineSize, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import classes from './Kbd.module.css'; diff --git a/packages/@mantine/core/src/components/List/List.story.tsx b/packages/@mantine/core/src/components/List/List.story.tsx index b43b123f4c5..4ccde77c0a0 100644 --- a/packages/@mantine/core/src/components/List/List.story.tsx +++ b/packages/@mantine/core/src/components/List/List.story.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { ThemeIcon } from '@mantine/core'; import { IconCircleCheck, IconCircleDashed } from '@tabler/icons-react'; +import { ThemeIcon } from '@mantine/core'; import { List } from './List'; export default { title: 'List' }; diff --git a/packages/@mantine/core/src/components/List/List.test.tsx b/packages/@mantine/core/src/components/List/List.test.tsx index eebb0bc33cc..0ac321d5af8 100644 --- a/packages/@mantine/core/src/components/List/List.test.tsx +++ b/packages/@mantine/core/src/components/List/List.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { render, tests } from '@mantine-tests/core'; -import { ListItem } from './ListItem/ListItem'; import { List, ListProps, ListStylesNames } from './List'; +import { ListItem } from './ListItem/ListItem'; const defaultProps: ListProps = { children: [ diff --git a/packages/@mantine/core/src/components/List/List.tsx b/packages/@mantine/core/src/components/List/List.tsx index 84f808c6ab0..5ee17e3066d 100644 --- a/packages/@mantine/core/src/components/List/List.tsx +++ b/packages/@mantine/core/src/components/List/List.tsx @@ -2,21 +2,21 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - MantineSize, - MantineSpacing, getFontSize, getLineHeight, getSpacing, + MantineSize, + MantineSpacing, + StylesApiProps, + useProps, + useStyles, } from '../../core'; -import { ListItem, ListItemStylesNames } from './ListItem/ListItem'; import { ListProvider } from './List.context'; +import { ListItem, ListItemStylesNames } from './ListItem/ListItem'; import classes from './List.module.css'; export type ListStylesNames = 'root' | ListItemStylesNames; diff --git a/packages/@mantine/core/src/components/List/ListItem/ListItem.test.tsx b/packages/@mantine/core/src/components/List/ListItem/ListItem.test.tsx index 7832f7a2e74..b410ddfd68e 100644 --- a/packages/@mantine/core/src/components/List/ListItem/ListItem.test.tsx +++ b/packages/@mantine/core/src/components/List/ListItem/ListItem.test.tsx @@ -1,6 +1,6 @@ -import { tests, createContextContainer } from '@mantine-tests/core'; -import { ListItem, ListItemProps, ListItemStylesNames } from './ListItem'; +import { createContextContainer, tests } from '@mantine-tests/core'; import { List } from '../List'; +import { ListItem, ListItemProps, ListItemStylesNames } from './ListItem'; const TestContainer = createContextContainer(ListItem, List, {}); diff --git a/packages/@mantine/core/src/components/List/ListItem/ListItem.tsx b/packages/@mantine/core/src/components/List/ListItem/ListItem.tsx index 361757ae1d0..05837c81f7c 100644 --- a/packages/@mantine/core/src/components/List/ListItem/ListItem.tsx +++ b/packages/@mantine/core/src/components/List/ListItem/ListItem.tsx @@ -3,10 +3,10 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '../../../core'; import { useListContext } from '../List.context'; import classes from '../List.module.css'; diff --git a/packages/@mantine/core/src/components/Loader/Loader.story.tsx b/packages/@mantine/core/src/components/Loader/Loader.story.tsx index fb0d5ad3b7b..a644f967501 100644 --- a/packages/@mantine/core/src/components/Loader/Loader.story.tsx +++ b/packages/@mantine/core/src/components/Loader/Loader.story.tsx @@ -1,6 +1,6 @@ import React, { forwardRef } from 'react'; -import { MantineProvider, createTheme } from '@mantine/core'; -import { Loader, defaultLoaders } from './Loader'; +import { createTheme, MantineProvider } from '@mantine/core'; +import { defaultLoaders, Loader } from './Loader'; import { MantineLoaderComponent } from './Loader.types'; export default { title: 'Loader' }; diff --git a/packages/@mantine/core/src/components/Loader/Loader.test.tsx b/packages/@mantine/core/src/components/Loader/Loader.test.tsx index 87daa73eed1..f5b17e6570e 100644 --- a/packages/@mantine/core/src/components/Loader/Loader.test.tsx +++ b/packages/@mantine/core/src/components/Loader/Loader.test.tsx @@ -1,6 +1,6 @@ import React, { forwardRef } from 'react'; -import { tests, render } from '@mantine-tests/core'; -import { Loader, LoaderProps, LoaderStylesNames, defaultLoaders } from './Loader'; +import { render, tests } from '@mantine-tests/core'; +import { defaultLoaders, Loader, LoaderProps, LoaderStylesNames } from './Loader'; import { MantineLoaderComponent } from './Loader.types'; const customLoader: MantineLoaderComponent = forwardRef(() =>
); diff --git a/packages/@mantine/core/src/components/Loader/Loader.tsx b/packages/@mantine/core/src/components/Loader/Loader.tsx index 09df326646b..32f7b82813a 100644 --- a/packages/@mantine/core/src/components/Loader/Loader.tsx +++ b/packages/@mantine/core/src/components/Loader/Loader.tsx @@ -1,22 +1,22 @@ import React from 'react'; import { Box, - MantineSize, - MantineColor, BoxProps, - useProps, + createVarsResolver, + factory, + Factory, + getSize, getThemeColor, + MantineColor, + MantineSize, StylesApiProps, + useProps, useStyles, - factory, - getSize, - createVarsResolver, - Factory, } from '../../core'; +import type { MantineLoader, MantineLoadersRecord } from './Loader.types'; import { Bars } from './loaders/Bars'; -import { Oval } from './loaders/Oval'; import { Dots } from './loaders/Dots'; -import type { MantineLoader, MantineLoadersRecord } from './Loader.types'; +import { Oval } from './loaders/Oval'; import classes from './Loader.module.css'; export type LoaderStylesNames = 'root'; diff --git a/packages/@mantine/core/src/components/LoadingOverlay/LoadingOverlay.tsx b/packages/@mantine/core/src/components/LoadingOverlay/LoadingOverlay.tsx index 7c8ce7920ce..fc7c727c901 100644 --- a/packages/@mantine/core/src/components/LoadingOverlay/LoadingOverlay.tsx +++ b/packages/@mantine/core/src/components/LoadingOverlay/LoadingOverlay.tsx @@ -2,19 +2,19 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - useMantineTheme, getDefaultZIndex, + StylesApiProps, + useMantineTheme, + useProps, + useStyles, } from '../../core'; -import { Transition, TransitionOverride } from '../Transition'; import { Loader, LoaderProps } from '../Loader'; import { Overlay, OverlayProps } from '../Overlay'; +import { Transition, TransitionOverride } from '../Transition'; import classes from './LoadingOverlay.module.css'; export type LoadingOverlayStylesNames = 'root' | 'loader' | 'overlay'; diff --git a/packages/@mantine/core/src/components/Mark/Mark.tsx b/packages/@mantine/core/src/components/Mark/Mark.tsx index ec3fee93229..fd328d3a557 100644 --- a/packages/@mantine/core/src/components/Mark/Mark.tsx +++ b/packages/@mantine/core/src/components/Mark/Mark.tsx @@ -2,14 +2,14 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, + createVarsResolver, ElementProps, + factory, + Factory, + MantineColor, + StylesApiProps, useProps, useStyles, - MantineColor, - createVarsResolver, - Factory, } from '../../core'; import { getMarkColor } from './get-mark-color'; import classes from './Mark.module.css'; diff --git a/packages/@mantine/core/src/components/Menu/Menu.story.tsx b/packages/@mantine/core/src/components/Menu/Menu.story.tsx index 0af88d05058..2142818d9be 100644 --- a/packages/@mantine/core/src/components/Menu/Menu.story.tsx +++ b/packages/@mantine/core/src/components/Menu/Menu.story.tsx @@ -1,10 +1,10 @@ import React, { useState } from 'react'; -import { IconTable, IconSearch } from '@tabler/icons-react'; +import { IconSearch, IconTable } from '@tabler/icons-react'; import { useDisclosure } from '@mantine/hooks'; -import { Menu } from './Menu'; import { Button } from '../Button'; -import { Tooltip } from '../Tooltip'; import { Text } from '../Text'; +import { Tooltip } from '../Tooltip'; +import { Menu } from './Menu'; export default { title: 'Menu' }; diff --git a/packages/@mantine/core/src/components/Menu/Menu.test.tsx b/packages/@mantine/core/src/components/Menu/Menu.test.tsx index e27ee2fb35f..c977513b516 100644 --- a/packages/@mantine/core/src/components/Menu/Menu.test.tsx +++ b/packages/@mantine/core/src/components/Menu/Menu.test.tsx @@ -1,12 +1,12 @@ import React from 'react'; import { cleanup } from '@testing-library/react'; -import { tests, render, screen, userEvent } from '@mantine-tests/core'; +import { render, screen, tests, userEvent } from '@mantine-tests/core'; import { Menu, MenuProps } from './Menu'; -import { MenuItem } from './MenuItem/MenuItem'; +import { MenuDivider } from './MenuDivider/MenuDivider'; import { MenuDropdown } from './MenuDropdown/MenuDropdown'; -import { MenuTarget } from './MenuTarget/MenuTarget'; +import { MenuItem } from './MenuItem/MenuItem'; import { MenuLabel } from './MenuLabel/MenuLabel'; -import { MenuDivider } from './MenuDivider/MenuDivider'; +import { MenuTarget } from './MenuTarget/MenuTarget'; function TestContainer(props: MenuProps) { return ( diff --git a/packages/@mantine/core/src/components/Menu/Menu.tsx b/packages/@mantine/core/src/components/Menu/Menu.tsx index c3995abc333..00e297dae4c 100644 --- a/packages/@mantine/core/src/components/Menu/Menu.tsx +++ b/packages/@mantine/core/src/components/Menu/Menu.tsx @@ -1,23 +1,23 @@ import React from 'react'; import { useDidUpdate, useUncontrolled } from '@mantine/hooks'; import { + ExtendComponent, + Factory, getContextItemIndex, - useHovered, StylesApiProps, + useHovered, useProps, - Factory, - useStyles, useResolvedStylesApi, - ExtendComponent, + useStyles, } from '../../core'; import { useDelayedHover } from '../Floating'; -import { Popover, __PopoverProps, PopoverStylesNames } from '../Popover'; +import { __PopoverProps, Popover, PopoverStylesNames } from '../Popover'; +import { MenuContextProvider } from './Menu.context'; import { MenuDivider } from './MenuDivider/MenuDivider'; import { MenuDropdown } from './MenuDropdown/MenuDropdown'; import { MenuItem } from './MenuItem/MenuItem'; import { MenuLabel } from './MenuLabel/MenuLabel'; import { MenuTarget } from './MenuTarget/MenuTarget'; -import { MenuContextProvider } from './Menu.context'; import classes from './Menu.module.css'; export type MenuStylesNames = diff --git a/packages/@mantine/core/src/components/Menu/MenuDivider/MenuDivider.test.tsx b/packages/@mantine/core/src/components/Menu/MenuDivider/MenuDivider.test.tsx index 122af85a3db..ef981f16e6c 100644 --- a/packages/@mantine/core/src/components/Menu/MenuDivider/MenuDivider.test.tsx +++ b/packages/@mantine/core/src/components/Menu/MenuDivider/MenuDivider.test.tsx @@ -1,6 +1,6 @@ import { createContextContainer, tests } from '@mantine-tests/core'; -import { MenuDivider, MenuDividerProps, MenuDividerStylesNames } from './MenuDivider'; import { Menu } from '../Menu'; +import { MenuDivider, MenuDividerProps, MenuDividerStylesNames } from './MenuDivider'; const TestContainer = createContextContainer(MenuDivider, Menu, { opened: true }); diff --git a/packages/@mantine/core/src/components/Menu/MenuDivider/MenuDivider.tsx b/packages/@mantine/core/src/components/Menu/MenuDivider/MenuDivider.tsx index f0418b81a36..a7be8da2b73 100644 --- a/packages/@mantine/core/src/components/Menu/MenuDivider/MenuDivider.tsx +++ b/packages/@mantine/core/src/components/Menu/MenuDivider/MenuDivider.tsx @@ -3,13 +3,13 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '../../../core'; -import classes from '../Menu.module.css'; import { useMenuContext } from '../Menu.context'; +import classes from '../Menu.module.css'; export type MenuDividerStylesNames = 'divider'; diff --git a/packages/@mantine/core/src/components/Menu/MenuDropdown/MenuDropdown.test.tsx b/packages/@mantine/core/src/components/Menu/MenuDropdown/MenuDropdown.test.tsx index 21203c10008..d5ef82e2d24 100644 --- a/packages/@mantine/core/src/components/Menu/MenuDropdown/MenuDropdown.test.tsx +++ b/packages/@mantine/core/src/components/Menu/MenuDropdown/MenuDropdown.test.tsx @@ -1,6 +1,6 @@ import { createContextContainer, tests } from '@mantine-tests/core'; -import { MenuDropdown, MenuDropdownProps, MenuDropdownStylesNames } from './MenuDropdown'; import { Menu } from '../Menu'; +import { MenuDropdown, MenuDropdownProps, MenuDropdownStylesNames } from './MenuDropdown'; const TestContainer = createContextContainer(MenuDropdown, Menu, { opened: true, diff --git a/packages/@mantine/core/src/components/Menu/MenuDropdown/MenuDropdown.tsx b/packages/@mantine/core/src/components/Menu/MenuDropdown/MenuDropdown.tsx index 510e7d1d01b..fa97c7fcee7 100644 --- a/packages/@mantine/core/src/components/Menu/MenuDropdown/MenuDropdown.tsx +++ b/packages/@mantine/core/src/components/Menu/MenuDropdown/MenuDropdown.tsx @@ -4,15 +4,15 @@ import { useMergedRef } from '@mantine/hooks'; import { BoxProps, CompoundStylesApiProps, - factory, + createEventHandler, ElementProps, - useProps, + factory, Factory, - createEventHandler, + useProps, } from '../../../core'; import { Popover } from '../../Popover'; -import classes from '../Menu.module.css'; import { useMenuContext } from '../Menu.context'; +import classes from '../Menu.module.css'; export type MenuDropdownStylesNames = 'dropdown'; diff --git a/packages/@mantine/core/src/components/Menu/MenuItem/MenuItem.test.tsx b/packages/@mantine/core/src/components/Menu/MenuItem/MenuItem.test.tsx index 67b9a7c8f0a..07a1d6ccec6 100644 --- a/packages/@mantine/core/src/components/Menu/MenuItem/MenuItem.test.tsx +++ b/packages/@mantine/core/src/components/Menu/MenuItem/MenuItem.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { render, userEvent, screen, createContextContainer, tests } from '@mantine-tests/core'; -import { MenuItem, MenuItemProps, MenuItemStylesNames } from './MenuItem'; +import { createContextContainer, render, screen, tests, userEvent } from '@mantine-tests/core'; import { Menu } from '../Menu'; +import { MenuItem, MenuItemProps, MenuItemStylesNames } from './MenuItem'; const TestContainer = createContextContainer(MenuItem, Menu, { opened: true }); diff --git a/packages/@mantine/core/src/components/Menu/MenuItem/MenuItem.tsx b/packages/@mantine/core/src/components/Menu/MenuItem/MenuItem.tsx index 5e30f88553c..499bfcfe53b 100644 --- a/packages/@mantine/core/src/components/Menu/MenuItem/MenuItem.tsx +++ b/packages/@mantine/core/src/components/Menu/MenuItem/MenuItem.tsx @@ -3,15 +3,15 @@ import { useMergedRef } from '@mantine/hooks'; import { BoxProps, CompoundStylesApiProps, - polymorphicFactory, - useProps, - PolymorphicFactory, - MantineColor, createEventHandler, createScopedKeydownHandler, + MantineColor, + parseThemeColor, + polymorphicFactory, + PolymorphicFactory, useDirection, useMantineTheme, - parseThemeColor, + useProps, } from '../../../core'; import { UnstyledButton } from '../../UnstyledButton'; import { useMenuContext } from '../Menu.context'; diff --git a/packages/@mantine/core/src/components/Menu/MenuLabel/MenuLabel.test.tsx b/packages/@mantine/core/src/components/Menu/MenuLabel/MenuLabel.test.tsx index fc07a8fc5cf..fb5ae30e08f 100644 --- a/packages/@mantine/core/src/components/Menu/MenuLabel/MenuLabel.test.tsx +++ b/packages/@mantine/core/src/components/Menu/MenuLabel/MenuLabel.test.tsx @@ -1,6 +1,6 @@ import { createContextContainer, tests } from '@mantine-tests/core'; -import { MenuLabel, MenuLabelProps, MenuLabelStylesNames } from './MenuLabel'; import { Menu } from '../Menu'; +import { MenuLabel, MenuLabelProps, MenuLabelStylesNames } from './MenuLabel'; const TestContainer = createContextContainer(MenuLabel, Menu, { opened: true }); diff --git a/packages/@mantine/core/src/components/Menu/MenuLabel/MenuLabel.tsx b/packages/@mantine/core/src/components/Menu/MenuLabel/MenuLabel.tsx index b470356720a..01307b0dabf 100644 --- a/packages/@mantine/core/src/components/Menu/MenuLabel/MenuLabel.tsx +++ b/packages/@mantine/core/src/components/Menu/MenuLabel/MenuLabel.tsx @@ -3,10 +3,10 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '../../../core'; import { useMenuContext } from '../Menu.context'; import classes from '../Menu.module.css'; diff --git a/packages/@mantine/core/src/components/Menu/MenuTarget/MenuTarget.test.tsx b/packages/@mantine/core/src/components/Menu/MenuTarget/MenuTarget.test.tsx index a31eb57cfb7..59cc46a41b4 100644 --- a/packages/@mantine/core/src/components/Menu/MenuTarget/MenuTarget.test.tsx +++ b/packages/@mantine/core/src/components/Menu/MenuTarget/MenuTarget.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { render, tests, patchConsoleError, createContextContainer } from '@mantine-tests/core'; -import { MenuTarget, MenuTargetProps } from './MenuTarget'; +import { createContextContainer, patchConsoleError, render, tests } from '@mantine-tests/core'; import { Menu } from '../Menu'; +import { MenuTarget, MenuTargetProps } from './MenuTarget'; const defaultProps: MenuTargetProps = { children:
test
, diff --git a/packages/@mantine/core/src/components/Menu/MenuTarget/MenuTarget.tsx b/packages/@mantine/core/src/components/Menu/MenuTarget/MenuTarget.tsx index 14c1b63ebeb..196a8fa4caa 100644 --- a/packages/@mantine/core/src/components/Menu/MenuTarget/MenuTarget.tsx +++ b/packages/@mantine/core/src/components/Menu/MenuTarget/MenuTarget.tsx @@ -1,7 +1,7 @@ import React, { cloneElement, forwardRef } from 'react'; -import { isElement, createEventHandler, useProps } from '../../../core'; -import { useMenuContext } from '../Menu.context'; +import { createEventHandler, isElement, useProps } from '../../../core'; import { Popover } from '../../Popover'; +import { useMenuContext } from '../Menu.context'; export interface MenuTargetProps { /** Target element */ diff --git a/packages/@mantine/core/src/components/Modal/Modal.story.tsx b/packages/@mantine/core/src/components/Modal/Modal.story.tsx index 3e2f05985aa..4da4a5c6482 100644 --- a/packages/@mantine/core/src/components/Modal/Modal.story.tsx +++ b/packages/@mantine/core/src/components/Modal/Modal.story.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { useDisclosure } from '@mantine/hooks'; import { Button } from '../Button'; -import { Tabs } from '../Tabs'; import { ScrollArea } from '../ScrollArea'; +import { Tabs } from '../Tabs'; import { Modal } from './Modal'; export default { title: 'Modal' }; diff --git a/packages/@mantine/core/src/components/Modal/Modal.tsx b/packages/@mantine/core/src/components/Modal/Modal.tsx index b0db7b51e31..02aa8bdb27b 100644 --- a/packages/@mantine/core/src/components/Modal/Modal.tsx +++ b/packages/@mantine/core/src/components/Modal/Modal.tsx @@ -1,18 +1,18 @@ import React from 'react'; -import { factory, useProps, Factory, getDefaultZIndex } from '../../core'; -import { ModalBaseOverlayProps, ModalBaseCloseButtonProps } from '../ModalBase'; +import { factory, Factory, getDefaultZIndex, useProps } from '../../core'; +import { ModalBaseCloseButtonProps, ModalBaseOverlayProps } from '../ModalBase'; +import { ModalBody } from './ModalBody'; +import { ModalCloseButton } from './ModalCloseButton'; +import { ModalContent } from './ModalContent'; +import { ModalHeader } from './ModalHeader'; +import { ModalOverlay } from './ModalOverlay'; import { ModalRoot, - ModalRootProps, ModalRootCssVariables, + ModalRootProps, ModalRootStylesNames, } from './ModalRoot'; -import { ModalBody } from './ModalBody'; -import { ModalCloseButton } from './ModalCloseButton'; -import { ModalOverlay } from './ModalOverlay'; -import { ModalContent } from './ModalContent'; import { ModalTitle } from './ModalTitle'; -import { ModalHeader } from './ModalHeader'; import classes from './Modal.module.css'; export type ModalStylesNames = ModalRootStylesNames; diff --git a/packages/@mantine/core/src/components/Modal/ModalBody.tsx b/packages/@mantine/core/src/components/Modal/ModalBody.tsx index 161e417659f..8cc15731925 100644 --- a/packages/@mantine/core/src/components/Modal/ModalBody.tsx +++ b/packages/@mantine/core/src/components/Modal/ModalBody.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { CompoundStylesApiProps, factory, useProps, Factory } from '../../core'; +import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core'; import { ModalBaseBody, ModalBaseBodyProps } from '../ModalBase'; import { useModalContext } from './Modal.context'; import classes from './Modal.module.css'; diff --git a/packages/@mantine/core/src/components/Modal/ModalCloseButton.tsx b/packages/@mantine/core/src/components/Modal/ModalCloseButton.tsx index 18c9945b0e9..ffea633be30 100644 --- a/packages/@mantine/core/src/components/Modal/ModalCloseButton.tsx +++ b/packages/@mantine/core/src/components/Modal/ModalCloseButton.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { CompoundStylesApiProps, factory, useProps, Factory } from '../../core'; +import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core'; import { ModalBaseCloseButton, ModalBaseCloseButtonProps } from '../ModalBase'; import { useModalContext } from './Modal.context'; import classes from './Modal.module.css'; diff --git a/packages/@mantine/core/src/components/Modal/ModalContent.tsx b/packages/@mantine/core/src/components/Modal/ModalContent.tsx index 18416e3fe66..3c84944c245 100644 --- a/packages/@mantine/core/src/components/Modal/ModalContent.tsx +++ b/packages/@mantine/core/src/components/Modal/ModalContent.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { CompoundStylesApiProps, factory, useProps, Factory, rem } from '../../core'; +import { CompoundStylesApiProps, factory, Factory, rem, useProps } from '../../core'; import { ModalBaseContent, ModalBaseContentProps, NativeScrollArea } from '../ModalBase'; import { useModalContext } from './Modal.context'; import classes from './Modal.module.css'; diff --git a/packages/@mantine/core/src/components/Modal/ModalHeader.tsx b/packages/@mantine/core/src/components/Modal/ModalHeader.tsx index dc350141e2e..231fcbf0cc7 100644 --- a/packages/@mantine/core/src/components/Modal/ModalHeader.tsx +++ b/packages/@mantine/core/src/components/Modal/ModalHeader.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { CompoundStylesApiProps, factory, useProps, Factory } from '../../core'; +import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core'; import { ModalBaseHeader, ModalBaseHeaderProps } from '../ModalBase'; import { useModalContext } from './Modal.context'; import classes from './Modal.module.css'; diff --git a/packages/@mantine/core/src/components/Modal/ModalOverlay.tsx b/packages/@mantine/core/src/components/Modal/ModalOverlay.tsx index 302af5bc145..5f92a12da78 100644 --- a/packages/@mantine/core/src/components/Modal/ModalOverlay.tsx +++ b/packages/@mantine/core/src/components/Modal/ModalOverlay.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { CompoundStylesApiProps, factory, useProps, Factory } from '../../core'; +import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core'; import { ModalBaseOverlay, ModalBaseOverlayProps } from '../ModalBase'; import { useModalContext } from './Modal.context'; import classes from './Modal.module.css'; diff --git a/packages/@mantine/core/src/components/Modal/ModalRoot.tsx b/packages/@mantine/core/src/components/Modal/ModalRoot.tsx index a742b5c1c31..9493e28f513 100644 --- a/packages/@mantine/core/src/components/Modal/ModalRoot.tsx +++ b/packages/@mantine/core/src/components/Modal/ModalRoot.tsx @@ -1,18 +1,18 @@ import React from 'react'; import { - StylesApiProps, - factory, - useProps, - useStyles, createVarsResolver, + factory, Factory, - MantineRadius, - getRadius, getDefaultZIndex, + getRadius, getSize, + MantineRadius, rem, + StylesApiProps, + useProps, + useStyles, } from '../../core'; -import { ModalBaseProps, ModalBase, ModalBaseStylesNames } from '../ModalBase'; +import { ModalBase, ModalBaseProps, ModalBaseStylesNames } from '../ModalBase'; import { ModalProvider, ScrollAreaComponent } from './Modal.context'; import classes from './Modal.module.css'; diff --git a/packages/@mantine/core/src/components/Modal/ModalTitle.tsx b/packages/@mantine/core/src/components/Modal/ModalTitle.tsx index fe7d3abae92..eac0f6bbbdb 100644 --- a/packages/@mantine/core/src/components/Modal/ModalTitle.tsx +++ b/packages/@mantine/core/src/components/Modal/ModalTitle.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { CompoundStylesApiProps, factory, useProps, Factory } from '../../core'; +import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core'; import { ModalBaseTitle, ModalBaseTitleProps } from '../ModalBase'; import { useModalContext } from './Modal.context'; import classes from './Modal.module.css'; diff --git a/packages/@mantine/core/src/components/ModalBase/ModalBase.story.tsx b/packages/@mantine/core/src/components/ModalBase/ModalBase.story.tsx index 953980d26e2..fe9ffda2ab8 100644 --- a/packages/@mantine/core/src/components/ModalBase/ModalBase.story.tsx +++ b/packages/@mantine/core/src/components/ModalBase/ModalBase.story.tsx @@ -1,5 +1,6 @@ import React from 'react'; import { useDisclosure } from '@mantine/hooks'; +import { Button } from '../Button'; import { ModalBase } from './ModalBase'; import { ModalBaseBody } from './ModalBaseBody'; import { ModalBaseCloseButton } from './ModalBaseCloseButton'; @@ -7,7 +8,6 @@ import { ModalBaseContent } from './ModalBaseContent'; import { ModalBaseHeader } from './ModalBaseHeader'; import { ModalBaseOverlay } from './ModalBaseOverlay'; import { ModalBaseTitle } from './ModalBaseTitle'; -import { Button } from '../Button'; export default { title: 'ModalBase' }; diff --git a/packages/@mantine/core/src/components/ModalBase/ModalBase.tsx b/packages/@mantine/core/src/components/ModalBase/ModalBase.tsx index 0dc3f0673aa..5b8793db662 100644 --- a/packages/@mantine/core/src/components/ModalBase/ModalBase.tsx +++ b/packages/@mantine/core/src/components/ModalBase/ModalBase.tsx @@ -4,12 +4,12 @@ import { Box, BoxProps, ElementProps, - MantineShadow, - MantineSize, - MantineSpacing, getDefaultZIndex, getShadow, getSpacing, + MantineShadow, + MantineSize, + MantineSpacing, } from '../../core'; import { OptionalPortal, PortalProps } from '../Portal'; import { TransitionOverride } from '../Transition'; diff --git a/packages/@mantine/core/src/components/ModalBase/ModalBaseBody.tsx b/packages/@mantine/core/src/components/ModalBase/ModalBaseBody.tsx index 89575cd4ac2..120e88aaad0 100644 --- a/packages/@mantine/core/src/components/ModalBase/ModalBaseBody.tsx +++ b/packages/@mantine/core/src/components/ModalBase/ModalBaseBody.tsx @@ -1,9 +1,9 @@ import React, { forwardRef } from 'react'; import cx from 'clsx'; import { Box, BoxProps, ElementProps } from '../../core'; +import { useModalBaseContext } from './ModalBase.context'; import { useModalBodyId } from './use-modal-body-id'; import classes from './ModalBase.module.css'; -import { useModalBaseContext } from './ModalBase.context'; export interface ModalBaseBodyProps extends BoxProps, ElementProps<'div'> {} diff --git a/packages/@mantine/core/src/components/ModalBase/ModalBaseCloseButton.tsx b/packages/@mantine/core/src/components/ModalBase/ModalBaseCloseButton.tsx index 992e35588ea..b42336a5c6f 100644 --- a/packages/@mantine/core/src/components/ModalBase/ModalBaseCloseButton.tsx +++ b/packages/@mantine/core/src/components/ModalBase/ModalBaseCloseButton.tsx @@ -1,7 +1,7 @@ import React, { forwardRef } from 'react'; import cx from 'clsx'; import { BoxProps, ElementProps } from '../../core'; -import { CloseButton, __CloseButtonProps } from '../CloseButton'; +import { __CloseButtonProps, CloseButton } from '../CloseButton'; import { useModalBaseContext } from './ModalBase.context'; import classes from './ModalBase.module.css'; diff --git a/packages/@mantine/core/src/components/ModalBase/ModalBaseContent.tsx b/packages/@mantine/core/src/components/ModalBase/ModalBaseContent.tsx index 63a822f5c01..b4acce0af45 100644 --- a/packages/@mantine/core/src/components/ModalBase/ModalBaseContent.tsx +++ b/packages/@mantine/core/src/components/ModalBase/ModalBaseContent.tsx @@ -1,9 +1,9 @@ import React, { forwardRef } from 'react'; import cx from 'clsx'; import { BoxProps, ElementProps, MantineRadius, MantineShadow } from '../../core'; -import { Transition, TransitionOverride } from '../Transition'; import { FocusTrap } from '../FocusTrap'; import { Paper } from '../Paper'; +import { Transition, TransitionOverride } from '../Transition'; import { useModalBaseContext } from './ModalBase.context'; import classes from './ModalBase.module.css'; diff --git a/packages/@mantine/core/src/components/ModalBase/ModalBaseHeader.tsx b/packages/@mantine/core/src/components/ModalBase/ModalBaseHeader.tsx index 6d131abb333..28fb4fe09a4 100644 --- a/packages/@mantine/core/src/components/ModalBase/ModalBaseHeader.tsx +++ b/packages/@mantine/core/src/components/ModalBase/ModalBaseHeader.tsx @@ -1,8 +1,8 @@ import React, { forwardRef } from 'react'; import cx from 'clsx'; import { Box, BoxProps, ElementProps } from '../../core'; -import classes from './ModalBase.module.css'; import { useModalBaseContext } from './ModalBase.context'; +import classes from './ModalBase.module.css'; export interface ModalBaseHeaderProps extends BoxProps, ElementProps<'header'> {} diff --git a/packages/@mantine/core/src/components/ModalBase/ModalBaseOverlay.tsx b/packages/@mantine/core/src/components/ModalBase/ModalBaseOverlay.tsx index 05a6d90a293..16c3843be60 100644 --- a/packages/@mantine/core/src/components/ModalBase/ModalBaseOverlay.tsx +++ b/packages/@mantine/core/src/components/ModalBase/ModalBaseOverlay.tsx @@ -2,8 +2,8 @@ import React, { forwardRef } from 'react'; import { ElementProps } from '../../core'; import { Overlay, OverlayProps } from '../Overlay'; import { Transition, TransitionOverride } from '../Transition'; -import { useModalTransition } from './use-modal-transition'; import { useModalBaseContext } from './ModalBase.context'; +import { useModalTransition } from './use-modal-transition'; export interface ModalBaseOverlayProps extends Omit, diff --git a/packages/@mantine/core/src/components/ModalBase/ModalBaseTitle.tsx b/packages/@mantine/core/src/components/ModalBase/ModalBaseTitle.tsx index b430e7ffa89..b50145c711b 100644 --- a/packages/@mantine/core/src/components/ModalBase/ModalBaseTitle.tsx +++ b/packages/@mantine/core/src/components/ModalBase/ModalBaseTitle.tsx @@ -1,9 +1,9 @@ import React, { forwardRef } from 'react'; import cx from 'clsx'; import { Box, BoxProps, ElementProps } from '../../core'; +import { useModalBaseContext } from './ModalBase.context'; import { useModalTitle } from './use-modal-title-id'; import classes from './ModalBase.module.css'; -import { useModalBaseContext } from './ModalBase.context'; export interface ModalBaseTitleProps extends BoxProps, ElementProps<'h2'> {} diff --git a/packages/@mantine/core/src/components/ModalBase/use-lock-scroll.ts b/packages/@mantine/core/src/components/ModalBase/use-lock-scroll.ts index e018a5e91fc..32db3ba1224 100644 --- a/packages/@mantine/core/src/components/ModalBase/use-lock-scroll.ts +++ b/packages/@mantine/core/src/components/ModalBase/use-lock-scroll.ts @@ -1,4 +1,4 @@ -import { useState, useEffect, useRef } from 'react'; +import { useEffect, useRef, useState } from 'react'; import { useReducedMotion } from '@mantine/hooks'; interface UseScrollLock { diff --git a/packages/@mantine/core/src/components/ModalBase/use-modal.ts b/packages/@mantine/core/src/components/ModalBase/use-modal.ts index 11baff3355d..d4582b5b6ef 100644 --- a/packages/@mantine/core/src/components/ModalBase/use-modal.ts +++ b/packages/@mantine/core/src/components/ModalBase/use-modal.ts @@ -1,7 +1,7 @@ import { useState } from 'react'; -import { useId, useWindowEvent, useFocusReturn } from '@mantine/hooks'; -import { useLockScroll } from './use-lock-scroll'; +import { useFocusReturn, useId, useWindowEvent } from '@mantine/hooks'; import { TransitionOverride } from '../Transition'; +import { useLockScroll } from './use-lock-scroll'; interface UseModalInput { opened: boolean; diff --git a/packages/@mantine/core/src/components/MultiSelect/MultiSelect.test.tsx b/packages/@mantine/core/src/components/MultiSelect/MultiSelect.test.tsx index c08c6c78fbb..863c51141b0 100644 --- a/packages/@mantine/core/src/components/MultiSelect/MultiSelect.test.tsx +++ b/packages/@mantine/core/src/components/MultiSelect/MultiSelect.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { tests, inputDefaultProps, inputStylesApiSelectors } from '@mantine-tests/core'; +import { inputDefaultProps, inputStylesApiSelectors, tests } from '@mantine-tests/core'; import { MultiSelect, MultiSelectProps, MultiSelectStylesNames } from './MultiSelect'; const defaultProps: MultiSelectProps = { diff --git a/packages/@mantine/core/src/components/MultiSelect/MultiSelect.tsx b/packages/@mantine/core/src/components/MultiSelect/MultiSelect.tsx index c3a23c8e654..7adc1d257a3 100644 --- a/packages/@mantine/core/src/components/MultiSelect/MultiSelect.tsx +++ b/packages/@mantine/core/src/components/MultiSelect/MultiSelect.tsx @@ -2,29 +2,29 @@ import React, { useEffect } from 'react'; import { useId, useUncontrolled } from '@mantine/hooks'; import { BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, - Factory, extractStyleProps, - useStyles, + factory, + Factory, + StylesApiProps, + useProps, useResolvedStylesApi, + useStyles, } from '../../core'; +import { __CloseButtonProps } from '../CloseButton'; import { Combobox, - OptionsDropdown, - useCombobox, - getParsedComboboxData, - getOptionsLockup, ComboboxLikeProps, ComboboxLikeStylesNames, + getOptionsLockup, + getParsedComboboxData, + OptionsDropdown, + useCombobox, } from '../Combobox'; import { __BaseInputProps, __InputStylesNames } from '../Input'; -import { PillsInput } from '../PillsInput'; -import { Pill } from '../Pill'; import { InputBase } from '../InputBase'; -import { __CloseButtonProps } from '../CloseButton'; +import { Pill } from '../Pill'; +import { PillsInput } from '../PillsInput'; import { filterPickedValues } from './filter-picked-values'; export type MultiSelectStylesNames = diff --git a/packages/@mantine/core/src/components/MultiSelect/MutliSelect.story.tsx b/packages/@mantine/core/src/components/MultiSelect/MutliSelect.story.tsx index e113a801533..75f982346ef 100644 --- a/packages/@mantine/core/src/components/MultiSelect/MutliSelect.story.tsx +++ b/packages/@mantine/core/src/components/MultiSelect/MutliSelect.story.tsx @@ -1,8 +1,8 @@ import React, { useState } from 'react'; -import { MultiSelect } from './MultiSelect'; import { Button } from '../Button'; import { Group } from '../Group'; import { TextInput } from '../TextInput'; +import { MultiSelect } from './MultiSelect'; export default { title: 'MultiSelect' }; diff --git a/packages/@mantine/core/src/components/NativeSelect/NativeSelect.story.tsx b/packages/@mantine/core/src/components/NativeSelect/NativeSelect.story.tsx index 07fd699f05a..302f5123174 100644 --- a/packages/@mantine/core/src/components/NativeSelect/NativeSelect.story.tsx +++ b/packages/@mantine/core/src/components/NativeSelect/NativeSelect.story.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { NativeSelect } from './NativeSelect'; -import { TextInput } from '../TextInput'; import { rem } from '../../core'; +import { TextInput } from '../TextInput'; +import { NativeSelect } from './NativeSelect'; export default { title: 'NativeSelect' }; diff --git a/packages/@mantine/core/src/components/NativeSelect/NativeSelect.test.tsx b/packages/@mantine/core/src/components/NativeSelect/NativeSelect.test.tsx index 647badff1e7..06020295cd9 100644 --- a/packages/@mantine/core/src/components/NativeSelect/NativeSelect.test.tsx +++ b/packages/@mantine/core/src/components/NativeSelect/NativeSelect.test.tsx @@ -1,13 +1,13 @@ import React from 'react'; import { - tests, inputDefaultProps, inputStylesApiSelectors, render, + tests, userEvent, } from '@mantine-tests/core'; -import { NativeSelect, NativeSelectProps } from './NativeSelect'; import { __InputStylesNames } from '../Input'; +import { NativeSelect, NativeSelectProps } from './NativeSelect'; const defaultProps: NativeSelectProps = { ...inputDefaultProps, diff --git a/packages/@mantine/core/src/components/NativeSelect/NativeSelect.tsx b/packages/@mantine/core/src/components/NativeSelect/NativeSelect.tsx index e8d65e56bbf..24f0e248926 100644 --- a/packages/@mantine/core/src/components/NativeSelect/NativeSelect.tsx +++ b/packages/@mantine/core/src/components/NativeSelect/NativeSelect.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import { factory, ElementProps, useProps, Factory, BoxProps, StylesApiProps } from '../../core'; +import { BoxProps, ElementProps, factory, Factory, StylesApiProps, useProps } from '../../core'; +import { ComboboxChevron, ComboboxData, getParsedComboboxData } from '../Combobox'; +import { __BaseInputProps, __InputStylesNames } from '../Input'; import { InputBase } from '../InputBase'; -import { __InputStylesNames, __BaseInputProps } from '../Input'; -import { ComboboxData, getParsedComboboxData, ComboboxChevron } from '../Combobox'; import { NativeSelectOption } from './NativeSelectOption'; export interface NativeSelectProps diff --git a/packages/@mantine/core/src/components/NavLink/NavLink.story.tsx b/packages/@mantine/core/src/components/NavLink/NavLink.story.tsx index 1032a0ed13b..25c6213cd48 100644 --- a/packages/@mantine/core/src/components/NavLink/NavLink.story.tsx +++ b/packages/@mantine/core/src/components/NavLink/NavLink.story.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { IconHome2, IconChevronRight } from '@tabler/icons-react'; +import { IconChevronRight, IconHome2 } from '@tabler/icons-react'; import { useCounter } from '@mantine/hooks'; import { Button } from '../Button'; import { NavLink } from './NavLink'; diff --git a/packages/@mantine/core/src/components/NavLink/NavLink.test.tsx b/packages/@mantine/core/src/components/NavLink/NavLink.test.tsx index cd8e98655b1..169c6dba58e 100644 --- a/packages/@mantine/core/src/components/NavLink/NavLink.test.tsx +++ b/packages/@mantine/core/src/components/NavLink/NavLink.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen, userEvent } from '@mantine-tests/core'; +import { render, screen, tests, userEvent } from '@mantine-tests/core'; import { NavLink, NavLinkProps, NavLinkStylesNames } from './NavLink'; const defaultProps = { diff --git a/packages/@mantine/core/src/components/NavLink/NavLink.tsx b/packages/@mantine/core/src/components/NavLink/NavLink.tsx index 7a43b4be1f4..daac3f9d572 100644 --- a/packages/@mantine/core/src/components/NavLink/NavLink.tsx +++ b/packages/@mantine/core/src/components/NavLink/NavLink.tsx @@ -3,19 +3,19 @@ import { useUncontrolled } from '@mantine/hooks'; import { Box, BoxProps, - StylesApiProps, - polymorphicFactory, - useProps, - useStyles, createVarsResolver, - PolymorphicFactory, + getSpacing, MantineColor, MantineSize, - getSpacing, + polymorphicFactory, + PolymorphicFactory, + StylesApiProps, + useProps, + useStyles, } from '../../core'; -import { UnstyledButton } from '../UnstyledButton'; import { AccordionChevron } from '../Accordion'; import { Collapse } from '../Collapse'; +import { UnstyledButton } from '../UnstyledButton'; import classes from './NavLink.module.css'; export type NavLinkStylesNames = diff --git a/packages/@mantine/core/src/components/Notification/Notification.story.tsx b/packages/@mantine/core/src/components/Notification/Notification.story.tsx index 582a6a82db7..e8586d09de1 100644 --- a/packages/@mantine/core/src/components/Notification/Notification.story.tsx +++ b/packages/@mantine/core/src/components/Notification/Notification.story.tsx @@ -1,10 +1,10 @@ import React from 'react'; import { - IconMoodSmile, + IconBookmark, IconCheck, - IconX, IconExclamationMark, - IconBookmark, + IconMoodSmile, + IconX, } from '@tabler/icons-react'; import { Notification } from './Notification'; diff --git a/packages/@mantine/core/src/components/Notification/Notification.test.tsx b/packages/@mantine/core/src/components/Notification/Notification.test.tsx index 12a76b6129b..9c7c6e9da18 100644 --- a/packages/@mantine/core/src/components/Notification/Notification.test.tsx +++ b/packages/@mantine/core/src/components/Notification/Notification.test.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { render, tests } from '@mantine-tests/core'; import { IconMoodSmile } from '@tabler/icons-react'; +import { render, tests } from '@mantine-tests/core'; import { Notification, NotificationProps, NotificationStylesNames } from './Notification'; const defaultProps: NotificationProps = { diff --git a/packages/@mantine/core/src/components/Notification/Notification.tsx b/packages/@mantine/core/src/components/Notification/Notification.tsx index b57b92ac617..72ece4e6e13 100644 --- a/packages/@mantine/core/src/components/Notification/Notification.tsx +++ b/packages/@mantine/core/src/components/Notification/Notification.tsx @@ -2,21 +2,21 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - MantineRadius, - MantineColor, getRadius, getThemeColor, + MantineColor, + MantineRadius, + StylesApiProps, + useProps, + useStyles, } from '../../core'; -import classes from './Notification.module.css'; -import { Loader } from '../Loader'; import { CloseButton } from '../CloseButton'; +import { Loader } from '../Loader'; +import classes from './Notification.module.css'; export type NotificationStylesNames = | 'root' diff --git a/packages/@mantine/core/src/components/NumberFormatter/NumberFormatter.tsx b/packages/@mantine/core/src/components/NumberFormatter/NumberFormatter.tsx index 5a145ad4f14..625157b8e18 100644 --- a/packages/@mantine/core/src/components/NumberFormatter/NumberFormatter.tsx +++ b/packages/@mantine/core/src/components/NumberFormatter/NumberFormatter.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { NumericFormat } from 'react-number-format'; -import { useProps, Factory, ExtendComponent, MantineThemeComponent } from '../../core'; +import { ExtendComponent, Factory, MantineThemeComponent, useProps } from '../../core'; export interface NumberFormatterProps extends React.ComponentPropsWithoutRef<'span'> { /** Value to format */ diff --git a/packages/@mantine/core/src/components/NumberInput/NumberInput.story.tsx b/packages/@mantine/core/src/components/NumberInput/NumberInput.story.tsx index e8a7b208bea..69eaa33ab8f 100644 --- a/packages/@mantine/core/src/components/NumberInput/NumberInput.story.tsx +++ b/packages/@mantine/core/src/components/NumberInput/NumberInput.story.tsx @@ -1,10 +1,10 @@ /* eslint-disable no-console */ -import React, { useState, useRef } from 'react'; +import React, { useRef, useState } from 'react'; import { useForm } from '@mantine/form'; -import { NumberInput, NumberInputHandlers } from './NumberInput'; import { Button } from '../Button'; -import { TextInput } from '../TextInput'; import { Group } from '../Group'; +import { TextInput } from '../TextInput'; +import { NumberInput, NumberInputHandlers } from './NumberInput'; export default { title: 'NumberInput' }; diff --git a/packages/@mantine/core/src/components/NumberInput/NumberInput.test.tsx b/packages/@mantine/core/src/components/NumberInput/NumberInput.test.tsx index b136e5ad9d9..42b3319260a 100644 --- a/packages/@mantine/core/src/components/NumberInput/NumberInput.test.tsx +++ b/packages/@mantine/core/src/components/NumberInput/NumberInput.test.tsx @@ -1,15 +1,15 @@ import React from 'react'; +import { act, fireEvent } from '@testing-library/react'; import { - tests, - render, inputDefaultProps, inputStylesApiSelectors, - userEvent, + render, screen, + tests, + userEvent, } from '@mantine-tests/core'; -import { act, fireEvent } from '@testing-library/react'; -import { NumberInput, NumberInputHandlers, NumberInputProps } from './NumberInput'; import { __InputStylesNames } from '../Input'; +import { NumberInput, NumberInputHandlers, NumberInputProps } from './NumberInput'; const defaultProps: NumberInputProps = { ...inputDefaultProps, diff --git a/packages/@mantine/core/src/components/NumberInput/NumberInput.tsx b/packages/@mantine/core/src/components/NumberInput/NumberInput.tsx index 997e8862488..fa08ed23760 100644 --- a/packages/@mantine/core/src/components/NumberInput/NumberInput.tsx +++ b/packages/@mantine/core/src/components/NumberInput/NumberInput.tsx @@ -1,22 +1,22 @@ import React from 'react'; import cx from 'clsx'; -import { NumericFormat, OnValueChange, NumberFormatValues } from 'react-number-format'; +import { NumberFormatValues, NumericFormat, OnValueChange } from 'react-number-format'; import { assignRef, clamp, useUncontrolled } from '@mantine/hooks'; import { BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, getSize, + StylesApiProps, + useProps, useResolvedStylesApi, + useStyles, } from '../../core'; -import { UnstyledButton } from '../UnstyledButton'; -import { InputBase } from '../InputBase'; import { __BaseInputProps, __InputStylesNames, InputVariant } from '../Input'; +import { InputBase } from '../InputBase'; +import { UnstyledButton } from '../UnstyledButton'; import { NumberInputChevron } from './NumberInputChevron'; import classes from './NumberInput.module.css'; diff --git a/packages/@mantine/core/src/components/Overlay/Overlay.tsx b/packages/@mantine/core/src/components/Overlay/Overlay.tsx index eef6c64335f..5a320a6cdd0 100644 --- a/packages/@mantine/core/src/components/Overlay/Overlay.tsx +++ b/packages/@mantine/core/src/components/Overlay/Overlay.tsx @@ -2,17 +2,17 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - polymorphicFactory, - useProps, - useStyles, createVarsResolver, - PolymorphicFactory, - MantineRadius, - rgba, getDefaultZIndex, getRadius, + MantineRadius, + polymorphicFactory, + PolymorphicFactory, rem, + rgba, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import classes from './Overlay.module.css'; diff --git a/packages/@mantine/core/src/components/Pagination/Pagination.story.tsx b/packages/@mantine/core/src/components/Pagination/Pagination.story.tsx index ee47fec3d22..64380817a91 100644 --- a/packages/@mantine/core/src/components/Pagination/Pagination.story.tsx +++ b/packages/@mantine/core/src/components/Pagination/Pagination.story.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { Group } from '../Group'; import { Button } from '../Button'; +import { Group } from '../Group'; import { Pagination } from './Pagination'; export default { title: 'Pagination' }; diff --git a/packages/@mantine/core/src/components/Pagination/Pagination.tsx b/packages/@mantine/core/src/components/Pagination/Pagination.tsx index 9fa67e959b0..222a8ab42c0 100644 --- a/packages/@mantine/core/src/components/Pagination/Pagination.tsx +++ b/packages/@mantine/core/src/components/Pagination/Pagination.tsx @@ -1,12 +1,7 @@ import React from 'react'; -import { factory, useProps, Factory, MantineSize } from '../../core'; +import { factory, Factory, MantineSize, useProps } from '../../core'; import { Group } from '../Group/Group'; -import { - PaginationRoot, - PaginationRootCssVariables, - PaginationRootProps, - PaginationRootStylesNames, -} from './PaginationRoot/PaginationRoot'; +import { PaginationIcon } from './Pagination.icons'; import { PaginationControl } from './PaginationControl/PaginationControl'; import { PaginationDots } from './PaginationDots/PaginationDots'; import { @@ -16,7 +11,12 @@ import { PaginationPrevious, } from './PaginationEdges/PaginationEdges'; import { PaginationItems } from './PaginationItems/PaginationItems'; -import { PaginationIcon } from './Pagination.icons'; +import { + PaginationRoot, + PaginationRootCssVariables, + PaginationRootProps, + PaginationRootStylesNames, +} from './PaginationRoot/PaginationRoot'; import classes from './Pagination.module.css'; export type PaginationStylesNames = PaginationRootStylesNames; diff --git a/packages/@mantine/core/src/components/Pagination/PaginationControl/PaginationControl.test.tsx b/packages/@mantine/core/src/components/Pagination/PaginationControl/PaginationControl.test.tsx index ddcdb001e66..03634b32f03 100644 --- a/packages/@mantine/core/src/components/Pagination/PaginationControl/PaginationControl.test.tsx +++ b/packages/@mantine/core/src/components/Pagination/PaginationControl/PaginationControl.test.tsx @@ -1,11 +1,11 @@ import React from 'react'; -import { tests, createContextContainer, screen, render } from '@mantine-tests/core'; +import { createContextContainer, render, screen, tests } from '@mantine-tests/core'; +import { PaginationRoot } from '../PaginationRoot/PaginationRoot'; import { PaginationControl, PaginationControlProps, PaginationControlStylesNames, } from './PaginationControl'; -import { PaginationRoot } from '../PaginationRoot/PaginationRoot'; const TestContainer = createContextContainer(PaginationControl, PaginationRoot, { total: 10 }); diff --git a/packages/@mantine/core/src/components/Pagination/PaginationControl/PaginationControl.tsx b/packages/@mantine/core/src/components/Pagination/PaginationControl/PaginationControl.tsx index 500de1edaf5..e3d648a1ac7 100644 --- a/packages/@mantine/core/src/components/Pagination/PaginationControl/PaginationControl.tsx +++ b/packages/@mantine/core/src/components/Pagination/PaginationControl/PaginationControl.tsx @@ -2,10 +2,10 @@ import React from 'react'; import { BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '../../../core'; import { UnstyledButton } from '../../UnstyledButton'; import { usePaginationContext } from '../Pagination.context'; diff --git a/packages/@mantine/core/src/components/Pagination/PaginationDots/PaginationDots.test.tsx b/packages/@mantine/core/src/components/Pagination/PaginationDots/PaginationDots.test.tsx index 64f26dfd826..71b516795e1 100644 --- a/packages/@mantine/core/src/components/Pagination/PaginationDots/PaginationDots.test.tsx +++ b/packages/@mantine/core/src/components/Pagination/PaginationDots/PaginationDots.test.tsx @@ -1,6 +1,6 @@ -import { tests, createContextContainer } from '@mantine-tests/core'; -import { PaginationDots, PaginationDotsProps, PaginationDotsStylesNames } from './PaginationDots'; +import { createContextContainer, tests } from '@mantine-tests/core'; import { PaginationRoot } from '../PaginationRoot/PaginationRoot'; +import { PaginationDots, PaginationDotsProps, PaginationDotsStylesNames } from './PaginationDots'; const TestContainer = createContextContainer(PaginationDots, PaginationRoot, { total: 10 }); diff --git a/packages/@mantine/core/src/components/Pagination/PaginationDots/PaginationDots.tsx b/packages/@mantine/core/src/components/Pagination/PaginationDots/PaginationDots.tsx index 84911a303dd..d8edd52a466 100644 --- a/packages/@mantine/core/src/components/Pagination/PaginationDots/PaginationDots.tsx +++ b/packages/@mantine/core/src/components/Pagination/PaginationDots/PaginationDots.tsx @@ -3,10 +3,10 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '../../../core'; import { usePaginationContext } from '../Pagination.context'; import { PaginationDotsIcon, PaginationIconProps } from '../Pagination.icons'; diff --git a/packages/@mantine/core/src/components/Pagination/PaginationEdges/PaginationEdges.tsx b/packages/@mantine/core/src/components/Pagination/PaginationEdges/PaginationEdges.tsx index 5d4915346d3..8d09af4d44f 100644 --- a/packages/@mantine/core/src/components/Pagination/PaginationEdges/PaginationEdges.tsx +++ b/packages/@mantine/core/src/components/Pagination/PaginationEdges/PaginationEdges.tsx @@ -1,12 +1,12 @@ import React, { forwardRef } from 'react'; -import { createPolymorphicComponent, useProps, BoxProps } from '../../../core'; +import { BoxProps, createPolymorphicComponent, useProps } from '../../../core'; import { usePaginationContext } from '../Pagination.context'; import { - PaginationNextIcon, - PaginationPreviousIcon, PaginationFirstIcon, - PaginationLastIcon, PaginationIconProps, + PaginationLastIcon, + PaginationNextIcon, + PaginationPreviousIcon, } from '../Pagination.icons'; import { PaginationControl } from '../PaginationControl/PaginationControl'; diff --git a/packages/@mantine/core/src/components/Pagination/PaginationItems/PaginationItems.tsx b/packages/@mantine/core/src/components/Pagination/PaginationItems/PaginationItems.tsx index b44c5b12f8b..ba916eea248 100644 --- a/packages/@mantine/core/src/components/Pagination/PaginationItems/PaginationItems.tsx +++ b/packages/@mantine/core/src/components/Pagination/PaginationItems/PaginationItems.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { usePaginationContext } from '../Pagination.context'; +import { PaginationIcon } from '../Pagination.icons'; import { PaginationControl } from '../PaginationControl/PaginationControl'; import { PaginationDots } from '../PaginationDots/PaginationDots'; -import { PaginationIcon } from '../Pagination.icons'; export interface PaginationItemsProps { /** Dots icon component */ diff --git a/packages/@mantine/core/src/components/Pagination/PaginationRoot/PaginationRoot.tsx b/packages/@mantine/core/src/components/Pagination/PaginationRoot/PaginationRoot.tsx index 1fbb67d1e5f..dc7811590b3 100644 --- a/packages/@mantine/core/src/components/Pagination/PaginationRoot/PaginationRoot.tsx +++ b/packages/@mantine/core/src/components/Pagination/PaginationRoot/PaginationRoot.tsx @@ -3,21 +3,21 @@ import { usePagination } from '@mantine/hooks'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, + createEventHandler, createVarsResolver, + ElementProps, + factory, Factory, - MantineSize, - MantineColor, - MantineRadius, - createEventHandler, + getFontSize, getRadius, getSize, - getFontSize, getThemeColor, + MantineColor, + MantineRadius, + MantineSize, + StylesApiProps, + useProps, + useStyles, } from '../../../core'; import { PaginationProvider } from '../Pagination.context'; import classes from '../Pagination.module.css'; diff --git a/packages/@mantine/core/src/components/Paper/Paper.tsx b/packages/@mantine/core/src/components/Paper/Paper.tsx index b4bf3268e16..707e8c00554 100644 --- a/packages/@mantine/core/src/components/Paper/Paper.tsx +++ b/packages/@mantine/core/src/components/Paper/Paper.tsx @@ -2,16 +2,16 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - polymorphicFactory, - useProps, - useStyles, - MantineShadow, - MantineRadius, + createVarsResolver, getRadius, getShadow, - createVarsResolver, + MantineRadius, + MantineShadow, + polymorphicFactory, PolymorphicFactory, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import classes from './Paper.module.css'; diff --git a/packages/@mantine/core/src/components/PasswordInput/PasswordInput.test.tsx b/packages/@mantine/core/src/components/PasswordInput/PasswordInput.test.tsx index 119be23a06c..333abf53c71 100644 --- a/packages/@mantine/core/src/components/PasswordInput/PasswordInput.test.tsx +++ b/packages/@mantine/core/src/components/PasswordInput/PasswordInput.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { tests, inputDefaultProps, inputStylesApiSelectors } from '@mantine-tests/core'; -import { PasswordInput, PasswordInputProps } from './PasswordInput'; +import { inputDefaultProps, inputStylesApiSelectors, tests } from '@mantine-tests/core'; import { __InputStylesNames } from '../Input'; +import { PasswordInput, PasswordInputProps } from './PasswordInput'; const defaultProps: PasswordInputProps = { ...inputDefaultProps, diff --git a/packages/@mantine/core/src/components/PasswordInput/PasswordInput.tsx b/packages/@mantine/core/src/components/PasswordInput/PasswordInput.tsx index 9767294102d..10ba9757c04 100644 --- a/packages/@mantine/core/src/components/PasswordInput/PasswordInput.tsx +++ b/packages/@mantine/core/src/components/PasswordInput/PasswordInput.tsx @@ -2,21 +2,21 @@ import React from 'react'; import cx from 'clsx'; import { useId, useUncontrolled } from '@mantine/hooks'; import { - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, + BoxProps, createVarsResolver, - Factory, + ElementProps, extractStyleProps, - useResolvedStylesApi, + factory, + Factory, getSize, - BoxProps, + StylesApiProps, + useProps, + useResolvedStylesApi, + useStyles, } from '../../core'; -import { InputBase } from '../InputBase'; -import { Input, InputVariant, __InputStylesNames, __BaseInputProps } from '../Input'; import { ActionIcon } from '../ActionIcon'; +import { __BaseInputProps, __InputStylesNames, Input, InputVariant } from '../Input'; +import { InputBase } from '../InputBase'; import { PasswordToggleIcon } from './PasswordToggleIcon'; import classes from './PasswordInput.module.css'; diff --git a/packages/@mantine/core/src/components/Pill/Pill.tsx b/packages/@mantine/core/src/components/Pill/Pill.tsx index 87b3788ddee..ba77db686a0 100644 --- a/packages/@mantine/core/src/components/Pill/Pill.tsx +++ b/packages/@mantine/core/src/components/Pill/Pill.tsx @@ -2,22 +2,22 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - MantineSize, + getRadius, getSize, MantineRadius, - getRadius, + MantineSize, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import { CloseButton } from '../CloseButton'; -import { PillGroup } from './PillGroup/PillGroup'; -import { usePillGroupContext } from './PillGroup.context'; import { usePillsInputContext } from '../PillsInput/PillsInput.context'; +import { usePillGroupContext } from './PillGroup.context'; +import { PillGroup } from './PillGroup/PillGroup'; import classes from './Pill.module.css'; export type PillStylesNames = 'root' | 'label' | 'remove'; diff --git a/packages/@mantine/core/src/components/Pill/PillGroup/PillGroup.tsx b/packages/@mantine/core/src/components/Pill/PillGroup/PillGroup.tsx index 26e96501fd7..69077a00af9 100644 --- a/packages/@mantine/core/src/components/Pill/PillGroup/PillGroup.tsx +++ b/packages/@mantine/core/src/components/Pill/PillGroup/PillGroup.tsx @@ -2,18 +2,18 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - MantineSize, getSize, + MantineSize, + StylesApiProps, + useProps, + useStyles, } from '../../../core'; -import { PillGroupProvider } from '../PillGroup.context'; import { usePillsInputContext } from '../../PillsInput/PillsInput.context'; +import { PillGroupProvider } from '../PillGroup.context'; import classes from '../Pill.module.css'; export type PillGroupStylesNames = 'group'; diff --git a/packages/@mantine/core/src/components/PillsInput/PillsInput.context.ts b/packages/@mantine/core/src/components/PillsInput/PillsInput.context.ts index 2d1301ecd61..978d5d74717 100644 --- a/packages/@mantine/core/src/components/PillsInput/PillsInput.context.ts +++ b/packages/@mantine/core/src/components/PillsInput/PillsInput.context.ts @@ -1,5 +1,5 @@ import React from 'react'; -import { MantineSize, createOptionalContext } from '../../core'; +import { createOptionalContext, MantineSize } from '../../core'; import { InputVariant } from '../Input'; export interface PillsInputContextValue { diff --git a/packages/@mantine/core/src/components/PillsInput/PillsInput.story.tsx b/packages/@mantine/core/src/components/PillsInput/PillsInput.story.tsx index 95b73223893..008e178252e 100644 --- a/packages/@mantine/core/src/components/PillsInput/PillsInput.story.tsx +++ b/packages/@mantine/core/src/components/PillsInput/PillsInput.story.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import { TextInput } from '../TextInput'; import { Group } from '../Group'; -import { PillsInput } from './PillsInput'; import { Pill } from '../Pill'; +import { TextInput } from '../TextInput'; +import { PillsInput } from './PillsInput'; export default { title: 'PillsInput' }; diff --git a/packages/@mantine/core/src/components/PillsInput/PillsInput.test.tsx b/packages/@mantine/core/src/components/PillsInput/PillsInput.test.tsx index e6fbb2eebb6..0c209328f5e 100644 --- a/packages/@mantine/core/src/components/PillsInput/PillsInput.test.tsx +++ b/packages/@mantine/core/src/components/PillsInput/PillsInput.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { tests, inputStylesApiSelectors, inputDefaultProps } from '@mantine-tests/core'; -import { PillsInput, PillsInputProps } from './PillsInput'; +import { inputDefaultProps, inputStylesApiSelectors, tests } from '@mantine-tests/core'; import { __InputStylesNames } from '../Input'; +import { PillsInput, PillsInputProps } from './PillsInput'; const defaultProps: PillsInputProps = { ...inputDefaultProps, diff --git a/packages/@mantine/core/src/components/PillsInput/PillsInput.tsx b/packages/@mantine/core/src/components/PillsInput/PillsInput.tsx index 5acb9228c23..1f184383921 100644 --- a/packages/@mantine/core/src/components/PillsInput/PillsInput.tsx +++ b/packages/@mantine/core/src/components/PillsInput/PillsInput.tsx @@ -1,6 +1,6 @@ import React, { useRef } from 'react'; -import { factory, ElementProps, useProps, Factory, BoxProps, StylesApiProps } from '../../core'; -import { __InputStylesNames, __BaseInputProps } from '../Input'; +import { BoxProps, ElementProps, factory, Factory, StylesApiProps, useProps } from '../../core'; +import { __BaseInputProps, __InputStylesNames } from '../Input'; import { InputBase } from '../InputBase'; import { PillsInputProvider } from './PillsInput.context'; import { PillsInputField } from './PillsInputField/PillsInputField'; diff --git a/packages/@mantine/core/src/components/PillsInput/PillsInputField/PillsInputField.test.tsx b/packages/@mantine/core/src/components/PillsInput/PillsInputField/PillsInputField.test.tsx index 2deb67e47b2..f619d926404 100644 --- a/packages/@mantine/core/src/components/PillsInput/PillsInputField/PillsInputField.test.tsx +++ b/packages/@mantine/core/src/components/PillsInput/PillsInputField/PillsInputField.test.tsx @@ -1,11 +1,11 @@ import React from 'react'; -import { render, screen, tests, createContextContainer } from '@mantine-tests/core'; +import { createContextContainer, render, screen, tests } from '@mantine-tests/core'; +import { PillsInputProvider } from '../PillsInput.context'; import { PillsInputField, PillsInputFieldProps, PillsInputFieldStylesNames, } from './PillsInputField'; -import { PillsInputProvider } from '../PillsInput.context'; const TestContainer = createContextContainer(PillsInputField, PillsInputProvider, { value: { size: 'sm', fieldRef: { current: null } }, diff --git a/packages/@mantine/core/src/components/PillsInput/PillsInputField/PillsInputField.tsx b/packages/@mantine/core/src/components/PillsInput/PillsInputField/PillsInputField.tsx index ea415baa47e..2c07177664e 100644 --- a/packages/@mantine/core/src/components/PillsInput/PillsInputField/PillsInputField.tsx +++ b/packages/@mantine/core/src/components/PillsInput/PillsInputField/PillsInputField.tsx @@ -3,12 +3,12 @@ import { useMergedRef } from '@mantine/hooks'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, + factory, + Factory, + StylesApiProps, useProps, useStyles, - Factory, } from '../../../core'; import { useInputWrapperContext } from '../../Input'; import { usePillsInputContext } from '../PillsInput.context'; diff --git a/packages/@mantine/core/src/components/PinInput/PinInput.story.tsx b/packages/@mantine/core/src/components/PinInput/PinInput.story.tsx index 07c2026f6fc..e54bf950730 100644 --- a/packages/@mantine/core/src/components/PinInput/PinInput.story.tsx +++ b/packages/@mantine/core/src/components/PinInput/PinInput.story.tsx @@ -1,7 +1,7 @@ -import React, { useState, useRef } from 'react'; -import { PinInput } from './PinInput'; -import { Button } from '../Button'; +import React, { useRef, useState } from 'react'; import { DEFAULT_THEME, MantineSize } from '../../core'; +import { Button } from '../Button'; +import { PinInput } from './PinInput'; export default { title: 'PinInput' }; diff --git a/packages/@mantine/core/src/components/PinInput/PinInput.tsx b/packages/@mantine/core/src/components/PinInput/PinInput.tsx index 4a91dcedc4e..77c16562a8b 100644 --- a/packages/@mantine/core/src/components/PinInput/PinInput.tsx +++ b/packages/@mantine/core/src/components/PinInput/PinInput.tsx @@ -1,25 +1,25 @@ -import React, { useRef, useState, useEffect } from 'react'; -import { useUncontrolled, useId, assignRef } from '@mantine/hooks'; +import React, { useEffect, useRef, useState } from 'react'; +import { assignRef, useId, useUncontrolled } from '@mantine/hooks'; import { BoxProps, + createVarsResolver, ElementProps, Factory, + factory, + getSize, MantineRadius, MantineSize, MantineSpacing, StylesApiProps, - createVarsResolver, - factory, - getSize, useProps, useResolvedStylesApi, useStyles, } from '../../core'; import { Group } from '../Group'; import { Input } from '../Input'; +import { InputBase } from '../InputBase'; import { createPinArray } from './create-pin-array/create-pin-array'; import classes from './PinInput.module.css'; -import { InputBase } from '../InputBase'; const regex = { number: /^[0-9]+$/, diff --git a/packages/@mantine/core/src/components/Popover/Popover.context.ts b/packages/@mantine/core/src/components/Popover/Popover.context.ts index a8101c1f627..31ba94f97d7 100644 --- a/packages/@mantine/core/src/components/Popover/Popover.context.ts +++ b/packages/@mantine/core/src/components/Popover/Popover.context.ts @@ -1,16 +1,16 @@ import { + ClassNames, createSafeContext, + GetStylesApi, + MantineRadius, MantineShadow, Styles, - ClassNames, - MantineRadius, - GetStylesApi, } from '../../core'; -import { FloatingPosition, ArrowPosition } from '../Floating'; -import { TransitionOverride } from '../Transition'; +import { ArrowPosition, FloatingPosition } from '../Floating'; import { PortalProps } from '../Portal'; -import { PopoverWidth } from './Popover.types'; +import { TransitionOverride } from '../Transition'; import type { PopoverFactory } from './Popover'; +import { PopoverWidth } from './Popover.types'; interface PopoverContext { x: number; diff --git a/packages/@mantine/core/src/components/Popover/Popover.story.tsx b/packages/@mantine/core/src/components/Popover/Popover.story.tsx index f704f6057e7..e3722dbfbf0 100644 --- a/packages/@mantine/core/src/components/Popover/Popover.story.tsx +++ b/packages/@mantine/core/src/components/Popover/Popover.story.tsx @@ -1,8 +1,8 @@ import React, { useState } from 'react'; import { Box, MantineThemeProvider } from '../../core'; -import { Popover } from './Popover'; -import { Tooltip } from '../Tooltip'; import { Group } from '../Group'; +import { Tooltip } from '../Tooltip'; +import { Popover } from './Popover'; export default { title: 'Popover' }; diff --git a/packages/@mantine/core/src/components/Popover/Popover.test.tsx b/packages/@mantine/core/src/components/Popover/Popover.test.tsx index acf21a13617..7c9d74f8cbc 100644 --- a/packages/@mantine/core/src/components/Popover/Popover.test.tsx +++ b/packages/@mantine/core/src/components/Popover/Popover.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, userEvent, screen } from '@mantine-tests/core'; +import { render, screen, tests, userEvent } from '@mantine-tests/core'; import { Popover, PopoverProps, PopoverStylesNames } from './Popover'; import { PopoverDropdown } from './PopoverDropdown/PopoverDropdown'; import { PopoverTarget } from './PopoverTarget/PopoverTarget'; diff --git a/packages/@mantine/core/src/components/Popover/Popover.tsx b/packages/@mantine/core/src/components/Popover/Popover.tsx index 74bdbda675e..4e35335c2a0 100644 --- a/packages/@mantine/core/src/components/Popover/Popover.tsx +++ b/packages/@mantine/core/src/components/Popover/Popover.tsx @@ -1,32 +1,32 @@ -import React, { useRef, useState, useCallback } from 'react'; -import { useId, useClickOutside } from '@mantine/hooks'; +import React, { useCallback, useRef, useState } from 'react'; +import { useClickOutside, useId } from '@mantine/hooks'; import { - MantineShadow, - getDefaultZIndex, - useProps, - MantineRadius, - useDirection, - useStyles, - Factory, createVarsResolver, + ExtendComponent, + Factory, + getDefaultZIndex, getRadius, getShadow, + MantineRadius, + MantineShadow, StylesApiProps, - ExtendComponent, + useDirection, + useProps, + useStyles, } from '../../core'; -import { TransitionOverride } from '../Transition'; import { - getFloatingPosition, + ArrowPosition, FloatingAxesOffsets, FloatingPosition, - ArrowPosition, + getFloatingPosition, } from '../Floating'; import { PortalProps } from '../Portal'; -import { usePopover } from './use-popover'; +import { TransitionOverride } from '../Transition'; import { PopoverContextProvider } from './Popover.context'; -import { PopoverWidth, PopoverMiddlewares } from './Popover.types'; -import { PopoverTarget } from './PopoverTarget/PopoverTarget'; +import { PopoverMiddlewares, PopoverWidth } from './Popover.types'; import { PopoverDropdown } from './PopoverDropdown/PopoverDropdown'; +import { PopoverTarget } from './PopoverTarget/PopoverTarget'; +import { usePopover } from './use-popover'; import classes from './Popover.module.css'; export type PopoverStylesNames = 'dropdown' | 'arrow'; diff --git a/packages/@mantine/core/src/components/Popover/PopoverDropdown/PopoverDropdown.test.tsx b/packages/@mantine/core/src/components/Popover/PopoverDropdown/PopoverDropdown.test.tsx index 48217c90aaf..622d32771b5 100644 --- a/packages/@mantine/core/src/components/Popover/PopoverDropdown/PopoverDropdown.test.tsx +++ b/packages/@mantine/core/src/components/Popover/PopoverDropdown/PopoverDropdown.test.tsx @@ -1,6 +1,6 @@ -import { tests, createContextContainer } from '@mantine-tests/core'; -import { PopoverDropdown, PopoverDropdownProps } from './PopoverDropdown'; +import { createContextContainer, tests } from '@mantine-tests/core'; import { Popover } from '../Popover'; +import { PopoverDropdown, PopoverDropdownProps } from './PopoverDropdown'; const defaultProps: PopoverDropdownProps = {}; diff --git a/packages/@mantine/core/src/components/Popover/PopoverDropdown/PopoverDropdown.tsx b/packages/@mantine/core/src/components/Popover/PopoverDropdown/PopoverDropdown.tsx index 0ceb6774d67..959a7fcfb34 100644 --- a/packages/@mantine/core/src/components/Popover/PopoverDropdown/PopoverDropdown.tsx +++ b/packages/@mantine/core/src/components/Popover/PopoverDropdown/PopoverDropdown.tsx @@ -3,18 +3,18 @@ import { useFocusReturn, useMergedRef } from '@mantine/hooks'; import { Box, BoxProps, + closeOnEscape, CompoundStylesApiProps, - factory, ElementProps, - useProps, - rem, - closeOnEscape, + factory, Factory, + rem, + useProps, } from '../../../core'; +import { FloatingArrow } from '../../Floating'; +import { FocusTrap } from '../../FocusTrap'; import { OptionalPortal } from '../../Portal'; import { Transition } from '../../Transition'; -import { FocusTrap } from '../../FocusTrap'; -import { FloatingArrow } from '../../Floating'; import type { PopoverStylesNames } from '../Popover'; import { usePopoverContext } from '../Popover.context'; import classes from '../Popover.module.css'; diff --git a/packages/@mantine/core/src/components/Popover/PopoverTarget/PopoverTarget.test.tsx b/packages/@mantine/core/src/components/Popover/PopoverTarget/PopoverTarget.test.tsx index b69969635ea..552840c8522 100644 --- a/packages/@mantine/core/src/components/Popover/PopoverTarget/PopoverTarget.test.tsx +++ b/packages/@mantine/core/src/components/Popover/PopoverTarget/PopoverTarget.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { render, tests, patchConsoleError, createContextContainer } from '@mantine-tests/core'; -import { PopoverTarget, PopoverTargetProps } from './PopoverTarget'; +import { createContextContainer, patchConsoleError, render, tests } from '@mantine-tests/core'; import { Popover } from '../Popover'; +import { PopoverTarget, PopoverTargetProps } from './PopoverTarget'; const defaultProps: PopoverTargetProps = { children:
test
, diff --git a/packages/@mantine/core/src/components/Popover/PopoverTarget/PopoverTarget.tsx b/packages/@mantine/core/src/components/Popover/PopoverTarget/PopoverTarget.tsx index 83a6614dd18..bbcdabae731 100644 --- a/packages/@mantine/core/src/components/Popover/PopoverTarget/PopoverTarget.tsx +++ b/packages/@mantine/core/src/components/Popover/PopoverTarget/PopoverTarget.tsx @@ -1,7 +1,7 @@ import React, { cloneElement } from 'react'; import cx from 'clsx'; import { useMergedRef } from '@mantine/hooks'; -import { isElement, useProps, factory, Factory } from '../../../core'; +import { factory, Factory, isElement, useProps } from '../../../core'; import { usePopoverContext } from '../Popover.context'; export interface PopoverTargetProps { diff --git a/packages/@mantine/core/src/components/Popover/use-popover.ts b/packages/@mantine/core/src/components/Popover/use-popover.ts index d31b4cd67aa..b0602425bff 100644 --- a/packages/@mantine/core/src/components/Popover/use-popover.ts +++ b/packages/@mantine/core/src/components/Popover/use-popover.ts @@ -1,18 +1,18 @@ -import { useDidUpdate, useUncontrolled } from '@mantine/hooks'; import { - useFloating, - shift, - flip, arrow, - offset, - size, - Middleware, + flip, inline, limitShift, + Middleware, + offset, + shift, + size, + useFloating, UseFloatingReturn, } from '@floating-ui/react'; +import { useDidUpdate, useUncontrolled } from '@mantine/hooks'; import { FloatingAxesOffsets, FloatingPosition, useFloatingAutoUpdate } from '../Floating'; -import { PopoverWidth, PopoverMiddlewares } from './Popover.types'; +import { PopoverMiddlewares, PopoverWidth } from './Popover.types'; interface UsePopoverOptions { offset: number | FloatingAxesOffsets; diff --git a/packages/@mantine/core/src/components/Portal/Portal.tsx b/packages/@mantine/core/src/components/Portal/Portal.tsx index 57ab61628db..2dd6155f755 100644 --- a/packages/@mantine/core/src/components/Portal/Portal.tsx +++ b/packages/@mantine/core/src/components/Portal/Portal.tsx @@ -1,6 +1,6 @@ -import React, { useRef, useState, forwardRef } from 'react'; +import React, { forwardRef, useRef, useState } from 'react'; import { createPortal } from 'react-dom'; -import { useIsomorphicEffect, assignRef } from '@mantine/hooks'; +import { assignRef, useIsomorphicEffect } from '@mantine/hooks'; import { useProps } from '../../core'; function createPortalNode(props: React.ComponentPropsWithoutRef<'div'>) { diff --git a/packages/@mantine/core/src/components/Progress/Progress.test.tsx b/packages/@mantine/core/src/components/Progress/Progress.test.tsx index b0bf5a1061b..1525bf27746 100644 --- a/packages/@mantine/core/src/components/Progress/Progress.test.tsx +++ b/packages/@mantine/core/src/components/Progress/Progress.test.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { tests } from '@mantine-tests/core'; import { Progress, ProgressProps, ProgressStylesNames } from './Progress'; -import { ProgressRoot } from './ProgressRoot/ProgressRoot'; import { ProgressLabel } from './ProgressLabel/ProgressLabel'; +import { ProgressRoot } from './ProgressRoot/ProgressRoot'; import { ProgressSection } from './ProgressSection/ProgressSection'; const defaultProps: ProgressProps = { diff --git a/packages/@mantine/core/src/components/Progress/Progress.tsx b/packages/@mantine/core/src/components/Progress/Progress.tsx index 29f39409cd4..a6fe8f59fc5 100644 --- a/packages/@mantine/core/src/components/Progress/Progress.tsx +++ b/packages/@mantine/core/src/components/Progress/Progress.tsx @@ -1,20 +1,20 @@ import React from 'react'; import { - StylesApiProps, factory, - useProps, Factory, - useResolvedStylesApi, MantineColor, + StylesApiProps, + useProps, + useResolvedStylesApi, } from '../../core'; +import { ProgressLabel } from './ProgressLabel/ProgressLabel'; import { + __ProgressRootProps, ProgressRoot, - ProgressRootStylesNames, ProgressRootCssVariables, - __ProgressRootProps, + ProgressRootStylesNames, } from './ProgressRoot/ProgressRoot'; import { ProgressSection } from './ProgressSection/ProgressSection'; -import { ProgressLabel } from './ProgressLabel/ProgressLabel'; import classes from './Progress.module.css'; export type ProgressStylesNames = ProgressRootStylesNames; diff --git a/packages/@mantine/core/src/components/Progress/ProgressLabel/ProgressLabel.test.tsx b/packages/@mantine/core/src/components/Progress/ProgressLabel/ProgressLabel.test.tsx index 7fa4360b904..7f15de3f577 100644 --- a/packages/@mantine/core/src/components/Progress/ProgressLabel/ProgressLabel.test.tsx +++ b/packages/@mantine/core/src/components/Progress/ProgressLabel/ProgressLabel.test.tsx @@ -1,6 +1,6 @@ -import { tests, createContextContainer } from '@mantine-tests/core'; -import { ProgressLabel, ProgressLabelProps, ProgressLabelStylesNames } from './ProgressLabel'; +import { createContextContainer, tests } from '@mantine-tests/core'; import { ProgressRoot } from '../ProgressRoot/ProgressRoot'; +import { ProgressLabel, ProgressLabelProps, ProgressLabelStylesNames } from './ProgressLabel'; const TestContainer = createContextContainer(ProgressLabel, ProgressRoot, {}); diff --git a/packages/@mantine/core/src/components/Progress/ProgressLabel/ProgressLabel.tsx b/packages/@mantine/core/src/components/Progress/ProgressLabel/ProgressLabel.tsx index 9a7b3126e3e..832375c309e 100644 --- a/packages/@mantine/core/src/components/Progress/ProgressLabel/ProgressLabel.tsx +++ b/packages/@mantine/core/src/components/Progress/ProgressLabel/ProgressLabel.tsx @@ -3,13 +3,13 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '../../../core'; -import classes from '../Progress.module.css'; import { useProgressContext } from '../Progress.context'; +import classes from '../Progress.module.css'; export type ProgressLabelStylesNames = 'label'; diff --git a/packages/@mantine/core/src/components/Progress/ProgressRoot/ProgressRoot.tsx b/packages/@mantine/core/src/components/Progress/ProgressRoot/ProgressRoot.tsx index e13962e83a4..42bd85ea14a 100644 --- a/packages/@mantine/core/src/components/Progress/ProgressRoot/ProgressRoot.tsx +++ b/packages/@mantine/core/src/components/Progress/ProgressRoot/ProgressRoot.tsx @@ -2,17 +2,17 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - MantineSize, - MantineRadius, - getSize, getRadius, + getSize, + MantineRadius, + MantineSize, + StylesApiProps, + useProps, + useStyles, } from '../../../core'; import { ProgressProvider } from '../Progress.context'; import classes from '../Progress.module.css'; diff --git a/packages/@mantine/core/src/components/Progress/ProgressSection/ProgressSection.test.tsx b/packages/@mantine/core/src/components/Progress/ProgressSection/ProgressSection.test.tsx index e7569acc5fe..b415a4bfda1 100644 --- a/packages/@mantine/core/src/components/Progress/ProgressSection/ProgressSection.test.tsx +++ b/packages/@mantine/core/src/components/Progress/ProgressSection/ProgressSection.test.tsx @@ -1,11 +1,11 @@ import React from 'react'; -import { render, screen, tests, createContextContainer } from '@mantine-tests/core'; +import { createContextContainer, render, screen, tests } from '@mantine-tests/core'; +import { ProgressRoot } from '../ProgressRoot/ProgressRoot'; import { ProgressSection, ProgressSectionProps, ProgressSectionStylesNames, } from './ProgressSection'; -import { ProgressRoot } from '../ProgressRoot/ProgressRoot'; const TestContainer = createContextContainer(ProgressSection, ProgressRoot, {}); diff --git a/packages/@mantine/core/src/components/Progress/ProgressSection/ProgressSection.tsx b/packages/@mantine/core/src/components/Progress/ProgressSection/ProgressSection.tsx index 10d79a2542a..2e745a5a41a 100644 --- a/packages/@mantine/core/src/components/Progress/ProgressSection/ProgressSection.tsx +++ b/packages/@mantine/core/src/components/Progress/ProgressSection/ProgressSection.tsx @@ -3,13 +3,13 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + getThemeColor, MantineColor, useMantineTheme, - getThemeColor, + useProps, } from '../../../core'; import { useProgressContext } from '../Progress.context'; import classes from '../Progress.module.css'; diff --git a/packages/@mantine/core/src/components/Radio/Radio.story.tsx b/packages/@mantine/core/src/components/Radio/Radio.story.tsx index dad12f3180e..8e69a1af6ee 100644 --- a/packages/@mantine/core/src/components/Radio/Radio.story.tsx +++ b/packages/@mantine/core/src/components/Radio/Radio.story.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Checkbox } from '../Checkbox'; -import { Radio } from './Radio'; import { Stack } from '../Stack'; +import { Radio } from './Radio'; export default { title: 'Radio' }; diff --git a/packages/@mantine/core/src/components/Radio/Radio.test.tsx b/packages/@mantine/core/src/components/Radio/Radio.test.tsx index 93396b2412a..d5fa5315030 100644 --- a/packages/@mantine/core/src/components/Radio/Radio.test.tsx +++ b/packages/@mantine/core/src/components/Radio/Radio.test.tsx @@ -1,5 +1,5 @@ import React, { createRef } from 'react'; -import { tests, render } from '@mantine-tests/core'; +import { render, tests } from '@mantine-tests/core'; import { Radio, RadioProps, RadioStylesNames } from './Radio'; import { RadioGroup } from './RadioGroup/RadioGroup'; diff --git a/packages/@mantine/core/src/components/Radio/Radio.tsx b/packages/@mantine/core/src/components/Radio/Radio.tsx index 9a3d58a233b..bbdfe0de014 100644 --- a/packages/@mantine/core/src/components/Radio/Radio.tsx +++ b/packages/@mantine/core/src/components/Radio/Radio.tsx @@ -3,26 +3,26 @@ import { useId } from '@mantine/hooks'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + extractStyleProps, + factory, Factory, - getSize, getRadius, + getSize, getThemeColor, MantineColor, - MantineSize, MantineRadius, - extractStyleProps, + MantineSize, parseThemeColor, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import { InlineInput, InlineInputStylesNames } from '../InlineInput'; -import { RadioIcon, RadioIconProps } from './RadioIcon'; -import { RadioGroup } from './RadioGroup/RadioGroup'; import { useRadioGroupContext } from './RadioGroup.context'; +import { RadioGroup } from './RadioGroup/RadioGroup'; +import { RadioIcon, RadioIconProps } from './RadioIcon'; import classes from './Radio.module.css'; export type RadioVariant = 'filled' | 'outline'; diff --git a/packages/@mantine/core/src/components/Radio/RadioGroup.context.ts b/packages/@mantine/core/src/components/Radio/RadioGroup.context.ts index 5c6189d53c0..0da0ec5d93b 100644 --- a/packages/@mantine/core/src/components/Radio/RadioGroup.context.ts +++ b/packages/@mantine/core/src/components/Radio/RadioGroup.context.ts @@ -1,4 +1,4 @@ -import { MantineSize, createOptionalContext } from '../../core'; +import { createOptionalContext, MantineSize } from '../../core'; interface RadioGroupContextValue { size: MantineSize | undefined; diff --git a/packages/@mantine/core/src/components/Radio/RadioGroup/RadioGroup.test.tsx b/packages/@mantine/core/src/components/Radio/RadioGroup/RadioGroup.test.tsx index 495e178dbae..7075381b463 100644 --- a/packages/@mantine/core/src/components/Radio/RadioGroup/RadioGroup.test.tsx +++ b/packages/@mantine/core/src/components/Radio/RadioGroup/RadioGroup.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, userEvent, screen } from '@mantine-tests/core'; +import { render, screen, tests, userEvent } from '@mantine-tests/core'; import { Radio } from '../Radio'; import { RadioGroup, RadioGroupProps, RadioGroupStylesNames } from './RadioGroup'; diff --git a/packages/@mantine/core/src/components/Radio/RadioGroup/RadioGroup.tsx b/packages/@mantine/core/src/components/Radio/RadioGroup/RadioGroup.tsx index 80b642f6305..2e996d0abd9 100644 --- a/packages/@mantine/core/src/components/Radio/RadioGroup/RadioGroup.tsx +++ b/packages/@mantine/core/src/components/Radio/RadioGroup/RadioGroup.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { useId, useUncontrolled } from '@mantine/hooks'; -import { factory, useProps, MantineSize, Factory } from '../../../core'; -import { InputWrapperStylesNames, Input, InputWrapperProps } from '../../Input'; +import { factory, Factory, MantineSize, useProps } from '../../../core'; +import { Input, InputWrapperProps, InputWrapperStylesNames } from '../../Input'; import { InputsGroupFieldset } from '../../InputsGroupFieldset'; import { RadioGroupProvider } from '../RadioGroup.context'; diff --git a/packages/@mantine/core/src/components/Rating/Rating.tsx b/packages/@mantine/core/src/components/Rating/Rating.tsx index b6316527460..14cee54a450 100644 --- a/packages/@mantine/core/src/components/Rating/Rating.tsx +++ b/packages/@mantine/core/src/components/Rating/Rating.tsx @@ -3,22 +3,22 @@ import { clamp, useId, useMergedRef, useUncontrolled } from '@mantine/hooks'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - MantineSize, - MantineColor, - useDirection, getSize, getThemeColor, + MantineColor, + MantineSize, + StylesApiProps, + useDirection, + useProps, + useStyles, } from '../../core'; import { RatingProvider } from './Rating.context'; -import classes from './Rating.module.css'; import { RatingItem } from './RatingItem/RatingItem'; +import classes from './Rating.module.css'; function roundValueTo(value: number, to: number) { const rounded = Math.round(value / to) * to; diff --git a/packages/@mantine/core/src/components/Rating/RatingItem/RatingItem.tsx b/packages/@mantine/core/src/components/Rating/RatingItem/RatingItem.tsx index ff4301f3f45..0e5c86f4e95 100644 --- a/packages/@mantine/core/src/components/Rating/RatingItem/RatingItem.tsx +++ b/packages/@mantine/core/src/components/Rating/RatingItem/RatingItem.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { MantineSize, BoxProps, ElementProps, Box, useDirection } from '../../../core'; -import { StarSymbol } from '../StarSymbol/StarSymbol'; +import { Box, BoxProps, ElementProps, MantineSize, useDirection } from '../../../core'; import { useRatingContext } from '../Rating.context'; +import { StarSymbol } from '../StarSymbol/StarSymbol'; export interface RatingItemProps extends BoxProps, ElementProps<'input', 'value' | 'size'> { size: MantineSize; diff --git a/packages/@mantine/core/src/components/Rating/StarSymbol/StarSymbol.tsx b/packages/@mantine/core/src/components/Rating/StarSymbol/StarSymbol.tsx index 3ebc6b42d6f..a25ac5b8b22 100644 --- a/packages/@mantine/core/src/components/Rating/StarSymbol/StarSymbol.tsx +++ b/packages/@mantine/core/src/components/Rating/StarSymbol/StarSymbol.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { StarIcon } from './StarIcon'; import { useRatingContext } from '../Rating.context'; +import { StarIcon } from './StarIcon'; export interface StarSymbolProps { type: 'empty' | 'full'; diff --git a/packages/@mantine/core/src/components/RingProgress/Curve/Curve.tsx b/packages/@mantine/core/src/components/RingProgress/Curve/Curve.tsx index 9ae40557d59..e14679cac85 100644 --- a/packages/@mantine/core/src/components/RingProgress/Curve/Curve.tsx +++ b/packages/@mantine/core/src/components/RingProgress/Curve/Curve.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import { useMantineTheme, MantineColor, getThemeColor, GetStylesApi, Box } from '../../../core'; +import { Box, GetStylesApi, getThemeColor, MantineColor, useMantineTheme } from '../../../core'; import { Tooltip } from '../../Tooltip'; -import { getCurveProps } from './get-curve-props'; import type { RingProgressFactory } from '../RingProgress'; +import { getCurveProps } from './get-curve-props'; interface CurveProps extends React.ComponentPropsWithRef<'circle'> { value?: number; diff --git a/packages/@mantine/core/src/components/RingProgress/RingProgress.tsx b/packages/@mantine/core/src/components/RingProgress/RingProgress.tsx index df2bfeaf5d3..e0f042d117c 100644 --- a/packages/@mantine/core/src/components/RingProgress/RingProgress.tsx +++ b/packages/@mantine/core/src/components/RingProgress/RingProgress.tsx @@ -2,19 +2,19 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, MantineColor, rem, + StylesApiProps, + useProps, + useStyles, } from '../../core'; -import classes from './RingProgress.module.css'; -import { getCurves } from './get-curves/get-curves'; import { Curve } from './Curve/Curve'; +import { getCurves } from './get-curves/get-curves'; +import classes from './RingProgress.module.css'; function getClampedThickness(thickness: number, size: number) { return Math.min(thickness || 12, (size || 120) / 4); diff --git a/packages/@mantine/core/src/components/ScrollArea/ScrollArea.tsx b/packages/@mantine/core/src/components/ScrollArea/ScrollArea.tsx index f65baef26a2..1827141ac86 100644 --- a/packages/@mantine/core/src/components/ScrollArea/ScrollArea.tsx +++ b/packages/@mantine/core/src/components/ScrollArea/ScrollArea.tsx @@ -2,21 +2,21 @@ import React, { useState } from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, + createVarsResolver, ElementProps, + factory, + Factory, + rem, + StylesApiProps, useProps, useStyles, - rem, - createVarsResolver, - Factory, } from '../../core'; -import { ScrollAreaScrollbar } from './ScrollAreaScrollbar/ScrollAreaScrollbar'; import { ScrollAreaCorner } from './ScrollAreaCorner/ScrollAreaCorner'; import { ScrollAreaRoot } from './ScrollAreaRoot/ScrollAreaRoot'; +import { ScrollAreaScrollbar } from './ScrollAreaScrollbar/ScrollAreaScrollbar'; +import { ScrollAreaThumb } from './ScrollAreaThumb/ScrollAreaThumb'; import { ScrollAreaViewport } from './ScrollAreaViewport/ScrollAreaViewport'; import classes from './ScrollArea.module.css'; -import { ScrollAreaThumb } from './ScrollAreaThumb/ScrollAreaThumb'; export type ScrollAreaStylesNames = 'root' | 'viewport' | 'scrollbar' | 'thumb' | 'corner'; export type ScrollAreaCssVariables = { diff --git a/packages/@mantine/core/src/components/ScrollArea/ScrollAreaRoot/ScrollAreaRoot.tsx b/packages/@mantine/core/src/components/ScrollArea/ScrollAreaRoot/ScrollAreaRoot.tsx index 751fe1c8c6a..373dedc6747 100644 --- a/packages/@mantine/core/src/components/ScrollArea/ScrollAreaRoot/ScrollAreaRoot.tsx +++ b/packages/@mantine/core/src/components/ScrollArea/ScrollAreaRoot/ScrollAreaRoot.tsx @@ -1,6 +1,6 @@ -import React, { useState, forwardRef } from 'react'; +import React, { forwardRef, useState } from 'react'; import { useMergedRef } from '@mantine/hooks'; -import { Box, BoxProps, ElementProps, useProps, Factory } from '../../../core'; +import { Box, BoxProps, ElementProps, Factory, useProps } from '../../../core'; import { ScrollAreaProvider } from '../ScrollArea.context'; export type ScrollAreaRootStylesNames = diff --git a/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbar.tsx b/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbar.tsx index b9090c9bafd..a2818a476c6 100644 --- a/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbar.tsx +++ b/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbar.tsx @@ -1,12 +1,12 @@ import React from 'react'; import { useScrollAreaContext } from '../ScrollArea.context'; +import { ScrollAreaScrollbarAuto } from './ScrollAreaScrollbarAuto'; +import { ScrollAreaScrollbarHover } from './ScrollAreaScrollbarHover'; +import { ScrollAreaScrollbarScroll } from './ScrollAreaScrollbarScroll'; import { ScrollAreaScrollbarVisible, ScrollAreaScrollbarVisibleProps, } from './ScrollAreaScrollbarVisible'; -import { ScrollAreaScrollbarHover } from './ScrollAreaScrollbarHover'; -import { ScrollAreaScrollbarScroll } from './ScrollAreaScrollbarScroll'; -import { ScrollAreaScrollbarAuto } from './ScrollAreaScrollbarAuto'; interface ScrollAreaScrollbarProps extends ScrollAreaScrollbarVisibleProps { forceMount?: true; diff --git a/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarAuto.tsx b/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarAuto.tsx index 59cf9c4aca0..5e9c1123b00 100644 --- a/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarAuto.tsx +++ b/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarAuto.tsx @@ -1,11 +1,11 @@ import React, { forwardRef, useState } from 'react'; import { useDebounceCallback } from '@mantine/hooks'; import { useScrollAreaContext } from '../ScrollArea.context'; +import { useResizeObserver } from '../use-resize-observer'; import { - ScrollAreaScrollbarVisibleProps, ScrollAreaScrollbarVisible, + ScrollAreaScrollbarVisibleProps, } from './ScrollAreaScrollbarVisible'; -import { useResizeObserver } from '../use-resize-observer'; export interface ScrollAreaScrollbarAutoProps extends ScrollAreaScrollbarVisibleProps { forceMount?: true; diff --git a/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarScroll.tsx b/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarScroll.tsx index 5f5454f03d1..4bacdb469b9 100644 --- a/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarScroll.tsx +++ b/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarScroll.tsx @@ -1,11 +1,11 @@ import React, { forwardRef, useEffect, useState } from 'react'; import { useDebounceCallback } from '@mantine/hooks'; import { useScrollAreaContext } from '../ScrollArea.context'; +import { composeEventHandlers } from '../utils'; import { ScrollAreaScrollbarVisible, ScrollAreaScrollbarVisibleProps, } from './ScrollAreaScrollbarVisible'; -import { composeEventHandlers } from '../utils'; interface ScrollAreaScrollbarScrollProps extends ScrollAreaScrollbarVisibleProps { forceMount?: true; diff --git a/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarVisible.tsx b/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarVisible.tsx index 8e3b7a3b95d..52b1bc00646 100644 --- a/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarVisible.tsx +++ b/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarVisible.tsx @@ -1,14 +1,14 @@ -import React, { useRef, useState, forwardRef } from 'react'; +import React, { forwardRef, useRef, useState } from 'react'; import { useDirection } from '../../../core'; +import { useScrollAreaContext } from '../ScrollArea.context'; import { ScrollAreaScrollbarAxisPrivateProps, ScrollAreaScrollbarAxisProps, Sizes, } from '../ScrollArea.types'; -import { useScrollAreaContext } from '../ScrollArea.context'; +import { getScrollPositionFromPointer, getThumbOffsetFromScroll, getThumbRatio } from '../utils'; import { ScrollAreaScrollbarX } from './ScrollbarX'; import { ScrollAreaScrollbarY } from './ScrollbarY'; -import { getThumbRatio, getThumbOffsetFromScroll, getScrollPositionFromPointer } from '../utils'; export interface ScrollAreaScrollbarVisibleProps extends Omit { diff --git a/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/Scrollbar.tsx b/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/Scrollbar.tsx index dede7496ff4..7888fe7455f 100644 --- a/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/Scrollbar.tsx +++ b/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/Scrollbar.tsx @@ -1,10 +1,10 @@ -import React, { useEffect, forwardRef } from 'react'; -import { useMergedRef, useCallbackRef, useDebounceCallback } from '@mantine/hooks'; -import { useResizeObserver } from '../use-resize-observer'; +import React, { forwardRef, useEffect } from 'react'; +import { useCallbackRef, useDebounceCallback, useMergedRef } from '@mantine/hooks'; import { useScrollAreaContext } from '../ScrollArea.context'; import { Sizes } from '../ScrollArea.types'; -import { ScrollbarProvider, ScrollbarContextValue } from './Scrollbar.context'; +import { useResizeObserver } from '../use-resize-observer'; import { composeEventHandlers } from '../utils'; +import { ScrollbarContextValue, ScrollbarProvider } from './Scrollbar.context'; export interface ScrollbarPrivateProps { sizes: Sizes; diff --git a/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollbarX.tsx b/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollbarX.tsx index f313a3db0d1..67e08e2131f 100644 --- a/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollbarX.tsx +++ b/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollbarX.tsx @@ -1,9 +1,9 @@ -import React, { forwardRef, useRef, useState, useEffect } from 'react'; +import React, { forwardRef, useEffect, useRef, useState } from 'react'; import { useMergedRef } from '@mantine/hooks'; -import { Scrollbar } from './Scrollbar'; -import { ScrollAreaScrollbarAxisProps } from '../ScrollArea.types'; import { useScrollAreaContext } from '../ScrollArea.context'; -import { isScrollingWithinScrollbarBounds, getThumbSize, toInt } from '../utils'; +import { ScrollAreaScrollbarAxisProps } from '../ScrollArea.types'; +import { getThumbSize, isScrollingWithinScrollbarBounds, toInt } from '../utils'; +import { Scrollbar } from './Scrollbar'; export const ScrollAreaScrollbarX = forwardRef( (props, forwardedRef) => { diff --git a/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollbarY.tsx b/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollbarY.tsx index 83d97364435..bed0edc9d52 100644 --- a/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollbarY.tsx +++ b/packages/@mantine/core/src/components/ScrollArea/ScrollAreaScrollbar/ScrollbarY.tsx @@ -1,9 +1,9 @@ import React, { forwardRef, useEffect, useRef } from 'react'; import { useMergedRef } from '@mantine/hooks'; -import { Scrollbar } from './Scrollbar'; import { useScrollAreaContext } from '../ScrollArea.context'; import { ScrollAreaScrollbarAxisProps } from '../ScrollArea.types'; -import { isScrollingWithinScrollbarBounds, getThumbSize, toInt } from '../utils'; +import { getThumbSize, isScrollingWithinScrollbarBounds, toInt } from '../utils'; +import { Scrollbar } from './Scrollbar'; export const ScrollAreaScrollbarY = forwardRef( (props, forwardedRef) => { diff --git a/packages/@mantine/core/src/components/ScrollArea/ScrollAreaThumb/ScrollAreaThumb.tsx b/packages/@mantine/core/src/components/ScrollArea/ScrollAreaThumb/ScrollAreaThumb.tsx index c3ab9f0142a..1ad2a6e5ab7 100644 --- a/packages/@mantine/core/src/components/ScrollArea/ScrollAreaThumb/ScrollAreaThumb.tsx +++ b/packages/@mantine/core/src/components/ScrollArea/ScrollAreaThumb/ScrollAreaThumb.tsx @@ -1,7 +1,7 @@ -import React, { forwardRef, useRef, useEffect } from 'react'; +import React, { forwardRef, useEffect, useRef } from 'react'; import { useDebounceCallback, useMergedRef } from '@mantine/hooks'; -import { useScrollbarContext } from '../ScrollAreaScrollbar/Scrollbar.context'; import { useScrollAreaContext } from '../ScrollArea.context'; +import { useScrollbarContext } from '../ScrollAreaScrollbar/Scrollbar.context'; import { addUnlinkedScrollListener, composeEventHandlers } from '../utils'; interface ThumbProps extends React.ComponentPropsWithoutRef<'div'> {} diff --git a/packages/@mantine/core/src/components/ScrollArea/use-resize-observer.ts b/packages/@mantine/core/src/components/ScrollArea/use-resize-observer.ts index 96b90eba962..de9b579fc7f 100644 --- a/packages/@mantine/core/src/components/ScrollArea/use-resize-observer.ts +++ b/packages/@mantine/core/src/components/ScrollArea/use-resize-observer.ts @@ -1,4 +1,4 @@ -import { useIsomorphicEffect, useCallbackRef } from '@mantine/hooks'; +import { useCallbackRef, useIsomorphicEffect } from '@mantine/hooks'; export function useResizeObserver(element: HTMLElement | null, onResize: () => void) { const handleResize = useCallbackRef(onResize); diff --git a/packages/@mantine/core/src/components/SegmentedControl/SegmentedControl.story.tsx b/packages/@mantine/core/src/components/SegmentedControl/SegmentedControl.story.tsx index 282ce57f14e..a93ee2a7801 100644 --- a/packages/@mantine/core/src/components/SegmentedControl/SegmentedControl.story.tsx +++ b/packages/@mantine/core/src/components/SegmentedControl/SegmentedControl.story.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { SegmentedControl } from './SegmentedControl'; import { MantineThemeProvider } from '../../core'; +import { SegmentedControl } from './SegmentedControl'; export default { title: 'SegmentedControl' }; diff --git a/packages/@mantine/core/src/components/SegmentedControl/SegmentedControl.tsx b/packages/@mantine/core/src/components/SegmentedControl/SegmentedControl.tsx index 88bac5b84d7..40726482573 100644 --- a/packages/@mantine/core/src/components/SegmentedControl/SegmentedControl.tsx +++ b/packages/@mantine/core/src/components/SegmentedControl/SegmentedControl.tsx @@ -3,29 +3,29 @@ import { useId, useMergedRef, useResizeObserver, - useUncontrolled, useTimeout, + useUncontrolled, } from '@mantine/hooks'; import { Box, BoxProps, - StylesApiProps, - factory, + createVarsResolver, ElementProps, - useProps, - useStyles, - MantineColor, - MantineSize, - MantineRadius, - useMantineTheme, + Factory, + factory, + getEnv, + getFontSize, getRadius, - getThemeColor, getSize, - getFontSize, + getThemeColor, + MantineColor, + MantineRadius, + MantineSize, + StylesApiProps, useDirection, - createVarsResolver, - Factory, - getEnv, + useMantineTheme, + useProps, + useStyles, } from '../../core'; import { getRootPadding } from './get-root-padding'; import classes from './SegmentedControl.module.css'; diff --git a/packages/@mantine/core/src/components/Select/Select.story.tsx b/packages/@mantine/core/src/components/Select/Select.story.tsx index 58fcfa72ab9..62ee3f50460 100644 --- a/packages/@mantine/core/src/components/Select/Select.story.tsx +++ b/packages/@mantine/core/src/components/Select/Select.story.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { Select } from './Select'; import { Button } from '../Button'; +import { Select } from './Select'; export default { title: 'Select' }; diff --git a/packages/@mantine/core/src/components/Select/Select.test.tsx b/packages/@mantine/core/src/components/Select/Select.test.tsx index 38b313711fe..5954b354fee 100644 --- a/packages/@mantine/core/src/components/Select/Select.test.tsx +++ b/packages/@mantine/core/src/components/Select/Select.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { tests, inputDefaultProps, inputStylesApiSelectors } from '@mantine-tests/core'; +import { inputDefaultProps, inputStylesApiSelectors, tests } from '@mantine-tests/core'; import { Select, SelectProps, SelectStylesNames } from './Select'; const defaultProps: SelectProps = { diff --git a/packages/@mantine/core/src/components/Select/Select.tsx b/packages/@mantine/core/src/components/Select/Select.tsx index 05c5d9be9c2..843eb0eacd5 100644 --- a/packages/@mantine/core/src/components/Select/Select.tsx +++ b/packages/@mantine/core/src/components/Select/Select.tsx @@ -2,25 +2,25 @@ import React, { useEffect, useMemo } from 'react'; import { useId, useUncontrolled } from '@mantine/hooks'; import { BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, Factory, + factory, + StylesApiProps, + useProps, useResolvedStylesApi, } from '../../core'; -import { InputBase } from '../InputBase'; import { __CloseButtonProps } from '../CloseButton'; -import { __InputStylesNames, __BaseInputProps, InputVariant } from '../Input'; import { Combobox, - OptionsDropdown, - useCombobox, - getParsedComboboxData, - getOptionsLockup, ComboboxLikeProps, ComboboxLikeStylesNames, + getOptionsLockup, + getParsedComboboxData, + OptionsDropdown, + useCombobox, } from '../Combobox'; +import { __BaseInputProps, __InputStylesNames, InputVariant } from '../Input'; +import { InputBase } from '../InputBase'; export type SelectStylesNames = __InputStylesNames | ComboboxLikeStylesNames; diff --git a/packages/@mantine/core/src/components/SimpleGrid/SimpleGrid.tsx b/packages/@mantine/core/src/components/SimpleGrid/SimpleGrid.tsx index 225ec62571c..bc4a659fd34 100644 --- a/packages/@mantine/core/src/components/SimpleGrid/SimpleGrid.tsx +++ b/packages/@mantine/core/src/components/SimpleGrid/SimpleGrid.tsx @@ -2,15 +2,15 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, - useStyles, Factory, - useRandomClassName, - StyleProp, + factory, MantineSpacing, + StyleProp, + StylesApiProps, + useProps, + useRandomClassName, + useStyles, } from '../../core'; import { SimpleGridVariables } from './SimpleGridVariables'; import classes from './SimpleGrid.module.css'; diff --git a/packages/@mantine/core/src/components/SimpleGrid/SimpleGridVariables.tsx b/packages/@mantine/core/src/components/SimpleGrid/SimpleGridVariables.tsx index 1120a9adf65..c854727b860 100644 --- a/packages/@mantine/core/src/components/SimpleGrid/SimpleGridVariables.tsx +++ b/packages/@mantine/core/src/components/SimpleGrid/SimpleGridVariables.tsx @@ -1,13 +1,13 @@ import React from 'react'; import { + filterProps, + getBaseValue, getSortedBreakpoints, - useMantineTheme, - keys, getSpacing, - MantineBreakpoint, - filterProps, InlineStyles, - getBaseValue, + keys, + MantineBreakpoint, + useMantineTheme, } from '../../core'; import type { SimpleGridProps } from './SimpleGrid'; diff --git a/packages/@mantine/core/src/components/Skeleton/Skeleton.tsx b/packages/@mantine/core/src/components/Skeleton/Skeleton.tsx index 1c84185e404..61ab4c3848c 100644 --- a/packages/@mantine/core/src/components/Skeleton/Skeleton.tsx +++ b/packages/@mantine/core/src/components/Skeleton/Skeleton.tsx @@ -2,15 +2,15 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - rem, getRadius, + rem, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import classes from './Skeleton.module.css'; diff --git a/packages/@mantine/core/src/components/Slider/Marks/Marks.tsx b/packages/@mantine/core/src/components/Slider/Marks/Marks.tsx index 036e4a23d80..d9574b86545 100644 --- a/packages/@mantine/core/src/components/Slider/Marks/Marks.tsx +++ b/packages/@mantine/core/src/components/Slider/Marks/Marks.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { Box } from '../../../core'; +import { useSliderContext } from '../Slider.context'; import { getPosition } from '../utils/get-position/get-position'; import { isMarkFilled } from './is-mark-filled'; -import { useSliderContext } from '../Slider.context'; export interface MarksProps { marks: { value: number; label?: React.ReactNode }[] | undefined; diff --git a/packages/@mantine/core/src/components/Slider/RangeSlider/RangeSlider.test.tsx b/packages/@mantine/core/src/components/Slider/RangeSlider/RangeSlider.test.tsx index 89fe6f5e127..69721fe8478 100644 --- a/packages/@mantine/core/src/components/Slider/RangeSlider/RangeSlider.test.tsx +++ b/packages/@mantine/core/src/components/Slider/RangeSlider/RangeSlider.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { render, tests } from '@mantine-tests/core'; -import { RangeSlider, RangeSliderProps } from './RangeSlider'; import { SliderStylesNames } from '../Slider.context'; +import { RangeSlider, RangeSliderProps } from './RangeSlider'; const defaultProps: RangeSliderProps = { marks: [{ value: 0, label: 'test-mark' }], diff --git a/packages/@mantine/core/src/components/Slider/RangeSlider/RangeSlider.tsx b/packages/@mantine/core/src/components/Slider/RangeSlider/RangeSlider.tsx index c83ac5466e8..0b92de98b78 100644 --- a/packages/@mantine/core/src/components/Slider/RangeSlider/RangeSlider.tsx +++ b/packages/@mantine/core/src/components/Slider/RangeSlider/RangeSlider.tsx @@ -2,32 +2,32 @@ import React, { useEffect, useRef, useState } from 'react'; import { useMove, useUncontrolled } from '@mantine/hooks'; import { BoxProps, - StylesApiProps, - factory, + createVarsResolver, ElementProps, - useProps, - MantineColor, - MantineRadius, - MantineSize, - useDirection, + factory, Factory, - createVarsResolver, + getRadius, getSize, getThemeColor, - getRadius, + MantineColor, + MantineRadius, + MantineSize, rem, + StylesApiProps, + useDirection, + useProps, useStyles, } from '../../../core'; import { TransitionOverride } from '../../Transition'; -import { SliderStylesNames, SliderProvider, SliderCssVariables } from '../Slider.context'; +import { SliderCssVariables, SliderProvider, SliderStylesNames } from '../Slider.context'; import { SliderRoot } from '../SliderRoot/SliderRoot'; -import { Track } from '../Track/Track'; import { Thumb } from '../Thumb/Thumb'; -import { getPosition } from '../utils/get-position/get-position'; +import { Track } from '../Track/Track'; import { getChangeValue } from '../utils/get-change-value/get-change-value'; -import { getPrecision } from '../utils/get-precision/get-precision'; -import { getFloatingValue } from '../utils/get-floating-value/get-gloating-value'; import { getClientPosition } from '../utils/get-client-position/get-client-position'; +import { getFloatingValue } from '../utils/get-floating-value/get-gloating-value'; +import { getPosition } from '../utils/get-position/get-position'; +import { getPrecision } from '../utils/get-precision/get-precision'; import classes from '../Slider.module.css'; export type RangeSliderValue = [number, number]; diff --git a/packages/@mantine/core/src/components/Slider/Slider.story.tsx b/packages/@mantine/core/src/components/Slider/Slider.story.tsx index bae7f787850..d7b1d3f32ce 100644 --- a/packages/@mantine/core/src/components/Slider/Slider.story.tsx +++ b/packages/@mantine/core/src/components/Slider/Slider.story.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { Slider } from './Slider/Slider'; import { RangeSlider } from './RangeSlider/RangeSlider'; +import { Slider } from './Slider/Slider'; export default { title: 'Slider' }; diff --git a/packages/@mantine/core/src/components/Slider/Slider/Slider.test.tsx b/packages/@mantine/core/src/components/Slider/Slider/Slider.test.tsx index 3d40c2e0563..0372be75a73 100644 --- a/packages/@mantine/core/src/components/Slider/Slider/Slider.test.tsx +++ b/packages/@mantine/core/src/components/Slider/Slider/Slider.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { render, tests, userEvent, screen } from '@mantine-tests/core'; -import { Slider, SliderProps } from './Slider'; +import { render, screen, tests, userEvent } from '@mantine-tests/core'; import { SliderStylesNames } from '../Slider.context'; +import { Slider, SliderProps } from './Slider'; const defaultProps: SliderProps = { marks: [{ value: 0, label: 'test-mark' }], diff --git a/packages/@mantine/core/src/components/Slider/Slider/Slider.tsx b/packages/@mantine/core/src/components/Slider/Slider/Slider.tsx index 45ab41cb22b..72da08c7389 100644 --- a/packages/@mantine/core/src/components/Slider/Slider/Slider.tsx +++ b/packages/@mantine/core/src/components/Slider/Slider/Slider.tsx @@ -2,31 +2,31 @@ import React, { useCallback, useRef, useState } from 'react'; import { clamp, useMergedRef, useMove, useUncontrolled } from '@mantine/hooks'; import { BoxProps, - StylesApiProps, - factory, + createVarsResolver, ElementProps, - useProps, + factory, + Factory, + getRadius, + getSize, + getThemeColor, MantineColor, MantineRadius, MantineSize, + rem, + StylesApiProps, useDirection, - Factory, + useProps, useStyles, - createVarsResolver, - getSize, - getThemeColor, - getRadius, - rem, } from '../../../core'; import { TransitionOverride } from '../../Transition'; +import { SliderCssVariables, SliderProvider, SliderStylesNames } from '../Slider.context'; import { SliderRoot } from '../SliderRoot/SliderRoot'; -import { Track } from '../Track/Track'; import { Thumb } from '../Thumb/Thumb'; -import { getPosition } from '../utils/get-position/get-position'; +import { Track } from '../Track/Track'; import { getChangeValue } from '../utils/get-change-value/get-change-value'; import { getFloatingValue } from '../utils/get-floating-value/get-gloating-value'; +import { getPosition } from '../utils/get-position/get-position'; import { getPrecision } from '../utils/get-precision/get-precision'; -import { SliderCssVariables, SliderProvider, SliderStylesNames } from '../Slider.context'; import classes from '../Slider.module.css'; export interface SliderProps diff --git a/packages/@mantine/core/src/components/Slider/SliderRoot/SliderRoot.tsx b/packages/@mantine/core/src/components/Slider/SliderRoot/SliderRoot.tsx index eaf2842cf1e..dc3619bb543 100644 --- a/packages/@mantine/core/src/components/Slider/SliderRoot/SliderRoot.tsx +++ b/packages/@mantine/core/src/components/Slider/SliderRoot/SliderRoot.tsx @@ -1,11 +1,11 @@ import React, { forwardRef } from 'react'; import { - BoxProps, Box, + BoxProps, ElementProps, - MantineSize, MantineColor, MantineRadius, + MantineSize, } from '../../../core'; import { useSliderContext } from '../Slider.context'; diff --git a/packages/@mantine/core/src/components/Slider/Thumb/Thumb.tsx b/packages/@mantine/core/src/components/Slider/Thumb/Thumb.tsx index 60986d0f4d1..02dcea614fa 100644 --- a/packages/@mantine/core/src/components/Slider/Thumb/Thumb.tsx +++ b/packages/@mantine/core/src/components/Slider/Thumb/Thumb.tsx @@ -1,4 +1,4 @@ -import React, { useState, forwardRef } from 'react'; +import React, { forwardRef, useState } from 'react'; import { Box } from '../../../core'; import { Transition, TransitionOverride } from '../../Transition'; import { useSliderContext } from '../Slider.context'; diff --git a/packages/@mantine/core/src/components/Space/Space.tsx b/packages/@mantine/core/src/components/Space/Space.tsx index d1b0b9e150f..d71d06ba22f 100644 --- a/packages/@mantine/core/src/components/Space/Space.tsx +++ b/packages/@mantine/core/src/components/Space/Space.tsx @@ -2,11 +2,11 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + StylesApiProps, + useProps, } from '../../core'; export interface SpaceProps extends BoxProps, StylesApiProps, ElementProps<'div'> {} diff --git a/packages/@mantine/core/src/components/Spoiler/Spoiler.tsx b/packages/@mantine/core/src/components/Spoiler/Spoiler.tsx index d2bff9352c1..d831034c065 100644 --- a/packages/@mantine/core/src/components/Spoiler/Spoiler.tsx +++ b/packages/@mantine/core/src/components/Spoiler/Spoiler.tsx @@ -3,14 +3,14 @@ import { useElementSize, useId } from '@mantine/hooks'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, rem, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import { Anchor } from '../Anchor'; import classes from './Spoiler.module.css'; diff --git a/packages/@mantine/core/src/components/Stack/Stack.tsx b/packages/@mantine/core/src/components/Stack/Stack.tsx index 122adc7a3cd..7ace7098c73 100644 --- a/packages/@mantine/core/src/components/Stack/Stack.tsx +++ b/packages/@mantine/core/src/components/Stack/Stack.tsx @@ -2,15 +2,15 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, + createVarsResolver, ElementProps, + factory, + Factory, + getSpacing, + MantineSpacing, + StylesApiProps, useProps, useStyles, - MantineSpacing, - getSpacing, - createVarsResolver, - Factory, } from '../../core'; import classes from './Stack.module.css'; diff --git a/packages/@mantine/core/src/components/Stepper/Stepper.story.tsx b/packages/@mantine/core/src/components/Stepper/Stepper.story.tsx index d7eddbcb516..5f05db0b31e 100644 --- a/packages/@mantine/core/src/components/Stepper/Stepper.story.tsx +++ b/packages/@mantine/core/src/components/Stepper/Stepper.story.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; -import { Stepper } from './Stepper'; import { Button } from '../Button'; import { Group } from '../Group'; +import { Stepper } from './Stepper'; export default { title: 'Stepper' }; diff --git a/packages/@mantine/core/src/components/Stepper/Stepper.test.tsx b/packages/@mantine/core/src/components/Stepper/Stepper.test.tsx index 5d5fc9e44a4..7a51f2d2dcf 100644 --- a/packages/@mantine/core/src/components/Stepper/Stepper.test.tsx +++ b/packages/@mantine/core/src/components/Stepper/Stepper.test.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import { render, tests, screen, userEvent } from '@mantine-tests/core'; +import { render, screen, tests, userEvent } from '@mantine-tests/core'; import { Stepper, StepperProps, StepperStylesNames } from './Stepper'; -import { StepperStep } from './StepperStep/StepperStep'; import { StepperCompleted } from './StepperCompleted/StepperCompleted'; +import { StepperStep } from './StepperStep/StepperStep'; const defaultProps: StepperProps = { active: 1, diff --git a/packages/@mantine/core/src/components/Stepper/Stepper.tsx b/packages/@mantine/core/src/components/Stepper/Stepper.tsx index d20398fc99c..3b62bc26f9a 100644 --- a/packages/@mantine/core/src/components/Stepper/Stepper.tsx +++ b/packages/@mantine/core/src/components/Stepper/Stepper.tsx @@ -2,27 +2,27 @@ import React, { Children, cloneElement } from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, + getFontSize, + getRadius, + getSize, + getSpacing, + getThemeColor, MantineColor, - MantineSpacing, - MantineSize, MantineRadius, - getThemeColor, + MantineSize, + MantineSpacing, rem, - getSize, - getSpacing, - getRadius, - getFontSize, + StylesApiProps, + useProps, + useStyles, } from '../../core'; -import { StepperStep } from './StepperStep/StepperStep'; -import { StepperCompleted } from './StepperCompleted/StepperCompleted'; import { StepperProvider } from './Stepper.context'; +import { StepperCompleted } from './StepperCompleted/StepperCompleted'; +import { StepperStep } from './StepperStep/StepperStep'; import classes from './Stepper.module.css'; export type StepFragmentComponent = React.FC<{ step: number }>; diff --git a/packages/@mantine/core/src/components/Stepper/StepperStep/StepperStep.test.tsx b/packages/@mantine/core/src/components/Stepper/StepperStep/StepperStep.test.tsx index e2defdee3a1..4c61062a907 100644 --- a/packages/@mantine/core/src/components/Stepper/StepperStep/StepperStep.test.tsx +++ b/packages/@mantine/core/src/components/Stepper/StepperStep/StepperStep.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { render, tests, createContextContainer, screen } from '@mantine-tests/core'; -import { StepperStep, StepperStepProps, StepperStepStylesNames } from './StepperStep'; +import { createContextContainer, render, screen, tests } from '@mantine-tests/core'; import { Stepper } from '../Stepper'; +import { StepperStep, StepperStepProps, StepperStepStylesNames } from './StepperStep'; const TestContainer = createContextContainer(StepperStep, Stepper, { active: 0 }); diff --git a/packages/@mantine/core/src/components/Stepper/StepperStep/StepperStep.tsx b/packages/@mantine/core/src/components/Stepper/StepperStep/StepperStep.tsx index e1884c7f617..eac3765b4bd 100644 --- a/packages/@mantine/core/src/components/Stepper/StepperStep/StepperStep.tsx +++ b/packages/@mantine/core/src/components/Stepper/StepperStep/StepperStep.tsx @@ -2,18 +2,18 @@ import React from 'react'; import { BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, - MantineColor, getThemeColor, + MantineColor, useMantineTheme, + useProps, } from '../../../core'; -import { UnstyledButton } from '../../UnstyledButton'; -import { Transition } from '../../Transition'; -import { Loader } from '../../Loader'; import { CheckIcon } from '../../Checkbox'; +import { Loader } from '../../Loader'; +import { Transition } from '../../Transition'; +import { UnstyledButton } from '../../UnstyledButton'; import type { StepFragmentComponent } from '../Stepper'; import { useStepperContext } from '../Stepper.context'; import classes from '../Stepper.module.css'; diff --git a/packages/@mantine/core/src/components/Switch/Switch.story.tsx b/packages/@mantine/core/src/components/Switch/Switch.story.tsx index 2b3b7b84ef7..8c5c45d6cc4 100644 --- a/packages/@mantine/core/src/components/Switch/Switch.story.tsx +++ b/packages/@mantine/core/src/components/Switch/Switch.story.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { IconBadge } from '@tabler/icons-react'; import { Group } from '../Group'; -import { Switch } from './Switch'; import { Stack } from '../Stack'; +import { Switch } from './Switch'; export default { title: 'Switch' }; diff --git a/packages/@mantine/core/src/components/Switch/Switch.test.tsx b/packages/@mantine/core/src/components/Switch/Switch.test.tsx index 81576d0e56b..5fb28e265ca 100644 --- a/packages/@mantine/core/src/components/Switch/Switch.test.tsx +++ b/packages/@mantine/core/src/components/Switch/Switch.test.tsx @@ -1,5 +1,5 @@ import React, { createRef } from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { Switch, SwitchProps, SwitchStylesNames } from './Switch'; import { SwitchGroup } from './SwitchGroup/SwitchGroup'; diff --git a/packages/@mantine/core/src/components/Switch/Switch.tsx b/packages/@mantine/core/src/components/Switch/Switch.tsx index ead317abccb..1f39c1912a6 100644 --- a/packages/@mantine/core/src/components/Switch/Switch.tsx +++ b/packages/@mantine/core/src/components/Switch/Switch.tsx @@ -1,24 +1,24 @@ import React from 'react'; import { useId, useUncontrolled } from '@mantine/hooks'; import { + Box, BoxProps, - StylesApiProps, - factory, + createVarsResolver, ElementProps, - useProps, - useStyles, - MantineColor, - MantineSize, - MantineRadius, extractStyleProps, + factory, + Factory, getRadius, - Box, getSize, getThemeColor, - createVarsResolver, - Factory, + MantineColor, + MantineRadius, + MantineSize, + StylesApiProps, + useProps, + useStyles, } from '../../core'; -import { InlineInput, InlineInputStylesNames, InlineInputClasses } from '../InlineInput'; +import { InlineInput, InlineInputClasses, InlineInputStylesNames } from '../InlineInput'; import { useSwitchGroupContext } from './SwitchGroup.context'; import { SwitchGroup } from './SwitchGroup/SwitchGroup'; import classes from './Switch.module.css'; diff --git a/packages/@mantine/core/src/components/Switch/SwitchGroup/SwitchGroup.test.tsx b/packages/@mantine/core/src/components/Switch/SwitchGroup/SwitchGroup.test.tsx index bf1efac9d4b..d8f8196a288 100644 --- a/packages/@mantine/core/src/components/Switch/SwitchGroup/SwitchGroup.test.tsx +++ b/packages/@mantine/core/src/components/Switch/SwitchGroup/SwitchGroup.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, userEvent, screen } from '@mantine-tests/core'; +import { render, screen, tests, userEvent } from '@mantine-tests/core'; import { Switch } from '../Switch'; import { SwitchGroup, SwitchGroupProps, SwitchGroupStylesNames } from './SwitchGroup'; diff --git a/packages/@mantine/core/src/components/Switch/SwitchGroup/SwitchGroup.tsx b/packages/@mantine/core/src/components/Switch/SwitchGroup/SwitchGroup.tsx index 23be05c4b45..4d222138c95 100644 --- a/packages/@mantine/core/src/components/Switch/SwitchGroup/SwitchGroup.tsx +++ b/packages/@mantine/core/src/components/Switch/SwitchGroup/SwitchGroup.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { useUncontrolled } from '@mantine/hooks'; -import { factory, useProps, MantineSize, Factory } from '../../../core'; -import { InputWrapperStylesNames, Input, InputWrapperProps } from '../../Input'; +import { factory, Factory, MantineSize, useProps } from '../../../core'; +import { Input, InputWrapperProps, InputWrapperStylesNames } from '../../Input'; import { InputsGroupFieldset } from '../../InputsGroupFieldset'; import { SwitchGroupProvider } from '../SwitchGroup.context'; diff --git a/packages/@mantine/core/src/components/Table/Table.components.test.tsx b/packages/@mantine/core/src/components/Table/Table.components.test.tsx index 9628baac6d8..17e8d8f2d13 100644 --- a/packages/@mantine/core/src/components/Table/Table.components.test.tsx +++ b/packages/@mantine/core/src/components/Table/Table.components.test.tsx @@ -1,14 +1,13 @@ import React from 'react'; import { - render, - tests, createContextContainer, patchConsoleError, + render, screen, + tests, } from '@mantine-tests/core'; +import { Table } from './Table'; import { - TableTh, - TableThProps, TableCaption, TableCaptionProps, TableTbody, @@ -17,12 +16,13 @@ import { TableTdProps, TableTfoot, TableTfootProps, - TableTr, - TableTrProps, + TableTh, TableThead, TableTheadProps, + TableThProps, + TableTr, + TableTrProps, } from './Table.components'; -import { Table } from './Table'; describe('@mantine/core/Table', () => { beforeAll(patchConsoleError); diff --git a/packages/@mantine/core/src/components/Table/Table.components.tsx b/packages/@mantine/core/src/components/Table/Table.components.tsx index 7ebebc46a50..96031c8ef44 100644 --- a/packages/@mantine/core/src/components/Table/Table.components.tsx +++ b/packages/@mantine/core/src/components/Table/Table.components.tsx @@ -5,12 +5,12 @@ import { CompoundStylesApiProps, ElementProps, factory, - useProps, - FactoryPayload, Factory, + FactoryPayload, + useProps, } from '../../core'; -import { useTableContext, TableContextValue } from './Table.context'; import type { TableFactory } from './Table'; +import { TableContextValue, useTableContext } from './Table.context'; import classes from './Table.module.css'; export interface TableElementProps diff --git a/packages/@mantine/core/src/components/Table/Table.test.tsx b/packages/@mantine/core/src/components/Table/Table.test.tsx index 6647166b62f..66c71f6770c 100644 --- a/packages/@mantine/core/src/components/Table/Table.test.tsx +++ b/packages/@mantine/core/src/components/Table/Table.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { Table, TableProps, TableStylesNames } from './Table'; import { TableCaption, @@ -7,8 +7,8 @@ import { TableTd, TableTfoot, TableTh, - TableTr, TableThead, + TableTr, } from './Table.components'; const defaultProps: TableProps = { diff --git a/packages/@mantine/core/src/components/Table/Table.tsx b/packages/@mantine/core/src/components/Table/Table.tsx index f63c78be1fd..97bb635255c 100644 --- a/packages/@mantine/core/src/components/Table/Table.tsx +++ b/packages/@mantine/core/src/components/Table/Table.tsx @@ -2,18 +2,18 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, + createVarsResolver, ElementProps, - useProps, - useStyles, - MantineColor, - MantineSpacing, + factory, + Factory, getSpacing, getThemeColor, - createVarsResolver, - Factory, + MantineColor, + MantineSpacing, rem, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import { TableCaption, @@ -21,12 +21,12 @@ import { TableTd, TableTfoot, TableTh, - TableTr, TableThead, + TableTr, } from './Table.components'; +import { TableProvider } from './Table.context'; import { TableDataRenderer } from './TableDataRenderer'; import { TableScrollContainer } from './TableScrollContainer'; -import { TableProvider } from './Table.context'; import classes from './Table.module.css'; export type TableStylesNames = diff --git a/packages/@mantine/core/src/components/Table/TableDataRenderer.tsx b/packages/@mantine/core/src/components/Table/TableDataRenderer.tsx index 0a8bb23927a..cb6641cbefa 100644 --- a/packages/@mantine/core/src/components/Table/TableDataRenderer.tsx +++ b/packages/@mantine/core/src/components/Table/TableDataRenderer.tsx @@ -1,14 +1,14 @@ import React from 'react'; +import type { TableData } from './Table'; import { - TableTd, - TableTr, - TableTh, + TableCaption, TableTbody, + TableTd, TableTfoot, + TableTh, TableThead, - TableCaption, + TableTr, } from './Table.components'; -import type { TableData } from './Table'; export interface TableDataRendererProps { data: TableData; diff --git a/packages/@mantine/core/src/components/Table/TableScrollContainer.tsx b/packages/@mantine/core/src/components/Table/TableScrollContainer.tsx index 9dc1216e02c..1d2b9deac8f 100644 --- a/packages/@mantine/core/src/components/Table/TableScrollContainer.tsx +++ b/packages/@mantine/core/src/components/Table/TableScrollContainer.tsx @@ -2,14 +2,14 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, rem, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import { ScrollArea } from '../ScrollArea'; import classes from './Table.module.css'; diff --git a/packages/@mantine/core/src/components/Tabs/Tabs.test.tsx b/packages/@mantine/core/src/components/Tabs/Tabs.test.tsx index fef3adbdfaa..03fb973da0c 100644 --- a/packages/@mantine/core/src/components/Tabs/Tabs.test.tsx +++ b/packages/@mantine/core/src/components/Tabs/Tabs.test.tsx @@ -1,10 +1,10 @@ import React from 'react'; -import { tests, render, userEvent, screen } from '@mantine-tests/core'; +import { render, screen, tests, userEvent } from '@mantine-tests/core'; import { DirectionProvider } from '../../core'; -import { TabsTab } from './TabsTab/TabsTab'; +import { Tabs, TabsProps, TabsStylesNames } from './Tabs'; import { TabsList } from './TabsList/TabsList'; import { TabsPanel } from './TabsPanel/TabsPanel'; -import { Tabs, TabsProps, TabsStylesNames } from './Tabs'; +import { TabsTab } from './TabsTab/TabsTab'; const defaultProps: TabsProps = { children: ( diff --git a/packages/@mantine/core/src/components/Tabs/Tabs.tsx b/packages/@mantine/core/src/components/Tabs/Tabs.tsx index aaddd8836ed..81f5fd85ead 100644 --- a/packages/@mantine/core/src/components/Tabs/Tabs.tsx +++ b/packages/@mantine/core/src/components/Tabs/Tabs.tsx @@ -3,18 +3,18 @@ import { useId, useUncontrolled } from '@mantine/hooks'; import { Box, BoxProps, + createVarsResolver, + ElementProps, + factory, + Factory, + getRadius, + getSafeId, + getThemeColor, MantineColor, MantineRadius, StylesApiProps, - factory, useProps, - getSafeId, useStyles, - ElementProps, - getRadius, - getThemeColor, - createVarsResolver, - Factory, } from '../../core'; import { TabsProvider } from './Tabs.context'; import { TabsList, TabsListStylesNames } from './TabsList/TabsList'; diff --git a/packages/@mantine/core/src/components/Tabs/TabsList/TabsList.test.tsx b/packages/@mantine/core/src/components/Tabs/TabsList/TabsList.test.tsx index a209acd9436..e3461e10506 100644 --- a/packages/@mantine/core/src/components/Tabs/TabsList/TabsList.test.tsx +++ b/packages/@mantine/core/src/components/Tabs/TabsList/TabsList.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { tests, render, createContextContainer, screen } from '@mantine-tests/core'; +import { createContextContainer, render, screen, tests } from '@mantine-tests/core'; import { Tabs } from '../Tabs'; import { TabsList, TabsListProps, TabsListStylesNames } from './TabsList'; diff --git a/packages/@mantine/core/src/components/Tabs/TabsList/TabsList.tsx b/packages/@mantine/core/src/components/Tabs/TabsList/TabsList.tsx index d7548e8bef3..ac5ba2d46f2 100644 --- a/packages/@mantine/core/src/components/Tabs/TabsList/TabsList.tsx +++ b/packages/@mantine/core/src/components/Tabs/TabsList/TabsList.tsx @@ -2,11 +2,11 @@ import React from 'react'; import { Box, BoxProps, - useProps, - factory, - ElementProps, CompoundStylesApiProps, + ElementProps, + factory, Factory, + useProps, } from '../../../core'; import { useTabsContext } from '../Tabs.context'; import classes from '../Tabs.module.css'; diff --git a/packages/@mantine/core/src/components/Tabs/TabsPanel/TabsPanel.test.tsx b/packages/@mantine/core/src/components/Tabs/TabsPanel/TabsPanel.test.tsx index aa5f908e5d3..f8678af158e 100644 --- a/packages/@mantine/core/src/components/Tabs/TabsPanel/TabsPanel.test.tsx +++ b/packages/@mantine/core/src/components/Tabs/TabsPanel/TabsPanel.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { tests, render, createContextContainer, screen } from '@mantine-tests/core'; +import { createContextContainer, render, screen, tests } from '@mantine-tests/core'; import { Tabs } from '../Tabs'; import { TabsPanel, TabsPanelProps, TabsPanelStylesNames } from './TabsPanel'; diff --git a/packages/@mantine/core/src/components/Tabs/TabsPanel/TabsPanel.tsx b/packages/@mantine/core/src/components/Tabs/TabsPanel/TabsPanel.tsx index 771c450ac00..e931fa042d1 100644 --- a/packages/@mantine/core/src/components/Tabs/TabsPanel/TabsPanel.tsx +++ b/packages/@mantine/core/src/components/Tabs/TabsPanel/TabsPanel.tsx @@ -2,11 +2,11 @@ import React from 'react'; import { Box, BoxProps, - useProps, - factory, - ElementProps, CompoundStylesApiProps, + ElementProps, + factory, Factory, + useProps, } from '../../../core'; import { useTabsContext } from '../Tabs.context'; import classes from '../Tabs.module.css'; diff --git a/packages/@mantine/core/src/components/Tabs/TabsTab/TabsTab.test.tsx b/packages/@mantine/core/src/components/Tabs/TabsTab/TabsTab.test.tsx index b8a5c58f80b..30a84006dc2 100644 --- a/packages/@mantine/core/src/components/Tabs/TabsTab/TabsTab.test.tsx +++ b/packages/@mantine/core/src/components/Tabs/TabsTab/TabsTab.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { tests, createContextContainer, render, userEvent, screen } from '@mantine-tests/core'; -import { TabsTab, TabsTabProps, TabsTabStylesNames } from './TabsTab'; +import { createContextContainer, render, screen, tests, userEvent } from '@mantine-tests/core'; import { Tabs } from '../Tabs'; +import { TabsTab, TabsTabProps, TabsTabStylesNames } from './TabsTab'; const defaultProps: TabsTabProps = { value: 'test', diff --git a/packages/@mantine/core/src/components/Tabs/TabsTab/TabsTab.tsx b/packages/@mantine/core/src/components/Tabs/TabsTab/TabsTab.tsx index fc030002902..a854423a6cf 100644 --- a/packages/@mantine/core/src/components/Tabs/TabsTab/TabsTab.tsx +++ b/packages/@mantine/core/src/components/Tabs/TabsTab/TabsTab.tsx @@ -1,15 +1,15 @@ import React from 'react'; import { - useProps, - factory, + CompoundStylesApiProps, + createScopedKeydownHandler, ElementProps, + factory, + Factory, + getThemeColor, MantineColor, - createScopedKeydownHandler, useDirection, useMantineTheme, - getThemeColor, - CompoundStylesApiProps, - Factory, + useProps, } from '../../../core'; import { UnstyledButton, UnstyledButtonProps } from '../../UnstyledButton'; import { useTabsContext } from '../Tabs.context'; diff --git a/packages/@mantine/core/src/components/TagsInput/TagsInput.story.tsx b/packages/@mantine/core/src/components/TagsInput/TagsInput.story.tsx index c214fd84174..35e683e720d 100644 --- a/packages/@mantine/core/src/components/TagsInput/TagsInput.story.tsx +++ b/packages/@mantine/core/src/components/TagsInput/TagsInput.story.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; -import { TagsInput } from './TagsInput'; import { Button } from '../Button'; +import { TagsInput } from './TagsInput'; export default { title: 'TagsInput' }; diff --git a/packages/@mantine/core/src/components/TagsInput/TagsInput.test.tsx b/packages/@mantine/core/src/components/TagsInput/TagsInput.test.tsx index 59c995a77f0..0895616fdb3 100644 --- a/packages/@mantine/core/src/components/TagsInput/TagsInput.test.tsx +++ b/packages/@mantine/core/src/components/TagsInput/TagsInput.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { tests, inputDefaultProps, inputStylesApiSelectors } from '@mantine-tests/core'; +import { inputDefaultProps, inputStylesApiSelectors, tests } from '@mantine-tests/core'; import { TagsInput, TagsInputProps, TagsInputStylesNames } from './TagsInput'; const defaultProps: TagsInputProps = { diff --git a/packages/@mantine/core/src/components/TagsInput/TagsInput.tsx b/packages/@mantine/core/src/components/TagsInput/TagsInput.tsx index 36f8a201949..59fc900d88e 100644 --- a/packages/@mantine/core/src/components/TagsInput/TagsInput.tsx +++ b/packages/@mantine/core/src/components/TagsInput/TagsInput.tsx @@ -1,32 +1,32 @@ import React from 'react'; -import { useUncontrolled, useId } from '@mantine/hooks'; +import { useId, useUncontrolled } from '@mantine/hooks'; import { BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, - Factory, extractStyleProps, - useStyles, + factory, + Factory, + StylesApiProps, + useProps, useResolvedStylesApi, + useStyles, } from '../../core'; +import { __CloseButtonProps } from '../CloseButton'; import { Combobox, - OptionsDropdown, - useCombobox, - getParsedComboboxData, - getOptionsLockup, ComboboxLikeProps, ComboboxLikeStylesNames, + getOptionsLockup, + getParsedComboboxData, + OptionsDropdown, + useCombobox, } from '../Combobox'; import { __BaseInputProps, __InputStylesNames } from '../Input'; -import { PillsInput } from '../PillsInput'; -import { Pill } from '../Pill'; import { InputBase } from '../InputBase'; -import { __CloseButtonProps } from '../CloseButton'; -import { getSplittedTags } from './get-splitted-tags'; +import { Pill } from '../Pill'; +import { PillsInput } from '../PillsInput'; import { filterPickedTags } from './filter-picked-tags'; +import { getSplittedTags } from './get-splitted-tags'; export type TagsInputStylesNames = | __InputStylesNames diff --git a/packages/@mantine/core/src/components/Text/Text.tsx b/packages/@mantine/core/src/components/Text/Text.tsx index db6e6a05248..53331e70831 100644 --- a/packages/@mantine/core/src/components/Text/Text.tsx +++ b/packages/@mantine/core/src/components/Text/Text.tsx @@ -1,21 +1,21 @@ import React from 'react'; import { Box, - BoxProps, - StylesApiProps, - polymorphicFactory, - MantineGradient, - useStyles, - useProps, - getGradient, BoxMod, + BoxProps, createVarsResolver, - PolymorphicFactory, - MantineSize, getFontSize, + getGradient, getLineHeight, - MantineColor, getThemeColor, + MantineColor, + MantineGradient, + MantineSize, + polymorphicFactory, + PolymorphicFactory, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import classes from './Text.module.css'; diff --git a/packages/@mantine/core/src/components/TextInput/TextInput.test.tsx b/packages/@mantine/core/src/components/TextInput/TextInput.test.tsx index 65dd3db98d9..066a0a10bd3 100644 --- a/packages/@mantine/core/src/components/TextInput/TextInput.test.tsx +++ b/packages/@mantine/core/src/components/TextInput/TextInput.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { tests, inputDefaultProps, inputStylesApiSelectors } from '@mantine-tests/core'; -import { TextInput, TextInputProps } from './TextInput'; +import { inputDefaultProps, inputStylesApiSelectors, tests } from '@mantine-tests/core'; import { __InputStylesNames } from '../Input'; +import { TextInput, TextInputProps } from './TextInput'; const defaultProps: TextInputProps = { ...inputDefaultProps, diff --git a/packages/@mantine/core/src/components/TextInput/TextInput.tsx b/packages/@mantine/core/src/components/TextInput/TextInput.tsx index 68319a8c402..bfe73e84f79 100644 --- a/packages/@mantine/core/src/components/TextInput/TextInput.tsx +++ b/packages/@mantine/core/src/components/TextInput/TextInput.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { factory, ElementProps, useProps, Factory, BoxProps, StylesApiProps } from '../../core'; +import { BoxProps, ElementProps, factory, Factory, StylesApiProps, useProps } from '../../core'; +import { __BaseInputProps, __InputStylesNames } from '../Input'; import { InputBase } from '../InputBase'; -import { __InputStylesNames, __BaseInputProps } from '../Input'; export interface TextInputProps extends BoxProps, diff --git a/packages/@mantine/core/src/components/Textarea/Textarea.test.tsx b/packages/@mantine/core/src/components/Textarea/Textarea.test.tsx index 4ce047a3e22..e4f16c1237e 100644 --- a/packages/@mantine/core/src/components/Textarea/Textarea.test.tsx +++ b/packages/@mantine/core/src/components/Textarea/Textarea.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { tests, inputDefaultProps, inputStylesApiSelectors } from '@mantine-tests/core'; -import { Textarea, TextareaProps } from './Textarea'; +import { inputDefaultProps, inputStylesApiSelectors, tests } from '@mantine-tests/core'; import { __InputStylesNames } from '../Input'; +import { Textarea, TextareaProps } from './Textarea'; const defaultProps: TextareaProps = { ...inputDefaultProps, diff --git a/packages/@mantine/core/src/components/Textarea/Textarea.tsx b/packages/@mantine/core/src/components/Textarea/Textarea.tsx index 8e319c4464c..59450088ec9 100644 --- a/packages/@mantine/core/src/components/Textarea/Textarea.tsx +++ b/packages/@mantine/core/src/components/Textarea/Textarea.tsx @@ -1,13 +1,13 @@ import React from 'react'; import TextareaAutosize from 'react-textarea-autosize'; import { - factory, + BoxProps, ElementProps, - useProps, + factory, Factory, - BoxProps, - StylesApiProps, getEnv, + StylesApiProps, + useProps, } from '../../core'; import { __BaseInputProps, __InputStylesNames } from '../Input'; import { InputBase } from '../InputBase'; diff --git a/packages/@mantine/core/src/components/ThemeIcon/ThemeIcon.story.tsx b/packages/@mantine/core/src/components/ThemeIcon/ThemeIcon.story.tsx index 8b036b6eeeb..f9340767272 100644 --- a/packages/@mantine/core/src/components/ThemeIcon/ThemeIcon.story.tsx +++ b/packages/@mantine/core/src/components/ThemeIcon/ThemeIcon.story.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { ThemeIcon, ThemeIconProps } from './ThemeIcon'; import { DEFAULT_THEME } from '../../core'; +import { ThemeIcon, ThemeIconProps } from './ThemeIcon'; export default { title: 'ThemeIcon' }; diff --git a/packages/@mantine/core/src/components/ThemeIcon/ThemeIcon.tsx b/packages/@mantine/core/src/components/ThemeIcon/ThemeIcon.tsx index 1f4f8bf1184..f47764dcc0c 100644 --- a/packages/@mantine/core/src/components/ThemeIcon/ThemeIcon.tsx +++ b/packages/@mantine/core/src/components/ThemeIcon/ThemeIcon.tsx @@ -2,19 +2,19 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - getSize, getRadius, + getSize, + MantineColor, MantineGradient, MantineRadius, - MantineColor, MantineSize, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import classes from './ThemeIcon.module.css'; diff --git a/packages/@mantine/core/src/components/Timeline/Timeline.story.tsx b/packages/@mantine/core/src/components/Timeline/Timeline.story.tsx index bf039bd5b72..61cd953de83 100644 --- a/packages/@mantine/core/src/components/Timeline/Timeline.story.tsx +++ b/packages/@mantine/core/src/components/Timeline/Timeline.story.tsx @@ -1,12 +1,12 @@ import React from 'react'; import { IconGitBranch, - IconGitPullRequest, IconGitCommit, + IconGitPullRequest, IconMessageDots, } from '@tabler/icons-react'; -import { Timeline } from './Timeline'; import { Text } from '../Text'; +import { Timeline } from './Timeline'; export default { title: 'Timeline' }; diff --git a/packages/@mantine/core/src/components/Timeline/Timeline.tsx b/packages/@mantine/core/src/components/Timeline/Timeline.tsx index bcc5d9c4550..299140c1178 100644 --- a/packages/@mantine/core/src/components/Timeline/Timeline.tsx +++ b/packages/@mantine/core/src/components/Timeline/Timeline.tsx @@ -1,22 +1,22 @@ -import React, { cloneElement, Children } from 'react'; +import React, { Children, cloneElement } from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, + getRadius, + getThemeColor, MantineColor, MantineRadius, rem, - getRadius, - getThemeColor, + StylesApiProps, + useProps, + useStyles, } from '../../core'; -import { TimelineItem, TimelineItemStylesNames } from './TimelineItem/TimelineItem'; import { TimelineProvider } from './Timeline.context'; +import { TimelineItem, TimelineItemStylesNames } from './TimelineItem/TimelineItem'; import classes from './Timeline.module.css'; export type TimelineStylesNames = 'root' | TimelineItemStylesNames; diff --git a/packages/@mantine/core/src/components/Timeline/TimelineItem/TimelineItem.test.tsx b/packages/@mantine/core/src/components/Timeline/TimelineItem/TimelineItem.test.tsx index 03ed389734e..0e1ba71797e 100644 --- a/packages/@mantine/core/src/components/Timeline/TimelineItem/TimelineItem.test.tsx +++ b/packages/@mantine/core/src/components/Timeline/TimelineItem/TimelineItem.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { render, tests, createContextContainer, screen } from '@mantine-tests/core'; -import { TimelineItem, TimelineItemProps, TimelineItemStylesNames } from './TimelineItem'; +import { createContextContainer, render, screen, tests } from '@mantine-tests/core'; import { Timeline } from '../Timeline'; +import { TimelineItem, TimelineItemProps, TimelineItemStylesNames } from './TimelineItem'; const TestContainer = createContextContainer(TimelineItem, Timeline, {}); diff --git a/packages/@mantine/core/src/components/Timeline/TimelineItem/TimelineItem.tsx b/packages/@mantine/core/src/components/Timeline/TimelineItem/TimelineItem.tsx index 4880aef362b..d6528d07fbe 100644 --- a/packages/@mantine/core/src/components/Timeline/TimelineItem/TimelineItem.tsx +++ b/packages/@mantine/core/src/components/Timeline/TimelineItem/TimelineItem.tsx @@ -3,15 +3,15 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, - MantineRadius, - MantineColor, getRadius, - useMantineTheme, getThemeColor, + MantineColor, + MantineRadius, + useMantineTheme, + useProps, } from '../../../core'; import { useTimelineContext } from '../Timeline.context'; import classes from '../Timeline.module.css'; diff --git a/packages/@mantine/core/src/components/Title/Title.tsx b/packages/@mantine/core/src/components/Title/Title.tsx index 05bf0d44c82..eef56dbdc69 100644 --- a/packages/@mantine/core/src/components/Title/Title.tsx +++ b/packages/@mantine/core/src/components/Title/Title.tsx @@ -1,14 +1,14 @@ import React from 'react'; import { - StylesApiProps, - factory, + Box, + BoxProps, + createVarsResolver, ElementProps, + factory, + Factory, + StylesApiProps, useProps, useStyles, - createVarsResolver, - Factory, - Box, - BoxProps, } from '../../core'; import { getTitleSize } from './get-title-size'; import classes from './Title.module.css'; diff --git a/packages/@mantine/core/src/components/Title/get-title-size.ts b/packages/@mantine/core/src/components/Title/get-title-size.ts index 426f4d4b25f..8e6ce1a3b57 100644 --- a/packages/@mantine/core/src/components/Title/get-title-size.ts +++ b/packages/@mantine/core/src/components/Title/get-title-size.ts @@ -1,5 +1,5 @@ import { rem } from '../../core'; -import type { TitleSize, TitleOrder } from './Title'; +import type { TitleOrder, TitleSize } from './Title'; const headings: unknown[] = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6']; diff --git a/packages/@mantine/core/src/components/Tooltip/Tooltip.test.tsx b/packages/@mantine/core/src/components/Tooltip/Tooltip.test.tsx index b47960b5433..2b763d2c4de 100644 --- a/packages/@mantine/core/src/components/Tooltip/Tooltip.test.tsx +++ b/packages/@mantine/core/src/components/Tooltip/Tooltip.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { patchConsoleError, render, tests, userEvent, screen } from '@mantine-tests/core'; +import { patchConsoleError, render, screen, tests, userEvent } from '@mantine-tests/core'; import { Tooltip, TooltipProps } from './Tooltip'; import { TooltipStylesNames } from './Tooltip.types'; import { TooltipFloating } from './TooltipFloating/TooltipFloating'; diff --git a/packages/@mantine/core/src/components/Tooltip/Tooltip.tsx b/packages/@mantine/core/src/components/Tooltip/Tooltip.tsx index 621da8a3bbd..1190b350132 100644 --- a/packages/@mantine/core/src/components/Tooltip/Tooltip.tsx +++ b/packages/@mantine/core/src/components/Tooltip/Tooltip.tsx @@ -1,18 +1,18 @@ import React, { cloneElement, useRef } from 'react'; -import { useMergedRef } from '@mantine/hooks'; import cx from 'clsx'; +import { useMergedRef } from '@mantine/hooks'; import { Box, + createVarsResolver, factory, + Factory, getDefaultZIndex, + getRadius, + getThemeColor, isElement, - useProps, useDirection, + useProps, useStyles, - getThemeColor, - getRadius, - createVarsResolver, - Factory, } from '../../core'; import { ArrowPosition, @@ -21,8 +21,8 @@ import { FloatingPosition, getFloatingPosition, } from '../Floating'; -import { Transition, TransitionOverride, getTransitionProps } from '../Transition'; import { OptionalPortal } from '../Portal'; +import { getTransitionProps, Transition, TransitionOverride } from '../Transition'; import { TooltipBaseProps, TooltipCssVariables, TooltipStylesNames } from './Tooltip.types'; import { TooltipFloating } from './TooltipFloating/TooltipFloating'; import { TooltipGroup } from './TooltipGroup/TooltipGroup'; diff --git a/packages/@mantine/core/src/components/Tooltip/Tooltip.types.ts b/packages/@mantine/core/src/components/Tooltip/Tooltip.types.ts index f40e5b896f6..0c1d05d249f 100644 --- a/packages/@mantine/core/src/components/Tooltip/Tooltip.types.ts +++ b/packages/@mantine/core/src/components/Tooltip/Tooltip.types.ts @@ -1,4 +1,4 @@ -import { BoxProps, ElementProps, MantineColor, StylesApiProps, MantineRadius } from '../../core'; +import { BoxProps, ElementProps, MantineColor, MantineRadius, StylesApiProps } from '../../core'; import { FloatingPosition } from '../Floating'; import { PortalProps } from '../Portal'; import type { TooltipFactory } from './Tooltip'; diff --git a/packages/@mantine/core/src/components/Tooltip/TooltipFloating/TooltipFloating.tsx b/packages/@mantine/core/src/components/Tooltip/TooltipFloating/TooltipFloating.tsx index 3a443bf1004..cabad04c06f 100644 --- a/packages/@mantine/core/src/components/Tooltip/TooltipFloating/TooltipFloating.tsx +++ b/packages/@mantine/core/src/components/Tooltip/TooltipFloating/TooltipFloating.tsx @@ -2,22 +2,22 @@ import React, { cloneElement } from 'react'; import { useMergedRef } from '@mantine/hooks'; import { Box, + createVarsResolver, factory, + Factory, getDefaultZIndex, + getRadius, + getStyleObject, + getThemeColor, isElement, + useMantineTheme, useProps, useStyles, - getStyleObject, - useMantineTheme, - Factory, - createVarsResolver, - getRadius, - getThemeColor, } from '../../../core'; import { OptionalPortal } from '../../Portal'; import { TooltipBaseProps, TooltipCssVariables, TooltipStylesNames } from '../Tooltip.types'; -import classes from '../Tooltip.module.css'; import { useFloatingTooltip } from './use-floating-tooltip'; +import classes from '../Tooltip.module.css'; export interface TooltipFloatingProps extends TooltipBaseProps { /** Offset from mouse in px, `10` by default */ diff --git a/packages/@mantine/core/src/components/Tooltip/TooltipFloating/use-floating-tooltip.ts b/packages/@mantine/core/src/components/Tooltip/TooltipFloating/use-floating-tooltip.ts index 0d75cec1002..27cc3dac52a 100644 --- a/packages/@mantine/core/src/components/Tooltip/TooltipFloating/use-floating-tooltip.ts +++ b/packages/@mantine/core/src/components/Tooltip/TooltipFloating/use-floating-tooltip.ts @@ -1,5 +1,5 @@ -import { useState, useEffect, useCallback, useRef } from 'react'; -import { useFloating, shift, getOverflowAncestors } from '@floating-ui/react'; +import { useCallback, useEffect, useRef, useState } from 'react'; +import { getOverflowAncestors, shift, useFloating } from '@floating-ui/react'; import { FloatingPosition } from '../../Floating'; interface UseFloatingTooltip { diff --git a/packages/@mantine/core/src/components/Tooltip/use-tooltip.ts b/packages/@mantine/core/src/components/Tooltip/use-tooltip.ts index 5463f3996a4..9cee43728b0 100644 --- a/packages/@mantine/core/src/components/Tooltip/use-tooltip.ts +++ b/packages/@mantine/core/src/components/Tooltip/use-tooltip.ts @@ -1,22 +1,22 @@ -import { useState, useCallback } from 'react'; +import { useCallback, useState } from 'react'; import { - useFloating, - flip, arrow, + flip, + inline, offset, shift, - useInteractions, - useHover, + useDelayGroup, + useDelayGroupContext, + useDismiss, + useFloating, useFocus, + useHover, + useInteractions, useRole, - useDismiss, - useDelayGroupContext, - useDelayGroup, - inline, } from '@floating-ui/react'; -import { useId, useDidUpdate } from '@mantine/hooks'; -import { useTooltipGroupContext } from './TooltipGroup/TooltipGroup.context'; +import { useDidUpdate, useId } from '@mantine/hooks'; import { FloatingAxesOffsets, FloatingPosition, useFloatingAutoUpdate } from '../Floating'; +import { useTooltipGroupContext } from './TooltipGroup/TooltipGroup.context'; interface UseTooltip { position: FloatingPosition; diff --git a/packages/@mantine/core/src/components/Transition/Transition.tsx b/packages/@mantine/core/src/components/Transition/Transition.tsx index cc62a485eb2..2778688407d 100644 --- a/packages/@mantine/core/src/components/Transition/Transition.tsx +++ b/packages/@mantine/core/src/components/Transition/Transition.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { getTransitionStyles } from './get-transition-styles/get-transition-styles'; -import { useTransition } from './use-transition'; import { MantineTransition } from './transitions'; +import { useTransition } from './use-transition'; export interface TransitionProps { /** If set element will not be unmounted from the DOM when it is hidden, `display: none` styles will be applied instead */ diff --git a/packages/@mantine/core/src/components/Transition/get-transition-styles/get-transition-styles.test.ts b/packages/@mantine/core/src/components/Transition/get-transition-styles/get-transition-styles.test.ts index c7eb72b3619..f6dcd2b369b 100644 --- a/packages/@mantine/core/src/components/Transition/get-transition-styles/get-transition-styles.test.ts +++ b/packages/@mantine/core/src/components/Transition/get-transition-styles/get-transition-styles.test.ts @@ -1,5 +1,5 @@ -import { getTransitionStyles } from './get-transition-styles'; import { transitions } from '../transitions'; +import { getTransitionStyles } from './get-transition-styles'; const customTransition = { in: { opacity: 1, backgroundColor: 'red' }, diff --git a/packages/@mantine/core/src/components/Transition/use-transition.ts b/packages/@mantine/core/src/components/Transition/use-transition.ts index 33afee7c277..79ff7990294 100644 --- a/packages/@mantine/core/src/components/Transition/use-transition.ts +++ b/packages/@mantine/core/src/components/Transition/use-transition.ts @@ -1,5 +1,5 @@ -import { useState, useEffect, useRef } from 'react'; -import { useReducedMotion, useDidUpdate } from '@mantine/hooks'; +import { useEffect, useRef, useState } from 'react'; +import { useDidUpdate, useReducedMotion } from '@mantine/hooks'; import { useMantineTheme } from '../../core'; export type TransitionStatus = diff --git a/packages/@mantine/core/src/components/TypographyStylesProvider/TypographyStylesProvider.tsx b/packages/@mantine/core/src/components/TypographyStylesProvider/TypographyStylesProvider.tsx index 797db2a735b..b1298cb77f2 100644 --- a/packages/@mantine/core/src/components/TypographyStylesProvider/TypographyStylesProvider.tsx +++ b/packages/@mantine/core/src/components/TypographyStylesProvider/TypographyStylesProvider.tsx @@ -2,12 +2,12 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, + factory, + Factory, + StylesApiProps, useProps, useStyles, - Factory, } from '../../core'; import classes from './TypographyStylesProvider.module.css'; diff --git a/packages/@mantine/core/src/components/UnstyledButton/UnstyleButton.story.tsx b/packages/@mantine/core/src/components/UnstyledButton/UnstyleButton.story.tsx index 4e2a1188ffb..1dfe49a0c0b 100644 --- a/packages/@mantine/core/src/components/UnstyledButton/UnstyleButton.story.tsx +++ b/packages/@mantine/core/src/components/UnstyledButton/UnstyleButton.story.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { UnstyledButton } from './UnstyledButton'; import { MantineThemeProvider } from '../../core'; +import { UnstyledButton } from './UnstyledButton'; export default { title: 'UnstyledButton' }; diff --git a/packages/@mantine/core/src/components/UnstyledButton/UnstyleButton.test.tsx b/packages/@mantine/core/src/components/UnstyledButton/UnstyleButton.test.tsx index b4a967b7bc5..41579280c5c 100644 --- a/packages/@mantine/core/src/components/UnstyledButton/UnstyleButton.test.tsx +++ b/packages/@mantine/core/src/components/UnstyledButton/UnstyleButton.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { tests, render } from '@mantine-tests/core'; +import { render, tests } from '@mantine-tests/core'; import { UnstyledButton, UnstyledButtonProps, UnstyledButtonStylesNames } from './UnstyledButton'; const defaultProps: UnstyledButtonProps = {}; diff --git a/packages/@mantine/core/src/components/UnstyledButton/UnstyledButton.tsx b/packages/@mantine/core/src/components/UnstyledButton/UnstyledButton.tsx index ea6e5158599..3c2efe57aab 100644 --- a/packages/@mantine/core/src/components/UnstyledButton/UnstyledButton.tsx +++ b/packages/@mantine/core/src/components/UnstyledButton/UnstyledButton.tsx @@ -1,12 +1,12 @@ import React from 'react'; import { Box, - useProps, - StylesApiProps, - useStyles, - polymorphicFactory, BoxComponentProps, + polymorphicFactory, PolymorphicFactory, + StylesApiProps, + useProps, + useStyles, } from '../../core'; import classes from './UnstyledButton.module.css'; diff --git a/packages/@mantine/core/src/components/VisuallyHidden/VisuallyHidden.tsx b/packages/@mantine/core/src/components/VisuallyHidden/VisuallyHidden.tsx index a6adcf816ac..39e99d1793a 100644 --- a/packages/@mantine/core/src/components/VisuallyHidden/VisuallyHidden.tsx +++ b/packages/@mantine/core/src/components/VisuallyHidden/VisuallyHidden.tsx @@ -2,12 +2,12 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, + factory, + Factory, + StylesApiProps, useProps, useStyles, - Factory, } from '../../core'; import classes from './VisuallyHidden.module.css'; diff --git a/packages/@mantine/core/src/core/Box/Box.test.tsx b/packages/@mantine/core/src/core/Box/Box.test.tsx index 8d5b3b9ec08..e46683b7e4c 100644 --- a/packages/@mantine/core/src/core/Box/Box.test.tsx +++ b/packages/@mantine/core/src/core/Box/Box.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { tests, render, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { Box, BoxProps } from './Box'; const defaultProps: BoxProps = {}; diff --git a/packages/@mantine/core/src/core/Box/Box.tsx b/packages/@mantine/core/src/core/Box/Box.tsx index dc868e878b3..f3785d286f3 100644 --- a/packages/@mantine/core/src/core/Box/Box.tsx +++ b/packages/@mantine/core/src/core/Box/Box.tsx @@ -1,19 +1,19 @@ import React, { forwardRef } from 'react'; import cx from 'clsx'; -import { useMantineTheme, MantineBreakpoint } from '../MantineProvider'; -import { InlineStyles } from '../InlineStyles'; import { createPolymorphicComponent } from '../factory'; -import type { MantineStyleProp, CssVarsProp } from './Box.types'; +import { InlineStyles } from '../InlineStyles'; +import { MantineBreakpoint, useMantineTheme } from '../MantineProvider'; +import { isNumberLike } from '../utils'; +import type { CssVarsProp, MantineStyleProp } from './Box.types'; +import { getBoxMod } from './get-box-mod/get-box-mod'; import { getBoxStyle } from './get-box-style/get-box-style'; -import { useRandomClassName } from './use-random-classname/use-random-classname'; import { - MantineStyleProps, extractStyleProps, + MantineStyleProps, parseStyleProps, STYlE_PROPS_DATA, } from './style-props'; -import { getBoxMod } from './get-box-mod/get-box-mod'; -import { isNumberLike } from '../utils'; +import { useRandomClassName } from './use-random-classname/use-random-classname'; export type Mod = Record | string; export type BoxMod = Mod | Mod[] | BoxMod[]; diff --git a/packages/@mantine/core/src/core/Box/get-box-style/get-box-style.test.ts b/packages/@mantine/core/src/core/Box/get-box-style/get-box-style.test.ts index ba3c6dc4038..9f0e85227b4 100644 --- a/packages/@mantine/core/src/core/Box/get-box-style/get-box-style.test.ts +++ b/packages/@mantine/core/src/core/Box/get-box-style/get-box-style.test.ts @@ -1,5 +1,5 @@ -import { getBoxStyle } from './get-box-style'; import { DEFAULT_THEME } from '../../MantineProvider'; +import { getBoxStyle } from './get-box-style'; describe('@mantine/core/Box/get-box-style', () => { it('returns empty object if no style or vars provided', () => { diff --git a/packages/@mantine/core/src/core/Box/get-box-style/get-box-style.ts b/packages/@mantine/core/src/core/Box/get-box-style/get-box-style.ts index da021144266..11ea97b53a1 100644 --- a/packages/@mantine/core/src/core/Box/get-box-style/get-box-style.ts +++ b/packages/@mantine/core/src/core/Box/get-box-style/get-box-style.ts @@ -1,5 +1,5 @@ import type { MantineTheme } from '../../MantineProvider'; -import type { MantineStyleProp, CssVarsProp } from '../Box.types'; +import type { CssVarsProp, MantineStyleProp } from '../Box.types'; interface GetBoxStyleOptions { theme: MantineTheme; diff --git a/packages/@mantine/core/src/core/Box/get-style-object/get-style-object.test.ts b/packages/@mantine/core/src/core/Box/get-style-object/get-style-object.test.ts index 9d67e123243..36700cba4a9 100644 --- a/packages/@mantine/core/src/core/Box/get-style-object/get-style-object.test.ts +++ b/packages/@mantine/core/src/core/Box/get-style-object/get-style-object.test.ts @@ -1,5 +1,5 @@ -import { getStyleObject } from './get-style-object'; import { DEFAULT_THEME } from '../../MantineProvider'; +import { getStyleObject } from './get-style-object'; describe('@mantine/core/Box/get-style-object', () => { it('returns empty object if style is undefined', () => { diff --git a/packages/@mantine/core/src/core/Box/style-props/parse-style-props/parse-style-props.test.ts b/packages/@mantine/core/src/core/Box/style-props/parse-style-props/parse-style-props.test.ts index f6ec5ca9f95..c369da1e852 100644 --- a/packages/@mantine/core/src/core/Box/style-props/parse-style-props/parse-style-props.test.ts +++ b/packages/@mantine/core/src/core/Box/style-props/parse-style-props/parse-style-props.test.ts @@ -1,6 +1,6 @@ import { DEFAULT_THEME } from '../../../MantineProvider'; -import { parseStyleProps } from './parse-style-props'; import { STYlE_PROPS_DATA } from '../style-props-data'; +import { parseStyleProps } from './parse-style-props'; describe('@mantine/core/Box/parse-style-props', () => { it('parses non responsive style props correctly', () => { diff --git a/packages/@mantine/core/src/core/Box/style-props/parse-style-props/parse-style-props.ts b/packages/@mantine/core/src/core/Box/style-props/parse-style-props/parse-style-props.ts index 00a23fc11cf..c1ff73ace35 100644 --- a/packages/@mantine/core/src/core/Box/style-props/parse-style-props/parse-style-props.ts +++ b/packages/@mantine/core/src/core/Box/style-props/parse-style-props/parse-style-props.ts @@ -1,8 +1,8 @@ +import { MantineTheme } from '../../../MantineProvider'; import { keys } from '../../../utils'; -import type { StyleProp } from '../style-props.types'; -import type { SystemPropData } from '../style-props-data'; import { resolvers } from '../resolvers'; -import { MantineTheme } from '../../../MantineProvider'; +import type { SystemPropData } from '../style-props-data'; +import type { StyleProp } from '../style-props.types'; import type { SortMediaQueriesResult } from './sort-media-queries'; import { sortMediaQueries } from './sort-media-queries'; diff --git a/packages/@mantine/core/src/core/Box/style-props/parse-style-props/sort-media-queries.ts b/packages/@mantine/core/src/core/Box/style-props/parse-style-props/sort-media-queries.ts index c5c3aad2030..3474012aaec 100644 --- a/packages/@mantine/core/src/core/Box/style-props/parse-style-props/sort-media-queries.ts +++ b/packages/@mantine/core/src/core/Box/style-props/parse-style-props/sort-media-queries.ts @@ -1,5 +1,5 @@ -import type { ParseStylePropsResult } from './parse-style-props'; import type { InlineStylesMediaQuery } from '../../../InlineStyles'; +import type { ParseStylePropsResult } from './parse-style-props'; export interface SortMediaQueriesResult extends Omit { media: InlineStylesMediaQuery[]; diff --git a/packages/@mantine/core/src/core/Box/style-props/resolvers/color-resolver/color-resolver.test.ts b/packages/@mantine/core/src/core/Box/style-props/resolvers/color-resolver/color-resolver.test.ts index e015ed41f06..620421e612e 100644 --- a/packages/@mantine/core/src/core/Box/style-props/resolvers/color-resolver/color-resolver.test.ts +++ b/packages/@mantine/core/src/core/Box/style-props/resolvers/color-resolver/color-resolver.test.ts @@ -1,5 +1,5 @@ -import { colorResolver } from './color-resolver'; import { DEFAULT_THEME } from '../../../../MantineProvider'; +import { colorResolver } from './color-resolver'; describe('@mantine/core/Box/color-resolver', () => { it('resolves theme color', () => { diff --git a/packages/@mantine/core/src/core/Box/style-props/resolvers/font-size-resolver/font-size-resolver.test.ts b/packages/@mantine/core/src/core/Box/style-props/resolvers/font-size-resolver/font-size-resolver.test.ts index 919d06dff91..7b34ad99e28 100644 --- a/packages/@mantine/core/src/core/Box/style-props/resolvers/font-size-resolver/font-size-resolver.test.ts +++ b/packages/@mantine/core/src/core/Box/style-props/resolvers/font-size-resolver/font-size-resolver.test.ts @@ -1,6 +1,6 @@ -import { fontSizeResolver } from './font-size-resolver'; import { DEFAULT_THEME } from '../../../../MantineProvider'; import { rem } from '../../../../utils'; +import { fontSizeResolver } from './font-size-resolver'; describe('@mantine/core/Box/font-size-resolver', () => { it('resolves theme font size', () => { diff --git a/packages/@mantine/core/src/core/Box/style-props/resolvers/index.ts b/packages/@mantine/core/src/core/Box/style-props/resolvers/index.ts index 2bb2755e174..f7e175ba30f 100644 --- a/packages/@mantine/core/src/core/Box/style-props/resolvers/index.ts +++ b/packages/@mantine/core/src/core/Box/style-props/resolvers/index.ts @@ -1,9 +1,9 @@ import { colorResolver } from './color-resolver/color-resolver'; import { fontSizeResolver } from './font-size-resolver/font-size-resolver'; -import { spacingResolver } from './spacing-resolver/spacing-resolver'; import { identityResolver } from './identity-resolver/identity-resolver'; -import { sizeResolver } from './size-resolver/size-resolver'; import { lineHeightResolver } from './line-height-resolver/line-height-resolver'; +import { sizeResolver } from './size-resolver/size-resolver'; +import { spacingResolver } from './spacing-resolver/spacing-resolver'; export const resolvers = { color: colorResolver, diff --git a/packages/@mantine/core/src/core/Box/style-props/resolvers/line-height-resolver/line-height-resolver.test.ts b/packages/@mantine/core/src/core/Box/style-props/resolvers/line-height-resolver/line-height-resolver.test.ts index 820608da5f8..73035207631 100644 --- a/packages/@mantine/core/src/core/Box/style-props/resolvers/line-height-resolver/line-height-resolver.test.ts +++ b/packages/@mantine/core/src/core/Box/style-props/resolvers/line-height-resolver/line-height-resolver.test.ts @@ -1,5 +1,5 @@ -import { lineHeightResolver } from './line-height-resolver'; import { DEFAULT_THEME } from '../../../../MantineProvider'; +import { lineHeightResolver } from './line-height-resolver'; describe('@mantine/core/Box/line-height-resolver', () => { it('resolves theme line height', () => { diff --git a/packages/@mantine/core/src/core/Box/style-props/resolvers/spacing-resolver/spacing-resolver.test.ts b/packages/@mantine/core/src/core/Box/style-props/resolvers/spacing-resolver/spacing-resolver.test.ts index a0cf89a992e..84e59cc964c 100644 --- a/packages/@mantine/core/src/core/Box/style-props/resolvers/spacing-resolver/spacing-resolver.test.ts +++ b/packages/@mantine/core/src/core/Box/style-props/resolvers/spacing-resolver/spacing-resolver.test.ts @@ -1,6 +1,6 @@ -import { spacingResolver } from './spacing-resolver'; import { DEFAULT_THEME } from '../../../../MantineProvider'; import { rem } from '../../../../utils'; +import { spacingResolver } from './spacing-resolver'; describe('@mantine/core/Box/spacing-resolver', () => { it('resolves number correctly', () => { diff --git a/packages/@mantine/core/src/core/Box/style-props/style-props.types.ts b/packages/@mantine/core/src/core/Box/style-props/style-props.types.ts index 854da84ece5..45b1079357b 100644 --- a/packages/@mantine/core/src/core/Box/style-props/style-props.types.ts +++ b/packages/@mantine/core/src/core/Box/style-props/style-props.types.ts @@ -1,9 +1,9 @@ import type { MantineBreakpoint, - MantineSpacing, + MantineColor, MantineFontSize, MantineLineHeight, - MantineColor, + MantineSpacing, } from '../../MantineProvider'; export type StyleProp = Value | Partial>; diff --git a/packages/@mantine/core/src/core/InlineStyles/InlineStyles.tsx b/packages/@mantine/core/src/core/InlineStyles/InlineStyles.tsx index e5ef1b6a87c..1812bfbb368 100644 --- a/packages/@mantine/core/src/core/InlineStyles/InlineStyles.tsx +++ b/packages/@mantine/core/src/core/InlineStyles/InlineStyles.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { InlineStylesInput, stylesToString } from './styles-to-string/styles-to-string'; import { useMantineStyleNonce } from '../MantineProvider'; +import { InlineStylesInput, stylesToString } from './styles-to-string/styles-to-string'; export interface InlineStylesProps extends InlineStylesInput, diff --git a/packages/@mantine/core/src/core/InlineStyles/css-object-to-string/css-object-to-string.ts b/packages/@mantine/core/src/core/InlineStyles/css-object-to-string/css-object-to-string.ts index 8416e33e064..6eb154f80ea 100644 --- a/packages/@mantine/core/src/core/InlineStyles/css-object-to-string/css-object-to-string.ts +++ b/packages/@mantine/core/src/core/InlineStyles/css-object-to-string/css-object-to-string.ts @@ -1,4 +1,4 @@ -import { keys, camelToKebabCase } from '../../utils'; +import { camelToKebabCase, keys } from '../../utils'; export function cssObjectToString(css: React.CSSProperties) { return keys(css) diff --git a/packages/@mantine/core/src/core/MantineProvider/Mantine.context.ts b/packages/@mantine/core/src/core/MantineProvider/Mantine.context.ts index 59f7a7b2293..07520d393e7 100644 --- a/packages/@mantine/core/src/core/MantineProvider/Mantine.context.ts +++ b/packages/@mantine/core/src/core/MantineProvider/Mantine.context.ts @@ -1,7 +1,7 @@ import { createContext, useContext } from 'react'; -import type { MantineTheme, MantineColorScheme } from './theme.types'; import type { MantineColorSchemeManager } from './color-scheme-managers'; import { ConvertCSSVariablesInput } from './convert-css-variables'; +import type { MantineColorScheme, MantineTheme } from './theme.types'; interface MantineContextValue { colorScheme: MantineColorScheme; diff --git a/packages/@mantine/core/src/core/MantineProvider/MantineClasses/MantineClasses.tsx b/packages/@mantine/core/src/core/MantineProvider/MantineClasses/MantineClasses.tsx index 9eb3aa6888b..ad8ad2e2041 100644 --- a/packages/@mantine/core/src/core/MantineProvider/MantineClasses/MantineClasses.tsx +++ b/packages/@mantine/core/src/core/MantineProvider/MantineClasses/MantineClasses.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { useMantineTheme } from '../MantineThemeProvider'; -import { keys, px, em } from '../../utils'; +import { em, keys, px } from '../../utils'; import { useMantineStyleNonce } from '../Mantine.context'; +import { useMantineTheme } from '../MantineThemeProvider'; export function MantineClasses() { const theme = useMantineTheme(); diff --git a/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/MantineCssVariables.tsx b/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/MantineCssVariables.tsx index 88230d24d63..f1394c4b870 100644 --- a/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/MantineCssVariables.tsx +++ b/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/MantineCssVariables.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { useMantineStyleNonce, useMantineCssVariablesResolver } from '../Mantine.context'; -import { useMantineTheme } from '../MantineThemeProvider'; import { convertCssVariables } from '../convert-css-variables/convert-css-variables'; +import { useMantineCssVariablesResolver, useMantineStyleNonce } from '../Mantine.context'; +import { useMantineTheme } from '../MantineThemeProvider'; import { getMergedVariables } from './get-merged-variables'; import { removeDefaultVariables } from './remove-default-variables'; diff --git a/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/default-css-variables-resolver.ts b/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/default-css-variables-resolver.ts index 1a9ba0cc599..19ad74dfcb9 100644 --- a/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/default-css-variables-resolver.ts +++ b/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/default-css-variables-resolver.ts @@ -1,8 +1,8 @@ /* eslint-disable prefer-destructuring */ -import { MantineTheme } from '../theme.types'; import { keys, rem } from '../../utils'; import { getPrimaryShade, rgba } from '../color-functions'; import { ConvertCSSVariablesInput } from '../convert-css-variables'; +import { MantineTheme } from '../theme.types'; export type CSSVariablesResolver = (theme: MantineTheme) => ConvertCSSVariablesInput; diff --git a/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/get-merged-variables.test.ts b/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/get-merged-variables.test.ts index ae3824f59ef..9b50287ea71 100644 --- a/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/get-merged-variables.test.ts +++ b/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/get-merged-variables.test.ts @@ -1,9 +1,9 @@ -import { getMergedVariables } from './get-merged-variables'; import { DEFAULT_THEME } from '../default-theme'; import { - defaultCssVariablesResolver, CSSVariablesResolver, + defaultCssVariablesResolver, } from './default-css-variables-resolver'; +import { getMergedVariables } from './get-merged-variables'; const defaultVariables = defaultCssVariablesResolver(DEFAULT_THEME); diff --git a/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/get-merged-variables.ts b/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/get-merged-variables.ts index 00ffe28fe1c..3e42f0f71d5 100644 --- a/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/get-merged-variables.ts +++ b/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/get-merged-variables.ts @@ -1,6 +1,6 @@ import { deepMerge } from '../../utils'; -import { MantineTheme } from '../theme.types'; import { ConvertCSSVariablesInput } from '../convert-css-variables'; +import { MantineTheme } from '../theme.types'; import { defaultCssVariablesResolver } from './default-css-variables-resolver'; interface GetMergedVariablesInput { diff --git a/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/remove-default-variables.ts b/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/remove-default-variables.ts index 6ed56e93532..88ed6f5efec 100644 --- a/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/remove-default-variables.ts +++ b/packages/@mantine/core/src/core/MantineProvider/MantineCssVariables/remove-default-variables.ts @@ -1,7 +1,7 @@ +import { keys } from '../../utils'; import { ConvertCSSVariablesInput } from '../convert-css-variables'; -import { defaultCssVariablesResolver } from './default-css-variables-resolver'; import { DEFAULT_THEME } from '../default-theme'; -import { keys } from '../../utils'; +import { defaultCssVariablesResolver } from './default-css-variables-resolver'; const defaultCssVariables = defaultCssVariablesResolver(DEFAULT_THEME); diff --git a/packages/@mantine/core/src/core/MantineProvider/MantineProvider.tsx b/packages/@mantine/core/src/core/MantineProvider/MantineProvider.tsx index 5b41228545e..5e3aa64a8f1 100644 --- a/packages/@mantine/core/src/core/MantineProvider/MantineProvider.tsx +++ b/packages/@mantine/core/src/core/MantineProvider/MantineProvider.tsx @@ -1,12 +1,13 @@ import './global.css'; + import React from 'react'; -import { suppressNextjsWarning } from './suppress-nextjs-warning'; -import { MantineCssVariables, CSSVariablesResolver } from './MantineCssVariables'; -import { MantineThemeProvider } from './MantineThemeProvider'; -import type { MantineColorScheme, MantineThemeOverride } from './theme.types'; -import { MantineClasses } from './MantineClasses'; import { localStorageColorSchemeManager, MantineColorSchemeManager } from './color-scheme-managers'; import { MantineContext } from './Mantine.context'; +import { MantineClasses } from './MantineClasses'; +import { CSSVariablesResolver, MantineCssVariables } from './MantineCssVariables'; +import { MantineThemeProvider } from './MantineThemeProvider'; +import { suppressNextjsWarning } from './suppress-nextjs-warning'; +import type { MantineColorScheme, MantineThemeOverride } from './theme.types'; import { useProviderColorScheme } from './use-mantine-color-scheme'; import { useRespectReduceMotion } from './use-respect-reduce-motion'; diff --git a/packages/@mantine/core/src/core/MantineProvider/MantineThemeProvider/MantineThemeProvider.tsx b/packages/@mantine/core/src/core/MantineProvider/MantineThemeProvider/MantineThemeProvider.tsx index ea63b1b78e4..7b8880fc066 100644 --- a/packages/@mantine/core/src/core/MantineProvider/MantineThemeProvider/MantineThemeProvider.tsx +++ b/packages/@mantine/core/src/core/MantineProvider/MantineThemeProvider/MantineThemeProvider.tsx @@ -1,7 +1,7 @@ import React, { createContext, useContext, useMemo } from 'react'; -import { MantineTheme, MantineThemeOverride } from '../theme.types'; import { DEFAULT_THEME } from '../default-theme'; import { mergeMantineTheme } from '../merge-mantine-theme'; +import { MantineTheme, MantineThemeOverride } from '../theme.types'; export const MantineThemeContext = createContext(null); diff --git a/packages/@mantine/core/src/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.ts b/packages/@mantine/core/src/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.ts index 44edc54d6f3..10f234c3058 100644 --- a/packages/@mantine/core/src/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.ts +++ b/packages/@mantine/core/src/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.ts @@ -1,9 +1,9 @@ -import { MantineColor, MantineTheme, MantineGradient } from '../../theme.types'; -import { parseThemeColor } from '../parse-theme-color/parse-theme-color'; -import { getGradient } from '../get-gradient/get-gradient'; +import { rem } from '../../../utils'; +import { MantineColor, MantineGradient, MantineTheme } from '../../theme.types'; import { darken } from '../darken/darken'; +import { getGradient } from '../get-gradient/get-gradient'; +import { parseThemeColor } from '../parse-theme-color/parse-theme-color'; import { rgba } from '../rgba/rgba'; -import { rem } from '../../../utils'; export interface VariantColorsResolverInput { color: MantineColor | undefined; diff --git a/packages/@mantine/core/src/core/MantineProvider/color-functions/get-gradient/get-gradient.test.ts b/packages/@mantine/core/src/core/MantineProvider/color-functions/get-gradient/get-gradient.test.ts index 9ed010f144d..10da5a00ec9 100644 --- a/packages/@mantine/core/src/core/MantineProvider/color-functions/get-gradient/get-gradient.test.ts +++ b/packages/@mantine/core/src/core/MantineProvider/color-functions/get-gradient/get-gradient.test.ts @@ -1,5 +1,5 @@ -import { getGradient } from './get-gradient'; import { DEFAULT_THEME } from '../../default-theme'; +import { getGradient } from './get-gradient'; describe('@mantine/core/get-gradient', () => { it('returns default gradient from theme if gradient is not provided', () => { diff --git a/packages/@mantine/core/src/core/MantineProvider/color-functions/get-primary-shade/get-primary-shade.test.ts b/packages/@mantine/core/src/core/MantineProvider/color-functions/get-primary-shade/get-primary-shade.test.ts index 46db2eedb19..f42108cd8fe 100644 --- a/packages/@mantine/core/src/core/MantineProvider/color-functions/get-primary-shade/get-primary-shade.test.ts +++ b/packages/@mantine/core/src/core/MantineProvider/color-functions/get-primary-shade/get-primary-shade.test.ts @@ -1,5 +1,5 @@ -import { getPrimaryShade } from './get-primary-shade'; import { DEFAULT_THEME } from '../../default-theme'; +import { getPrimaryShade } from './get-primary-shade'; describe('@mantine/core/get-primary-shade', () => { it('returns correct primary shade', () => { diff --git a/packages/@mantine/core/src/core/MantineProvider/color-functions/get-theme-color/get-theme-color.test.ts b/packages/@mantine/core/src/core/MantineProvider/color-functions/get-theme-color/get-theme-color.test.ts index fd01c5d70c7..2916aaf008c 100644 --- a/packages/@mantine/core/src/core/MantineProvider/color-functions/get-theme-color/get-theme-color.test.ts +++ b/packages/@mantine/core/src/core/MantineProvider/color-functions/get-theme-color/get-theme-color.test.ts @@ -1,5 +1,5 @@ -import { getThemeColor } from './get-theme-color'; import { DEFAULT_THEME } from '../../default-theme'; +import { getThemeColor } from './get-theme-color'; describe('@mantine/core/get-theme-color', () => { it('returns color from theme', () => { diff --git a/packages/@mantine/core/src/core/MantineProvider/color-functions/get-theme-color/get-theme-color.ts b/packages/@mantine/core/src/core/MantineProvider/color-functions/get-theme-color/get-theme-color.ts index 4c80c204423..0761ab78859 100644 --- a/packages/@mantine/core/src/core/MantineProvider/color-functions/get-theme-color/get-theme-color.ts +++ b/packages/@mantine/core/src/core/MantineProvider/color-functions/get-theme-color/get-theme-color.ts @@ -1,5 +1,5 @@ -import { parseThemeColor } from '../parse-theme-color/parse-theme-color'; import type { MantineTheme } from '../../theme.types'; +import { parseThemeColor } from '../parse-theme-color/parse-theme-color'; export function getThemeColor(color: string | undefined | null, theme: MantineTheme) { const parsed = parseThemeColor({ color: color || theme.primaryColor, theme }); diff --git a/packages/@mantine/core/src/core/MantineProvider/color-functions/is-light-color/is-light-color.ts b/packages/@mantine/core/src/core/MantineProvider/color-functions/is-light-color/is-light-color.ts index d4a916aca50..5763466110c 100644 --- a/packages/@mantine/core/src/core/MantineProvider/color-functions/is-light-color/is-light-color.ts +++ b/packages/@mantine/core/src/core/MantineProvider/color-functions/is-light-color/is-light-color.ts @@ -1,4 +1,4 @@ -import { toRgba, RGBA } from '../to-rgba/to-rgba'; +import { RGBA, toRgba } from '../to-rgba/to-rgba'; function getPartLuminance(value: number) { const x = value / 255; diff --git a/packages/@mantine/core/src/core/MantineProvider/color-functions/parse-theme-color/parse-theme-color.test.ts b/packages/@mantine/core/src/core/MantineProvider/color-functions/parse-theme-color/parse-theme-color.test.ts index 1497c4e73b4..7592657f883 100644 --- a/packages/@mantine/core/src/core/MantineProvider/color-functions/parse-theme-color/parse-theme-color.test.ts +++ b/packages/@mantine/core/src/core/MantineProvider/color-functions/parse-theme-color/parse-theme-color.test.ts @@ -1,5 +1,5 @@ -import { parseThemeColor } from './parse-theme-color'; import { DEFAULT_THEME } from '../../default-theme'; +import { parseThemeColor } from './parse-theme-color'; describe('@mantine/core/parse-theme-color', () => { it('parses theme color correctly', () => { diff --git a/packages/@mantine/core/src/core/MantineProvider/color-functions/parse-theme-color/parse-theme-color.ts b/packages/@mantine/core/src/core/MantineProvider/color-functions/parse-theme-color/parse-theme-color.ts index b3921fae7a9..d1ff3b9244f 100644 --- a/packages/@mantine/core/src/core/MantineProvider/color-functions/parse-theme-color/parse-theme-color.ts +++ b/packages/@mantine/core/src/core/MantineProvider/color-functions/parse-theme-color/parse-theme-color.ts @@ -1,5 +1,5 @@ -import type { MantineTheme, MantineColorShade, MantineColorScheme } from '../../theme.types'; import type { CssVariable } from '../../../Box'; +import type { MantineColorScheme, MantineColorShade, MantineTheme } from '../../theme.types'; import { getPrimaryShade } from '../get-primary-shade/get-primary-shade'; interface ParseThemeColorOptions { diff --git a/packages/@mantine/core/src/core/MantineProvider/color-scheme-managers/local-storage-manager.ts b/packages/@mantine/core/src/core/MantineProvider/color-scheme-managers/local-storage-manager.ts index a555a46f0b5..e6a9ae5dbfb 100644 --- a/packages/@mantine/core/src/core/MantineProvider/color-scheme-managers/local-storage-manager.ts +++ b/packages/@mantine/core/src/core/MantineProvider/color-scheme-managers/local-storage-manager.ts @@ -1,5 +1,5 @@ -import type { MantineColorSchemeManager } from './types'; import { isMantineColorScheme } from './is-mantine-color-scheme'; +import type { MantineColorSchemeManager } from './types'; export interface LocalStorageColorSchemeManagerOptions { /** Local storage key used to retrieve value with `localStorage.getItem(key)`, `mantine-color-scheme-value` by default */ diff --git a/packages/@mantine/core/src/core/MantineProvider/convert-css-variables/convert-css-variables.ts b/packages/@mantine/core/src/core/MantineProvider/convert-css-variables/convert-css-variables.ts index 49165ffde2f..59ce7bf6077 100644 --- a/packages/@mantine/core/src/core/MantineProvider/convert-css-variables/convert-css-variables.ts +++ b/packages/@mantine/core/src/core/MantineProvider/convert-css-variables/convert-css-variables.ts @@ -1,4 +1,4 @@ -import { cssVariablesObjectToString, CSSVariables } from './css-variables-object-to-string'; +import { CSSVariables, cssVariablesObjectToString } from './css-variables-object-to-string'; import { wrapWithSelector } from './wrap-with-selector'; export interface ConvertCSSVariablesInput { diff --git a/packages/@mantine/core/src/core/MantineProvider/default-theme.ts b/packages/@mantine/core/src/core/MantineProvider/default-theme.ts index a706626cddd..fd6b0dd18aa 100644 --- a/packages/@mantine/core/src/core/MantineProvider/default-theme.ts +++ b/packages/@mantine/core/src/core/MantineProvider/default-theme.ts @@ -1,7 +1,7 @@ -import type { MantineTheme } from './theme.types'; -import { DEFAULT_COLORS } from './default-colors'; -import { defaultVariantColorsResolver } from './color-functions'; import { rem } from '../utils'; +import { defaultVariantColorsResolver } from './color-functions'; +import { DEFAULT_COLORS } from './default-colors'; +import type { MantineTheme } from './theme.types'; const DEFAULT_FONT_FAMILY = '-apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji'; diff --git a/packages/@mantine/core/src/core/MantineProvider/merge-mantine-theme/merge-mantine-theme.test.ts b/packages/@mantine/core/src/core/MantineProvider/merge-mantine-theme/merge-mantine-theme.test.ts index 7a53725f84c..b79af42b70f 100644 --- a/packages/@mantine/core/src/core/MantineProvider/merge-mantine-theme/merge-mantine-theme.test.ts +++ b/packages/@mantine/core/src/core/MantineProvider/merge-mantine-theme/merge-mantine-theme.test.ts @@ -1,8 +1,8 @@ import { DEFAULT_THEME } from '../default-theme'; import { - mergeMantineTheme, INVALID_PRIMARY_COLOR_ERROR, INVALID_PRIMARY_SHADE_ERROR, + mergeMantineTheme, } from './merge-mantine-theme'; describe('@mantine/core/merge-mantine-theme', () => { diff --git a/packages/@mantine/core/src/core/MantineProvider/merge-theme-overrides/merge-theme-overrides.ts b/packages/@mantine/core/src/core/MantineProvider/merge-theme-overrides/merge-theme-overrides.ts index 05a40558eaf..0ef1d3e7520 100644 --- a/packages/@mantine/core/src/core/MantineProvider/merge-theme-overrides/merge-theme-overrides.ts +++ b/packages/@mantine/core/src/core/MantineProvider/merge-theme-overrides/merge-theme-overrides.ts @@ -1,5 +1,5 @@ -import { MantineThemeOverride } from '../theme.types'; import { deepMerge } from '../../utils'; +import { MantineThemeOverride } from '../theme.types'; export function mergeThemeOverrides(...overrides: MantineThemeOverride[]): MantineThemeOverride { return overrides.reduce((acc, override) => deepMerge(acc, override), {}); diff --git a/packages/@mantine/core/src/core/MantineProvider/use-props/use-props.test.tsx b/packages/@mantine/core/src/core/MantineProvider/use-props/use-props.test.tsx index fc910d0b6b2..8651e84eb8c 100644 --- a/packages/@mantine/core/src/core/MantineProvider/use-props/use-props.test.tsx +++ b/packages/@mantine/core/src/core/MantineProvider/use-props/use-props.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { renderHook } from '@testing-library/react'; -import { useProps } from './use-props'; import { MantineProvider } from '../MantineProvider'; +import { useProps } from './use-props'; function Wrapper({ children }: { children: React.ReactNode }) { return ( diff --git a/packages/@mantine/core/src/core/factory/factory.ts b/packages/@mantine/core/src/core/factory/factory.ts index e0ef2b472d0..2655da81492 100644 --- a/packages/@mantine/core/src/core/factory/factory.ts +++ b/packages/@mantine/core/src/core/factory/factory.ts @@ -1,6 +1,6 @@ import { forwardRef } from 'react'; import type { MantineThemeComponent } from '../MantineProvider'; -import type { Styles, ClassNames, PartialVarsResolver } from '../styles-api'; +import type { ClassNames, PartialVarsResolver, Styles } from '../styles-api'; export type DataAttributes = Record<`data-${string}`, any>; diff --git a/packages/@mantine/core/src/core/factory/polymorphic-factory.ts b/packages/@mantine/core/src/core/factory/polymorphic-factory.ts index 18e65a9640e..9f478127810 100644 --- a/packages/@mantine/core/src/core/factory/polymorphic-factory.ts +++ b/packages/@mantine/core/src/core/factory/polymorphic-factory.ts @@ -1,12 +1,12 @@ import { forwardRef } from 'react'; +import { PolymorphicComponentProps } from './create-polymorphic-component'; import { + ComponentClasses, FactoryPayload, + identity, StaticComponents, ThemeExtend, - identity, - ComponentClasses, } from './factory'; -import { PolymorphicComponentProps } from './create-polymorphic-component'; export interface PolymorphicFactoryPayload extends FactoryPayload { defaultComponent: any; diff --git a/packages/@mantine/core/src/core/styles-api/create-vars-resolver/create-vars-resolver.ts b/packages/@mantine/core/src/core/styles-api/create-vars-resolver/create-vars-resolver.ts index b437017e5fb..4bfdb3fba3d 100644 --- a/packages/@mantine/core/src/core/styles-api/create-vars-resolver/create-vars-resolver.ts +++ b/packages/@mantine/core/src/core/styles-api/create-vars-resolver/create-vars-resolver.ts @@ -1,6 +1,6 @@ import { CssVariable } from '../../Box'; -import { MantineTheme } from '../../MantineProvider'; import { FactoryPayload } from '../../factory'; +import { MantineTheme } from '../../MantineProvider'; export type TransformVars = { [Key in keyof V]: V[Key] extends CssVariable ? Record : never; diff --git a/packages/@mantine/core/src/core/styles-api/styles-api.types.ts b/packages/@mantine/core/src/core/styles-api/styles-api.types.ts index 2b861ba1cf3..b673415bedd 100644 --- a/packages/@mantine/core/src/core/styles-api/styles-api.types.ts +++ b/packages/@mantine/core/src/core/styles-api/styles-api.types.ts @@ -1,7 +1,7 @@ import type { CSSProperties } from 'react'; -import type { MantineTheme } from '../MantineProvider'; import type { MantineStyleProp } from '../Box'; import type { FactoryPayload } from '../factory'; +import type { MantineTheme } from '../MantineProvider'; import { PartialVarsResolver } from './create-vars-resolver/create-vars-resolver'; export interface GetStylesApiOptions { diff --git a/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-class-name.test.ts b/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-class-name.test.ts index 8b9dadaa006..c1fdbcc93e9 100644 --- a/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-class-name.test.ts +++ b/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-class-name.test.ts @@ -1,6 +1,6 @@ import { DEFAULT_THEME, MantineTheme } from '../../../MantineProvider'; -import { FOCUS_CLASS_NAMES } from './get-global-class-names/get-global-class-names'; import { getClassName, GetClassNameOptions } from './get-class-name'; +import { FOCUS_CLASS_NAMES } from './get-global-class-names/get-global-class-names'; const THEME_WITH_CLASSNAMES: MantineTheme = { ...DEFAULT_THEME, diff --git a/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-class-name.ts b/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-class-name.ts index d12fb70c79f..89130601a52 100644 --- a/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-class-name.ts +++ b/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-class-name.ts @@ -1,14 +1,14 @@ import cx from 'clsx'; import { MantineTheme } from '../../../MantineProvider'; import { GetStylesApiOptions } from '../../styles-api.types'; -import { getStaticClassNames } from './get-static-class-names/get-static-class-names'; -import { getThemeClassNames } from './get-theme-class-names/get-theme-class-names'; import { getGlobalClassNames } from './get-global-class-names/get-global-class-names'; -import { getVariantClassName } from './get-variant-class-name/get-variant-class-name'; +import { getOptionsClassNames } from './get-options-class-names/get-options-class-names'; +import { getResolvedClassNames } from './get-resolved-class-names/get-resolved-class-names'; import { getRootClassName } from './get-root-class-name/get-root-class-name'; import { getSelectorClassName } from './get-selector-class-name/get-selector-class-name'; -import { getResolvedClassNames } from './get-resolved-class-names/get-resolved-class-names'; -import { getOptionsClassNames } from './get-options-class-names/get-options-class-names'; +import { getStaticClassNames } from './get-static-class-names/get-static-class-names'; +import { getThemeClassNames } from './get-theme-class-names/get-theme-class-names'; +import { getVariantClassName } from './get-variant-class-name/get-variant-class-name'; type __ClassNames = | undefined diff --git a/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-global-class-names/get-global-class-names.test.ts b/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-global-class-names/get-global-class-names.test.ts index aed43d79033..dd447600bfb 100644 --- a/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-global-class-names/get-global-class-names.test.ts +++ b/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-global-class-names/get-global-class-names.test.ts @@ -1,5 +1,5 @@ import { DEFAULT_THEME } from '../../../../MantineProvider'; -import { getGlobalClassNames, FOCUS_CLASS_NAMES } from './get-global-class-names'; +import { FOCUS_CLASS_NAMES, getGlobalClassNames } from './get-global-class-names'; describe('@mantine/core/get-global-class-names', () => { it('returns empty string if both focusable and active options are false', () => { diff --git a/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-global-class-names/get-global-class-names.ts b/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-global-class-names/get-global-class-names.ts index 3c09f5d8ac4..7a764488107 100644 --- a/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-global-class-names/get-global-class-names.ts +++ b/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-global-class-names/get-global-class-names.ts @@ -1,6 +1,6 @@ import cx from 'clsx'; -import { GetStylesApiOptions } from '../../../styles-api.types'; import { MantineTheme } from '../../../../MantineProvider'; +import { GetStylesApiOptions } from '../../../styles-api.types'; interface GetGlobalClassNamesOptions { theme: MantineTheme; diff --git a/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-options-class-names/get-options-class-names.ts b/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-options-class-names/get-options-class-names.ts index c438a705286..1b64b4d36a1 100644 --- a/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-options-class-names/get-options-class-names.ts +++ b/packages/@mantine/core/src/core/styles-api/use-styles/get-class-name/get-options-class-names/get-options-class-names.ts @@ -1,8 +1,8 @@ +import { GetStylesApiOptions } from '../../../styles-api.types'; import { resolveClassNames, ResolveClassNamesInput, } from '../resolve-class-names/resolve-class-names'; -import { GetStylesApiOptions } from '../../../styles-api.types'; interface GetOptionsClassNamesInput extends Omit { selector: string; diff --git a/packages/@mantine/core/src/core/styles-api/use-styles/get-style/get-style.ts b/packages/@mantine/core/src/core/styles-api/use-styles/get-style/get-style.ts index b4020967e62..7d299f8b680 100644 --- a/packages/@mantine/core/src/core/styles-api/use-styles/get-style/get-style.ts +++ b/packages/@mantine/core/src/core/styles-api/use-styles/get-style/get-style.ts @@ -1,10 +1,10 @@ import { CSSProperties } from 'react'; -import { MantineTheme } from '../../../MantineProvider'; import { MantineStyleProp } from '../../../Box'; +import { MantineTheme } from '../../../MantineProvider'; import { GetStylesApiOptions } from '../../styles-api.types'; import { getThemeStyles } from './get-theme-styles/get-theme-styles'; -import { resolveStyles } from './resolve-styles/resolve-styles'; import { resolveStyle } from './resolve-style/resolve-style'; +import { resolveStyles } from './resolve-styles/resolve-styles'; import { resolveVars, VarsResolver } from './resolve-vars/resolve-vars'; export type _Styles = diff --git a/packages/@mantine/core/src/core/styles-api/use-styles/use-styles.ts b/packages/@mantine/core/src/core/styles-api/use-styles/use-styles.ts index f853134d803..cbffa59e376 100644 --- a/packages/@mantine/core/src/core/styles-api/use-styles/use-styles.ts +++ b/packages/@mantine/core/src/core/styles-api/use-styles/use-styles.ts @@ -1,11 +1,11 @@ import { CSSProperties } from 'react'; -import { useMantineTheme, useMantineClassNamesPrefix } from '../../MantineProvider'; import type { MantineStyleProp } from '../../Box'; import { FactoryPayload } from '../../factory'; +import { useMantineClassNamesPrefix, useMantineTheme } from '../../MantineProvider'; import { PartialVarsResolver, VarsResolver } from '../create-vars-resolver/create-vars-resolver'; +import { ClassNames, ClassNamesArray, GetStylesApiOptions, Styles } from '../styles-api.types'; import { getClassName } from './get-class-name/get-class-name'; import { getStyle } from './get-style/get-style'; -import { Styles, ClassNames, GetStylesApiOptions, ClassNamesArray } from '../styles-api.types'; export interface UseStylesInput { name: string | (string | undefined)[]; diff --git a/packages/@mantine/core/src/core/utils/close-on-escape/close-on-escape.test.ts b/packages/@mantine/core/src/core/utils/close-on-escape/close-on-escape.test.ts index 2a4c12f3798..1c94c9ef660 100644 --- a/packages/@mantine/core/src/core/utils/close-on-escape/close-on-escape.test.ts +++ b/packages/@mantine/core/src/core/utils/close-on-escape/close-on-escape.test.ts @@ -1,5 +1,5 @@ -import { closeOnEscape } from './close-on-escape'; import { noop } from '../noop/noop'; +import { closeOnEscape } from './close-on-escape'; const mockEvent: any = { key: 'Escape', code: 'Escape' }; diff --git a/packages/@mantine/core/src/core/utils/get-breakpoint-value/get-breakpoint-value.ts b/packages/@mantine/core/src/core/utils/get-breakpoint-value/get-breakpoint-value.ts index 4eabc2049bd..8c12afd357a 100644 --- a/packages/@mantine/core/src/core/utils/get-breakpoint-value/get-breakpoint-value.ts +++ b/packages/@mantine/core/src/core/utils/get-breakpoint-value/get-breakpoint-value.ts @@ -1,4 +1,4 @@ -import type { MantineTheme, MantineBreakpoint } from '../../MantineProvider'; +import type { MantineBreakpoint, MantineTheme } from '../../MantineProvider'; import { px } from '../units-converters'; export function getBreakpointValue(breakpoint: number | string, theme: MantineTheme) { diff --git a/packages/@mantine/core/src/core/utils/get-size/get-size.test.ts b/packages/@mantine/core/src/core/utils/get-size/get-size.test.ts index 9cfb6a2ae42..0eaf612e7ce 100644 --- a/packages/@mantine/core/src/core/utils/get-size/get-size.test.ts +++ b/packages/@mantine/core/src/core/utils/get-size/get-size.test.ts @@ -1,4 +1,4 @@ -import { getSize, getSpacing, getShadow, getRadius, getFontSize, getLineHeight } from './get-size'; +import { getFontSize, getLineHeight, getRadius, getShadow, getSize, getSpacing } from './get-size'; describe('@mantine/core/get-size', () => { it('returns correct size for numbers and number like values', () => { diff --git a/packages/@mantine/core/src/core/utils/units-converters/rem.test.ts b/packages/@mantine/core/src/core/utils/units-converters/rem.test.ts index 41db34ed7b4..8a35797fee4 100644 --- a/packages/@mantine/core/src/core/utils/units-converters/rem.test.ts +++ b/packages/@mantine/core/src/core/utils/units-converters/rem.test.ts @@ -1,4 +1,4 @@ -import { rem, em } from './rem'; +import { em, rem } from './rem'; describe('@mantine/units-converters/rem', () => { it('returns undefined if input is undefined', () => { diff --git a/packages/@mantine/dates/src/components/Calendar/Calendar.test.tsx b/packages/@mantine/dates/src/components/Calendar/Calendar.test.tsx index 3a66fa4c3a5..50b3a6700cb 100644 --- a/packages/@mantine/dates/src/components/Calendar/Calendar.test.tsx +++ b/packages/@mantine/dates/src/components/Calendar/Calendar.test.tsx @@ -1,9 +1,9 @@ import dayjs from 'dayjs'; import React from 'react'; -import { render, tests, screen, userEvent } from '@mantine-tests/core'; +import { render, screen, tests, userEvent } from '@mantine-tests/core'; import { datesTests } from '@mantine-tests/dates'; -import { Calendar, CalendarProps, CalendarStylesNames } from './Calendar'; import { DatesProvider } from '../DatesProvider'; +import { Calendar, CalendarProps, CalendarStylesNames } from './Calendar'; const defaultProps: CalendarProps = { defaultDate: new Date(2022, 3, 11), diff --git a/packages/@mantine/dates/src/components/Calendar/Calendar.tsx b/packages/@mantine/dates/src/components/Calendar/Calendar.tsx index 3c0186a468d..fa1d21ce314 100644 --- a/packages/@mantine/dates/src/components/Calendar/Calendar.tsx +++ b/packages/@mantine/dates/src/components/Calendar/Calendar.tsx @@ -3,25 +3,25 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, Factory, + factory, + StylesApiProps, + useProps, useResolvedStylesApi, } from '@mantine/core'; import { useUncontrolled } from '@mantine/hooks'; -import { MonthLevelGroup, MonthLevelGroupStylesNames } from '../MonthLevelGroup'; -import { YearLevelGroup, YearLevelGroupStylesNames } from '../YearLevelGroup'; -import { DecadeLevelGroup, DecadeLevelGroupStylesNames } from '../DecadeLevelGroup'; +import { useUncontrolledDates } from '../../hooks'; import { CalendarLevel } from '../../types'; -import { clampLevel } from './clamp-level/clamp-level'; +import { shiftTimezone } from '../../utils'; +import { useDatesContext } from '../DatesProvider'; +import { DecadeLevelSettings } from '../DecadeLevel'; +import { DecadeLevelGroup, DecadeLevelGroupStylesNames } from '../DecadeLevelGroup'; import { MonthLevelSettings } from '../MonthLevel'; +import { MonthLevelGroup, MonthLevelGroupStylesNames } from '../MonthLevelGroup'; import { YearLevelSettings } from '../YearLevel'; -import { DecadeLevelSettings } from '../DecadeLevel'; -import { useDatesContext } from '../DatesProvider'; -import { shiftTimezone } from '../../utils'; -import { useUncontrolledDates } from '../../hooks'; +import { YearLevelGroup, YearLevelGroupStylesNames } from '../YearLevelGroup'; +import { clampLevel } from './clamp-level/clamp-level'; export type CalendarStylesNames = | MonthLevelGroupStylesNames diff --git a/packages/@mantine/dates/src/components/CalendarHeader/CalendarHeader.test.tsx b/packages/@mantine/dates/src/components/CalendarHeader/CalendarHeader.test.tsx index 150cbb2806b..f27f348bee3 100644 --- a/packages/@mantine/dates/src/components/CalendarHeader/CalendarHeader.test.tsx +++ b/packages/@mantine/dates/src/components/CalendarHeader/CalendarHeader.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { datesTests } from '@mantine-tests/dates'; import { CalendarHeader, CalendarHeaderProps, CalendarHeaderStylesNames } from './CalendarHeader'; diff --git a/packages/@mantine/dates/src/components/CalendarHeader/CalendarHeader.tsx b/packages/@mantine/dates/src/components/CalendarHeader/CalendarHeader.tsx index 9a7fe89aab3..c1bcf4ee79d 100644 --- a/packages/@mantine/dates/src/components/CalendarHeader/CalendarHeader.tsx +++ b/packages/@mantine/dates/src/components/CalendarHeader/CalendarHeader.tsx @@ -1,19 +1,19 @@ import React from 'react'; import { + AccordionChevron, Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, + getFontSize, + getSize, MantineSize, + StylesApiProps, UnstyledButton, - AccordionChevron, - getSize, - getFontSize, + useProps, + useStyles, } from '@mantine/core'; import classes from './CalendarHeader.module.css'; diff --git a/packages/@mantine/dates/src/components/DateInput/DateInput.story.tsx b/packages/@mantine/dates/src/components/DateInput/DateInput.story.tsx index c8761a1c370..2b41052ccd9 100644 --- a/packages/@mantine/dates/src/components/DateInput/DateInput.story.tsx +++ b/packages/@mantine/dates/src/components/DateInput/DateInput.story.tsx @@ -1,11 +1,13 @@ import dayjs from 'dayjs'; + import 'dayjs/locale/ru'; -import React, { useState } from 'react'; + import customParseFormat from 'dayjs/plugin/customParseFormat'; -import { TextInput, Button, Group } from '@mantine/core'; -import { DateInput } from './DateInput'; +import React, { useState } from 'react'; +import { Button, Group, TextInput } from '@mantine/core'; import { DatePickerInput } from '../DatePickerInput'; import { DatesProvider } from '../DatesProvider'; +import { DateInput } from './DateInput'; dayjs.extend(customParseFormat); diff --git a/packages/@mantine/dates/src/components/DateInput/DateInput.test.tsx b/packages/@mantine/dates/src/components/DateInput/DateInput.test.tsx index 06f7383a2f7..4881a3380fb 100644 --- a/packages/@mantine/dates/src/components/DateInput/DateInput.test.tsx +++ b/packages/@mantine/dates/src/components/DateInput/DateInput.test.tsx @@ -1,22 +1,22 @@ import React from 'react'; +import { __InputStylesNames } from '@mantine/core'; import { - tests, inputDefaultProps, inputStylesApiSelectors, render, screen, + tests, userEvent, } from '@mantine-tests/core'; import { + clickControl, datesTests, expectNoPopover, expectOpenedPopover, expectValue, - clickControl, } from '@mantine-tests/dates'; -import { __InputStylesNames } from '@mantine/core'; -import { DateInput, DateInputProps } from './DateInput'; import { DatesProvider } from '../DatesProvider'; +import { DateInput, DateInputProps } from './DateInput'; const defaultProps: DateInputProps = { popoverProps: { transitionProps: { duration: 0 }, withinPortal: false }, diff --git a/packages/@mantine/dates/src/components/DateInput/DateInput.tsx b/packages/@mantine/dates/src/components/DateInput/DateInput.tsx index 9b6b3bdd379..bceab327ef0 100644 --- a/packages/@mantine/dates/src/components/DateInput/DateInput.tsx +++ b/packages/@mantine/dates/src/components/DateInput/DateInput.tsx @@ -1,33 +1,33 @@ +import dayjs from 'dayjs'; import React, { useEffect, useState } from 'react'; import { + __BaseInputProps, + __InputStylesNames, BoxProps, - StylesApiProps, - factory, + CloseButton, ElementProps, + factory, Factory, + Input, InputVariant, - __BaseInputProps, - __InputStylesNames, + MantineSize, + Popover, PopoverProps, + StylesApiProps, useInputProps, - Input, - Popover, - CloseButton, - MantineSize, } from '@mantine/core'; import { useDidUpdate } from '@mantine/hooks'; -import dayjs from 'dayjs'; +import { useUncontrolledDates } from '../../hooks'; +import { CalendarLevel, DateValue } from '../../types'; +import { assignTime } from '../../utils'; import { Calendar, CalendarBaseProps, CalendarStylesNames, pickCalendarProps } from '../Calendar'; +import { useDatesContext } from '../DatesProvider'; import { DecadeLevelSettings } from '../DecadeLevel'; -import { YearLevelSettings } from '../YearLevel'; -import { MonthLevelSettings } from '../MonthLevel'; import { HiddenDatesInput } from '../HiddenDatesInput'; -import { assignTime } from '../../utils'; -import { DateValue, CalendarLevel } from '../../types'; -import { useDatesContext } from '../DatesProvider'; -import { isDateValid } from './is-date-valid/is-date-valid'; +import { MonthLevelSettings } from '../MonthLevel'; +import { YearLevelSettings } from '../YearLevel'; import { dateStringParser } from './date-string-parser/date-string-parser'; -import { useUncontrolledDates } from '../../hooks'; +import { isDateValid } from './is-date-valid/is-date-valid'; export type DateInputStylesNames = __InputStylesNames | CalendarStylesNames; diff --git a/packages/@mantine/dates/src/components/DatePicker/DatePicker.story.tsx b/packages/@mantine/dates/src/components/DatePicker/DatePicker.story.tsx index 9727c1af954..94d0125b352 100644 --- a/packages/@mantine/dates/src/components/DatePicker/DatePicker.story.tsx +++ b/packages/@mantine/dates/src/components/DatePicker/DatePicker.story.tsx @@ -1,4 +1,5 @@ import 'dayjs/locale/ru'; + import React, { useState } from 'react'; import { DatesRangeValue } from '../../types'; import { DatePicker } from './DatePicker'; diff --git a/packages/@mantine/dates/src/components/DatePicker/DatePicker.test.tsx b/packages/@mantine/dates/src/components/DatePicker/DatePicker.test.tsx index 6aaeec95e85..ccae7c405a4 100644 --- a/packages/@mantine/dates/src/components/DatePicker/DatePicker.test.tsx +++ b/packages/@mantine/dates/src/components/DatePicker/DatePicker.test.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { render, tests, userEvent } from '@mantine-tests/core'; import { datesTests } from '@mantine-tests/dates'; -import { DatePicker, DatePickerProps, DatePickerStylesNames } from './DatePicker'; import { DatesProvider } from '../DatesProvider'; +import { DatePicker, DatePickerProps, DatePickerStylesNames } from './DatePicker'; const defaultProps = { defaultDate: new Date(2022, 3, 11), diff --git a/packages/@mantine/dates/src/components/DatePicker/DatePicker.tsx b/packages/@mantine/dates/src/components/DatePicker/DatePicker.tsx index 9cbdddcfdd4..5cb60077a1d 100644 --- a/packages/@mantine/dates/src/components/DatePicker/DatePicker.tsx +++ b/packages/@mantine/dates/src/components/DatePicker/DatePicker.tsx @@ -1,22 +1,22 @@ import React from 'react'; import { BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, MantineComponentStaticProperties, + StylesApiProps, + useProps, useResolvedStylesApi, } from '@mantine/core'; import { useDatesState } from '../../hooks'; -import { PickerBaseProps, DatePickerType, CalendarLevel } from '../../types'; +import { CalendarLevel, DatePickerType, PickerBaseProps } from '../../types'; +import { shiftTimezone } from '../../utils'; import { Calendar, CalendarBaseProps, CalendarSettings, CalendarStylesNames } from '../Calendar'; +import { useDatesContext } from '../DatesProvider'; import { DecadeLevelBaseSettings } from '../DecadeLevel'; -import { YearLevelBaseSettings } from '../YearLevel'; import { MonthLevelBaseSettings } from '../MonthLevel'; -import { shiftTimezone } from '../../utils'; -import { useDatesContext } from '../DatesProvider'; +import { YearLevelBaseSettings } from '../YearLevel'; export type DatePickerStylesNames = CalendarStylesNames; diff --git a/packages/@mantine/dates/src/components/DatePickerInput/DatePickerInput.story.tsx b/packages/@mantine/dates/src/components/DatePickerInput/DatePickerInput.story.tsx index 064d1c23910..1aafa38abbd 100644 --- a/packages/@mantine/dates/src/components/DatePickerInput/DatePickerInput.story.tsx +++ b/packages/@mantine/dates/src/components/DatePickerInput/DatePickerInput.story.tsx @@ -1,8 +1,8 @@ +import dayjs from 'dayjs'; import React, { useState } from 'react'; import { Button, Group } from '@mantine/core'; -import dayjs from 'dayjs'; -import { DatePickerInput } from './DatePickerInput'; import { DatesProvider } from '../DatesProvider'; +import { DatePickerInput } from './DatePickerInput'; export default { title: 'DatePickerInput' }; diff --git a/packages/@mantine/dates/src/components/DatePickerInput/DatePickerInput.test.tsx b/packages/@mantine/dates/src/components/DatePickerInput/DatePickerInput.test.tsx index c250771905b..279e01a015b 100644 --- a/packages/@mantine/dates/src/components/DatePickerInput/DatePickerInput.test.tsx +++ b/packages/@mantine/dates/src/components/DatePickerInput/DatePickerInput.test.tsx @@ -1,9 +1,9 @@ import React from 'react'; -import { tests, inputDefaultProps, inputStylesApiSelectors, render } from '@mantine-tests/core'; import { __InputStylesNames } from '@mantine/core'; +import { inputDefaultProps, inputStylesApiSelectors, render, tests } from '@mantine-tests/core'; import { clickControl, clickInput, datesTests, expectValue } from '@mantine-tests/dates'; -import { DatePickerInput, DatePickerInputProps } from './DatePickerInput'; import { DatesProvider } from '../DatesProvider'; +import { DatePickerInput, DatePickerInputProps } from './DatePickerInput'; const defaultProps = { popoverProps: { withinPortal: false, transitionProps: { duration: 0 } }, diff --git a/packages/@mantine/dates/src/components/DatePickerInput/DatePickerInput.tsx b/packages/@mantine/dates/src/components/DatePickerInput/DatePickerInput.tsx index ac79ff34797..e55b373b2d2 100644 --- a/packages/@mantine/dates/src/components/DatePickerInput/DatePickerInput.tsx +++ b/packages/@mantine/dates/src/components/DatePickerInput/DatePickerInput.tsx @@ -1,22 +1,22 @@ import React from 'react'; import { + __InputStylesNames, BoxProps, - StylesApiProps, factory, - useProps, - useResolvedStylesApi, Factory, InputVariant, - __InputStylesNames, MantineComponentStaticProperties, + StylesApiProps, + useProps, + useResolvedStylesApi, } from '@mantine/core'; -import { CalendarStylesNames, pickCalendarProps } from '../Calendar'; import { useDatesInput } from '../../hooks'; -import { DatePicker, DatePickerBaseProps } from '../DatePicker'; import { DatePickerType } from '../../types'; import { getDefaultClampedDate, shiftTimezone } from '../../utils'; -import { PickerInputBase, DateInputSharedProps } from '../PickerInputBase'; +import { CalendarStylesNames, pickCalendarProps } from '../Calendar'; +import { DatePicker, DatePickerBaseProps } from '../DatePicker'; import { useDatesContext } from '../DatesProvider'; +import { DateInputSharedProps, PickerInputBase } from '../PickerInputBase'; export type DatePickerInputStylesNames = __InputStylesNames | CalendarStylesNames; diff --git a/packages/@mantine/dates/src/components/DateTimePicker/DateTimePicker.test.tsx b/packages/@mantine/dates/src/components/DateTimePicker/DateTimePicker.test.tsx index 3f1f00ddb18..08bcaf5efd4 100644 --- a/packages/@mantine/dates/src/components/DateTimePicker/DateTimePicker.test.tsx +++ b/packages/@mantine/dates/src/components/DateTimePicker/DateTimePicker.test.tsx @@ -1,24 +1,24 @@ import React from 'react'; import { __InputStylesNames } from '@mantine/core'; import { - tests, inputDefaultProps, inputStylesApiSelectors, - screen, render, + screen, + tests, userEvent, } from '@mantine-tests/core'; import { - datesTests, clickInput, + datesTests, expectNoModal, expectNoPopover, expectOpenedModal, expectOpenedPopover, expectValue, } from '@mantine-tests/dates'; -import { DateTimePicker, DateTimePickerProps } from './DateTimePicker'; import { DatesProvider } from '../DatesProvider'; +import { DateTimePicker, DateTimePickerProps } from './DateTimePicker'; const defaultProps: DateTimePickerProps = { popoverProps: { withinPortal: false, transitionProps: { duration: 0 } }, diff --git a/packages/@mantine/dates/src/components/DateTimePicker/DateTimePicker.tsx b/packages/@mantine/dates/src/components/DateTimePicker/DateTimePicker.tsx index 55a7f57003d..2664e64ba14 100644 --- a/packages/@mantine/dates/src/components/DateTimePicker/DateTimePicker.tsx +++ b/packages/@mantine/dates/src/components/DateTimePicker/DateTimePicker.tsx @@ -1,37 +1,37 @@ import dayjs from 'dayjs'; import React, { useRef, useState } from 'react'; import { + ActionIcon, + ActionIconProps, BoxProps, - StylesApiProps, + CheckIcon, factory, - useProps, - useStyles, Factory, InputVariant, - ActionIconProps, + StylesApiProps, + useProps, useResolvedStylesApi, - ActionIcon, - CheckIcon, + useStyles, } from '@mantine/core'; -import { useDisclosure, useDidUpdate, useMergedRef } from '@mantine/hooks'; +import { useDidUpdate, useDisclosure, useMergedRef } from '@mantine/hooks'; +import { useUncontrolledDates } from '../../hooks'; +import { DateValue } from '../../types'; import { assignTime, shiftTimezone } from '../../utils'; -import { TimeInput, TimeInputProps } from '../TimeInput'; import { - pickCalendarProps, CalendarBaseProps, CalendarSettings, CalendarStylesNames, + pickCalendarProps, } from '../Calendar'; import { DatePicker } from '../DatePicker'; +import { useDatesContext } from '../DatesProvider'; import { - PickerInputBase, DateInputSharedProps, + PickerInputBase, PickerInputBaseStylesNames, } from '../PickerInputBase'; -import { DateValue } from '../../types'; -import { useDatesContext } from '../DatesProvider'; +import { TimeInput, TimeInputProps } from '../TimeInput'; import classes from './DateTimePicker.module.css'; -import { useUncontrolledDates } from '../../hooks'; export type DateTimePickerStylesNames = | 'timeWrapper' diff --git a/packages/@mantine/dates/src/components/DatesProvider/use-dates-context.ts b/packages/@mantine/dates/src/components/DatesProvider/use-dates-context.ts index af7a4e336a7..acf9b64658d 100644 --- a/packages/@mantine/dates/src/components/DatesProvider/use-dates-context.ts +++ b/packages/@mantine/dates/src/components/DatesProvider/use-dates-context.ts @@ -1,4 +1,4 @@ -import { useContext, useCallback } from 'react'; +import { useCallback, useContext } from 'react'; import { DayOfWeek } from '../../types'; import { DatesProviderContext } from './DatesProvider'; diff --git a/packages/@mantine/dates/src/components/Day/Day.test.tsx b/packages/@mantine/dates/src/components/Day/Day.test.tsx index 515da504729..2c917471f2c 100644 --- a/packages/@mantine/dates/src/components/Day/Day.test.tsx +++ b/packages/@mantine/dates/src/components/Day/Day.test.tsx @@ -1,6 +1,6 @@ import React from 'react'; import lodash from 'lodash'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { Day, DayProps, DayStylesNames } from './Day'; const defaultProps: DayProps = { diff --git a/packages/@mantine/dates/src/components/Day/Day.tsx b/packages/@mantine/dates/src/components/Day/Day.tsx index ef72fc34441..fd426e69694 100644 --- a/packages/@mantine/dates/src/components/Day/Day.tsx +++ b/packages/@mantine/dates/src/components/Day/Day.tsx @@ -2,20 +2,20 @@ import dayjs from 'dayjs'; import React from 'react'; import { BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, + getSize, MantineSize, + StylesApiProps, UnstyledButton, - getSize, + useProps, + useStyles, } from '@mantine/core'; -import classes from './Day.module.css'; import { shiftTimezone } from '../../utils'; import { useDatesContext } from '../DatesProvider'; +import classes from './Day.module.css'; export type DayStylesNames = 'day'; export type DayCssVariables = { diff --git a/packages/@mantine/dates/src/components/DecadeLevel/DecadeLevel.test.tsx b/packages/@mantine/dates/src/components/DecadeLevel/DecadeLevel.test.tsx index 9ad6412860f..ddb757c0b9f 100644 --- a/packages/@mantine/dates/src/components/DecadeLevel/DecadeLevel.test.tsx +++ b/packages/@mantine/dates/src/components/DecadeLevel/DecadeLevel.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { datesTests } from '@mantine-tests/dates'; import { DecadeLevel, DecadeLevelProps, DecadeLevelStylesNames } from './DecadeLevel'; diff --git a/packages/@mantine/dates/src/components/DecadeLevel/DecadeLevel.tsx b/packages/@mantine/dates/src/components/DecadeLevel/DecadeLevel.tsx index a9d6551fbcc..36a027fc8dd 100644 --- a/packages/@mantine/dates/src/components/DecadeLevel/DecadeLevel.tsx +++ b/packages/@mantine/dates/src/components/DecadeLevel/DecadeLevel.tsx @@ -1,21 +1,21 @@ +import dayjs from 'dayjs'; import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + StylesApiProps, + useProps, } from '@mantine/core'; -import dayjs from 'dayjs'; -import { YearsList, YearsListSettings, YearsListStylesNames } from '../YearsList'; import { CalendarHeader, CalendarHeaderSettings, CalendarHeaderStylesNames, } from '../CalendarHeader'; import { useDatesContext } from '../DatesProvider'; +import { YearsList, YearsListSettings, YearsListStylesNames } from '../YearsList'; import { getDecadeRange } from './get-decade-range/get-decade-range'; export type DecadeLevelStylesNames = YearsListStylesNames | CalendarHeaderStylesNames; diff --git a/packages/@mantine/dates/src/components/DecadeLevelGroup/DecadeLevelGroup.test.tsx b/packages/@mantine/dates/src/components/DecadeLevelGroup/DecadeLevelGroup.test.tsx index f3a3ba6f072..66738716f1b 100644 --- a/packages/@mantine/dates/src/components/DecadeLevelGroup/DecadeLevelGroup.test.tsx +++ b/packages/@mantine/dates/src/components/DecadeLevelGroup/DecadeLevelGroup.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { datesTests } from '@mantine-tests/dates'; import { DecadeLevelGroup, diff --git a/packages/@mantine/dates/src/components/DecadeLevelGroup/DecadeLevelGroup.tsx b/packages/@mantine/dates/src/components/DecadeLevelGroup/DecadeLevelGroup.tsx index a56c7f48d9d..233fdde2e3f 100644 --- a/packages/@mantine/dates/src/components/DecadeLevelGroup/DecadeLevelGroup.tsx +++ b/packages/@mantine/dates/src/components/DecadeLevelGroup/DecadeLevelGroup.tsx @@ -1,9 +1,9 @@ import dayjs from 'dayjs'; import React, { useRef } from 'react'; -import { BoxProps, StylesApiProps, factory, ElementProps, useProps, Factory } from '@mantine/core'; +import { BoxProps, ElementProps, factory, Factory, StylesApiProps, useProps } from '@mantine/core'; +import { handleControlKeyDown } from '../../utils'; import { DecadeLevel, DecadeLevelSettings, DecadeLevelStylesNames } from '../DecadeLevel'; import { LevelsGroup, LevelsGroupStylesNames } from '../LevelsGroup'; -import { handleControlKeyDown } from '../../utils'; export type DecadeLevelGroupStylesNames = LevelsGroupStylesNames | DecadeLevelStylesNames; diff --git a/packages/@mantine/dates/src/components/HiddenDatesInput/HiddenDatesInput.tsx b/packages/@mantine/dates/src/components/HiddenDatesInput/HiddenDatesInput.tsx index aff4f461964..7c2138d7730 100644 --- a/packages/@mantine/dates/src/components/HiddenDatesInput/HiddenDatesInput.tsx +++ b/packages/@mantine/dates/src/components/HiddenDatesInput/HiddenDatesInput.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { DatesRangeValue, DateValue, DatePickerType } from '../../types'; +import { DatePickerType, DatesRangeValue, DateValue } from '../../types'; export type HiddenDatesInputValue = DatesRangeValue | DateValue | DateValue[]; diff --git a/packages/@mantine/dates/src/components/LevelsGroup/LevelsGroup.tsx b/packages/@mantine/dates/src/components/LevelsGroup/LevelsGroup.tsx index e0277c4db27..af12fa63342 100644 --- a/packages/@mantine/dates/src/components/LevelsGroup/LevelsGroup.tsx +++ b/packages/@mantine/dates/src/components/LevelsGroup/LevelsGroup.tsx @@ -2,13 +2,13 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, - useStyles, + factory, Factory, MantineSize, + StylesApiProps, + useProps, + useStyles, } from '@mantine/core'; import classes from './LevelsGroup.module.css'; diff --git a/packages/@mantine/dates/src/components/Month/Month.test.tsx b/packages/@mantine/dates/src/components/Month/Month.test.tsx index 486743f52cc..15a1ae582a1 100644 --- a/packages/@mantine/dates/src/components/Month/Month.test.tsx +++ b/packages/@mantine/dates/src/components/Month/Month.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { tests, render } from '@mantine-tests/core'; +import { render, tests } from '@mantine-tests/core'; import { datesTests } from '@mantine-tests/dates'; import { Month, MonthProps, MonthStylesNames } from './Month'; diff --git a/packages/@mantine/dates/src/components/Month/Month.tsx b/packages/@mantine/dates/src/components/Month/Month.tsx index fdc071a7c22..fc1e8ce0464 100644 --- a/packages/@mantine/dates/src/components/Month/Month.tsx +++ b/packages/@mantine/dates/src/components/Month/Month.tsx @@ -3,24 +3,24 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, - useStyles, + factory, Factory, MantineSize, + StylesApiProps, + useProps, useResolvedStylesApi, + useStyles, } from '@mantine/core'; import { ControlKeydownPayload, DayOfWeek } from '../../types'; -import { Day, DayProps, DayStylesNames } from '../Day'; -import { getMonthDays } from './get-month-days/get-month-days'; import { useDatesContext } from '../DatesProvider'; +import { Day, DayProps, DayStylesNames } from '../Day'; +import { WeekdaysRow } from '../WeekdaysRow'; import { getDateInTabOrder } from './get-date-in-tab-order/get-date-in-tab-order'; -import { isSameMonth } from './is-same-month/is-same-month'; -import { isBeforeMaxDate } from './is-before-max-date/is-before-max-date'; +import { getMonthDays } from './get-month-days/get-month-days'; import { isAfterMinDate } from './is-after-min-date/is-after-min-date'; -import { WeekdaysRow } from '../WeekdaysRow'; +import { isBeforeMaxDate } from './is-before-max-date/is-before-max-date'; +import { isSameMonth } from './is-same-month/is-same-month'; import classes from './Month.module.css'; export type MonthStylesNames = diff --git a/packages/@mantine/dates/src/components/Month/get-month-days/get-month-days.ts b/packages/@mantine/dates/src/components/Month/get-month-days/get-month-days.ts index cb65927d20e..339d15f4bd0 100644 --- a/packages/@mantine/dates/src/components/Month/get-month-days/get-month-days.ts +++ b/packages/@mantine/dates/src/components/Month/get-month-days/get-month-days.ts @@ -1,7 +1,7 @@ import { DayOfWeek } from '../../../types'; -import { getStartOfWeek } from '../get-start-of-week/get-start-of-week'; -import { getEndOfWeek } from '../get-end-of-week/get-end-of-week'; import { shiftTimezone } from '../../../utils'; +import { getEndOfWeek } from '../get-end-of-week/get-end-of-week'; +import { getStartOfWeek } from '../get-start-of-week/get-start-of-week'; export function getMonthDays( month: Date, diff --git a/packages/@mantine/dates/src/components/MonthLevel/MonthLevel.story.tsx b/packages/@mantine/dates/src/components/MonthLevel/MonthLevel.story.tsx index cb965afb419..7d7a8f3287f 100644 --- a/packages/@mantine/dates/src/components/MonthLevel/MonthLevel.story.tsx +++ b/packages/@mantine/dates/src/components/MonthLevel/MonthLevel.story.tsx @@ -1,4 +1,5 @@ import 'dayjs/locale/ru'; + import dayjs from 'dayjs'; import React, { useState } from 'react'; import { MonthLevel, MonthLevelProps } from './MonthLevel'; diff --git a/packages/@mantine/dates/src/components/MonthLevel/MonthLevel.test.tsx b/packages/@mantine/dates/src/components/MonthLevel/MonthLevel.test.tsx index 3da89e89713..72f5a364243 100644 --- a/packages/@mantine/dates/src/components/MonthLevel/MonthLevel.test.tsx +++ b/packages/@mantine/dates/src/components/MonthLevel/MonthLevel.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { datesTests } from '@mantine-tests/dates'; import { MonthLevel, MonthLevelProps, MonthLevelStylesNames } from './MonthLevel'; diff --git a/packages/@mantine/dates/src/components/MonthLevel/MonthLevel.tsx b/packages/@mantine/dates/src/components/MonthLevel/MonthLevel.tsx index 141d90cd56e..a3071201ba5 100644 --- a/packages/@mantine/dates/src/components/MonthLevel/MonthLevel.tsx +++ b/packages/@mantine/dates/src/components/MonthLevel/MonthLevel.tsx @@ -3,19 +3,19 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + StylesApiProps, + useProps, } from '@mantine/core'; -import { Month, MonthSettings, MonthStylesNames } from '../Month'; import { CalendarHeader, CalendarHeaderSettings, CalendarHeaderStylesNames, } from '../CalendarHeader'; import { useDatesContext } from '../DatesProvider'; +import { Month, MonthSettings, MonthStylesNames } from '../Month'; export type MonthLevelStylesNames = MonthStylesNames | CalendarHeaderStylesNames; diff --git a/packages/@mantine/dates/src/components/MonthLevelGroup/MonthLevelGroup.test.tsx b/packages/@mantine/dates/src/components/MonthLevelGroup/MonthLevelGroup.test.tsx index 6bc23a52d50..1885deca137 100644 --- a/packages/@mantine/dates/src/components/MonthLevelGroup/MonthLevelGroup.test.tsx +++ b/packages/@mantine/dates/src/components/MonthLevelGroup/MonthLevelGroup.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { datesTests } from '@mantine-tests/dates'; import { MonthLevelGroup, diff --git a/packages/@mantine/dates/src/components/MonthLevelGroup/MonthLevelGroup.tsx b/packages/@mantine/dates/src/components/MonthLevelGroup/MonthLevelGroup.tsx index 487cdf60c82..1de3e63c7f0 100644 --- a/packages/@mantine/dates/src/components/MonthLevelGroup/MonthLevelGroup.tsx +++ b/packages/@mantine/dates/src/components/MonthLevelGroup/MonthLevelGroup.tsx @@ -1,9 +1,9 @@ import dayjs from 'dayjs'; import React, { useRef } from 'react'; -import { BoxProps, StylesApiProps, factory, ElementProps, useProps, Factory } from '@mantine/core'; -import { MonthLevel, MonthLevelSettings, MonthLevelStylesNames } from '../MonthLevel'; -import { LevelsGroup, LevelsGroupStylesNames } from '../LevelsGroup'; +import { BoxProps, ElementProps, factory, Factory, StylesApiProps, useProps } from '@mantine/core'; import { handleControlKeyDown } from '../../utils'; +import { LevelsGroup, LevelsGroupStylesNames } from '../LevelsGroup'; +import { MonthLevel, MonthLevelSettings, MonthLevelStylesNames } from '../MonthLevel'; export type MonthLevelGroupStylesNames = MonthLevelStylesNames | LevelsGroupStylesNames; diff --git a/packages/@mantine/dates/src/components/MonthPicker/MonthPicker.test.tsx b/packages/@mantine/dates/src/components/MonthPicker/MonthPicker.test.tsx index 10f5f7f5805..fc6d6be161c 100644 --- a/packages/@mantine/dates/src/components/MonthPicker/MonthPicker.test.tsx +++ b/packages/@mantine/dates/src/components/MonthPicker/MonthPicker.test.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { render, tests, userEvent } from '@mantine-tests/core'; import { datesTests } from '@mantine-tests/dates'; -import { MonthPicker, MonthPickerProps, MonthPickerStylesNames } from './MonthPicker'; import { DatesProvider } from '../DatesProvider'; +import { MonthPicker, MonthPickerProps, MonthPickerStylesNames } from './MonthPicker'; const defaultProps = { defaultDate: new Date(2022, 3, 11), diff --git a/packages/@mantine/dates/src/components/MonthPicker/MonthPicker.tsx b/packages/@mantine/dates/src/components/MonthPicker/MonthPicker.tsx index 654ad0eb4a3..3126b36c6b9 100644 --- a/packages/@mantine/dates/src/components/MonthPicker/MonthPicker.tsx +++ b/packages/@mantine/dates/src/components/MonthPicker/MonthPicker.tsx @@ -1,23 +1,23 @@ import React from 'react'; import { BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, - useResolvedStylesApi, MantineComponentStaticProperties, + StylesApiProps, + useProps, + useResolvedStylesApi, } from '@mantine/core'; import { useDatesState } from '../../hooks'; -import { DecadeLevelBaseSettings } from '../DecadeLevel'; -import { YearLevelBaseSettings } from '../YearLevel'; -import { PickerBaseProps, DatePickerType, CalendarLevel } from '../../types'; +import { CalendarLevel, DatePickerType, PickerBaseProps } from '../../types'; +import { shiftTimezone } from '../../utils'; import { Calendar, CalendarBaseProps } from '../Calendar'; +import { useDatesContext } from '../DatesProvider'; +import { DecadeLevelBaseSettings } from '../DecadeLevel'; import { DecadeLevelGroupStylesNames } from '../DecadeLevelGroup'; +import { YearLevelBaseSettings } from '../YearLevel'; import { YearLevelGroupStylesNames } from '../YearLevelGroup'; -import { shiftTimezone } from '../../utils'; -import { useDatesContext } from '../DatesProvider'; export type MonthPickerStylesNames = DecadeLevelGroupStylesNames | YearLevelGroupStylesNames; diff --git a/packages/@mantine/dates/src/components/MonthPickerInput/MonthPickerInput.test.tsx b/packages/@mantine/dates/src/components/MonthPickerInput/MonthPickerInput.test.tsx index 48d4561aef2..7cbc8dca06a 100644 --- a/packages/@mantine/dates/src/components/MonthPickerInput/MonthPickerInput.test.tsx +++ b/packages/@mantine/dates/src/components/MonthPickerInput/MonthPickerInput.test.tsx @@ -1,15 +1,15 @@ import React from 'react'; +import { __InputStylesNames } from '@mantine/core'; import { - tests, inputDefaultProps, inputStylesApiSelectors, render, + tests, userEvent, } from '@mantine-tests/core'; -import { __InputStylesNames } from '@mantine/core'; import { clickInput, datesTests, expectValue } from '@mantine-tests/dates'; -import { MonthPickerInput, MonthPickerInputProps } from './MonthPickerInput'; import { DatesProvider } from '../DatesProvider'; +import { MonthPickerInput, MonthPickerInputProps } from './MonthPickerInput'; const defaultProps = { popoverProps: { withinPortal: false, transitionProps: { duration: 0 } }, diff --git a/packages/@mantine/dates/src/components/MonthPickerInput/MonthPickerInput.tsx b/packages/@mantine/dates/src/components/MonthPickerInput/MonthPickerInput.tsx index da34820cf72..43058a73c40 100644 --- a/packages/@mantine/dates/src/components/MonthPickerInput/MonthPickerInput.tsx +++ b/packages/@mantine/dates/src/components/MonthPickerInput/MonthPickerInput.tsx @@ -1,22 +1,22 @@ import React from 'react'; import { + __InputStylesNames, BoxProps, - StylesApiProps, factory, - useProps, - useResolvedStylesApi, Factory, InputVariant, - __InputStylesNames, MantineComponentStaticProperties, + StylesApiProps, + useProps, + useResolvedStylesApi, } from '@mantine/core'; -import { pickCalendarProps } from '../Calendar'; import { useDatesInput } from '../../hooks'; -import { MonthPicker, MonthPickerBaseProps, MonthPickerStylesNames } from '../MonthPicker'; import { DatePickerType } from '../../types'; import { getDefaultClampedDate, shiftTimezone } from '../../utils'; -import { PickerInputBase, DateInputSharedProps } from '../PickerInputBase'; +import { pickCalendarProps } from '../Calendar'; import { useDatesContext } from '../DatesProvider'; +import { MonthPicker, MonthPickerBaseProps, MonthPickerStylesNames } from '../MonthPicker'; +import { DateInputSharedProps, PickerInputBase } from '../PickerInputBase'; export type MonthPickerInputStylesNames = __InputStylesNames | MonthPickerStylesNames; diff --git a/packages/@mantine/dates/src/components/MonthsList/MonthsList.test.tsx b/packages/@mantine/dates/src/components/MonthsList/MonthsList.test.tsx index 4164d576168..48bde310c92 100644 --- a/packages/@mantine/dates/src/components/MonthsList/MonthsList.test.tsx +++ b/packages/@mantine/dates/src/components/MonthsList/MonthsList.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { datesTests } from '@mantine-tests/dates'; import { MonthsList, MonthsListProps, MonthsListStylesNames } from './MonthsList'; diff --git a/packages/@mantine/dates/src/components/MonthsList/MonthsList.tsx b/packages/@mantine/dates/src/components/MonthsList/MonthsList.tsx index a9f2b3d6746..170419551b4 100644 --- a/packages/@mantine/dates/src/components/MonthsList/MonthsList.tsx +++ b/packages/@mantine/dates/src/components/MonthsList/MonthsList.tsx @@ -1,23 +1,23 @@ +import dayjs from 'dayjs'; import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, - useStyles, + factory, Factory, MantineSize, + StylesApiProps, + useProps, + useStyles, } from '@mantine/core'; -import dayjs from 'dayjs'; import { ControlsGroupSettings } from '../../types'; -import { PickerControl, PickerControlProps } from '../PickerControl'; import { useDatesContext } from '../DatesProvider'; -import classes from './MonthsList.module.css'; -import { getMonthsData } from './get-months-data/get-months-data'; +import { PickerControl, PickerControlProps } from '../PickerControl'; import { getMonthInTabOrder } from './get-month-in-tab-order/get-month-in-tab-order'; +import { getMonthsData } from './get-months-data/get-months-data'; import { isMonthDisabled } from './is-month-disabled/is-month-disabled'; +import classes from './MonthsList.module.css'; export type MonthsListStylesNames = | 'monthsList' diff --git a/packages/@mantine/dates/src/components/PickerControl/PickerControl.test.tsx b/packages/@mantine/dates/src/components/PickerControl/PickerControl.test.tsx index 8e91e33c8a1..62df91ef12c 100644 --- a/packages/@mantine/dates/src/components/PickerControl/PickerControl.test.tsx +++ b/packages/@mantine/dates/src/components/PickerControl/PickerControl.test.tsx @@ -1,6 +1,6 @@ import React from 'react'; import lodash from 'lodash'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { PickerControl, PickerControlProps, PickerControlStylesNames } from './PickerControl'; const defaultProps: PickerControlProps = {}; diff --git a/packages/@mantine/dates/src/components/PickerControl/PickerControl.tsx b/packages/@mantine/dates/src/components/PickerControl/PickerControl.tsx index c390eeefafd..a0c7d7bb496 100644 --- a/packages/@mantine/dates/src/components/PickerControl/PickerControl.tsx +++ b/packages/@mantine/dates/src/components/PickerControl/PickerControl.tsx @@ -1,17 +1,17 @@ import React from 'react'; import { BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, getFontSize, getSize, MantineSize, + StylesApiProps, UnstyledButton, + useProps, + useStyles, } from '@mantine/core'; import classes from './PickerControl.module.css'; diff --git a/packages/@mantine/dates/src/components/PickerInputBase/PickerInputBase.test.tsx b/packages/@mantine/dates/src/components/PickerInputBase/PickerInputBase.test.tsx index 03b7433158b..09ab2e4c2e6 100644 --- a/packages/@mantine/dates/src/components/PickerInputBase/PickerInputBase.test.tsx +++ b/packages/@mantine/dates/src/components/PickerInputBase/PickerInputBase.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { userEvent, render, screen } from '@mantine-tests/core'; +import { render, screen, userEvent } from '@mantine-tests/core'; import { datesTests } from '@mantine-tests/dates'; import { PickerInputBase, PickerInputBaseProps } from './PickerInputBase'; diff --git a/packages/@mantine/dates/src/components/PickerInputBase/PickerInputBase.tsx b/packages/@mantine/dates/src/components/PickerInputBase/PickerInputBase.tsx index b2bdbbe39ba..a85b69429d2 100644 --- a/packages/@mantine/dates/src/components/PickerInputBase/PickerInputBase.tsx +++ b/packages/@mantine/dates/src/components/PickerInputBase/PickerInputBase.tsx @@ -1,26 +1,26 @@ import React from 'react'; import cx from 'clsx'; import { + __BaseInputProps, + __InputStylesNames, BoxProps, - StylesApiProps, - factory, + CloseButton, ElementProps, + factory, Factory, - __BaseInputProps, - PopoverProps, - ModalProps, - useInputProps, - Modal, Input, - Popover, - CloseButton, InputVariant, - __InputStylesNames, MantineSize, + Modal, + ModalProps, + Popover, + PopoverProps, + StylesApiProps, + useInputProps, } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { HiddenDatesInput, HiddenDatesInputValue } from '../HiddenDatesInput'; import { DatePickerType } from '../../types'; +import { HiddenDatesInput, HiddenDatesInputValue } from '../HiddenDatesInput'; import classes from './PickerInputBase.module.css'; export type PickerInputBaseStylesNames = __InputStylesNames; diff --git a/packages/@mantine/dates/src/components/TimeInput/TimeInput.test.tsx b/packages/@mantine/dates/src/components/TimeInput/TimeInput.test.tsx index 407962f668a..55751ddc37e 100644 --- a/packages/@mantine/dates/src/components/TimeInput/TimeInput.test.tsx +++ b/packages/@mantine/dates/src/components/TimeInput/TimeInput.test.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { tests, inputDefaultProps, inputStylesApiSelectors } from '@mantine-tests/core'; import { __InputStylesNames } from '@mantine/core'; +import { inputDefaultProps, inputStylesApiSelectors, tests } from '@mantine-tests/core'; import { TimeInput, TimeInputProps } from './TimeInput'; const defaultProps: TimeInputProps = { diff --git a/packages/@mantine/dates/src/components/TimeInput/TimeInput.tsx b/packages/@mantine/dates/src/components/TimeInput/TimeInput.tsx index c3936f572ae..40a471ae385 100644 --- a/packages/@mantine/dates/src/components/TimeInput/TimeInput.tsx +++ b/packages/@mantine/dates/src/components/TimeInput/TimeInput.tsx @@ -1,16 +1,16 @@ import React from 'react'; import cx from 'clsx'; import { + __BaseInputProps, + __InputStylesNames, + BoxProps, + ElementProps, factory, - useProps, - useResolvedStylesApi, Factory, InputBase, - __BaseInputProps, - BoxProps, StylesApiProps, - __InputStylesNames, - ElementProps, + useProps, + useResolvedStylesApi, } from '@mantine/core'; import classes from './TimeInput.module.css'; diff --git a/packages/@mantine/dates/src/components/WeekdaysRow/WeekdaysRow.story.tsx b/packages/@mantine/dates/src/components/WeekdaysRow/WeekdaysRow.story.tsx index dfada93f4a2..acaa95e9649 100644 --- a/packages/@mantine/dates/src/components/WeekdaysRow/WeekdaysRow.story.tsx +++ b/packages/@mantine/dates/src/components/WeekdaysRow/WeekdaysRow.story.tsx @@ -1,4 +1,5 @@ import 'dayjs/locale/ru'; + import React from 'react'; import { WeekdaysRow, WeekdaysRowProps } from './WeekdaysRow'; diff --git a/packages/@mantine/dates/src/components/WeekdaysRow/WeekdaysRow.test.tsx b/packages/@mantine/dates/src/components/WeekdaysRow/WeekdaysRow.test.tsx index 0d28014b592..58b64a22036 100644 --- a/packages/@mantine/dates/src/components/WeekdaysRow/WeekdaysRow.test.tsx +++ b/packages/@mantine/dates/src/components/WeekdaysRow/WeekdaysRow.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, patchConsoleError, screen } from '@mantine-tests/core'; +import { patchConsoleError, render, screen, tests } from '@mantine-tests/core'; import { datesTests } from '@mantine-tests/dates'; import { WeekdaysRow, WeekdaysRowProps, WeekdaysRowStylesNames } from './WeekdaysRow'; diff --git a/packages/@mantine/dates/src/components/WeekdaysRow/WeekdaysRow.tsx b/packages/@mantine/dates/src/components/WeekdaysRow/WeekdaysRow.tsx index 391421c9d79..b9b1d14f6f0 100644 --- a/packages/@mantine/dates/src/components/WeekdaysRow/WeekdaysRow.tsx +++ b/packages/@mantine/dates/src/components/WeekdaysRow/WeekdaysRow.tsx @@ -2,16 +2,16 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - MantineSize, getFontSize, getSpacing, + MantineSize, + StylesApiProps, + useProps, + useStyles, } from '@mantine/core'; import type { DayOfWeek } from '../../types'; import { useDatesContext } from '../DatesProvider'; diff --git a/packages/@mantine/dates/src/components/WeekdaysRow/get-weekdays-names/get-weekdays-names.test.ts b/packages/@mantine/dates/src/components/WeekdaysRow/get-weekdays-names/get-weekdays-names.test.ts index f32caf1f442..9893ebca2f4 100644 --- a/packages/@mantine/dates/src/components/WeekdaysRow/get-weekdays-names/get-weekdays-names.test.ts +++ b/packages/@mantine/dates/src/components/WeekdaysRow/get-weekdays-names/get-weekdays-names.test.ts @@ -1,5 +1,7 @@ import dayjs from 'dayjs'; + import 'dayjs/locale/ru'; + import { getWeekdayNames } from './get-weekdays-names'; describe('@mantine/dates/get-weekday-names', () => { diff --git a/packages/@mantine/dates/src/components/WeekdaysRow/get-weekdays-names/get-weekdays-names.ts b/packages/@mantine/dates/src/components/WeekdaysRow/get-weekdays-names/get-weekdays-names.ts index d451b80a1fc..11761830d25 100644 --- a/packages/@mantine/dates/src/components/WeekdaysRow/get-weekdays-names/get-weekdays-names.ts +++ b/packages/@mantine/dates/src/components/WeekdaysRow/get-weekdays-names/get-weekdays-names.ts @@ -1,5 +1,5 @@ -import React from 'react'; import dayjs from 'dayjs'; +import React from 'react'; import type { DayOfWeek } from '../../../types'; interface GetWeekdaysNamesInput { diff --git a/packages/@mantine/dates/src/components/YearLevel/YearLevel.test.tsx b/packages/@mantine/dates/src/components/YearLevel/YearLevel.test.tsx index 61b961e3e63..806e7194885 100644 --- a/packages/@mantine/dates/src/components/YearLevel/YearLevel.test.tsx +++ b/packages/@mantine/dates/src/components/YearLevel/YearLevel.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { datesTests } from '@mantine-tests/dates'; import { YearLevel, YearLevelProps, YearLevelStylesNames } from './YearLevel'; diff --git a/packages/@mantine/dates/src/components/YearLevel/YearLevel.tsx b/packages/@mantine/dates/src/components/YearLevel/YearLevel.tsx index 679cc31bf3d..2c60e87c09a 100644 --- a/packages/@mantine/dates/src/components/YearLevel/YearLevel.tsx +++ b/packages/@mantine/dates/src/components/YearLevel/YearLevel.tsx @@ -1,21 +1,21 @@ +import dayjs from 'dayjs'; import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + StylesApiProps, + useProps, } from '@mantine/core'; -import dayjs from 'dayjs'; import { CalendarHeader, - CalendarHeaderStylesNames, CalendarHeaderSettings, + CalendarHeaderStylesNames, } from '../CalendarHeader'; import { useDatesContext } from '../DatesProvider'; -import { MonthsListSettings, MonthsListStylesNames, MonthsList } from '../MonthsList'; +import { MonthsList, MonthsListSettings, MonthsListStylesNames } from '../MonthsList'; export type YearLevelStylesNames = MonthsListStylesNames | CalendarHeaderStylesNames; diff --git a/packages/@mantine/dates/src/components/YearLevelGroup/YearLevelGroup.test.tsx b/packages/@mantine/dates/src/components/YearLevelGroup/YearLevelGroup.test.tsx index 804a1c4d809..275485d870c 100644 --- a/packages/@mantine/dates/src/components/YearLevelGroup/YearLevelGroup.test.tsx +++ b/packages/@mantine/dates/src/components/YearLevelGroup/YearLevelGroup.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { datesTests } from '@mantine-tests/dates'; import { YearLevelGroup, YearLevelGroupProps, YearLevelGroupStylesNames } from './YearLevelGroup'; diff --git a/packages/@mantine/dates/src/components/YearLevelGroup/YearLevelGroup.tsx b/packages/@mantine/dates/src/components/YearLevelGroup/YearLevelGroup.tsx index 493880b7473..ab49f5dd948 100644 --- a/packages/@mantine/dates/src/components/YearLevelGroup/YearLevelGroup.tsx +++ b/packages/@mantine/dates/src/components/YearLevelGroup/YearLevelGroup.tsx @@ -1,9 +1,9 @@ import dayjs from 'dayjs'; import React, { useRef } from 'react'; -import { BoxProps, StylesApiProps, factory, ElementProps, useProps, Factory } from '@mantine/core'; -import { YearLevel, YearLevelSettings, YearLevelStylesNames } from '../YearLevel'; -import { LevelsGroup, LevelsGroupStylesNames } from '../LevelsGroup'; +import { BoxProps, ElementProps, factory, Factory, StylesApiProps, useProps } from '@mantine/core'; import { handleControlKeyDown } from '../../utils'; +import { LevelsGroup, LevelsGroupStylesNames } from '../LevelsGroup'; +import { YearLevel, YearLevelSettings, YearLevelStylesNames } from '../YearLevel'; export type YearLevelGroupStylesNames = YearLevelStylesNames | LevelsGroupStylesNames; diff --git a/packages/@mantine/dates/src/components/YearPicker/YearPicker.test.tsx b/packages/@mantine/dates/src/components/YearPicker/YearPicker.test.tsx index a1985ade1f5..dea680b50b2 100644 --- a/packages/@mantine/dates/src/components/YearPicker/YearPicker.test.tsx +++ b/packages/@mantine/dates/src/components/YearPicker/YearPicker.test.tsx @@ -1,9 +1,9 @@ import dayjs from 'dayjs'; import React from 'react'; -import { render, tests, userEvent, screen } from '@mantine-tests/core'; +import { render, screen, tests, userEvent } from '@mantine-tests/core'; import { datesTests } from '@mantine-tests/dates'; -import { YearPicker, YearPickerProps, YearPickerStylesNames } from './YearPicker'; import { DatesProvider } from '../DatesProvider'; +import { YearPicker, YearPickerProps, YearPickerStylesNames } from './YearPicker'; const defaultProps = {}; diff --git a/packages/@mantine/dates/src/components/YearPicker/YearPicker.tsx b/packages/@mantine/dates/src/components/YearPicker/YearPicker.tsx index f6ea627867e..0c433b5ba2e 100644 --- a/packages/@mantine/dates/src/components/YearPicker/YearPicker.tsx +++ b/packages/@mantine/dates/src/components/YearPicker/YearPicker.tsx @@ -1,21 +1,21 @@ import React from 'react'; import { BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, MantineComponentStaticProperties, + StylesApiProps, + useProps, useResolvedStylesApi, } from '@mantine/core'; import { useDatesState } from '../../hooks'; -import { DecadeLevelBaseSettings } from '../DecadeLevel'; -import { PickerBaseProps, DatePickerType } from '../../types'; -import { Calendar, CalendarBaseProps } from '../Calendar'; -import { DecadeLevelGroupStylesNames } from '../DecadeLevelGroup'; +import { DatePickerType, PickerBaseProps } from '../../types'; import { shiftTimezone } from '../../utils'; +import { Calendar, CalendarBaseProps } from '../Calendar'; import { useDatesContext } from '../DatesProvider'; +import { DecadeLevelBaseSettings } from '../DecadeLevel'; +import { DecadeLevelGroupStylesNames } from '../DecadeLevelGroup'; export type YearPickerStylesNames = DecadeLevelGroupStylesNames; diff --git a/packages/@mantine/dates/src/components/YearPickerInput/YearPickerInput.test.tsx b/packages/@mantine/dates/src/components/YearPickerInput/YearPickerInput.test.tsx index 45d51087ec6..5d24abf3a89 100644 --- a/packages/@mantine/dates/src/components/YearPickerInput/YearPickerInput.test.tsx +++ b/packages/@mantine/dates/src/components/YearPickerInput/YearPickerInput.test.tsx @@ -1,15 +1,15 @@ import React from 'react'; +import { __InputStylesNames } from '@mantine/core'; import { - tests, inputDefaultProps, inputStylesApiSelectors, render, + tests, userEvent, } from '@mantine-tests/core'; -import { __InputStylesNames } from '@mantine/core'; import { clickInput, datesTests, expectValue } from '@mantine-tests/dates'; -import { YearPickerInput, YearPickerInputProps } from './YearPickerInput'; import { DatesProvider } from '../DatesProvider'; +import { YearPickerInput, YearPickerInputProps } from './YearPickerInput'; const defaultProps = { popoverProps: { withinPortal: false, transitionProps: { duration: 0 } }, diff --git a/packages/@mantine/dates/src/components/YearPickerInput/YearPickerInput.tsx b/packages/@mantine/dates/src/components/YearPickerInput/YearPickerInput.tsx index c16bd336048..61d30dff96e 100644 --- a/packages/@mantine/dates/src/components/YearPickerInput/YearPickerInput.tsx +++ b/packages/@mantine/dates/src/components/YearPickerInput/YearPickerInput.tsx @@ -1,22 +1,22 @@ import React from 'react'; import { + __InputStylesNames, BoxProps, - StylesApiProps, factory, - useProps, - useResolvedStylesApi, Factory, InputVariant, - __InputStylesNames, MantineComponentStaticProperties, + StylesApiProps, + useProps, + useResolvedStylesApi, } from '@mantine/core'; -import { pickCalendarProps } from '../Calendar'; import { useDatesInput } from '../../hooks'; -import { YearPicker, YearPickerBaseProps, YearPickerStylesNames } from '../YearPicker'; import { DatePickerType } from '../../types'; import { getDefaultClampedDate, shiftTimezone } from '../../utils'; -import { PickerInputBase, DateInputSharedProps } from '../PickerInputBase'; +import { pickCalendarProps } from '../Calendar'; import { useDatesContext } from '../DatesProvider'; +import { DateInputSharedProps, PickerInputBase } from '../PickerInputBase'; +import { YearPicker, YearPickerBaseProps, YearPickerStylesNames } from '../YearPicker'; export type YearPickerInputStylesNames = __InputStylesNames | YearPickerStylesNames; diff --git a/packages/@mantine/dates/src/components/YearsList/YearsList.story.tsx b/packages/@mantine/dates/src/components/YearsList/YearsList.story.tsx index a7126e05333..bd6b3acd44a 100644 --- a/packages/@mantine/dates/src/components/YearsList/YearsList.story.tsx +++ b/packages/@mantine/dates/src/components/YearsList/YearsList.story.tsx @@ -1,5 +1,5 @@ -import React, { useState } from 'react'; import dayjs from 'dayjs'; +import React, { useState } from 'react'; import { YearsList } from './YearsList'; export default { title: 'YearsList' }; diff --git a/packages/@mantine/dates/src/components/YearsList/YearsList.test.tsx b/packages/@mantine/dates/src/components/YearsList/YearsList.test.tsx index 9050dd2a08a..3301dbea9bb 100644 --- a/packages/@mantine/dates/src/components/YearsList/YearsList.test.tsx +++ b/packages/@mantine/dates/src/components/YearsList/YearsList.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, tests, screen } from '@mantine-tests/core'; +import { render, screen, tests } from '@mantine-tests/core'; import { datesTests } from '@mantine-tests/dates'; import { YearsList, YearsListProps, YearsListStylesNames } from './YearsList'; diff --git a/packages/@mantine/dates/src/components/YearsList/YearsList.tsx b/packages/@mantine/dates/src/components/YearsList/YearsList.tsx index f1d347d3459..69840c98cef 100644 --- a/packages/@mantine/dates/src/components/YearsList/YearsList.tsx +++ b/packages/@mantine/dates/src/components/YearsList/YearsList.tsx @@ -3,19 +3,19 @@ import React from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, - useStyles, + factory, Factory, MantineSize, + StylesApiProps, + useProps, + useStyles, } from '@mantine/core'; import { ControlsGroupSettings } from '../../types'; +import { useDatesContext } from '../DatesProvider'; import { PickerControl, PickerControlProps } from '../PickerControl'; -import { getYearsData } from './get-years-data/get-years-data'; import { getYearInTabOrder } from './get-year-in-tab-order/get-year-in-tab-order'; -import { useDatesContext } from '../DatesProvider'; +import { getYearsData } from './get-years-data/get-years-data'; import { isYearDisabled } from './is-year-disabled/is-year-disabled'; import classes from './YearsList.module.css'; diff --git a/packages/@mantine/dates/src/hooks/use-dates-input/use-dates-input.ts b/packages/@mantine/dates/src/hooks/use-dates-input/use-dates-input.ts index 287d41fd3fb..b8f5d533825 100644 --- a/packages/@mantine/dates/src/hooks/use-dates-input/use-dates-input.ts +++ b/packages/@mantine/dates/src/hooks/use-dates-input/use-dates-input.ts @@ -1,8 +1,8 @@ import { useDisclosure } from '@mantine/hooks'; -import { DatePickerType, DatePickerValue } from '../../types'; import { useDatesContext } from '../../components/DatesProvider'; -import { useUncontrolledDates } from '../use-uncontrolled-dates/use-uncontrolled-dates'; +import { DatePickerType, DatePickerValue } from '../../types'; import { getFormattedDate } from '../../utils'; +import { useUncontrolledDates } from '../use-uncontrolled-dates/use-uncontrolled-dates'; interface UseDatesInput { type: Type; diff --git a/packages/@mantine/dates/src/hooks/use-uncontrolled-dates/use-uncontrolled-dates.ts b/packages/@mantine/dates/src/hooks/use-uncontrolled-dates/use-uncontrolled-dates.ts index e232ad16d27..e5b17f6e5cf 100644 --- a/packages/@mantine/dates/src/hooks/use-uncontrolled-dates/use-uncontrolled-dates.ts +++ b/packages/@mantine/dates/src/hooks/use-uncontrolled-dates/use-uncontrolled-dates.ts @@ -1,8 +1,8 @@ -import { useUncontrolled } from '@mantine/hooks'; import { useRef } from 'react'; +import { useUncontrolled } from '@mantine/hooks'; +import { useDatesContext } from '../../components/DatesProvider'; import { DatePickerType, DatePickerValue } from '../../types'; import { shiftTimezone } from '../../utils'; -import { useDatesContext } from '../../components/DatesProvider'; interface UseUncontrolledDates { type: Type; diff --git a/packages/@mantine/dates/src/utils/get-timezone-offset.ts b/packages/@mantine/dates/src/utils/get-timezone-offset.ts index fcc63d8ad11..50bc20c1138 100644 --- a/packages/@mantine/dates/src/utils/get-timezone-offset.ts +++ b/packages/@mantine/dates/src/utils/get-timezone-offset.ts @@ -1,6 +1,6 @@ import dayjs from 'dayjs'; -import utcPlugin from 'dayjs/plugin/utc.js'; import timezonePlugin from 'dayjs/plugin/timezone.js'; +import utcPlugin from 'dayjs/plugin/utc.js'; dayjs.extend(utcPlugin); dayjs.extend(timezonePlugin); diff --git a/packages/@mantine/dates/src/utils/shift-timezone.ts b/packages/@mantine/dates/src/utils/shift-timezone.ts index 84c16aa26aa..234f4abfa56 100644 --- a/packages/@mantine/dates/src/utils/shift-timezone.ts +++ b/packages/@mantine/dates/src/utils/shift-timezone.ts @@ -1,6 +1,6 @@ import dayjs from 'dayjs'; -import { getTimezoneOffset } from './get-timezone-offset'; import { DatesRangeValue, DateValue } from '../types'; +import { getTimezoneOffset } from './get-timezone-offset'; type TimeShiftDirection = 'add' | 'remove'; diff --git a/packages/@mantine/dropzone/src/Dropzone.test.tsx b/packages/@mantine/dropzone/src/Dropzone.test.tsx index 81a32376182..c59956d73b1 100644 --- a/packages/@mantine/dropzone/src/Dropzone.test.tsx +++ b/packages/@mantine/dropzone/src/Dropzone.test.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { render, tests } from '@mantine-tests/core'; -import { Dropzone, DropzoneProps, DropzoneStylesNames } from './index'; -import { DropzoneAccept, DropzoneReject, DropzoneIdle } from './DropzoneStatus'; import { DropzoneFullScreen } from './DropzoneFullScreen'; +import { DropzoneAccept, DropzoneIdle, DropzoneReject } from './DropzoneStatus'; +import { Dropzone, DropzoneProps, DropzoneStylesNames } from './index'; const defaultProps: DropzoneProps = { onDrop: () => {}, diff --git a/packages/@mantine/dropzone/src/Dropzone.tsx b/packages/@mantine/dropzone/src/Dropzone.tsx index 2130c450b1f..090937e0200 100644 --- a/packages/@mantine/dropzone/src/Dropzone.tsx +++ b/packages/@mantine/dropzone/src/Dropzone.tsx @@ -1,32 +1,32 @@ import React from 'react'; import { - useDropzone, - FileRejection, Accept, - FileWithPath, DropEvent, FileError, + FileRejection, + FileWithPath, + useDropzone, } from 'react-dropzone-esm'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - MantineRadius, - LoadingOverlay, getRadius, - MantineColor, LoaderProps, + LoadingOverlay, + MantineColor, + MantineRadius, + StylesApiProps, + useProps, + useStyles, } from '@mantine/core'; import { assignRef } from '@mantine/hooks'; import { DropzoneProvider } from './Dropzone.context'; -import { DropzoneAccept, DropzoneIdle, DropzoneReject } from './DropzoneStatus'; import type { DropzoneFullScreenType } from './DropzoneFullScreen'; +import { DropzoneAccept, DropzoneIdle, DropzoneReject } from './DropzoneStatus'; import classes from './Dropzone.module.css'; export type DropzoneStylesNames = 'root' | 'inner'; diff --git a/packages/@mantine/dropzone/src/DropzoneFullScreen.tsx b/packages/@mantine/dropzone/src/DropzoneFullScreen.tsx index 273fad068f5..0c2173a4d56 100644 --- a/packages/@mantine/dropzone/src/DropzoneFullScreen.tsx +++ b/packages/@mantine/dropzone/src/DropzoneFullScreen.tsx @@ -2,19 +2,19 @@ import React, { useEffect, useState } from 'react'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, - useProps, - useStyles, + factory, Factory, - PortalProps, + getDefaultZIndex, OptionalPortal, + PortalProps, + StylesApiProps, + useProps, useResolvedStylesApi, - getDefaultZIndex, + useStyles, } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { Dropzone, DropzoneProps, DropzoneVariant, DropzoneStylesNames } from './Dropzone'; +import { Dropzone, DropzoneProps, DropzoneStylesNames, DropzoneVariant } from './Dropzone'; import classes from './Dropzone.module.css'; export type DropzoneFullScreenStylesNames = DropzoneStylesNames | 'fullScreen'; diff --git a/packages/@mantine/dropzone/src/DropzoneStatus.tsx b/packages/@mantine/dropzone/src/DropzoneStatus.tsx index 3cba3c17034..c8731cd10ca 100644 --- a/packages/@mantine/dropzone/src/DropzoneStatus.tsx +++ b/packages/@mantine/dropzone/src/DropzoneStatus.tsx @@ -1,6 +1,6 @@ import React, { cloneElement } from 'react'; -import { upperFirst } from '@mantine/hooks'; import { isElement, useProps } from '@mantine/core'; +import { upperFirst } from '@mantine/hooks'; import { DropzoneContextValue, useDropzoneContext } from './Dropzone.context'; export interface DropzoneStatusProps { diff --git a/packages/@mantine/dropzone/src/index.ts b/packages/@mantine/dropzone/src/index.ts index 64c9f15873e..d1264680125 100644 --- a/packages/@mantine/dropzone/src/index.ts +++ b/packages/@mantine/dropzone/src/index.ts @@ -1,5 +1,5 @@ -import { DropzoneFullScreen } from './DropzoneFullScreen'; import { Dropzone as _Dropzone } from './Dropzone'; +import { DropzoneFullScreen } from './DropzoneFullScreen'; _Dropzone.FullScreen = DropzoneFullScreen; export const Dropzone = _Dropzone; diff --git a/packages/@mantine/form/src/Form/Form.tsx b/packages/@mantine/form/src/Form/Form.tsx index 00a9be15c33..8cce3e1af7e 100644 --- a/packages/@mantine/form/src/Form/Form.tsx +++ b/packages/@mantine/form/src/Form/Form.tsx @@ -1,5 +1,5 @@ import React, { forwardRef } from 'react'; -import { UseFormReturnType, TransformedValues } from '../types'; +import { TransformedValues, UseFormReturnType } from '../types'; export interface FormProps
> extends React.ComponentPropsWithRef<'form'> { diff --git a/packages/@mantine/form/src/FormProvider/FormProvider.tsx b/packages/@mantine/form/src/FormProvider/FormProvider.tsx index 32ce16d9524..23b31880e86 100644 --- a/packages/@mantine/form/src/FormProvider/FormProvider.tsx +++ b/packages/@mantine/form/src/FormProvider/FormProvider.tsx @@ -1,6 +1,6 @@ import React, { createContext, useContext } from 'react'; +import { _TransformValues, UseForm, UseFormReturnType } from '../types'; import { useForm } from '../use-form'; -import { UseFormReturnType, UseForm, _TransformValues } from '../types'; export interface FormProviderProps { form: Form; diff --git a/packages/@mantine/form/src/actions/actions.ts b/packages/@mantine/form/src/actions/actions.ts index 3c7950ac39a..65b6c468882 100644 --- a/packages/@mantine/form/src/actions/actions.ts +++ b/packages/@mantine/form/src/actions/actions.ts @@ -1,22 +1,22 @@ import { useEffect, useLayoutEffect } from 'react'; import type { - SetFieldValue, - SetValues, - SetInitialValues, - SetErrors, - SetFieldError, - ClearFieldError, + _TransformValues, ClearErrors, - Reset, - ValidateField, + ClearFieldError, + InsertListItem, RemoveListItem, ReorderListItem, - InsertListItem, - SetFormStatus, + Reset, ResetDirty, ResetStatus, + SetErrors, + SetFieldError, + SetFieldValue, + SetFormStatus, + SetInitialValues, + SetValues, UseFormReturnType, - _TransformValues, + ValidateField, } from '../types'; function dispatchEvent(type: string, detail?: any): any { diff --git a/packages/@mantine/form/src/paths/reorder-path.ts b/packages/@mantine/form/src/paths/reorder-path.ts index 7f963a79510..d7a511adc44 100644 --- a/packages/@mantine/form/src/paths/reorder-path.ts +++ b/packages/@mantine/form/src/paths/reorder-path.ts @@ -1,6 +1,6 @@ +import { ReorderPayload } from '../types'; import { getPath } from './get-path'; import { setPath } from './set-path'; -import { ReorderPayload } from '../types'; export function reorderPath(path: unknown, { from, to }: ReorderPayload, values: T) { const currentValue = getPath(path, values); diff --git a/packages/@mantine/form/src/stories/Form.actions.story.tsx b/packages/@mantine/form/src/stories/Form.actions.story.tsx index bb0e7b62750..addd15984d7 100644 --- a/packages/@mantine/form/src/stories/Form.actions.story.tsx +++ b/packages/@mantine/form/src/stories/Form.actions.story.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import { TextInput, Textarea, Checkbox, NativeSelect, Button } from '@mantine/core'; -import { FormBase } from './_base'; -import { useForm } from '../use-form'; +import { Button, Checkbox, NativeSelect, Textarea, TextInput } from '@mantine/core'; import { createFormActions } from '../actions'; +import { useForm } from '../use-form'; +import { FormBase } from './_base'; export default { title: 'Form' }; diff --git a/packages/@mantine/form/src/stories/Form.context.story.tsx b/packages/@mantine/form/src/stories/Form.context.story.tsx index d5c2c1ed015..48a1a44878e 100644 --- a/packages/@mantine/form/src/stories/Form.context.story.tsx +++ b/packages/@mantine/form/src/stories/Form.context.story.tsx @@ -1,5 +1,5 @@ -import { TextInput } from '@mantine/core'; import React from 'react'; +import { TextInput } from '@mantine/core'; import { createFormContext } from '../index'; export default { title: 'Form' }; diff --git a/packages/@mantine/form/src/stories/Form.dirty.story.tsx b/packages/@mantine/form/src/stories/Form.dirty.story.tsx index b4b618d00af..bfadc7a8d04 100644 --- a/packages/@mantine/form/src/stories/Form.dirty.story.tsx +++ b/packages/@mantine/form/src/stories/Form.dirty.story.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { ActionIcon, Code, Group, TextInput, Text, Button } from '@mantine/core'; import { IconTrash } from '@tabler/icons-react'; +import { ActionIcon, Button, Code, Group, Text, TextInput } from '@mantine/core'; import { useForm } from '../use-form'; export default { title: 'Form' }; diff --git a/packages/@mantine/form/src/stories/Form.lists.story.tsx b/packages/@mantine/form/src/stories/Form.lists.story.tsx index 246e9f3bf56..c7c255febf9 100644 --- a/packages/@mantine/form/src/stories/Form.lists.story.tsx +++ b/packages/@mantine/form/src/stories/Form.lists.story.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import { TextInput, Switch, ActionIcon, Group, Text, Button } from '@mantine/core'; +import { ActionIcon, Button, Group, Switch, Text, TextInput } from '@mantine/core'; import { randomId } from '@mantine/hooks'; -import { FormBase } from './_base'; import { useForm } from '../use-form'; +import { FormBase } from './_base'; export default { title: 'Form' }; diff --git a/packages/@mantine/form/src/stories/Form.nestedObject.story.tsx b/packages/@mantine/form/src/stories/Form.nestedObject.story.tsx index fc4da553011..8694a9dc13b 100644 --- a/packages/@mantine/form/src/stories/Form.nestedObject.story.tsx +++ b/packages/@mantine/form/src/stories/Form.nestedObject.story.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { TextInput, Checkbox } from '@mantine/core'; -import { FormBase } from './_base'; +import { Checkbox, TextInput } from '@mantine/core'; import { useForm } from '../use-form'; +import { FormBase } from './_base'; export default { title: 'Form' }; diff --git a/packages/@mantine/form/src/stories/Form.rendering.story.tsx b/packages/@mantine/form/src/stories/Form.rendering.story.tsx index 13f13714bb3..5cfc3ecb4ee 100644 --- a/packages/@mantine/form/src/stories/Form.rendering.story.tsx +++ b/packages/@mantine/form/src/stories/Form.rendering.story.tsx @@ -1,7 +1,7 @@ /* eslint-disable no-console */ import React from 'react'; -import { FormBase } from './_base'; import { useForm } from '../use-form'; +import { FormBase } from './_base'; export default { title: 'Form' }; diff --git a/packages/@mantine/form/src/stories/Form.usage.story.tsx b/packages/@mantine/form/src/stories/Form.usage.story.tsx index b97fd91a0bb..cd158fed10b 100644 --- a/packages/@mantine/form/src/stories/Form.usage.story.tsx +++ b/packages/@mantine/form/src/stories/Form.usage.story.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { TextInput, Textarea, Checkbox, NativeSelect } from '@mantine/core'; -import { FormBase } from './_base'; +import { Checkbox, NativeSelect, Textarea, TextInput } from '@mantine/core'; import { useForm } from '../use-form'; +import { FormBase } from './_base'; export default { title: 'Form' }; diff --git a/packages/@mantine/form/src/stories/Form.validateOnChange.story.tsx b/packages/@mantine/form/src/stories/Form.validateOnChange.story.tsx index c59caf8b972..09b26a8c30f 100644 --- a/packages/@mantine/form/src/stories/Form.validateOnChange.story.tsx +++ b/packages/@mantine/form/src/stories/Form.validateOnChange.story.tsx @@ -1,8 +1,8 @@ import React from 'react'; -import { TextInput, Checkbox } from '@mantine/core'; -import { FormBase } from './_base'; -import { useForm } from '../use-form'; +import { Checkbox, TextInput } from '@mantine/core'; import { FORM_INDEX } from '../form-index'; +import { useForm } from '../use-form'; +import { FormBase } from './_base'; export default { title: 'Form' }; diff --git a/packages/@mantine/form/src/stories/_base.tsx b/packages/@mantine/form/src/stories/_base.tsx index e1535121a03..b430fb4a05b 100644 --- a/packages/@mantine/form/src/stories/_base.tsx +++ b/packages/@mantine/form/src/stories/_base.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Button, Group, Code, rem } from '@mantine/core'; +import { Button, Code, Group, rem } from '@mantine/core'; export function FormBase({ children, form }: any) { const [values, setValues] = useState({}); diff --git a/packages/@mantine/form/src/tests/reorderListItem.test.ts b/packages/@mantine/form/src/tests/reorderListItem.test.ts index 4f339d4f346..c45d2d7f9fe 100644 --- a/packages/@mantine/form/src/tests/reorderListItem.test.ts +++ b/packages/@mantine/form/src/tests/reorderListItem.test.ts @@ -1,4 +1,4 @@ -import { renderHook, act } from '@testing-library/react'; +import { act, renderHook } from '@testing-library/react'; import { useForm } from '../use-form'; describe('@mantine/form/reorderListItem', () => { diff --git a/packages/@mantine/form/src/tests/transformValues.test.ts b/packages/@mantine/form/src/tests/transformValues.test.ts index 30b02bce94e..222e2d75daa 100644 --- a/packages/@mantine/form/src/tests/transformValues.test.ts +++ b/packages/@mantine/form/src/tests/transformValues.test.ts @@ -1,4 +1,4 @@ -import { renderHook, act } from '@testing-library/react'; +import { act, renderHook } from '@testing-library/react'; import { useForm } from '../use-form'; const getFormEvent = () => ({ preventDefault: jest.fn() }) as any; diff --git a/packages/@mantine/form/src/tests/validate-function.test.ts b/packages/@mantine/form/src/tests/validate-function.test.ts index b534adcae48..28c6f10d04d 100644 --- a/packages/@mantine/form/src/tests/validate-function.test.ts +++ b/packages/@mantine/form/src/tests/validate-function.test.ts @@ -1,4 +1,4 @@ -import { renderHook, act } from '@testing-library/react'; +import { act, renderHook } from '@testing-library/react'; import { useForm } from '../use-form'; describe('@mantine/form/validate with function rules', () => { diff --git a/packages/@mantine/form/src/tests/validate-object.test.ts b/packages/@mantine/form/src/tests/validate-object.test.ts index ae0a647e397..506a1fae925 100644 --- a/packages/@mantine/form/src/tests/validate-object.test.ts +++ b/packages/@mantine/form/src/tests/validate-object.test.ts @@ -1,4 +1,4 @@ -import { renderHook, act } from '@testing-library/react'; +import { act, renderHook } from '@testing-library/react'; import { useForm } from '../use-form'; describe('@mantine/form/validate with record rules', () => { diff --git a/packages/@mantine/form/src/tests/values.test.ts b/packages/@mantine/form/src/tests/values.test.ts index 58125eee99a..d65797e51ca 100644 --- a/packages/@mantine/form/src/tests/values.test.ts +++ b/packages/@mantine/form/src/tests/values.test.ts @@ -1,4 +1,4 @@ -import { renderHook, act } from '@testing-library/react'; +import { act, renderHook } from '@testing-library/react'; import { useForm } from '../use-form'; describe('@mantine/form/values', () => { diff --git a/packages/@mantine/form/src/use-form.ts b/packages/@mantine/form/src/use-form.ts index d33dc778a1d..1d9371d3745 100644 --- a/packages/@mantine/form/src/use-form.ts +++ b/packages/@mantine/form/src/use-form.ts @@ -1,12 +1,11 @@ import { useCallback, useRef, useState } from 'react'; import isEqual from 'fast-deep-equal'; -import { getInputOnChange } from './get-input-on-change'; -import { getPath, insertPath, removePath, reorderPath, setPath } from './paths'; +import { useFormActions } from './actions'; import { filterErrors } from './filter-errors'; -import { shouldValidateOnChange, validateFieldValue, validateValues } from './validate'; +import { getInputOnChange } from './get-input-on-change'; import { getStatus } from './get-status'; import { changeErrorIndices, clearListState, reorderErrors } from './lists'; -import { useFormActions } from './actions'; +import { getPath, insertPath, removePath, reorderPath, setPath } from './paths'; import { _TransformValues, ClearErrors, @@ -32,6 +31,7 @@ import { Validate, ValidateField, } from './types'; +import { shouldValidateOnChange, validateFieldValue, validateValues } from './validate'; export function useForm< Values = Record, diff --git a/packages/@mantine/form/src/validate/validate-field-value.ts b/packages/@mantine/form/src/validate/validate-field-value.ts index da4e73a6064..75ee2b49a99 100644 --- a/packages/@mantine/form/src/validate/validate-field-value.ts +++ b/packages/@mantine/form/src/validate/validate-field-value.ts @@ -1,4 +1,4 @@ -import { FormValidateInput, FormFieldValidationResult } from '../types'; +import { FormFieldValidationResult, FormValidateInput } from '../types'; import { validateValues } from './validate-values'; export function validateFieldValue( diff --git a/packages/@mantine/form/src/validate/validate-values.ts b/packages/@mantine/form/src/validate/validate-values.ts index d4a301e8a68..1fc2a92e80a 100644 --- a/packages/@mantine/form/src/validate/validate-values.ts +++ b/packages/@mantine/form/src/validate/validate-values.ts @@ -1,6 +1,6 @@ import { filterErrors } from '../filter-errors'; import { getPath } from '../paths'; -import { FormValidateInput, FormErrors, FormRulesRecord, FormRule } from '../types'; +import { FormErrors, FormRule, FormRulesRecord, FormValidateInput } from '../types'; function getValidationResults(errors: FormErrors) { const filteredErrors = filterErrors(errors); diff --git a/packages/@mantine/hooks/src/use-callback-ref/use-callback-ref.ts b/packages/@mantine/hooks/src/use-callback-ref/use-callback-ref.ts index 6247d3b8b52..70615c159af 100644 --- a/packages/@mantine/hooks/src/use-callback-ref/use-callback-ref.ts +++ b/packages/@mantine/hooks/src/use-callback-ref/use-callback-ref.ts @@ -1,4 +1,4 @@ -import { useRef, useEffect, useMemo } from 'react'; +import { useEffect, useMemo, useRef } from 'react'; export function useCallbackRef any>(callback: T | undefined): T { const callbackRef = useRef(callback); diff --git a/packages/@mantine/hooks/src/use-counter/use-counter.test.ts b/packages/@mantine/hooks/src/use-counter/use-counter.test.ts index 86c2afc22fe..5af672d1102 100644 --- a/packages/@mantine/hooks/src/use-counter/use-counter.test.ts +++ b/packages/@mantine/hooks/src/use-counter/use-counter.test.ts @@ -1,4 +1,4 @@ -import { renderHook, act } from '@testing-library/react'; +import { act, renderHook } from '@testing-library/react'; import { useCounter } from './use-counter'; describe('@mantine/hooks/use-counter', () => { diff --git a/packages/@mantine/hooks/src/use-debounced-callback/use-debounced-callback.ts b/packages/@mantine/hooks/src/use-debounced-callback/use-debounced-callback.ts index 7954f48d88a..9ad1a9053a8 100644 --- a/packages/@mantine/hooks/src/use-debounced-callback/use-debounced-callback.ts +++ b/packages/@mantine/hooks/src/use-debounced-callback/use-debounced-callback.ts @@ -1,4 +1,4 @@ -import { useRef, useEffect, useCallback } from 'react'; +import { useCallback, useEffect, useRef } from 'react'; import { useCallbackRef } from '../use-callback-ref/use-callback-ref'; export function useDebounceCallback(callback: () => void, delay: number) { diff --git a/packages/@mantine/hooks/src/use-debounced-state/use-debounced-state.ts b/packages/@mantine/hooks/src/use-debounced-state/use-debounced-state.ts index df9456d0efc..ceb8b85957e 100644 --- a/packages/@mantine/hooks/src/use-debounced-state/use-debounced-state.ts +++ b/packages/@mantine/hooks/src/use-debounced-state/use-debounced-state.ts @@ -1,4 +1,4 @@ -import { useEffect, useRef, useState, useCallback } from 'react'; +import { useCallback, useEffect, useRef, useState } from 'react'; export function useDebouncedState( defaultValue: T, diff --git a/packages/@mantine/hooks/src/use-debounced-value/use-debounced-value.ts b/packages/@mantine/hooks/src/use-debounced-value/use-debounced-value.ts index 4fa605e35df..698d89b761a 100644 --- a/packages/@mantine/hooks/src/use-debounced-value/use-debounced-value.ts +++ b/packages/@mantine/hooks/src/use-debounced-value/use-debounced-value.ts @@ -1,4 +1,4 @@ -import { useEffect, useState, useRef } from 'react'; +import { useEffect, useRef, useState } from 'react'; export function useDebouncedValue(value: T, wait: number, options = { leading: false }) { const [_value, setValue] = useState(value); diff --git a/packages/@mantine/hooks/src/use-did-update/use-did-update.ts b/packages/@mantine/hooks/src/use-did-update/use-did-update.ts index 6bb6e00b0ce..68ffcde7706 100644 --- a/packages/@mantine/hooks/src/use-did-update/use-did-update.ts +++ b/packages/@mantine/hooks/src/use-did-update/use-did-update.ts @@ -1,4 +1,4 @@ -import { useEffect, useRef, EffectCallback, DependencyList } from 'react'; +import { DependencyList, EffectCallback, useEffect, useRef } from 'react'; export function useDidUpdate(fn: EffectCallback, dependencies?: DependencyList) { const mounted = useRef(false); diff --git a/packages/@mantine/hooks/src/use-disclosure/use-disclosure.ts b/packages/@mantine/hooks/src/use-disclosure/use-disclosure.ts index afc5944420d..1ef158cb6f1 100644 --- a/packages/@mantine/hooks/src/use-disclosure/use-disclosure.ts +++ b/packages/@mantine/hooks/src/use-disclosure/use-disclosure.ts @@ -1,4 +1,4 @@ -import { useState, useCallback } from 'react'; +import { useCallback, useState } from 'react'; export function useDisclosure( initialState = false, diff --git a/packages/@mantine/hooks/src/use-event-listener/use-event-listener.ts b/packages/@mantine/hooks/src/use-event-listener/use-event-listener.ts index 9ee92155c11..d12aed5d3ca 100644 --- a/packages/@mantine/hooks/src/use-event-listener/use-event-listener.ts +++ b/packages/@mantine/hooks/src/use-event-listener/use-event-listener.ts @@ -1,4 +1,4 @@ -import { useRef, useEffect } from 'react'; +import { useEffect, useRef } from 'react'; export function useEventListener( type: K, diff --git a/packages/@mantine/hooks/src/use-focus-trap/use-focus-trap.test.tsx b/packages/@mantine/hooks/src/use-focus-trap/use-focus-trap.test.tsx index 33887d2c690..ef133afbd2e 100644 --- a/packages/@mantine/hooks/src/use-focus-trap/use-focus-trap.test.tsx +++ b/packages/@mantine/hooks/src/use-focus-trap/use-focus-trap.test.tsx @@ -1,6 +1,6 @@ /* eslint-disable no-console */ -import { fireEvent, render, RenderOptions, RenderResult, screen } from '@testing-library/react'; import React, { ReactElement, useState } from 'react'; +import { fireEvent, render, RenderOptions, RenderResult, screen } from '@testing-library/react'; import { useFocusTrap } from './use-focus-trap'; function InnerComponent({ testId }: { testId: string }) { diff --git a/packages/@mantine/hooks/src/use-focus-trap/use-focus-trap.ts b/packages/@mantine/hooks/src/use-focus-trap/use-focus-trap.ts index 61be9ff5ace..73f31287ccb 100644 --- a/packages/@mantine/hooks/src/use-focus-trap/use-focus-trap.ts +++ b/packages/@mantine/hooks/src/use-focus-trap/use-focus-trap.ts @@ -1,7 +1,7 @@ import { useCallback, useEffect, useRef } from 'react'; -import { FOCUS_SELECTOR, focusable, tabbable } from './tabbable'; -import { scopeTab } from './scope-tab'; import { createAriaHider } from './create-aria-hider'; +import { scopeTab } from './scope-tab'; +import { FOCUS_SELECTOR, focusable, tabbable } from './tabbable'; export function useFocusTrap(active = true): (instance: HTMLElement | null) => void { const ref = useRef(); diff --git a/packages/@mantine/hooks/src/use-focus-within/use-focus-within.ts b/packages/@mantine/hooks/src/use-focus-within/use-focus-within.ts index 7f98b53d273..89f2bec5c72 100644 --- a/packages/@mantine/hooks/src/use-focus-within/use-focus-within.ts +++ b/packages/@mantine/hooks/src/use-focus-within/use-focus-within.ts @@ -1,4 +1,4 @@ -import { useRef, useState, useEffect } from 'react'; +import { useEffect, useRef, useState } from 'react'; export interface UseFocusWithinOptions { onFocus?: (event: FocusEvent) => void; diff --git a/packages/@mantine/hooks/src/use-fullscreen/use-fullscreen.ts b/packages/@mantine/hooks/src/use-fullscreen/use-fullscreen.ts index e7703c1e7fc..acd208b3a7a 100644 --- a/packages/@mantine/hooks/src/use-fullscreen/use-fullscreen.ts +++ b/packages/@mantine/hooks/src/use-fullscreen/use-fullscreen.ts @@ -1,4 +1,4 @@ -import { useCallback, useRef, useState, useEffect } from 'react'; +import { useCallback, useEffect, useRef, useState } from 'react'; function getFullscreenElement(): HTMLElement | null { const _document = window.document as any; diff --git a/packages/@mantine/hooks/src/use-hash/use-hash.ts b/packages/@mantine/hooks/src/use-hash/use-hash.ts index 1308e42963d..5f01d83c048 100644 --- a/packages/@mantine/hooks/src/use-hash/use-hash.ts +++ b/packages/@mantine/hooks/src/use-hash/use-hash.ts @@ -1,4 +1,4 @@ -import { useState, useEffect } from 'react'; +import { useEffect, useState } from 'react'; import { useWindowEvent } from '../use-window-event/use-window-event'; interface UseHashOptions { diff --git a/packages/@mantine/hooks/src/use-headroom/use-headroom.ts b/packages/@mantine/hooks/src/use-headroom/use-headroom.ts index e20fb64e246..1846a33958a 100644 --- a/packages/@mantine/hooks/src/use-headroom/use-headroom.ts +++ b/packages/@mantine/hooks/src/use-headroom/use-headroom.ts @@ -1,6 +1,6 @@ import { useRef } from 'react'; -import { useWindowScroll } from '../use-window-scroll/use-window-scroll'; import { useIsomorphicEffect } from '../use-isomorphic-effect/use-isomorphic-effect'; +import { useWindowScroll } from '../use-window-scroll/use-window-scroll'; export const isFixed = (current: number, fixedAt: number) => current <= fixedAt; export const isPinned = (current: number, previous: number) => current <= previous; diff --git a/packages/@mantine/hooks/src/use-hover/use-hover.ts b/packages/@mantine/hooks/src/use-hover/use-hover.ts index 55a26e570c6..dbf5d7ce7d6 100644 --- a/packages/@mantine/hooks/src/use-hover/use-hover.ts +++ b/packages/@mantine/hooks/src/use-hover/use-hover.ts @@ -1,4 +1,4 @@ -import { useState, useEffect, useRef, useCallback } from 'react'; +import { useCallback, useEffect, useRef, useState } from 'react'; export function useHover() { const [hovered, setHovered] = useState(false); diff --git a/packages/@mantine/hooks/src/use-idle/use-idle.test.tsx b/packages/@mantine/hooks/src/use-idle/use-idle.test.tsx index 711f907b08b..d4e7f693132 100644 --- a/packages/@mantine/hooks/src/use-idle/use-idle.test.tsx +++ b/packages/@mantine/hooks/src/use-idle/use-idle.test.tsx @@ -1,4 +1,4 @@ -import { renderHook, act } from '@testing-library/react'; +import { act, renderHook } from '@testing-library/react'; import { useIdle } from './use-idle'; describe('@mantine/hooks/use-idle', () => { diff --git a/packages/@mantine/hooks/src/use-idle/use-idle.ts b/packages/@mantine/hooks/src/use-idle/use-idle.ts index 9f902cd2062..473f2c0ab6c 100644 --- a/packages/@mantine/hooks/src/use-idle/use-idle.ts +++ b/packages/@mantine/hooks/src/use-idle/use-idle.ts @@ -1,4 +1,4 @@ -import { useState, useEffect, useRef } from 'react'; +import { useEffect, useRef, useState } from 'react'; const DEFAULT_EVENTS: (keyof DocumentEventMap)[] = [ 'keypress', diff --git a/packages/@mantine/hooks/src/use-interval/use-interval.test.ts b/packages/@mantine/hooks/src/use-interval/use-interval.test.ts index df8341b620c..a4e36bc5dfa 100644 --- a/packages/@mantine/hooks/src/use-interval/use-interval.test.ts +++ b/packages/@mantine/hooks/src/use-interval/use-interval.test.ts @@ -1,4 +1,4 @@ -import { renderHook, act } from '@testing-library/react'; +import { act, renderHook } from '@testing-library/react'; import { useInterval } from './use-interval'; const defaultTimeout = 2000; diff --git a/packages/@mantine/hooks/src/use-list-state/use-list-state.test.ts b/packages/@mantine/hooks/src/use-list-state/use-list-state.test.ts index 5a004e4eac3..b2035bc19ef 100644 --- a/packages/@mantine/hooks/src/use-list-state/use-list-state.test.ts +++ b/packages/@mantine/hooks/src/use-list-state/use-list-state.test.ts @@ -1,4 +1,4 @@ -import { renderHook, act } from '@testing-library/react'; +import { act, renderHook } from '@testing-library/react'; import { useListState } from './use-list-state'; const TEST_STATE = [ diff --git a/packages/@mantine/hooks/src/use-local-storage/create-storage.ts b/packages/@mantine/hooks/src/use-local-storage/create-storage.ts index 1dd8524fff9..74553fdcc5d 100644 --- a/packages/@mantine/hooks/src/use-local-storage/create-storage.ts +++ b/packages/@mantine/hooks/src/use-local-storage/create-storage.ts @@ -1,5 +1,5 @@ /* eslint-disable no-console */ -import { useState, useCallback, useEffect } from 'react'; +import { useCallback, useEffect, useState } from 'react'; import { useWindowEvent } from '../use-window-event/use-window-event'; export type StorageType = 'localStorage' | 'sessionStorage'; diff --git a/packages/@mantine/hooks/src/use-media-query/use-media-query.ts b/packages/@mantine/hooks/src/use-media-query/use-media-query.ts index 88f04b4abc4..c3e9a41595d 100644 --- a/packages/@mantine/hooks/src/use-media-query/use-media-query.ts +++ b/packages/@mantine/hooks/src/use-media-query/use-media-query.ts @@ -1,4 +1,4 @@ -import { useState, useEffect, useRef } from 'react'; +import { useEffect, useRef, useState } from 'react'; export interface UseMediaQueryOptions { getInitialValueInEffect: boolean; diff --git a/packages/@mantine/hooks/src/use-merged-ref/use-merged-ref.test.tsx b/packages/@mantine/hooks/src/use-merged-ref/use-merged-ref.test.tsx index e70e3457264..d9a0f947ab9 100644 --- a/packages/@mantine/hooks/src/use-merged-ref/use-merged-ref.test.tsx +++ b/packages/@mantine/hooks/src/use-merged-ref/use-merged-ref.test.tsx @@ -1,4 +1,4 @@ -import React, { useRef, createRef } from 'react'; +import React, { createRef, useRef } from 'react'; import { render } from '@testing-library/react'; import { useMergedRef } from './use-merged-ref'; diff --git a/packages/@mantine/hooks/src/use-merged-ref/use-merged-ref.ts b/packages/@mantine/hooks/src/use-merged-ref/use-merged-ref.ts index 9737a9428c1..277c8407196 100644 --- a/packages/@mantine/hooks/src/use-merged-ref/use-merged-ref.ts +++ b/packages/@mantine/hooks/src/use-merged-ref/use-merged-ref.ts @@ -1,4 +1,4 @@ -import { useCallback, Ref } from 'react'; +import { Ref, useCallback } from 'react'; type PossibleRef = Ref | undefined; diff --git a/packages/@mantine/hooks/src/use-mouse/use-mouse.test.tsx b/packages/@mantine/hooks/src/use-mouse/use-mouse.test.tsx index 1ada2610aca..d960f662400 100644 --- a/packages/@mantine/hooks/src/use-mouse/use-mouse.test.tsx +++ b/packages/@mantine/hooks/src/use-mouse/use-mouse.test.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { renderHook, fireEvent, render, screen } from '@testing-library/react'; +import { fireEvent, render, renderHook, screen } from '@testing-library/react'; import { useMouse } from './use-mouse'; const Target: React.FunctionComponent = () => { diff --git a/packages/@mantine/hooks/src/use-move/use-move.ts b/packages/@mantine/hooks/src/use-move/use-move.ts index a6ca4bc5d6d..1f6383cbdff 100644 --- a/packages/@mantine/hooks/src/use-move/use-move.ts +++ b/packages/@mantine/hooks/src/use-move/use-move.ts @@ -1,4 +1,4 @@ -import { useEffect, useState, useRef } from 'react'; +import { useEffect, useRef, useState } from 'react'; import { clamp } from '../utils'; export interface UseMovePosition { diff --git a/packages/@mantine/hooks/src/use-network/use-network.ts b/packages/@mantine/hooks/src/use-network/use-network.ts index fdd1d604c95..9c443da7d51 100644 --- a/packages/@mantine/hooks/src/use-network/use-network.ts +++ b/packages/@mantine/hooks/src/use-network/use-network.ts @@ -1,4 +1,4 @@ -import { useState, useEffect, useCallback } from 'react'; +import { useCallback, useEffect, useState } from 'react'; import { useWindowEvent } from '../use-window-event/use-window-event'; interface NetworkStatus { diff --git a/packages/@mantine/hooks/src/use-pagination/use-pagination.test.ts b/packages/@mantine/hooks/src/use-pagination/use-pagination.test.ts index 3ae0638b443..be82c6666e2 100644 --- a/packages/@mantine/hooks/src/use-pagination/use-pagination.test.ts +++ b/packages/@mantine/hooks/src/use-pagination/use-pagination.test.ts @@ -1,4 +1,4 @@ -import { renderHook, act } from '@testing-library/react'; +import { act, renderHook } from '@testing-library/react'; import { usePagination } from './use-pagination'; describe('@mantine/hooks/use-pagination', () => { diff --git a/packages/@mantine/hooks/src/use-queue/use-queue.test.ts b/packages/@mantine/hooks/src/use-queue/use-queue.test.ts index 7a49f69ed4c..da877a9c43f 100644 --- a/packages/@mantine/hooks/src/use-queue/use-queue.test.ts +++ b/packages/@mantine/hooks/src/use-queue/use-queue.test.ts @@ -1,4 +1,4 @@ -import { renderHook, act } from '@testing-library/react'; +import { act, renderHook } from '@testing-library/react'; import { useQueue } from './use-queue'; describe('@mantine/hooks/use-queue', () => { diff --git a/packages/@mantine/hooks/src/use-scroll-into-view/use-scroll-into-view.ts b/packages/@mantine/hooks/src/use-scroll-into-view/use-scroll-into-view.ts index 202a5c6d358..ee324a14486 100644 --- a/packages/@mantine/hooks/src/use-scroll-into-view/use-scroll-into-view.ts +++ b/packages/@mantine/hooks/src/use-scroll-into-view/use-scroll-into-view.ts @@ -1,4 +1,4 @@ -import { useCallback, useRef, useEffect } from 'react'; +import { useCallback, useEffect, useRef } from 'react'; import { useReducedMotion } from '../use-reduced-motion/use-reduced-motion'; import { useWindowEvent } from '../use-window-event/use-window-event'; import { easeInOutQuad } from './utils/ease-in-out-quad'; diff --git a/packages/@mantine/hooks/src/use-set-state/use-set-state.test.ts b/packages/@mantine/hooks/src/use-set-state/use-set-state.test.ts index 63d020faeb5..e9ca3860aeb 100644 --- a/packages/@mantine/hooks/src/use-set-state/use-set-state.test.ts +++ b/packages/@mantine/hooks/src/use-set-state/use-set-state.test.ts @@ -1,4 +1,4 @@ -import { renderHook, act } from '@testing-library/react'; +import { act, renderHook } from '@testing-library/react'; import { useSetState } from './use-set-state'; const data = { diff --git a/packages/@mantine/hooks/src/use-set-state/use-set-state.ts b/packages/@mantine/hooks/src/use-set-state/use-set-state.ts index 02b53886976..a8c0b87d983 100644 --- a/packages/@mantine/hooks/src/use-set-state/use-set-state.ts +++ b/packages/@mantine/hooks/src/use-set-state/use-set-state.ts @@ -1,4 +1,4 @@ -import { useState, useCallback } from 'react'; +import { useCallback, useState } from 'react'; export function useSetState>(initialState: T) { const [state, _setState] = useState(initialState); diff --git a/packages/@mantine/hooks/src/use-text-selection/use-text-selection.ts b/packages/@mantine/hooks/src/use-text-selection/use-text-selection.ts index 8f1d7a8f941..fda073204ff 100644 --- a/packages/@mantine/hooks/src/use-text-selection/use-text-selection.ts +++ b/packages/@mantine/hooks/src/use-text-selection/use-text-selection.ts @@ -1,4 +1,4 @@ -import { useState, useEffect } from 'react'; +import { useEffect, useState } from 'react'; import { useForceUpdate } from '../use-force-update/use-force-update'; export function useTextSelection(): Selection | null { diff --git a/packages/@mantine/hooks/src/use-timeout/use-timeout.ts b/packages/@mantine/hooks/src/use-timeout/use-timeout.ts index 44696a60efe..92815c2e499 100644 --- a/packages/@mantine/hooks/src/use-timeout/use-timeout.ts +++ b/packages/@mantine/hooks/src/use-timeout/use-timeout.ts @@ -1,4 +1,4 @@ -import { useRef, useEffect, useCallback } from 'react'; +import { useCallback, useEffect, useRef } from 'react'; export function useTimeout( callback: (...callbackParams: any[]) => void, diff --git a/packages/@mantine/hooks/src/use-toggle/use-toggle.test.ts b/packages/@mantine/hooks/src/use-toggle/use-toggle.test.ts index 425f94910b6..a33dfa7caf5 100644 --- a/packages/@mantine/hooks/src/use-toggle/use-toggle.test.ts +++ b/packages/@mantine/hooks/src/use-toggle/use-toggle.test.ts @@ -1,4 +1,4 @@ -import { renderHook, act } from '@testing-library/react'; +import { act, renderHook } from '@testing-library/react'; import { useToggle } from './use-toggle'; describe('@mantine/hooks/use-toggle', () => { diff --git a/packages/@mantine/hooks/src/use-validated-state/use-validated-state.test.ts b/packages/@mantine/hooks/src/use-validated-state/use-validated-state.test.ts index 4b68cf3b05c..35747b0052d 100644 --- a/packages/@mantine/hooks/src/use-validated-state/use-validated-state.test.ts +++ b/packages/@mantine/hooks/src/use-validated-state/use-validated-state.test.ts @@ -1,4 +1,4 @@ -import { renderHook, act } from '@testing-library/react'; +import { act, renderHook } from '@testing-library/react'; import { useValidatedState } from './use-validated-state'; describe('@mantine/hooks/use-validated-state', () => { diff --git a/packages/@mantine/hooks/src/use-viewport-size/use-viewport-size.ts b/packages/@mantine/hooks/src/use-viewport-size/use-viewport-size.ts index 93dcb5bb000..cca24cddcaf 100644 --- a/packages/@mantine/hooks/src/use-viewport-size/use-viewport-size.ts +++ b/packages/@mantine/hooks/src/use-viewport-size/use-viewport-size.ts @@ -1,4 +1,4 @@ -import { useCallback, useState, useEffect } from 'react'; +import { useCallback, useEffect, useState } from 'react'; import { useWindowEvent } from '../use-window-event/use-window-event'; const eventListerOptions = { diff --git a/packages/@mantine/hooks/src/use-window-scroll/use-window-scroll.ts b/packages/@mantine/hooks/src/use-window-scroll/use-window-scroll.ts index 68c245e3c28..1e900da342c 100644 --- a/packages/@mantine/hooks/src/use-window-scroll/use-window-scroll.ts +++ b/packages/@mantine/hooks/src/use-window-scroll/use-window-scroll.ts @@ -1,4 +1,4 @@ -import { useState, useEffect } from 'react'; +import { useEffect, useState } from 'react'; import { useWindowEvent } from '../use-window-event/use-window-event'; interface ScrollPosition { diff --git a/packages/@mantine/modals/src/ConfirmModal.tsx b/packages/@mantine/modals/src/ConfirmModal.tsx index 11120cec7ec..f29b6231e9d 100644 --- a/packages/@mantine/modals/src/ConfirmModal.tsx +++ b/packages/@mantine/modals/src/ConfirmModal.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Button, Group, Box, ButtonProps, GroupProps } from '@mantine/core'; +import { Box, Button, ButtonProps, Group, GroupProps } from '@mantine/core'; import { ConfirmLabels } from './context'; import { useModals } from './use-modals/use-modals'; diff --git a/packages/@mantine/modals/src/Modals.story.tsx b/packages/@mantine/modals/src/Modals.story.tsx index 1d2d33a8972..dc4c584ca78 100644 --- a/packages/@mantine/modals/src/Modals.story.tsx +++ b/packages/@mantine/modals/src/Modals.story.tsx @@ -1,14 +1,14 @@ /* eslint-disable no-console */ import React, { useState } from 'react'; -import { Button, Text, Group, Modal } from '@mantine/core'; +import { Button, Group, Modal, Text } from '@mantine/core'; import { + closeAllModals, + closeModal, + ContextModalProps, ModalsProvider, openConfirmModal, openContextModal, openModal, - closeAllModals, - closeModal, - ContextModalProps, useModals, } from './index'; diff --git a/packages/@mantine/modals/src/ModalsProvider.tsx b/packages/@mantine/modals/src/ModalsProvider.tsx index faac25f28cf..389b7ceab6b 100644 --- a/packages/@mantine/modals/src/ModalsProvider.tsx +++ b/packages/@mantine/modals/src/ModalsProvider.tsx @@ -1,18 +1,18 @@ import React, { useCallback, useReducer, useRef } from 'react'; -import { Modal, getDefaultZIndex } from '@mantine/core'; +import { getDefaultZIndex, Modal } from '@mantine/core'; import { randomId } from '@mantine/hooks'; +import { ConfirmModal } from './ConfirmModal'; import { + ConfirmLabels, + ContextModalProps, ModalsContext, + ModalsContextProps, ModalSettings, - ConfirmLabels, OpenConfirmModal, OpenContextModal, - ContextModalProps, - ModalsContextProps, } from './context'; -import { ConfirmModal } from './ConfirmModal'; -import { modalsReducer } from './reducer'; import { useModalsEvents } from './events'; +import { modalsReducer } from './reducer'; export interface ModalsProviderProps { /** Your app */ diff --git a/packages/@mantine/modals/src/use-modals/use-modals.test.tsx b/packages/@mantine/modals/src/use-modals/use-modals.test.tsx index da89bd353cf..cd9889fc044 100644 --- a/packages/@mantine/modals/src/use-modals/use-modals.test.tsx +++ b/packages/@mantine/modals/src/use-modals/use-modals.test.tsx @@ -1,9 +1,9 @@ -import React, { useEffect, PropsWithChildren } from 'react'; -import { renderHook, render, screen } from '@testing-library/react'; +import React, { PropsWithChildren, useEffect } from 'react'; +import { render, renderHook, screen } from '@testing-library/react'; import { MantineProvider } from '@mantine/core'; -import { useModals } from './use-modals'; -import { ModalsProvider } from '../ModalsProvider'; import { ContextModalProps } from '../context'; +import { ModalsProvider } from '../ModalsProvider'; +import { useModals } from './use-modals'; describe('@mantine/modals/use-modals', () => { it('returns context value of ModalsProvider', () => { diff --git a/packages/@mantine/notifications/src/NotificationContainer.tsx b/packages/@mantine/notifications/src/NotificationContainer.tsx index c0fd8e1144d..35f10a84a70 100644 --- a/packages/@mantine/notifications/src/NotificationContainer.tsx +++ b/packages/@mantine/notifications/src/NotificationContainer.tsx @@ -1,7 +1,7 @@ -import React, { forwardRef, useRef, useEffect } from 'react'; +import React, { forwardRef, useEffect, useRef } from 'react'; import { Notification, NotificationProps } from '@mantine/core'; -import { NotificationData } from './notifications.store'; import { getAutoClose } from './get-auto-close/get-auto-close'; +import { NotificationData } from './notifications.store'; interface NotificationContainerProps extends NotificationProps { data: NotificationData; diff --git a/packages/@mantine/notifications/src/Notifications.tsx b/packages/@mantine/notifications/src/Notifications.tsx index dae94dc7d8f..0d3f562239c 100644 --- a/packages/@mantine/notifications/src/Notifications.tsx +++ b/packages/@mantine/notifications/src/Notifications.tsx @@ -1,35 +1,35 @@ -import React, { useRef, useEffect } from 'react'; +import React, { useEffect, useRef } from 'react'; import { Transition as _Transition, TransitionGroup, TransitionStatus, } from 'react-transition-group'; -import { useForceUpdate, useDidUpdate, useReducedMotion } from '@mantine/hooks'; import { Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, createVarsResolver, + ElementProps, + factory, Factory, - PortalProps, getDefaultZIndex, - useMantineTheme, OptionalPortal, + PortalProps, rem, + StylesApiProps, + useMantineTheme, + useProps, + useStyles, } from '@mantine/core'; +import { useDidUpdate, useForceUpdate, useReducedMotion } from '@mantine/hooks'; +import { getNotificationStateStyles } from './get-notification-state-styles'; +import { NotificationContainer } from './NotificationContainer'; import { - useNotifications, - NotificationsStore, - notificationsStore, hideNotification, notifications, + NotificationsStore, + notificationsStore, + useNotifications, } from './notifications.store'; -import { NotificationContainer } from './NotificationContainer'; -import { getNotificationStateStyles } from './get-notification-state-styles'; import classes from './Notifications.module.css'; const Transition: any = _Transition; diff --git a/packages/@mantine/notifications/src/notifications.store.ts b/packages/@mantine/notifications/src/notifications.store.ts index e8c5a276a9f..3120d02c01a 100644 --- a/packages/@mantine/notifications/src/notifications.store.ts +++ b/packages/@mantine/notifications/src/notifications.store.ts @@ -1,6 +1,6 @@ import { NotificationProps } from '@mantine/core'; import { randomId } from '@mantine/hooks'; -import { createStore, useStore, MantineStore } from '@mantine/store'; +import { createStore, MantineStore, useStore } from '@mantine/store'; export interface NotificationData extends Omit { /** Notification id, can be used to close or update notification */ diff --git a/packages/@mantine/nprogress/src/NavigationProgress.tsx b/packages/@mantine/nprogress/src/NavigationProgress.tsx index a3b22a7ae7c..fb533b9e117 100644 --- a/packages/@mantine/nprogress/src/NavigationProgress.tsx +++ b/packages/@mantine/nprogress/src/NavigationProgress.tsx @@ -1,11 +1,11 @@ import React, { useEffect } from 'react'; import { - OptionalPortal, - Progress, + ElementProps, getDefaultZIndex, MantineColor, + OptionalPortal, PortalProps, - ElementProps, + Progress, } from '@mantine/core'; import { NprogressStore, diff --git a/packages/@mantine/nprogress/src/nprogress.store.ts b/packages/@mantine/nprogress/src/nprogress.store.ts index e7fc350569f..481cbb8fbee 100644 --- a/packages/@mantine/nprogress/src/nprogress.store.ts +++ b/packages/@mantine/nprogress/src/nprogress.store.ts @@ -1,5 +1,5 @@ import { clamp } from '@mantine/hooks'; -import { createStore, useStore, MantineStore } from '@mantine/store'; +import { createStore, MantineStore, useStore } from '@mantine/store'; function getIntervalProgressValue(currentProgress: number) { let next = 0.5; diff --git a/packages/@mantine/spotlight/src/Spotlight.context.ts b/packages/@mantine/spotlight/src/Spotlight.context.ts index a8fcf2db065..12ca6f0d0e5 100644 --- a/packages/@mantine/spotlight/src/Spotlight.context.ts +++ b/packages/@mantine/spotlight/src/Spotlight.context.ts @@ -1,6 +1,6 @@ import { createSafeContext, GetStylesApi } from '@mantine/core'; -import type { SpotlightRootFactory } from './SpotlightRoot'; import { SpotlightStore } from './spotlight.store'; +import type { SpotlightRootFactory } from './SpotlightRoot'; interface SpotlightContextValue { query: string; diff --git a/packages/@mantine/spotlight/src/Spotlight.test.tsx b/packages/@mantine/spotlight/src/Spotlight.test.tsx index 7a779874ae5..cb091b3ef6e 100644 --- a/packages/@mantine/spotlight/src/Spotlight.test.tsx +++ b/packages/@mantine/spotlight/src/Spotlight.test.tsx @@ -1,11 +1,11 @@ import { tests } from '@mantine-tests/core'; import { Spotlight, SpotlightProps, SpotlightStylesNames } from './Spotlight'; +import { spotlight } from './spotlight.store'; import { SpotlightAction } from './SpotlightAction'; import { SpotlightActionsList } from './SpotlightActionsList'; import { SpotlightEmpty } from './SpotlightEmpty'; import { SpotlightFooter } from './SpotlightFooter'; import { SpotlightSearch } from './SpotlightSearch'; -import { spotlight } from './spotlight.store'; const defaultProps: SpotlightProps = { forceOpened: true, diff --git a/packages/@mantine/spotlight/src/Spotlight.tsx b/packages/@mantine/spotlight/src/Spotlight.tsx index afb5ef19112..33662ce98ea 100644 --- a/packages/@mantine/spotlight/src/Spotlight.tsx +++ b/packages/@mantine/spotlight/src/Spotlight.tsx @@ -1,17 +1,17 @@ import React from 'react'; +import { factory, Factory, getDefaultZIndex, useProps } from '@mantine/core'; import { useUncontrolled } from '@mantine/hooks'; -import { factory, useProps, Factory, getDefaultZIndex } from '@mantine/core'; -import { spotlightStore, spotlight } from './spotlight.store'; -import { SpotlightSearch, SpotlightSearchProps } from './SpotlightSearch'; -import { SpotlightActionsList } from './SpotlightActionsList'; +import { defaultSpotlightFilter } from './default-spotlight-filter'; +import { isActionsGroup } from './is-actions-group'; +import { limitActions } from './limit-actions'; +import { spotlight, spotlightStore } from './spotlight.store'; import { SpotlightAction, SpotlightActionProps } from './SpotlightAction'; +import { SpotlightActionsGroup } from './SpotlightActionsGroup'; +import { SpotlightActionsList } from './SpotlightActionsList'; import { SpotlightEmpty } from './SpotlightEmpty'; import { SpotlightFooter } from './SpotlightFooter'; -import { SpotlightActionsGroup } from './SpotlightActionsGroup'; import { SpotlightRoot, SpotlightRootProps, SpotlightRootStylesNames } from './SpotlightRoot'; -import { defaultSpotlightFilter } from './default-spotlight-filter'; -import { isActionsGroup } from './is-actions-group'; -import { limitActions } from './limit-actions'; +import { SpotlightSearch, SpotlightSearchProps } from './SpotlightSearch'; import classes from './Spotlight.module.css'; export type SpotlightFilterFunction = ( diff --git a/packages/@mantine/spotlight/src/SpotlightAction.tsx b/packages/@mantine/spotlight/src/SpotlightAction.tsx index c11543ae372..817b21eef61 100644 --- a/packages/@mantine/spotlight/src/SpotlightAction.tsx +++ b/packages/@mantine/spotlight/src/SpotlightAction.tsx @@ -3,17 +3,17 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, - UnstyledButton, - MantineColor, Highlight, + MantineColor, + UnstyledButton, + useProps, } from '@mantine/core'; -import classes from './Spotlight.module.css'; import { useSpotlightContext } from './Spotlight.context'; import { spotlightActions } from './spotlight.store'; +import classes from './Spotlight.module.css'; export type SpotlightActionStylesNames = | 'action' diff --git a/packages/@mantine/spotlight/src/SpotlightActionsGroup.tsx b/packages/@mantine/spotlight/src/SpotlightActionsGroup.tsx index 6fd655ddfee..a1866627780 100644 --- a/packages/@mantine/spotlight/src/SpotlightActionsGroup.tsx +++ b/packages/@mantine/spotlight/src/SpotlightActionsGroup.tsx @@ -3,13 +3,13 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '@mantine/core'; -import classes from './Spotlight.module.css'; import { useSpotlightContext } from './Spotlight.context'; +import classes from './Spotlight.module.css'; export type SpotlightActionsGroupStylesNames = 'actionsGroup'; diff --git a/packages/@mantine/spotlight/src/SpotlightActionsList.tsx b/packages/@mantine/spotlight/src/SpotlightActionsList.tsx index 7a4424e3931..7020b36fe6c 100644 --- a/packages/@mantine/spotlight/src/SpotlightActionsList.tsx +++ b/packages/@mantine/spotlight/src/SpotlightActionsList.tsx @@ -2,15 +2,15 @@ import React, { useEffect, useId } from 'react'; import { BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, ScrollArea, + useProps, } from '@mantine/core'; -import classes from './Spotlight.module.css'; import { useSpotlightContext } from './Spotlight.context'; import { spotlightActions } from './spotlight.store'; +import classes from './Spotlight.module.css'; export type SpotlightActionsListStylesNames = 'actionsList' | 'actionsListInner'; diff --git a/packages/@mantine/spotlight/src/SpotlightEmpty.tsx b/packages/@mantine/spotlight/src/SpotlightEmpty.tsx index 6038b1c2db8..24ecdfb4670 100644 --- a/packages/@mantine/spotlight/src/SpotlightEmpty.tsx +++ b/packages/@mantine/spotlight/src/SpotlightEmpty.tsx @@ -3,10 +3,10 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '@mantine/core'; import { useSpotlightContext } from './Spotlight.context'; import classes from './Spotlight.module.css'; diff --git a/packages/@mantine/spotlight/src/SpotlightFooter.tsx b/packages/@mantine/spotlight/src/SpotlightFooter.tsx index 036082dbd00..c8826c84489 100644 --- a/packages/@mantine/spotlight/src/SpotlightFooter.tsx +++ b/packages/@mantine/spotlight/src/SpotlightFooter.tsx @@ -3,13 +3,13 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '@mantine/core'; -import classes from './Spotlight.module.css'; import { useSpotlightContext } from './Spotlight.context'; +import classes from './Spotlight.module.css'; export type SpotlightFooterStylesNames = 'footer'; diff --git a/packages/@mantine/spotlight/src/SpotlightRoot.tsx b/packages/@mantine/spotlight/src/SpotlightRoot.tsx index a5a937fea8b..680ea642fe8 100644 --- a/packages/@mantine/spotlight/src/SpotlightRoot.tsx +++ b/packages/@mantine/spotlight/src/SpotlightRoot.tsx @@ -1,23 +1,23 @@ import React from 'react'; import { - StylesApiProps, factory, - useProps, - useStyles, Factory, + getDefaultZIndex, Modal, ModalProps, ModalStylesNames, - getDefaultZIndex, + rem, resolveClassNames, - useMantineTheme, resolveStyles, - rem, + StylesApiProps, + useMantineTheme, + useProps, + useStyles, } from '@mantine/core'; import { useDidUpdate, useHotkeys } from '@mantine/hooks'; -import { SpotlightProvider } from './Spotlight.context'; -import { useSpotlight, SpotlightStore, spotlightStore, spotlightActions } from './spotlight.store'; import { getHotkeys } from './get-hotkeys'; +import { SpotlightProvider } from './Spotlight.context'; +import { spotlightActions, SpotlightStore, spotlightStore, useSpotlight } from './spotlight.store'; import classes from './Spotlight.module.css'; export type SpotlightRootStylesNames = diff --git a/packages/@mantine/spotlight/src/SpotlightSearch.tsx b/packages/@mantine/spotlight/src/SpotlightSearch.tsx index 98c9c9ed20d..9c2bc1bf020 100644 --- a/packages/@mantine/spotlight/src/SpotlightSearch.tsx +++ b/packages/@mantine/spotlight/src/SpotlightSearch.tsx @@ -2,17 +2,17 @@ import React from 'react'; import { BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, Input, InputProps, InputStylesNames, + useProps, } from '@mantine/core'; -import classes from './Spotlight.module.css'; import { useSpotlightContext } from './Spotlight.context'; import { spotlightActions } from './spotlight.store'; +import classes from './Spotlight.module.css'; export type SpotlightSearchStylesNames = InputStylesNames; diff --git a/packages/@mantine/spotlight/src/default-spotlight-filter.ts b/packages/@mantine/spotlight/src/default-spotlight-filter.ts index 2e17b8c3636..24ce79494fc 100644 --- a/packages/@mantine/spotlight/src/default-spotlight-filter.ts +++ b/packages/@mantine/spotlight/src/default-spotlight-filter.ts @@ -1,8 +1,8 @@ import type { - SpotlightFilterFunction, SpotlightActionData, SpotlightActionGroupData, SpotlightActions, + SpotlightFilterFunction, } from './Spotlight'; function getKeywords(keywords: string | string[] | undefined) { diff --git a/packages/@mantine/spotlight/src/limit-actions.ts b/packages/@mantine/spotlight/src/limit-actions.ts index 1a3b82ee9ea..39cc52aac85 100644 --- a/packages/@mantine/spotlight/src/limit-actions.ts +++ b/packages/@mantine/spotlight/src/limit-actions.ts @@ -1,5 +1,5 @@ -import type { SpotlightActions, SpotlightActionData } from './Spotlight'; import { isActionsGroup } from './is-actions-group'; +import type { SpotlightActionData, SpotlightActions } from './Spotlight'; export function limitActions(actions: SpotlightActions[], limit: number) { const result: SpotlightActions[] = []; diff --git a/packages/@mantine/spotlight/src/spotlight.store.ts b/packages/@mantine/spotlight/src/spotlight.store.ts index 708acf9ff3a..f594d6bae5f 100644 --- a/packages/@mantine/spotlight/src/spotlight.store.ts +++ b/packages/@mantine/spotlight/src/spotlight.store.ts @@ -1,5 +1,5 @@ import { clamp } from '@mantine/hooks'; -import { createStore, useStore, MantineStore } from '@mantine/store'; +import { createStore, MantineStore, useStore } from '@mantine/store'; export interface SpotlightState { opened: boolean; diff --git a/packages/@mantine/tiptap/src/RichTextEditor.context.ts b/packages/@mantine/tiptap/src/RichTextEditor.context.ts index dc361285f57..5cb27558132 100644 --- a/packages/@mantine/tiptap/src/RichTextEditor.context.ts +++ b/packages/@mantine/tiptap/src/RichTextEditor.context.ts @@ -1,5 +1,5 @@ -import { createSafeContext, GetStylesApi } from '@mantine/core'; import { Editor } from '@tiptap/react'; +import { createSafeContext, GetStylesApi } from '@mantine/core'; import { RichTextEditorLabels } from './labels'; import type { RichTextEditorFactory } from './RichTextEditor'; diff --git a/packages/@mantine/tiptap/src/RichTextEditor.story.tsx b/packages/@mantine/tiptap/src/RichTextEditor.story.tsx index c62cc831949..5542495bc95 100644 --- a/packages/@mantine/tiptap/src/RichTextEditor.story.tsx +++ b/packages/@mantine/tiptap/src/RichTextEditor.story.tsx @@ -1,22 +1,22 @@ import React from 'react'; -import { useEditor, FloatingMenu, BubbleMenu } from '@tiptap/react'; -import { AppShell } from '@mantine/core'; -import Highlight from '@tiptap/extension-highlight'; +import { IconColorPicker } from '@tabler/icons-react'; +import CodeBlockLowlight from '@tiptap/extension-code-block-lowlight'; import { Color } from '@tiptap/extension-color'; +import Highlight from '@tiptap/extension-highlight'; +import Placeholder from '@tiptap/extension-placeholder'; +import SubScript from '@tiptap/extension-subscript'; +import Superscript from '@tiptap/extension-superscript'; +import TextAlign from '@tiptap/extension-text-align'; import TextStyle from '@tiptap/extension-text-style'; -import CodeBlockLowlight from '@tiptap/extension-code-block-lowlight'; -import StarterKit from '@tiptap/starter-kit'; import Underline from '@tiptap/extension-underline'; -import TextAlign from '@tiptap/extension-text-align'; -import Superscript from '@tiptap/extension-superscript'; -import SubScript from '@tiptap/extension-subscript'; -import Placeholder from '@tiptap/extension-placeholder'; -import { createLowlight } from 'lowlight'; +import { BubbleMenu, FloatingMenu, useEditor } from '@tiptap/react'; +import StarterKit from '@tiptap/starter-kit'; import css from 'highlight.js/lib/languages/css'; import js from 'highlight.js/lib/languages/javascript'; import ts from 'highlight.js/lib/languages/typescript'; import html from 'highlight.js/lib/languages/xml'; -import { IconColorPicker } from '@tabler/icons-react'; +import { createLowlight } from 'lowlight'; +import { AppShell } from '@mantine/core'; import { Link } from './extensions/Link'; import { RichTextEditor, RichTextEditorProps } from './RichTextEditor'; import { RichTextEditorToolbarProps } from './RichTextEditorToolbar/RichTextEditorToolbar'; diff --git a/packages/@mantine/tiptap/src/RichTextEditor.tsx b/packages/@mantine/tiptap/src/RichTextEditor.tsx index 0af0fcc1daa..fed8678635b 100644 --- a/packages/@mantine/tiptap/src/RichTextEditor.tsx +++ b/packages/@mantine/tiptap/src/RichTextEditor.tsx @@ -1,22 +1,22 @@ import React, { useMemo } from 'react'; +import { Editor } from '@tiptap/react'; import { Box, BoxProps, - StylesApiProps, - factory, ElementProps, + factory, + Factory, + StylesApiProps, useProps, useStyles, - Factory, } from '@mantine/core'; -import { Editor } from '@tiptap/react'; import { DEFAULT_LABELS, RichTextEditorLabels } from './labels'; import { RichTextEditorProvider } from './RichTextEditor.context'; -import { RichTextEditorToolbar } from './RichTextEditorToolbar/RichTextEditorToolbar'; -import { RichTextEditorControlsGroup } from './RichTextEditorControlsGroup/RichTextEditorControlsGroup'; import { RichTextEditorContent } from './RichTextEditorContent/RichTextEditorContent'; -import { RichTextEditorControl } from './RichTextEditorControl/RichTextEditorControl'; import * as controls from './RichTextEditorControl'; +import { RichTextEditorControl } from './RichTextEditorControl/RichTextEditorControl'; +import { RichTextEditorControlsGroup } from './RichTextEditorControlsGroup/RichTextEditorControlsGroup'; +import { RichTextEditorToolbar } from './RichTextEditorToolbar/RichTextEditorToolbar'; import classes from './RichTextEditor.module.css'; export type RichTextEditorStylesNames = diff --git a/packages/@mantine/tiptap/src/RichTextEditorContent/RichTextEditorContent.tsx b/packages/@mantine/tiptap/src/RichTextEditorContent/RichTextEditorContent.tsx index 040d2be5253..b4e65ed9691 100644 --- a/packages/@mantine/tiptap/src/RichTextEditorContent/RichTextEditorContent.tsx +++ b/packages/@mantine/tiptap/src/RichTextEditorContent/RichTextEditorContent.tsx @@ -1,15 +1,15 @@ import React from 'react'; +import { EditorContent } from '@tiptap/react'; import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, TypographyStylesProvider, + useProps, } from '@mantine/core'; -import { EditorContent } from '@tiptap/react'; import { useRichTextEditorContext } from '../RichTextEditor.context'; import classes from '../RichTextEditor.module.css'; diff --git a/packages/@mantine/tiptap/src/RichTextEditorControl/RichTextEditorColorControl.tsx b/packages/@mantine/tiptap/src/RichTextEditorControl/RichTextEditorColorControl.tsx index 20f42c16623..4498109afe2 100644 --- a/packages/@mantine/tiptap/src/RichTextEditorControl/RichTextEditorColorControl.tsx +++ b/packages/@mantine/tiptap/src/RichTextEditorControl/RichTextEditorColorControl.tsx @@ -1,7 +1,7 @@ import React, { forwardRef } from 'react'; -import { ColorSwatch, BoxProps, useProps, ElementProps } from '@mantine/core'; -import { RichTextEditorControl } from './RichTextEditorControl'; +import { BoxProps, ColorSwatch, ElementProps, useProps } from '@mantine/core'; import { useRichTextEditorContext } from '../RichTextEditor.context'; +import { RichTextEditorControl } from './RichTextEditorControl'; export interface RichTextEditorColorControlProps extends BoxProps, ElementProps<'button'> { /** Color that will be set as text color, for example #ef457e */ diff --git a/packages/@mantine/tiptap/src/RichTextEditorControl/RichTextEditorColorPickerControl.tsx b/packages/@mantine/tiptap/src/RichTextEditorControl/RichTextEditorColorPickerControl.tsx index 2bb3396a7c0..c897b9e0e3b 100644 --- a/packages/@mantine/tiptap/src/RichTextEditorControl/RichTextEditorColorPickerControl.tsx +++ b/packages/@mantine/tiptap/src/RichTextEditorControl/RichTextEditorColorPickerControl.tsx @@ -1,23 +1,23 @@ import React, { forwardRef, useState } from 'react'; import { + ActionIcon, BoxProps, + ColorPicker, + ColorPickerProps, + ColorSwatch, + ElementProps, + Group, Popover, PopoverProps, - ColorSwatch, + rem, SimpleGrid, - ColorPicker, - Group, - ActionIcon, Tooltip, - ColorPickerProps, useProps, - ElementProps, - rem, } from '@mantine/core'; import { useDisclosure } from '@mantine/hooks'; -import { IconCircleOff, IconColorPicker, IconX, IconPalette, IconCheck } from '../icons/Icons'; -import { RichTextEditorControl } from './RichTextEditorControl'; +import { IconCheck, IconCircleOff, IconColorPicker, IconPalette, IconX } from '../icons/Icons'; import { useRichTextEditorContext } from '../RichTextEditor.context'; +import { RichTextEditorControl } from './RichTextEditorControl'; export interface RichTextEditorColorPickerControlProps extends BoxProps, ElementProps<'button'> { /** Props added to Popover component */ diff --git a/packages/@mantine/tiptap/src/RichTextEditorControl/RichTextEditorControl.tsx b/packages/@mantine/tiptap/src/RichTextEditorControl/RichTextEditorControl.tsx index dffaee0aec3..196b3977b2f 100644 --- a/packages/@mantine/tiptap/src/RichTextEditorControl/RichTextEditorControl.tsx +++ b/packages/@mantine/tiptap/src/RichTextEditorControl/RichTextEditorControl.tsx @@ -1,16 +1,16 @@ import React, { forwardRef } from 'react'; import { - UnstyledButton, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, rem, + UnstyledButton, + useProps, } from '@mantine/core'; -import { useRichTextEditorContext } from '../RichTextEditor.context'; import { RichTextEditorLabels } from '../labels'; +import { useRichTextEditorContext } from '../RichTextEditor.context'; import classes from '../RichTextEditor.module.css'; export type RichTextEditorControlStylesNames = 'control'; diff --git a/packages/@mantine/tiptap/src/RichTextEditorControl/RichTextEditorLinkControl.tsx b/packages/@mantine/tiptap/src/RichTextEditorControl/RichTextEditorLinkControl.tsx index a1ab4422ff8..3c592950596 100644 --- a/packages/@mantine/tiptap/src/RichTextEditorControl/RichTextEditorLinkControl.tsx +++ b/packages/@mantine/tiptap/src/RichTextEditorControl/RichTextEditorLinkControl.tsx @@ -1,23 +1,23 @@ import React, { useState } from 'react'; import { BoxProps, + Button, CompoundStylesApiProps, factory, - useProps, Factory, - PopoverProps, Popover, + PopoverProps, + rem, TextInput, - Button, - UnstyledButton, Tooltip, - rem, + UnstyledButton, + useProps, useResolvedStylesApi, } from '@mantine/core'; -import { useInputState, useDisclosure, useWindowEvent } from '@mantine/hooks'; -import { IconLink, IconExternalLink } from '../icons/Icons'; +import { useDisclosure, useInputState, useWindowEvent } from '@mantine/hooks'; +import { IconExternalLink, IconLink } from '../icons/Icons'; import { useRichTextEditorContext } from '../RichTextEditor.context'; -import { RichTextEditorControlBaseProps, RichTextEditorControlBase } from './RichTextEditorControl'; +import { RichTextEditorControlBase, RichTextEditorControlBaseProps } from './RichTextEditorControl'; import classes from '../RichTextEditor.module.css'; export type RichTextEditorLinkControlStylesNames = diff --git a/packages/@mantine/tiptap/src/RichTextEditorControl/controls.tsx b/packages/@mantine/tiptap/src/RichTextEditorControl/controls.tsx index 89a15097e7b..43a1a9869d8 100644 --- a/packages/@mantine/tiptap/src/RichTextEditorControl/controls.tsx +++ b/packages/@mantine/tiptap/src/RichTextEditorControl/controls.tsx @@ -1,32 +1,32 @@ import React from 'react'; -import { createControl } from './RichTextEditorControl'; import { + IconAlignCenter, + IconAlignJustified, + IconAlignLeft, + IconAlignRight, + IconBlockquote, IconBold, - IconItalic, - IconUnderline, - IconStrikethrough, + IconCircleOff, IconClearFormatting, + IconCode, IconH1, IconH2, IconH3, IconH4, IconH5, IconH6, + IconHighlight, + IconItalic, + IconLineDashed, IconList, IconListNumbers, - IconUnlink, - IconBlockquote, - IconAlignLeft, - IconAlignRight, - IconAlignCenter, - IconAlignJustified, + IconStrikethrough, IconSubscript, IconSuperscript, - IconCode, - IconHighlight, - IconLineDashed, - IconCircleOff, + IconUnderline, + IconUnlink, } from '../icons/Icons'; +import { createControl } from './RichTextEditorControl'; export const BoldControl = createControl({ label: 'boldControlLabel', diff --git a/packages/@mantine/tiptap/src/RichTextEditorControlsGroup/RichTextEditorControlsGroup.tsx b/packages/@mantine/tiptap/src/RichTextEditorControlsGroup/RichTextEditorControlsGroup.tsx index 7d6a99a3050..4eda9cbb777 100644 --- a/packages/@mantine/tiptap/src/RichTextEditorControlsGroup/RichTextEditorControlsGroup.tsx +++ b/packages/@mantine/tiptap/src/RichTextEditorControlsGroup/RichTextEditorControlsGroup.tsx @@ -3,10 +3,10 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, + useProps, } from '@mantine/core'; import { useRichTextEditorContext } from '../RichTextEditor.context'; import classes from '../RichTextEditor.module.css'; diff --git a/packages/@mantine/tiptap/src/RichTextEditorToolbar/RichTextEditorToolbar.tsx b/packages/@mantine/tiptap/src/RichTextEditorToolbar/RichTextEditorToolbar.tsx index 3b216202761..b1a7512433b 100644 --- a/packages/@mantine/tiptap/src/RichTextEditorToolbar/RichTextEditorToolbar.tsx +++ b/packages/@mantine/tiptap/src/RichTextEditorToolbar/RichTextEditorToolbar.tsx @@ -3,11 +3,11 @@ import { Box, BoxProps, CompoundStylesApiProps, - factory, ElementProps, - useProps, + factory, Factory, rem, + useProps, } from '@mantine/core'; import { useRichTextEditorContext } from '../RichTextEditor.context'; import classes from '../RichTextEditor.module.css'; diff --git a/packages/@mantine/vanilla-extract/src/theme-to-vars.ts b/packages/@mantine/vanilla-extract/src/theme-to-vars.ts index 25fdf2b93d1..6a634af9573 100644 --- a/packages/@mantine/vanilla-extract/src/theme-to-vars.ts +++ b/packages/@mantine/vanilla-extract/src/theme-to-vars.ts @@ -1,8 +1,8 @@ import { DEFAULT_THEME, + em, MantineTheme, MantineThemeOverride, - em, mergeMantineTheme, } from '@mantine/core'; import { diff --git a/packages/@mantine/vanilla-extract/src/types.ts b/packages/@mantine/vanilla-extract/src/types.ts index 3aa1ec1c322..931133ed6bb 100644 --- a/packages/@mantine/vanilla-extract/src/types.ts +++ b/packages/@mantine/vanilla-extract/src/types.ts @@ -1,11 +1,11 @@ import { - MantineColor, MantineBreakpoint, - MantineSpacing, + MantineColor, MantineFontSize, MantineLineHeight, - MantineShadow, MantineRadius, + MantineShadow, + MantineSpacing, } from '@mantine/core'; interface ColorValues { diff --git a/packages/@mantinex/demo/src/ConfiguratorDemo/ConfiguratorDemo.tsx b/packages/@mantinex/demo/src/ConfiguratorDemo/ConfiguratorDemo.tsx index 664d1eb68fc..3d799f3467c 100644 --- a/packages/@mantinex/demo/src/ConfiguratorDemo/ConfiguratorDemo.tsx +++ b/packages/@mantinex/demo/src/ConfiguratorDemo/ConfiguratorDemo.tsx @@ -4,24 +4,24 @@ import { DemoAreaProps } from '../DemoArea'; import { DemoCode } from '../DemoCode'; import { DemoColumns } from '../DemoColumns'; import { DemoRoot } from '../DemoRoot'; +import { clearProps } from './clear-props'; import { ConfiguratorBooleanControl, - ConfiguratorSegmentedControl, + ConfiguratorBooleanControlOptions, ConfiguratorColorControl, - ConfiguratorStringControl, - ConfiguratorSelectControl, - ConfiguratorSizeControl, + ConfiguratorColorControlOptions, ConfiguratorNumberControl, - ConfiguratorBooleanControlOptions, + ConfiguratorNumberControlOptions, + ConfiguratorSegmentedControl, ConfiguratorSegmentedControlOptions, - ConfiguratorColorControlOptions, - ConfiguratorStringControlOptions, + ConfiguratorSelectControl, ConfiguratorSelectControlOptions, + ConfiguratorSizeControl, ConfiguratorSizeControlOptions, - ConfiguratorNumberControlOptions, + ConfiguratorStringControl, + ConfiguratorStringControlOptions, } from './controls'; import { injectProps } from './inject-props'; -import { clearProps } from './clear-props'; import classes from './ConfiguratorDemo.module.css'; const ControlComponents = { diff --git a/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorBoolean.control.tsx b/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorBoolean.control.tsx index 956b2e26a93..17c25c0cfc5 100644 --- a/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorBoolean.control.tsx +++ b/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorBoolean.control.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Switch, BoxProps, ElementProps } from '@mantine/core'; +import { BoxProps, ElementProps, Switch } from '@mantine/core'; import { getControlLabel } from './get-control-label'; import { ConfiguratorControl } from './types'; diff --git a/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorColor.control.tsx b/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorColor.control.tsx index a4864f15204..df04a515ac5 100644 --- a/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorColor.control.tsx +++ b/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorColor.control.tsx @@ -1,20 +1,20 @@ import React, { useState } from 'react'; import { - ColorSwatch, - Input, BoxProps, - ElementProps, CheckIcon, - Group, - Popover, - UnstyledButton, ColorPicker, + ColorSwatch, DEFAULT_THEME, + ElementProps, + Group, + Input, + Popover, TextInput, + UnstyledButton, } from '@mantine/core'; +import { ColorWheelIcon } from './ColorWheelIcon'; import { getControlLabel } from './get-control-label'; import { ConfiguratorControl } from './types'; -import { ColorWheelIcon } from './ColorWheelIcon'; import classes from './ConfiguratorColor.control.module.css'; export type ConfiguratorColorControlOptions = ConfiguratorControl< diff --git a/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorNumber.control.tsx b/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorNumber.control.tsx index 9a6f57120f2..dacc2a97172 100644 --- a/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorNumber.control.tsx +++ b/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorNumber.control.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Slider, Input, BoxProps, ElementProps } from '@mantine/core'; +import { BoxProps, ElementProps, Input, Slider } from '@mantine/core'; import { getControlLabel } from './get-control-label'; import { ConfiguratorControl } from './types'; diff --git a/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorSegmented.control.tsx b/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorSegmented.control.tsx index 464a7527f6a..0c9bbcfe533 100644 --- a/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorSegmented.control.tsx +++ b/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorSegmented.control.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { SegmentedControl, Input, BoxProps, ElementProps } from '@mantine/core'; -import { transformSelectData, SelectData } from './transform-select-data'; +import { BoxProps, ElementProps, Input, SegmentedControl } from '@mantine/core'; import { getControlLabel } from './get-control-label'; +import { SelectData, transformSelectData } from './transform-select-data'; import { ConfiguratorControl } from './types'; export type ConfiguratorSegmentedControlOptions = ConfiguratorControl< diff --git a/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorSelect.control.tsx b/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorSelect.control.tsx index d6ab06a5c41..cf9f638b204 100644 --- a/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorSelect.control.tsx +++ b/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorSelect.control.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import { NativeSelect, BoxProps, ElementProps } from '@mantine/core'; +import { BoxProps, ElementProps, NativeSelect } from '@mantine/core'; import { getControlLabel } from './get-control-label'; -import { transformSelectData, SelectData } from './transform-select-data'; +import { SelectData, transformSelectData } from './transform-select-data'; import { ConfiguratorControl } from './types'; export type ConfiguratorSelectControlOptions = ConfiguratorControl< diff --git a/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorSize.control.tsx b/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorSize.control.tsx index e83cca875b3..303faf4a6d1 100644 --- a/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorSize.control.tsx +++ b/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorSize.control.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Slider, Input, BoxProps, ElementProps } from '@mantine/core'; +import { BoxProps, ElementProps, Input, Slider } from '@mantine/core'; import { getControlLabel } from './get-control-label'; import { ConfiguratorControl } from './types'; diff --git a/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorString.control.tsx b/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorString.control.tsx index 409a564590e..0f4d66ff21c 100644 --- a/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorString.control.tsx +++ b/packages/@mantinex/demo/src/ConfiguratorDemo/controls/ConfiguratorString.control.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { TextInput, BoxProps, ElementProps } from '@mantine/core'; +import { BoxProps, ElementProps, TextInput } from '@mantine/core'; import { getControlLabel } from './get-control-label'; import { ConfiguratorControl } from './types'; diff --git a/packages/@mantinex/demo/src/DemoCode/DemoCode.tsx b/packages/@mantinex/demo/src/DemoCode/DemoCode.tsx index deb13e965d3..6958e9cc24a 100644 --- a/packages/@mantinex/demo/src/DemoCode/DemoCode.tsx +++ b/packages/@mantinex/demo/src/DemoCode/DemoCode.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { CodeHighlightTabs, CodeHighlightTabsCode } from '@mantinex/shiki'; import { getCodeFileIcon } from '@mantinex/dev-icons'; +import { CodeHighlightTabs, CodeHighlightTabsCode } from '@mantinex/shiki'; import classes from './DemoCode.module.css'; export interface DemoCodeProps { diff --git a/packages/@mantinex/demo/src/StylesApiDemo/StylesApiDemo.tsx b/packages/@mantinex/demo/src/StylesApiDemo/StylesApiDemo.tsx index 1a0cba35678..9e2e8fd2bd1 100644 --- a/packages/@mantinex/demo/src/StylesApiDemo/StylesApiDemo.tsx +++ b/packages/@mantinex/demo/src/StylesApiDemo/StylesApiDemo.tsx @@ -1,9 +1,9 @@ import React from 'react'; -import { UnstyledButton, Text } from '@mantine/core'; +import { Text, UnstyledButton } from '@mantine/core'; import { DemoAreaProps } from '../DemoArea'; import { DemoCode } from '../DemoCode'; -import { DemoRoot } from '../DemoRoot'; import { DemoColumns } from '../DemoColumns'; +import { DemoRoot } from '../DemoRoot'; import classes from './StylesApiDemo.module.css'; export interface StylesApiDemoProps extends DemoAreaProps { diff --git a/packages/@mantinex/dev-icons/src/Icons.story.tsx b/packages/@mantinex/dev-icons/src/Icons.story.tsx index a06efa097a5..89fb8ce1269 100644 --- a/packages/@mantinex/dev-icons/src/Icons.story.tsx +++ b/packages/@mantinex/dev-icons/src/Icons.story.tsx @@ -1,8 +1,8 @@ import React from 'react'; import { DiscordIcon } from './DiscordIcon'; import { GithubIcon } from './GithubIcon'; -import { TwitterIcon } from './TwitterIcon'; import { NpmIcon } from './NpmIcon'; +import { TwitterIcon } from './TwitterIcon'; import { YarnIcon } from './YarnIcon'; export default { title: 'x/DevIcons' }; diff --git a/packages/@mantinex/dev-icons/src/get-code-file-icon.tsx b/packages/@mantinex/dev-icons/src/get-code-file-icon.tsx index d5b19a402a2..1aae7b56d93 100644 --- a/packages/@mantinex/dev-icons/src/get-code-file-icon.tsx +++ b/packages/@mantinex/dev-icons/src/get-code-file-icon.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { TypeScriptIcon } from './TypeScriptIcon'; import { CssIcon } from './CssIcon'; +import { TypeScriptIcon } from './TypeScriptIcon'; export function getCodeFileIcon(fileName: string) { if (fileName.endsWith('.ts') || fileName.endsWith('.tsx')) { diff --git a/packages/@mantinex/dev-icons/src/types.ts b/packages/@mantinex/dev-icons/src/types.ts index 1de95e9aefe..ae4bda5bbf0 100644 --- a/packages/@mantinex/dev-icons/src/types.ts +++ b/packages/@mantinex/dev-icons/src/types.ts @@ -1,4 +1,4 @@ -import type { ElementProps, BoxProps } from '@mantine/core'; +import type { BoxProps, ElementProps } from '@mantine/core'; export interface DevIconProps extends BoxProps, ElementProps<'svg', 'display' | 'opacity'> { size?: number | string; diff --git a/packages/@mantinex/mantine-header/src/ColorSchemeControl.tsx b/packages/@mantinex/mantine-header/src/ColorSchemeControl.tsx index 1e55f923ba5..4b16466142d 100644 --- a/packages/@mantinex/mantine-header/src/ColorSchemeControl.tsx +++ b/packages/@mantinex/mantine-header/src/ColorSchemeControl.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { IconMoon, IconSun } from '@tabler/icons-react'; import cx from 'clsx'; -import { useMantineColorScheme, useComputedColorScheme } from '@mantine/core'; -import { IconSun, IconMoon } from '@tabler/icons-react'; +import { useComputedColorScheme, useMantineColorScheme } from '@mantine/core'; import { HeaderControl } from './HeaderControl'; import classes from './ColorSchemeControl.module.css'; diff --git a/packages/@mantinex/mantine-header/src/DirectionControl.tsx b/packages/@mantinex/mantine-header/src/DirectionControl.tsx index d5208e0f06a..231daf02bc5 100644 --- a/packages/@mantinex/mantine-header/src/DirectionControl.tsx +++ b/packages/@mantinex/mantine-header/src/DirectionControl.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { rem, useDirection } from '@mantine/core'; import { IconTextDirectionLtr, IconTextDirectionRtl } from '@tabler/icons-react'; +import { rem, useDirection } from '@mantine/core'; import { HeaderControl } from './HeaderControl'; export function DirectionControl() { diff --git a/packages/@mantinex/mantine-header/src/HeaderControl.tsx b/packages/@mantinex/mantine-header/src/HeaderControl.tsx index a6096e7f77f..17c054e6827 100644 --- a/packages/@mantinex/mantine-header/src/HeaderControl.tsx +++ b/packages/@mantinex/mantine-header/src/HeaderControl.tsx @@ -1,6 +1,6 @@ import React from 'react'; import cx from 'clsx'; -import { UnstyledButton, Tooltip, BoxProps, createPolymorphicComponent } from '@mantine/core'; +import { BoxProps, createPolymorphicComponent, Tooltip, UnstyledButton } from '@mantine/core'; import classes from './HeaderControl.module.css'; export interface HeaderControlProps extends BoxProps { diff --git a/packages/@mantinex/mantine-header/src/HeaderControls.tsx b/packages/@mantinex/mantine-header/src/HeaderControls.tsx index 190cf957c2b..54704195eb5 100644 --- a/packages/@mantinex/mantine-header/src/HeaderControls.tsx +++ b/packages/@mantinex/mantine-header/src/HeaderControls.tsx @@ -2,8 +2,8 @@ import React from 'react'; import { BoxProps, Group, Tooltip } from '@mantine/core'; import { ColorSchemeControl } from './ColorSchemeControl'; import { DirectionControl } from './DirectionControl'; -import { GithubControl } from './GithubControl'; import { DiscordControl } from './DiscordControl'; +import { GithubControl } from './GithubControl'; import { SearchControl } from './SearchControl'; interface HeaderControlsProps extends BoxProps { diff --git a/packages/@mantinex/mantine-header/src/SearchControl/SearchControl.tsx b/packages/@mantinex/mantine-header/src/SearchControl/SearchControl.tsx index 393a5e8cfa9..a00831c99c4 100644 --- a/packages/@mantinex/mantine-header/src/SearchControl/SearchControl.tsx +++ b/packages/@mantinex/mantine-header/src/SearchControl/SearchControl.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import cx from 'clsx'; import { IconSearch } from '@tabler/icons-react'; -import { UnstyledButton, Text, Group, BoxProps, ElementProps, rem } from '@mantine/core'; +import cx from 'clsx'; +import { BoxProps, ElementProps, Group, rem, Text, UnstyledButton } from '@mantine/core'; import classes from './SearchControl.module.css'; interface SearchControlProps extends BoxProps, ElementProps<'button'> {} diff --git a/packages/@mantinex/mantine-header/src/SearchMobileControl.tsx b/packages/@mantinex/mantine-header/src/SearchMobileControl.tsx index 0406b7908f4..c64898fecd9 100644 --- a/packages/@mantinex/mantine-header/src/SearchMobileControl.tsx +++ b/packages/@mantinex/mantine-header/src/SearchMobileControl.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { rem } from '@mantine/core'; import { IconSearch } from '@tabler/icons-react'; +import { rem } from '@mantine/core'; import { HeaderControl } from './HeaderControl'; interface SearchMobileControlProps { diff --git a/packages/@mantinex/mantine-logo/src/MantineLogo/MantineLogoText.tsx b/packages/@mantinex/mantine-logo/src/MantineLogo/MantineLogoText.tsx index 5bd01765a31..e20b92efb6d 100644 --- a/packages/@mantinex/mantine-logo/src/MantineLogo/MantineLogoText.tsx +++ b/packages/@mantinex/mantine-logo/src/MantineLogo/MantineLogoText.tsx @@ -1,7 +1,7 @@ import React from 'react'; import cx from 'clsx'; import { rem } from '@mantine/core'; -import { useMantineLogoColors, LogoProps } from './use-mantine-logo-colors'; +import { LogoProps, useMantineLogoColors } from './use-mantine-logo-colors'; import classes from './MantineLogo.module.css'; export function MantineLogoText({ diff --git a/packages/@mantinex/shiki/src/CodeHighlight.tsx b/packages/@mantinex/shiki/src/CodeHighlight.tsx index d2264195eea..43918892f6e 100644 --- a/packages/@mantinex/shiki/src/CodeHighlight.tsx +++ b/packages/@mantinex/shiki/src/CodeHighlight.tsx @@ -1,21 +1,21 @@ import React from 'react'; import { + ActionIcon, Box, BoxProps, - StylesApiProps, - factory, + CopyButton, ElementProps, + factory, + Factory, + ScrollArea, + StylesApiProps, + Tooltip, useProps, useStyles, - CopyButton, - Tooltip, - ActionIcon, - ScrollArea, - Factory, } from '@mantine/core'; -import { ShikiLanguage } from './types'; -import { useShiki } from './ShikiProvider'; import { CopyIcon } from './CopyIcon'; +import { useShiki } from './ShikiProvider'; +import { ShikiLanguage } from './types'; import classes from './Shiki.module.css'; export type CodeHighlightStylesNames = 'root' | 'code' | 'pre' | 'copy'; diff --git a/packages/@mantinex/shiki/src/CodeHighlightTabs.tsx b/packages/@mantinex/shiki/src/CodeHighlightTabs.tsx index 9ce4b945b64..5ad6ace805a 100644 --- a/packages/@mantinex/shiki/src/CodeHighlightTabs.tsx +++ b/packages/@mantinex/shiki/src/CodeHighlightTabs.tsx @@ -1,26 +1,26 @@ import React from 'react'; -import { useUncontrolled } from '@mantine/hooks'; import { + ActionIcon, Box, BoxProps, - StylesApiProps, - factory, - ElementProps, - useProps, - useStyles, CopyButton, - Tooltip, - ActionIcon, - UnstyledButton, - ScrollArea, createVarsResolver, - rem, + ElementProps, + factory, Factory, + rem, + ScrollArea, + StylesApiProps, + Tooltip, + UnstyledButton, + useProps, + useStyles, } from '@mantine/core'; -import { useShiki } from './ShikiProvider'; +import { useUncontrolled } from '@mantine/hooks'; import { CopyIcon } from './CopyIcon'; -import { FileIcon } from './FileIcon'; import { ExpandIcon } from './ExpandIcon'; +import { FileIcon } from './FileIcon'; +import { useShiki } from './ShikiProvider'; import { ShikiLanguage } from './types'; import classes from './Shiki.module.css'; diff --git a/packages/@mantinex/shiki/src/CopyIcon.tsx b/packages/@mantinex/shiki/src/CopyIcon.tsx index 599ccb85a59..b3faf677840 100644 --- a/packages/@mantinex/shiki/src/CopyIcon.tsx +++ b/packages/@mantinex/shiki/src/CopyIcon.tsx @@ -1,5 +1,5 @@ -import { rem } from '@mantine/core'; import React from 'react'; +import { rem } from '@mantine/core'; interface CopyIconProps extends React.ComponentPropsWithoutRef<'svg'> { copied: boolean; diff --git a/packages/@mantinex/shiki/src/ExpandIcon.tsx b/packages/@mantinex/shiki/src/ExpandIcon.tsx index 3e253c0732f..651b874e6f9 100644 --- a/packages/@mantinex/shiki/src/ExpandIcon.tsx +++ b/packages/@mantinex/shiki/src/ExpandIcon.tsx @@ -1,5 +1,5 @@ -import { rem } from '@mantine/core'; import React from 'react'; +import { rem } from '@mantine/core'; interface ExpandIconProps extends React.ComponentPropsWithoutRef<'svg'> { expanded: boolean; diff --git a/packages/@mantinex/shiki/src/Shiki.story.tsx b/packages/@mantinex/shiki/src/Shiki.story.tsx index fce161a772f..c5cc09602be 100644 --- a/packages/@mantinex/shiki/src/Shiki.story.tsx +++ b/packages/@mantinex/shiki/src/Shiki.story.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { CodeHighlightTabs } from './CodeHighlightTabs'; import { CodeHighlight } from './CodeHighlight'; +import { CodeHighlightTabs } from './CodeHighlightTabs'; export default { title: 'X/Shiki' }; diff --git a/packages/@mantinex/shiki/src/ShikiProvider.tsx b/packages/@mantinex/shiki/src/ShikiProvider.tsx index 2d948dbf89a..1b927ef3611 100644 --- a/packages/@mantinex/shiki/src/ShikiProvider.tsx +++ b/packages/@mantinex/shiki/src/ShikiProvider.tsx @@ -1,4 +1,4 @@ -import React, { createContext, useContext, useEffect, useState, useCallback } from 'react'; +import React, { createContext, useCallback, useContext, useEffect, useState } from 'react'; import type { HighlighterGeneric } from 'shikiji'; import { useComputedColorScheme } from '@mantine/core'; import { dark, light } from './themes'; diff --git a/scripts/build/build-all-packages.ts b/scripts/build/build-all-packages.ts index 988e89f4fab..88e30933a3f 100644 --- a/scripts/build/build-all-packages.ts +++ b/scripts/build/build-all-packages.ts @@ -1,9 +1,11 @@ +// prettier-ignore import chalk from 'chalk'; -import { buildPackage } from './build-package'; -import { getPackagesBuildOrder } from './get-packages-build-order'; + import { generateCSS } from './generate-css'; import { createLogger } from '../utils/signale'; +import { buildPackage } from './build-package'; import { getBuildTime } from './get-build-time'; +import { getPackagesBuildOrder } from './get-packages-build-order'; const logger = createLogger('build-all-packages'); diff --git a/scripts/build/build-package.ts b/scripts/build/build-package.ts index a6587c499a7..d0f23c6b19c 100644 --- a/scripts/build/build-package.ts +++ b/scripts/build/build-package.ts @@ -1,13 +1,13 @@ import path from 'node:path'; -import fs from 'fs-extra'; import chalk from 'chalk'; -import { createLogger } from '../utils/signale'; -import { locatePackage } from '../packages/locate-package'; +import fs from 'fs-extra'; import { getPackageName } from '../packages/get-package-name'; -import { createPackageConfig } from './rollup/create-package-config'; +import { locatePackage } from '../packages/locate-package'; +import { createLogger } from '../utils/signale'; import { compile } from './compile'; import { generateDts } from './generate-dts'; import { getBuildTime } from './get-build-time'; +import { createPackageConfig } from './rollup/create-package-config'; const logger = createLogger('build-package'); diff --git a/scripts/build/generate-css.ts b/scripts/build/generate-css.ts index 2fd4fef85e5..c9e68255d71 100644 --- a/scripts/build/generate-css.ts +++ b/scripts/build/generate-css.ts @@ -1,12 +1,12 @@ // Generates separate css files for each @mantine/core component -import postcssPresetMantine from 'postcss-preset-mantine'; -import postcss from 'postcss'; +import path from 'node:path'; import cssnano from 'cssnano'; -import postcssModules from 'postcss-modules'; import glob from 'fast-glob'; import fs from 'fs-extra'; -import path from 'node:path'; import { generateScopedName } from 'hash-css-selector'; +import postcss from 'postcss'; +import postcssModules from 'postcss-modules'; +import postcssPresetMantine from 'postcss-preset-mantine'; import { getPath } from '../utils/get-path'; function transformFileName(filePath: string) { diff --git a/scripts/build/generate-dts.ts b/scripts/build/generate-dts.ts index ef608729e04..46fae8be635 100644 --- a/scripts/build/generate-dts.ts +++ b/scripts/build/generate-dts.ts @@ -1,5 +1,5 @@ -import { execa } from 'execa'; import path from 'node:path'; +import { execa } from 'execa'; import fs from 'fs-extra'; export async function generateDts(packagePath: string) { diff --git a/scripts/build/index.ts b/scripts/build/index.ts index 3a3fa0f1a7e..c2e06f845f8 100644 --- a/scripts/build/index.ts +++ b/scripts/build/index.ts @@ -1,7 +1,7 @@ -import yargs from 'yargs/yargs'; import { hideBin } from 'yargs/helpers'; -import { buildPackage } from './build-package'; +import yargs from 'yargs/yargs'; import { buildAllPackages } from './build-all-packages'; +import { buildPackage } from './build-package'; const { argv } = yargs(hideBin(process.argv)) as any; diff --git a/scripts/build/rollup/create-package-config.ts b/scripts/build/rollup/create-package-config.ts index 91861542524..a571ad25c93 100644 --- a/scripts/build/rollup/create-package-config.ts +++ b/scripts/build/rollup/create-package-config.ts @@ -1,16 +1,16 @@ import path from 'node:path'; -import { RollupOptions } from 'rollup'; -import { nodeResolve } from '@rollup/plugin-node-resolve'; import alias, { Alias } from '@rollup/plugin-alias'; +import { nodeResolve } from '@rollup/plugin-node-resolve'; import replace from '@rollup/plugin-replace'; -import postcss from 'rollup-plugin-postcss'; +import { generateScopedName } from 'hash-css-selector'; +import { RollupOptions } from 'rollup'; import banner from 'rollup-plugin-banner2'; import esbuild from 'rollup-plugin-esbuild'; -import { generateScopedName } from 'hash-css-selector'; +import postcss from 'rollup-plugin-postcss'; import { getPackagesList } from '../../packages/get-packages-list'; import { getPath } from '../../utils/get-path'; -import { ROLLUP_EXTERNALS } from './rollup-externals'; import { ROLLUP_EXCLUDE_USE_CLIENT } from './rollup-exclude-use-client'; +import { ROLLUP_EXTERNALS } from './rollup-externals'; export async function createPackageConfig(packagePath: string): Promise { const packagesList = getPackagesList(); diff --git a/scripts/codegen/generate-examples-code.ts b/scripts/codegen/generate-examples-code.ts index c8f89da6e32..e75930f7f5e 100644 --- a/scripts/codegen/generate-examples-code.ts +++ b/scripts/codegen/generate-examples-code.ts @@ -1,5 +1,5 @@ -import fs from 'fs-extra'; import path from 'node:path'; +import fs from 'fs-extra'; import { removeReactImport } from './remove-react-import'; export function generateExamplesCode(examplesFolder: string) { diff --git a/scripts/codegen/index.ts b/scripts/codegen/index.ts index d557b784d9d..cc86251a4cf 100644 --- a/scripts/codegen/index.ts +++ b/scripts/codegen/index.ts @@ -1,5 +1,5 @@ -import { generateExamplesCode } from './generate-examples-code'; import { getPath } from '../utils/get-path'; +import { generateExamplesCode } from './generate-examples-code'; generateExamplesCode(getPath('docs/src/combobox-examples/examples')); generateExamplesCode(getPath('docs/src/app-shell-examples/examples')); diff --git a/scripts/docgen/docgen-paths.ts b/scripts/docgen/docgen-paths.ts index a04f26b3eae..ba92751493b 100644 --- a/scripts/docgen/docgen-paths.ts +++ b/scripts/docgen/docgen-paths.ts @@ -1,5 +1,5 @@ -import { getDeclarationsPaths } from './get-declarations-paths'; import { getPath, getPaths } from '../utils/get-path'; +import { getDeclarationsPaths } from './get-declarations-paths'; const FILES_PATHS = getPaths([ // Input diff --git a/scripts/docgen/index.ts b/scripts/docgen/index.ts index 20fa384cbc4..98d0affb01f 100644 --- a/scripts/docgen/index.ts +++ b/scripts/docgen/index.ts @@ -1,6 +1,6 @@ import { generateDeclarations } from 'mantine-docgen-script'; -import { DOCGEN_PATHS } from './docgen-paths'; import { getPath } from '../utils/get-path'; +import { DOCGEN_PATHS } from './docgen-paths'; generateDeclarations({ tsConfigPath: getPath('tsconfig.json'), diff --git a/scripts/docs/changelog.ts b/scripts/docs/changelog.ts index 85162da9bca..fa7f6f6a9f3 100644 --- a/scripts/docs/changelog.ts +++ b/scripts/docs/changelog.ts @@ -1,5 +1,5 @@ -import simpleGit from 'simple-git'; import chalk from 'chalk'; +import simpleGit from 'simple-git'; import packageJson from '../../package.json'; const git = simpleGit(); diff --git a/scripts/docs/deploy-alpha.ts b/scripts/docs/deploy-alpha.ts index 5380aec9e83..6556acd0c3a 100644 --- a/scripts/docs/deploy-alpha.ts +++ b/scripts/docs/deploy-alpha.ts @@ -1,7 +1,7 @@ -import ghPages from 'gh-pages'; import chalk from 'chalk'; -import { createLogger } from '../utils/signale'; +import ghPages from 'gh-pages'; import { getPath } from '../utils/get-path'; +import { createLogger } from '../utils/signale'; const logger = createLogger('deploy-alpha'); diff --git a/scripts/packages/locate-package.ts b/scripts/packages/locate-package.ts index 785dc07a341..bc5f66379ca 100644 --- a/scripts/packages/locate-package.ts +++ b/scripts/packages/locate-package.ts @@ -1,7 +1,7 @@ import path from 'node:path'; import fs from 'fs-extra'; -import { getPackageName } from './get-package-name'; import { getPath } from '../utils/get-path'; +import { getPackageName } from './get-package-name'; export async function locatePackage(packageName: string) { const packagePath = path.join(getPath('packages'), getPackageName(packageName)); diff --git a/scripts/plop/index.ts b/scripts/plop/index.ts index 95308315055..b2b06ab8d23 100644 --- a/scripts/plop/index.ts +++ b/scripts/plop/index.ts @@ -1,10 +1,10 @@ -import fs from 'fs-extra'; import path from 'node:path'; -import { argv } from 'yargs'; import chalk from 'chalk'; import { execa } from 'execa'; -import { createLogger } from '../utils/signale'; +import fs from 'fs-extra'; +import { argv } from 'yargs'; import { getPath } from '../utils/get-path'; +import { createLogger } from '../utils/signale'; const logger = createLogger('plop'); diff --git a/scripts/publish/index.ts b/scripts/publish/index.ts index 38a80901800..d842f207ed6 100644 --- a/scripts/publish/index.ts +++ b/scripts/publish/index.ts @@ -1,15 +1,15 @@ -import fs from 'fs-extra'; import path from 'node:path'; -import yargs from 'yargs/yargs'; -import { hideBin } from 'yargs/helpers'; -import simpleGit from 'simple-git'; import chalk from 'chalk'; +import fs from 'fs-extra'; +import simpleGit from 'simple-git'; import { PackageJson } from 'type-fest'; import { getNextVersion } from 'version-next'; +import { hideBin } from 'yargs/helpers'; +import yargs from 'yargs/yargs'; import { buildPackage } from '../build/build-package'; -import { createLogger } from '../utils/signale'; -import { locatePackage } from '../packages/locate-package'; import { getPackageName } from '../packages/get-package-name'; +import { locatePackage } from '../packages/locate-package'; +import { createLogger } from '../utils/signale'; import { publishPackage } from './publish-package'; const git = simpleGit(); diff --git a/scripts/release/index.ts b/scripts/release/index.ts index c9f7d6e1d0f..e0137d0164e 100644 --- a/scripts/release/index.ts +++ b/scripts/release/index.ts @@ -1,17 +1,17 @@ import chalk from 'chalk'; +import { execa } from 'execa'; import simpleGit from 'simple-git'; -import yargs from 'yargs/yargs'; -import { hideBin } from 'yargs/helpers'; import { getNextVersion } from 'version-next'; -import { execa } from 'execa'; -import { createLogger } from '../utils/signale'; +import { hideBin } from 'yargs/helpers'; +import yargs from 'yargs/yargs'; +import packageJson from '../../package.json'; import { buildAllPackages } from '../build/build-all-packages'; import { getMantinePackagesList } from '../packages/get-packages-list'; -import { getPath } from '../utils/get-path'; import { publishPackage } from '../publish/publish-package'; -import { setMantinePackagesVersion } from './set-mantine-packages-version'; +import { getPath } from '../utils/get-path'; +import { createLogger } from '../utils/signale'; import { openGithubRelease } from './open-github-release'; -import packageJson from '../../package.json'; +import { setMantinePackagesVersion } from './set-mantine-packages-version'; const logger = createLogger('release'); const git = simpleGit(); diff --git a/scripts/release/open-github-release.ts b/scripts/release/open-github-release.ts index d2d8006dfed..871e532e58c 100644 --- a/scripts/release/open-github-release.ts +++ b/scripts/release/open-github-release.ts @@ -1,5 +1,5 @@ -import open from 'open'; import githubRelease from 'new-github-release-url'; +import open from 'open'; export function openGithubRelease(version: string) { open( diff --git a/scripts/tests/conflicts.ts b/scripts/tests/conflicts.ts index 82fa12e0ffe..f77b335ba80 100644 --- a/scripts/tests/conflicts.ts +++ b/scripts/tests/conflicts.ts @@ -1,7 +1,7 @@ // Validates that there are no git conflicts in package.json files import fs from 'fs-extra'; -import { createLogger } from '../utils/signale'; import { getPackagesBuildOrder } from '../build/get-packages-build-order'; +import { createLogger } from '../utils/signale'; const logger = createLogger('check-conflicts'); diff --git a/scripts/tests/exports.ts b/scripts/tests/exports.ts index 6b7dea20f9e..b8b3ea6437f 100644 --- a/scripts/tests/exports.ts +++ b/scripts/tests/exports.ts @@ -1,6 +1,6 @@ // Validates that all files specified in package.json are in place -import fs from 'fs-extra'; import path from 'node:path'; +import fs from 'fs-extra'; import { getPackagesBuildOrder } from '../build/get-packages-build-order'; import { createLogger } from '../utils/signale'; diff --git a/scripts/tests/validate-package-json.ts b/scripts/tests/validate-package-json.ts index baa79f76700..1578d1bf725 100644 --- a/scripts/tests/validate-package-json.ts +++ b/scripts/tests/validate-package-json.ts @@ -1,7 +1,7 @@ // Validates all package.json files have all the required properties import { PackageJson } from 'type-fest'; -import { createLogger } from '../utils/signale'; import { getPackagesBuildOrder } from '../build/get-packages-build-order'; +import { createLogger } from '../utils/signale'; const logger = createLogger('validate-package-json'); diff --git a/scripts/tests/validate-packages-files.ts b/scripts/tests/validate-packages-files.ts index d37c4707efd..a18b9225f79 100644 --- a/scripts/tests/validate-packages-files.ts +++ b/scripts/tests/validate-packages-files.ts @@ -1,8 +1,8 @@ // Validates that all packages have the same files structure -import fs from 'fs-extra'; import path from 'node:path'; -import { createLogger } from '../utils/signale'; +import fs from 'fs-extra'; import { getPackagesBuildOrder } from '../build/get-packages-build-order'; +import { createLogger } from '../utils/signale'; const logger = createLogger('validate-packages-files'); diff --git a/yarn.lock b/yarn.lock index fd5d6f69b80..383b3565b09 100644 --- a/yarn.lock +++ b/yarn.lock @@ -86,6 +86,16 @@ __metadata: languageName: node linkType: hard +"@babel/code-frame@npm:^7.23.5": + version: 7.23.5 + resolution: "@babel/code-frame@npm:7.23.5" + dependencies: + "@babel/highlight": "npm:^7.23.4" + chalk: "npm:^2.4.2" + checksum: a10e843595ddd9f97faa99917414813c06214f4d9205294013e20c70fbdf4f943760da37dec1d998bf3e6fc20fa2918a47c0e987a7e458663feb7698063ad7c6 + languageName: node + linkType: hard + "@babel/compat-data@npm:^7.14.4": version: 7.14.4 resolution: "@babel/compat-data@npm:7.14.4" @@ -183,6 +193,29 @@ __metadata: languageName: node linkType: hard +"@babel/core@npm:^7.21.8": + version: 7.23.5 + resolution: "@babel/core@npm:7.23.5" + dependencies: + "@ampproject/remapping": "npm:^2.2.0" + "@babel/code-frame": "npm:^7.23.5" + "@babel/generator": "npm:^7.23.5" + "@babel/helper-compilation-targets": "npm:^7.22.15" + "@babel/helper-module-transforms": "npm:^7.23.3" + "@babel/helpers": "npm:^7.23.5" + "@babel/parser": "npm:^7.23.5" + "@babel/template": "npm:^7.22.15" + "@babel/traverse": "npm:^7.23.5" + "@babel/types": "npm:^7.23.5" + convert-source-map: "npm:^2.0.0" + debug: "npm:^4.1.0" + gensync: "npm:^1.0.0-beta.2" + json5: "npm:^2.2.3" + semver: "npm:^6.3.1" + checksum: 311a512a870ee330a3f9a7ea89e5df790b2b5af0b1bd98b10b4edc0de2ac440f0df4d69ea2c0ee38a4b89041b9a495802741d93603be7d4fd834ec8bb6970bd2 + languageName: node + linkType: hard + "@babel/core@npm:^7.22.0, @babel/core@npm:^7.23.3": version: 7.23.3 resolution: "@babel/core@npm:7.23.3" @@ -229,6 +262,18 @@ __metadata: languageName: node linkType: hard +"@babel/generator@npm:^7.21.5, @babel/generator@npm:^7.23.5": + version: 7.23.5 + resolution: "@babel/generator@npm:7.23.5" + dependencies: + "@babel/types": "npm:^7.23.5" + "@jridgewell/gen-mapping": "npm:^0.3.2" + "@jridgewell/trace-mapping": "npm:^0.3.17" + jsesc: "npm:^2.5.1" + checksum: 14c6e874f796c4368e919bed6003bb0adc3ce837760b08f9e646d20aeb5ae7d309723ce6e4f06bcb4a2b5753145446c8e4425851380f695e40e71e1760f49e7b + languageName: node + linkType: hard + "@babel/generator@npm:^7.22.7, @babel/generator@npm:^7.22.9": version: 7.22.9 resolution: "@babel/generator@npm:7.22.9" @@ -825,6 +870,13 @@ __metadata: languageName: node linkType: hard +"@babel/helper-string-parser@npm:^7.23.4": + version: 7.23.4 + resolution: "@babel/helper-string-parser@npm:7.23.4" + checksum: f348d5637ad70b6b54b026d6544bd9040f78d24e7ec245a0fc42293968181f6ae9879c22d89744730d246ce8ec53588f716f102addd4df8bbc79b73ea10004ac + languageName: node + linkType: hard + "@babel/helper-validator-identifier@npm:^7.14.0": version: 7.14.0 resolution: "@babel/helper-validator-identifier@npm:7.14.0" @@ -936,6 +988,17 @@ __metadata: languageName: node linkType: hard +"@babel/helpers@npm:^7.23.5": + version: 7.23.5 + resolution: "@babel/helpers@npm:7.23.5" + dependencies: + "@babel/template": "npm:^7.22.15" + "@babel/traverse": "npm:^7.23.5" + "@babel/types": "npm:^7.23.5" + checksum: a37e2728eb4378a4888e5d614e28de7dd79b55ac8acbecd0e5c761273e2a02a8f33b34b1932d9069db55417ace2937cbf8ec37c42f1030ce6d228857d7ccaa4f + languageName: node + linkType: hard + "@babel/highlight@npm:^7.12.13": version: 7.14.0 resolution: "@babel/highlight@npm:7.14.0" @@ -991,6 +1054,17 @@ __metadata: languageName: node linkType: hard +"@babel/highlight@npm:^7.23.4": + version: 7.23.4 + resolution: "@babel/highlight@npm:7.23.4" + dependencies: + "@babel/helper-validator-identifier": "npm:^7.22.20" + chalk: "npm:^2.4.2" + js-tokens: "npm:^4.0.0" + checksum: fbff9fcb2f5539289c3c097d130e852afd10d89a3a08ac0b5ebebbc055cc84a4bcc3dcfed463d488cde12dd0902ef1858279e31d7349b2e8cee43913744bda33 + languageName: node + linkType: hard + "@babel/parser@npm:^7.1.0, @babel/parser@npm:^7.12.13, @babel/parser@npm:^7.14.2, @babel/parser@npm:^7.14.3": version: 7.14.4 resolution: "@babel/parser@npm:7.14.4" @@ -1027,6 +1101,15 @@ __metadata: languageName: node linkType: hard +"@babel/parser@npm:^7.21.8, @babel/parser@npm:^7.23.5": + version: 7.23.5 + resolution: "@babel/parser@npm:7.23.5" + bin: + parser: ./bin/babel-parser.js + checksum: 3356aa90d7bafb4e2c7310e7c2c3d443c4be4db74913f088d3d577a1eb914ea4188e05fd50a47ce907a27b755c4400c4e3cbeee73dbeb37761f6ca85954f5a20 + languageName: node + linkType: hard + "@babel/parser@npm:^7.23.3": version: 7.23.3 resolution: "@babel/parser@npm:7.23.3" @@ -3191,6 +3274,24 @@ __metadata: languageName: node linkType: hard +"@babel/traverse@npm:^7.21.5, @babel/traverse@npm:^7.23.5": + version: 7.23.5 + resolution: "@babel/traverse@npm:7.23.5" + dependencies: + "@babel/code-frame": "npm:^7.23.5" + "@babel/generator": "npm:^7.23.5" + "@babel/helper-environment-visitor": "npm:^7.22.20" + "@babel/helper-function-name": "npm:^7.23.0" + "@babel/helper-hoist-variables": "npm:^7.22.5" + "@babel/helper-split-export-declaration": "npm:^7.22.6" + "@babel/parser": "npm:^7.23.5" + "@babel/types": "npm:^7.23.5" + debug: "npm:^4.1.0" + globals: "npm:^11.1.0" + checksum: c5ea793080ca6719b0a1612198fd25e361cee1f3c14142d7a518d2a1eeb5c1d21f7eec1b26c20ea6e1ddd8ed12ab50b960ff95ffd25be353b6b46e1b54d6f825 + languageName: node + linkType: hard + "@babel/traverse@npm:^7.22.6, @babel/traverse@npm:^7.22.8": version: 7.22.8 resolution: "@babel/traverse@npm:7.22.8" @@ -3276,6 +3377,17 @@ __metadata: languageName: node linkType: hard +"@babel/types@npm:^7.21.5, @babel/types@npm:^7.23.5": + version: 7.23.5 + resolution: "@babel/types@npm:7.23.5" + dependencies: + "@babel/helper-string-parser": "npm:^7.23.4" + "@babel/helper-validator-identifier": "npm:^7.22.20" + to-fast-properties: "npm:^2.0.0" + checksum: 7dd5e2f59828ed046ad0b06b039df2524a8b728d204affb4fc08da2502b9dd3140b1356b5166515d229dc811539a8b70dcd4bc507e06d62a89f4091a38d0b0fb + languageName: node + linkType: hard + "@babel/types@npm:^7.22.15, @babel/types@npm:^7.22.19, @babel/types@npm:^7.23.0": version: 7.23.0 resolution: "@babel/types@npm:7.23.0" @@ -3980,6 +4092,26 @@ __metadata: languageName: node linkType: hard +"@ianvs/prettier-plugin-sort-imports@npm:^4.1.1": + version: 4.1.1 + resolution: "@ianvs/prettier-plugin-sort-imports@npm:4.1.1" + dependencies: + "@babel/core": "npm:^7.21.8" + "@babel/generator": "npm:^7.21.5" + "@babel/parser": "npm:^7.21.8" + "@babel/traverse": "npm:^7.21.5" + "@babel/types": "npm:^7.21.5" + semver: "npm:^7.5.2" + peerDependencies: + "@vue/compiler-sfc": ">=3.0.0" + prettier: 2 || 3 + peerDependenciesMeta: + "@vue/compiler-sfc": + optional: true + checksum: 3e630d2d8d0ef6ba5f19d5a8edd4053e154656e5c54dec7d7dc9c012bf389ddfce3b9c038a46634b66be21679dbfa3048e0df0fa5ba6fb0462fdff625a5247ec + languageName: node + linkType: hard + "@isaacs/cliui@npm:^8.0.2": version: 8.0.2 resolution: "@isaacs/cliui@npm:8.0.2" @@ -16760,6 +16892,7 @@ __metadata: "@babel/preset-typescript": "npm:^7.23.3" "@floating-ui/react": "npm:^0.24.8" "@hello-pangea/dnd": "npm:^16.3.0" + "@ianvs/prettier-plugin-sort-imports": "npm:^4.1.1" "@rollup/plugin-alias": "npm:^5.0.1" "@rollup/plugin-node-resolve": "npm:^15.2.3" "@rollup/plugin-replace": "npm:^5.0.5" @@ -21556,7 +21689,7 @@ __metadata: languageName: node linkType: hard -"semver@npm:7.5.4, semver@npm:^7.0.0, semver@npm:^7.3.7, semver@npm:^7.3.8, semver@npm:^7.5.3, semver@npm:^7.5.4": +"semver@npm:7.5.4, semver@npm:^7.0.0, semver@npm:^7.3.7, semver@npm:^7.3.8, semver@npm:^7.5.2, semver@npm:^7.5.3, semver@npm:^7.5.4": version: 7.5.4 resolution: "semver@npm:7.5.4" dependencies: