@easypost/easy-ui 1.0.0-alpha.9 → 1.0.0-alpha.91

package/MultiSelect/utilities.d.ts

@@ -0,0 +1,3 @@
+import { RefObject } from "react";
+export declare function useElementWidth(elementRef: RefObject<HTMLDivElement>): number;
+//# sourceMappingURL=utilities.d.ts.map

package/MultiSelect/utilities.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utilities.d.ts","sourceRoot":"","sources":["../../src/MultiSelect/utilities.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAE5C,wBAAgB,eAAe,CAAC,UAAU,EAAE,SAAS,CAAC,cAAc,CAAC,UAcpE"}

package/MultipageSection/MultipageSection.d.ts

@@ -0,0 +1,118 @@
+import React, { ReactNode } from "react";
+import { MultipageSectionSidebarNav, MultipageSectionSidebarNavLink, MultipageSectionSidebarNavSection } from "./MultipageSectionSidebarNav";
+import { IconSymbol } from "../types";
+export type MultipageSectionProps = {
+    /** MultipageSection children. */
+    children: ReactNode;
+};
+export type MultipageSectionContainerProps = {
+    /** MultipageSection container children. */
+    children: ReactNode;
+};
+export type MultipageSectionSplitContainerProps = {
+    /** MultipageSection split container children. */
+    children: ReactNode;
+};
+export type MultipageSectionSidebarProps = {
+    /** MultipageSection sidebar children. */
+    children: ReactNode;
+};
+export type MultipageSectionBrandHeaderProps = {
+    /** MultipageSection brand header children. */
+    children: ReactNode;
+};
+export type MultipageSectionBrandHeaderLogoProps = {
+    /** MultipageSection brand header logo children. */
+    children: ReactNode;
+};
+export type MultipageSectionBrandHeaderTitleProps = {
+    /** MultipageSection brand header title children. */
+    children: ReactNode;
+};
+export type MultipageSectionContentProps = {
+    /** MultipageSection content children. */
+    children: ReactNode;
+};
+export type MultipageSectionContentHeaderProps = {
+    /** MultipageSection container header children. */
+    children: ReactNode;
+};
+export type MultipageSectionContentTitleProps = {
+    /** MultipageSection content title icon. */
+    titleIcon?: IconSymbol;
+    /** MultipageSection content title text. */
+    children: ReactNode;
+};
+/**
+ * `MultipageSection` represents a section for multipage navigation and
+ * a content area that is preceded by a branded header.
+ *
+ * @example
+ * ```tsx
+ *  <MultipageSection>
+ *     <MultipageSection.Container>
+ *       <MultipageSection.BrandHeader>
+ *         <MultipageSection.BrandHeaderLogo>
+ *           <SomeLogo />
+ *         </MultipageSection.BrandHeaderLogo>
+ *         <MultipageSection.BrandHeaderTitle>
+ *           Brand Title
+ *         </MultipageSection.BrandHeaderTitle>
+ *       </MultipageSection.BrandHeader>
+ *       <MultipageSection.SplitContainer>
+ *         <MultipageSection.Sidebar>
+ *           <MultipageSection.SidebarNav selectedHref="/1">
+ *             <MultipageSection.SidebarNavLink
+ *               href="/1"
+ *               iconSymbol={Icon}
+ *             >
+ *               Link 1
+ *             </MultipageSection.SidebarNavLink>
+ *             <MultipageSection.SidebarNavLink
+ *               href="/2"
+ *               iconSymbol={Icon}
+ *             >
+ *               Link 2
+ *             </MultipageSection.SidebarNavLink>
+ *           </MultipageSection.SidebarNav>
+ *         </MultipageSection.Sidebar>
+ *         <MultipageSection.Content>
+ *           <MultipageSection.ContentHeader>
+ *             <MultipageSection.ContentTitle titleIcon={Icon}>
+ *               Content Title
+ *             </MultipageSection.ContentTitle>
+ *           </MultipageSection.ContentHeader>
+ *           <div>Content</div>
+ *         </MultipageSection.Content>
+ *       </MultipageSection.SplitContainer>
+ *     </MultipageSection.Container>
+ *   </MultipageSection>
+ * ```
+ */
+export declare function MultipageSection(props: MultipageSectionProps): React.JSX.Element;
+export declare namespace MultipageSection {
+    var Container: typeof MultipageSectionContainer;
+    var SplitContainer: typeof MultipageSectionSplitContainer;
+    var Sidebar: typeof MultipageSectionSidebar;
+    var BrandHeader: typeof MultipageSectionBrandHeader;
+    var BrandHeaderLogo: typeof MultipageSectionBrandHeaderLogo;
+    var BrandHeaderTitle: typeof MultipageSectionBrandHeaderTitle;
+    var Content: typeof MultipageSectionContent;
+    var ContentHeader: typeof MultipageSectionContentHeader;
+    var ContentTitle: typeof MultipageSectionContentTitle;
+    var SidebarNav: typeof MultipageSectionSidebarNav;
+    var SidebarNavSection: typeof MultipageSectionSidebarNavSection;
+    var SidebarNavLink: typeof MultipageSectionSidebarNavLink;
+    var useMultipageSectionSidebarNav: () => import("./MultipageSectionSidebarNav").SidebarNavContextType;
+}
+export declare function MultipageSectionContainer(props: MultipageSectionContainerProps): React.JSX.Element;
+export declare function MultipageSectionSplitContainer(props: MultipageSectionSplitContainerProps): React.JSX.Element;
+declare function MultipageSectionSidebar(props: MultipageSectionSidebarProps): React.JSX.Element;
+declare function MultipageSectionBrandHeader(props: MultipageSectionBrandHeaderProps): React.JSX.Element;
+declare function MultipageSectionBrandHeaderLogo(props: MultipageSectionBrandHeaderLogoProps): React.JSX.Element;
+declare function MultipageSectionBrandHeaderTitle(props: MultipageSectionBrandHeaderTitleProps): React.JSX.Element;
+declare function MultipageSectionContent(props: MultipageSectionContentProps): React.JSX.Element;
+declare function MultipageSectionContentHeader(props: MultipageSectionContentHeaderProps): React.JSX.Element;
+declare function MultipageSectionContentTitle(props: MultipageSectionContentTitleProps): React.JSX.Element;
+export {};
+//# sourceMappingURL=MultipageSection.d.ts.map

