@arc-ui/community-components 0.1.0 → 1.0.1

package/.turbo/turbo-build.log

@@ -1,16 +1,16 @@
 
-> @arc-ui/community-components@0.1.0 build /builds/enterprise/frontend/arc-community/packages/components
+> @arc-ui/community-components@1.0.1 build /builds/enterprise/frontend/arc-community/packages/components
 > rimraf dist && rollup -c && generate-subpath-css
 
 
 src/index.ts → dist...
-created dist in 6.1s
+created dist in 7.7s
 
 src/index.ts → dist/index.es.js...
-created dist/index.es.js in 4.1s
+created dist/index.es.js in 4.7s
 
-./src/components/Accordion/index.ts, ./src/components/Author/index.ts, ./src/components/BannerWithTabs/index.ts, ./src/components/CopyLead/index.ts, ./src/components/DownloadList/index.ts, ./src/components/FeaturePost/index.ts, ./src/components/Highlights/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 → dist...
-created dist in 3.9s
+./src/components/Accordion/index.ts, ./src/components/ArticleSidebar/index.ts, ./src/components/Author/index.ts, ./src/components/BannerWithTabs/index.ts, ./src/components/CopyLead/index.ts, ./src/components/DownloadList/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 → dist...
+created dist in 3.7s
 
-./src/components/Accordion/index.ts, ./src/components/Author/index.ts, ./src/components/BannerWithTabs/index.ts, ./src/components/CopyLead/index.ts, ./src/components/DownloadList/index.ts, ./src/components/FeaturePost/index.ts, ./src/components/Highlights/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 → dist...
+./src/components/Accordion/index.ts, ./src/components/ArticleSidebar/index.ts, ./src/components/Author/index.ts, ./src/components/BannerWithTabs/index.ts, ./src/components/CopyLead/index.ts, ./src/components/DownloadList/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 → dist...
 created dist in 3.8s

package/CHANGELOG.md

@@ -1,7 +1,35 @@
 # @arc-ui/community-components
 
+## 1.0.1
+
+### Patch Changes
+
+- Bumping the arc-ui version to v12.0.0-beta.21
+
 ## 1.0.0
 
 ### Major Changes
 
+- b860730: Update community repo to use the arc repo changes, dot notation removed, theme and icon packages flattened, pkg paths updated
+
+### Minor Changes
+
+- 60a7218: Allow Icon prop to accept custom svgs types for copylead and articlesidebar
+- 6bbb300: Add new alignTypography and isInverted props to BannerWithTabs
+- 233531a: Remove illustrations package and references
+- 3030de7: Add script to generate json file containing all versions from changelog
+- da5f2b0: Add optional image to sectionheading component
+- 7de6006: Create new ProductNavigation component
+- 1e6d75f: Add component generator and ArticleSidebar component.
+
+### Patch Changes
+
+- 1eccea8: Update BannerWithTabs story copy and fix dark background bug
+- 1e6d75f: Update SectionHeading component to use prop elementType p
+- df655c9: Refactor ProductNavigation component to remove js DOM manipulation
+
+## 0.1.0
+
+### Minor Changes
+
 - initial version

package/dist/Accordion/Accordion.cjs.js

@@ -1,14 +1,15 @@
 'use strict';
 
-var tslib_es6 = require('../_shared/cjs/tslib.es6-DBA0GFPJ.js');
+var tslib_es6 = require('../_shared/cjs/tslib.es6-BxB9I209.js');
 var React = require('react');
 var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-ajtUvDAC.js');
-var SectionHeading = require('../_shared/cjs/SectionHeading-L2EpTQ79.js');
-var Disclosure = require('@arc-ui/components/dist/Disclosure');
+var SectionHeading = require('../_shared/cjs/SectionHeading-gjCR1F6E.js');
+var Disclosure = require('@arc-ui/components/Disclosure');
 require('../_shared/cjs/index-Bp6Dd2i1.js');
