@phillips/seldon 1.7.1 → 1.8.0

package/dist/components/Button/Button.d.ts

@@ -1,31 +1,25 @@
-export interface ButtonProps {
+import { CommonProps } from '../../utils';
+export interface ButtonProps extends CommonProps, Record<string, unknown> {
     /**
-     * Is this the principal call to action on the page?
+     * Button contents
      */
-    primary?: boolean;
+    children: React.ReactNode;
     /**
-     * What background color to use
+     * True if button comes after text
      */
-    backgroundColor?: string;
+    iconLast?: boolean;
     /**
-     * How large should the button be?
+     * Optional click handler
      */
-    size?: 'sm' | 'md' | 'lg';
+    onClick?: (e: React.MouseEvent<HTMLElement>) => void | unknown;
     /**
-     * Button contents
+     * Is this the principal call to action on the page?
      */
-    children: React.ReactNode;
-    /**
-    * Unique id for component
-    */
-    id?: string;
+    buttonType?: 'primary' | 'secondary' | 'ghost';
     /**
-     * Optional click handler
+     * How large should the button be?
      */
-    onClick?: () => void;
+    size?: 'sm' | 'md' | 'lg';
 }
-/**
- * Primary UI component for user interaction
- */
-declare const Button: ({ primary, size, backgroundColor, children, id, ...props }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
+declare const Button: ({ buttonType, size, children, iconLast, id, ...props }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
 export default Button;

package/dist/components/Button/Button.js

@@ -1,25 +1,19 @@
-import { jsx as a } from "react/jsx-runtime";
-import m from "../../node_modules/classnames/index.js";
-import { px as o } from "../../utils/index.js";
-const c = ({
-  primary: n = !0,
-  size: r = "md",
-  backgroundColor: s,
-  children: u,
-  id: t,
-  ...e
-}) => /* @__PURE__ */ a(
+import { jsx as m } from "react/jsx-runtime";
+import b from "../../node_modules/classnames/index.js";
+import { px as t } from "../../utils/index.js";
+const f = ({ buttonType: n = "primary", size: a = "md", children: r, iconLast: s = !1, id: o, ...u }) => /* @__PURE__ */ m(
   "button",
   {
-    "data-testid": t ? `button-${t}` : "button",
-    id: t,
+    "data-testid": o ? `button-${o}` : "button",
+    id: o,
     type: "button",
-    className: m(`${o}-button`, `${o}-button--${r}`, { [`${o}-button--secondary`]: !n }),
-    style: { backgroundColor: s },
-    ...e,
-    children: u
+    className: b(`${t}-button`, `${t}-button--${a}`, `${t}-button--${n}`, {
+      [`${t}-button--icon-last`]: s
+    }),
+    ...u,
+    children: r
   }
 );
 export {
-  c as default
+  f as default
 };

package/dist/components/Header/Header.js

@@ -1,42 +1,24 @@
-import { jsx as e, jsxs as l, Fragment as d } from "react/jsx-runtime";
+import { jsx as l, jsxs as e, Fragment as d } from "react/jsx-runtime";
 import i from "../Button/Button.js";
-const a = ({ user: n, onLogin: r, onLogout: h, onCreateAccount: c }) => /* @__PURE__ */ e("header", { children: /* @__PURE__ */ l("div", { className: "storybook-header", children: [
-  /* @__PURE__ */ l("div", { children: [
-    /* @__PURE__ */ e("svg", { width: "32", height: "32", viewBox: "0 0 32 32", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ l("g", { fill: "none", fillRule: "evenodd", children: [
-      /* @__PURE__ */ e(
-        "path",
-        {
-          d: "M10 0h12a10 10 0 0110 10v12a10 10 0 01-10 10H10A10 10 0 010 22V10A10 10 0 0110 0z",
-          fill: "#FFF"
-        }
-      ),
-      /* @__PURE__ */ e(
-        "path",
-        {
-          d: "M5.3 10.6l10.4 6v11.1l-10.4-6v-11zm11.4-6.2l9.7 5.5-9.7 5.6V4.4z",
-          fill: "#555AB9"
-        }
-      ),
-      /* @__PURE__ */ e(
-        "path",
-        {
-          d: "M27.2 10.6v11.2l-10.5 6V16.5l10.5-6zM15.7 4.4v11L6 10l9.7-5.5z",
-          fill: "#91BAF8"
-        }
-      )
+const a = ({ user: n, onLogin: h, onLogout: r, onCreateAccount: c }) => /* @__PURE__ */ l("header", { children: /* @__PURE__ */ e("div", { className: "storybook-header", children: [
+  /* @__PURE__ */ e("div", { children: [
+    /* @__PURE__ */ l("svg", { width: "32", height: "32", viewBox: "0 0 32 32", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e("g", { fill: "none", fillRule: "evenodd", children: [
+      /* @__PURE__ */ l("path", { d: "M10 0h12a10 10 0 0110 10v12a10 10 0 01-10 10H10A10 10 0 010 22V10A10 10 0 0110 0z", fill: "#FFF" }),
+      /* @__PURE__ */ l("path", { d: "M5.3 10.6l10.4 6v11.1l-10.4-6v-11zm11.4-6.2l9.7 5.5-9.7 5.6V4.4z", fill: "#555AB9" }),
+      /* @__PURE__ */ l("path", { d: "M27.2 10.6v11.2l-10.5 6V16.5l10.5-6zM15.7 4.4v11L6 10l9.7-5.5z", fill: "#91BAF8" })
     ] }) }),
-    /* @__PURE__ */ e("h1", { children: "Acme" })
+    /* @__PURE__ */ l("h1", { children: "Acme" })
   ] }),
-  /* @__PURE__ */ e("div", { children: n ? /* @__PURE__ */ l(d, { children: [
-    /* @__PURE__ */ l("span", { className: "welcome", children: [
+  /* @__PURE__ */ l("div", { children: n ? /* @__PURE__ */ e(d, { children: [
+    /* @__PURE__ */ e("span", { className: "welcome", children: [
       "Welcome, ",
-      /* @__PURE__ */ e("b", { children: n.name }),
+      /* @__PURE__ */ l("b", { children: n.name }),
       "!"
     ] }),
-    /* @__PURE__ */ e(i, { size: "sm", onClick: h, children: "Log out" })
-  ] }) : /* @__PURE__ */ l(d, { children: [
-    /* @__PURE__ */ e(i, { size: "sm", onClick: r, children: "Log in" }),
-    /* @__PURE__ */ e(i, { primary: !0, size: "sm", onClick: c, children: "Sign up" })
+    /* @__PURE__ */ l(i, { size: "sm", onClick: r, children: "Log out" })
+  ] }) : /* @__PURE__ */ e(d, { children: [
+    /* @__PURE__ */ l(i, { size: "sm", onClick: h, children: "Log in" }),
+    /* @__PURE__ */ l(i, { size: "sm", onClick: c, children: "Sign up" })
   ] }) })
 ] }) });
 export {

package/dist/components/HeroBanner/HeroBanner.d.ts

@@ -16,16 +16,16 @@ interface HeroBannerProps {
      */
     subHeadText?: string;
     /**
-    * Is there an association related to this sale?
-    */
+     * Is there an association related to this sale?
+     */
     association?: string;
     /**
-    * What background image or color to use
-    */
+     * What background image or color to use
+     */
     background?: string;
     /**
-    * Unique id for component testing
-    */
+     * Unique id for component testing
+     */
     id?: string;
 }
 declare const HeroBanner: ({ prehead, date, headerText, subHeadText, association, background, id }: HeroBannerProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/HeroBanner/HeroBanner.js

@@ -1,14 +1,6 @@
 import { jsx as n, jsxs as s } from "react/jsx-runtime";
 import { px as t } from "../../utils/index.js";
-const r = `${t}-hero-banner`, m = ({
-  prehead: e,
-  date: l,
-  headerText: o,
-  subHeadText: c,
-  association: h,
-  background: p,
-  id: a
-}) => /* @__PURE__ */ n(
+const r = `${t}-hero-banner`, m = ({ prehead: e, date: l, headerText: o, subHeadText: c, association: h, background: p, id: a }) => /* @__PURE__ */ n(
   "header",
   {
     "data-testid": a ? `hero-banner-${a}` : "hero-banner",

package/dist/components/Input/Input.js

@@ -1,64 +1,63 @@
-import { jsxs as P, jsx as r } from "react/jsx-runtime";
+import { jsxs as P, jsx as l } from "react/jsx-runtime";
 import * as R from "react";
-import e from "../../node_modules/classnames/index.js";
-import { px as t, useNormalizedInputProps as y } from "../../utils/index.js";
-const z = R.forwardRef(({
-  className: p,
-  defaultValue: l,
-  disabled: u,
-  hideLabel: d,
-  id: n,
-  inline: o,
-  invalid: m,
-  invalidText: $,
-  labelText: c,
-  onChange: _,
-  onClick: b,
-  placeholder: f,
-  readOnly: a,
-  size: w = "md",
-  type: s = "text",
-  value: x,
-  warn: h,
-  warnText: v,
-  ...I
-}, N) => {
-  const i = y({ disabled: u, id: n, invalid: m, invalidText: $, readOnly: a, type: s, warn: h, warnText: v }), j = e(
-    `${t}-${s}-input`,
-    `${t}-input`,
-    `${t}-input--${w}`,
-    {
-      [`${t}-input--inline`]: o,
-      [`${t}-input--readonly`]: a,
-      [`${t}-input--disabled`]: i.disabled,
-      [`${t}-input--invalid`]: i.invalid,
-      [`${t}-input--warn`]: i.warn,
-      [`${p}__wrapper`]: p
-    }
-  );
-  return /* @__PURE__ */ P("div", { className: j, children: [
-    /* @__PURE__ */ r("label", { htmlFor: n, className: e(`${t}-input__label`, { [`${t}-input__label--hidden`]: d }), children: c }),
-    /* @__PURE__ */ r(
-      "input",
-      {
-        className: e(`${t}-input__input`, { className: p }),
-        "data-testid": n,
-        defaultValue: l,
-        disabled: i.disabled,
-        id: n,
-        onChange: _,
-        onClick: b,
-        placeholder: f,
-        readOnly: a,
-        ref: N,
-        type: i.type,
-        value: x,
-        ...I
-      }
-    ),
-    i.validation
-  ] });
-});
+import d from "../../node_modules/classnames/index.js";
+import { px as i, useNormalizedInputProps as y } from "../../utils/index.js";
+const z = R.forwardRef(
+  ({
+    className: a,
+    defaultValue: r,
+    disabled: u,
+    hideLabel: o,
+    id: t,
+    inline: m,
+    invalid: $,
+    invalidText: c,
+    labelText: _,
+    onChange: b,
+    onClick: f,
+    placeholder: h,
+    readOnly: p,
+    size: w = "md",
+    type: s = "text",
+    value: x,
+    warn: v,
+    warnText: I,
+    ...e
+  }, N) => {
+    const n = y({ disabled: u, id: t, invalid: $, invalidText: c, readOnly: p, type: s, warn: v, warnText: I }), j = d(`${i}-${s}-input`, `${i}-input`, `${i}-input--${w}`, {
+      [`${i}-input--inline`]: m,
+      [`${i}-input--readonly`]: p,
+      [`${i}-input--disabled`]: n.disabled,
+      [`${i}-input--invalid`]: n.invalid,
+      [`${i}-input--warn`]: n.warn,
+      [`${a}__wrapper`]: a,
+      [`${i}-input--hidden`]: e.hidden
+    });
+    return /* @__PURE__ */ P("div", { className: j, children: [
+      /* @__PURE__ */ l("label", { htmlFor: t, className: d(`${i}-input__label`, { [`${i}-input__label--hidden`]: o }), children: _ }),
+      /* @__PURE__ */ l(
+        "input",
+        {
+          className: d(`${i}-input__input`, { className: a }),
+          "data-testid": t,
+          defaultValue: r,
+          disabled: n.disabled,
+          id: t,
+          name: e.name,
+          onChange: b,
+          onClick: f,
+          placeholder: h,
+          readOnly: p,
+          ref: N,
+          type: n.type,
+          value: x,
+          ...e
+        }
+      ),
+      n.validation
+    ] });
+  }
+);
 z.displayName = "Input";
 export {
   z as default

package/dist/components/Select/Select.js

@@ -2,60 +2,57 @@ import { jsxs as R, jsx as l } from "react/jsx-runtime";
 import * as y from "react";
 import a from "../../node_modules/classnames/index.js";
 import { px as t, useNormalizedInputProps as z } from "../../utils/index.js";
-const S = y.forwardRef(({
-  children: r,
-  className: n,
-  defaultValue: o,
-  disabled: d,
-  hideLabel: u,
-  id: e,
-  inline: m,
-  invalid: $,
-  invalidText: c,
-  labelText: _,
-  onChange: b,
-  onClick: f,
-  readOnly: p,
-  size: w = "md",
-  value: h,
-  warn: v,
-  warnText: x,
-  ...j
-}, N) => {
-  const s = "select", i = z({ disabled: d, id: e, invalid: $, invalidText: c, readOnly: p, type: s, warn: v, warnText: x }), P = a(
-    `${t}-${s}-input`,
-    `${t}-input`,
-    `${t}-input--${w}`,
-    {
+const S = y.forwardRef(
+  ({
+    children: r,
+    className: n,
+    defaultValue: o,
+    disabled: d,
+    hideLabel: u,
+    id: e,
+    inline: m,
+    invalid: $,
+    invalidText: c,
+    labelText: _,
+    onChange: b,
+    onClick: f,
+    readOnly: p,
+    size: w = "md",
+    value: h,
+    warn: v,
+    warnText: x,
+    ...j
+  }, N) => {
+    const s = "select", i = z({ disabled: d, id: e, invalid: $, invalidText: c, readOnly: p, type: s, warn: v, warnText: x }), P = a(`${t}-${s}-input`, `${t}-input`, `${t}-input--${w}`, {
       [`${t}-input--inline`]: m,
       [`${t}-input--readonly`]: p,
       [`${t}-input--disabled`]: i.disabled,
       [`${t}-input--invalid`]: i.invalid,
       [`${t}-input--warn`]: i.warn,
       [`${n}__wrapper`]: n
-    }
-  );
-  return /* @__PURE__ */ R("div", { className: P, children: [
-    /* @__PURE__ */ l("label", { htmlFor: e, className: a(`${t}-input__label`, { [`${t}-input__label--hidden`]: u }), children: _ }),
-    /* @__PURE__ */ l(
-      "select",
-      {
-        className: a(`${t}-input__input`, { className: n }),
-        "data-testid": e,
-        defaultValue: o,
-        disabled: i.disabled,
-        id: e,
-        onChange: b,
-        onClick: f,
-        ref: N,
-        value: h,
-        ...j,
-        children: r
-      }
-    ),
-    i.validation
-  ] });
-});
+    });
+    return /* @__PURE__ */ R("div", { className: P, children: [
+      /* @__PURE__ */ l("label", { htmlFor: e, className: a(`${t}-input__label`, { [`${t}-input__label--hidden`]: u }), children: _ }),
+      /* @__PURE__ */ l(
+        "select",
+        {
+          className: a(`${t}-input__input`, { className: n }),
+          "data-testid": e,
+          defaultValue: o,
+          disabled: i.disabled,
+          id: e,
+          onChange: b,
+          onClick: f,
+          ref: N,
+          value: h,
+          ...j,
+          children: r
+        }
+      ),
+      i.validation
+    ] });
+  }
+);
 export {
   S as default
 };

package/dist/components/ViewingsList/StatefulViewingsList.d.ts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import { ViewingsListCardProps } from './ViewingsListCard';
+import { I18nObject } from './ViewingsList';
+export interface StatefulViewingsListProps extends Record<string, unknown> {
+    /**
+     * Existing viewings to populate the list
+     */
+    defaultViewing?: ViewingsListCardProps[];
+    /**
+     * Optional strings to pass for the form and button labels
+     */
+    i18n?: I18nObject;
+    /**
+     * Optional validations script to be ran when Viewing list is updated and saved
+     */
+    validate?: ((e: ViewingsListCardProps) => object | undefined) | (() => object);
+    /**
+     * Method for removing a viewing from the list
+     */
+    onDelete?: (id: string) => void;
+    /**
+     * Method used to persist changes to a particular view
+     */
+    onSave: (e: React.MouseEvent<HTMLElement>, cb: React.Dispatch<React.SetStateAction<ViewingsListCardProps[]>>, validateCb: (e: ViewingsListCardProps) => object | undefined) => boolean;
+}
+declare const StatefulViewingsList: ({ defaultViewing, i18n, validate, onDelete, onSave, ...props }: StatefulViewingsListProps) => import("react/jsx-runtime").JSX.Element;
+export default StatefulViewingsList;

package/dist/components/ViewingsList/StatefulViewingsList.js

@@ -0,0 +1,33 @@
+import { jsx as m } from "react/jsx-runtime";
+import * as u from "react";
+import c from "./ViewingsList.js";
+const S = ({
+  defaultViewing: o,
+  i18n: d,
+  validate: a = () => {
+  },
+  onDelete: l = () => {
+  },
+  onSave: s,
+  ...r
+}) => {
+  const [f, n] = u.useState(o);
+  return /* @__PURE__ */ m(
+    c,
+    {
+      ...r,
+      i18n: d,
+      viewings: f,
+      onDelete: (t) => {
+        n((e) => e == null ? void 0 : e.filter((i) => i.id !== t)), l(t);
+      },
+      onAdd: (t) => {
+        n((e) => e ? [...e, { id: t }] : [{ id: t }]);
+      },
+      onSave: (t) => s(t, n, a)
+    }
+  );
+};
+export {
+  S as default
+};

package/dist/components/ViewingsList/ViewingsList.d.ts

@@ -0,0 +1,60 @@
+import * as React from 'react';
+import { ViewingsListCardProps } from './ViewingsListCard';
+export interface I18nObject {
+    address1Label?: string;
+    addressUrlLabel?: string;
+    address2Label?: string;
+    address3Label?: string;
+    addViewingsBtnLabel?: string;
+    cancelBtnLabel?: string;
+    deleteBtnLabel?: string;
+    editBtnLabel?: string;
+    enableOnSiteToggleLabel?: string;
+    locationLabel?: string;
+    previewDatesLabel?: string;
+    previewHours1Label?: string;
+    previewHours2Label?: string;
+    previewLabel?: string;
+    previewToggleLabel?: string;
+    saveBtnLabel?: string;
+    viewingLabel?: string;
+    viewingDatesLabel?: string;
+    viewingHours1Label?: string;
+    viewingHours2Label?: string;
+}
+export interface ViewingsListProps {
+    /**
+     * String for Viewing cards that gets nuber appended. EX: 'Title {x}`
+     */
+    cardTitle?: string;
+    /**
+     * Unique id for component
+     */
+    id?: string;
+    /**
+     * Optional strings to pass for the form and button labels
+     */
+    i18n?: I18nObject;
+    /**
+     * Title for Viewings list
+     */
+    title?: string;
+    /**
+     * Array of viewings objects
+     */
+    viewings?: ViewingsListCardProps[] | [];
+    /**
+     * Method for removing a viewing from the list
+     */
+    onAdd?: (id: string) => void;
+    /**
+     * Method for removing a viewing from the list
+     */
+    onDelete?: (id: string) => void;
+    /**
+     * Method used to persist changes to a particular view
+     */
+    onSave: (e: React.MouseEvent<HTMLElement>) => boolean;
+}
+declare const ViewingsList: ({ cardTitle, id, i18n, onAdd, onDelete, onSave, title, viewings, }: ViewingsListProps) => import("react/jsx-runtime").JSX.Element;
+export default ViewingsList;

package/dist/components/ViewingsList/ViewingsList.js

@@ -0,0 +1,54 @@
+import { jsxs as B, jsx as l } from "react/jsx-runtime";
+import * as d from "react";
+import p from "../../node_modules/classnames/index.js";
+import { px as $ } from "../../utils/index.js";
+import M from "./ViewingsListCard.js";
+import R from "../Button/Button.js";
+const S = () => Math.floor(Math.random() * 100) + Date.now(), z = ({
+  cardTitle: O = "Viewing Details",
+  id: f,
+  i18n: r = {},
+  onAdd: m,
+  onDelete: e,
+  onSave: D,
+  title: x,
+  viewings: i
+}) => {
+  const [a, h] = d.useState(i), [c, o] = d.useState(""), [s, u] = d.useState();
+  d.useEffect(() => {
+    h(i);
+  }, [i]);
+  const { addViewingsBtnLabel: C = "ADD VIEWINGS" } = r, E = () => {
+    const t = `${S()}${a ? "-" + a.length : ""}`;
+    o(t), u(t), m && m(t);
+  }, N = (t) => {
+    o(""), typeof e == "function" && e(t);
+  }, y = (t) => {
+    o(t), u(a == null ? void 0 : a.find((n) => n.id === t));
+  }, b = (t) => {
+    D(t) && o("");
+  }, j = () => {
+    typeof s == "string" ? typeof e == "function" && e(s) : c === (s == null ? void 0 : s.id) && h((t) => t == null ? void 0 : t.map((n) => n.id === s.id ? s : n)), o("");
+  };
+  return /* @__PURE__ */ B("div", { className: p(`${$}-viewings-list`), id: f, children: [
+    /* @__PURE__ */ l("h2", { className: p(`${$}-viewings-list__title`), children: x }),
+    a == null ? void 0 : a.map((t, n) => /* @__PURE__ */ l(
+      M,
+      {
+        ...t,
+        ...r,
+        cardTitle: t.location ? `${O} ${n + 1}` : void 0,
+        editState: c === t.id,
+        onCancel: j,
+        onDelete: N,
+        onEdit: () => y(t.id),
+        onSave: b
+      },
+      `${t.id}`
+    )),
+    /* @__PURE__ */ l(R, { id: `viewings-list-add-btn-${f || S()}`, size: "sm", onClick: E, children: C })
+  ] }, c);
+};
+export {
+  z as default
+};