package/MultipageSection/MultipageSection.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MultipageSection.d.ts","sourceRoot":"","sources":["../../src/MultipageSection/MultipageSection.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIzC,OAAO,EACL,0BAA0B,EAC1B,8BAA8B,EAC9B,iCAAiC,EAElC,MAAM,8BAA8B,CAAC;AAGtC,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAGtC,MAAM,MAAM,qBAAqB,GAAG;IAClC,iCAAiC;IACjC,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,8BAA8B,GAAG;IAC3C,2CAA2C;IAC3C,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,mCAAmC,GAAG;IAChD,iDAAiD;IACjD,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,4BAA4B,GAAG;IACzC,yCAAyC;IACzC,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,gCAAgC,GAAG;IAC7C,8CAA8C;IAC9C,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,oCAAoC,GAAG;IACjD,mDAAmD;IACnD,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,qCAAqC,GAAG;IAClD,oDAAoD;IACpD,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,4BAA4B,GAAG;IACzC,yCAAyC;IACzC,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,kCAAkC,GAAG;IAC/C,kDAAkD;IAClD,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,iCAAiC,GAAG;IAC9C,2CAA2C;IAC3C,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB,2CAA2C;IAC3C,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6CG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,qBAG5D;yBAHe,gBAAgB;;;;;;;;;;;;;;;AAKhC,wBAAgB,yBAAyB,CACvC,KAAK,EAAE,8BAA8B,qBAItC;AAED,wBAAgB,8BAA8B,CAC5C,KAAK,EAAE,mCAAmC,qBAI3C;AAED,iBAAS,uBAAuB,CAAC,KAAK,EAAE,4BAA4B,qBAOnE;AAED,iBAAS,2BAA2B,CAAC,KAAK,EAAE,gCAAgC,qBAU3E;AAED,iBAAS,+BAA+B,CACtC,KAAK,EAAE,oCAAoC,qBAK5C;AAED,iBAAS,gCAAgC,CACvC,KAAK,EAAE,qCAAqC,qBAQ7C;AAED,iBAAS,uBAAuB,CAAC,KAAK,EAAE,4BAA4B,qBAOnE;AAED,iBAAS,6BAA6B,CACpC,KAAK,EAAE,kCAAkC,qBAQ1C;AAED,iBAAS,4BAA4B,CACnC,KAAK,EAAE,iCAAiC,qBAmBzC"}

