@phillips/seldon 1.42.1 → 1.44.0

package/dist/node_modules/@radix-ui/react-use-previous/dist/index.js

@@ -0,0 +1,8 @@
+import * as u from "react";
+function t(r) {
+  const e = u.useRef({ value: r, previous: r });
+  return u.useMemo(() => (e.current.value !== r && (e.current.previous = e.current.value, e.current.value = r), e.current.previous), [r]);
+}
+export {
+  t as usePrevious
+};

package/dist/node_modules/@radix-ui/react-use-size/dist/index.js

@@ -0,0 +1,27 @@
+import * as h from "react";
+import { useLayoutEffect as z } from "../../react-use-layout-effect/dist/index.js";
+function c(r) {
+  const [d, e] = h.useState(void 0);
+  return z(() => {
+    if (r) {
+      e({ width: r.offsetWidth, height: r.offsetHeight });
+      const f = new ResizeObserver((i) => {
+        if (!Array.isArray(i) || !i.length)
+          return;
+        const b = i[0];
+        let o, t;
+        if ("borderBoxSize" in b) {
+          const s = b.borderBoxSize, u = Array.isArray(s) ? s[0] : s;
+          o = u.inlineSize, t = u.blockSize;
+        } else
+          o = r.offsetWidth, t = r.offsetHeight;
+        e({ width: o, height: t });
+      });
+      return f.observe(r, { box: "border-box" }), () => f.unobserve(r);
+    } else
+      e(void 0);
+  }, [r]), d;
+}
+export {
+  c as useSize
+};

package/dist/node_modules/@radix-ui/react-visually-hidden/dist/index.js

@@ -0,0 +1,30 @@
+import * as e from "react";
+import { Primitive as a } from "../../react-primitive/dist/index.js";
+import { jsx as o } from "react/jsx-runtime";
+var t = "VisuallyHidden", d = e.forwardRef(
+  (r, i) => /* @__PURE__ */ o(
+    a.span,
+    {
+      ...r,
+      ref: i,
+      style: {
+        // See: https://github.com/twbs/bootstrap/blob/master/scss/mixins/_screen-reader.scss
+        position: "absolute",
+        border: 0,
+        width: 1,
+        height: 1,
+        padding: 0,
+        margin: -1,
+        overflow: "hidden",
+        clip: "rect(0, 0, 0, 0)",
+        whiteSpace: "nowrap",
+        wordWrap: "normal",
+        ...r.style
+      }
+    }
+  )
+);
+d.displayName = t;
+export {
+  d as VisuallyHidden
+};

package/dist/scss/_vars.scss

@@ -1,5 +1,5 @@
 // prefix
-$px: phillips;
+$px: seldon;
 
 ////////////////////////
 /// COlORS:

package/dist/scss/componentStyles.scss

@@ -36,4 +36,5 @@
 @use 'components/Breadcrumb/breadcrumb';
 @use 'components/Drawer/drawer';
 @use 'components/HTMLParser/htmlParser';
+@use 'components/Dropdown/dropdown';
 @use 'components/Video/video';

package/dist/scss/components/Dropdown/_dropdown.scss

@@ -0,0 +1,86 @@
+@use '../../allPartials' as *;
+
+.#{$px}-dropdown {
+  @include text($body3);
+
+  &__trigger {
+    align-items: center;
+    background-color: $white;
+    border: none;
+    display: inline-flex;
+    gap: 10px;
+    justify-content: center;
+    padding: $spacing-xsm;
+
+    svg {
+      height: 16px;
+      width: 16px;
+    }
+
+    &-icon-expanded {
+      transform: rotateX(180deg);
+    }
+
+    &:hover {
+      cursor: pointer;
+    }
+
+    &:focus {
+      box-shadow: 0 0 0 1px $light-gray;
+    }
+  }
+
+  &__content {
+    background-color: $white;
+    border: 1px solid $light-gray;
+
+    // following will add additional arrows if list is near edge of viewport
+    max-height: var(--radix-select-content-available-height);
+    overflow: hidden;
+  }
+
+  &__scroll-button,
+  &__scroll-button__up {
+    align-items: center;
+    cursor: default;
+    display: flex;
+    justify-content: center;
+
+    svg {
+      height: 16px;
+      width: 16px;
+    }
+  }
+
+  &__scroll-button__up {
+    transform: rotateX(180deg);
+  }
+
+  &__viewport {
+    display: flex;
+    flex-direction: column;
+    gap: $spacing-xsm;
+    padding: $spacing-sm 0;
+  }
+
+  &__item {
+    @include text($body3);
+
+    align-items: center;
+    display: flex;
+    padding: 0 $padding-sm;
+    position: relative;
+    user-select: none;
+
+    &[data-disabled] {
+      color: $medium-gray;
+      pointer-events: none;
+    }
+
+    &[data-highlighted] {
+      background-color: $light-gray;
+      cursor: pointer;
+      outline: none;
+    }
+  }
+}

