@arc-ui/community-components 3.0.1 → 3.1.0

package/.turbo/turbo-build.log

@@ -1,5 +1,5 @@
 
-> @arc-ui/community-components@3.0.1 build /builds/enterprise/frontend/arc-community/packages/components
+> @arc-ui/community-components@3.1.0 build /builds/enterprise/frontend/arc-community/packages/components
 > rimraf lib dist && rollup -c && generate-subpath-css && pnpm run build:clean
 
 Browserslist: browsers data (caniuse-lite) is 6 months old. Please run:
@@ -7,40 +7,37 @@ Browserslist: browsers data (caniuse-lite) is 6 months old. Please run:
   Why you should do it regularly: https://github.com/browserslist/update-db#readme
 
 src/index.ts → lib/index.cjs, lib/index.mjs...
-created lib/index.cjs, lib/index.mjs in 4.4s
+created lib/index.cjs, lib/index.mjs in 8.9s
 
 ./lib/types/index.d.ts → lib/index.d.mts, lib/index.d.cts...
 (!) Unresolved dependencies
 https://rollupjs.org/troubleshooting/#warning-treating-module-as-external-dependency
-@arc-ui/components/dist/Heading (imported by "lib/types/components/CopyLead/CopyLead.d.ts", "lib/types/components/ArticleSidebar/types/text-section.d.ts", "lib/types/components/ArticleSidebar/types/link-section.d.ts", "lib/types/components/ArticleSidebar/types/share.d.ts" and "lib/types/components/ArticleSidebar/types/topic.d.ts")
-@arc-ui/components/dist/VideoPlayer (imported by "lib/types/components/CopyLead/CopyLead.d.ts")
 @arc-ui/components/Avatar (imported by "lib/types/components/Author/Author.d.ts")
-@arc-ui/components/Heading (imported by "lib/types/components/FeaturePost/FeaturePost.d.ts", "lib/types/components/Summary/Summary.d.ts", "lib/types/components/SectionHeading/SectionHeading.d.ts" and "lib/types/components/Accordion/components/AccordionHeading/AccordionHeading.d.ts")
-@arc-ui/components/VideoPlayer (imported by "lib/types/components/FeaturePost/FeaturePost.d.ts")
-@arc-ui/components/ButtonV2 (imported by "lib/types/components/Highlights/Highlights.d.ts")
+@arc-ui/components/Download (imported by "lib/types/components/DownloadList/DownloadList.d.ts")
+@arc-ui/components/Heading (imported by "lib/types/components/CopyLead/CopyLead.d.ts", "lib/types/components/FeaturePost/FeaturePost.d.ts", "lib/types/components/PromoListing/PromoListing.d.ts", "lib/types/components/Summary/Summary.d.ts", "lib/types/components/SectionHeading/SectionHeading.d.ts", "lib/types/components/Accordion/components/AccordionHeading/AccordionHeading.d.ts", "lib/types/components/ArticleSidebar/types/text-section.d.ts", "lib/types/components/ArticleSidebar/types/share.d.ts", "lib/types/components/ArticleSidebar/types/topic.d.ts" and "lib/types/components/ArticleSidebar/types/link-section.d.ts")
+@arc-ui/components/VideoPlayer (imported by "lib/types/components/CopyLead/CopyLead.d.ts" and "lib/types/components/FeaturePost/FeaturePost.d.ts")
+@arc-ui/components/ButtonV2 (imported by "lib/types/components/Highlights/Highlights.d.ts" and "lib/types/components/PromoListing/PromoListing.d.ts")
 @arc-ui/components/MediaCard (imported by "lib/types/components/PromoListing/PromoListing.d.ts")
 @arc-ui/components/ImpactCard (imported by "lib/types/components/PromoListing/PromoListing.d.ts")
 @arc-ui/components/InformationCard (imported by "lib/types/components/PromoListing/PromoListing.d.ts" and "lib/types/components/ProductNavigation/types/product-list.d.ts")
 @arc-ui/components/TypographyCard (imported by "lib/types/components/PromoListing/PromoListing.d.ts")
-@arc-ui/components/Download (imported by "lib/types/components/DownloadList/DownloadList.d.ts")
-@arc-ui/components/dist/types/components/TemplateBanner/TemplateBanner (imported by "lib/types/components/BannerWithTabs/BannerWithTabs.d.ts")
-@arc-ui/components/dist/types/components/Image/Image (imported by "lib/types/components/SectionHeading/SectionHeading.d.ts", "lib/types/components/Accordion/components/AccordionHeading/AccordionHeading.d.ts", "lib/types/components/CopyLead/types/copy-lead-image.d.ts" and "lib/types/components/FeaturePost/types/feature-post-image.d.ts")
+@arc-ui/components/TemplateBanner (imported by "lib/types/components/BannerWithTabs/BannerWithTabs.d.ts")
+@arc-ui/components/Image (imported by "lib/types/components/SectionHeading/SectionHeading.d.ts", "lib/types/components/Accordion/components/AccordionHeading/AccordionHeading.d.ts", "lib/types/components/CopyLead/types/copy-lead-image.d.ts" and "lib/types/components/FeaturePost/types/feature-post-image.d.ts")
 @arc-ui/components/Disclosure (imported by "lib/types/components/Accordion/components/AccordionDisclosureList/AccordionDisclosureList.d.ts")