package/MultipageSection/MultipageSection.stories.d.ts

@@ -0,0 +1,8 @@
+import { Meta, StoryObj } from "@storybook/react";
+import { MultipageSection } from "./MultipageSection";
+type Story = StoryObj<typeof MultipageSection>;
+declare const meta: Meta<typeof MultipageSection>;
+export default meta;
+export declare const Standard: Story;
+export declare const Layout: Story;
+//# sourceMappingURL=MultipageSection.stories.d.ts.map

package/MultipageSection/MultipageSection.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MultipageSection.stories.d.ts","sourceRoot":"","sources":["../../src/MultipageSection/MultipageSection.stories.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAOlD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEtD,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAE/C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,gBAAgB,CAUvC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,eAAO,MAAM,QAAQ,EAAE,KAoEtB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAoFpB,CAAC"}

package/MultipageSection/MultipageSection.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=MultipageSection.test.d.ts.map

package/MultipageSection/MultipageSection.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MultipageSection.test.d.ts","sourceRoot":"","sources":["../../src/MultipageSection/MultipageSection.test.tsx"],"names":[],"mappings":""}

package/MultipageSection/MultipageSectionSidebarNav.d.ts

@@ -0,0 +1,29 @@
+import React, { ReactNode } from "react";
+import { AriaLinkOptions } from "react-aria";
+import { IconSymbol } from "../types";
+export type MultipageSectionSidebarNavProps = {
+    /** Selected href of sidebar nav link. */
+    selectedHref?: AriaLinkOptions["href"];
+    /** Multipage container children. */
+    children: ReactNode;
+};
+export type MultipageSectionSidebarNavSectionProps = {
+    /** Sidebar nav section title. */
+    title: ReactNode;
+    /** Sidebar nav section children. */
+    children: ReactNode;
+};
+export type MultipageSectionSidebarNavLinkProps = {
+    /** Nav link icon symbol. */
+    iconSymbol: IconSymbol;
+    /** Nav link children. */
+    children: ReactNode;
+} & AriaLinkOptions;
+export type SidebarNavContextType = {
+    selectedHref?: MultipageSectionSidebarNavProps["selectedHref"];
+};
+export declare const useMultipageSectionSidebarNav: () => SidebarNavContextType;
+export declare function MultipageSectionSidebarNav(props: MultipageSectionSidebarNavProps): React.JSX.Element;
+export declare function MultipageSectionSidebarNavSection(props: MultipageSectionSidebarNavSectionProps): React.JSX.Element;
+export declare function MultipageSectionSidebarNavLink(props: MultipageSectionSidebarNavLinkProps): React.JSX.Element;
+//# sourceMappingURL=MultipageSectionSidebarNav.d.ts.map

package/MultipageSection/MultipageSectionSidebarNav.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MultipageSectionSidebarNav.d.ts","sourceRoot":"","sources":["../../src/MultipageSection/MultipageSectionSidebarNav.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAA+B,MAAM,OAAO,CAAC;AACtE,OAAO,EACL,eAAe,EAKhB,MAAM,YAAY,CAAC;AAIpB,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAKtC,MAAM,MAAM,+BAA+B,GAAG;IAC5C,yCAAyC;IACzC,YAAY,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IACvC,oCAAoC;IACpC,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,sCAAsC,GAAG;IACnD,iCAAiC;IACjC,KAAK,EAAE,SAAS,CAAC;IACjB,oCAAoC;IACpC,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,mCAAmC,GAAG;IAChD,4BAA4B;IAC5B,UAAU,EAAE,UAAU,CAAC;IACvB,yBAAyB;IACzB,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,eAAe,CAAC;AAEpB,MAAM,MAAM,qBAAqB,GAAG;IAClC,YAAY,CAAC,EAAE,+BAA+B,CAAC,cAAc,CAAC,CAAC;CAChE,CAAC;AAMF,eAAO,MAAM,6BAA6B,6BAQzC,CAAC;AAEF,wBAAgB,0BAA0B,CACxC,KAAK,EAAE,+BAA+B,qBAavC;AAED,wBAAgB,iCAAiC,CAC/C,KAAK,EAAE,sCAAsC,qBAS9C;AAED,wBAAgB,8BAA8B,CAC5C,KAAK,EAAE,mCAAmC,qBA6B3C"}