package/dist/utils/index.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-export declare const px = "phillips";
+export declare const px = "seldon";
 /**
  * Returns standard props values incorporating the component name into the class name and data-testid
  */

package/dist/utils/index.js

@@ -1,15 +1,15 @@
 import { jsx as m } from "react/jsx-runtime";
 import { kebabCase as d } from "../node_modules/change-case/dist/index.js";
 import * as u from "react";
-const i = "phillips", x = ({ id: e, ...n }, a) => {
+const s = "seldon", x = ({ id: e, ...n }, a) => {
   const t = d(a);
   return {
     ...n,
     "data-testid": e ? `${t}-${e}` : `${t}`,
-    className: `${i}-${t}`
+    className: `${s}-${t}`
   };
 };
-var p = /* @__PURE__ */ ((e) => (e.xs = "xs", e.sm = "sm", e.md = "md", e.lg = "lg", e.xl = "xl", e.xxl = "xxl", e))(p || {});
+var $ = /* @__PURE__ */ ((e) => (e.xs = "xs", e.sm = "sm", e.md = "md", e.lg = "lg", e.xl = "xl", e.xxl = "xxl", e))($ || {});
 const v = () => {
 };
 function g({
@@ -18,7 +18,7 @@ function g({
   invalid: a = !1,
   invalidText: t = "invalid",
   readOnly: r = !1,
-  type: s,
+  type: i,
   warn: l = !1,
   warnText: c
 }) {
@@ -26,14 +26,14 @@ function g({
     disabled: !r && e,
     invalid: !r && !e && a,
     invalidId: `${n}-error-msg`,
-    type: s === "toggle" ? "checkbox" : s,
+    type: i === "toggle" ? "checkbox" : i,
     warn: !r && !e && !a && l,
     warnId: `${n}-warn-msg`,
     validation: null
   };
-  return o.invalid && (o.validation = /* @__PURE__ */ m("div", { className: `${i}-input__validation ${i}-${s}-input--invalid`, id: o.invalidId, children: t })), o.warn && (o.validation = /* @__PURE__ */ m("div", { className: `${i}-input__validation ${i}-${s}-input--warn`, id: o.warnId, children: c })), o;
+  return o.invalid && (o.validation = /* @__PURE__ */ m("div", { className: `${s}-input__validation ${s}-${i}-input--invalid`, id: o.invalidId, children: t })), o.warn && (o.validation = /* @__PURE__ */ m("div", { className: `${s}-input__validation ${s}-${i}-input--warn`, id: o.warnId, children: c })), o;
 }
-const C = (/* @__PURE__ */ new Date()).getFullYear(), w = (e, n = "end", a = "vertical") => `${i}-padding-${a}-${e}-${n}`, h = (e) => /(.+)@(.+){2,}\.(.+){2,}/i.test(e), I = function(e, n, a = !1) {
+const C = (/* @__PURE__ */ new Date()).getFullYear(), w = (e, n = "end", a = "vertical") => `${s}-padding-${a}-${e}-${n}`, h = (e) => /(.+)@(.+){2,}\.(.+){2,}/i.test(e), I = function(e, n, a = !1) {
   const t = u.Children.toArray(e).filter((r) => r && r.type === n && !a ? r : r && r.type !== n && a);
   return t.length > 0 ? t : null;
 }, N = (e) => {
@@ -41,7 +41,7 @@ const C = (/* @__PURE__ */ new Date()).getFullYear(), w = (e, n = "end", a = "ve
   return `${n[0]}?${r}`;
 };
 export {
-  p as PaddingTokens,
+  $ as PaddingTokens,
   C as defaultYear,
   h as emailValidation,
   N as encodeURLSearchParams,
@@ -49,6 +49,6 @@ export {
   w as generatePaddingClassName,
   x as getCommonProps,
   v as noOp,
-  i as px,
+  s as px,
   g as useNormalizedInputProps
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@phillips/seldon",
-  "version": "1.42.1",
+  "version": "1.44.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/PhillipsAuctionHouse/seldon"
@@ -42,6 +42,7 @@
   "dependencies": {
     "@radix-ui/react-accordion": "^1.2.0",
     "@radix-ui/react-dialog": "^1.1.1",
+    "@radix-ui/react-select": "^2.1.1",
     "@types/dompurify": "^3.0.5",
     "change-case": "^5.4.4",
     "classnames": "^2.5.1",