@sendoutcards/quantum-design-ui 1.8.13 → 1.8.14

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.
package/dist/index.es.js CHANGED
@@ -17465,7 +17465,7 @@ var Logo = function (_a) {
17465
17465
  color: color,
17466
17466
  width: (_d = secondaryLogo === null || secondaryLogo === void 0 ? void 0 : secondaryLogo.width) !== null && _d !== void 0 ? _d : width,
17467
17467
  type: "fullLogo"
17468
- })), "company")));
17468
+ })), "mechanism")));
17469
17469
  };
17470
17470
 
17471
17471
  var getDifference = function (currentDate, endDate) {
@@ -17757,7 +17757,7 @@ var LinkColumn = function (_a) {
17757
17757
  }, jsx(VStack, {
17758
17758
  gap: "x1_5"
17759
17759
  }, linkColumn.links.map(function (subLink, index) {
17760
- return jsx(Anchor, {
17760
+ return typeof subLink.title === 'string' ? jsx(Anchor, {
17761
17761
  key: index,
17762
17762
  color: subLinkColor,
17763
17763
  cursor: 'pointer',
@@ -17766,7 +17766,14 @@ var LinkColumn = function (_a) {
17766
17766
  target: subLink.target,
17767
17767
  size: "small",
17768
17768
  onClick: subLink.onClick
17769
- });
17769
+ }) : jsx(Anchor, {
17770
+ key: index,
17771
+ cursor: 'pointer',
17772
+ href: subLink.href,
17773
+ target: subLink.target,
17774
+ size: "small",
17775
+ onClick: subLink.onClick
17776
+ }, subLink.title);
17770
17777
  })))));
17771
17778
  };
17772
17779
 
@@ -17807,7 +17814,7 @@ var DropDownMenu = function (_a) {
17807
17814
  weight: "semiBold",
17808
17815
  lineHeight: 1.2
17809
17816
  }), linkColumn.links.map(function (link) {
17810
- return link.icon ? jsx(IconLink, {
17817
+ return typeof link.title === 'string' ? link.icon ? jsx(IconLink, {
17811
17818
  icon: link.icon,
17812
17819
  title: link.title,
17813
17820
  size: 'small',
@@ -17815,9 +17822,12 @@ var DropDownMenu = function (_a) {
17815
17822
  }) : jsx(Anchor, {
17816
17823
  title: link.title,
17817
17824
  href: link.href,
17818
- onClick: link.onClick ? link.onClick : function () {},
17825
+ onClick: link.onClick,
17819
17826
  color: 'primaryBody'
17820
- });
17827
+ }) : jsx(Anchor, {
17828
+ href: link.href,
17829
+ onClick: link.onClick
17830
+ }, link.title);
17821
17831
  }))));
17822
17832
  };
17823
17833
 