package/MultipageSection/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./MultipageSection";
+//# sourceMappingURL=index.d.ts.map

package/MultipageSection/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/MultipageSection/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC"}

package/MultipageSection/index.js

@@ -0,0 +1,208 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const React = require("react");
+const HorizontalStack = require("../__chunks__/HorizontalStack-CXpjASZi.js");
+const Text = require("../__chunks__/Text-BXsuDbqc.js");
+const VerticalStack = require("../__chunks__/VerticalStack-Dzpv3O67.js");
+const Icon = require("../__chunks__/Icon-W8F9w-jS.js");
+const utilities_css = require("../utilities/css.js");
+const useLink = require("../__chunks__/useLink-rHGI96g9.js");
+const useFocusRing = require("../__chunks__/useFocusRing-Do5WdNL_.js");
+const mergeProps = require("../__chunks__/mergeProps-d7wJkv71.js");
+const useHover = require("../__chunks__/useHover-BK8LX0kX.js");
+const link = "_link_90vuv_4";
+const focused = "_focused_90vuv_13";
+const hovered = "_hovered_90vuv_25";
+const selected = "_selected_90vuv_29";
+const styles$1 = {
+  link,
+  focused,
+  hovered,
+  selected
+};
+const SidebarNavContext = React.createContext(null);
+const useMultipageSectionSidebarNav = () => {
+  const context = React.useContext(SidebarNavContext);
+  if (!context) {
+    throw new Error("useMultipageSectionSidebarNav must be used within a MultipageSectionSidebarNav");
+  }
+  return context;
+};
+function MultipageSectionSidebarNav(props) {
+  const { selectedHref, children } = props;
+  const context = React.useMemo(() => {
+    return {
+      selectedHref
+    };
+  }, [selectedHref]);
+  return React.createElement(SidebarNavContext.Provider, {
+    value: context
+  }, React.createElement(VerticalStack.VerticalStack, {
+    as: "nav",
+    gap: "2"
+  }, children));
+}
+function MultipageSectionSidebarNavSection(props) {
+  const { title, children } = props;
+  return React.createElement(VerticalStack.VerticalStack, {
+    gap: "2",
+    inlineAlign: "start"
+  }, React.createElement(Text.Text, {
+    variant: "overline"
+  }, title), children);
+}
+function MultipageSectionSidebarNavLink(props) {
+  const { href, iconSymbol, children } = props;
+  const { selectedHref } = useMultipageSectionSidebarNav();
+  const ref = React.useRef(null);
+  const { linkProps } = useLink.$298d61e98472621b$export$dcf14c9974fe2767(props, ref);
+  const { focusProps, isFocusVisible } = useFocusRing.$f7dceffc5ad7768b$export$4e328f61c538687f(props);
+  const { hoverProps, isHovered } = useHover.$6179b936705e76d3$export$ae780daf29e6d456(props);
+  const isSelected = href === selectedHref;
+  const className = utilities_css.classNames(styles$1.link, isFocusVisible && styles$1.focused, isHovered && styles$1.hovered, isSelected && styles$1.selected);
+  return React.createElement("a", __spreadProps(__spreadValues({
+    ref,
+    className
+  }, mergeProps.$3ef42575df84b30b$export$9d1611c77c2fe928(hoverProps, focusProps, linkProps)), {
+    "aria-current": isSelected ? "page" : void 0
+  }), React.createElement(Icon.Icon, {
+    symbol: iconSymbol
+  }), React.createElement(Text.Text, {
+    variant: "body2",
+    weight: isSelected ? "semibold" : void 0
+  }, children));
+}
+const MultipageSection$1 = "_MultipageSection_1opeu_4";
+const container = "_container_1opeu_14";
+const splitContainer = "_splitContainer_1opeu_15";
+const brandHeader = "_brandHeader_1opeu_25";
+const brandLogo = "_brandLogo_1opeu_32";
+const sidebar = "_sidebar_1opeu_36";
+const content = "_content_1opeu_43";
+const styles = {
+  MultipageSection: MultipageSection$1,
+  container,
+  splitContainer,
+  brandHeader,
+  brandLogo,
+  sidebar,
+  content
+};
+function MultipageSection(props) {
+  const { children } = props;
+  return React.createElement("section", {
+    className: styles.MultipageSection
+  }, children);
+}
+function MultipageSectionContainer(props) {
+  const { children } = props;
+  return React.createElement("div", {
+    className: styles.container
+  }, children);
+}
+function MultipageSectionSplitContainer(props) {
+  const { children } = props;
+  return React.createElement("div", {
+    className: styles.splitContainer
+  }, children);
+}
+function MultipageSectionSidebar(props) {
+  const { children } = props;
+  return React.createElement("div", {
+    role: "region",
+    className: styles.sidebar
+  }, children);
+}
+function MultipageSectionBrandHeader(props) {
+  const { children } = props;
+  return React.createElement("div", {
+    className: styles.brandHeader
+  }, React.createElement(HorizontalStack.HorizontalStack, {
+    gap: "2",
+    blockAlign: "center"
+  }, children));
+}
+function MultipageSectionBrandHeaderLogo(props) {
+  const { children } = props;
+  return React.createElement("div", {
+    className: styles.brandLogo
+  }, children);
+}
+function MultipageSectionBrandHeaderTitle(props) {
+  const { children } = props;
+  return React.createElement(Text.Text, {
+    as: "h2",
+    variant: "heading3",
+    color: "primary.800"
+  }, children);
+}
+function MultipageSectionContent(props) {
+  const { children } = props;
+  return React.createElement("div", {
+    className: styles.content
+  }, React.createElement(VerticalStack.VerticalStack, {
+    gap: "2"
+  }, children));
+}
+function MultipageSectionContentHeader(props) {
+  const { children } = props;
+  return React.createElement(HorizontalStack.HorizontalStack, {
+    as: "header",
+    blockAlign: "center",
+    align: "space-between"
+  }, children);
+}
+function MultipageSectionContentTitle(props) {
+  const { children, titleIcon } = props;
+  return React.createElement(React.Fragment, null, titleIcon ? React.createElement(HorizontalStack.HorizontalStack, {
+    gap: "1",
+    blockAlign: "center"
+  }, React.createElement(Icon.Icon, {
+    symbol: titleIcon,
+    size: "lg",
+    color: "primary.800"
+  }), React.createElement(Text.Text, {
+    as: "h3",
+    variant: "heading5",
+    color: "primary.800"
+  }, children)) : React.createElement(Text.Text, {
+    as: "h3",
+    variant: "heading5",
+    color: "primary.800"
+  }, children));
+}
+MultipageSection.Container = MultipageSectionContainer;
+MultipageSection.SplitContainer = MultipageSectionSplitContainer;
+MultipageSection.Sidebar = MultipageSectionSidebar;
+MultipageSection.BrandHeader = MultipageSectionBrandHeader;
+MultipageSection.BrandHeaderLogo = MultipageSectionBrandHeaderLogo;
+MultipageSection.BrandHeaderTitle = MultipageSectionBrandHeaderTitle;
+MultipageSection.Content = MultipageSectionContent;
+MultipageSection.ContentHeader = MultipageSectionContentHeader;
+MultipageSection.ContentTitle = MultipageSectionContentTitle;
+MultipageSection.SidebarNav = MultipageSectionSidebarNav;
+MultipageSection.SidebarNavSection = MultipageSectionSidebarNavSection;
+MultipageSection.SidebarNavLink = MultipageSectionSidebarNavLink;
+MultipageSection.useMultipageSectionSidebarNav = useMultipageSectionSidebarNav;
+exports.MultipageSection = MultipageSection;
+exports.MultipageSectionContainer = MultipageSectionContainer;
+exports.MultipageSectionSplitContainer = MultipageSectionSplitContainer;

