@phillips/seldon 1.168.0 → 1.169.0

package/dist/components/Drawer/Drawer.d.ts

@@ -12,6 +12,14 @@ export interface DrawerProps extends React.HTMLAttributes<HTMLDivElement> {
      * The content of the drawer
      */
     children?: React.ReactNode;
+    /**
+     * Which side the drawer opens from: left, right, or bottom
+     */
+    drawerOpenSide?: 'left' | 'right' | 'bottom';
+    /**
+     * Optional label for the bottom content area
+     */
+    bottomContentLabel?: string;
 }
 /**
  * ## Overview
@@ -19,5 +27,5 @@ export interface DrawerProps extends React.HTMLAttributes<HTMLDivElement> {
  * A component for displaying a drawer.
  *
  */
-declare const Drawer: ({ className, isOpen, onClose, children, ...props }: DrawerProps) => import("react/jsx-runtime").JSX.Element;
+declare const Drawer: ({ className, isOpen, onClose, children, drawerOpenSide, bottomContentLabel, ...props }: DrawerProps) => import("react/jsx-runtime").JSX.Element;
 export default Drawer;

package/dist/components/Drawer/Drawer.js

@@ -1,48 +1,80 @@
-import { jsx as r, jsxs as s } from "react/jsx-runtime";
-import { getCommonProps as d, noOp as p } from "../../utils/index.js";
+import { jsx as o, jsxs as e } from "react/jsx-runtime";
+import { Root as u, Portal as N, Overlay as v, Content as $, Title as x, Description as y, Close as n } from "../../node_modules/@radix-ui/react-dialog/dist/index.js";
 import a from "../../node_modules/classnames/index.js";
