@phillips/seldon 1.33.0 → 1.34.0

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

@@ -32,6 +32,10 @@ export interface AccordionItemProps extends React.HTMLAttributes<HTMLDivElement>
      * When true applied the transition keyframe animation on item expand. Default as false.
      */
     hasTransition?: boolean;
+    /**
+     * When true, isCollapsed won't be toggled.
+     */
+    isControlled?: boolean;
 }
-declare const AccordionItem: ({ isLocked, isLockedVariation, variation, label, isLastItem, hasTransition, children, type, ...props }: AccordionItemProps) => import("react/jsx-runtime").JSX.Element;
+declare const AccordionItem: ({ isLocked, isLockedVariation, variation, label, isLastItem, hasTransition, children, type, isControlled, ...props }: AccordionItemProps) => import("react/jsx-runtime").JSX.Element;
 export default AccordionItem;

package/dist/components/Accordion/AccordionItem.js

@@ -1,38 +1,38 @@
 import { jsxs as f, jsx as e, Fragment as h } from "react/jsx-runtime";
-import { useState as v } from "react";
-import { getCommonProps as x } from "../../utils/index.js";
-import p from "../../assets/plus.svg.js";
-import C from "../../assets/minus.svg.js";
-import A from "../../assets/lock.svg.js";
-import m from "../../node_modules/classnames/index.js";
-import { Item as T, Trigger as j, Content as k } from "../../node_modules/@radix-ui/react-accordion/dist/index.js";
-const N = ({
-  children: o,
+import { useState as p } from "react";
+import { getCommonProps as v, noOp as x } from "../../utils/index.js";
+import C from "../../assets/plus.svg.js";
+import A from "../../assets/minus.svg.js";
+import T from "../../assets/lock.svg.js";
+import s from "../../node_modules/classnames/index.js";
+import { Item as j, Trigger as k, Content as N } from "../../node_modules/@radix-ui/react-accordion/dist/index.js";
+const B = ({
+  children: n,
   className: c,
   baseClassName: t,
-  disable: n,
-  isCollapsed: i,
+  disable: o,
+  isCollapsed: r,
   setIsCollapsed: d,
-  isLargeVariation: l,
-  isLockedVariation: s,
-  id: r
+  isLargeVariation: i,
+  isLockedVariation: m,
+  id: a
 }) => {
-  const a = () => !n && d((I) => !I), u = n ? A : i ? p : C, $ = `${r}-` + (n ? "lockedIcon" : s ? "lockBlueIcon" : i ? "plusIcon" : "minusIcon");
+  const l = () => !o && d((I) => !I), u = o ? T : r ? C : A, $ = `${a}-` + (o ? "lockedIcon" : m ? "lockBlueIcon" : r ? "plusIcon" : "minusIcon");
   return /* @__PURE__ */ e(
-    j,
+    k,
     {
-      "data-disabled": n,
+      "data-disabled": o,
       asChild: !0,
-      className: m(t, { [`${t}--hoverable`]: !n }, c),
-      children: /* @__PURE__ */ f("div", { onClick: a, "data-testid": `${r}-trigger`, children: [
-        /* @__PURE__ */ e("div", { className: m(`${t}__text`, { [`${t}__text--lg`]: l }), children: o }),
+      className: s(t, { [`${t}--hoverable`]: !o }, c),
+      children: /* @__PURE__ */ f("div", { onClick: l, "data-testid": `${a}-trigger`, children: [
+        /* @__PURE__ */ e("div", { className: s(`${t}__text`, { [`${t}__text--lg`]: i }), children: n }),
         /* @__PURE__ */ e(
           "img",
           {
-            className: m(
+            className: s(
               `${t}__icon`,
-              { [`${t}__icon--lg`]: l },
-              s && `${t}--blue-fill`
+              { [`${t}__icon--lg`]: i },
+              m && `${t}--blue-fill`
             ),
             src: u,
             "data-testid": $,
@@ -42,67 +42,68 @@ const N = ({
       ] })
     }
   );
-}, P = ({
-  children: o,
+}, F = ({
+  children: n,
   baseClassName: c,
   disable: t,
-  hasTransition: n,
-  isLargeVariation: i,
+  hasTransition: o,
+  isLargeVariation: r,
   isCollapsed: d,
-  className: l
-}) => /* @__PURE__ */ e(h, { children: t && o ? /* @__PURE__ */ e("div", { children: o }) : /* @__PURE__ */ e(
-  k,
+  className: i
+}) => /* @__PURE__ */ e(h, { children: t && n ? /* @__PURE__ */ e("div", { children: n }) : /* @__PURE__ */ e(
+  N,
   {
     asChild: !0,
-    className: m(
-      { [`${c}__content--lg`]: i },
-      { [`${c}--transition`]: n },
+    className: s(
+      { [`${c}__content--lg`]: r },
+      { [`${c}--transition`]: o },
       { [`${c}--expanded`]: !d },
-      l
+      i
     ),
-    children: o
+    children: n
   }
-) }), z = ({
-  isLocked: o,
+) }), D = ({
+  isLocked: n,
   isLockedVariation: c,
   variation: t,
-  label: n,
-  isLastItem: i,
+  label: o,
+  isLastItem: r,
   hasTransition: d = !1,
-  children: l,
-  type: s = "single",
-  ...r
+  children: i,
+  type: m = "single",
+  isControlled: a = !0,
+  ...l
 }) => {
-  const [a, u] = v(!0), { className: $, ...I } = x(r, "Accordion"), _ = t === "lg", g = `${$}-item`;
+  const [u, $] = p(!0), { className: I } = v(l, "Accordion"), _ = t === "lg", g = `${I}-item`;
   return /* @__PURE__ */ f(
-    T,
+    j,
     {
-      disabled: o,
-      value: I["data-testid"],
-      className: m(g, { [`${g}__border-bottom`]: !i }),
+      disabled: n,
+      value: o,
+      className: s(g, { [`${g}__border-bottom`]: !r }),
       children: [
         /* @__PURE__ */ e(
-          N,
+          B,
           {
-            disable: o,
+            disable: n,
             isLargeVariation: _,
             isLockedVariation: c,
-            isCollapsed: a,
-            setIsCollapsed: u,
-            id: s === "single" ? r == null ? void 0 : r.id : void 0,
+            isCollapsed: u,
+            setIsCollapsed: a ? $ : x,
+            id: m === "single" ? l == null ? void 0 : l.id : void 0,
             baseClassName: `${g}-label`,
-            children: n
+            children: o
           }
         ),
         /* @__PURE__ */ e(
-          P,
+          F,
           {
-            disable: o,
+            disable: n,
             hasTransition: d,
             isLargeVariation: _,
-            isCollapsed: a,
+            isCollapsed: u,
             baseClassName: g,
-            children: l
+            children: i
           }
         )
       ]
@@ -110,5 +111,5 @@ const N = ({
   );
 };
 export {
-  z as default
+  D as default
 };

package/dist/components/Footer/Footer.d.ts

@@ -17,5 +17,5 @@ export interface FooterProps extends React.HTMLAttributes<HTMLElement> {
  *
  * [Storybook Link](https://phillips-seldon.netlify.app/?path=/docs/components-footer--overview)
  */
-declare const Footer: ({ children, className, copyright, id, navigationComponent, }: FooterProps) => import("react/jsx-runtime").JSX.Element;
+declare const Footer: ({ children, className, copyright, id, }: FooterProps) => import("react/jsx-runtime").JSX.Element;
 export default Footer;

package/dist/components/Footer/Footer.js

@@ -1,17 +1,19 @@
-import { jsxs as f, jsx as r } from "react/jsx-runtime";
+import { jsxs as a, jsx as o } from "react/jsx-runtime";
 import i from "../../node_modules/classnames/index.js";
-import { px as o, defaultYear as m } from "../../utils/index.js";
-import n from "../SplitPanel/SplitPanel.js";
+import { px as e, defaultYear as m } from "../../utils/index.js";
+import f from "../SplitPanel/SplitPanel.js";
+import c from "../../assets/PhillipsLogo.svg.js";
 const _ = ({
   children: t,
-  className: a,
+  className: l,
   copyright: s = `© ${m} Phillips Auctioneers, LLC`,
-  id: e,
-  navigationComponent: l
-}) => /* @__PURE__ */ f("footer", { "data-testid": e || "footer", id: e, className: i(`${o}-footer`, { className: a }), children: [
-  /* @__PURE__ */ r("nav", { className: `${o}-footer__navigation`, children: l }),
-  /* @__PURE__ */ r(n, { className: `${o}-footer__content`, hasBorder: !1, children: t }),
-  /* @__PURE__ */ r("p", { className: `${o}-footer__copyright`, children: s })
+  id: r
+}) => /* @__PURE__ */ a("footer", { "data-testid": r || "footer", id: r, className: i(`${e}-footer`, { className: l }), children: [
+  /* @__PURE__ */ o(f, { className: `${e}-footer__content`, hasBorder: !1, children: t }),
+  /* @__PURE__ */ a("div", { className: `${e}-footer__copyright`, children: [
+    /* @__PURE__ */ o("h1", { "data-testid": "header-logo", className: `${e}-header__logo`, children: /* @__PURE__ */ o("a", { href: "/", "aria-label": "logo", children: /* @__PURE__ */ o(c, {}) }) }),
+    s
+  ] })
 ] });
 export {
   _ as default

package/dist/components/Social/Social.d.ts

@@ -1,8 +1,17 @@
+import { MouseEventHandler } from 'react';
 export interface SocialProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
      * Title text for the social section
      */
     titleText?: string;
+    /**
+     * Text for the subscribe button
+     */
+    buttonText?: string;
+    /**
+     * Function for when the subscribe button is clicked
+     */
+    onSubscribeClick?: MouseEventHandler<HTMLButtonElement>;
 }
 /**
  * ## Overview
@@ -13,5 +22,5 @@ export interface SocialProps extends React.HTMLAttributes<HTMLDivElement> {
  *
  * [Storybook Link](https://phillips-seldon.netlify.app/?path=/docs/components-social--overview)
  */
-declare const Social: ({ className, children, titleText, ...props }: SocialProps) => import("react/jsx-runtime").JSX.Element;
+declare const Social: ({ className, children, titleText, buttonText, onSubscribeClick, ...props }: SocialProps) => import("react/jsx-runtime").JSX.Element;
 export default Social;

package/dist/components/Social/Social.js

@@ -1,13 +1,22 @@
-import { jsxs as r, jsx as c } from "react/jsx-runtime";
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
 import i from "../../node_modules/classnames/index.js";
-import { getCommonProps as n } from "../../utils/index.js";
-const h = ({ className: a, children: m, titleText: e = "Follow on Social", ...o }) => {
-  const { className: s, ...l } = n(o, "Social");
-  return /* @__PURE__ */ r("div", { ...l, className: i(s, a), ...o, children: [
-    /* @__PURE__ */ c("h3", { className: `${s}__header`, children: e }),
-    m
+import { getCommonProps as u } from "../../utils/index.js";
+import N from "../Button/Button.js";
+const f = ({
+  className: r,
+  children: t,
+  titleText: m = "Never Miss A Moment",
+  buttonText: a = "Subscribe To Our Newsletter",
+  onSubscribeClick: c,
+  ...o
+}) => {
+  const { className: s, ...l } = u(o, "Social");
+  return /* @__PURE__ */ n("div", { ...l, className: i(s, r), ...o, children: [
+    /* @__PURE__ */ e("h3", { className: `${s}__header`, children: m }),
+    /* @__PURE__ */ e(N, { onClick: c, buttonType: "ghost", className: `${s}__button`, children: a }),
+    t
   ] });
 };
 export {
-  h as default
+  f as default
 };

package/dist/scss/components/Footer/_footer.scss

@@ -5,44 +5,76 @@
 
 .#{$px}-footer {
   background-color: $off-white;
-  border-top: 1px solid $keyline-gray;
   margin: $spacing-lg 0 0;
   width: 100%;
 
-  ul {
-    list-style: none;
-    padding: 0;
-  }
-
-  &__navigation {
-    background-color: $white;
-    padding: $spacing-md $spacing-md $spacing-sm;
-    text-align: right;
-
-    @include media($size-md) {
-      padding: $spacing-md $spacing-lg $spacing-sm;
-    }
-
-    @include media($size-lg) {
-      padding: $spacing-md $spacing-xl $spacing-sm;
+  .#{$px}-accordion {
+    border-bottom: 1px solid #eae8e4;
+    border-top: 1px solid #eae8e4;
+    width: 100%;
+
+    &-item {
+      padding: $spacing-sm 0 0;
+
+      ul {
+        li {
+          a {
+            font-size: 0.875rem;
+            font-weight: 500;
+            line-height: 1.875rem;
+
+            &:hover {
+              text-decoration: underline;
+            }
+          }
+        }
+      }
+
+      &-label {
+        opacity: 1;
+        padding: 0 0 0.5rem;
+
+        @include media($size-sm) {
+          cursor: unset;
+        }
+
+        &__text {
+          color: $pure-black;
+          font-family: $Distinct;
+          font-size: 1rem;
+          font-weight: 600;
+        }
+      }
+
+      &__border-bottom {
+        border-bottom: 1px solid #eae8e4;
+      }
     }
+  }
 
-    ul {
-      display: inline-flex;
-      flex-wrap: wrap;
-      gap: $spacing-md;
-      justify-content: center;
-      list-style: none;
-      padding: 0;
+  @include media($size-sm) {
+    .#{$px}-accordion {
+      border-bottom: 0;
+      border-top: 0;
+      display: flex;
+      width: 100%;
+
+      &-item {
+        border-bottom: 0;
+        flex: 1;
+        max-width: 18rem;
+        padding: $spacing-sm;
+
+        &-label__icon {
+          display: none;
+        }
+      }
     }
+  }
 
-    a,
-    button {
-      @include text('cta-sm');
-      @include bodyText;
-
-      cursor: pointer;
-    }
+  ul {
+    list-style: none;
+    padding: 0;
   }
 
   &__content {
@@ -88,10 +120,25 @@
     align-items: center;
     background-color: $white;
     display: flex;
+    flex-direction: column;
+    font-size: 1rem;
+    gap: 1rem;
 
-    // font-size: 0.875rem;
     // height: 2.125rem;
     justify-content: center;
     padding: $spacing-xsm 0;
+
+    h1 {
+      margin-top: $spacing-md;
+    }
+  }
+
+  .#{$px}-split-panel {
+    @include media($size-sm) {
+      & > :last-child {
+        flex: unset;
+        width: unset;
+      }
+    }
   }
 }

package/dist/scss/components/Social/_social.scss

@@ -3,30 +3,68 @@
 @import '../../type';
 
 .#{$px}-social {
-  align-items: center;
   display: inline-flex;
   flex-direction: column;
+  padding: 0;
+  width: 100%;
+
+  @include media($size-sm) {
+    align-items: center;
+    padding: $spacing-sm;
+    width: unset;
+  }
+
+  &__button {
+    color: $pure-black;
+    font-size: 0.875rem;
+    justify-content: flex-start;
+    opacity: 1;
+    padding: 0;
+    text-decoration: underline;
+    white-space: nowrap;
+
+    @include media($size-sm) {
+      justify-content: center;
+    }
+
+    &:hover {
+      background-color: unset;
+      color: unset;
+    }
+
+    &:focus {
+      background-color: unset;
+      color: unset;
+    }
+  }
 
   @include media($size-sm) {
     align-items: flex-end;
   }
 
   &__header {
-    @include text($heading3);
-
-    margin-bottom: $spacing-xsm;
+    color: $pure-black;
+    font-family: $Distinct;
+    font-size: 1rem;
+    font-weight: 600;
+    margin-bottom: 0.75rem;
   }
 
   ul {
     align-items: center;
+    border-top: 1px solid #eae8e4;
     display: flex;
     gap: 0 1.25rem;
     list-style: none;
-    margin: 0 0 $spacing-md;
-    padding: 0;
+    margin: $spacing-md 0 $spacing-md;
+    padding: $spacing-md 0 0;
 
     @include media($size-sm) {
       gap: 0 1rem;
+      justify-content: flex-end;
+      margin: $spacing-sm 0 $spacing-md;
+      padding: $spacing-sm 0 0;
+      width: 100%;
     }
 
     li {

package/package.json

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