package/MultipageSection/index.mjs

@@ -0,0 +1,208 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import React__default, { useMemo, useRef, useContext } from "react";
+import { H as HorizontalStack } from "../__chunks__/HorizontalStack-CxE8tPx_.mjs";
+import { T as Text } from "../__chunks__/Text-BWjD7__Y.mjs";
+import { V as VerticalStack } from "../__chunks__/VerticalStack-C2yDQVHD.mjs";
+import { I as Icon } from "../__chunks__/Icon-0SN9dbwU.mjs";
+import { classNames } from "../utilities/css.mjs";
+import { $ as $298d61e98472621b$export$dcf14c9974fe2767 } from "../__chunks__/useLink-hFVDzAjm.mjs";
+import { $ as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../__chunks__/useFocusRing-I6O2iIqT.mjs";
+import { $ as $3ef42575df84b30b$export$9d1611c77c2fe928 } from "../__chunks__/mergeProps-CORsYhTp.mjs";
+import { $ as $6179b936705e76d3$export$ae780daf29e6d456 } from "../__chunks__/useHover-Djd8mM67.mjs";
+const link = "_link_90vuv_4";
+const focused = "_focused_90vuv_13";
+const hovered = "_hovered_90vuv_25";
+const selected = "_selected_90vuv_29";
+const styles$1 = {
+  link,
+  focused,
+  hovered,
+  selected
+};
+const SidebarNavContext = React__default.createContext(null);
+const useMultipageSectionSidebarNav = () => {
+  const context = useContext(SidebarNavContext);
+  if (!context) {
+    throw new Error("useMultipageSectionSidebarNav must be used within a MultipageSectionSidebarNav");
+  }
+  return context;
+};
+function MultipageSectionSidebarNav(props) {
+  const { selectedHref, children } = props;
+  const context = useMemo(() => {
+    return {
+      selectedHref
+    };
+  }, [selectedHref]);
+  return React__default.createElement(SidebarNavContext.Provider, {
+    value: context
+  }, React__default.createElement(VerticalStack, {
+    as: "nav",
+    gap: "2"
+  }, children));
+}
+function MultipageSectionSidebarNavSection(props) {
+  const { title, children } = props;
+  return React__default.createElement(VerticalStack, {
+    gap: "2",
+    inlineAlign: "start"
+  }, React__default.createElement(Text, {
+    variant: "overline"
+  }, title), children);
+}
+function MultipageSectionSidebarNavLink(props) {
+  const { href, iconSymbol, children } = props;
+  const { selectedHref } = useMultipageSectionSidebarNav();
+  const ref = useRef(null);
+  const { linkProps } = $298d61e98472621b$export$dcf14c9974fe2767(props, ref);
+  const { focusProps, isFocusVisible } = $f7dceffc5ad7768b$export$4e328f61c538687f(props);
+  const { hoverProps, isHovered } = $6179b936705e76d3$export$ae780daf29e6d456(props);
+  const isSelected = href === selectedHref;
+  const className = classNames(styles$1.link, isFocusVisible && styles$1.focused, isHovered && styles$1.hovered, isSelected && styles$1.selected);
+  return React__default.createElement("a", __spreadProps(__spreadValues({
+    ref,
+    className
+  }, $3ef42575df84b30b$export$9d1611c77c2fe928(hoverProps, focusProps, linkProps)), {
+    "aria-current": isSelected ? "page" : void 0
+  }), React__default.createElement(Icon, {
+    symbol: iconSymbol
+  }), React__default.createElement(Text, {
+    variant: "body2",
+    weight: isSelected ? "semibold" : void 0
+  }, children));
+}
+const MultipageSection$1 = "_MultipageSection_1opeu_4";
+const container = "_container_1opeu_14";
+const splitContainer = "_splitContainer_1opeu_15";
+const brandHeader = "_brandHeader_1opeu_25";
+const brandLogo = "_brandLogo_1opeu_32";
+const sidebar = "_sidebar_1opeu_36";
+const content = "_content_1opeu_43";
+const styles = {
+  MultipageSection: MultipageSection$1,
+  container,
+  splitContainer,
+  brandHeader,
+  brandLogo,
+  sidebar,
+  content
+};
+function MultipageSection(props) {
+  const { children } = props;
+  return React__default.createElement("section", {
+    className: styles.MultipageSection
+  }, children);
+}
+function MultipageSectionContainer(props) {
+  const { children } = props;
+  return React__default.createElement("div", {
+    className: styles.container
+  }, children);
+}
+function MultipageSectionSplitContainer(props) {
+  const { children } = props;
+  return React__default.createElement("div", {
+    className: styles.splitContainer
+  }, children);
+}
+function MultipageSectionSidebar(props) {
+  const { children } = props;
+  return React__default.createElement("div", {
+    role: "region",
+    className: styles.sidebar
+  }, children);
+}
+function MultipageSectionBrandHeader(props) {
+  const { children } = props;
+  return React__default.createElement("div", {
+    className: styles.brandHeader
+  }, React__default.createElement(HorizontalStack, {
+    gap: "2",
+    blockAlign: "center"
+  }, children));
+}
+function MultipageSectionBrandHeaderLogo(props) {
+  const { children } = props;
+  return React__default.createElement("div", {
+    className: styles.brandLogo
+  }, children);
+}
+function MultipageSectionBrandHeaderTitle(props) {
+  const { children } = props;
+  return React__default.createElement(Text, {
+    as: "h2",
+    variant: "heading3",
+    color: "primary.800"
+  }, children);
+}
+function MultipageSectionContent(props) {
+  const { children } = props;
+  return React__default.createElement("div", {
+    className: styles.content
+  }, React__default.createElement(VerticalStack, {
+    gap: "2"
+  }, children));
+}
+function MultipageSectionContentHeader(props) {
+  const { children } = props;
+  return React__default.createElement(HorizontalStack, {
+    as: "header",
+    blockAlign: "center",
+    align: "space-between"
+  }, children);
+}
+function MultipageSectionContentTitle(props) {
+  const { children, titleIcon } = props;
+  return React__default.createElement(React__default.Fragment, null, titleIcon ? React__default.createElement(HorizontalStack, {
+    gap: "1",
+    blockAlign: "center"
+  }, React__default.createElement(Icon, {
+    symbol: titleIcon,
+    size: "lg",
+    color: "primary.800"
+  }), React__default.createElement(Text, {
+    as: "h3",
+    variant: "heading5",
+    color: "primary.800"
+  }, children)) : React__default.createElement(Text, {
+    as: "h3",
+    variant: "heading5",
+    color: "primary.800"
+  }, children));
+}
+MultipageSection.Container = MultipageSectionContainer;
+MultipageSection.SplitContainer = MultipageSectionSplitContainer;
+MultipageSection.Sidebar = MultipageSectionSidebar;
+MultipageSection.BrandHeader = MultipageSectionBrandHeader;
+MultipageSection.BrandHeaderLogo = MultipageSectionBrandHeaderLogo;
+MultipageSection.BrandHeaderTitle = MultipageSectionBrandHeaderTitle;
+MultipageSection.Content = MultipageSectionContent;
+MultipageSection.ContentHeader = MultipageSectionContentHeader;
+MultipageSection.ContentTitle = MultipageSectionContentTitle;
+MultipageSection.SidebarNav = MultipageSectionSidebarNav;
+MultipageSection.SidebarNavSection = MultipageSectionSidebarNavSection;
+MultipageSection.SidebarNavLink = MultipageSectionSidebarNavLink;
+MultipageSection.useMultipageSectionSidebarNav = useMultipageSectionSidebarNav;
+export {
+  MultipageSection,
+  MultipageSectionContainer,
+  MultipageSectionSplitContainer
+};