-require('@arc-ui/components/dist/Heading');
-require('@arc-ui/components/dist/Text');
-require('@arc-ui/components/dist/VerticalSpace');
+require('@arc-ui/components/Heading');
+require('@arc-ui/components/Text');
+require('@arc-ui/components/VerticalSpace');
+require('@arc-ui/components/Image');
 
 var AccordionDisclosureList = function (_a) {
     var disclosureList = _a.disclosureList;

package/dist/Accordion/Accordion.esm.js

@@ -1,12 +1,13 @@
-import { _ as __rest, a as __assign } from '../_shared/esm/tslib.es6-Cv15O4Nx.js';
+import { _ as __rest, a as __assign } from '../_shared/esm/tslib.es6-BVXMhEem.js';
 import React from 'react';
 import { f as filterDataAttrs } from '../_shared/esm/filter-data-attrs-V7cbJuwS.js';
-import { S as SectionHeading } from '../_shared/esm/SectionHeading-C70XNhqJ.js';
-import { Disclosure } from '@arc-ui/components/dist/Disclosure';
+import { S as SectionHeading } from '../_shared/esm/SectionHeading-BwbuyrYn.js';
+import { Disclosure } from '@arc-ui/components/Disclosure';
 import '../_shared/esm/index-BfTCfPZ1.js';
-import '@arc-ui/components/dist/Heading';
-import '@arc-ui/components/dist/Text';
-import '@arc-ui/components/dist/VerticalSpace';
+import '@arc-ui/components/Heading';
+import '@arc-ui/components/Text';
+import '@arc-ui/components/VerticalSpace';
+import '@arc-ui/components/Image';
 
 var AccordionDisclosureList = function (_a) {
     var disclosureList = _a.disclosureList;

package/dist/ArticleSidebar/ArticleSidebar.cjs.js

@@ -0,0 +1,148 @@
+'use strict';
+
+var tslib_es6 = require('../_shared/cjs/tslib.es6-BxB9I209.js');
+var React = require('react');
+var Heading = require('@arc-ui/components/Heading');
+var Icon = require('@arc-ui/components/Icon');
+var Text = require('@arc-ui/components/Text');
+var Rule = require('@arc-ui/components/Rule');
+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-DltMey-3.js');
+require('../_shared/cjs/filter-data-attrs-ajtUvDAC.js');
+require('@arc-ui/components/Grid');
+require('@arc-ui/components/Avatar');
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const ArcIconSocialLinkedin =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='M25.856 25.86H21.71v-6.496c0-1.55-.032-3.544-2.161-3.544-2.162 0-2.492 1.686-2.492 3.43v6.61H12.91V12.5h3.983v1.821h.053c.557-1.05 1.91-2.158 3.932-2.158 4.201 0 4.978 2.765 4.978 6.364v7.334zM8.226 10.673a2.406 2.406 0 0 1-2.406-2.41 2.408 2.408 0 1 1 2.407 2.41zm2.08 15.189H6.148V12.5h4.158v13.36zM27.929 2H4.066C2.924 2 2 2.903 2 4.017v23.966C2 29.098 2.924 30 4.066 30h23.86c1.14 0 2.074-.902 2.074-2.017V4.017C30 2.903 29.067 2 27.926 2z'/%3e%3c/svg%3e";
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const ArcIconSocialX =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='M24.034 3h4.278l-9.343 10.639L30 28.103h-8.64l-6.781-8.768-7.739 8.768H2.563L12.58 16.738 2 3h8.864l6.107 8.014zm-1.491 22.562h2.364L9.57 5.402H7.009z'/%3e%3c/svg%3e";
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconLink =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath d='M9.959 10.013h2.417a5.99 5.99 0 0 1 5.226 8.915.5.5 0 1 0 .872.49 6.99 6.99 0 0 0-6.098-10.405H9.959a6.989 6.989 0 0 0 0 13.977h1.54a.5.5 0 1 0 0-1h-1.54a5.989 5.989 0 0 1 0-11.977'/%3e%3cpath d='M22.063 9.013h-1.54a.5.5 0 0 0 0 1h1.54a5.989 5.989 0 0 1 0 11.977h-2.417a5.99 5.99 0 0 1-5.227-8.915.5.5 0 1 0-.871-.49 6.99 6.99 0 0 0 6.097 10.405h2.417a6.989 6.989 0 0 0 0-13.977'/%3e%3c/svg%3e";
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+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"};
+
+/**
+ * Use `ArticleSidebar` to provide additional information about the article.
+ */
+var ArticleSidebar = function (_a) {
+    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 url = location.href;
+    var copyTextToClipBoard = function () { return tslib_es6.__awaiter(void 0, void 0, void 0, function () {
+        return tslib_es6.__generator(this, function (_a) {
+            switch (_a.label) {
+                case 0: return [4 /*yield*/, navigator.clipboard.writeText(url)];
+                case 1:
+                    _a.sent();
+                    setShowToast(true);
+                    return [2 /*return*/];
+            }
+        });
+    }); };
+    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
+        ? [
+            {
+                label: "Share on LinkedIn",
+                href: "https://www.linkedin.com/sharing/share-offsite/?url=".concat(url),
+                icon: ArcIconSocialLinkedin,
+            },
+        ]
+        : []), true), (share.x
+        ? [
+            {
+                label: "Share on x",
+                href: "https://twitter.com/intent/tweet?url=".concat(url),
+                icon: ArcIconSocialX,
+            },
+        ]
+        : []), true);
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: styles.textContent },
+            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" }),
+                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) {
+                    var heading = _a.heading, headingLevel = _a.headingLevel, content = _a.content;
+                    return (React.createElement(React.Fragment, null,
+                        React.createElement(VerticalSpace.VerticalSpace, { size: "16" }),
+                        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" },
+            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" }),
+        topics && (React.createElement(React.Fragment, null,
+            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(Toast.Toast, null,
+            React.createElement(Toast.ToastNotification, { status: "success", title: "Copied to clipboard", isOpen: showToast, onOpenChange: function () { return setShowToast(false); } }))));
+};
+
+exports.ArticleSidebar = ArticleSidebar;

package/dist/ArticleSidebar/ArticleSidebar.esm.js

@@ -0,0 +1,146 @@
+import { b as __spreadArray, a as __assign, c as __awaiter, d as __generator } from '../_shared/esm/tslib.es6-BVXMhEem.js';
+import React, { useId, useState } from 'react';
+import { Heading } from '@arc-ui/components/Heading';
+import { Icon } from '@arc-ui/components/Icon';
+import { Text } from '@arc-ui/components/Text';
+import { Rule } from '@arc-ui/components/Rule';
+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-son1Cgke.js';
+import '../_shared/esm/filter-data-attrs-V7cbJuwS.js';
+import '@arc-ui/components/Grid';
+import '@arc-ui/components/Avatar';
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const ArcIconSocialLinkedin =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='M25.856 25.86H21.71v-6.496c0-1.55-.032-3.544-2.161-3.544-2.162 0-2.492 1.686-2.492 3.43v6.61H12.91V12.5h3.983v1.821h.053c.557-1.05 1.91-2.158 3.932-2.158 4.201 0 4.978 2.765 4.978 6.364v7.334zM8.226 10.673a2.406 2.406 0 0 1-2.406-2.41 2.408 2.408 0 1 1 2.407 2.41zm2.08 15.189H6.148V12.5h4.158v13.36zM27.929 2H4.066C2.924 2 2 2.903 2 4.017v23.966C2 29.098 2.924 30 4.066 30h23.86c1.14 0 2.074-.902 2.074-2.017V4.017C30 2.903 29.067 2 27.926 2z'/%3e%3c/svg%3e";
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const ArcIconSocialX =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='M24.034 3h4.278l-9.343 10.639L30 28.103h-8.64l-6.781-8.768-7.739 8.768H2.563L12.58 16.738 2 3h8.864l6.107 8.014zm-1.491 22.562h2.364L9.57 5.402H7.009z'/%3e%3c/svg%3e";
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconLink =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath d='M9.959 10.013h2.417a5.99 5.99 0 0 1 5.226 8.915.5.5 0 1 0 .872.49 6.99 6.99 0 0 0-6.098-10.405H9.959a6.989 6.989 0 0 0 0 13.977h1.54a.5.5 0 1 0 0-1h-1.54a5.989 5.989 0 0 1 0-11.977'/%3e%3cpath d='M22.063 9.013h-1.54a.5.5 0 0 0 0 1h1.54a5.989 5.989 0 0 1 0 11.977h-2.417a5.99 5.99 0 0 1-5.227-8.915.5.5 0 1 0-.871-.49 6.99 6.99 0 0 0 6.097 10.405h2.417a6.989 6.989 0 0 0 0-13.977'/%3e%3c/svg%3e";
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+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"};
+
+/**
+ * Use `ArticleSidebar` to provide additional information about the article.
+ */
+var ArticleSidebar = function (_a) {
+    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 url = location.href;
+    var copyTextToClipBoard = function () { return __awaiter(void 0, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0: return [4 /*yield*/, navigator.clipboard.writeText(url)];
+                case 1:
+                    _a.sent();
+                    setShowToast(true);
+                    return [2 /*return*/];
+            }
+        });
+    }); };
+    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
+        ? [
+            {
+                label: "Share on LinkedIn",
+                href: "https://www.linkedin.com/sharing/share-offsite/?url=".concat(url),
+                icon: ArcIconSocialLinkedin,
+            },
+        ]
+        : []), true), (share.x
+        ? [
+            {
+                label: "Share on x",
+                href: "https://twitter.com/intent/tweet?url=".concat(url),
+                icon: ArcIconSocialX,
+            },
+        ]
+        : []), true);
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: styles.textContent },
+            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" }),
+                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) {
+                    var heading = _a.heading, headingLevel = _a.headingLevel, content = _a.content;
+                    return (React.createElement(React.Fragment, null,
+                        React.createElement(VerticalSpace, { size: "16" }),
+                        React.createElement(Heading, { level: headingLevel, size: "xxs" }, heading),
+                        React.createElement(Text, { size: "s" }, content)));
+                })),
+        (author || aboutSection || additionalContent) && (React.createElement("div", { "data-testid": "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" }),
+        topics && (React.createElement(React.Fragment, null,
+            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(Toast, null,
+            React.createElement(ToastNotification, { status: "success", title: "Copied to clipboard", isOpen: showToast, onOpenChange: function () { return setShowToast(false); } }))));
+};
+
+export { ArticleSidebar };

