@axos-web-dev/shared-components 0.0.89 → 0.0.90

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (51) hide show
  1. package/dist/Accordion/Accordion.css.d.ts +9 -9
  2. package/dist/Calculators/Calculator.js +3 -2
  3. package/dist/Carousel/index.js +2 -1
  4. package/dist/Chevron/index.js +2 -1
  5. package/dist/Comparison/Comparison.js +2 -1
  6. package/dist/Comparison/ComparisonSet.js +2 -1
  7. package/dist/FooterSiteMap/AxosBank/FooterSiteMap.js +2 -1
  8. package/dist/Forms/ApplicationStart.js +3 -2
  9. package/dist/Forms/CommercialLending.js +3 -2
  10. package/dist/Forms/ContactCompany.js +3 -2
  11. package/dist/Forms/ContactUs.js +3 -2
  12. package/dist/Forms/ContactUsAAS.js +30 -28
  13. package/dist/Forms/ContactUsBusiness.js +4 -3
  14. package/dist/Forms/ContactUsNMLSId.js +4 -3
  15. package/dist/Forms/DealerServices.js +3 -2
  16. package/dist/Forms/EmailOnly.js +4 -3
  17. package/dist/Forms/SalesforceFieldsForm.d.ts +0 -1
  18. package/dist/Forms/ScheduleCall.js +7 -3
  19. package/dist/Forms/ScheduleCallPremier.js +3 -2
  20. package/dist/Forms/SuccesForm.js +3 -2
  21. package/dist/Forms/WcplSurvey.js +3 -2
  22. package/dist/Hyperlink/index.js +2 -1
  23. package/dist/ImageLink/ImageLink.js +2 -1
  24. package/dist/ImageLink/ImageLinkSet.js +2 -1
  25. package/dist/ImageLink/index.js +2 -1
  26. package/dist/Input/Checkbox.d.ts +1 -1
  27. package/dist/Input/CurrencyInput.js +3 -2
  28. package/dist/Input/DatePicker.css.d.ts +1 -0
  29. package/dist/Input/DatePicker.css.js +6 -0
  30. package/dist/Input/Datepicker.d.ts +3 -0
  31. package/dist/Input/Datepicker.js +47 -0
  32. package/dist/Input/InputDate.css.d.ts +6 -0
  33. package/dist/Input/InputDate.css.js +15 -0
  34. package/dist/Input/InputDate.d.ts +3 -0
  35. package/dist/Input/InputDate.js +47 -0
  36. package/dist/Input/InputPhone.js +3 -2
  37. package/dist/Input/InputProps.d.ts +6 -0
  38. package/dist/Input/index.d.ts +3 -0
  39. package/dist/Input/index.js +6 -0
  40. package/dist/Modal/Modal.js +2 -1
  41. package/dist/NavigationMenu/AxosAdvisorServices/NavData.d.ts +8 -3
  42. package/dist/NavigationMenu/AxosAdvisorServices/NavData.js +45 -29
  43. package/dist/NavigationMenu/AxosAdvisorServices/SubNavBar.js +14 -10
  44. package/dist/NavigationMenu/AxosBank/SubNavBar.js +2 -1
  45. package/dist/SetContainer/SetContainer.js +2 -1
  46. package/dist/Table/Table.d.ts +11 -11
  47. package/dist/assets/Input/DatePicker.css +95 -0
  48. package/dist/assets/Input/InputDate.css +39 -0
  49. package/dist/main.js +6 -0
  50. package/dist/utils/allowedAxosDomains.js +2 -1
  51. package/package.json +1 -1