-@arc-ui/components/dist/types/components/Tag/Tag (imported by "lib/types/components/ArticleSidebar/types/topic.d.ts")
-@arc-ui/components/types/components/ButtonV2/ButtonV2 (imported by "lib/types/components/ProductNavigation/types/product-list.d.ts")
-@arc-ui/components/dist/types/components/Button/Button (imported by "lib/types/components/CopyLead/types/copy-lead-button.d.ts" and "lib/types/components/FeaturePost/types/feature-post-cta-footer.d.ts")
-@arc-ui/components/dist/types/components/AppButton (imported by "lib/types/components/FeaturePost/types/feature-post-app-button-footer.d.ts")
-created lib/index.d.mts, lib/index.d.cts in 116ms
+@arc-ui/components/Tag (imported by "lib/types/components/ArticleSidebar/types/topic.d.ts")
+@arc-ui/components/AppButton (imported by "lib/types/components/FeaturePost/types/feature-post-app-button-footer.d.ts")
+@arc-ui/components/Button (imported by "lib/types/components/CopyLead/types/copy-lead-button.d.ts" and "lib/types/components/FeaturePost/types/feature-post-cta-footer.d.ts")
+created lib/index.d.mts, lib/index.d.cts in 175ms
 
-./src/components/Accordion/index.ts, ./src/components/ArticleSidebar/index.ts, ./src/components/Author/index.ts, ./src/components/BannerWithTabs/index.ts, ./src/components/ContentInfoWidget/index.ts, ./src/components/CopyLead/index.ts, ./src/components/DownloadList/index.ts, ./src/components/FAQs/index.ts, ./src/components/FeaturePost/index.ts, ./src/components/Highlights/index.ts, ./src/components/ProductNavigation/index.ts, ./src/components/PromoListing/index.ts, ./src/components/Quote/index.ts, ./src/components/SectionHeading/index.ts, ./src/components/Statistics/index.ts, ./src/components/Summary/index.ts → lib...
-created lib in 3.1s
+./src/components/Accordion/index.ts, ./src/components/ActionTile/index.ts, ./src/components/ArticleSidebar/index.ts, ./src/components/Author/index.ts, ./src/components/BannerWithTabs/index.ts, ./src/components/ContentInfoWidget/index.ts, ./src/components/CopyLead/index.ts, ./src/components/DownloadList/index.ts, ./src/components/FAQs/index.ts, ./src/components/FeaturePost/index.ts, ./src/components/HeroLink/index.ts, ./src/components/Highlights/index.ts, ./src/components/LinkTile/index.ts, ./src/components/ProductNavigation/index.ts, ./src/components/PromoListing/index.ts, ./src/components/Quote/index.ts, ./src/components/SectionHeading/index.ts, ./src/components/Statistics/index.ts, ./src/components/Summary/index.ts → lib...
+created lib in 6.1s
 
-./src/components/Accordion/index.ts, ./src/components/ArticleSidebar/index.ts, ./src/components/Author/index.ts, ./src/components/BannerWithTabs/index.ts, ./src/components/ContentInfoWidget/index.ts, ./src/components/CopyLead/index.ts, ./src/components/DownloadList/index.ts, ./src/components/FAQs/index.ts, ./src/components/FeaturePost/index.ts, ./src/components/Highlights/index.ts, ./src/components/ProductNavigation/index.ts, ./src/components/PromoListing/index.ts, ./src/components/Quote/index.ts, ./src/components/SectionHeading/index.ts, ./src/components/Statistics/index.ts, ./src/components/Summary/index.ts → lib...
-created lib in 2.5s
+./src/components/Accordion/index.ts, ./src/components/ActionTile/index.ts, ./src/components/ArticleSidebar/index.ts, ./src/components/Author/index.ts, ./src/components/BannerWithTabs/index.ts, ./src/components/ContentInfoWidget/index.ts, ./src/components/CopyLead/index.ts, ./src/components/DownloadList/index.ts, ./src/components/FAQs/index.ts, ./src/components/FeaturePost/index.ts, ./src/components/HeroLink/index.ts, ./src/components/Highlights/index.ts, ./src/components/LinkTile/index.ts, ./src/components/ProductNavigation/index.ts, ./src/components/PromoListing/index.ts, ./src/components/Quote/index.ts, ./src/components/SectionHeading/index.ts, ./src/components/Statistics/index.ts, ./src/components/Summary/index.ts → lib...
+created lib in 5.6s
 Browserslist: browsers data (caniuse-lite) is 6 months old. Please run:
   npx update-browserslist-db@latest
   Why you should do it regularly: https://github.com/browserslist/update-db#readme
 
-> @arc-ui/community-components@3.0.1 build:clean /builds/enterprise/frontend/arc-community/packages/components
+> @arc-ui/community-components@3.1.0 build:clean /builds/enterprise/frontend/arc-community/packages/components
 > rimraf ./lib/types ./lib/styles.js ./lib/index.js ./lib/index.js.map
 

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @arc-ui/community-components
 
+## 3.1.0
+
+### Minor Changes
+
+- 901e62d: exposed props for various components following audit from cms team
+- 7bbacc1: - refactor the ProductNavigation.tsx file so the InformationCard can accept all InformationCard props
+  - fix test coverage for FAQs:
+  - remove default type="list" from FAQs
+  - change the describe(...) title from <Accordion /> to <FAQs />
+  - add a test that headingLevel defaults to h2
+- 901e62d: update import paths from arc, updated to arc 13.4.0
+- 8bf8500: Added overline and button props to promo listing
+- 16d4b41: Swapped filterDataAttrs for filterAttrs
+
+### Patch Changes
+
+- b4b1464: Added ActionTile, LinkTile, and HeroLink components for Help & Support page (ARC-1490)
+
 ## 3.0.1
 
 ### Patch Changes

package/lib/Accordion/Accordion.cjs

@@ -1,9 +1,9 @@
 'use strict';
 
-var Accordion = require('../_shared/cjs/Accordion-D5fpUJzm.cjs');
+var Accordion = require('../_shared/cjs/Accordion-BCJIm1Gq.cjs');
 require('../_shared/cjs/tslib.es6-BxB9I209.cjs');
 require('react');