package/dist/ArticleSidebar/styles.css

@@ -0,0 +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)}

package/dist/Author/Author.cjs.js

@@ -1,13 +1,13 @@
 'use strict';
 
-var Author = require('../_shared/cjs/Author-CAo-qryZ.js');
-require('../_shared/cjs/tslib.es6-DBA0GFPJ.js');
+var Author = require('../_shared/cjs/Author-DltMey-3.js');
+require('../_shared/cjs/tslib.es6-BxB9I209.js');
 require('react');
 require('../_shared/cjs/filter-data-attrs-ajtUvDAC.js');
-require('@arc-ui/components/dist/Grid');
-require('@arc-ui/components/dist/Avatar');
-require('@arc-ui/components/dist/Heading');
-require('@arc-ui/components/dist/Text');
+require('@arc-ui/components/Grid');
+require('@arc-ui/components/Avatar');
+require('@arc-ui/components/Heading');
+require('@arc-ui/components/Text');
 
 
 

package/dist/Author/Author.esm.js

@@ -1,8 +1,8 @@
-export { A as Author } from '../_shared/esm/Author-Bx-cE9Pz.js';
-import '../_shared/esm/tslib.es6-Cv15O4Nx.js';
+export { A as Author } from '../_shared/esm/Author-son1Cgke.js';
+import '../_shared/esm/tslib.es6-BVXMhEem.js';
 import 'react';
 import '../_shared/esm/filter-data-attrs-V7cbJuwS.js';
