@phillips/seldon 1.38.4 → 1.38.6

package/dist/components/Accordion/Accordion.d.ts

@@ -1,13 +1,30 @@
+import { AccordionVariantKey } from './types';
 import React from 'react';
 export interface AccordionProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
      * Unique id for component testing
      */
     id?: string;
+    /**
+     * Determines the Accordion variant to use. `multiple` allows multiple elements to be opened at the same time.
+     * The `single` variants only allow one element opened at a time.
+     * `singleCollapsible` allows users to close an open element by clicking on it, while `singleNonCollapsible` does not.
+     * Defaults to `multiple`.
+     */
+    variant?: AccordionVariantKey;
     /**
      * Child element pass in to display as item content.
      */
     children?: React.ReactNode;
 }
+/**
+ * ## Overview
+ *
+ * Overview of this component
+ *
+ * [Figma Link](https://www.figma.com/design/xMuOXOAKVt5HC7hgYjF3ot/Components-v2.0?node-id=4433-163013&t=lhB2YjBptvQ97UWF-0)
+ *
+ * [Storybook Link](https://phillips-seldon.netlify.app/?path=/docs/components-accordion--overview)
+ */
 declare const AccordionComponent: ({ className, children, ...props }: AccordionProps) => import("react/jsx-runtime").JSX.Element;
 export default AccordionComponent;

package/dist/components/Accordion/Accordion.js

