@phillips/seldon 1.103.2 → 1.103.3

package/dist/components/Breadcrumb/Breadcrumb.js

@@ -3,7 +3,7 @@ import { getCommonProps as u, px as t } from "../../utils/index.js";
 import f from "../../node_modules/classnames/index.js";
 import p from "./BreadcrumbItem.js";
 import { SSRMediaQuery as c } from "../../providers/SeldonProvider/utils.js";
-import N from "../../assets/arrowPrev.svg.js";
+import g from "../../assets/arrowPrev.svg.js";
 const v = ({
   className: s,
   items: a = [],
@@ -11,25 +11,25 @@ const v = ({
   linkElement: l = "a",
   ...e
 }) => {
-  const { className: n, ...i } = u(e, "Breadcrumb"), { id: b } = e;
-  return /* @__PURE__ */ h("nav", { "aria-label": "Breadcrumb", className: f(n, s), ...i, ...e, children: [
+  const { className: m, ...i } = u(e, "Breadcrumb"), { id: b } = e;
+  return /* @__PURE__ */ h("nav", { "aria-label": "Breadcrumb", className: f(m, s), ...i, ...e, children: [
     /* @__PURE__ */ r(c.Media, { lessThan: "md", children: /* @__PURE__ */ r(
       l,
       {
         href: a[1].href ? a[1].href : "/",
-        className: `${t}-icon-button ${t}-icon-button--secondary`,
+        className: `${t}-icon-button ${t}-icon-button--primary ${m}__back-button`,
         "data-testid": `${b}-back-button`,
-        children: /* @__PURE__ */ r(N, { className: `${n}__back-button` })
+        children: /* @__PURE__ */ r(g, {})
       }
     ) }),
-    /* @__PURE__ */ r(c.Media, { greaterThanOrEqual: "md", children: /* @__PURE__ */ r("ol", { children: a.map((o, m) => /* @__PURE__ */ r(
+    /* @__PURE__ */ r(c.Media, { greaterThanOrEqual: "md", children: /* @__PURE__ */ r("ol", { children: a.map((o, n) => /* @__PURE__ */ r(
       p,
       {
         href: o.href,
         label: o.label,
         element: l,
-        isCurrent: a.length - 1 === m,
-        isTruncateText: d === m
+        isCurrent: a.length - 1 === n,
+        isTruncateText: d === n
       },
       o.label
     )) }) })

package/dist/components/Pagination/Pagination.js

@@ -1,55 +1,55 @@
-import { jsxs as O, jsx as i } from "react/jsx-runtime";
+import { jsxs as O, jsx as r } from "react/jsx-runtime";
 import f from "../../node_modules/classnames/index.js";
-import { getCommonProps as w, px as r } from "../../utils/index.js";
+import { getCommonProps as w, px as u } from "../../utils/index.js";
 import V from "../Select/Select.js";
 import h from "../../assets/chevronRight.svg.js";
 import x from "../IconButton/IconButton.js";
 import { ButtonVariants as b } from "../Button/types.js";
-import { determineOptionValue as o, findOptionFromSelectString as j } from "./utils.js";
+import { determineOptionValue as i, findOptionFromSelectString as j } from "./utils.js";
 import { usePendingState as k } from "../../utils/hooks.js";
 const G = ({
   className: P,
   onChange: $,
   variant: S = "inline",
   options: n = [],
-  value: g,
+  value: p,
   isDisabled: l,
   previousLabel: v = "Previous",
   nextLabel: C = "Next",
-  selectLabel: u = "Select",
+  selectLabel: g = "Select",
   ...s
 }) => {
-  const N = "pagination", { className: p, ...I } = w(s, "Pagination"), { id: c } = s, { pendingState: _, setPendingState: y } = k(o(g)), m = _ || g, d = (t, e) => {
-    const a = o(t);
+  const N = "pagination", { className: o, ...I } = w(s, "Pagination"), { id: c } = s, { pendingState: _, setPendingState: y } = k(i(p)), m = _ || p, d = (t, e) => {
+    const a = i(t);
     y(a), $(a, e);
   };
   return /* @__PURE__ */ O(
     "div",
     {
-      className: f(`${r}-${N}`, { [`${p}__wrapper`]: p }, P),
+      className: f(`${u}-${N}`, { [`${o}__wrapper`]: o }, P),
       ...I,
       ...s,
       children: [
-        /* @__PURE__ */ i(
+        /* @__PURE__ */ r(
           x,
           {
-            className: f(`${r}__pagination-button`, `${r}-left-arrow`),
+            className: f(`${o}__button`, `${u}-left-arrow`),
             onClick: () => {
-              const t = n.findIndex((a) => o(a) === m) - 1, e = n.at(t) || "";
+              const t = n.findIndex((a) => i(a) === m) - 1, e = n.at(t) || "";
               d(e);
             },
             "data-testid": `${c}-previous-button`,
             isDisabled: l,
             "aria-label": v,
-            variant: b.tertiary,
-            children: /* @__PURE__ */ i(h, {})
+            variant: b.primary,
+            children: /* @__PURE__ */ r(h, {})
           }
         ),
-        /* @__PURE__ */ i(
+        /* @__PURE__ */ r(
           V,
           {
-            className: S === "inline" ? `${r}--inline-pagination` : void 0,
-            "aria-label": u,
+            className: S === "inline" ? `${u}--inline-pagination` : void 0,
+            "aria-label": g,
             value: m,
             onChange: (t) => {
               const e = j(n, t == null ? void 0 : t.currentTarget.value);
@@ -57,28 +57,28 @@ const G = ({
             },
             "data-testid": `${c}-select-button`,
             hideLabel: !0,
-            labelText: u,
+            labelText: g,
             disabled: l,
             showIcon: !1,
             children: n.map((t) => {
-              const e = o(t);
-              return /* @__PURE__ */ i("option", { value: e, children: typeof t == "string" || typeof t == "number" ? t : t.label }, e);
+              const e = i(t);
+              return /* @__PURE__ */ r("option", { value: e, children: typeof t == "string" || typeof t == "number" ? t : t.label }, e);
             })
           }
         ),
-        /* @__PURE__ */ i(
+        /* @__PURE__ */ r(
           x,
           {
-            className: `${r}__pagination-button`,
+            className: `${o}__button`,
             onClick: () => {
-              const t = (n.findIndex((a) => o(a) === m) + 1) % n.length, e = n[t];
+              const t = (n.findIndex((a) => i(a) === m) + 1) % n.length, e = n[t];
               d(e);
             },
             "data-testid": `${c}-next-button`,
             isDisabled: l,
             "aria-label": C,
-            variant: b.tertiary,
-            children: /* @__PURE__ */ i(h, {})
+            variant: b.primary,
+            children: /* @__PURE__ */ r(h, {})
           }
         )
       ]

package/dist/scss/components/Breadcrumb/_breadcrumb.scss

@@ -5,11 +5,8 @@
 
   color: $pure-black;
 
-  &__back-button {
-    svg {
-      height: 1rem;
-      width: 1rem;
-    }
+  &__back-button:hover svg path {
+    fill: $pure-black;
   }
 
   &__item {

package/dist/scss/components/Pagination/_pagination.scss

@@ -4,68 +4,66 @@
   align-items: center;
   display: flex;
   flex-direction: row;
-  gap: $spacing-sm;
-}
+  gap: $spacing-xsm;
 
-.#{$px} {
-  &-icon-button {
+  &__button {
     &:disabled {
       border: unset;
     }
-    &.#{$px}__pagination-button {
-      @include media($breakpoint-md) {
-        > svg {
-          height: 1.75rem;
-          width: 1.75rem;
-        }
+
+    &:hover:not(:disabled) {
+      background-color: inherit;
+
+      svg path {
+        fill: $pure-black;
       }
     }
   }
+}
 
-  &--inline-pagination__wrapper {
-    select {
-      @include pText($body-size2);
-
-      appearance: none;
-      border: none;
-      font-variation-settings: 'wght' 600;
-      line-height: 1.75rem;
-      margin-bottom: 0;
-      outline: none;
-      padding: 0 $spacing-xsm;
-      text-align: center;
-      text-align-last: center;
-      text-decoration: underline;
-      text-underline-offset: 6px;
+.#{$px}--inline-pagination__wrapper {
+  select {
+    @include pText($body-size2);
 
-      @include isHeaderDesktop {
-        line-height: 2.5rem;
-        text-underline-offset: 10px;
-      }
+    appearance: none;
+    border: none;
+    font-variation-settings: 'wght' 600;
+    line-height: 1.75rem;
+    margin-bottom: 0;
+    outline: none;
+    padding: 0 $spacing-xsm;
+    text-align: center;
+    text-align-last: center;
+    text-decoration: underline;
+    text-underline-offset: 6px;
 
-      &:disabled {
-        border: 1px solid $medium-gray;
-        margin: auto;
-        max-height: 3.5rem;
-        max-width: 5rem;
-        padding: 0.5rem;
-        text-decoration: none;
-      }
+    @include isHeaderDesktop {
+      line-height: 2.5rem;
+      text-underline-offset: 10px;
+    }
 
-      &:hover {
-        cursor: pointer;
-      }
+    &:disabled {
+      border: 1px solid $medium-gray;
+      margin: auto;
+      max-height: 3.5rem;
+      max-width: 5rem;
+      padding: 0.5rem;
+      text-decoration: none;
+    }
 
-      &:focus-visible {
-        outline: 1px solid $medium-gray;
-      }
+    &:hover {
+      cursor: pointer;
     }
 
-    select::-ms-expand {
-      border: none;
-      display: none;
+    &:focus-visible {
+      outline: 1px solid $medium-gray;
     }
   }
+
+  select::-ms-expand {
+    border: none;
+    display: none;
+  }
 }
 
 .#{$px}-left-arrow {

package/package.json

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