-import '@arc-ui/components/dist/Grid';
-import '@arc-ui/components/dist/Avatar';
-import '@arc-ui/components/dist/Heading';
-import '@arc-ui/components/dist/Text';
+import '@arc-ui/components/Grid';
+import '@arc-ui/components/Avatar';
+import '@arc-ui/components/Heading';
+import '@arc-ui/components/Text';

package/dist/BannerWithTabs/BannerWithTabs.cjs.js

@@ -1,36 +1,27 @@
 'use strict';
 
-var tslib_es6 = require('../_shared/cjs/tslib.es6-DBA0GFPJ.js');
 var React = require('react');
-var HeroBanner = require('@arc-ui/components/dist/HeroBanner');
-var ContentSwitcher = require('@arc-ui/components/dist/ContentSwitcher');
-var ContentSwitcherDropdown = require('@arc-ui/components/dist/ContentSwitcherDropdown');
+var index = require('../_shared/cjs/index-Bp6Dd2i1.js');
+var SectionHeading = require('../_shared/cjs/SectionHeading-gjCR1F6E.js');
+var components = require('@arc-ui/components');
+require('../_shared/cjs/tslib.es6-BxB9I209.js');
+require('../_shared/cjs/filter-data-attrs-ajtUvDAC.js');
+require('@arc-ui/components/Heading');
+require('@arc-ui/components/Text');
+require('@arc-ui/components/VerticalSpace');
+require('@arc-ui/components/Image');
 