@@ -1,20 +1,21 @@
-import { jsx as e } from "react/jsx-runtime";
-import s from "../../node_modules/classnames/index.js";
-import { getCommonProps as n } from "../../utils/index.js";
-import { Root as r } from "../../node_modules/@radix-ui/react-accordion/dist/index.js";
-const i = "multiple", C = ({ className: m, children: t, ...o }) => {
-  const { className: a, ...c } = n(o, "Accordion");
-  return /* @__PURE__ */ e(
-    r,
+import { jsx as s } from "react/jsx-runtime";
+import c from "../../node_modules/classnames/index.js";
+import { getCommonProps as i } from "../../utils/index.js";
+import { Root as e } from "../../node_modules/@radix-ui/react-accordion/dist/index.js";
+import { getAccordionVariantProps as d } from "./utils.js";
+const N = ({ className: m, children: t, ...o }) => {
+  const { className: a, ...r } = i(o, "Accordion"), n = d(o.variant);
+  return /* @__PURE__ */ s(
+    e,
     {
-      className: s(`${a}`, m),
-      type: i,
-      ...c,
+      className: c(`${a}`, m),
+      ...r,
+      ...n,
       id: o == null ? void 0 : o.id,
       children: t
     }
   );
 };
 export {
-  C as default
+  N as default
 };

package/dist/components/Accordion/types.d.ts

@@ -41,3 +41,9 @@ export interface AccordionContentType {
     isLargeVariation: boolean;
     isCollapsed: boolean;
 }
+export declare enum AccordionVariants {
+    multiple = "multiple",
+    singleCollapsible = "singleCollapsible",
+    singleNonCollapsible = "singleNonCollapsible"
+}
+export type AccordionVariantKey = keyof typeof AccordionVariants;

package/dist/components/Accordion/types.js

@@ -0,0 +1,4 @@
+var e = /* @__PURE__ */ ((l) => (l.multiple = "multiple", l.singleCollapsible = "singleCollapsible", l.singleNonCollapsible = "singleNonCollapsible", l))(e || {});
+export {
+  e as AccordionVariants
+};

package/dist/components/Accordion/utils.d.ts

@@ -0,0 +1,17 @@
+import { AccordionVariantKey } from './types';
+export interface AccordionVariantProps {
+    /**
+     * Determines whether multiple elements can be opened at the same time or not.
+     */
+    type: 'single' | 'multiple';
+    /**
+     * Determines if an open element can be closed by clicking on it.
+     * Only applicable to the `single` variants.
+     */
+    collapsible?: boolean;
+}
+/**
+ * Sets the type and collapsible props based on the variant prop
+ * The collapsible prop should only be passed when the variant is single
+ */
+export declare const getAccordionVariantProps: (variant?: AccordionVariantKey) => AccordionVariantProps;

package/dist/components/Accordion/utils.js

@@ -0,0 +1,8 @@
+import { AccordionVariants as i } from "./types.js";
+const s = (e) => {
+  const l = { type: "multiple" };
+  return e === i.singleCollapsible && (l.type = "single", l.collapsible = !0), e === i.singleNonCollapsible && (l.type = "single", l.collapsible = !1), l;
+};
+export {
+  s as getAccordionVariantProps
+};

package/dist/components/Navigation/NavigationItem/NavigationItem.d.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { LinkProps } from '../../Link/Link';
 import { LinkVariants } from '../../Link/utils';
 export interface NavigationItemProps extends Omit<React.HTMLAttributes<HTMLLIElement>, 'onClick'> {
     /**
@@ -25,6 +26,10 @@ export interface NavigationItemProps extends Omit<React.HTMLAttributes<HTMLLIEle
      * Optional type for navigation item
      */
     navType?: LinkVariants;
+    /**
+     * Element to render within the navigation item, renders <Link> by default
+     */
+    element?: React.ElementType<LinkProps>;
 }
-declare const NavigationItem: ({ badge, className, href, label, navGroup, navType, onClick, ...props }: React.PropsWithChildren<NavigationItemProps>) => import("react/jsx-runtime").JSX.Element;
+declare const NavigationItem: ({ badge, className, href, label, navGroup, navType, onClick, element: Component, ...props }: React.PropsWithChildren<NavigationItemProps>) => import("react/jsx-runtime").JSX.Element;
 export default NavigationItem;

package/dist/components/Navigation/NavigationItem/NavigationItem.js

@@ -1,35 +1,36 @@
-import { jsx as a, jsxs as d } from "react/jsx-runtime";
-import * as p from "react";
-import { px as t } from "../../../utils/index.js";
-import f from "../../../node_modules/classnames/index.js";
-import x from "../../Link/Link.js";
-import { LinkVariants as v } from "../../Link/utils.js";
-import { HeaderContext as _ } from "../../Header/Header.js";
-const k = ({
+import { jsx as t, jsxs as p } from "react/jsx-runtime";
+import * as f from "react";
+import { px as a } from "../../../utils/index.js";
+import x from "../../../node_modules/classnames/index.js";
+import v from "../../Link/Link.js";
+import { LinkVariants as _ } from "../../Link/utils.js";
+import { HeaderContext as h } from "../../Header/Header.js";
+const C = ({
   badge: e,
-  className: m = "",
+  className: i = "",
   href: r,
   label: n,
   navGroup: s,
-  navType: i,
+  navType: m,
   onClick: o,
-  ...l
+  element: l = v,
+  ...c
 }) => {
-  const { expandedItem: c } = p.useContext(_);
-  return /* @__PURE__ */ a(
+  const { expandedItem: d } = f.useContext(h);
+  return /* @__PURE__ */ t(
     "li",
     {
-      ...l,
+      ...c,
       onClick: o,
       "data-testid": `nav-item-${n}`,
-      className: f(`${t}-nav__item`, s, m),
-      children: /* @__PURE__ */ d(x, { href: r, variant: i || v.navMain, tabIndex: c === "" ? 0 : -1, children: [
-        /* @__PURE__ */ a("span", { className: `${t}-nav__item--label`, children: n }),
-        e ? /* @__PURE__ */ a("span", { className: `${t}-nav__item--badge `, children: e }) : null
+      className: x(`${a}-nav__item`, s, i),
+      children: /* @__PURE__ */ p(l, { href: r, variant: m || _.navMain, tabIndex: d === "" ? 0 : -1, children: [
+        /* @__PURE__ */ t("span", { className: `${a}-nav__item--label`, children: n }),
+        e ? /* @__PURE__ */ t("span", { className: `${a}-nav__item--badge `, children: e }) : null
       ] })
     }
   );
 };
 export {
-  k as default
+  C as default
 };

package/dist/scss/_utils.scss

@@ -56,6 +56,7 @@
   display: grid;
   gap: $spacing-md;
   grid-template-columns: repeat($columns, 1fr);
+  row-gap: $spacing-lg;
 
   @if $margins-on {
     @include gridMargins;
@@ -66,6 +67,7 @@
   display: grid;
   gap: $spacing-md;
   grid-template-columns: repeat(2, 1fr);
+  row-gap: $spacing-lg;
 
   @media (min-width: $breakpoint-md) {
     grid-template-columns: repeat(4, 1fr);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@phillips/seldon",
-  "version": "1.38.4",
+  "version": "1.38.6",
   "repository": {
     "type": "git",
     "url": "https://github.com/PhillipsAuctionHouse/seldon"