-require('../_shared/cjs/filter-data-attrs-ajtUvDAC.cjs');
+require('../_shared/cjs/filter-attrs-BizjMsy0.cjs');
 require('../_shared/cjs/index-Bp6Dd2i1.cjs');
 require('@arc-ui/components/Heading');
 require('@arc-ui/components/Text');

package/lib/Accordion/Accordion.mjs

@@ -1,7 +1,7 @@
-export { A as Accordion } from '../_shared/esm/Accordion-LLwNdzax.mjs';
+export { A as Accordion } from '../_shared/esm/Accordion-BN_lZk6L.mjs';
 import '../_shared/esm/tslib.es6-D6Wu-xwB.mjs';
 import 'react';
-import '../_shared/esm/filter-data-attrs-V7cbJuwS.mjs';
+import '../_shared/esm/filter-attrs-DZ7RCEZm.mjs';
 import '../_shared/esm/index-BfTCfPZ1.mjs';
 import '@arc-ui/components/Heading';
 import '@arc-ui/components/Text';

package/lib/ActionTile/ActionTile.cjs

@@ -0,0 +1,35 @@
+'use strict';
+
+var tslib_es6 = require('../_shared/cjs/tslib.es6-BxB9I209.cjs');
+var React = require('react');
+var index = require('../_shared/cjs/index-Bp6Dd2i1.cjs');
+var filterAttrs = require('../_shared/cjs/filter-attrs-BizjMsy0.cjs');
+var Icon = require('@arc-ui/components/Icon');
+
+var styles = {"action-tile":"ActionTile-module_action-tile__JPwGb","action-tile-content":"ActionTile-module_action-tile-content__ZkgHc","action-tile-icon":"ActionTile-module_action-tile-icon__PY1EN","action-tile-heading":"ActionTile-module_action-tile-heading__Uxdu9","action-tile--active":"ActionTile-module_action-tile--active__-aWze","action-tile-tick":"ActionTile-module_action-tile-tick__vhsJE"};
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconTickAlt2Px =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='m13.5 21.914-4.707-4.707a1 1 0 0 1 0-1.414 1.024 1.024 0 0 1 1.414 0l3.293 3.293 8.293-8.293a1 1 0 1 1 1.414 1.414Z'/%3e%3c/svg%3e";
+
+var ActionTile = function (_a) {
+    var _b;
+    var icon = _a.icon, heading = _a.heading, _c = _a.isActive, isActive = _c === void 0 ? false : _c, onClick = _a.onClick, className = _a.className, props = tslib_es6.__rest(_a, ["icon", "heading", "isActive", "onClick", "className"]);
+    var tileClasses = index.classNames(styles["action-tile"], (_b = {},
+        _b[styles["action-tile--active"]] = isActive,
+        _b), className);
+    var content = (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: styles["action-tile-content"] },
+            icon && (React.createElement("div", { className: styles["action-tile-icon"] },
+                React.createElement(Icon.Icon, { icon: icon, size: 48 }))),
+            React.createElement("h3", { className: styles["action-tile-heading"] }, heading)),
+        isActive && (React.createElement("div", { className: styles["action-tile-tick"] },
+            React.createElement(Icon.Icon, { icon: BtIconTickAlt2Px, size: 20 })))));
+    return (React.createElement("div", tslib_es6.__assign({ className: tileClasses, onClick: onClick }, filterAttrs.filterAttrs(props)), content));
+};
+
+exports.ActionTile = ActionTile;

package/lib/ActionTile/ActionTile.mjs

@@ -0,0 +1,33 @@
+import { a as __rest, _ as __assign } from '../_shared/esm/tslib.es6-D6Wu-xwB.mjs';
+import React from 'react';
+import { c as classNames } from '../_shared/esm/index-BfTCfPZ1.mjs';
+import { f as filterAttrs } from '../_shared/esm/filter-attrs-DZ7RCEZm.mjs';
+import { Icon } from '@arc-ui/components/Icon';
+
+var styles = {"action-tile":"ActionTile-module_action-tile__JPwGb","action-tile-content":"ActionTile-module_action-tile-content__ZkgHc","action-tile-icon":"ActionTile-module_action-tile-icon__PY1EN","action-tile-heading":"ActionTile-module_action-tile-heading__Uxdu9","action-tile--active":"ActionTile-module_action-tile--active__-aWze","action-tile-tick":"ActionTile-module_action-tile-tick__vhsJE"};
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconTickAlt2Px =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='m13.5 21.914-4.707-4.707a1 1 0 0 1 0-1.414 1.024 1.024 0 0 1 1.414 0l3.293 3.293 8.293-8.293a1 1 0 1 1 1.414 1.414Z'/%3e%3c/svg%3e";
+
+var ActionTile = function (_a) {
+    var _b;
+    var icon = _a.icon, heading = _a.heading, _c = _a.isActive, isActive = _c === void 0 ? false : _c, onClick = _a.onClick, className = _a.className, props = __rest(_a, ["icon", "heading", "isActive", "onClick", "className"]);
+    var tileClasses = classNames(styles["action-tile"], (_b = {},
+        _b[styles["action-tile--active"]] = isActive,
+        _b), className);
+    var content = (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: styles["action-tile-content"] },
+            icon && (React.createElement("div", { className: styles["action-tile-icon"] },
+                React.createElement(Icon, { icon: icon, size: 48 }))),
+            React.createElement("h3", { className: styles["action-tile-heading"] }, heading)),
+        isActive && (React.createElement("div", { className: styles["action-tile-tick"] },
+            React.createElement(Icon, { icon: BtIconTickAlt2Px, size: 20 })))));
+    return (React.createElement("div", __assign({ className: tileClasses, onClick: onClick }, filterAttrs(props)), content));
+};
+
+export { ActionTile };