@@ -21491,18 +21501,23 @@ var MobileView = function (_a) {
21491
21501
  }, jsx(VStack, {
21492
21502
  gap: "x0"
21493
21503
  }, links && links.map(function (item, i) {
21494
- return isLinkType(item) ? jsx(Anchor, _extends({
21504
+ return isLinkType(item) ? typeof item.title === 'string' ? jsx(Anchor, _extends({
21495
21505
  inset: {
21496
21506
  horizontal: 'x3'
21497
21507
  },
21498
21508
  key: "pusher-anchor-" + i,
21499
21509
  target: "_blank"
21500
21510
  }, item, {
21511
+ title: item.title,
21501
21512
  height: "70px",
21502
21513
  display: "flex",
21503
21514
  alignItems: "center",
21504
21515
  style: borderBottom
21505
- })) : jsx(Div, {
21516
+ })) : jsx(Anchor, {
21517
+ href: item.href,
21518
+ onClick: item.onClick,
21519
+ target: item.target
21520
+ }, item.title) : jsx(Div, {
21506
21521
  cursor: "pointer",
21507
21522
  display: "flex",
21508
21523
  justifyContent: "space-between",
@@ -21575,7 +21590,7 @@ var AccordionSection = function (_a) {
21575
21590
  body: jsx(Div, {
21576
21591
  width: "100%"
21577
21592
  }, links.map(function (link, i) {
21578
- return jsx(Div, {
21593
+ return typeof link.title === 'string' ? jsx(Div, {
21579
21594
  display: "flex",
21580
21595
  alignItems: "center",
21581
21596
  inset: {
@@ -21583,9 +21598,13 @@ var AccordionSection = function (_a) {
21583
21598
  vertical: 'x1'
21584
21599
  },
21585
21600
  key: "accordion-section-" + i
21586
- }, jsx(Anchor, _extends({
21601
+ }, jsx(Anchor, _extends({}, link, {
21602
+ title: link.title,
21587
21603
  target: "_blank"
21588
- }, link)));
21604
+ }))) : jsx(Anchor, {
21605
+ href: link.href,
21606
+ onClick: link.onClick
21607
+ }, link.title);
21589
21608
  }))
21590
21609
  };
21591
21610
  }
@@ -21609,30 +21628,30 @@ var styles$6 = {
21609
21628
  var templateObject_1$7;
21610
21629
 
21611
21630
  var StaticNavigation = function (_a) {
21612
- var _b;
21631
+ var _b, _c;
21613
21632
  var accountSection = _a.accountSection,
21614
21633
  logo = _a.logo,
21615
21634
  links = _a.links,
21616
- _c = _a.zIndex,
21617
- zIndex = _c === void 0 ? 3 : _c,
21635
+ _d = _a.zIndex,
21636
+ zIndex = _d === void 0 ? 3 : _d,
21618
21637
  openValueOverride = _a.openValueOverride,
21619
- _d = _a.drawerOffset,
21620
- drawerOffset = _d === void 0 ? 60 : _d,
21638
+ _e = _a.drawerOffset,
21639
+ drawerOffset = _e === void 0 ? 60 : _e,
21621
21640
  isFrosted = _a.isFrosted,
21622
- menuDropdown = _a.menuDropdown;
21623
- var _e = useState(0),
21624
- selectedTab = _e[0],
21625
- setSelectedTab = _e[1];
21626
- var _f = useState(false),
21627
- isOpen = _f[0],
21628
- setIsOpen = _f[1];
21629
- var _g = React.useState(false),
21630
- isMenuOpen = _g[0],
21631
- setIsMenuOpen = _g[1];
21641
+ menuDropdownLinks = _a.menuDropdownLinks;
21642
+ var _f = useState(0),
21643
+ selectedTab = _f[0],
21644
+ setSelectedTab = _f[1];
21645
+ var _g = useState(false),
21646
+ isOpen = _g[0],
21647
+ setIsOpen = _g[1];
21648
+ var _h = React.useState(false),
21649
+ isMenuOpen = _h[0],
21650
+ setIsMenuOpen = _h[1];
21632
21651
  var size = useDeviceSize().device;
21633
- var _h = useResizeObserver(),
21634
- ref = _h.ref,
21635
- height = _h.height;
21652
+ var _j = useResizeObserver(),
21653
+ ref = _j.ref,
21654
+ height = _j.height;
21636
21655
  var hocs = useEntities().hocs;
21637
21656
  var isDropdownLinkType = function (valueToCheck) {
21638
21657
  var dropDownLink = valueToCheck;
@@ -21663,7 +21682,7 @@ var StaticNavigation = function (_a) {
21663
21682
  alignItems: "center",
21664
21683
  flexDirection: "row",
21665
21684
  columnGap: "x1"
21666
- }, menuDropdown && jsx(Div, {
21685
+ }, menuDropdownLinks && jsx(Div, {
21667
21686
  maxWidth: "300px"
21668
21687
  }, jsx("button", {
21669
21688
  style: {
@@ -21681,14 +21700,21 @@ var StaticNavigation = function (_a) {
21681
21700
  name: "promptingsIcon",
21682
21701
  primaryColor: "primaryHeadingText",
21683
21702
  size: "xSmall"
21684
- }), jsx(Icon, {
21703
+ }), jsx(Div, {
21704
+ style: {
21705
+ transform: isMenuOpen ? 'rotate(90deg)' : 'rotate(-90deg)',
21706
+ transition: 'transform 0.3s ease-in-out'
21707
+ }
21708
+ }, jsx(Icon, {
21685
21709
  name: "chevron",
21686
- orientation: 'down',
21687
21710
  primaryColor: "primaryHeadingText",
21688
21711
  size: "xSmall"
21689
- }))), jsx(DropDownMenu, _extends({}, menuDropdown, {
21690
- isOpen: isMenuOpen
21691
- }))), jsx(Logo, logo)), links && !isMobile && jsx(Flex, {
21712
+ })))), jsx(DropDownMenu, {
21713
+ linkColumn: menuDropdownLinks.linkColumn,
21714
+ isOpen: isMenuOpen,
21715
+ top: (_b = menuDropdownLinks.top) !== null && _b !== void 0 ? _b : 40,
21716
+ left: menuDropdownLinks.left
21717
+ })), jsx(Logo, logo)), links && !isMobile && jsx(Flex, {
21692
21718
  height: "100%",
21693
21719
  width: "100%",
21694
21720
  alignItems: "center",
@@ -21698,7 +21724,12 @@ var StaticNavigation = function (_a) {
21698
21724
  inset: {
21699
21725
  horizontal: size === 'large' ? 'x1' : 'x2'
21700
21726
  }
21701
- }, isDropdownLinkType(link) ? jsx(Div, {
21727
+ }, 'href' in link && typeof link.title === 'string' ? jsx(NavigationLink, {
21728
+ title: link.title,
21729
+ isActive: selectedTab === index && isOpen,
21730
+ href: link.href,
21731
+ target: link.target
21732
+ }) : isDropdownLinkType(link) ? jsx(Div, {
21702
21733
  onHoverStart: function () {
21703
21734
  setIsOpen(true);
21704
21735
  setSelectedTab(index);
@@ -21710,12 +21741,11 @@ var StaticNavigation = function (_a) {
21710
21741
  }, jsx(NavigationLink, {
21711
21742
  title: link.title,
21712
21743
  isActive: selectedTab === index && isOpen
21713
- })) : jsx(NavigationLink, {
21714
- title: link.title,
21715
- isActive: selectedTab === index && isOpen,
21744
+ })) : jsx(Anchor, {
21716
21745
  href: link.href,
21746
+ onClick: link.onClick,
21717
21747
  target: link.target
21718
- }));
21748
+ }, link.title));
21719
21749
  })), accountSection && jsx(Div, {
21720
21750
  display: "flex"
21721
21751
  }, accountSection)), jsx(Div, {
@@ -21732,7 +21762,7 @@ var StaticNavigation = function (_a) {
21732
21762
  onClick: function () {
21733
21763
  return setIsOpen(false);
21734
21764
  },
21735
- openValue: openValueOverride ? openValueOverride : (_b = height && height + 64 < 248 ? 248 : height && height + 64) !== null && _b !== void 0 ? _b : 280,
21765
+ openValue: openValueOverride ? openValueOverride : (_c = height && height + 64 < 248 ? 248 : height && height + 64) !== null && _c !== void 0 ? _c : 280,
21736
21766
  isTabHidden: true,
21737
21767
  showTab: false,
21738
21768
  zIndex: 10
@@ -21756,12 +21786,12 @@ var StaticNavigation = function (_a) {
21756
21786
  onClick: featuredColumn.onClick,
21757
21787
  href: featuredColumn.href,
21758
21788
  target: featuredColumn.target
21759
- }, jsx(Text, {
21789
+ }, typeof featuredColumn.title === 'string' ? jsx(Text, {
21760
21790
  type: "body",
21761
21791
  content: featuredColumn.title,
21762
21792
  color: "primaryHeading",
21763
21793
  weight: "semiBold"
21764
- }));
21794
+ }) : featuredColumn.title);
21765
21795
  })), jsx(Div, {
21766
21796
  height: "160px"
21767
21797
  }, jsx(Separator, {
@@ -1,9 +1,9 @@
1
1
  import React, { FC } from 'react';
2
2
  import { TextColor, IconType } from "../../exports/atoms";
3
- import { LogoProps, DropDownMenuProps } from "../../exports/molecules";
3
+ import { LogoProps } from "../../exports/molecules";
4
4
  export declare type Target = '_self' | '_blank' | '_parent' | '_top' | undefined;
5
5
  export declare type Link = {
6
- title: string;
6
+ title: React.ReactNode;
7
7
  href: string;
8
8
  onClick?: () => void;
9
9
  icon?: IconType;
@@ -28,6 +28,10 @@ export declare type StaticNavigationProps = {
28
28
  openValueOverride?: number;
29
29
  drawerOffset?: number;
30
30
  isFrosted?: boolean;
31
- menuDropdown?: DropDownMenuProps;
31
+ menuDropdownLinks?: {
32
+ linkColumn: LinkColumnType;
33
+ top?: number;
34
+ left?: number;
35
+ };
32
36
  };
33
37
  export declare const StaticNavigation: FC<StaticNavigationProps>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sendoutcards/quantum-design-ui",
3
- "version": "1.8.13",
3
+ "version": "1.8.14",
4
4
  "description": "UI component library for Quantum Design System",
5
5
  "module": "dist/index.es.js",
6
6
  "jsnext:main": "dist/index.es.js",
@@ -1,17 +0,0 @@
1
- import React from 'react';
2
- import { HOCBaseProps } from "../../helpers/hoc-types/hocBasePropTypes";
3
- import { HOCMotionProps } from "../../helpers/hoc-types/hocMotionTypes";
4
- export declare type DivProps = {
5
- children?: React.ReactNode;
6
- outsideClick?: () => void;
7
- clickElementBypass?: string;
8
- } & HOCBaseProps & HOCMotionProps;
9
- export declare const Companion: React.ForwardRefExoticComponent<{
10
- children?: React.ReactNode;
11
- outsideClick?: (() => void) | undefined;
12
- clickElementBypass?: string | undefined;
13
- } & HOCBaseProps & {
14
- className?: string | undefined;
15
- motionKey?: string | number | undefined;
16
- id?: string | undefined;
17
- } & import("framer-motion").MotionProps & React.RefAttributes<HTMLDivElement>>;