@common-origin/design-system 1.15.1 → 1.15.2

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.js CHANGED
@@ -806,7 +806,7 @@ var AvatarInitials = styled.span.withConfig({
806
806
  },
807
807
  displayName: "Avatar__AvatarInitials",
808
808
  componentId: "sc-ezn4ax-2"
809
- })(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n color: ", ";\n line-height: 1;\n text-transform: uppercase;\n user-select: none;\n"], ["\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n color: ", ";\n line-height: 1;\n text-transform: uppercase;\n user-select: none;\n"
809
+ })(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n color: ", ";\n line-height: 1;\n text-transform: uppercase;\n user-select: none;\n"], ["\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n color: ", ";\n line-height: 1;\n text-transform: uppercase;\n user-select: none;\n"
810
810
  // Helper function to get initials from name
811
811
  ])), tokensData.base.fontFamily.body, tokensData.base.fontWeight[3], function (_a) {
812
812
  var $size = _a.$size;
@@ -869,7 +869,7 @@ var Avatar = function Avatar(_a) {
869
869
  "aria-hidden": "true"
870
870
  }, initials));
871
871
  };
872
- var templateObject_1$y, templateObject_2$l, templateObject_3$h;
872
+ var templateObject_1$y, templateObject_2$l, templateObject_3$i;
873
873
 
874
874
  React.createElement;
875
875
  var _a$5 = tokensData.semantic,
@@ -1020,7 +1020,7 @@ var BadgeIndicator = styled.span.withConfig({
1020
1020
  },
1021
1021
  displayName: "Badge__BadgeIndicator",
1022
1022
  componentId: "sc-tjz4pp-1"
1023
- })(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n position: absolute;\n top: 0;\n right: 0;\n transform: translate(50%, -50%);\n display: ", ";\n align-items: center;\n justify-content: center;\n min-width: ", ";\n height: ", ";\n padding: ", ";\n border-radius: ", ";\n line-height: 1;\n white-space: nowrap;\n box-shadow: 0 0 0 2px ", ";\n animation: ", " 0.2s ease-out;\n \n ", "\n"], ["\n position: absolute;\n top: 0;\n right: 0;\n transform: translate(50%, -50%);\n display: ", ";\n align-items: center;\n justify-content: center;\n min-width: ", ";\n height: ", ";\n padding: ", ";\n border-radius: ", ";\n line-height: 1;\n white-space: nowrap;\n box-shadow: 0 0 0 2px ", ";\n animation: ", " 0.2s ease-out;\n \n ", "\n"])), function (props) {
1023
+ })(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n position: absolute;\n top: 0;\n right: 0;\n transform: translate(50%, -50%);\n display: ", ";\n align-items: center;\n justify-content: center;\n min-width: ", ";\n height: ", ";\n padding: ", ";\n border-radius: ", ";\n line-height: 1;\n white-space: nowrap;\n box-shadow: 0 0 0 2px ", ";\n animation: ", " 0.2s ease-out;\n \n ", "\n"], ["\n position: absolute;\n top: 0;\n right: 0;\n transform: translate(50%, -50%);\n display: ", ";\n align-items: center;\n justify-content: center;\n min-width: ", ";\n height: ", ";\n padding: ", ";\n border-radius: ", ";\n line-height: 1;\n white-space: nowrap;\n box-shadow: 0 0 0 2px ", ";\n animation: ", " 0.2s ease-out;\n \n ", "\n"])), function (props) {
1024
1024
  return props.$isVisible ? 'flex' : 'none';
1025
1025
  }, function (props) {
1026
1026
  return props.$isDot ? '8px' : '16px';
@@ -1076,7 +1076,7 @@ var Badge = function Badge(_a) {
1076
1076
  color: "inverse"
1077
1077
  }, displayCount), /*#__PURE__*/React.createElement(ScreenReaderOnly, null, label)));
1078
1078
  };
1079
- var templateObject_1$w, templateObject_2$k, templateObject_3$g, templateObject_4$e;
1079
+ var templateObject_1$w, templateObject_2$k, templateObject_3$h, templateObject_4$e;
1080
1080
 
1081
1081
  React.createElement;
1082
1082
  var StyledBox = styled.div.withConfig({
@@ -1092,7 +1092,7 @@ var StyledBox = styled.div.withConfig({
1092
1092
  }, function (props) {
1093
1093
  return props.$flexDirection && styled.css(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["flex-direction: ", ";"], ["flex-direction: ", ";"])), props.$flexDirection);
1094
1094
  }, function (props) {
1095
- return props.$justifyContent && styled.css(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["justify-content: ", ";"], ["justify-content: ", ";"])), props.$justifyContent);
1095
+ return props.$justifyContent && styled.css(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["justify-content: ", ";"], ["justify-content: ", ";"])), props.$justifyContent);
1096
1096
  }, function (props) {
1097
1097
  return props.$alignItems && styled.css(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["align-items: ", ";"], ["align-items: ", ";"])), props.$alignItems);
1098
1098
  }, function (props) {
@@ -1278,7 +1278,7 @@ var BoxTransform = function BoxTransform(props) {
1278
1278
  }, rest), children);
1279
1279
  };
1280
1280
  var Box = BoxTransform;