-var styles = {"contentSwitcherWrapper":"BannerWithTabs-module_contentSwitcherWrapper__xvz39","contentSwitcherDropdownWrapper":"BannerWithTabs-module_contentSwitcherDropdownWrapper__eT5zq"};
+var styles = {"bannerWithTabsHeadingCentered":"BannerWithTabs-module_bannerWithTabsHeadingCentered__upqEO"};
 
 var BannerWithTabs = function (_a) {
     var _b;
-    var tabs = _a.tabs, defaultValue = _a.defaultValue;
-    var initialTab = defaultValue !== null && defaultValue !== void 0 ? defaultValue : (_b = tabs[0]) === null || _b === void 0 ? void 0 : _b.value;
-    var _c = React.useState(initialTab), selectedTab = _c[0], setSelectedTab = _c[1];
+    var tabs = _a.tabs, defaultValue = _a.defaultValue, heading = _a.heading, content = _a.content, _c = _a.alignTypography, alignTypography = _c === void 0 ? "left" : _c, _d = _a.isInverted, isInverted = _d === void 0 ? false : _d, minHeight = _a.minHeight, minHeightM = _a.minHeightM;
     return (React.createElement(React.Fragment, null,
-        React.createElement("div", { className: styles.contentSwitcherWrapper },
-            React.createElement(ContentSwitcher.ContentSwitcher, { value: selectedTab, onValueChange: function (value) { return setSelectedTab(value); } },
-                React.createElement(ContentSwitcher.ContentSwitcher.List, { isInset: true }, tabs.map(function (_a, index) {
-                    var label = _a.label, value = _a.value;
-                    return (React.createElement(ContentSwitcher.ContentSwitcher.Tab, { label: label, value: value, key: "".concat(index, "-").concat(value) }));
-                })),
-                tabs.map(function (_a, index) {
-                    var value = _a.value, content = _a.content;
-                    return (React.createElement(ContentSwitcher.ContentSwitcher.Content, { value: value, key: index },
-                        React.createElement(HeroBanner.HeroBanner, tslib_es6.__assign({}, content))));
-                }))),
-        React.createElement("div", { className: styles.contentSwitcherDropdownWrapper },
-            React.createElement(ContentSwitcherDropdown.ContentSwitcherDropdown, { value: selectedTab, tabs: tabs, isInset: true, isFluid: true, onValueChange: function (value) { return setSelectedTab(value); } }, tabs.map(function (_a, index) {
-                var value = _a.value, content = _a.content;
-                return (React.createElement(ContentSwitcherDropdown.ContentSwitcherDropdown.Content, { value: value, key: "".concat(index, "-").concat(value) },
-                    React.createElement(HeroBanner.HeroBanner, tslib_es6.__assign({}, content))));
-            })))));
+        React.createElement("div", { className: index.classNames(styles.bannerWithTabsHeading, (_b = {},
+                _b[styles.bannerWithTabsHeadingCentered] = alignTypography === "center",
+                _b)), style: { color: isInverted ? "white" : "black" } },
+            React.createElement(SectionHeading.SectionHeading, { heading: heading, content: content, isPadded: alignTypography === "left" ? true : false })),
+        React.createElement(components.TabbedBanner, { minHeight: minHeight, minHeightM: minHeightM, tabs: tabs, defaultValue: defaultValue })));
 };
 
 exports.BannerWithTabs = BannerWithTabs;

package/dist/BannerWithTabs/BannerWithTabs.esm.js

@@ -1,34 +1,25 @@
-import { a as __assign } from '../_shared/esm/tslib.es6-Cv15O4Nx.js';
-import React, { useState } from 'react';
-import { HeroBanner } from '@arc-ui/components/dist/HeroBanner';
-import { ContentSwitcher } from '@arc-ui/components/dist/ContentSwitcher';
-import { ContentSwitcherDropdown } from '@arc-ui/components/dist/ContentSwitcherDropdown';
+import React from 'react';
+import { c as classNames } from '../_shared/esm/index-BfTCfPZ1.js';
+import { S as SectionHeading } from '../_shared/esm/SectionHeading-BwbuyrYn.js';
+import { TabbedBanner } from '@arc-ui/components';
+import '../_shared/esm/tslib.es6-BVXMhEem.js';
+import '../_shared/esm/filter-data-attrs-V7cbJuwS.js';
+import '@arc-ui/components/Heading';
+import '@arc-ui/components/Text';
+import '@arc-ui/components/VerticalSpace';
+import '@arc-ui/components/Image';
 