@@ -0,0 +1,47 @@
1
+ "use client";
2
+ import { jsxs, jsx } from "react/jsx-runtime";
3
+ import { useState } from "react";
4
+ import DatePicker from "react-date-picker";
5
+ import { wrapper, labelClassName, container, iconContainer, iconInput, helperText } from "./Input.css.js";
6
+ const DatePickerInput = (props) => {
7
+ const {
8
+ disabled,
9
+ label,
10
+ iconLeft,
11
+ iconRight,
12
+ sizes,
13
+ error = false,
14
+ helperText: helper,
15
+ variant
16
+ } = props;
17
+ const [value, onChange] = useState();
18
+ return /* @__PURE__ */ jsxs("div", { className: wrapper(), children: [
19
+ label && /* @__PURE__ */ jsx(
20
+ "label",
21
+ {
22
+ className: labelClassName({ error, variant }),
23
+ htmlFor: props.name,
24
+ children: label
25
+ }
26
+ ),
27
+ /* @__PURE__ */ jsxs("div", { className: container({ size: sizes, error }), children: [
28
+ iconLeft && /* @__PURE__ */ jsx("span", { className: iconContainer["left"], children: /* @__PURE__ */ jsx("div", { className: iconInput({ size: sizes }), children: iconLeft }) }),
29
+ /* @__PURE__ */ jsx(
30
+ DatePicker,
31
+ {
32
+ dayPlaceholder: "dd",
33
+ monthPlaceholder: "mm",
34
+ yearPlaceholder: "yyyy",
35
+ minDate: /* @__PURE__ */ new Date(),
36
+ onChange,
37
+ value
38
+ }
39
+ ),
40
+ iconRight && /* @__PURE__ */ jsx("span", { className: iconContainer.right, children: /* @__PURE__ */ jsx("div", { className: iconInput({ size: sizes }), children: iconRight }) })
41
+ ] }),
42
+ /* @__PURE__ */ jsx("span", { className: helperText({ disabled, error }), children: helper })
43
+ ] });
44
+ };
45
+ export {
46
+ DatePickerInput
47
+ };
@@ -0,0 +1,6 @@
1
+ export declare const calendarContainer: string;
2
+ export declare const calendarIcon: string;
3
+ export declare const inputDate: string;
4
+ export declare const verticalCenter: string;
5
+ export declare const calendar: string;
6
+ export declare const headerCalendar: string;
@@ -0,0 +1,15 @@
1
+ /* empty css */
2
+ var calendarContainer = "skzved0";
3
+ var calendarIcon = "skzved1";
4
+ var inputDate = "skzved2";
5
+ var verticalCenter = "skzved3";
6
+ var calendar = "skzved4";
7
+ var headerCalendar = "skzved5";
8
+ export {
9
+ calendar,
10
+ calendarContainer,
11
+ calendarIcon,
12
+ headerCalendar,
13
+ inputDate,
14
+ verticalCenter
15
+ };
@@ -0,0 +1,3 @@
1
+ import { DatepickerInputProps } from './InputProps';
2
+
3
+ export declare const InputDate: (props: DatepickerInputProps) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,47 @@
1
+ "use client";
2
+ import { jsxs, jsx } from "react/jsx-runtime";
3
+ import { useState } from "react";
4
+ import DatePicker from "react-date-picker";
5
+ import { wrapper, labelClassName, container, iconContainer, iconInput, helperText } from "./Input.css.js";
6
+ const InputDate = (props) => {
7
+ const {
8
+ disabled,
9
+ label,
10
+ iconLeft,
11
+ iconRight,
12
+ sizes,
13
+ error = false,
14
+ helperText: helper,
15
+ variant
16
+ } = props;
17
+ const [value, onChange] = useState();
18
+ return /* @__PURE__ */ jsxs("div", { className: wrapper(), children: [
19
+ label && /* @__PURE__ */ jsx(
20
+ "label",
21
+ {
22
+ className: labelClassName({ error, variant }),
23
+ htmlFor: props.name,
24
+ children: label
25
+ }
26
+ ),
27
+ /* @__PURE__ */ jsxs("div", { className: container({ size: sizes, error }), children: [
28
+ iconLeft && /* @__PURE__ */ jsx("span", { className: iconContainer["left"], children: /* @__PURE__ */ jsx("div", { className: iconInput({ size: sizes }), children: iconLeft }) }),
29
+ /* @__PURE__ */ jsx(
30
+ DatePicker,
31
+ {
32
+ dayPlaceholder: "dd",
33
+ monthPlaceholder: "mm",
34
+ yearPlaceholder: "yyyy",
35
+ minDate: /* @__PURE__ */ new Date(),
36
+ onChange,
37
+ value
38
+ }
39
+ ),
40
+ iconRight && /* @__PURE__ */ jsx("span", { className: iconContainer.right, children: /* @__PURE__ */ jsx("div", { className: iconInput({ size: sizes }), children: iconRight }) })
41
+ ] }),
42
+ /* @__PURE__ */ jsx("span", { className: helperText({ disabled, error }), children: helper })
43
+ ] });
44
+ };
45
+ export {
46
+ InputDate
47
+ };
@@ -3,11 +3,12 @@ import { InputMask } from "@react-input/mask";
3
3
  import { forwardRef } from "react";
