@pnx-mixtape/mxds 0.0.13 → 0.0.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +37 -23
- package/dist/build/accordion.css +1 -98
- package/dist/build/accordion.entry.js +1 -83
- package/dist/build/base.css +1 -996
- package/dist/build/breadcrumb.css +1 -51
- package/dist/build/button.css +1 -132
- package/dist/build/callout.css +1 -11
- package/dist/build/card.css +1 -149
- package/dist/build/carousel.css +1 -0
- package/dist/build/chunks/Accordion-RtUfbsTy.js +1 -0
- package/dist/build/chunks/disclosure-widget-CPdkUWkq.js +1 -0
- package/dist/build/chunks/drop-menu.entry-BqBzLfVC.js +1 -0
- package/dist/build/chunks/keyboard-Cs0cduxq.js +1 -0
- package/dist/build/chunks/polyfills-5KNOJw2W.js +1 -0
- package/dist/build/chunks/popover-CiVl-0jk.js +1 -0
- package/dist/build/chunks/utilities-CE6xwgqF.js +2 -0
- package/dist/build/constants.css +1 -120
- package/dist/build/container-grid.css +1 -208
- package/dist/build/content-block.css +1 -36
- package/dist/build/dialog.css +1 -98
- package/dist/build/dialog.entry.js +1 -113
- package/dist/build/drop-menu.css +1 -78
- package/dist/build/drop-menu.entry.js +1 -2
- package/dist/build/drupal.css +1 -74
- package/dist/build/filters.css +1 -105
- package/dist/build/filters.entry.js +1 -137
- package/dist/build/footer.css +1 -151
- package/dist/build/form.css +1 -517
- package/dist/build/global-alert.css +1 -60
- package/dist/build/global-alert.entry.js +1 -68
- package/dist/build/grid.css +1 -200
- package/dist/build/header.css +1 -153
- package/dist/build/header.entry.js +1 -103
- package/dist/build/hero-banner.css +1 -62
- package/dist/build/icon.css +1 -399
- package/dist/build/in-page-alert.css +1 -94
- package/dist/build/in-page-navigation.css +1 -17
- package/dist/build/in-page-navigation.entry.js +1 -99
- package/dist/build/link-list.css +1 -45
- package/dist/build/list-item.css +1 -114
- package/dist/build/masthead.css +1 -53
- package/dist/build/navigation.css +1 -396
- package/dist/build/navigation.entry.js +1 -124
- package/dist/build/page.css +1 -80
- package/dist/build/pagination.css +1 -130
- package/dist/build/results-bar.css +1 -0
- package/dist/build/section.css +1 -163
- package/dist/build/side-navigation.css +1 -88
- package/dist/build/sidebar.css +1 -59
- package/dist/build/social-links.css +1 -20
- package/dist/build/steps.css +1 -118
- package/dist/build/sticky.css +1 -47
- package/dist/build/sticky.entry.js +1 -60
- package/dist/build/tabs.css +1 -109
- package/dist/build/tabs.entry.js +1 -202
- package/dist/build/tag.css +1 -71
- package/dist/build/utilities.css +1 -178
- package/package.json +56 -64
- package/src/Atom/Background/Backgrounds.stories.ts +13 -1
- package/src/Atom/Background/__snapshots__/Backgrounds.stories.ts.snap +157 -81
- package/src/Atom/Background/_background.css +16 -10
- package/src/Atom/Base.mdx +25 -17
- package/src/Atom/Button/Button.stories.ts +1 -4
- package/src/Atom/Button/Button.stories.tsx +1 -1
- package/src/Atom/Button/__snapshots__/Button.stories.ts.snap +47 -37
- package/src/Atom/Button/_buttons-styles.css +7 -7
- package/src/Atom/Button/_buttons.css +1 -6
- package/src/Atom/DefinitionList/DefinitionList.stories.ts +32 -0
- package/src/Atom/DefinitionList/DefinitionList.stories.tsx +1 -1
- package/src/Atom/DefinitionList/__snapshots__/DefinitionList.stories.ts.snap +32 -0
- package/src/Atom/DefinitionList/definition-list.twig +9 -0
- package/src/Atom/Heading/Heading.stories.ts +1 -1
- package/src/Atom/Heading/Heading.stories.tsx +1 -1
- package/src/Atom/Heading/__snapshots__/Heading.stories.ts.snap +5 -3
- package/src/Atom/Heading/_headings.css +24 -24
- package/src/Atom/Icon/Icon.mdx +1 -1
- package/src/Atom/Icon/Icon.stories.ts +1 -1
- package/src/Atom/Icon/Icon.stories.tsx +1 -1
- package/src/Atom/Icon/Icon.tsx +2 -2
- package/src/Atom/Icon/__snapshots__/Icon.stories.ts.snap +14 -8
- package/src/Atom/Icon/_icon.css +4 -4
- package/src/Atom/Image/Image.stories.ts +1 -1
- package/src/Atom/Image/__snapshots__/Image.stories.ts.snap +7 -5
- package/src/Atom/Image/_image.css +2 -7
- package/src/Atom/Link/Link.stories.ts +1 -1
- package/src/Atom/Link/Link.stories.tsx +1 -1
- package/src/Atom/Link/__snapshots__/Link.stories.ts.snap +50 -37
- package/src/Atom/Link/_links.css +2 -22
- package/src/Atom/Link/link.twig +1 -0
- package/src/Atom/Media/Media.stories.ts +2 -1
- package/src/Atom/Media/Media.stories.tsx +1 -1
- package/src/Atom/Media/__snapshots__/Media.stories.ts.snap +11 -24
- package/src/Atom/Media/_media.css +8 -8
- package/src/Atom/Spacing/Spacing.stories.ts +1 -1
- package/src/Atom/Spacing/__snapshots__/Spacing.stories.ts.snap +5 -3
- package/src/Atom/Table/Table.stories.ts +1 -1
- package/src/Atom/Table/TableResponsive.stories.ts +1 -1
- package/src/Atom/Table/__snapshots__/Table.stories.ts.snap +256 -248
- package/src/Atom/Table/__snapshots__/TableResponsive.stories.ts.snap +65 -63
- package/src/Atom/Text/Text.stories.tsx +1 -1
- package/src/Atom/Text/TextSizes.stories.ts +1 -1
- package/src/Atom/Text/__snapshots__/TextSizes.stories.ts.snap +59 -55
- package/src/Atom/Text/_text-sizes.css +17 -17
- package/src/Atom/Text/rich-text.twig +9 -0
- package/src/Atom/Video/Video.stories.ts +1 -1
- package/src/Atom/Video/__snapshots__/Video.stories.ts.snap +9 -7
- package/src/Atom/_animated.css +0 -14
- package/src/Atom/_generic.css +57 -15
- package/src/Atom/base.css +1 -1
- package/src/Component/Accordion/Accordion.stories.ts +1 -4
- package/src/Component/Accordion/Accordion.stories.tsx +1 -2
- package/src/Component/Accordion/__snapshots__/Accordion.stories.ts.snap +60 -56
- package/src/Component/Accordion/__snapshots__/Accordion.stories.tsx.snap +0 -1
- package/src/Component/Accordion/accordion.css +16 -4
- package/src/Component/Breadcrumb/Breadcrumb.stories.ts +1 -1
- package/src/Component/Breadcrumb/Breadcrumb.stories.tsx +1 -1
- package/src/Component/Breadcrumb/__snapshots__/Breadcrumb.stories.ts.snap +31 -29
- package/src/Component/Breadcrumb/breadcrumb.css +4 -0
- package/src/Component/Callout/Callout.stories.ts +1 -9
- package/src/Component/Callout/__snapshots__/Callout.stories.ts.snap +9 -7
- package/src/Component/Card/Card.stories.ts +11 -18
- package/src/Component/Card/Card.stories.tsx +1 -1
- package/src/Component/Card/Card.tsx +9 -5
- package/src/Component/Card/__snapshots__/Card.stories.ts.snap +257 -229
- package/src/Component/Card/card.css +36 -33
- package/src/Component/Card/card.twig +6 -6
- package/src/Component/Carousel/Carousel.stories.ts +201 -0
- package/src/Component/Carousel/Elements/Carousel.ts +241 -0
- package/src/Component/Carousel/__snapshots__/Carousel.stories.ts.snap +912 -0
- package/src/Component/Carousel/carousel.css +119 -0
- package/src/Component/Carousel/carousel.twig +27 -0
- package/src/Component/ContentBlock/ContentBlock.stories.ts +27 -19
- package/src/Component/ContentBlock/ContentBlock.stories.tsx +1 -1
- package/src/Component/ContentBlock/__snapshots__/ContentBlock.stories.ts.snap +153 -93
- package/src/Component/Dialog/Dialog.stories.ts +75 -7
- package/src/Component/Dialog/Dialog.stories.tsx +1 -1
- package/src/Component/Dialog/Elements/Dialog.ts +14 -34
- package/src/Component/Dialog/__snapshots__/Dialog.stories.ts.snap +102 -66
- package/src/Component/Dialog/dialog.css +32 -20
- package/src/Component/Dialog/dialog.twig +14 -15
- package/src/Component/DropMenu/Components/DropMenuContext.tsx +7 -9
- package/src/Component/DropMenu/Components/DropMenuItem.tsx +1 -1
- package/src/Component/DropMenu/DropMenu.stories.ts +1 -1
- package/src/Component/DropMenu/DropMenu.stories.tsx +1 -1
- package/src/Component/DropMenu/Elements/DropMenu.ts +1 -1
- package/src/Component/DropMenu/__snapshots__/DropMenu.stories.ts.snap +28 -26
- package/src/Component/DropMenu/drop-menu.css +11 -3
- package/src/Component/Filters/Filters.stories.ts +1 -4
- package/src/Component/Filters/__snapshots__/Filters.stories.ts.snap +397 -389
- package/src/Component/Filters/filters.css +14 -5
- package/src/Component/GlobalAlert/GlobalAlert.stories.ts +1 -1
- package/src/Component/GlobalAlert/GlobalAlert.stories.tsx +1 -1
- package/src/Component/GlobalAlert/__snapshots__/GlobalAlert.stories.ts.snap +33 -29
- package/src/Component/GlobalAlert/__snapshots__/GlobalAlert.stories.tsx.snap +2 -2
- package/src/Component/GlobalAlert/global-alert.css +2 -2
- package/src/Component/HeroBanner/HeroBanner.stories.ts +1 -4
- package/src/Component/HeroBanner/HeroBanner.stories.tsx +1 -1
- package/src/Component/HeroBanner/__snapshots__/HeroBanner.stories.ts.snap +68 -64
- package/src/Component/HeroBanner/hero-banner.css +6 -1
- package/src/Component/HeroBanner/hero-banner.twig +3 -4
- package/src/Component/InPageAlert/InPageAlert.stories.ts +1 -1
- package/src/Component/InPageAlert/InPageAlert.stories.tsx +1 -1
- package/src/Component/InPageAlert/__snapshots__/InPageAlert.stories.ts.snap +10 -8
- package/src/Component/InPageAlert/in-page-alert.css +8 -8
- package/src/Component/InPageNavigation/Elements/InPageNavigation.ts +1 -1
- package/src/Component/InPageNavigation/InPageNavigation.stories.ts +1 -4
- package/src/Component/InPageNavigation/InPageNavigation.stories.tsx +1 -1
- package/src/Component/InPageNavigation/__snapshots__/InPageNavigation.stories.ts.snap +64 -62
- package/src/Component/LinkList/LinkList.stories.ts +1 -1
- package/src/Component/LinkList/LinkList.stories.tsx +1 -1
- package/src/Component/LinkList/__snapshots__/LinkList.stories.ts.snap +31 -29
- package/src/Component/ListItem/ListItem.stories.ts +2 -4
- package/src/Component/ListItem/ListItem.stories.tsx +1 -1
- package/src/Component/ListItem/__snapshots__/ListItem.stories.ts.snap +162 -148
- package/src/Component/ListItem/list-item.css +7 -88
- package/src/Component/ListItem/list-item.twig +8 -8
- package/src/Component/Navigation/Dropdown.stories.tsx +1 -1
- package/src/Component/Navigation/Navigation.stories.ts +1 -1
- package/src/Component/Navigation/Navigation.stories.tsx +1 -1
- package/src/Component/Navigation/__snapshots__/Navigation.stories.ts.snap +291 -283
- package/src/Component/Navigation/_navigation-collapsible.css +11 -14
- package/src/Component/Navigation/_navigation-dropdown.css +11 -17
- package/src/Component/Pagination/Components/PaginationContext.tsx +4 -8
- package/src/Component/Pagination/Pagination.stories.ts +1 -1
- package/src/Component/Pagination/Pagination.stories.tsx +1 -1
- package/src/Component/Pagination/__snapshots__/Pagination.stories.ts.snap +59 -57
- package/src/Component/Pagination/pagination.css +2 -8
- package/src/Component/ResultsBar/Components/ResultsBarInfo.tsx +28 -0
- package/src/Component/ResultsBar/Components/ResultsBarSort.tsx +17 -0
- package/src/Component/ResultsBar/ResultsBar.stories.ts +37 -0
- package/src/Component/ResultsBar/ResultsBar.stories.tsx +50 -0
- package/src/Component/ResultsBar/ResultsBar.tsx +7 -0
- package/src/Component/ResultsBar/__snapshots__/ResultsBar.stories.ts.snap +54 -0
- package/src/Component/ResultsBar/__snapshots__/ResultsBar.stories.tsx.snap +53 -0
- package/src/Component/ResultsBar/results-bar.css +19 -0
- package/src/Component/ResultsBar/results-bar.twig +24 -0
- package/src/Component/SideNavigation/SideNavigation.stories.ts +1 -1
- package/src/Component/SideNavigation/__snapshots__/SideNavigation.stories.ts.snap +82 -80
- package/src/Component/SideNavigation/side-navigation.css +2 -8
- package/src/Component/SocialLinks/SocialLinks.stories.ts +1 -1
- package/src/Component/SocialLinks/__snapshots__/SocialLinks.stories.ts.snap +30 -28
- package/src/Component/Steps/Steps.stories.ts +1 -1
- package/src/Component/Steps/__snapshots__/Steps.stories.ts.snap +86 -78
- package/src/Component/Steps/steps.css +1 -1
- package/src/Component/Sticky/Sticky.stories.ts +1 -1
- package/src/Component/Sticky/Sticky.stories.tsx +1 -1
- package/src/Component/Sticky/__snapshots__/Sticky.stories.ts.snap +9 -7
- package/src/Component/Tabs/Tabs.stories.ts +1 -1
- package/src/Component/Tabs/Tabs.stories.tsx +1 -1
- package/src/Component/Tabs/Tabs.tsx +4 -4
- package/src/Component/Tabs/__snapshots__/Tabs.stories.ts.snap +73 -71
- package/src/Component/Tabs/__snapshots__/Tabs.stories.tsx.snap +0 -2
- package/src/Component/Tabs/tabs.css +14 -21
- package/src/Component/Tag/Tag.stories.ts +1 -1
- package/src/Component/Tag/Tag.stories.tsx +1 -1
- package/src/Component/Tag/__snapshots__/Tag.stories.ts.snap +59 -53
- package/src/Component/Tag/tag.css +6 -6
- package/src/Component/Tile/Tile.stories.ts +38 -12
- package/src/Component/Tile/Tile.stories.tsx +2 -2
- package/src/Component/Tile/Tile.tsx +30 -17
- package/src/Component/Tile/__snapshots__/Tile.stories.ts.snap +49 -75
- package/src/Component/Tile/__snapshots__/Tile.stories.tsx.snap +6 -16
- package/src/Form/Checkbox/Checkbox.stories.ts +1 -1
- package/src/Form/Checkbox/FormCheckbox.stories.tsx +1 -1
- package/src/Form/Checkbox/FormCheckbox.tsx +5 -7
- package/src/Form/Checkbox/__snapshots__/Checkbox.stories.ts.snap +23 -19
- package/src/Form/Description/Description.stories.ts +1 -1
- package/src/Form/Description/FormDescription.stories.tsx +1 -1
- package/src/Form/Description/FormStatus.stories.ts +1 -1
- package/src/Form/Description/__snapshots__/Description.stories.ts.snap +7 -5
- package/src/Form/Description/__snapshots__/FormStatus.stories.ts.snap +14 -10
- package/src/Form/Form/Form.stories.tsx +1 -1
- package/src/Form/Form/FormTitle.stories.tsx +1 -1
- package/src/Form/FormItem/FormItem.stories.ts +1 -4
- package/src/Form/FormItem/FormItem.stories.tsx +1 -1
- package/src/Form/FormItem/__snapshots__/FormItem.stories.ts.snap +119 -109
- package/src/Form/FormItem/__snapshots__/FormItem.stories.tsx.snap +4 -4
- package/src/Form/Label/FormLabel.stories.tsx +1 -1
- package/src/Form/Label/FormLabel.tsx +1 -1
- package/src/Form/Label/Label.stories.ts +1 -1
- package/src/Form/Label/__snapshots__/Label.stories.ts.snap +21 -15
- package/src/Form/Radio/FormRadio.stories.tsx +1 -1
- package/src/Form/Radio/FormRadio.tsx +4 -4
- package/src/Form/Radio/Radio.stories.ts +1 -1
- package/src/Form/Radio/__snapshots__/Radio.stories.ts.snap +55 -51
- package/src/Form/Search/Search.stories.ts +1 -4
- package/src/Form/Search/__snapshots__/Search.stories.ts.snap +23 -21
- package/src/Form/Select/FormSelect.stories.tsx +1 -1
- package/src/Form/Select/FormSelect.tsx +1 -1
- package/src/Form/Select/Select.stories.ts +1 -1
- package/src/Form/Select/__snapshots__/Select.stories.ts.snap +18 -16
- package/src/Form/TextInput/FormText.stories.tsx +1 -1
- package/src/Form/TextInput/InputDivider.stories.ts +1 -1
- package/src/Form/TextInput/TextInput.stories.ts +1 -1
- package/src/Form/TextInput/__snapshots__/FormText.stories.tsx.snap +1 -1
- package/src/Form/TextInput/__snapshots__/InputDivider.stories.ts.snap +24 -22
- package/src/Form/TextInput/__snapshots__/TextInput.stories.ts.snap +18 -14
- package/src/Form/Textarea/FormTextarea.stories.tsx +1 -1
- package/src/Form/Textarea/Textarea.stories.ts +1 -1
- package/src/Form/Textarea/__snapshots__/FormTextarea.stories.tsx.snap +1 -1
- package/src/Form/Textarea/__snapshots__/Textarea.stories.ts.snap +9 -7
- package/src/Form/form.css +24 -34
- package/src/Introduction.mdx +40 -0
- package/src/Layout/Footer/Footer.stories.ts +1 -6
- package/src/Layout/Footer/Footer.stories.tsx +1 -1
- package/src/Layout/Footer/__snapshots__/Footer.stories.ts.snap +10 -10
- package/src/Layout/Footer/footer.css +2 -6
- package/src/Layout/Footer/footer.twig +0 -1
- package/src/Layout/Grid/Grid.stories.ts +8 -8
- package/src/Layout/Grid/Grid.stories.tsx +2 -2
- package/src/Layout/Grid/__snapshots__/Grid.stories.ts.snap +38 -32
- package/src/Layout/Grid/container-grid.css +10 -10
- package/src/Layout/Grid/grid-item.twig +3 -1
- package/src/Layout/Grid/grid.css +3 -3
- package/src/Layout/Header/Header.stories.ts +1 -6
- package/src/Layout/Header/Header.stories.tsx +1 -1
- package/src/Layout/Header/__snapshots__/Header.stories.ts.snap +11 -11
- package/src/Layout/Header/__snapshots__/Header.stories.tsx.snap +3 -3
- package/src/Layout/Header/_header.css +18 -16
- package/src/Layout/Header/header.twig +1 -2
- package/src/Layout/Masthead/Masthead.stories.ts +1 -3
- package/src/Layout/Masthead/__snapshots__/Masthead.stories.ts.snap +6 -6
- package/src/Layout/Masthead/masthead.twig +0 -2
- package/src/Layout/Page/Page.stories.tsx +1 -1
- package/src/Layout/Page/__snapshots__/Page.stories.tsx.snap +3 -3
- package/src/Layout/Page/page.css +16 -40
- package/src/Layout/Page/page.twig +6 -1
- package/src/Layout/Section/Background.stories.ts +60 -8
- package/src/Layout/Section/Breakouts.stories.ts +1 -3
- package/src/Layout/Section/Flow.stories.ts +1 -3
- package/src/Layout/Section/Section.stories.ts +1 -6
- package/src/Layout/Section/Section.stories.tsx +1 -1
- package/src/Layout/Section/SectionGrid.stories.tsx +1 -1
- package/src/Layout/Section/__snapshots__/Background.stories.ts.snap +36 -24
- package/src/Layout/Section/__snapshots__/Breakouts.stories.ts.snap +54 -52
- package/src/Layout/Section/__snapshots__/Flow.stories.ts.snap +18 -18
- package/src/Layout/Section/__snapshots__/Section.stories.ts.snap +2 -2
- package/src/Layout/Section/section.css +15 -18
- package/src/Layout/Section/section.twig +0 -1
- package/src/Layout/Section/twig/section-background.twig +29 -10
- package/src/Layout/Section/twig/sections-breakout.twig +28 -33
- package/src/Layout/Section/twig/sections-flow.twig +17 -17
- package/src/Layout/Section/twig/sections-stacked.twig +4 -4
- package/src/Layout/Sidebar/Sidebar.stories.ts +1 -3
- package/src/Layout/Sidebar/Sidebar.stories.tsx +1 -1
- package/src/Layout/Sidebar/__snapshots__/Sidebar.stories.ts.snap +5 -5
- package/src/Layout/Sidebar/sidebar.css +2 -18
- package/src/Utility/Context/ImageComponent.tsx +3 -6
- package/src/Utility/Context/LinkComponent.tsx +3 -6
- package/src/Utility/Drupal/drupal.css +1 -5
- package/src/Utility/Elements/breakpoint-loader.ts +0 -1
- package/src/Utility/Elements/cookie-compliance.ts +0 -1
- package/src/Utility/Elements/io-loader.ts +0 -1
- package/src/Utility/Hooks/useLocalStorage.ts +0 -1
- package/src/Utility/Hooks/useMediaQuery.ts +0 -1
- package/src/Utility/Hooks/useToggle.ts +0 -1
- package/src/Utility/global.d.ts +0 -1
- package/src/Utility/utilities.ts +0 -1
- package/src/constants.css +53 -24
- package/src/enums.ts +1 -2
- package/src/react.ts +3 -0
- package/src/tokens.js +19 -19
- package/dist/build/accordion.entry.js.map +0 -1
- package/dist/build/chunks/Accordion-DSze7pxN.js +0 -61
- package/dist/build/chunks/Accordion-DSze7pxN.js.map +0 -1
- package/dist/build/chunks/disclosure-widget-CQLPJ8Ta.js +0 -124
- package/dist/build/chunks/disclosure-widget-CQLPJ8Ta.js.map +0 -1
- package/dist/build/chunks/drop-menu.entry-BC6x9vst.js +0 -132
- package/dist/build/chunks/drop-menu.entry-BC6x9vst.js.map +0 -1
- package/dist/build/chunks/keyboard-C73DHu0c.js +0 -101
- package/dist/build/chunks/keyboard-C73DHu0c.js.map +0 -1
- package/dist/build/chunks/polyfills-CJ5uTmUJ.js +0 -749
- package/dist/build/chunks/polyfills-CJ5uTmUJ.js.map +0 -1
- package/dist/build/chunks/popover-wbPSyFRj.js +0 -654
- package/dist/build/chunks/popover-wbPSyFRj.js.map +0 -1
- package/dist/build/chunks/utilities-B4YZb689.js +0 -243
- package/dist/build/chunks/utilities-B4YZb689.js.map +0 -1
- package/dist/build/dialog.entry.js.map +0 -1
- package/dist/build/drop-menu.entry.js.map +0 -1
- package/dist/build/filters.entry.js.map +0 -1
- package/dist/build/global-alert.entry.js.map +0 -1
- package/dist/build/header.entry.js.map +0 -1
- package/dist/build/in-page-navigation.entry.js.map +0 -1
- package/dist/build/navigation.entry.js.map +0 -1
- package/dist/build/sticky.entry.js.map +0 -1
- package/dist/build/tabs.entry.js.map +0 -1
- package/dist/build/tiles.css +0 -61
- package/src/Component/Tile/tile.twig +0 -10
- package/src/Component/Tile/tiles.css +0 -58
- package/src/Component/Tile/twig/tiles.twig +0 -18
package/dist/build/filters.css
CHANGED
|
@@ -1,105 +1 @@
|
|
|
1
|
-
|
|
2
|
-
* Filters
|
|
3
|
-
*/
|
|
4
|
-
|
|
5
|
-
@layer design-system.components {
|
|
6
|
-
.mx-filters {
|
|
7
|
-
display: grid;
|
|
8
|
-
grid-gap: var(--gap);
|
|
9
|
-
gap: var(--gap);
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
.mx-filters__title {
|
|
13
|
-
--heading-font-size: var(--font-size-l);
|
|
14
|
-
--font-min: calc(
|
|
15
|
-
var(--heading-font-size) - var(--heading-font-size) *
|
|
16
|
-
var(--font-size-diff, 0.3)
|
|
17
|
-
);
|
|
18
|
-
|
|
19
|
-
font-weight: var(--font-weight-bold);
|
|
20
|
-
font-size: clamp(
|
|
21
|
-
max(var(--base-font-size), var(--font-min)),
|
|
22
|
-
var(--font-min) + 1cqi,
|
|
23
|
-
var(--heading-font-size)
|
|
24
|
-
);
|
|
25
|
-
display: flex;
|
|
26
|
-
gap: var(--spacing-s);
|
|
27
|
-
align-items: center;
|
|
28
|
-
min-block-size: 40px;
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
@media (min-width: 720px) {
|
|
32
|
-
|
|
33
|
-
.mx-filters__title {
|
|
34
|
-
pointer-events: none;
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
.mx-filters__title .mx-icon {
|
|
39
|
-
margin-inline-start: auto;
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
@media (min-width: 720px) {
|
|
43
|
-
|
|
44
|
-
.mx-filters__title .mx-icon {
|
|
45
|
-
display: none;
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
@media (min-width: 720px) {
|
|
49
|
-
|
|
50
|
-
.mx-filters__title [data-counters] {
|
|
51
|
-
display: none;
|
|
52
|
-
}
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
.mx-filters__title.mx-accordion__toggle + .mx-filters__form {
|
|
56
|
-
padding-block-start: var(--block-padding, var(--gap));
|
|
57
|
-
}
|
|
58
|
-
.mx-filters__form .mx-accordion__toggle {
|
|
59
|
-
display: flex;
|
|
60
|
-
gap: var(--spacing-s);
|
|
61
|
-
align-items: center;
|
|
62
|
-
}
|
|
63
|
-
|
|
64
|
-
.mx-filters__form .mx-accordion__toggle .mx-icon {
|
|
65
|
-
margin-inline-start: auto;
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
.mx-filters__form .mx-accordion__content {
|
|
69
|
-
padding-block-start: var(--spacing-xxxs);
|
|
70
|
-
}
|
|
71
|
-
@media (max-width: 719.98px) {
|
|
72
|
-
.mx-filters--right .mx-filters__form {
|
|
73
|
-
background-color: var(--background, var(--colour-background));
|
|
74
|
-
padding-inline: var(
|
|
75
|
-
--gutter,
|
|
76
|
-
max(var(--spacing-s), min(6vw, var(--spacing-l)))
|
|
77
|
-
);
|
|
78
|
-
padding-block-end: var(--block-padding);
|
|
79
|
-
overflow-y: auto;
|
|
80
|
-
position: fixed;
|
|
81
|
-
z-index: 200;
|
|
82
|
-
inset-block: 0;
|
|
83
|
-
inset-inline: 0 -100vw;
|
|
84
|
-
transition: 0.15s ease-in-out;
|
|
85
|
-
visibility: hidden;
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
.mx-filters--right [open] .mx-filters__form {
|
|
89
|
-
inset-inline-end: 0;
|
|
90
|
-
visibility: visible;
|
|
91
|
-
}
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
@media (min-width: 720px) {
|
|
95
|
-
.mx-filters--right .mx-filters__form {
|
|
96
|
-
--block-padding: 0;
|
|
97
|
-
}
|
|
98
|
-
|
|
99
|
-
.mx-filters--right .mx-filters__form .mx-filters__title {
|
|
100
|
-
display: none;
|
|
101
|
-
}
|
|
102
|
-
}
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImZpbHRlcnMuY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztFQUVFOztBQUVGO0VBQ0U7SUFDRSxhQUFhO0lBQ2Isb0JBQWU7SUFBZixlQUFlO0VBQ2pCOztFQUVBO0lBQ0UsdUNBQXVDO0lBQ3ZDOzs7S0FHQzs7SUFFRCxvQ0FBb0M7SUFDcEM7Ozs7S0FJQztJQUNELGFBQWE7SUFDYixxQkFBcUI7SUFDckIsbUJBQW1CO0lBQ25CLG9CQUFvQjtFQXVCdEI7O0lBckJFOztFQWxCRjtNQW1CSSxvQkFBb0I7RUFvQnhCO0lBbkJFOztJQUVBO01BQ0UseUJBQXlCO0lBSzNCOztNQUhFOztJQUhGO1FBSUksYUFBYTtJQUVqQjtNQURFO01BSUE7O0lBREY7UUFFSSxhQUFhO0lBRWpCO01BREU7O0lBR0Y7TUFDRSxxREFBcUQ7SUFDdkQ7SUFJQTtNQUNFLGFBQWE7TUFDYixxQkFBcUI7TUFDckIsbUJBQW1CO0lBS3JCOztNQUhFO1FBQ0UseUJBQXlCO01BQzNCOztJQUdGO01BQ0Usd0NBQXdDO0lBQzFDO0lBSUE7TUFDRTtRQUNFLDZEQUE2RDtRQUM3RDs7O1NBR0M7UUFDRCx1Q0FBdUM7UUFDdkMsZ0JBQWdCO1FBQ2hCLGVBQWU7UUFDZixZQUFZO1FBQ1osY0FBYztRQUNkLHNCQUFzQjtRQUN0Qiw2QkFBNkI7UUFDN0Isa0JBQWtCO01BQ3BCOztNQUVBO1FBQ0UsbUJBQW1CO1FBQ25CLG1CQUFtQjtNQUNyQjtJQUNGOztJQUVBO01BQ0U7UUFDRSxrQkFBa0I7TUFLcEI7O1FBSEU7VUFDRSxhQUFhO1FBQ2Y7SUFFSjtBQUVKIiwiZmlsZSI6ImZpbHRlcnMuY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBGaWx0ZXJzXG4gKi9cblxuQGxheWVyIGRlc2lnbi1zeXN0ZW0uY29tcG9uZW50cyB7XG4gIC5teC1maWx0ZXJzIHtcbiAgICBkaXNwbGF5OiBncmlkO1xuICAgIGdhcDogdmFyKC0tZ2FwKTtcbiAgfVxuXG4gIC5teC1maWx0ZXJzX190aXRsZSB7XG4gICAgLS1oZWFkaW5nLWZvbnQtc2l6ZTogdmFyKC0tZm9udC1zaXplLWwpO1xuICAgIC0tZm9udC1taW46IGNhbGMoXG4gICAgICB2YXIoLS1oZWFkaW5nLWZvbnQtc2l6ZSkgLSB2YXIoLS1oZWFkaW5nLWZvbnQtc2l6ZSkgKlxuICAgICAgICB2YXIoLS1mb250LXNpemUtZGlmZiwgMC4zKVxuICAgICk7XG5cbiAgICBmb250LXdlaWdodDogdmFyKC0tZm9udC13ZWlnaHQtYm9sZCk7XG4gICAgZm9udC1zaXplOiBjbGFtcChcbiAgICAgIG1heCh2YXIoLS1iYXNlLWZvbnQtc2l6ZSksIHZhcigtLWZvbnQtbWluKSksXG4gICAgICB2YXIoLS1mb250LW1pbikgKyAxY3FpLFxuICAgICAgdmFyKC0taGVhZGluZy1mb250LXNpemUpXG4gICAgKTtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGdhcDogdmFyKC0tc3BhY2luZy1zKTtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIG1pbi1ibG9jay1zaXplOiA0MHB4O1xuXG4gICAgQG1lZGlhICgtLW1lZGl1bS11cCkge1xuICAgICAgcG9pbnRlci1ldmVudHM6IG5vbmU7XG4gICAgfVxuXG4gICAgJiAubXgtaWNvbiB7XG4gICAgICBtYXJnaW4taW5saW5lLXN0YXJ0OiBhdXRvO1xuXG4gICAgICBAbWVkaWEgKC0tbWVkaXVtLXVwKSB7XG4gICAgICAgIGRpc3BsYXk6IG5vbmU7XG4gICAgICB9XG4gICAgfVxuXG4gICAgJiBbZGF0YS1jb3VudGVyc10ge1xuICAgICAgQG1lZGlhICgtLW1lZGl1bS11cCkge1xuICAgICAgICBkaXNwbGF5OiBub25lO1xuICAgICAgfVxuICAgIH1cblxuICAgICYubXgtYWNjb3JkaW9uX190b2dnbGUgKyAubXgtZmlsdGVyc19fZm9ybSB7XG4gICAgICBwYWRkaW5nLWJsb2NrLXN0YXJ0OiB2YXIoLS1ibG9jay1wYWRkaW5nLCB2YXIoLS1nYXApKTtcbiAgICB9XG4gIH1cblxuICAubXgtZmlsdGVyc19fZm9ybSB7XG4gICAgJiAubXgtYWNjb3JkaW9uX190b2dnbGUge1xuICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgIGdhcDogdmFyKC0tc3BhY2luZy1zKTtcbiAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cbiAgICAgICYgLm14LWljb24ge1xuICAgICAgICBtYXJnaW4taW5saW5lLXN0YXJ0OiBhdXRvO1xuICAgICAgfVxuICAgIH1cblxuICAgICYgLm14LWFjY29yZGlvbl9fY29udGVudCB7XG4gICAgICBwYWRkaW5nLWJsb2NrLXN0YXJ0OiB2YXIoLS1zcGFjaW5nLXh4eHMpO1xuICAgIH1cbiAgfVxuXG4gIC5teC1maWx0ZXJzLS1yaWdodCB7XG4gICAgQG1lZGlhICgtLW1lZGl1bS1kb3duKSB7XG4gICAgICAmIC5teC1maWx0ZXJzX19mb3JtIHtcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tYmFja2dyb3VuZCwgdmFyKC0tY29sb3VyLWJhY2tncm91bmQpKTtcbiAgICAgICAgcGFkZGluZy1pbmxpbmU6IHZhcihcbiAgICAgICAgICAtLWd1dHRlcixcbiAgICAgICAgICBjbGFtcCh2YXIoLS1zcGFjaW5nLXMpLCA2dncsIHZhcigtLXNwYWNpbmctbCkpXG4gICAgICAgICk7XG4gICAgICAgIHBhZGRpbmctYmxvY2stZW5kOiB2YXIoLS1ibG9jay1wYWRkaW5nKTtcbiAgICAgICAgb3ZlcmZsb3cteTogYXV0bztcbiAgICAgICAgcG9zaXRpb246IGZpeGVkO1xuICAgICAgICB6LWluZGV4OiAyMDA7XG4gICAgICAgIGluc2V0LWJsb2NrOiAwO1xuICAgICAgICBpbnNldC1pbmxpbmU6IDAgLTEwMHZ3O1xuICAgICAgICB0cmFuc2l0aW9uOiAwLjE1cyBlYXNlLWluLW91dDtcbiAgICAgICAgdmlzaWJpbGl0eTogaGlkZGVuO1xuICAgICAgfVxuXG4gICAgICAmIFtvcGVuXSAubXgtZmlsdGVyc19fZm9ybSB7XG4gICAgICAgIGluc2V0LWlubGluZS1lbmQ6IDA7XG4gICAgICAgIHZpc2liaWxpdHk6IHZpc2libGU7XG4gICAgICB9XG4gICAgfVxuXG4gICAgQG1lZGlhICgtLW1lZGl1bS11cCkge1xuICAgICAgJiAubXgtZmlsdGVyc19fZm9ybSB7XG4gICAgICAgIC0tYmxvY2stcGFkZGluZzogMDtcblxuICAgICAgICAmIC5teC1maWx0ZXJzX190aXRsZSB7XG4gICAgICAgICAgZGlzcGxheTogbm9uZTtcbiAgICAgICAgfVxuICAgICAgfVxuICAgIH1cbiAgfVxufVxuIl19 */
|
|
1
|
+
@layer design-system.components{.mx-filters{display:grid;grid-gap:var(--gap);gap:var(--gap)}.mx-filters__title{--heading-font-size: var(--font-size-l);--font-min: calc( var(--heading-font-size) - var(--heading-font-size) * var(--font-size-diff, .3) );font-weight:var(--font-weight-bold);font-size:clamp(max(var(--base-font-size),var(--font-min)),var(--font-min) + 1cqi,var(--heading-font-size));display:flex;gap:var(--spacing-s);align-items:center;min-block-size:40px}@media (min-width: 720px){.mx-filters__title{pointer-events:none}}.mx-filters__title .mx-icon{margin-inline-start:auto}@media (min-width: 720px){.mx-filters__title .mx-icon{display:none}}@media (min-width: 720px){.mx-filters__title [data-counters]{display:none}}.mx-filters__title.mx-accordion__toggle+.mx-filters__form{padding-block-start:var(--block-padding, var(--gap))}.mx-filters__form .mx-accordion__toggle{display:flex;gap:var(--spacing-s);align-items:center}:is(.mx-filters__form .mx-accordion__toggle) .mx-icon{margin-inline-start:auto}.mx-filters__form .mx-accordion__content{padding-block-start:var(--spacing-xxxs)}@media (max-width: 719.98px){.mx-filters--right .mx-filters__form{background-color:var(--background, var(--colour-background));padding-inline:var( --gutter, max(var(--spacing-s), min(6vw, var(--spacing-l))) );padding-block-end:var(--block-padding);overflow-y:auto;position:fixed;z-index:200;inset-block:0;inset-inline:0;inline-size:100vw;display:none;opacity:0;transform:translate(100%)}.mx-filters--right [open] .mx-filters__form{opacity:1;transform:translate(0);display:block}@starting-style{.mx-filters--right [open] .mx-filters__form{opacity:0;transform:translate(100%);display:block}}}@media (min-width: 720px){.mx-filters--right .mx-filters__form{--block-padding: 0}:is(.mx-filters--right .mx-filters__form) .mx-filters__title{display:none}}}
|
|
@@ -1,137 +1 @@
|
|
|
1
|
-
import
|
|
2
|
-
class AccordionMobile extends Accordion {
|
|
3
|
-
constructor() {
|
|
4
|
-
super();
|
|
5
|
-
this.handleBreakpoint = ({
|
|
6
|
-
matches
|
|
7
|
-
}) => {
|
|
8
|
-
if (!this.details) return;
|
|
9
|
-
this.details.toggleAttribute("open", !matches);
|
|
10
|
-
};
|
|
11
|
-
this.mq = this.getAttribute("mq") || "(max-width: 720px)";
|
|
12
|
-
}
|
|
13
|
-
connectedCallback() {
|
|
14
|
-
this.handleBreakpoint(this.breakpoint);
|
|
15
|
-
const { signal } = this.controller;
|
|
16
|
-
this.breakpoint.addEventListener("change", this.handleBreakpoint, {
|
|
17
|
-
signal
|
|
18
|
-
});
|
|
19
|
-
}
|
|
20
|
-
disconnectedCallback() {
|
|
21
|
-
this.controller.abort();
|
|
22
|
-
}
|
|
23
|
-
get breakpoint() {
|
|
24
|
-
return window.matchMedia(this.mq);
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
customElements.define("mx-accordionmobile", AccordionMobile);
|
|
28
|
-
const _Filters = class _Filters extends HTMLElement {
|
|
29
|
-
constructor() {
|
|
30
|
-
super();
|
|
31
|
-
this.handleClose = (event) => {
|
|
32
|
-
if (!this.details) return;
|
|
33
|
-
this.details.open = false;
|
|
34
|
-
event.preventDefault();
|
|
35
|
-
};
|
|
36
|
-
this.handleShow = (event) => {
|
|
37
|
-
event.preventDefault();
|
|
38
|
-
const wrapper = this.showBtn.previousElementSibling;
|
|
39
|
-
wrapper.removeAttribute("hidden");
|
|
40
|
-
const lastVisible = wrapper.previousElementSibling;
|
|
41
|
-
const input = lastVisible.querySelector("input");
|
|
42
|
-
if (!input) return;
|
|
43
|
-
input.focus({ preventScroll: true });
|
|
44
|
-
setTimeout(() => {
|
|
45
|
-
this.showBtn.setAttribute("hidden", "");
|
|
46
|
-
}, 100);
|
|
47
|
-
};
|
|
48
|
-
this.handleReset = () => {
|
|
49
|
-
this.entries.forEach((entry, key) => {
|
|
50
|
-
this.entries.set(key, { ...entry, count: null });
|
|
51
|
-
if (entry.counter) entry.counter.textContent = "";
|
|
52
|
-
});
|
|
53
|
-
this.setAttribute("count", "0");
|
|
54
|
-
};
|
|
55
|
-
this.handleCounters = () => {
|
|
56
|
-
const formData = new FormData(this.form, this.submitBtn);
|
|
57
|
-
this.entries.forEach((entry, key) => {
|
|
58
|
-
const { length } = formData.getAll(key).filter(Boolean);
|
|
59
|
-
const count = length > 0 ? length : null;
|
|
60
|
-
this.entries.set(key, { ...entry, count });
|
|
61
|
-
if (entry.counter) entry.counter.textContent = count?.toString() || "";
|
|
62
|
-
});
|
|
63
|
-
const totalCount = [...this.entries].filter(([, item]) => item.count).length;
|
|
64
|
-
this.setAttribute("count", totalCount.toString());
|
|
65
|
-
};
|
|
66
|
-
this.internals_ = this.attachInternals();
|
|
67
|
-
this.controller = new AbortController();
|
|
68
|
-
}
|
|
69
|
-
connectedCallback() {
|
|
70
|
-
if (!this.items) return;
|
|
71
|
-
const { signal } = this.controller;
|
|
72
|
-
this.closeBtn?.addEventListener("click", this.handleClose, {
|
|
73
|
-
signal
|
|
74
|
-
});
|
|
75
|
-
this.showBtn?.addEventListener("click", this.handleShow, {
|
|
76
|
-
signal
|
|
77
|
-
});
|
|
78
|
-
this.handleCounters();
|
|
79
|
-
this.addEventListener("change", this.handleCounters, { signal });
|
|
80
|
-
this.form?.addEventListener("submit", this.handleCounters, { signal });
|
|
81
|
-
this.form?.addEventListener("reset", this.handleReset, { signal });
|
|
82
|
-
}
|
|
83
|
-
disconnectedCallback() {
|
|
84
|
-
this.controller.abort();
|
|
85
|
-
}
|
|
86
|
-
attributeChangedCallback(name, oldValue, newValue) {
|
|
87
|
-
if (name === "count" && oldValue !== newValue) {
|
|
88
|
-
const qualifier = parseInt(newValue, 10) > 0;
|
|
89
|
-
this.resetBtn?.toggleAttribute("disabled", !qualifier);
|
|
90
|
-
this.submitBtn?.toggleAttribute("disabled", !qualifier);
|
|
91
|
-
if (!this.allCounter) return;
|
|
92
|
-
this.allCounter.textContent = qualifier ? newValue : "";
|
|
93
|
-
}
|
|
94
|
-
}
|
|
95
|
-
get items() {
|
|
96
|
-
const items = this.querySelectorAll(".mx-filter-item");
|
|
97
|
-
if (!items) {
|
|
98
|
-
throw new Error(
|
|
99
|
-
`${this.localName} must contain a .mx-filter-item element.`
|
|
100
|
-
);
|
|
101
|
-
}
|
|
102
|
-
this.entries = /* @__PURE__ */ new Map();
|
|
103
|
-
items.forEach((item) => {
|
|
104
|
-
const key = item.querySelector("input, select")?.getAttribute("name");
|
|
105
|
-
this.entries.set(key, {
|
|
106
|
-
item,
|
|
107
|
-
counter: item.querySelector("[data-counter]")
|
|
108
|
-
});
|
|
109
|
-
});
|
|
110
|
-
return items;
|
|
111
|
-
}
|
|
112
|
-
get details() {
|
|
113
|
-
return this.querySelector("mx-accordionmobile > details");
|
|
114
|
-
}
|
|
115
|
-
get closeBtn() {
|
|
116
|
-
return this.details?.querySelector("button[data-close]");
|
|
117
|
-
}
|
|
118
|
-
get form() {
|
|
119
|
-
return this.querySelector("form");
|
|
120
|
-
}
|
|
121
|
-
get resetBtn() {
|
|
122
|
-
return this.querySelector("button[type='reset']");
|
|
123
|
-
}
|
|
124
|
-
get submitBtn() {
|
|
125
|
-
return this.querySelector("button[type='submit']");
|
|
126
|
-
}
|
|
127
|
-
get showBtn() {
|
|
128
|
-
return this.querySelector("button[data-show]");
|
|
129
|
-
}
|
|
130
|
-
get allCounter() {
|
|
131
|
-
return this.querySelector("[data-counters]");
|
|
132
|
-
}
|
|
133
|
-
};
|
|
134
|
-
_Filters.observedAttributes = ["count"];
|
|
135
|
-
let Filters = _Filters;
|
|
136
|
-
customElements.define("mx-filters", Filters);
|
|
137
|
-
//# sourceMappingURL=filters.entry.js.map
|
|
1
|
+
import{A as t}from"./chunks/Accordion-RtUfbsTy.js";customElements.define("mx-accordionmobile",class extends t{constructor(){super(),this.handleBreakpoint=({matches:t})=>{this.details&&this.details.toggleAttribute("open",!t)},this.mq=this.getAttribute("mq")||"(max-width: 720px)"}connectedCallback(){this.handleBreakpoint(this.breakpoint);const{signal:t}=this.controller;this.breakpoint.addEventListener("change",this.handleBreakpoint,{signal:t})}disconnectedCallback(){this.controller.abort()}get breakpoint(){return window.matchMedia(this.mq)}});class e extends HTMLElement{constructor(){super(),this.handleClose=t=>{this.details&&(this.details.open=!1,t.preventDefault())},this.handleShow=t=>{t.preventDefault();const e=this.showBtn.previousElementSibling;e.removeAttribute("hidden");const n=e.previousElementSibling.querySelector("input");n&&(n.focus({preventScroll:!0}),setTimeout((()=>{this.showBtn.setAttribute("hidden","")}),100))},this.handleReset=()=>{this.entries.forEach(((t,e)=>{this.entries.set(e,{...t,count:null}),t.counter&&(t.counter.textContent="")})),this.setAttribute("count","0")},this.handleCounters=()=>{const t=new FormData(this.form,this.submitBtn);this.entries.forEach(((e,n)=>{const{length:s}=t.getAll(n).filter(Boolean),i=s>0?s:null;this.entries.set(n,{...e,count:i}),e.counter&&(e.counter.textContent=i?.toString()||"")}));const e=[...this.entries].filter((([,t])=>t.count)).length;this.setAttribute("count",e.toString())},this.internals_=this.attachInternals(),this.controller=new AbortController}static{this.observedAttributes=["count"]}connectedCallback(){if(!this.items)return;const{signal:t}=this.controller;this.closeBtn?.addEventListener("click",this.handleClose,{signal:t}),this.showBtn?.addEventListener("click",this.handleShow,{signal:t}),this.handleCounters(),this.addEventListener("change",this.handleCounters,{signal:t}),this.form?.addEventListener("submit",this.handleCounters,{signal:t}),this.form?.addEventListener("reset",this.handleReset,{signal:t})}disconnectedCallback(){this.controller.abort()}attributeChangedCallback(t,e,n){if("count"===t&&e!==n){const t=parseInt(n,10)>0;if(this.resetBtn?.toggleAttribute("disabled",!t),this.submitBtn?.toggleAttribute("disabled",!t),!this.allCounter)return;this.allCounter.textContent=t?n:""}}get items(){const t=this.querySelectorAll(".mx-filter-item");if(!t)throw new Error(`${this.localName} must contain a .mx-filter-item element.`);return this.entries=new Map,t.forEach((t=>{const e=t.querySelector("input, select")?.getAttribute("name");this.entries.set(e,{item:t,counter:t.querySelector("[data-counter]")})})),t}get details(){return this.querySelector("mx-accordionmobile > details")}get closeBtn(){return this.details?.querySelector("button[data-close]")}get form(){return this.querySelector("form")}get resetBtn(){return this.querySelector("button[type='reset']")}get submitBtn(){return this.querySelector("button[type='submit']")}get showBtn(){return this.querySelector("button[data-show]")}get allCounter(){return this.querySelector("[data-counters]")}}customElements.define("mx-filters",e);
|
package/dist/build/footer.css
CHANGED
|
@@ -1,151 +1 @@
|
|
|
1
|
-
|
|
2
|
-
* Global Footer
|
|
3
|
-
*/
|
|
4
|
-
|
|
5
|
-
@layer design-system.layouts {
|
|
6
|
-
.mx-footer {
|
|
7
|
-
position: sticky;
|
|
8
|
-
inset-block-start: 100vh;
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
.mx-footer__inner {
|
|
12
|
-
display: grid;
|
|
13
|
-
grid-template-areas: "brand" "social" "navigation" "copyright" "links";
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
@media (min-width: 720px) {
|
|
17
|
-
|
|
18
|
-
.mx-footer__inner {
|
|
19
|
-
grid-template-areas: "brand navigation" "social navigation" "copyright links";
|
|
20
|
-
gap: 0;
|
|
21
|
-
}
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
.mx-footer__inner:has(.mx-footer__aoc) {
|
|
25
|
-
grid-template-areas: "aoc" "brand" "social" "navigation" "copyright" "links";
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
@media (min-width: 720px) {
|
|
29
|
-
|
|
30
|
-
.mx-footer__inner:has(.mx-footer__aoc) {
|
|
31
|
-
grid-template-areas: "aoc aoc" "brand navigation" "social navigation" "copyright links";
|
|
32
|
-
}
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
.mx-footer__inner .mx-logo {
|
|
36
|
-
grid-area: brand;
|
|
37
|
-
margin-block-end: var(--gap);
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
.mx-footer__inner .mx-social-links {
|
|
41
|
-
grid-area: social;
|
|
42
|
-
align-self: end;
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
.mx-footer__inner .mx-footer__copyright {
|
|
46
|
-
grid-area: copyright;
|
|
47
|
-
align-self: end;
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
.mx-footer__inner .mx-footer__copyright:not(:first-child) {
|
|
51
|
-
padding-block-start: var(--spacing-s);
|
|
52
|
-
border-block-start: 1px solid
|
|
53
|
-
var(--line-colour, var(--colour-border));
|
|
54
|
-
border-block-start: var(--line-width, 1px) solid
|
|
55
|
-
var(--line-colour, var(--colour-border));
|
|
56
|
-
margin-block-start: var(--gap);
|
|
57
|
-
}
|
|
58
|
-
@media (min-width: 720px) {
|
|
59
|
-
|
|
60
|
-
.mx-footer__inner .mx-footer__copyright:not(:first-child) + .mx-footer__links {
|
|
61
|
-
padding-block-start: var(--spacing-s);
|
|
62
|
-
border-block-start: 1px solid
|
|
63
|
-
var(--line-colour, var(--colour-border));
|
|
64
|
-
border-block-start: var(--line-width, 1px) solid
|
|
65
|
-
var(--line-colour, var(--colour-border));
|
|
66
|
-
}
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
.mx-footer__inner .mx-footer__links {
|
|
70
|
-
grid-area: links;
|
|
71
|
-
align-self: end;
|
|
72
|
-
}
|
|
73
|
-
|
|
74
|
-
@media (min-width: 720px) {
|
|
75
|
-
|
|
76
|
-
.mx-footer__inner .mx-footer__links {
|
|
77
|
-
justify-content: end;
|
|
78
|
-
}
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
.mx-footer__inner .mx-footer__links:not(:first-child) {
|
|
82
|
-
margin-block-start: var(--gap);
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
.mx-footer__aoc {
|
|
86
|
-
grid-area: aoc;
|
|
87
|
-
padding-block-end: var(--footer-row-gap, var(--spacing-xxl));
|
|
88
|
-
border-block-end: 1px solid
|
|
89
|
-
var(--line-colour, var(--colour-border));
|
|
90
|
-
border-block-end: var(--line-width, 1px) solid
|
|
91
|
-
var(--line-colour, var(--colour-border));
|
|
92
|
-
margin-block-end: var(--gap);
|
|
93
|
-
text-align: center;
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
.mx-nav--footer {
|
|
97
|
-
grid-area: navigation;
|
|
98
|
-
margin-block: var(--spacing-xxxl) var(--spacing-l);
|
|
99
|
-
}
|
|
100
|
-
|
|
101
|
-
@media (min-width: 720px) {
|
|
102
|
-
|
|
103
|
-
.mx-nav--footer {
|
|
104
|
-
justify-self: end;
|
|
105
|
-
margin-block: 0;
|
|
106
|
-
}
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
.mx-nav--footer:not(:has(.mx-nav__level-2)) ul {
|
|
110
|
-
flex-flow: row wrap;
|
|
111
|
-
align-items: center;
|
|
112
|
-
gap: var(--spacing-l) var(--spacing-xxxl);
|
|
113
|
-
}
|
|
114
|
-
.mx-nav--footer:has(.mx-nav__level-2) ul {
|
|
115
|
-
display: grid;
|
|
116
|
-
}
|
|
117
|
-
|
|
118
|
-
.mx-nav--footer:has(.mx-nav__level-2) .mx-nav__level-1 {
|
|
119
|
-
gap: var(--spacing-l) var(--spacing-xxxl);
|
|
120
|
-
grid-template-columns: 1fr 1fr;
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
@media (min-width: 720px) {
|
|
124
|
-
|
|
125
|
-
.mx-nav--footer:has(.mx-nav__level-2) .mx-nav__level-1 {
|
|
126
|
-
grid-template-columns: 1fr 1fr 1fr;
|
|
127
|
-
}
|
|
128
|
-
}
|
|
129
|
-
|
|
130
|
-
.mx-nav--footer:has(.mx-nav__level-2) .mx-nav__level-1 > li > a {
|
|
131
|
-
display: inline-block;
|
|
132
|
-
margin-block-end: var(--spacing-l);
|
|
133
|
-
font-weight: var(--font-weight-bold);
|
|
134
|
-
}
|
|
135
|
-
|
|
136
|
-
.mx-nav--footer:has(.mx-nav__level-2) .mx-nav__level-2 {
|
|
137
|
-
gap: var(--spacing-xs);
|
|
138
|
-
}
|
|
139
|
-
|
|
140
|
-
.mx-nav--footer .mx-nav__toggle {
|
|
141
|
-
display: none;
|
|
142
|
-
}
|
|
143
|
-
}
|
|
144
|
-
|
|
145
|
-
@media print {
|
|
146
|
-
.mx-footer {
|
|
147
|
-
display: none;
|
|
148
|
-
}
|
|
149
|
-
}
|
|
150
|
-
|
|
151
|
-
/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImZvb3Rlci5jc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0VBRUU7O0FBRUY7RUFDRTtJQUNFLGdCQUFnQjtJQUNoQix3QkFBd0I7RUFDMUI7O0VBRUE7SUFDRSxhQUFhO0lBQ2Isc0VBQXNFO0VBeUR4RTs7SUF2REU7O0VBSkY7TUFLSSw2RUFBNkU7TUFDN0UsTUFBTTtFQXFEVjtJQXBERTs7SUFFQTtNQUNFLDRFQUE0RTtJQUs5RTs7TUFIRTs7SUFIRjtRQUlJLHVGQUF1RjtJQUUzRjtNQURFOztJQUdGO01BQ0UsZ0JBQWdCO01BQ2hCLDRCQUE0QjtJQUM5Qjs7SUFFQTtNQUNFLGlCQUFpQjtNQUNqQixlQUFlO0lBQ2pCOztJQUVBO01BQ0Usb0JBQW9CO01BQ3BCLGVBQWU7SUFnQmpCOztNQWRFO1FBQ0UscUNBQXFDO1FBQ3JDO2tEQUMwQztRQUQxQztrREFDMEM7UUFDMUMsOEJBQThCO01BU2hDO1VBTkk7O1FBREY7WUFFSSxxQ0FBcUM7WUFDckM7c0RBQzBDO1lBRDFDO3NEQUMwQztRQUU5QztVQURFOztJQUtOO01BQ0UsZ0JBQWdCO01BQ2hCLGVBQWU7SUFTakI7O01BUEU7O0lBSkY7UUFLSSxvQkFBb0I7SUFNeEI7TUFMRTs7TUFFQTtRQUNFLDhCQUE4QjtNQUNoQzs7RUFJSjtJQUNFLGNBQWM7SUFDZCw0REFBNEQ7SUFDNUQ7OENBQzBDO0lBRDFDOzhDQUMwQztJQUMxQyw0QkFBNEI7SUFDNUIsa0JBQWtCO0VBQ3BCOztFQUVBO0lBQ0UscUJBQXFCO0lBQ3JCLGtEQUFrRDtFQXlDcEQ7O0lBdkNFOztFQUpGO01BS0ksaUJBQWlCO01BQ2pCLGVBQWU7RUFxQ25CO0lBcENFOztJQUVBO01BQ0UsbUJBQW1CO01BQ25CLG1CQUFtQjtNQUNuQix5Q0FBeUM7SUFDM0M7TUFHRTtRQUNFLGFBQWE7TUFDZjs7TUFFQTtRQUNFLHlDQUF5QztRQUN6Qyw4QkFBOEI7TUFXaEM7O1FBVEU7O01BSkY7VUFLSSxrQ0FBa0M7TUFRdEM7UUFQRTs7UUFFQTtVQUNFLHFCQUFxQjtVQUNyQixrQ0FBa0M7VUFDbEMsb0NBQW9DO1FBQ3RDOztNQUdGO1FBQ0Usc0JBQXNCO01BQ3hCOztJQUdGO01BQ0UsYUFBYTtJQUNmO0FBRUo7O0FBRUE7RUFDRTtJQUNFLGFBQWE7RUFDZjtBQUNGIiwiZmlsZSI6ImZvb3Rlci5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEdsb2JhbCBGb290ZXJcbiAqL1xuXG5AbGF5ZXIgZGVzaWduLXN5c3RlbS5sYXlvdXRzIHtcbiAgLm14LWZvb3RlciB7XG4gICAgcG9zaXRpb246IHN0aWNreTtcbiAgICBpbnNldC1ibG9jay1zdGFydDogMTAwdmg7XG4gIH1cblxuICAubXgtZm9vdGVyX19pbm5lciB7XG4gICAgZGlzcGxheTogZ3JpZDtcbiAgICBncmlkLXRlbXBsYXRlLWFyZWFzOiBcImJyYW5kXCIgXCJzb2NpYWxcIiBcIm5hdmlnYXRpb25cIiBcImNvcHlyaWdodFwiIFwibGlua3NcIjtcblxuICAgIEBtZWRpYSAoLS1tZWRpdW0tdXApIHtcbiAgICAgIGdyaWQtdGVtcGxhdGUtYXJlYXM6IFwiYnJhbmQgbmF2aWdhdGlvblwiIFwic29jaWFsIG5hdmlnYXRpb25cIiBcImNvcHlyaWdodCBsaW5rc1wiO1xuICAgICAgZ2FwOiAwO1xuICAgIH1cblxuICAgICY6aGFzKC5teC1mb290ZXJfX2FvYykge1xuICAgICAgZ3JpZC10ZW1wbGF0ZS1hcmVhczogXCJhb2NcIiBcImJyYW5kXCIgXCJzb2NpYWxcIiBcIm5hdmlnYXRpb25cIiBcImNvcHlyaWdodFwiIFwibGlua3NcIjtcblxuICAgICAgQG1lZGlhICgtLW1lZGl1bS11cCkge1xuICAgICAgICBncmlkLXRlbXBsYXRlLWFyZWFzOiBcImFvYyBhb2NcIiBcImJyYW5kIG5hdmlnYXRpb25cIiBcInNvY2lhbCBuYXZpZ2F0aW9uXCIgXCJjb3B5cmlnaHQgbGlua3NcIjtcbiAgICAgIH1cbiAgICB9XG5cbiAgICAmIC5teC1sb2dvIHtcbiAgICAgIGdyaWQtYXJlYTogYnJhbmQ7XG4gICAgICBtYXJnaW4tYmxvY2stZW5kOiB2YXIoLS1nYXApO1xuICAgIH1cblxuICAgICYgLm14LXNvY2lhbC1saW5rcyB7XG4gICAgICBncmlkLWFyZWE6IHNvY2lhbDtcbiAgICAgIGFsaWduLXNlbGY6IGVuZDtcbiAgICB9XG5cbiAgICAmIC5teC1mb290ZXJfX2NvcHlyaWdodCB7XG4gICAgICBncmlkLWFyZWE6IGNvcHlyaWdodDtcbiAgICAgIGFsaWduLXNlbGY6IGVuZDtcblxuICAgICAgJjpub3QoOmZpcnN0LWNoaWxkKSB7XG4gICAgICAgIHBhZGRpbmctYmxvY2stc3RhcnQ6IHZhcigtLXNwYWNpbmctcyk7XG4gICAgICAgIGJvcmRlci1ibG9jay1zdGFydDogdmFyKC0tbGluZS13aWR0aCwgMXB4KSBzb2xpZFxuICAgICAgICAgIHZhcigtLWxpbmUtY29sb3VyLCB2YXIoLS1jb2xvdXItYm9yZGVyKSk7XG4gICAgICAgIG1hcmdpbi1ibG9jay1zdGFydDogdmFyKC0tZ2FwKTtcblxuICAgICAgICAmICsgLm14LWZvb3Rlcl9fbGlua3Mge1xuICAgICAgICAgIEBtZWRpYSAoLS1tZWRpdW0tdXApIHtcbiAgICAgICAgICAgIHBhZGRpbmctYmxvY2stc3RhcnQ6IHZhcigtLXNwYWNpbmctcyk7XG4gICAgICAgICAgICBib3JkZXItYmxvY2stc3RhcnQ6IHZhcigtLWxpbmUtd2lkdGgsIDFweCkgc29saWRcbiAgICAgICAgICAgICAgdmFyKC0tbGluZS1jb2xvdXIsIHZhcigtLWNvbG91ci1ib3JkZXIpKTtcbiAgICAgICAgICB9XG4gICAgICAgIH1cbiAgICAgIH1cbiAgICB9XG5cbiAgICAmIC5teC1mb290ZXJfX2xpbmtzIHtcbiAgICAgIGdyaWQtYXJlYTogbGlua3M7XG4gICAgICBhbGlnbi1zZWxmOiBlbmQ7XG5cbiAgICAgIEBtZWRpYSAoLS1tZWRpdW0tdXApIHtcbiAgICAgICAganVzdGlmeS1jb250ZW50OiBlbmQ7XG4gICAgICB9XG5cbiAgICAgICY6bm90KDpmaXJzdC1jaGlsZCkge1xuICAgICAgICBtYXJnaW4tYmxvY2stc3RhcnQ6IHZhcigtLWdhcCk7XG4gICAgICB9XG4gICAgfVxuICB9XG5cbiAgLm14LWZvb3Rlcl9fYW9jIHtcbiAgICBncmlkLWFyZWE6IGFvYztcbiAgICBwYWRkaW5nLWJsb2NrLWVuZDogdmFyKC0tZm9vdGVyLXJvdy1nYXAsIHZhcigtLXNwYWNpbmcteHhsKSk7XG4gICAgYm9yZGVyLWJsb2NrLWVuZDogdmFyKC0tbGluZS13aWR0aCwgMXB4KSBzb2xpZFxuICAgICAgdmFyKC0tbGluZS1jb2xvdXIsIHZhcigtLWNvbG91ci1ib3JkZXIpKTtcbiAgICBtYXJnaW4tYmxvY2stZW5kOiB2YXIoLS1nYXApO1xuICAgIHRleHQtYWxpZ246IGNlbnRlcjtcbiAgfVxuXG4gIC5teC1uYXYtLWZvb3RlciB7XG4gICAgZ3JpZC1hcmVhOiBuYXZpZ2F0aW9uO1xuICAgIG1hcmdpbi1ibG9jazogdmFyKC0tc3BhY2luZy14eHhsKSB2YXIoLS1zcGFjaW5nLWwpO1xuXG4gICAgQG1lZGlhICgtLW1lZGl1bS11cCkge1xuICAgICAganVzdGlmeS1zZWxmOiBlbmQ7XG4gICAgICBtYXJnaW4tYmxvY2s6IDA7XG4gICAgfVxuXG4gICAgJjpub3QoOmhhcygubXgtbmF2X19sZXZlbC0yKSkgdWwge1xuICAgICAgZmxleC1mbG93OiByb3cgd3JhcDtcbiAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgICBnYXA6IHZhcigtLXNwYWNpbmctbCkgdmFyKC0tc3BhY2luZy14eHhsKTtcbiAgICB9XG5cbiAgICAmOmhhcygubXgtbmF2X19sZXZlbC0yKSB7XG4gICAgICAmIHVsIHtcbiAgICAgICAgZGlzcGxheTogZ3JpZDtcbiAgICAgIH1cblxuICAgICAgJiAubXgtbmF2X19sZXZlbC0xIHtcbiAgICAgICAgZ2FwOiB2YXIoLS1zcGFjaW5nLWwpIHZhcigtLXNwYWNpbmcteHh4bCk7XG4gICAgICAgIGdyaWQtdGVtcGxhdGUtY29sdW1uczogMWZyIDFmcjtcblxuICAgICAgICBAbWVkaWEgKC0tbWVkaXVtLXVwKSB7XG4gICAgICAgICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiAxZnIgMWZyIDFmcjtcbiAgICAgICAgfVxuXG4gICAgICAgICYgPiBsaSA+IGEge1xuICAgICAgICAgIGRpc3BsYXk6IGlubGluZS1ibG9jaztcbiAgICAgICAgICBtYXJnaW4tYmxvY2stZW5kOiB2YXIoLS1zcGFjaW5nLWwpO1xuICAgICAgICAgIGZvbnQtd2VpZ2h0OiB2YXIoLS1mb250LXdlaWdodC1ib2xkKTtcbiAgICAgICAgfVxuICAgICAgfVxuXG4gICAgICAmIC5teC1uYXZfX2xldmVsLTIge1xuICAgICAgICBnYXA6IHZhcigtLXNwYWNpbmcteHMpO1xuICAgICAgfVxuICAgIH1cblxuICAgICYgLm14LW5hdl9fdG9nZ2xlIHtcbiAgICAgIGRpc3BsYXk6IG5vbmU7XG4gICAgfVxuICB9XG59XG5cbkBtZWRpYSBwcmludCB7XG4gIC5teC1mb290ZXIge1xuICAgIGRpc3BsYXk6IG5vbmU7XG4gIH1cbn1cbiJdfQ== */
|
|
1
|
+
@layer design-system.layouts{.mx-footer{position:sticky;inset-block-start:100vh}.mx-footer__inner{display:grid;grid-template-areas:"brand" "social" "navigation" "copyright" "links"}@media (min-width: 720px){.mx-footer__inner{grid-template-areas:"brand navigation" "social navigation" "copyright links";gap:0}}.mx-footer__inner:has(.mx-footer__aoc){grid-template-areas:"aoc" "brand" "social" "navigation" "copyright" "links"}@media (min-width: 720px){.mx-footer__inner:has(.mx-footer__aoc){grid-template-areas:"aoc aoc" "brand navigation" "social navigation" "copyright links"}}.mx-footer__inner .mx-logo{grid-area:brand;margin-block-end:var(--gap)}.mx-footer__inner .mx-social-links{grid-area:social;align-self:end;display:flex;gap:var(--spacing-xxxs)}.mx-footer__inner .mx-footer__copyright{grid-area:copyright;align-self:end}:is(.mx-footer__inner .mx-footer__copyright):not(:first-child){padding-block-start:var(--spacing-s);margin-block-start:var(--gap)}@media (min-width: 720px){:is(.mx-footer__inner .mx-footer__copyright):not(:first-child)+.mx-footer__links{padding-block-start:var(--spacing-s)}}.mx-footer__inner .mx-footer__links{grid-area:links;align-self:end}@media (min-width: 720px){.mx-footer__inner .mx-footer__links{justify-content:end}}:is(.mx-footer__inner .mx-footer__links):not(:first-child){margin-block-start:var(--gap)}.mx-footer__aoc{grid-area:aoc;padding-block-end:var(--footer-row-gap, var(--spacing-xxl));margin-block-end:var(--gap);text-align:center}.mx-nav--footer{grid-area:navigation;margin-block:var(--spacing-xxxl) var(--spacing-l)}@media (min-width: 720px){.mx-nav--footer{justify-self:end;margin-block:0}}.mx-nav--footer:not(:has(.mx-nav__level-2)) ul{flex-flow:row wrap;align-items:center;gap:var(--spacing-l) var(--spacing-xxxl)}.mx-nav--footer:has(.mx-nav__level-2) ul{display:grid}.mx-nav--footer:has(.mx-nav__level-2) .mx-nav__level-1{gap:var(--spacing-l) var(--spacing-xxxl);grid-template-columns:1fr 1fr}@media (min-width: 720px){.mx-nav--footer:has(.mx-nav__level-2) .mx-nav__level-1{grid-template-columns:1fr 1fr 1fr}}:is(.mx-nav--footer:has(.mx-nav__level-2) .mx-nav__level-1)>li>a{display:inline-block;margin-block-end:var(--spacing-l);font-weight:var(--font-weight-bold)}.mx-nav--footer:has(.mx-nav__level-2) .mx-nav__level-2{gap:var(--spacing-xs)}.mx-nav--footer .mx-nav__toggle{display:none}}@media print{.mx-footer{display:none}}
|