-var styles = {"contentSwitcherWrapper":"BannerWithTabs-module_contentSwitcherWrapper__xvz39","contentSwitcherDropdownWrapper":"BannerWithTabs-module_contentSwitcherDropdownWrapper__eT5zq"};
+var styles = {"bannerWithTabsHeadingCentered":"BannerWithTabs-module_bannerWithTabsHeadingCentered__upqEO"};
 
 var BannerWithTabs = function (_a) {
     var _b;
-    var tabs = _a.tabs, defaultValue = _a.defaultValue;
-    var initialTab = defaultValue !== null && defaultValue !== void 0 ? defaultValue : (_b = tabs[0]) === null || _b === void 0 ? void 0 : _b.value;
-    var _c = useState(initialTab), selectedTab = _c[0], setSelectedTab = _c[1];
+    var tabs = _a.tabs, defaultValue = _a.defaultValue, heading = _a.heading, content = _a.content, _c = _a.alignTypography, alignTypography = _c === void 0 ? "left" : _c, _d = _a.isInverted, isInverted = _d === void 0 ? false : _d, minHeight = _a.minHeight, minHeightM = _a.minHeightM;
     return (React.createElement(React.Fragment, null,
-        React.createElement("div", { className: styles.contentSwitcherWrapper },
-            React.createElement(ContentSwitcher, { value: selectedTab, onValueChange: function (value) { return setSelectedTab(value); } },
-                React.createElement(ContentSwitcher.List, { isInset: true }, tabs.map(function (_a, index) {
-                    var label = _a.label, value = _a.value;
-                    return (React.createElement(ContentSwitcher.Tab, { label: label, value: value, key: "".concat(index, "-").concat(value) }));
-                })),
-                tabs.map(function (_a, index) {
-                    var value = _a.value, content = _a.content;
-                    return (React.createElement(ContentSwitcher.Content, { value: value, key: index },
-                        React.createElement(HeroBanner, __assign({}, content))));
-                }))),
-        React.createElement("div", { className: styles.contentSwitcherDropdownWrapper },
-            React.createElement(ContentSwitcherDropdown, { value: selectedTab, tabs: tabs, isInset: true, isFluid: true, onValueChange: function (value) { return setSelectedTab(value); } }, tabs.map(function (_a, index) {
-                var value = _a.value, content = _a.content;
-                return (React.createElement(ContentSwitcherDropdown.Content, { value: value, key: "".concat(index, "-").concat(value) },
-                    React.createElement(HeroBanner, __assign({}, content))));
-            })))));
+        React.createElement("div", { className: classNames(styles.bannerWithTabsHeading, (_b = {},
+                _b[styles.bannerWithTabsHeadingCentered] = alignTypography === "center",
+                _b)), style: { color: isInverted ? "white" : "black" } },
+            React.createElement(SectionHeading, { heading: heading, content: content, isPadded: alignTypography === "left" ? true : false })),
+        React.createElement(TabbedBanner, { minHeight: minHeight, minHeightM: minHeightM, tabs: tabs, defaultValue: defaultValue })));
 };
 
 export { BannerWithTabs };

package/dist/BannerWithTabs/styles.css

@@ -1 +1 @@
-.BannerWithTabs-module_contentSwitcherWrapper__xvz39{display:none}.BannerWithTabs-module_contentSwitcherDropdownWrapper__eT5zq{display:block}@media (min-width:636px){.BannerWithTabs-module_contentSwitcherWrapper__xvz39{display:block}.BannerWithTabs-module_contentSwitcherDropdownWrapper__eT5zq{display:none}}
+.BannerWithTabs-module_contentSwitcherWrapper__xvz39{display:none}.BannerWithTabs-module_contentSwitcherDropdownWrapper__eT5zq{display:block}@media (min-width:636px){.BannerWithTabs-module_contentSwitcherWrapper__xvz39{display:block}.BannerWithTabs-module_contentSwitcherDropdownWrapper__eT5zq{display:none}}.BannerWithTabs-module_bannerWithTabsHeadingCentered__upqEO{text-align:center}@media (min-width:636px){.BannerWithTabs-module_bannerWithTabsHeadingCentered__upqEO{padding-left:62px;padding-right:62px}}@media (min-width:768px){.BannerWithTabs-module_bannerWithTabsHeadingCentered__upqEO{padding-left:86px;padding-right:86px}}@media (min-width:1024px){.BannerWithTabs-module_bannerWithTabsHeadingCentered__upqEO{padding-left:104px;padding-right:104px}}