1281
- var templateObject_1$v, templateObject_2$j, templateObject_3$f, templateObject_4$d, templateObject_5$a, templateObject_6$9, templateObject_7$7, templateObject_8$3, templateObject_9$2, templateObject_10$2, templateObject_11$2, templateObject_12$2, templateObject_13$2, templateObject_14$1, templateObject_15$1, templateObject_16$1, templateObject_17$1, templateObject_18$1, templateObject_19$1, templateObject_20$1, templateObject_21$1, templateObject_22$1, templateObject_23$1, templateObject_24$1, templateObject_25$1, templateObject_26$1, templateObject_27$1, templateObject_28$1, templateObject_29$1, templateObject_30$1, templateObject_31$1, templateObject_32$1, templateObject_33$1, templateObject_34$1, templateObject_35$1, templateObject_36, templateObject_37, templateObject_38, templateObject_39, templateObject_40, templateObject_41, templateObject_42, templateObject_43;
1281
+ var templateObject_1$v, templateObject_2$j, templateObject_3$g, templateObject_4$d, templateObject_5$a, templateObject_6$9, templateObject_7$7, templateObject_8$3, templateObject_9$2, templateObject_10$2, templateObject_11$2, templateObject_12$2, templateObject_13$2, templateObject_14$1, templateObject_15$1, templateObject_16$1, templateObject_17$1, templateObject_18$1, templateObject_19$1, templateObject_20$1, templateObject_21$1, templateObject_22$1, templateObject_23$1, templateObject_24$1, templateObject_25$1, templateObject_26$1, templateObject_27$1, templateObject_28$1, templateObject_29$1, templateObject_30$1, templateObject_31$1, templateObject_32$1, templateObject_33$1, templateObject_34$1, templateObject_35$1, templateObject_36, templateObject_37, templateObject_38, templateObject_39, templateObject_40, templateObject_41, templateObject_42, templateObject_43;
1282
1282
 
1283
1283
  var add = {
1284
1284
  path: "M13 11H19V13H13V19H11V13H5V11H11V5H13V11Z",
@@ -1573,6 +1573,16 @@ var StyledLink = styled.a.withConfig({
1573
1573
  displayName: "Button__StyledLink",
1574
1574
  componentId: "sc-1eiuum9-1"
1575
1575
  })(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n ", "\n border-radius: ", ";\n \n ", "\n ", "\n"], ["\n ", "\n border-radius: ", ";\n \n ", "\n ", "\n"
1576
+ // Styled Next.js Link component (modern API without legacyBehavior)
1577
+ ])), baseButtonStyles, button.primary.borderRadius, getVariantStyles, getSizeStyles);
1578
+ // Styled Next.js Link component (modern API without legacyBehavior)
1579
+ var StyledNextLink = styled(Link).withConfig({
1580
+ shouldForwardProp: function shouldForwardProp(prop) {
1581
+ return !prop.startsWith('$');
1582
+ },
1583
+ displayName: "Button__StyledNextLink",
1584
+ componentId: "sc-1eiuum9-2"
1585
+ })(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n ", "\n border-radius: ", ";\n \n ", "\n ", "\n"], ["\n ", "\n border-radius: ", ";\n \n ", "\n ", "\n"
1576
1586
  // Helper function to get icon size based on button size
1577
1587
  ])), baseButtonStyles, button.primary.borderRadius, getVariantStyles, getSizeStyles);
1578
1588
  // Helper function to get icon size based on button size
@@ -1611,18 +1621,14 @@ var Button = function Button(_a) {
1611
1621
  iconName = _a.iconName,
1612
1622
  dataTestId = _a["data-testid"],
1613
1623
  rest = __rest(_a, ["variant", "size", "url", "purpose", "children", "target", "iconName", 'data-testid']);
1614
- // For internal links, use Next.js Link
1624
+ // For internal links, use Next.js Link (modern API without legacyBehavior)
1615
1625
  if (purpose === 'link' && url && !url.startsWith('http') && !target) {
1616
- var linkProps = rest;
1617
- return /*#__PURE__*/React.createElement(Link, {
1626
+ return /*#__PURE__*/React.createElement(StyledNextLink, {
1618
1627
  href: url,
1619
- passHref: true,
1620
- legacyBehavior: true
1621
- }, /*#__PURE__*/React.createElement(StyledLink, _extends({
1622
1628
  $variant: variant,
1623
1629
  $size: size,
1624
1630
  "data-testid": dataTestId
1625
- }, linkProps), renderButtonContent(children, iconName, size)));
1631
+ }, renderButtonContent(children, iconName, size));
1626
1632
  }
1627
1633
  // For external links or links with target
1628
1634
  if (purpose === 'link' && url) {
@@ -1665,7 +1671,7 @@ var Button = function Button(_a) {
1665
1671
  "data-testid": dataTestId
1666
1672
  }, buttonProps), renderButtonContent(children, iconName, size));
1667
1673
  };
1668
- var templateObject_1$t, templateObject_2$i;
1674
+ var templateObject_1$t, templateObject_2$i, templateObject_3$f;
1669
1675
 
1670
1676
  var chip = tokensData.component.chip;
1671
1677
  // Helper function to get variant styles as objects for CSS custom properties