-import { Root as f, Portal as C, Overlay as h, Content as u, Title as N, Description as v, Close as w } from "../../node_modules/@radix-ui/react-dialog/dist/index.js";
-import y from "../IconButton/IconButton.js";
-import { ButtonVariants as _ } from "../Button/types.js";
-import x from "../Icon/Icon.js";
-const B = ({ className: i, isOpen: l = !1, onClose: o = p, children: n, ...t }) => {
-  const { className: e, ...m } = d(t, "Drawer");
-  return /* @__PURE__ */ r(
-    f,
+import { getCommonProps as g, noOp as w } from "../../utils/index.js";
+import { ButtonVariants as c } from "../Button/types.js";
+import m from "../Icon/Icon.js";
+import d from "../IconButton/IconButton.js";
+import k from "../Text/Text.js";
+import { TextVariants as B } from "../Text/types.js";
+const q = ({
+  className: h,
+  isOpen: p = !1,
+  onClose: r = w,
+  children: C,
+  drawerOpenSide: i = "right",
+  bottomContentLabel: f,
+  ...l
+}) => {
+  const { className: t, ..._ } = g(l, "Drawer"), s = i === "bottom";
+  return /* @__PURE__ */ o(
+    u,
     {
-      open: l,
-      onOpenChange: (c) => {
-        c || o();
+      open: p,
+      onOpenChange: (b) => {
+        b || r();
       },
-      children: /* @__PURE__ */ s(C, { children: [
-        /* @__PURE__ */ r(
-          h,
+      children: /* @__PURE__ */ e(N, { children: [
+        /* @__PURE__ */ o(
+          v,
           {
-            onClick: o,
-            className: a(`${e}__overlay`),
+            onClick: r,
+            className: a(`${t}__overlay`),
             "data-testid": "drawer-overlay"
           }
         ),
-        /* @__PURE__ */ s(u, { className: a(e, i), id: t.id, ...m, children: [
-          /* @__PURE__ */ r(N, {}),
-          /* @__PURE__ */ r(v, {}),
-          /* @__PURE__ */ r(w, { asChild: !0, children: /* @__PURE__ */ r(
-            y,
-            {
-              onClick: o,
-              className: a(`${e}__close`),
-              "aria-label": "Close",
-              "data-testid": "drawer-close",
-              variant: _.tertiary,
-              children: /* @__PURE__ */ r(x, { icon: "CloseX", color: "currentColor" })
-            }
-          ) }),
-          n
-        ] })
+        /* @__PURE__ */ e(
+          $,
+          {
+            className: a(t, h, { [`${t}--bottom`]: s }),
+            "data-side": i,
+            id: l.id,
+            ..._,
+            children: [
+              /* @__PURE__ */ o(x, {}),
+              /* @__PURE__ */ o(y, {}),
+              s ? /* @__PURE__ */ e("div", { className: `${t}__bottom-content`, children: [
+                /* @__PURE__ */ o(n, { asChild: !0, children: /* @__PURE__ */ o(
+                  d,
+                  {
+                    onClick: r,
+                    className: a(`${t}__close--bottom`),
+                    "aria-label": "Close",
+                    "data-testid": "drawer-close",
+                    variant: c.tertiary,
+                    children: /* @__PURE__ */ o(m, { icon: "CloseX", color: "currentColor" })
+                  }
+                ) }),
+                /* @__PURE__ */ o(k, { variant: B.string1, className: `${t}__bottom-content--label`, children: f })
+              ] }) : /* @__PURE__ */ o(n, { asChild: !0, children: /* @__PURE__ */ o(
+                d,
+                {
+                  onClick: r,
+                  className: a(`${t}__close`),
+                  "aria-label": "Close",
+                  "data-testid": "drawer-close",
+                  variant: c.tertiary,
+                  children: /* @__PURE__ */ o(m, { icon: "CloseX", color: "currentColor" })
+                }
+              ) }),
+              C
+            ]
+          }
+        )
       ] })
     }
   );
 };
 export {
-  B as default
+  q as default
 };

package/dist/components/Drawer/Drawer.stories.d.ts

@@ -1,7 +1,7 @@
 import { DrawerProps } from './Drawer';
 declare const meta: {
     title: string;
-    component: ({ className, isOpen, onClose, children, ...props }: DrawerProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ className, isOpen, onClose, children, drawerOpenSide, bottomContentLabel, ...props }: DrawerProps) => import("react/jsx-runtime").JSX.Element;
 };
 export default meta;
 export declare const Playground: {

package/dist/index.d.ts

@@ -66,6 +66,7 @@ export * from './components/PinchZoom';
 export * from './components/SeldonImage';
 export * from './components/Tabs';
 export * from './patterns/DetailList';
+export * from './patterns/FiltersInline';
 export * from './patterns/SaleCard';
 export * from './patterns/SaleHeaderBanner';
 export * from './patterns/ViewingDetails';

package/dist/index.js

@@ -2,11 +2,11 @@ import { PaddingTokens as a, SpacingTokens as f, defaultYear as s, emailValidati
 import { default as C } from "./pages/Page.js";
 import { SSRMediaQuery as P, ssrMediaQueryStyle as A } from "./providers/SeldonProvider/utils.js";
 import { usePendingState as L } from "./utils/hooks.js";
-import { AuctionStatus as b, LotStatus as I, SupportedLanguages as h } from "./types/commonTypes.js";
+import { AuctionStatus as V, LotStatus as b, SupportedLanguages as h } from "./types/commonTypes.js";
 import { default as w } from "./components/Button/Button.js";
 import { ButtonVariants as y } from "./components/Button/types.js";
-import { default as H } from "./components/IconButton/IconButton.js";
-import { default as F } from "./components/Accordion/Accordion.js";
+import { default as F } from "./components/IconButton/IconButton.js";
+import { default as M } from "./components/Accordion/Accordion.js";
 import { default as E } from "./components/Accordion/AccordionItem.js";
 import { AccordionItemVariant as U, AccordionVariants as O } from "./components/Accordion/types.js";
 import { default as Q } from "./components/Breadcrumb/Breadcrumb.js";
@@ -29,12 +29,12 @@ import { default as ce } from "./components/Dropdown/Dropdown.js";
 import { default as Ce } from "./components/ErrorBoundary/ErrorBoundary.js";
 import { Grid as Pe } from "./components/Grid/Grid.js";
 import { default as Be } from "./components/GridItem/GridItem.js";
-import { GridItemAlign as Ve } from "./components/GridItem/types.js";
-import { default as Ie } from "./components/Input/Input.js";
+import { GridItemAlign as Ie } from "./components/GridItem/types.js";
+import { default as be } from "./components/Input/Input.js";
 import { default as ke } from "./components/Link/Link.js";
 import { LinkVariants as ve } from "./components/Link/types.js";
 import { default as De } from "./components/LinkBlock/LinkBlock.js";
-import { default as Me } from "./components/LinkList/LinkList.js";
+import { default as He } from "./components/LinkList/LinkList.js";
 import { default as Ne } from "./components/Modal/Modal.js";
 import { default as Ge } from "./components/Navigation/Navigation.js";
 import { default as Oe } from "./components/Navigation/NavigationItem/NavigationItem.js";
@@ -55,12 +55,12 @@ import { TextAlignments as gt, TextVariants as ct } from "./components/Text/type
 import { default as Ct } from "./components/Text/Text.js";
 import { TextSymbolVariants as Pt } from "./components/TextSymbol/types.js";
 import { default as Bt } from "./components/TextSymbol/TextSymbol.js";
-import { default as Vt } from "./components/Video/Video.js";
-import { default as It } from "./patterns/DetailList/DetailList.js";
+import { default as It } from "./components/Video/Video.js";
+import { default as bt } from "./patterns/DetailList/DetailList.js";
 import { DetailListAlignment as kt } from "./patterns/DetailList/types.js";
 import { default as vt } from "./patterns/FavoritesCollectionTile/FavoritesCollectionTile.js";
 import { default as Dt } from "./patterns/HeroBanner/HeroBanner.js";
-import { default as Mt } from "./patterns/LanguageSelector/LanguageSelector.js";
+import { default as Ht } from "./patterns/LanguageSelector/LanguageSelector.js";
 import { default as Nt } from "./patterns/SaleHeaderBanner/SaleHeaderBanner.js";
 import { default as Gt } from "./patterns/SaleHeaderBanner/SaleHeaderBrowseAuctions.js";
 import { default as Ot } from "./patterns/Social/Social.js";
@@ -77,46 +77,47 @@ import { default as so } from "./components/ExitGateCard/ExitGateCard.js";
 import { default as mo } from "./components/Loader/Loader.js";
 import { default as uo } from "./components/PageContentWrapper/PageContentWrapper.js";
 import { default as io } from "./components/PhoneNumberPicker/PhoneNumberPicker.js";
-import { default as go } from "./patterns/SaleCard/SaleCard.js";
-import { SaleCardActions as So } from "./patterns/SaleCard/SaleCardActions.js";
-import { SaleCardVariants as To } from "./patterns/SaleCard/types.js";
-import { default as Ao } from "./patterns/ViewingDetails/ViewingDetails.js";
-import { default as Lo } from "./site-furniture/Footer/Footer.js";
-import { default as bo } from "./site-furniture/Header/Header.js";
-import { default as ho } from "./components/AddToCalendar/AddToCalendar.js";
-import { default as wo } from "./components/Article/Article.js";
-import { default as yo } from "./components/Countdown/Countdown.js";
-import { CountdownVariants as Ho } from "./components/Countdown/types.js";
-import { default as Fo } from "./components/Divider/Divider.js";
-import { default as Eo } from "./components/FavoritingTileButton/FavoritingTileButton.js";
-import { default as Uo } from "./components/Filter/Filter.js";
-import { default as Ro } from "./components/Filter/FilterInput.js";
-import { default as jo } from "./components/Filter/FilterHeader.js";
-import { default as Wo } from "./components/Pictogram/Pictogram.js";
-import { default as Zo } from "./components/TextArea/TextArea.js";
-import { default as Jo } from "./components/Toast/Toast.js";
-import { ToastProvider as Xo } from "./components/Toast/ToastContextProvider.js";
-import { useToast as $o } from "./components/Toast/useToast.js";
-import { default as tr } from "./patterns/AccountPageHeader/AccountPageHeader.js";
-import { default as rr } from "./patterns/BidSnapshot/BidSnapshot.js";
-import { default as fr } from "./patterns/BidSnapshot/BidMessage.js";
-import { BidMessageVariants as lr, BidStatusEnum as dr } from "./patterns/BidSnapshot/types.js";
-import { default as pr } from "./patterns/FilterMenu/FilterMenu.js";
-import { default as xr } from "./patterns/ObjectTile/ObjectTile.js";
+import { default as go } from "./patterns/FiltersInline/FiltersInline.js";
+import { default as So } from "./patterns/SaleCard/SaleCard.js";
+import { SaleCardActions as To } from "./patterns/SaleCard/SaleCardActions.js";
+import { SaleCardVariants as Ao } from "./patterns/SaleCard/types.js";
+import { default as Lo } from "./patterns/ViewingDetails/ViewingDetails.js";
+import { default as Vo } from "./site-furniture/Footer/Footer.js";
+import { default as ho } from "./site-furniture/Header/Header.js";
+import { default as wo } from "./components/AddToCalendar/AddToCalendar.js";
+import { default as yo } from "./components/Article/Article.js";
+import { default as Fo } from "./components/Countdown/Countdown.js";
+import { CountdownVariants as Mo } from "./components/Countdown/types.js";
+import { default as Eo } from "./components/Divider/Divider.js";
+import { default as Uo } from "./components/FavoritingTileButton/FavoritingTileButton.js";
+import { default as Ro } from "./components/Filter/Filter.js";
+import { default as jo } from "./components/Filter/FilterInput.js";
+import { default as Wo } from "./components/Filter/FilterHeader.js";
+import { default as Zo } from "./components/Pictogram/Pictogram.js";
+import { default as Jo } from "./components/TextArea/TextArea.js";
+import { default as Xo } from "./components/Toast/Toast.js";
+import { ToastProvider as $o } from "./components/Toast/ToastContextProvider.js";
+import { useToast as tr } from "./components/Toast/useToast.js";
+import { default as rr } from "./patterns/AccountPageHeader/AccountPageHeader.js";
+import { default as fr } from "./patterns/BidSnapshot/BidSnapshot.js";
+import { default as lr } from "./patterns/BidSnapshot/BidMessage.js";
+import { BidMessageVariants as mr, BidStatusEnum as pr } from "./patterns/BidSnapshot/types.js";
+import { default as xr } from "./patterns/FilterMenu/FilterMenu.js";
+import { default as nr } from "./patterns/ObjectTile/ObjectTile.js";
 export {
-  F as Accordion,
+  M as Accordion,
   E as AccordionItem,
   U as AccordionItemVariant,
   O as AccordionVariants,
-  tr as AccountPageHeader,
-  ho as AddToCalendar,
-  wo as Article,
-  b as AuctionStatus,
+  rr as AccountPageHeader,
+  wo as AddToCalendar,
+  yo as Article,
+  V as AuctionStatus,
   Yt as AuthState,
-  fr as BidMessage,
-  lr as BidMessageVariants,
-  rr as BidSnapshot,
-  dr as BidStatusEnum,
+  lr as BidMessage,
+  mr as BidMessageVariants,
+  fr as BidSnapshot,
+  pr as BidStatusEnum,
   Q as Breadcrumb,
   w as Button,
   y as ButtonVariants,
@@ -132,56 +133,57 @@ export {
   ao as ComposedModal,
   de as ContentPeek,
   pe as ContentPeekHeightUnits,
-  yo as Countdown,
-  Ho as CountdownVariants,
+  Fo as Countdown,
+  Mo as CountdownVariants,
   xe as Detail,
-  It as DetailList,
+  bt as DetailList,
   kt as DetailListAlignment,
-  Fo as Divider,
+  Eo as Divider,
   ne as Drawer,
   ce as Dropdown,
   Ce as ErrorBoundary,
   so as ExitGateCard,
   vt as FavoritesCollectionTile,
-  Eo as FavoritingTileButton,
-  Uo as Filter,
-  jo as FilterHeader,
-  Ro as FilterInput,
-  pr as FilterMenu,
-  Lo as Footer,
+  Uo as FavoritingTileButton,
+  Ro as Filter,
+  Wo as FilterHeader,
+  jo as FilterInput,
+  xr as FilterMenu,
+  go as FiltersInline,
+  Vo as Footer,
   Pe as Grid,
   Be as GridItem,
-  Ve as GridItemAlign,
-  bo as Header,
+  Ie as GridItemAlign,
+  ho as Header,
   Dt as HeroBanner,
   z as Icon,
-  H as IconButton,
-  Ie as Input,
-  Mt as LanguageSelector,
+  F as IconButton,
+  be as Input,
+  Ht as LanguageSelector,
   ke as Link,
   De as LinkBlock,
-  Me as LinkList,
+  He as LinkList,
   ve as LinkVariants,
   mo as Loader,
-  I as LotStatus,
+  b as LotStatus,
   Ne as Modal,
   Ge as Navigation,
   Oe as NavigationItem,
   Qe as NavigationItemTrigger,
   ze as NavigationList,
-  xr as ObjectTile,
+  nr as ObjectTile,
   a as PaddingTokens,
   C as Page,
   uo as PageContentWrapper,
   Ye as Pagination,
   io as PhoneNumberPicker,
-  Wo as Pictogram,
+  Zo as Pictogram,
   qe as PinchZoom,
   Ke as Row,
   P as SSRMediaQuery,
-  go as SaleCard,
-  So as SaleCardActions,
-  To as SaleCardVariants,
+  So as SaleCard,
+  To as SaleCardActions,
+  Ao as SaleCardVariants,
   Nt as SaleHeaderBanner,
   Gt as SaleHeaderBrowseAuctions,
   _e as Search,
@@ -202,15 +204,15 @@ export {
   it as TagsList,
   Ct as Text,
   gt as TextAlignments,
-  Zo as TextArea,
+  Jo as TextArea,
   Pt as TextSymbolVariants,
   Bt as TextSymbols,
   ct as TextVariants,
-  Jo as Toast,
-  Xo as ToastProvider,
+  Xo as Toast,
+  $o as ToastProvider,
   qt as UserManagement,
-  Vt as Video,
-  Ao as ViewingDetails,
+  It as Video,
+  Lo as ViewingDetails,
   _t as ViewingsList,
   s as defaultYear,
   l as emailValidation,
@@ -225,5 +227,5 @@ export {
   A as ssrMediaQueryStyle,
   c as useNormalizedInputProps,
   L as usePendingState,
-  $o as useToast
+  tr as useToast
 };

package/dist/patterns/FilterMenu/FilterMenu.d.ts

@@ -16,7 +16,7 @@ export interface FilterMenuProps<ElementType = HTMLFormElement> extends React.HT
  *
  * [Figma Link](https://www.figma.com/design/OvBXAq48blO1r4qYbeBPjW/RW---Sale-Page-(PLP)?node-id=892-71019&node-type=frame&t=AsBDn4UgUEjNUnf7-0)
  *
- * [Storybook Link](https://phillips-seldon.netlify.app/?path=/docs/patterns-filtercontrol--overview)
+ * [Storybook Link](https://phillips-seldon.netlify.app/?path=/docs/patterns-filtermenu--overview)
  */
 declare const FilterMenu: React.ForwardRefExoticComponent<FilterMenuProps<HTMLFormElement> & React.RefAttributes<HTMLFormElement>>;
 export default FilterMenu;

package/dist/patterns/FilterMenu/FilterMenu.js

@@ -1,23 +1,23 @@
 import { jsx as u } from "react/jsx-runtime";
-import d, { forwardRef as F, useState as N, Children as w, cloneElement as C } from "react";
-import { getCommonProps as g } from "../../utils/index.js";
-import t from "../../node_modules/classnames/index.js";
-import A from "../../components/Filter/Filter.js";
+import d, { forwardRef as F, useState as N, Children as w, cloneElement as g } from "react";
+import { getCommonProps as A } from "../../utils/index.js";
+import a from "../../node_modules/classnames/index.js";
+import C from "../../components/Filter/Filter.js";
 const V = F(
-  ({ className: a, children: l, element: i = "form", ...r }, m) => {
-    const { className: n, ...p } = g(r, "FilterMenu"), [o, f] = N(null), s = o?.length, c = w.map(
+  ({ className: t, children: l, element: i = "form", ...r }, m) => {
+    const { className: n, ...p } = A(r, "FilterMenu"), [o, f] = N(null), s = o?.length, c = w.map(
       l,
-      (e) => d.isValidElement(e) && e.type === A ? C(e, {
+      (e) => d.isValidElement(e) && e.type === C ? g(e, {
         setViewAllFilter: f,
         hidden: s ? o !== e.props.name : !1,
         isViewingAll: s,
-        className: s && t(e.props.className, "is-opening")
+        className: s && a(e.props.className, "is-opening")
       }) : e
     );
-    return /* @__PURE__ */ u(i, { ...p, ...r, className: t(n, a), ref: m, children: c });
+    return /* @__PURE__ */ u(i, { ...p, ...r, className: a(n, t), ref: m, children: c });
   }
 );
-V.displayName = "FilterControl";
+V.displayName = "FilterMenu";
 export {
   V as default
 };

package/dist/patterns/FiltersInline/FilterButton.d.ts

@@ -0,0 +1,28 @@
+import { default as React } from 'react';
+import { FilterButtonIconType } from './types';
+/**
+ * Props for the FilterButton component.
+ */
+export type FilterButton = {
+    /** Optional CSS class for the filter button */
+    className?: string;
+    /** The text label displayed on the button */
+    label: string;
+    /** Click handler for the button */
+    onClick: () => void;
+    /** Whether the button is currently selected/active */
+    isSelected: boolean;
+    /** Icon type to display (defaults to ChevronDown) */
+    type: FilterButtonIconType;
+    /** Count badge to show next to the button */
+    count: number;
+    /** Optional unique identifier for the button (used for test IDs) */
+    id?: string;
+    /** Optional aria-label for accessibility */
+    ariaLabel?: string;
+    /** If true, applies mobile-specific styling */
+    isMobile?: boolean;
+    /** Total number of filters for this button */
+    totalCount: number;
+};
+export declare const FilterButton: React.ForwardRefExoticComponent<FilterButton & React.RefAttributes<HTMLButtonElement>>;

package/dist/patterns/FiltersInline/FilterButton.js

@@ -0,0 +1,35 @@
+import { jsxs as p, jsx as e } from "react/jsx-runtime";
+import u from "../../node_modules/classnames/index.js";
+import b from "react";
+import h from "../../components/Button/Button.js";
+import { ButtonVariants as $ } from "../../components/Button/types.js";
+import x from "../../components/Icon/Icon.js";
+import { TextVariants as v } from "../../components/Text/types.js";
+import w from "../../components/Text/Text.js";
+import { px as t } from "../../utils/index.js";
+import { getIcon as B } from "./utils.js";
+const F = b.forwardRef(
+  ({ className: m, label: n, onClick: l, isSelected: a, type: r = "ChevronDown", count: s, id: o, ariaLabel: f, isMobile: c, totalCount: i }, d) => /* @__PURE__ */ p(
+    h,
+    {
+      ref: d,
+      className: u(`${t}-filter-button`, m, {
+        [`${t}-filter-button--selected`]: a || s > 0 || r === "Filter" && i > 0
+      }),
+      "aria-label": f,
+      variant: $.secondary,
+      "data-testid": `${o}-filter-button`,
+      "data-viewport": c ? "mobile" : "desktop",
+      onClick: l,
+      children: [
+        /* @__PURE__ */ e(w, { variant: v.string2, "data-testid": `${o}-filter-label`, children: n }),
+        /* @__PURE__ */ e(x, { icon: B(r, a), height: 8, width: 8, className: `${t}__icon` }),
+        i > 0 && r === "Filter" && /* @__PURE__ */ e("div", { className: `${t}-filter-button--count`, "data-testid": `${o}-filter-count`, children: i })
+      ]
+    }
+  )
+);
+F.displayName = "FilterButton";
+export {
+  F as FilterButton
+};

package/dist/patterns/FiltersInline/FilterDropdownMenuDesktop.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+import { FilterDropdownMenuProps } from './types';
+export declare const FilterDropdownMenuDesktop: React.ForwardRefExoticComponent<FilterDropdownMenuProps & React.RefAttributes<HTMLDivElement>>;

package/dist/patterns/FiltersInline/FilterDropdownMenuDesktop.js

@@ -0,0 +1,92 @@
+import { jsxs as p, jsx as r, Fragment as C } from "react/jsx-runtime";
+import e from "../../node_modules/classnames/index.js";
+import F from "react";
+import n from "../../components/Button/Button.js";
+import { ButtonVariants as s } from "../../components/Button/types.js";
+import v from "../../components/Filter/FilterHeader.js";
+import D from "../../components/Filter/FilterInput.js";
+import m from "../../components/Text/Text.js";
+import { TextVariants as c } from "../../components/Text/types.js";
+import { px as B } from "../../utils/index.js";
+import { getFilterButtonLabel as S, getFilterDimensions as j, handleInputChange as A } from "./utils.js";
+const I = F.forwardRef(
+  ({
+    className: f,
+    buttonType: i,
+    filters: _,
+    filterIndex: h,
+    onSelectFilter: b,
+    onClickClear: u,
+    onApplyFilter: d,
+    resultsCount: $,
+    ariaLabels: N,
+    filterButtonLabel: x,
+    filterButtonLabelTranslated: g,
+    dropdownMenuTranslation: o
+  }, k) => {
+    const l = i === "Sort", t = `${B}-filter-dropdown-menu`;
+    return /* @__PURE__ */ p(
+      "div",
+      {
+        className: e(t, f),
+        ref: k,
+        "data-testid": "filter-dropdown-desktop",
+        "aria-label": N || `${i} dropdown desktop`,
+        children: [
+          /* @__PURE__ */ r(
+            v,
+            {
+              heading: S(x, null, g || null),
+              className: e(`${t}__header`)
+            }
+          ),
+          /* @__PURE__ */ r("div", { className: e(`${t}__filters`), children: j(_, h).map((a) => /* @__PURE__ */ r(
+            D,
+            {
+              id: a.label,
+              labelText: a.label,
+              name: a.label,
+              type: l ? "radio" : "checkbox",
+              checked: a.active,
+              disabled: a?.disabled,
+              onChange: (w) => A(w, i ?? "", b)
+            },
+            a.label
+          )) }),
+          /* @__PURE__ */ r("div", { className: e(l ? `${t}__button-wrap` : `${t}__buttons-wrap`), children: l ? /* @__PURE__ */ r(
+            n,
+            {
+              className: e(`${t}__button`),
+              variant: s.primary,
+              onClick: () => d?.(!1),
+              children: /* @__PURE__ */ r(m, { variant: c.string2, className: `${t}__button-text`, children: o?.confirm || "Confirm" })
+            }
+          ) : /* @__PURE__ */ p(C, { children: [
+            /* @__PURE__ */ r(
+              n,
+              {
+                className: e(`${t}__buttons`),
+                variant: s.secondary,
+                onClick: () => u?.(i ?? ""),
+                children: /* @__PURE__ */ r(m, { variant: c.string2, children: o?.clearAll || "Clear all" })
+              }
+            ),
+            /* @__PURE__ */ r(
+              n,
+              {
+                className: e(`${t}__buttons`),
+                variant: s.primary,
+                onClick: () => d?.(!1),
+                children: /* @__PURE__ */ r(m, { variant: c.string2, className: `${t}__button-text`, children: o?.showAuctions || `Show ${$} Auctions` })
+              }
+            )
+          ] }) })
+        ]
+      }
+    );
+  }
+);
+I.displayName = "FilterDropdownMenuDesktop";
+export {
+  I as FilterDropdownMenuDesktop
+};

package/dist/patterns/FiltersInline/FilterDropdownMenuMobile.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+import { FilterDropdownMenuProps } from './types';
+export declare const FilterDropdownMenuMobile: React.ForwardRefExoticComponent<FilterDropdownMenuProps & React.RefAttributes<HTMLDivElement>>;