4
4
  import "./Checkbox.js";
5
5
  import "./CurrencyInput.js";
6
- import "./Dropdown.js";
6
+ import "./Input.css.js";
7
7
  /* empty css */
8
+ /* empty css */
9
+ import "./Dropdown.js";
8
10
  /* empty css */
9
11
  import { Input } from "./Input.js";
10
- import "./Input.css.js";
11
12
  import "./InputTextArea.js";
12
13
  const InputPhone = forwardRef(
13
14
  (props, ref) => {
@@ -36,3 +36,9 @@ export interface RadioButtonProps extends InputProps {
36
36
  value: string | number;
37
37
  groupName: string;
38
38
  }
39
+ export interface DatepickerInputProps extends InputProps {
40
+ month?: string;
41
+ selected?: string;
42
+ show?: boolean;
43
+ onDateChange: (day: string) => void;
44
+ }
@@ -1,9 +1,12 @@
1
1
  export * from './Checkbox';
2
2
  export * from './CurrencyInput';
3
+ export * from './Datepicker';
4
+ export * from './DatePicker.css';
3
5
  export * from './Dropdown';
4
6
  export * from './Dropdown.css';
5
7
  export * from './Input';
6
8
  export * from './Input.css';
9
+ export * from './InputDate';
7
10
  export * from './InputPhone';
8
11
  export * from './InputProps';
9
12
  export * from './InputTextArea';
@@ -1,19 +1,25 @@
1
1
  import { Checkbox } from "./Checkbox.js";
2
2
  import { CurrencyInput } from "./CurrencyInput.js";
3
+ import { DatePickerInput } from "./Datepicker.js";
4
+ import { datePicker } from "./DatePicker.css.js";
3
5
  import { Dropdown } from "./Dropdown.js";
4
6
  import { selectInput } from "./Dropdown.css.js";
5
7
  import { Input } from "./Input.js";
6
8
  import { container, helperText, iconContainer, iconContainerBase, iconInput, input, labelClassName, wrapper } from "./Input.css.js";
9
+ import { InputDate } from "./InputDate.js";
7
10
  import { InputPhone } from "./InputPhone.js";
8
11
  import { InputTextArea } from "./InputTextArea.js";
9
12
  export {
10
13
  Checkbox,
11
14
  CurrencyInput,
15
+ DatePickerInput,
12
16
  Dropdown,
13
17
  Input,
18
+ InputDate,
14
19
  InputPhone,
15
20
  InputTextArea,
16
21
  container,
22
+ datePicker,
17
23
  helperText,
18
24
  iconContainer,
19
25
  iconContainerBase,
@@ -29,10 +29,11 @@ import "../Calculators/BalanceAPYCalculator/BalanceAPYCalculator.css.js";
29
29
  import "@hookform/resolvers/zod";
30
30
  import "../Input/Checkbox.js";
31
31
  import "../Input/CurrencyInput.js";
32
+ import "../Input/Input.css.js";
33
+ /* empty css */
32
34
  import "../Input/Dropdown.js";
33
35
  /* empty css */
34
36
  import "../Input/Input.js";
35
- import "../Input/Input.css.js";
36
37
  import "../Input/InputPhone.js";
37
38
  import "../Input/InputTextArea.js";
38
39
  import "react-hook-form";
@@ -3,17 +3,22 @@ export declare const navItems: {
3
3
  url: string;
4
4
  }[];
5
5
  export declare const subNavItems: {
6
- support: {
6
+ scaleYourBusiness: {
7
7
  name: string;
8
8
  url: string;
9
9
  id: string;
10
10
  }[];
11
- technology: {
11
+ serveYourClients: {
12
12
  name: string;
13
13
  url: string;
14
14
  id: string;
15
15
  }[];
16
- solutions: {
16
+ optimizeOperations: {
17
+ name: string;
18
+ url: string;
19
+ id: string;
20
+ }[];
21
+ axosAdvantage: {
17
22
  name: string;
18
23
  url: string;
19
24
  id: string;
@@ -1,51 +1,67 @@
1
1
  const navItems = [
2
- { name: "About Us", url: "/about-us" },
3
- { name: "Personalized Support", url: "/personalized-support" },
4
- { name: "Intuitive Technology", url: "/intuitive-technology" },
5
- { name: "Growth Solutions", url: "/growth-solutions" },
6
- { name: "Knowledge", url: "/knowledge" },
7
- { name: "Contact Us", url: "/contact-us" }
2
+ { name: "Home", url: "/" },
3
+ { name: "Scale Your Business", url: "/scale-your-business" },
4
+ { name: "Serve Your Clients", url: "/serve-your-clients" },
5
+ { name: "Optimize Operations", url: "/optimize-operations" },
6
+ { name: "Axos Advantage", url: "/axos-advantage" }
8
7
  ];
9
8
  const subNavItems = {
10
- support: [
9
+ scaleYourBusiness: [
11
10
  {
12
- name: "Going Independent",
13
- url: "/personalized-support/going-independent",
14
- id: "ps_1"
11
+ name: "Unlock Independence",
12
+ url: "/scale-your-business/unlock-independence",
13
+ id: "syb_1"
14
+ }
15
+ ],
16
+ serveYourClients: [
17
+ {
18
+ name: "Cash Management Solutions",
19
+ url: "/cash-management-solutions",
20
+ id: "syc_1"
15
21
  },
16
22
  {
17
- name: "Client Service Team",
18
- url: "/personalized-support/client-service-team",
19
- id: "ps_2"
23
+ name: "Retirement Plans",
24
+ url: "/serve-your-clients/retirement-plans",
25
+ id: "syc_2"
20
26
  },
21
27
  {
22
- name: "Sales Team",
23
- url: "/sales-team",
24
- id: "ps_3"
28
+ name: "Managed Investment Solutions",
29
+ url: "/serve-your-clients/managed-investment-solutions",
30
+ id: "syc_3"
25
31
  }
26
32
  ],
27
- technology: [
33
+ optimizeOperations: [
28
34
  {
29
35
  name: "Technology Providers",
30
- url: "/intuitive-technology/technology-providers",
31
- id: "it_1"
36
+ url: "/optimize-operations/technology-providers",
37
+ id: "oo_1"
38
+ },
39
+ {
40
+ name: "Axos Client Portal",
41
+ url: "https://www.axosbank.com/pages/axos-client-portal",
42
+ id: "oo_2"
32
43
  }
33
44
  ],
34
- solutions: [
45
+ axosAdvantage: [
35
46
  {
36
- name: "Money Manager X-Change",
37
- url: "/growth-solutions/money-manager-x-change",
38
- id: "gs_1"
47
+ name: "About AXOS",
48
+ url: "/axos-advantage/about-axos",
49
+ id: "aa_1"
39
50
  },
40
51
  {
41
- name: "Retirement Solutions",
42
- url: "/growth-solutions/retirement-solutions",
43
- id: "gs_2"
52
+ name: "Client Service Team",
53
+ url: "/axos-advantage/personalized-support",
54
+ id: "aa_2"
44
55
  },
45
56
  {
46
- name: "Banking and Lending Solutions",
47
- url: "/growth-solutions/banking-and-lending-solutions",
48
- id: "gs_3"
57
+ name: "Insights & Ideas",
58
+ url: "/axos-advantage/insights-and-ideas",
59
+ id: "aa_3"
60
+ },
61
+ {
62
+ name: "Sales Team",
63
+ url: "/axos-advantage/sales-team",
64
+ id: "aa_4"
49
65
  }
50
66
  ]
51
67
  };
@@ -7,28 +7,32 @@ import { subNavItems } from "./NavData.js";
7
7
  import { sub_nav } from "./SubNavbar.css.js";
8
8
  function SubNavBar() {
9
9
  const { pathname } = useLocation();
10
- const support = subNavItems.support;
11
- const technology = subNavItems.technology;
12
- const solutions = subNavItems.solutions;
10
+ const scaleYourBusiness = subNavItems.scaleYourBusiness;
11
+ const serveYourClients = subNavItems.serveYourClients;
12
+ const optimizeOperations = subNavItems.optimizeOperations;
13
+ const axosAdvantage = subNavItems.axosAdvantage;
13
14
  const [showNavbar, setShowNavbar] = useState(false);
14
15
  useEffect(() => {
15
16
  setShowNavbar(
16
17
  () => [
17
- "/personalized-support",
18
- "/intuitive-technology",
19
- "/sales-team",
20
- "/growth-solutions"
18
+ "/scale-your-business",
19
+ "/serve-your-clients",
20
+ "/optimize-operations",
21
+ "/axos-advantage"
21
22
  ].some((el) => pathname?.includes(el))
22
23
  );
23
24
  }, [pathname]);
24
25
  return showNavbar ? /* @__PURE__ */ jsx("div", { className: `${styles.sub_nav} ${sub_nav} ${styles.desktop_only}`, children: /* @__PURE__ */ jsx("div", { className: styles.wrapper, children: /* @__PURE__ */ jsx("div", { className: styles.header_sub_row, children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("ul", { className: "list_unstyled flex_row middle", children: [
25
- (pathname?.includes("/personalized-support") || pathname?.includes("/sales-team")) && support?.map(
26
+ pathname?.includes("/scale-your-business") && scaleYourBusiness?.map(
26
27
  (item) => /* @__PURE__ */ jsx("li", { className: styles.sub_nav_link, children: /* @__PURE__ */ jsx("a", { href: item.url, role: "menuitem", children: item.name }) }, `snb-${item.id}`)
27
28
  ),
28
- pathname?.includes("/intuitive-technology") && technology.map(
29
+ (pathname?.includes("/serve-your-clients") || pathname?.includes("/cash-management-solutions")) && serveYourClients.map(
29
30
  (item) => /* @__PURE__ */ jsx("li", { className: styles.sub_nav_link, children: /* @__PURE__ */ jsx("a", { href: item.url, role: "menuitem", children: item.name }) }, `snb-${item.id}`)
30
31
  ),
31
- pathname?.includes("/growth-solutions") && solutions.map(
32
+ pathname?.includes("/optimize-operations") && optimizeOperations.map(
33
+ (item) => /* @__PURE__ */ jsx("li", { className: styles.sub_nav_link, children: /* @__PURE__ */ jsx("a", { href: item.url, role: "menuitem", children: item.name }) }, `snb-${item.id}`)
34
+ ),
35
+ pathname?.includes("/axos-advantage") && axosAdvantage.map(
32
36
  (item) => /* @__PURE__ */ jsx("li", { className: styles.sub_nav_link, children: /* @__PURE__ */ jsx("a", { href: item.url, role: "menuitem", children: item.name }) }, `snb-${item.id}`)
33
37
  )
34
38
  ] }) }) }) }) }) : /* @__PURE__ */ jsx(Fragment, {});
@@ -31,10 +31,11 @@ import "../../Calculators/BalanceAPYCalculator/BalanceAPYCalculator.css.js";
31
31
  import "@hookform/resolvers/zod";
32
32
  import "../../Input/Checkbox.js";
33
33
  import "../../Input/CurrencyInput.js";
34
+ import "../../Input/Input.css.js";
35
+ /* empty css */
34
36
  import "../../Input/Dropdown.js";
35
37
  /* empty css */
36
38
  import "../../Input/Input.js";
37
- import "../../Input/Input.css.js";
38
39
  import "../../Input/InputPhone.js";
39
40
  import "../../Input/InputTextArea.js";
40
41
  import "react-hook-form";
@@ -31,10 +31,11 @@ import "../Calculators/BalanceAPYCalculator/BalanceAPYCalculator.css.js";
31
31
  import "@hookform/resolvers/zod";
32
32
  import "../Input/Checkbox.js";
33
33
  import "../Input/CurrencyInput.js";
34
+ import "../Input/Input.css.js";
35
+ /* empty css */
34
36
  import "../Input/Dropdown.js";
35
37
  /* empty css */
36
38
  import "../Input/Input.js";
37
- import "../Input/Input.css.js";
38
39
  import "../Input/InputPhone.js";
39
40
  import "../Input/InputTextArea.js";
40
41
  import "react-hook-form";
@@ -15,7 +15,7 @@ export declare const TableCell: ({ children, as, variant, highlighted, ...props
15
15
  suppressHydrationWarning?: boolean | undefined;
16
16
  accessKey?: string | undefined;
17
17
  autoFocus?: boolean | undefined;
18
- contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
18
+ contentEditable?: (boolean | "false" | "true") | "inherit" | "plaintext-only" | undefined;
19
19
  contextMenu?: string | undefined;
20
20
  dir?: string | undefined;
21
21
  draggable?: (boolean | "false" | "true") | undefined;
@@ -28,7 +28,7 @@ export declare const TableCell: ({ children, as, variant, highlighted, ...props
28
28
  style?: import('react').CSSProperties | undefined;
29
29
  tabIndex?: number | undefined;
30
30
  title?: string | undefined;
31
- translate?: "no" | "yes" | undefined;
31
+ translate?: "yes" | "no" | undefined;
32
32
  radioGroup?: string | undefined;
33
33
  role?: import('react').AriaRole | undefined;
34
34
  about?: string | undefined;
@@ -53,32 +53,32 @@ export declare const TableCell: ({ children, as, variant, highlighted, ...props
53
53
  itemRef?: string | undefined;
54
54
  results?: number | undefined;
55
55
  security?: string | undefined;
56
- unselectable?: "off" | "on" | undefined;
57
- inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
56
+ unselectable?: "on" | "off" | undefined;
57
+ inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
58
58
  is?: string | undefined;
59
59
  "aria-activedescendant"?: string | undefined;
60
60
  "aria-atomic"?: (boolean | "false" | "true") | undefined;
61
- "aria-autocomplete"?: "none" | "both" | "inline" | "list" | undefined;
61
+ "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
62
62
  "aria-braillelabel"?: string | undefined;
63
63
  "aria-brailleroledescription"?: string | undefined;
64
64
  "aria-busy"?: (boolean | "false" | "true") | undefined;
65
- "aria-checked"?: boolean | "mixed" | "false" | "true" | undefined;
65
+ "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined;
66
66
  "aria-colcount"?: number | undefined;
67
67
  "aria-colindex"?: number | undefined;
68
68
  "aria-colindextext"?: string | undefined;
69
69
  "aria-colspan"?: number | undefined;
70
70
  "aria-controls"?: string | undefined;
71
- "aria-current"?: boolean | "page" | "false" | "true" | "time" | "step" | "location" | "date" | undefined;
71
+ "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined;
72
72
  "aria-describedby"?: string | undefined;
73
73
  "aria-description"?: string | undefined;
74
74
  "aria-details"?: string | undefined;
75
75
  "aria-disabled"?: (boolean | "false" | "true") | undefined;
76
- "aria-dropeffect"?: "link" | "none" | "copy" | "move" | "execute" | "popup" | undefined;
76
+ "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
77
77
  "aria-errormessage"?: string | undefined;
78
78
  "aria-expanded"?: (boolean | "false" | "true") | undefined;
79
79
  "aria-flowto"?: string | undefined;
80
80
  "aria-grabbed"?: (boolean | "false" | "true") | undefined;
81
- "aria-haspopup"?: boolean | "grid" | "listbox" | "menu" | "false" | "true" | "dialog" | "tree" | undefined;
81
+ "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
82
82
  "aria-hidden"?: (boolean | "false" | "true") | undefined;
83
83
  "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
84
84
  "aria-keyshortcuts"?: string | undefined;
@@ -93,9 +93,9 @@ export declare const TableCell: ({ children, as, variant, highlighted, ...props
93
93
  "aria-owns"?: string | undefined;
94
94
  "aria-placeholder"?: string | undefined;
95
95
  "aria-posinset"?: number | undefined;
96
- "aria-pressed"?: boolean | "mixed" | "false" | "true" | undefined;
96
+ "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined;
97
97
  "aria-readonly"?: (boolean | "false" | "true") | undefined;
98
- "aria-relevant"?: "all" | "text" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
98
+ "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
99
99
  "aria-required"?: (boolean | "false" | "true") | undefined;
100
100
  "aria-roledescription"?: string | undefined;
101
101
  "aria-rowcount"?: number | undefined;
@@ -0,0 +1,95 @@
1
+ .react-date-picker {
2
+ width: 100%;
3
+ }
4
+ .react-date-picker__wrapper {
5
+ border: none !important;
6
+ }
7
+ .react-calendar__month-view__weekdays__weekday {
8
+ width: 45px;
9
+ height: 22px;
10
+ margin: 0;
11
+ display: inline-flex;
12
+ align-items: center;
13
+ font-family: var(--main-font-family);
14
+ font-weight: 500;
15
+ letter-spacing: 0.2px;
16
+ justify-content: center;
17
+ }
18
+ .react-calendar__month-view__weekdays__weekday {
19
+ font-size: 12px;
20
+ line-height: 16;
21
+ color: #2F5B88;
22
+ }
23
+ .react-calendar__month-view__weekdays__weekday > abbr {
24
+ text-decoration: none;
25
+ }
26
+ .react-calendar__month-view__days__day {
27
+ width: 49px;
28
+ height: 49px;
29
+ margin: 0;
30
+ display: inline-flex;
31
+ align-items: center;
32
+ justify-content: center;
33
+ }
34
+ .react-calendar__month-view__days__day > abbr {
35
+ font-family: var(--main-font-family) !important;
36
+ font-weight: 500;
37
+ letter-spacing: 0.2px;
38
+ color: #051A3F;
39
+ }
40
+ .react-date-picker__inputGroup__input, .react-date-picker__inputGroup__divider {
41
+ color: #5E6A74 !important;
42
+ }
43
+ .react-date-picker__clear-button {
44
+ display: none;
45
+ }
46
+ .react-calendar__navigation__label__labelText {
47
+ font-weight: 600;
48
+ font-size: 24px;
49
+ line-height: 36px;
50
+ letter-spacing: 0.2px;
51
+ color: #1E3860;
52
+ font-family: var(--header-font-family);
53
+ }
54
+ .react-datepicker-popper {
55
+ transform: translateY(40px)!important;
56
+ }
57
+ .react-calendar__month-view__days__day--neighboringMonth {
58
+ background-color: #F4F4F4 !important;
59
+ opacity: 50%;
60
+ }
61
+ .react-calendar__month-view__days__day--neighboringMonth > abbr {
62
+ color: #5E6A74;
63
+ }
64
+ .react-calendar__tile--active > abbr {
65
+ color: white;
66
+ }
67
+ .react-calendar {
68
+ border: 12px solid #FFFFFF4D !important;
69
+ border-radius: 4px;
70
+ }
71
+ .react-calendar__navigation__prev2-button, .react-calendar__navigation__next2-button {
72
+ display: none;
73
+ }
74
+ .react-date-picker__calendar {
75
+ max-width: 100% !important;
76
+ }
77
+ .react-date-picker__inputGroup__input:focus-visible {
78
+ outline: none;
79
+ }
80
+ .react-date-picker__inputGroup__input:invalid {
81
+ background: transparent !important;
82
+ }
83
+ @media screen and (max-width:320px) {
84
+ .react-calendar__month-view__weekdays__weekday {
85
+ width: 43.5px;
86
+ }
87
+ .react-calendar__month-view__days__day {
88
+ width: 43.5px;
89
+ }
90
+ }
91
+ @media screen and (max-width:400px) {
92
+ .react-calendar__navigation .react-calendar__navigation__prev-button, .react-calendar__navigation .react-calendar__navigation__next-button {
93
+ min-width: auto;
94
+ }
95
+ }
@@ -0,0 +1,39 @@
1
+ .skzved0 {
2
+ position: relative;
3
+ }
4
+ .skzved1 {
5
+ position: relative;
6
+ top: 5px;
7
+ left: 5px;
8
+ }
9
+ .skzved2 {
10
+ width: 100px;
11
+ padding-left: 5px;
12
+ padding-right: 5px;
13
+ line-height: 28px;
14
+ font-size: 14pt;
15
+ }
16
+ .skzved3 {
17
+ display: flex;
18
+ justify-content: center;
19
+ align-items: center;
20
+ }
21
+ .skzved4 {
22
+ display: block;
23
+ background: #FFFFFF;
24
+ width: 300px;
25
+ border: solid 1px #CCCCCC;
26
+ margin: 10px auto;
27
+ box-shadow: 0 0 15px 0 #C0C0C0;
28
+ font-size: 1.3rem;
29
+ text-align: center;
30
+ z-index: 999;
31
+ }
32
+ .skzved4 .skzved5 {
33
+ display: flex;
34
+ justify-content: center;
35
+ align-items: center;
36
+ color: #FFFFFF;
37
+ cursor: default;
38
+ font-weight: bold;
39
+ }
package/dist/main.js CHANGED
@@ -74,10 +74,13 @@ import "react";
74
74
  import { ImageLinkSet } from "./ImageLink/ImageLinkSet.js";
75
75
  import { Checkbox } from "./Input/Checkbox.js";
76
76
  import { CurrencyInput } from "./Input/CurrencyInput.js";
77
+ import { DatePickerInput } from "./Input/Datepicker.js";
78
+ import { datePicker } from "./Input/DatePicker.css.js";
77
79
  import { Dropdown } from "./Input/Dropdown.js";
78
80
  import { selectInput } from "./Input/Dropdown.css.js";
79
81
  import { Input } from "./Input/Input.js";
80
82
  import { container, helperText, iconContainer, iconContainerBase, iconInput, input, labelClassName, wrapper } from "./Input/Input.css.js";
83
+ import { InputDate } from "./Input/InputDate.js";
81
84
  import { InputPhone } from "./Input/InputPhone.js";
82
85
  import { InputTextArea } from "./Input/InputTextArea.js";
83
86
  import { Interstitial } from "./Interstitial/index.js";
@@ -195,6 +198,7 @@ export {
195
198
  ContactUsNMLSId,
196
199
  ContentBanner,
197
200
  CurrencyInput,
201
+ DatePickerInput,
198
202
  DealerServices,
199
203
  default15 as DownloadIcon,
200
204
  DownloadTile,
@@ -221,6 +225,7 @@ export {
221
225
  ImageBillboardSet,
222
226
  ImageLinkSet,
223
227
  Input,
228
+ InputDate,
224
229
  InputPhone,
225
230
  InputTextArea,
226
231
  Interstitial,
@@ -334,6 +339,7 @@ export {
334
339
  containerIconBillboard,
335
340
  content,
336
341
  copy,
342
+ datePicker,
337
343
  description,
338
344
  descriptionField,
339
345
  details,
@@ -11,7 +11,8 @@ const moreDomains = {
11
11
  "{UFBDIRECT}": "https://www.ufbdirect.com",
12
12
  "{ARMS}": "https://arms.axosadvisor.com",
13
13
  "{APPS}": "https://apps.axosbank.com",
14
- "{AFP}": "https://afp.axosbank.com"
14
+ "{AFP}": "https://afp.axosbank.com",
15
+ "{INVESTORS}": "https://investors.axosfinancial.com"
15
16
  // "assets.axos.com": "https://assets.axos.com",
16
17
  // "images.axos.com": "https://images.axos.com",
17
18
  };