package/lib/ActionTile/styles.css

@@ -0,0 +1 @@
+.ActionTile-module_action-tile__JPwGb{display:flex;flex-direction:horizontal;align-items:center;justify-content:space-between;width:230px;height:164px;padding:24px;gap:16px;border-radius:16px;border:1px solid #c8c8c8;background:transparent;text-decoration:none;cursor:pointer;transition:all 0.2s ease;position:relative}.ActionTile-module_action-tile-content__ZkgHc{display:flex;flex-direction:column;gap:12px;flex:1;align-items:flex-start}.ActionTile-module_action-tile-icon__PY1EN{display:flex;align-items:center;justify-content:flex-start;width:48px;height:48px;color:#2a2a2a;transition:color 0.2s ease}.ActionTile-module_action-tile-heading__Uxdu9{font-family:"BT Curve",sans-serif;font-size:20px;font-weight:500;line-height:28px;letter-spacing:0;color:#2a2a2a;margin:0;transition:color 0.2s ease;width:100%;word-wrap:break-word;word-wrap:break-word;margin-left:-12px}.ActionTile-module_action-tile--active__-aWze{background:#efe5f7;border-color:#2a1c4a}.ActionTile-module_action-tile--active__-aWze .ActionTile-module_action-tile-heading__Uxdu9,.ActionTile-module_action-tile--active__-aWze .ActionTile-module_action-tile-icon__PY1EN{color:#2a1c4a}.ActionTile-module_action-tile--active__-aWze:hover{background:#efe5f7;border-color:#2a1c4a}.ActionTile-module_action-tile__JPwGb:hover{border-color:#3f187f}.ActionTile-module_action-tile__JPwGb:hover .ActionTile-module_action-tile-heading__Uxdu9,.ActionTile-module_action-tile__JPwGb:hover .ActionTile-module_action-tile-icon__PY1EN{color:#3f187f}.ActionTile-module_action-tile-tick__vhsJE{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:24px;background:#2a1c4a;color:#ffffff;flex-shrink:0;position:absolute;top:-8px;right:-8px}

package/lib/ArticleSidebar/ArticleSidebar.cjs

@@ -2,6 +2,7 @@
 
 var tslib_es6 = require('../_shared/cjs/tslib.es6-BxB9I209.cjs');
 var React = require('react');
+var index = require('../_shared/cjs/index-Bp6Dd2i1.cjs');
 var Heading = require('@arc-ui/components/Heading');
 var Icon = require('@arc-ui/components/Icon');
 var Text = require('@arc-ui/components/Text');
@@ -10,8 +11,8 @@ var Link = require('@arc-ui/components/Link');
 var Tag = require('@arc-ui/components/Tag');
 var Toast = require('@arc-ui/components/Toast');
 var VerticalSpace = require('@arc-ui/components/VerticalSpace');
-var Author = require('../_shared/cjs/Author-X47pv31V.cjs');
-require('../_shared/cjs/filter-data-attrs-ajtUvDAC.cjs');
+var Author = require('../_shared/cjs/Author-D4dKNQem.cjs');
+require('../_shared/cjs/filter-attrs-BizjMsy0.cjs');
 require('@arc-ui/components/Grid');
 require('@arc-ui/components/Avatar');
 
@@ -47,15 +48,16 @@ const BtIconLink =
 const BtIconEmailUnread =
   "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='M29 6H3a1 1 0 0 0-1 1v18a1 1 0 0 0 1 1h26a1 1 0 0 0 1-1V7a1 1 0 0 0-1-1m0 1v1.716l-11 7.616a3.52 3.52 0 0 1-3.984 0L3 8.705V7Zm0 2.933v12.15l-8.775-6.075Zm-17.208 6.075L3 22.095V9.922ZM3 25v-1.689l9.67-6.695.777.538a4.52 4.52 0 0 0 5.123 0l.776-.538L29 23.3V25Z'/%3e%3c/svg%3e";
 
-var styles = {"tagGroup":"ArticleSidebar-module_tagGroup__rIPQc","textContent":"ArticleSidebar-module_textContent__3nCfG","shareButtonContainer":"ArticleSidebar-module_shareButtonContainer__iAfHL","shareButton":"ArticleSidebar-module_shareButton__rb-1E"};
+var styles = {"tagGroup":"ArticleSidebar-module_tagGroup__rIPQc","textContent":"ArticleSidebar-module_textContent__3nCfG","additionalContentContainer":"ArticleSidebar-module_additionalContentContainer__91L4n","shareButtonContainer":"ArticleSidebar-module_shareButtonContainer__iAfHL","shareButton":"ArticleSidebar-module_shareButton__rb-1E"};
 
 /**
  * Use `ArticleSidebar` to provide additional information about the article.
  */
 var ArticleSidebar = function (_a) {
+    var _b;
     var author = _a.author, aboutSection = _a.aboutSection, topics = _a.topics, share = _a.share, additionalContent = _a.additionalContent, linkSection = _a.linkSection;
     var id = React.useId();
-    var _b = React.useState(false), showToast = _b[0], setShowToast = _b[1];
+    var _c = React.useState(false), showToast = _c[0], setShowToast = _c[1];
     var url = location.href;
     var copyTextToClipBoard = function () { return tslib_es6.__awaiter(void 0, void 0, void 0, function () {
         return tslib_es6.__generator(this, function (_a) {
@@ -68,79 +70,87 @@ var ArticleSidebar = function (_a) {
             }
         });
     }); };
-    var shareButtons = tslib_es6.__spreadArray(tslib_es6.__spreadArray([
-        {
-            isButton: true,
-            label: "Copy url to clipboard",
-            onClick: copyTextToClipBoard,
-            icon: BtIconLink,
-        },
-        {
-            label: "Share by email",
-            href: "mailto:?subject=".concat(share.articleTitle, "&body=").concat(url),
-            icon: BtIconEmailUnread,
-        }
-    ], (share.linkedin
-        ? [
+    var shareButtons = share
+        ? tslib_es6.__spreadArray(tslib_es6.__spreadArray([
             {
-                label: "Share on LinkedIn",
-                href: "https://www.linkedin.com/sharing/share-offsite/?url=".concat(url),
-                icon: ArcIconSocialLinkedin,
+                isButton: true,
+                onClick: copyTextToClipBoard,
+                icon: BtIconLink,
+                ariaLabel: share.clipboardAriaLabel || "Copy url to clipboard",
             },
-        ]
-        : []), true), (share.x
-        ? [
             {
-                label: "Share on x",
-                href: "https://twitter.com/intent/tweet?url=".concat(url),
-                icon: ArcIconSocialX,
-            },
-        ]
-        : []), true);
+                href: "mailto:?subject=".concat(share.articleTitle, "&body=").concat(url),
+                icon: BtIconEmailUnread,
+                ariaLabel: share.emailAriaLabel || "Share by email",
+            }
+        ], (share.linkedin
+            ? [
+                {
+                    href: "https://www.linkedin.com/sharing/share-offsite/?url=".concat(url),
+                    icon: ArcIconSocialLinkedin,
+                    ariaLabel: share.linkedInAriaLabel || "Share on LinkedIn",
+                },
+            ]
+            : []), true), (share.x
+            ? [
+                {
+                    href: "https://twitter.com/intent/tweet?url=".concat(url),
+                    icon: ArcIconSocialX,
+                    ariaLabel: share.xAriaLabel || "Share on x",
+                },
+            ]
+            : []), true) : [];
+    var hasTopContent = Boolean(author || aboutSection || additionalContent);
+    var hasBottomContent = Boolean(linkSection || topics || share);
     return (React.createElement(React.Fragment, null,
-        React.createElement("div", { className: styles.textContent },
+        React.createElement("div", { className: index.classNames((_b = {},
+                _b[styles.textContent] = hasTopContent,
+                _b)) },
             author && (React.createElement(React.Fragment, null,
                 React.createElement(Author.Author, tslib_es6.__assign({}, author, { avatar: tslib_es6.__assign(tslib_es6.__assign({}, author.avatar), { size: "xl" }) })))),
             aboutSection && (React.createElement(React.Fragment, null,
-                React.createElement(VerticalSpace.VerticalSpace, { size: "32" }),
+                author && React.createElement(VerticalSpace.VerticalSpace, { size: "32" }),
                 React.createElement(Heading.Heading, { level: aboutSection.headingLevel }, aboutSection.heading),
                 React.createElement(VerticalSpace.VerticalSpace, { size: "16" }),
                 React.createElement(Text.Text, { size: "s" }, aboutSection.content))),
-            additionalContent &&
-                additionalContent.map(function (_a) {
+            additionalContent && (React.createElement(React.Fragment, null,
+                (author || aboutSection) && React.createElement(VerticalSpace.VerticalSpace, { size: "16" }),
+                React.createElement("div", { className: styles.additionalContentContainer }, additionalContent.map(function (_a) {
                     var heading = _a.heading, headingLevel = _a.headingLevel, content = _a.content;
-                    return (React.createElement(React.Fragment, null,
-                        React.createElement(VerticalSpace.VerticalSpace, { size: "16" }),
+                    return (React.createElement("div", { key: "".concat(id, "-").concat(heading) },
                         React.createElement(Heading.Heading, { level: headingLevel, size: "xxs" }, heading),
                         React.createElement(Text.Text, { size: "s" }, content)));
-                })),
-        (author || aboutSection || additionalContent) && (React.createElement("div", { "data-testid": "content-rule" },
+                }))))),
+        hasTopContent && hasBottomContent && (React.createElement("div", { "data-testid": "text-content-rule" },
             React.createElement(VerticalSpace.VerticalSpace, { size: "32" }),
             React.createElement(Rule.Rule, null),
             React.createElement(VerticalSpace.VerticalSpace, { size: "32" }))),
-        React.createElement(Heading.Heading, { level: linkSection.headingLevel }, linkSection.heading),
-        linkSection.links.map(function (_a) {
-            var text = _a.text, url = _a.url;
-            return (React.createElement(React.Fragment, null,
-                React.createElement(VerticalSpace.VerticalSpace, { size: "8" }),
-                React.createElement("div", { key: "".concat(id, "-").concat(url) },
-                    React.createElement(Link.Link, { size: "s", href: url }, text))));
-        }),
-        React.createElement(VerticalSpace.VerticalSpace, { size: "32" }),
+        linkSection && (React.createElement(React.Fragment, null,
+            React.createElement(Heading.Heading, { level: linkSection.headingLevel }, linkSection.heading),
+            linkSection.links.map(function (_a) {
+                var text = _a.text, url = _a.url, ariaLabel = _a.ariaLabel;
+                return (React.createElement(React.Fragment, null,
+                    React.createElement(VerticalSpace.VerticalSpace, { size: "8" }),
+                    React.createElement("div", { key: "".concat(id, "-").concat(url) },
+                        React.createElement(Link.Link, { "aria-label": ariaLabel, size: "s", href: url }, text))));
+            }))),
         topics && (React.createElement(React.Fragment, null,
+            linkSection && React.createElement(VerticalSpace.VerticalSpace, { size: "32" }),
             React.createElement(Heading.Heading, { level: topics.headingLevel }, topics.heading),
             React.createElement(VerticalSpace.VerticalSpace, { size: "16" }),
-            React.createElement("div", { className: styles.tagGroup }, topics.tags.map(function (tag) { return (React.createElement(Tag.Tag, tslib_es6.__assign({ key: "".concat(id, "-").concat(tag.title) }, tag))); })),
-            React.createElement(VerticalSpace.VerticalSpace, { size: "32" }))),
-        React.createElement(Rule.Rule, null),
-        React.createElement(VerticalSpace.VerticalSpace, { size: "32" }),
-        React.createElement(Heading.Heading, { level: share.headingLevel }, share.heading),
-        React.createElement(VerticalSpace.VerticalSpace, { size: "16" }),
-        React.createElement("div", { className: styles.shareButtonContainer }, shareButtons.map(function (_a) {
-            var isButton = _a.isButton, label = _a.label, href = _a.href, icon = _a.icon, onClick = _a.onClick;
-            return (React.createElement("a", { key: "".concat(id, "-").concat(label), role: isButton ? "button" : undefined, target: "_blank", rel: "noreferrer", className: styles.shareButton, "aria-label": label, href: href, onClick: isButton ? onClick : undefined },
-                React.createElement(Icon.Icon, { icon: icon, size: 24 })));
-        })),
+            React.createElement("div", { className: styles.tagGroup }, topics.tags.map(function (tag) { return (React.createElement(Tag.Tag, tslib_es6.__assign({ key: "".concat(id, "-").concat(tag.title) }, tag))); })))),
+        share && (React.createElement(React.Fragment, null,
+            (linkSection || topics) && (React.createElement("div", { "data-testid": "links-topics-content-rule" },
+                React.createElement(VerticalSpace.VerticalSpace, { size: "32" }),
+                React.createElement(Rule.Rule, null),
+                React.createElement(VerticalSpace.VerticalSpace, { size: "32" }))),
+            React.createElement(Heading.Heading, { level: share.headingLevel }, share.heading),
+            React.createElement(VerticalSpace.VerticalSpace, { size: "16" }),
+            React.createElement("div", { className: styles.shareButtonContainer }, shareButtons.map(function (_a) {
+                var isButton = _a.isButton, ariaLabel = _a.ariaLabel, href = _a.href, icon = _a.icon, onClick = _a.onClick;
+                return (React.createElement("a", { key: "".concat(id, "-").concat(ariaLabel), role: isButton ? "button" : undefined, target: "_blank", rel: "noreferrer", className: styles.shareButton, "aria-label": ariaLabel, href: href, onClick: isButton ? onClick : undefined },
+                    React.createElement(Icon.Icon, { icon: icon, size: 24 })));
+            })))),
         React.createElement(Toast.Toast, null,
             React.createElement(Toast.ToastNotification, { status: "success", title: "Copied to clipboard", isOpen: showToast, onOpenChange: function () { return setShowToast(false); } }))));
 };

package/lib/ArticleSidebar/ArticleSidebar.mjs

@@ -1,5 +1,6 @@
 import { b as __spreadArray, _ as __assign, c as __awaiter, d as __generator } from '../_shared/esm/tslib.es6-D6Wu-xwB.mjs';
 import React, { useId, useState } from 'react';
+import { c as classNames } from '../_shared/esm/index-BfTCfPZ1.mjs';
 import { Heading } from '@arc-ui/components/Heading';
 import { Icon } from '@arc-ui/components/Icon';
 import { Text } from '@arc-ui/components/Text';
@@ -8,8 +9,8 @@ import { Link } from '@arc-ui/components/Link';
 import { Tag } from '@arc-ui/components/Tag';
 import { Toast, ToastNotification } from '@arc-ui/components/Toast';
 import { VerticalSpace } from '@arc-ui/components/VerticalSpace';
-import { A as Author } from '../_shared/esm/Author-CydDYCma.mjs';
-import '../_shared/esm/filter-data-attrs-V7cbJuwS.mjs';
+import { A as Author } from '../_shared/esm/Author-HnYsFTPT.mjs';
+import '../_shared/esm/filter-attrs-DZ7RCEZm.mjs';
 import '@arc-ui/components/Grid';
 import '@arc-ui/components/Avatar';
 
@@ -45,15 +46,16 @@ const BtIconLink =
 const BtIconEmailUnread =
   "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='M29 6H3a1 1 0 0 0-1 1v18a1 1 0 0 0 1 1h26a1 1 0 0 0 1-1V7a1 1 0 0 0-1-1m0 1v1.716l-11 7.616a3.52 3.52 0 0 1-3.984 0L3 8.705V7Zm0 2.933v12.15l-8.775-6.075Zm-17.208 6.075L3 22.095V9.922ZM3 25v-1.689l9.67-6.695.777.538a4.52 4.52 0 0 0 5.123 0l.776-.538L29 23.3V25Z'/%3e%3c/svg%3e";
 
-var styles = {"tagGroup":"ArticleSidebar-module_tagGroup__rIPQc","textContent":"ArticleSidebar-module_textContent__3nCfG","shareButtonContainer":"ArticleSidebar-module_shareButtonContainer__iAfHL","shareButton":"ArticleSidebar-module_shareButton__rb-1E"};
+var styles = {"tagGroup":"ArticleSidebar-module_tagGroup__rIPQc","textContent":"ArticleSidebar-module_textContent__3nCfG","additionalContentContainer":"ArticleSidebar-module_additionalContentContainer__91L4n","shareButtonContainer":"ArticleSidebar-module_shareButtonContainer__iAfHL","shareButton":"ArticleSidebar-module_shareButton__rb-1E"};
 
 /**
  * Use `ArticleSidebar` to provide additional information about the article.
  */
 var ArticleSidebar = function (_a) {
+    var _b;
     var author = _a.author, aboutSection = _a.aboutSection, topics = _a.topics, share = _a.share, additionalContent = _a.additionalContent, linkSection = _a.linkSection;
     var id = useId();
-    var _b = useState(false), showToast = _b[0], setShowToast = _b[1];
+    var _c = useState(false), showToast = _c[0], setShowToast = _c[1];
     var url = location.href;
     var copyTextToClipBoard = function () { return __awaiter(void 0, void 0, void 0, function () {
         return __generator(this, function (_a) {
@@ -66,79 +68,87 @@ var ArticleSidebar = function (_a) {
             }
         });
     }); };
-    var shareButtons = __spreadArray(__spreadArray([
-        {
-            isButton: true,
-            label: "Copy url to clipboard",
-            onClick: copyTextToClipBoard,
-            icon: BtIconLink,
-        },
-        {
-            label: "Share by email",
-            href: "mailto:?subject=".concat(share.articleTitle, "&body=").concat(url),
-            icon: BtIconEmailUnread,
-        }
-    ], (share.linkedin
-        ? [
+    var shareButtons = share
+        ? __spreadArray(__spreadArray([
             {
-                label: "Share on LinkedIn",
-                href: "https://www.linkedin.com/sharing/share-offsite/?url=".concat(url),
-                icon: ArcIconSocialLinkedin,
+                isButton: true,
+                onClick: copyTextToClipBoard,
+                icon: BtIconLink,
+                ariaLabel: share.clipboardAriaLabel || "Copy url to clipboard",
             },
-        ]
-        : []), true), (share.x
-        ? [
             {
-                label: "Share on x",
-                href: "https://twitter.com/intent/tweet?url=".concat(url),
-                icon: ArcIconSocialX,
-            },
-        ]
-        : []), true);
+                href: "mailto:?subject=".concat(share.articleTitle, "&body=").concat(url),
+                icon: BtIconEmailUnread,
+                ariaLabel: share.emailAriaLabel || "Share by email",
+            }
+        ], (share.linkedin
+            ? [
+                {
+                    href: "https://www.linkedin.com/sharing/share-offsite/?url=".concat(url),
+                    icon: ArcIconSocialLinkedin,
+                    ariaLabel: share.linkedInAriaLabel || "Share on LinkedIn",
+                },
+            ]
+            : []), true), (share.x
+            ? [
+                {
+                    href: "https://twitter.com/intent/tweet?url=".concat(url),
+                    icon: ArcIconSocialX,
+                    ariaLabel: share.xAriaLabel || "Share on x",
+                },
+            ]
+            : []), true) : [];
+    var hasTopContent = Boolean(author || aboutSection || additionalContent);
+    var hasBottomContent = Boolean(linkSection || topics || share);
     return (React.createElement(React.Fragment, null,
-        React.createElement("div", { className: styles.textContent },
+        React.createElement("div", { className: classNames((_b = {},
+                _b[styles.textContent] = hasTopContent,
+                _b)) },
             author && (React.createElement(React.Fragment, null,
                 React.createElement(Author, __assign({}, author, { avatar: __assign(__assign({}, author.avatar), { size: "xl" }) })))),
             aboutSection && (React.createElement(React.Fragment, null,
-                React.createElement(VerticalSpace, { size: "32" }),
+                author && React.createElement(VerticalSpace, { size: "32" }),
                 React.createElement(Heading, { level: aboutSection.headingLevel }, aboutSection.heading),
                 React.createElement(VerticalSpace, { size: "16" }),
                 React.createElement(Text, { size: "s" }, aboutSection.content))),
-            additionalContent &&
-                additionalContent.map(function (_a) {
+            additionalContent && (React.createElement(React.Fragment, null,
+                (author || aboutSection) && React.createElement(VerticalSpace, { size: "16" }),
+                React.createElement("div", { className: styles.additionalContentContainer }, additionalContent.map(function (_a) {
                     var heading = _a.heading, headingLevel = _a.headingLevel, content = _a.content;
-                    return (React.createElement(React.Fragment, null,
-                        React.createElement(VerticalSpace, { size: "16" }),
+                    return (React.createElement("div", { key: "".concat(id, "-").concat(heading) },
                         React.createElement(Heading, { level: headingLevel, size: "xxs" }, heading),
                         React.createElement(Text, { size: "s" }, content)));
-                })),
-        (author || aboutSection || additionalContent) && (React.createElement("div", { "data-testid": "content-rule" },
+                }))))),
+        hasTopContent && hasBottomContent && (React.createElement("div", { "data-testid": "text-content-rule" },
             React.createElement(VerticalSpace, { size: "32" }),
             React.createElement(Rule, null),
             React.createElement(VerticalSpace, { size: "32" }))),
-        React.createElement(Heading, { level: linkSection.headingLevel }, linkSection.heading),
-        linkSection.links.map(function (_a) {
-            var text = _a.text, url = _a.url;
-            return (React.createElement(React.Fragment, null,
-                React.createElement(VerticalSpace, { size: "8" }),
-                React.createElement("div", { key: "".concat(id, "-").concat(url) },
-                    React.createElement(Link, { size: "s", href: url }, text))));
-        }),
-        React.createElement(VerticalSpace, { size: "32" }),
+        linkSection && (React.createElement(React.Fragment, null,
+            React.createElement(Heading, { level: linkSection.headingLevel }, linkSection.heading),
+            linkSection.links.map(function (_a) {
+                var text = _a.text, url = _a.url, ariaLabel = _a.ariaLabel;
+                return (React.createElement(React.Fragment, null,
+                    React.createElement(VerticalSpace, { size: "8" }),
+                    React.createElement("div", { key: "".concat(id, "-").concat(url) },
+                        React.createElement(Link, { "aria-label": ariaLabel, size: "s", href: url }, text))));
+            }))),
         topics && (React.createElement(React.Fragment, null,
+            linkSection && React.createElement(VerticalSpace, { size: "32" }),
             React.createElement(Heading, { level: topics.headingLevel }, topics.heading),
             React.createElement(VerticalSpace, { size: "16" }),
-            React.createElement("div", { className: styles.tagGroup }, topics.tags.map(function (tag) { return (React.createElement(Tag, __assign({ key: "".concat(id, "-").concat(tag.title) }, tag))); })),
-            React.createElement(VerticalSpace, { size: "32" }))),
-        React.createElement(Rule, null),
-        React.createElement(VerticalSpace, { size: "32" }),
-        React.createElement(Heading, { level: share.headingLevel }, share.heading),
-        React.createElement(VerticalSpace, { size: "16" }),
-        React.createElement("div", { className: styles.shareButtonContainer }, shareButtons.map(function (_a) {
-            var isButton = _a.isButton, label = _a.label, href = _a.href, icon = _a.icon, onClick = _a.onClick;
-            return (React.createElement("a", { key: "".concat(id, "-").concat(label), role: isButton ? "button" : undefined, target: "_blank", rel: "noreferrer", className: styles.shareButton, "aria-label": label, href: href, onClick: isButton ? onClick : undefined },
-                React.createElement(Icon, { icon: icon, size: 24 })));
-        })),
+            React.createElement("div", { className: styles.tagGroup }, topics.tags.map(function (tag) { return (React.createElement(Tag, __assign({ key: "".concat(id, "-").concat(tag.title) }, tag))); })))),
+        share && (React.createElement(React.Fragment, null,
+            (linkSection || topics) && (React.createElement("div", { "data-testid": "links-topics-content-rule" },
+                React.createElement(VerticalSpace, { size: "32" }),
+                React.createElement(Rule, null),
+                React.createElement(VerticalSpace, { size: "32" }))),
+            React.createElement(Heading, { level: share.headingLevel }, share.heading),
+            React.createElement(VerticalSpace, { size: "16" }),
+            React.createElement("div", { className: styles.shareButtonContainer }, shareButtons.map(function (_a) {
+                var isButton = _a.isButton, ariaLabel = _a.ariaLabel, href = _a.href, icon = _a.icon, onClick = _a.onClick;
+                return (React.createElement("a", { key: "".concat(id, "-").concat(ariaLabel), role: isButton ? "button" : undefined, target: "_blank", rel: "noreferrer", className: styles.shareButton, "aria-label": ariaLabel, href: href, onClick: isButton ? onClick : undefined },
+                    React.createElement(Icon, { icon: icon, size: 24 })));
+            })))),
         React.createElement(Toast, null,
             React.createElement(ToastNotification, { status: "success", title: "Copied to clipboard", isOpen: showToast, onOpenChange: function () { return setShowToast(false); } }))));
 };

package/lib/ArticleSidebar/styles.css

@@ -1 +1 @@
-.ArticleSidebar-module_tagGroup__rIPQc{display:flex;gap:16px;flex-wrap:wrap}.ArticleSidebar-module_textContent__3nCfG{padding-right:16px}.ArticleSidebar-module_shareButtonContainer__iAfHL{display:flex;gap:8px}.arc a.ArticleSidebar-module_shareButton__rb-1E{color:var(--sem-color-fg-secondary-light-default);background:var(--sem-color-bg-secondary-light-default);border:1px solid var(--sem-color-border-secondary-light-subtle);cursor:pointer;border-radius:50%;padding:12px;display:block;transition:0.4s ease color,0.4s ease border-color}.arc a.ArticleSidebar-module_shareButton__rb-1E:hover{color:var(--sem-color-bg-primary-light-strong);border-color:var(--sem-color-bg-primary-light-strong)}
+.ArticleSidebar-module_tagGroup__rIPQc{display:flex;gap:16px;flex-wrap:wrap}.ArticleSidebar-module_textContent__3nCfG{padding-right:16px}.ArticleSidebar-module_additionalContentContainer__91L4n{display:flex;flex-direction:column;gap:16px}.ArticleSidebar-module_shareButtonContainer__iAfHL{display:flex;gap:8px}.arc a.ArticleSidebar-module_shareButton__rb-1E{color:var(--sem-color-fg-secondary-light-default);background:var(--sem-color-bg-secondary-light-default);border:1px solid var(--sem-color-border-secondary-light-subtle);cursor:pointer;border-radius:50%;padding:12px;display:block;transition:0.4s ease color,0.4s ease border-color}.arc a.ArticleSidebar-module_shareButton__rb-1E:hover{color:var(--sem-color-bg-primary-light-strong);border-color:var(--sem-color-bg-primary-light-strong)}

package/lib/Author/Author.cjs

@@ -1,9 +1,9 @@
 'use strict';
 
-var Author = require('../_shared/cjs/Author-X47pv31V.cjs');
+var Author = require('../_shared/cjs/Author-D4dKNQem.cjs');
 require('../_shared/cjs/tslib.es6-BxB9I209.cjs');
 require('react');
-require('../_shared/cjs/filter-data-attrs-ajtUvDAC.cjs');
+require('../_shared/cjs/filter-attrs-BizjMsy0.cjs');
 require('@arc-ui/components/Grid');
 require('@arc-ui/components/Avatar');
 require('@arc-ui/components/Heading');

package/lib/Author/Author.mjs

@@ -1,7 +1,7 @@
-export { A as Author } from '../_shared/esm/Author-CydDYCma.mjs';
+export { A as Author } from '../_shared/esm/Author-HnYsFTPT.mjs';
 import '../_shared/esm/tslib.es6-D6Wu-xwB.mjs';
 import 'react';
-import '../_shared/esm/filter-data-attrs-V7cbJuwS.mjs';
+import '../_shared/esm/filter-attrs-DZ7RCEZm.mjs';
 import '@arc-ui/components/Grid';
 import '@arc-ui/components/Avatar';
 import '@arc-ui/components/Heading';