@easypost/easy-ui 1.0.0-alpha.7 → 1.0.0-alpha.70

package/VerticalNav/VerticalNav.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VerticalNav.stories.d.ts","sourceRoot":"","sources":["../../src/VerticalNav/VerticalNav.stories.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AASlD,OAAO,EAAE,qBAAqB,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAEnE,KAAK,SAAS,GAAG,QAAQ,CAAC,OAAO,WAAW,CAAC,CAAC;AAC9C,KAAK,SAAS,GAAG,QAAQ,CAAC,OAAO,qBAAqB,CAAC,CAAC;AAUxD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CAoClC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,eAAO,MAAM,MAAM,EAAE,SAGpB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,SA6BpB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,SAQxB,CAAC;AAEF,eAAO,MAAM,uBAAuB,EAAE,SAmBrC,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,SAMxB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,SAgBzB,CAAC"}

package/VerticalNav/VerticalNav.test.d.ts

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

package/VerticalNav/VerticalNav.test.d.ts.map

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

package/VerticalNav/context.d.ts

@@ -0,0 +1,4 @@
+export type VerticalNavType = "list" | "tree";
+export declare const VerticalNavTypeContext: import("react").Context<VerticalNavType | null>;
+export declare const useVerticalNavType: () => VerticalNavType;
+//# sourceMappingURL=context.d.ts.map

package/VerticalNav/context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../src/VerticalNav/context.tsx"],"names":[],"mappings":"AAEA,MAAM,MAAM,eAAe,GAAG,MAAM,GAAG,MAAM,CAAC;AAE9C,eAAO,MAAM,sBAAsB,iDAElC,CAAC;AAEF,eAAO,MAAM,kBAAkB,uBAM9B,CAAC"}

package/VerticalNav/index.d.ts

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

package/VerticalNav/index.d.ts.map

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

package/VerticalNav/index.js

@@ -0,0 +1,293 @@
+"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));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const React = require("react");
+const Item$1 = require("../__chunks__/Item-CfWjPrxx.js");
+const utilities_css = require("../utilities/css.js");
+const Icon = require("../__chunks__/Icon-BlcrcY3U.js");
+const Text = require("../__chunks__/Text-C6DuTMMj.js");
+const useHover = require("../__chunks__/useHover-BIKwjrCT.js");
+const mergeProps = require("../__chunks__/mergeProps-DniMwM6P.js");
+const useListState = require("../__chunks__/useListState-I5rva0Fq.js");
+const ArrowForwardIos = require("../__chunks__/ArrowForwardIos-DpRiDPNZ.js");
+const UnstyledButton = require("../__chunks__/UnstyledButton-yd6ZL2Yi.js");
+const useTreeState = require("../__chunks__/useTreeState-D6aHf9kN.js");
+function Item(_props) {
+  return null;
+}
+const originalGetCollectionNode = Item$1.$c1d7fb2ec91bae71$export$6d08773d2e66f8f2.getCollectionNode;
+const getCollectionNode = (props, context) => originalGetCollectionNode(__spreadProps(__spreadValues({}, props), {
+  textValue: props.label
+}), context);
+Object.assign(Item, Item$1.$c1d7fb2ec91bae71$export$6d08773d2e66f8f2, {
+  getCollectionNode
+});
+const Container$1 = "_Container_12ahq_5";
+const banner = "_banner_12ahq_16";
+const logo = "_logo_12ahq_20";
+const nav = "_nav_12ahq_31";
+const supplementaryActionContainer = "_supplementaryActionContainer_12ahq_38";
+const styles$5 = {
+  Container: Container$1,
+  banner,
+  logo,
+  nav,
+  supplementaryActionContainer
+};
+function Container(props) {
+  const { renderBanner, renderLogo, supplementaryAction, ["aria-label"]: ariaLabel, ["aria-labelledby"]: ariaLabelledBy, ["aria-describedby"]: ariaDescribedBy, ["aria-details"]: ariaDetails, children } = props;
+  return React.createElement("div", {
+    className: styles$5.Container
+  }, renderBanner && React.createElement("div", {
+    className: styles$5.banner
+  }, renderBanner()), renderLogo && React.createElement("div", {
+    className: styles$5.logo
+  }, renderLogo()), React.createElement("nav", {
+    className: styles$5.nav,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": ariaDescribedBy,
+    "aria-details": ariaDetails
+  }, children), supplementaryAction && React.createElement("div", {
+    className: styles$5.supplementaryActionContainer
+  }, supplementaryAction));
+}
+const NavItem$1 = "_NavItem_46sju_5";
+const hovered$1 = "_hovered_46sju_12";
+const selectedTree = "_selectedTree_46sju_16";
+const selectedList = "_selectedList_46sju_20";
+const linkContainer = "_linkContainer_46sju_24";
+const link$1 = "_link_46sju_24";
+const navItemStyles = {
+  NavItem: NavItem$1,
+  hovered: hovered$1,
+  selectedTree,
+  selectedList,
+  linkContainer,
+  link: link$1
+};
+function NavItem(props) {
+  const { className: classNameFromParent, expansionSlot, isChildrenVisible, isExpanded, isSelected, item } = props;
+  const _a = item.props, { as: As = "a", children, icon, label, textValue: _textValue } = _a, linkProps = __objRest(_a, ["as", "children", "icon", "label", "textValue"]);
+  const { hoverProps, isHovered } = useHover.$6179b936705e76d3$export$ae780daf29e6d456({});
+  const className = utilities_css.classNames(navItemStyles.NavItem, isHovered && navItemStyles.hovered, classNameFromParent);
+  return React.createElement("div", {
+    className
+  }, React.createElement("div", {
+    className: navItemStyles.linkContainer
+  }, React.createElement(As, __spreadValues({
+    className: navItemStyles.link,
+    "aria-current": isSelected ? "true" : void 0,
+    "aria-expanded": isExpanded ? "true" : void 0
+  }, mergeProps.$3ef42575df84b30b$export$9d1611c77c2fe928(hoverProps, linkProps)), icon && React.createElement(Icon.Icon, {
+    symbol: icon
+  }), React.createElement(Text.Text, {
+    variant: "subtitle2"
+  }, label)), expansionSlot), children && isChildrenVisible && React.createElement(React.Fragment, null, item.rendered));
+}
+const VerticalNavTypeContext = React.createContext(null);
+const useVerticalNavType = () => {
+  const verticalNavTypeContext = React.useContext(VerticalNavTypeContext);
+  if (!verticalNavTypeContext) {
+    throw new Error("useVerticalNavType must be used within a VerticalNav");
+  }
+  return verticalNavTypeContext;
+};
+function ListVerticalNav(props) {
+  const _a = props, { selectedKey } = _a, listStateProps = __objRest(_a, ["selectedKey"]);
+  const state = useListState.$e72dd72e1c76a225$export$2f645645f7bca764(__spreadProps(__spreadValues({}, listStateProps), {
+    selectedKeys: selectedKey ? [selectedKey] : [],
+    selectionMode: "single"
+  }));
+  return React.createElement(VerticalNavTypeContext.Provider, {
+    value: "list"
+  }, React.createElement(Container, __spreadValues({}, props), [...state.collection].map((item) => React.createElement(ListNavItem, {
+    key: item.key,
+    item,
+    state
+  }))));
+}
+function ListNavItem({ item, state }) {
+  const isSelected = state.selectionManager.isSelected(item.key);
+  return React.createElement(NavItem, {
+    key: item.key,
+    item,
+    className: utilities_css.classNames(isSelected && navItemStyles[utilities_css.variationName("selected", "list")]),
+    isChildrenVisible: isSelected,
+    isSelected
+  });
+}
+const SubnavItemDot$1 = "_SubnavItemDot_11qm2_5";
+const cozy = "_cozy_11qm2_17";
+const visible = "_visible_11qm2_21";
+const styles$4 = {
+  SubnavItemDot: SubnavItemDot$1,
+  cozy,
+  visible
+};
+function SubnavItemDot({ isCozy, isVisible }) {
+  const className = utilities_css.classNames(styles$4.SubnavItemDot, isCozy && styles$4.cozy, isVisible && styles$4.visible);
+  return React.createElement("span", {
+    className
+  });
+}
+const SubnavItem$1 = "_SubnavItem_1m1m5_5";
+const link = "_link_1m1m5_11";
+const hovered = "_hovered_1m1m5_27";
+const selected = "_selected_1m1m5_31";
+const styles$3 = {
+  SubnavItem: SubnavItem$1,
+  link,
+  hovered,
+  selected
+};
+function SubnavItem(props) {
+  const { item, level, state } = props;
+  const type = useVerticalNavType();
+  const _a = item.props, { as: As = "a", label, icon, textValue: _textValue } = _a, linkProps = __objRest(_a, ["as", "label", "icon", "textValue"]);
+  const isSelected = state.selectionManager.isSelected(item.key);
+  const { hoverProps, isHovered } = useHover.$6179b936705e76d3$export$ae780daf29e6d456({});
+  const className = utilities_css.classNames(styles$3.SubnavItem, isSelected && styles$3.selected, isHovered && styles$3.hovered);
+  if (icon) {
+    throw new Error("icon is unsupported on <Subnav.Item />s");
+  }
+  return React.createElement("div", {
+    className
+  }, React.createElement(As, __spreadValues({
+    className: styles$3.link,
+    "aria-current": isSelected ? "true" : void 0
+  }, mergeProps.$3ef42575df84b30b$export$9d1611c77c2fe928(hoverProps, linkProps)), (type === "list" || level > 1) && React.createElement(SubnavItemDot, {
+    isCozy: type === "list",
+    isVisible: isSelected
+  }), React.createElement(Text.Text, {
+    variant: "body2",
+    weight: isSelected && level === 1 ? "medium" : "normal"
+  }, label)), item.props.children && item.rendered);
+}
+const Subnav$1 = "_Subnav_u8nh7_5";
+const styles$2 = {
+  Subnav: Subnav$1
+};
+const SubnavLevelContext = React.createContext(0);
+function Subnav(props) {
+  const _a = props, { selectedKey } = _a, listStateProps = __objRest(_a, ["selectedKey"]);
+  const levelContext = React.useContext(SubnavLevelContext);
+  const level = React.useMemo(() => levelContext + 1, [levelContext]);
+  const state = useListState.$e72dd72e1c76a225$export$2f645645f7bca764(__spreadProps(__spreadValues({}, listStateProps), {
+    selectedKeys: selectedKey ? [selectedKey] : [],
+    selectionMode: "single"
+  }));
+  return React.createElement(SubnavLevelContext.Provider, {
+    value: level
+  }, React.createElement("div", {
+    className: styles$2.Subnav
+  }, [...state.collection].map((item, i) => React.createElement(SubnavItem, {
+    key: String(i),
+    level,
+    state,
+    item
+  }))));
+}
+const SupplementaryAction$1 = "_SupplementaryAction_17maz_5";
+const styles$1 = {
+  SupplementaryAction: SupplementaryAction$1
+};
+const SupplementaryAction = React.forwardRef((props, ref) => {
+  const _a = props, { as: As = "button", children } = _a, elementProps = __objRest(_a, ["as", "children"]);
+  return React.createElement(As, __spreadValues({
+    ref,
+    className: styles$1.SupplementaryAction
+  }, elementProps), React.createElement(Text.Text, {
+    variant: "subtitle2"
+  }, children), React.createElement(Icon.Icon, {
+    symbol: ArrowForwardIos.ArrowForwardIos,
+    size: "xs"
+  }));
+});
+SupplementaryAction.displayName = "SupplementaryAction";
+const ExpandButton$1 = "_ExpandButton_5v1bv_5";
+const expanded = "_expanded_5v1bv_9";
+const styles = {
+  ExpandButton: ExpandButton$1,
+  expanded
+};
+function ExpandButton(_a) {
+  var _b = _a, { isExpanded } = _b, props = __objRest(_b, ["isExpanded"]);
+  return React.createElement(UnstyledButton.UnstyledButton, __spreadValues({
+    className: utilities_css.classNames(styles.ExpandButton, isExpanded && styles.expanded)
+  }, props), React.createElement(Icon.Icon, {
+    symbol: ArrowForwardIos.ArrowForwardIos,
+    size: "2xs"
+  }), React.createElement(Text.Text, {
+    visuallyHidden: true
+  }, "Expand"));
+}
+function TreeVerticalNav(props) {
+  const _a = props, { selectedKey } = _a, treeStateProps = __objRest(_a, ["selectedKey"]);
+  const state = useTreeState.$875d6693e12af071$export$728d6ba534403756(__spreadProps(__spreadValues({}, treeStateProps), {
+    selectedKeys: selectedKey ? [selectedKey] : [],
+    selectionMode: "single"
+  }));
+  return React.createElement(VerticalNavTypeContext.Provider, {
+    value: "tree"
+  }, React.createElement(Container, __spreadValues({}, props), [...state.collection].map((item) => React.createElement(TreeNavItem, {
+    key: item.key,
+    item,
+    state
+  }))));
+}
+function TreeNavItem({ item, state }) {
+  const isSelected = state.selectionManager.isSelected(item.key);
+  const isExpanded = state.expandedKeys.has(item.key);
+  return React.createElement(NavItem, {
+    item,
+    className: utilities_css.classNames(isSelected && navItemStyles[utilities_css.variationName("selected", "tree")]),
+    isChildrenVisible: isExpanded,
+    isSelected,
+    isExpanded,
+    expansionSlot: item.props.children && React.createElement(ExpandButton, {
+      isExpanded,
+      onPress: () => {
+        state.toggleKey(item.key);
+      }
+    })
+  });
+}
+function VerticalNav(props) {
+  return React.createElement(ListVerticalNav, __spreadValues({}, props));
+}
+VerticalNav.Item = Item;
+VerticalNav.Subnav = Subnav;
+VerticalNav.SupplementaryAction = SupplementaryAction;
+exports.ExpandableVerticalNav = TreeVerticalNav;
+exports.VerticalNav = VerticalNav;

package/VerticalNav/index.mjs

@@ -0,0 +1,293 @@
+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));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import React__default, { createContext, useContext, useMemo, forwardRef } from "react";
+import { $ as $c1d7fb2ec91bae71$export$6d08773d2e66f8f2 } from "../__chunks__/Item-BhrTPNN2.mjs";
+import { classNames, variationName } from "../utilities/css.mjs";
+import { I as Icon } from "../__chunks__/Icon-CQ73-QIg.mjs";
+import { T as Text } from "../__chunks__/Text-BY4p1xZ-.mjs";
+import { $ as $6179b936705e76d3$export$ae780daf29e6d456 } from "../__chunks__/useHover-BOYR4wqI.mjs";
+import { $ as $3ef42575df84b30b$export$9d1611c77c2fe928 } from "../__chunks__/mergeProps-DSi85raC.mjs";
+import { $ as $e72dd72e1c76a225$export$2f645645f7bca764 } from "../__chunks__/useListState-AFrlkW73.mjs";
+import { A as ArrowForwardIos } from "../__chunks__/ArrowForwardIos-DSeLeLhY.mjs";
+import { U as UnstyledButton } from "../__chunks__/UnstyledButton-D_DzFe67.mjs";
+import { $ as $875d6693e12af071$export$728d6ba534403756 } from "../__chunks__/useTreeState-w_raYfy2.mjs";
+function Item(_props) {
+  return null;
+}
+const originalGetCollectionNode = $c1d7fb2ec91bae71$export$6d08773d2e66f8f2.getCollectionNode;
+const getCollectionNode = (props, context) => originalGetCollectionNode(__spreadProps(__spreadValues({}, props), {
+  textValue: props.label
+}), context);
+Object.assign(Item, $c1d7fb2ec91bae71$export$6d08773d2e66f8f2, {
+  getCollectionNode
+});
+const Container$1 = "_Container_12ahq_5";
+const banner = "_banner_12ahq_16";
+const logo = "_logo_12ahq_20";
+const nav = "_nav_12ahq_31";
+const supplementaryActionContainer = "_supplementaryActionContainer_12ahq_38";
+const styles$5 = {
+  Container: Container$1,
+  banner,
+  logo,
+  nav,
+  supplementaryActionContainer
+};
+function Container(props) {
+  const { renderBanner, renderLogo, supplementaryAction, ["aria-label"]: ariaLabel, ["aria-labelledby"]: ariaLabelledBy, ["aria-describedby"]: ariaDescribedBy, ["aria-details"]: ariaDetails, children } = props;
+  return React__default.createElement("div", {
+    className: styles$5.Container
+  }, renderBanner && React__default.createElement("div", {
+    className: styles$5.banner
+  }, renderBanner()), renderLogo && React__default.createElement("div", {
+    className: styles$5.logo
+  }, renderLogo()), React__default.createElement("nav", {
+    className: styles$5.nav,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": ariaDescribedBy,
+    "aria-details": ariaDetails
+  }, children), supplementaryAction && React__default.createElement("div", {
+    className: styles$5.supplementaryActionContainer
+  }, supplementaryAction));
+}
+const NavItem$1 = "_NavItem_46sju_5";
+const hovered$1 = "_hovered_46sju_12";
+const selectedTree = "_selectedTree_46sju_16";
+const selectedList = "_selectedList_46sju_20";
+const linkContainer = "_linkContainer_46sju_24";
+const link$1 = "_link_46sju_24";
+const navItemStyles = {
+  NavItem: NavItem$1,
+  hovered: hovered$1,
+  selectedTree,
+  selectedList,
+  linkContainer,
+  link: link$1
+};
+function NavItem(props) {
+  const { className: classNameFromParent, expansionSlot, isChildrenVisible, isExpanded, isSelected, item } = props;
+  const _a = item.props, { as: As = "a", children, icon, label, textValue: _textValue } = _a, linkProps = __objRest(_a, ["as", "children", "icon", "label", "textValue"]);
+  const { hoverProps, isHovered } = $6179b936705e76d3$export$ae780daf29e6d456({});
+  const className = classNames(navItemStyles.NavItem, isHovered && navItemStyles.hovered, classNameFromParent);
+  return React__default.createElement("div", {
+    className
+  }, React__default.createElement("div", {
+    className: navItemStyles.linkContainer
+  }, React__default.createElement(As, __spreadValues({
+    className: navItemStyles.link,
+    "aria-current": isSelected ? "true" : void 0,
+    "aria-expanded": isExpanded ? "true" : void 0
+  }, $3ef42575df84b30b$export$9d1611c77c2fe928(hoverProps, linkProps)), icon && React__default.createElement(Icon, {
+    symbol: icon
+  }), React__default.createElement(Text, {
+    variant: "subtitle2"
+  }, label)), expansionSlot), children && isChildrenVisible && React__default.createElement(React__default.Fragment, null, item.rendered));
+}
+const VerticalNavTypeContext = createContext(null);
+const useVerticalNavType = () => {
+  const verticalNavTypeContext = useContext(VerticalNavTypeContext);
+  if (!verticalNavTypeContext) {
+    throw new Error("useVerticalNavType must be used within a VerticalNav");
+  }
+  return verticalNavTypeContext;
+};
+function ListVerticalNav(props) {
+  const _a = props, { selectedKey } = _a, listStateProps = __objRest(_a, ["selectedKey"]);
+  const state = $e72dd72e1c76a225$export$2f645645f7bca764(__spreadProps(__spreadValues({}, listStateProps), {
+    selectedKeys: selectedKey ? [selectedKey] : [],
+    selectionMode: "single"
+  }));
+  return React__default.createElement(VerticalNavTypeContext.Provider, {
+    value: "list"
+  }, React__default.createElement(Container, __spreadValues({}, props), [...state.collection].map((item) => React__default.createElement(ListNavItem, {
+    key: item.key,
+    item,
+    state
+  }))));
+}
+function ListNavItem({ item, state }) {
+  const isSelected = state.selectionManager.isSelected(item.key);
+  return React__default.createElement(NavItem, {
+    key: item.key,
+    item,
+    className: classNames(isSelected && navItemStyles[variationName("selected", "list")]),
+    isChildrenVisible: isSelected,
+    isSelected
+  });
+}
+const SubnavItemDot$1 = "_SubnavItemDot_11qm2_5";
+const cozy = "_cozy_11qm2_17";
+const visible = "_visible_11qm2_21";
+const styles$4 = {
+  SubnavItemDot: SubnavItemDot$1,
+  cozy,
+  visible
+};
+function SubnavItemDot({ isCozy, isVisible }) {
+  const className = classNames(styles$4.SubnavItemDot, isCozy && styles$4.cozy, isVisible && styles$4.visible);
+  return React__default.createElement("span", {
+    className
+  });
+}
+const SubnavItem$1 = "_SubnavItem_1m1m5_5";
+const link = "_link_1m1m5_11";
+const hovered = "_hovered_1m1m5_27";
+const selected = "_selected_1m1m5_31";
+const styles$3 = {
+  SubnavItem: SubnavItem$1,
+  link,
+  hovered,
+  selected
+};
+function SubnavItem(props) {
+  const { item, level, state } = props;
+  const type = useVerticalNavType();
+  const _a = item.props, { as: As = "a", label, icon, textValue: _textValue } = _a, linkProps = __objRest(_a, ["as", "label", "icon", "textValue"]);
+  const isSelected = state.selectionManager.isSelected(item.key);
+  const { hoverProps, isHovered } = $6179b936705e76d3$export$ae780daf29e6d456({});
+  const className = classNames(styles$3.SubnavItem, isSelected && styles$3.selected, isHovered && styles$3.hovered);
+  if (icon) {
+    throw new Error("icon is unsupported on <Subnav.Item />s");
+  }
+  return React__default.createElement("div", {
+    className
+  }, React__default.createElement(As, __spreadValues({
+    className: styles$3.link,
+    "aria-current": isSelected ? "true" : void 0
+  }, $3ef42575df84b30b$export$9d1611c77c2fe928(hoverProps, linkProps)), (type === "list" || level > 1) && React__default.createElement(SubnavItemDot, {
+    isCozy: type === "list",
+    isVisible: isSelected
+  }), React__default.createElement(Text, {
+    variant: "body2",
+    weight: isSelected && level === 1 ? "medium" : "normal"
+  }, label)), item.props.children && item.rendered);
+}
+const Subnav$1 = "_Subnav_u8nh7_5";
+const styles$2 = {
+  Subnav: Subnav$1
+};
+const SubnavLevelContext = createContext(0);
+function Subnav(props) {
+  const _a = props, { selectedKey } = _a, listStateProps = __objRest(_a, ["selectedKey"]);
+  const levelContext = useContext(SubnavLevelContext);
+  const level = useMemo(() => levelContext + 1, [levelContext]);
+  const state = $e72dd72e1c76a225$export$2f645645f7bca764(__spreadProps(__spreadValues({}, listStateProps), {
+    selectedKeys: selectedKey ? [selectedKey] : [],
+    selectionMode: "single"
+  }));
+  return React__default.createElement(SubnavLevelContext.Provider, {
+    value: level
+  }, React__default.createElement("div", {
+    className: styles$2.Subnav
+  }, [...state.collection].map((item, i) => React__default.createElement(SubnavItem, {
+    key: String(i),
+    level,
+    state,
+    item
+  }))));
+}
+const SupplementaryAction$1 = "_SupplementaryAction_17maz_5";
+const styles$1 = {
+  SupplementaryAction: SupplementaryAction$1
+};
+const SupplementaryAction = forwardRef((props, ref) => {
+  const _a = props, { as: As = "button", children } = _a, elementProps = __objRest(_a, ["as", "children"]);
+  return React__default.createElement(As, __spreadValues({
+    ref,
+    className: styles$1.SupplementaryAction
+  }, elementProps), React__default.createElement(Text, {
+    variant: "subtitle2"
+  }, children), React__default.createElement(Icon, {
+    symbol: ArrowForwardIos,
+    size: "xs"
+  }));
+});
+SupplementaryAction.displayName = "SupplementaryAction";
+const ExpandButton$1 = "_ExpandButton_5v1bv_5";
+const expanded = "_expanded_5v1bv_9";
+const styles = {
+  ExpandButton: ExpandButton$1,
+  expanded
+};
+function ExpandButton(_a) {
+  var _b = _a, { isExpanded } = _b, props = __objRest(_b, ["isExpanded"]);
+  return React__default.createElement(UnstyledButton, __spreadValues({
+    className: classNames(styles.ExpandButton, isExpanded && styles.expanded)
+  }, props), React__default.createElement(Icon, {
+    symbol: ArrowForwardIos,
+    size: "2xs"
+  }), React__default.createElement(Text, {
+    visuallyHidden: true
+  }, "Expand"));
+}
+function TreeVerticalNav(props) {
+  const _a = props, { selectedKey } = _a, treeStateProps = __objRest(_a, ["selectedKey"]);
+  const state = $875d6693e12af071$export$728d6ba534403756(__spreadProps(__spreadValues({}, treeStateProps), {
+    selectedKeys: selectedKey ? [selectedKey] : [],
+    selectionMode: "single"
+  }));
+  return React__default.createElement(VerticalNavTypeContext.Provider, {
+    value: "tree"
+  }, React__default.createElement(Container, __spreadValues({}, props), [...state.collection].map((item) => React__default.createElement(TreeNavItem, {
+    key: item.key,
+    item,
+    state
+  }))));
+}
+function TreeNavItem({ item, state }) {
+  const isSelected = state.selectionManager.isSelected(item.key);
+  const isExpanded = state.expandedKeys.has(item.key);
+  return React__default.createElement(NavItem, {
+    item,
+    className: classNames(isSelected && navItemStyles[variationName("selected", "tree")]),
+    isChildrenVisible: isExpanded,
+    isSelected,
+    isExpanded,
+    expansionSlot: item.props.children && React__default.createElement(ExpandButton, {
+      isExpanded,
+      onPress: () => {
+        state.toggleKey(item.key);
+      }
+    })
+  });
+}
+function VerticalNav(props) {
+  return React__default.createElement(ListVerticalNav, __spreadValues({}, props));
+}
+VerticalNav.Item = Item;
+VerticalNav.Subnav = Subnav;
+VerticalNav.SupplementaryAction = SupplementaryAction;
+export {
+  TreeVerticalNav as ExpandableVerticalNav,
+  VerticalNav
+};

package/VerticalStack/VerticalStack.d.ts

@@ -1,14 +1,13 @@
-import React, { ReactNode } from "react";
+import React, { ElementType, ReactNode } from "react";
 import { ResponsiveSpaceScale } from "../types";
 export type Align = "start" | "center" | "end" | "space-around" | "space-between" | "space-evenly";
 export type InlineAlign = "start" | "center" | "end" | "baseline" | "stretch";
-export type Element = "div" | "ul" | "ol" | "fieldset";
 export type VerticalStackProps = {
     /**
      * HTML Element type
      * @default 'div'
      */
-    as?: Element;
+    as?: ElementType;
     /** Vertical alignment of children */
     align?: Align;
     /** Contents of the vertical stack. */

package/VerticalStack/VerticalStack.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VerticalStack.d.ts","sourceRoot":"","sources":["../../src/VerticalStack/VerticalStack.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAc,MAAM,OAAO,CAAC;AACrD,OAAO,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAUhD,MAAM,MAAM,KAAK,GACb,OAAO,GACP,QAAQ,GACR,KAAK,GACL,cAAc,GACd,eAAe,GACf,cAAc,CAAC;AACnB,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,UAAU,GAAG,SAAS,CAAC;AAC9E,MAAM,MAAM,OAAO,GAAG,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,UAAU,CAAC;AAEvD,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;;OAGG;IACH,EAAE,CAAC,EAAE,OAAO,CAAC;IAEb,qCAAqC;IACrC,KAAK,CAAC,EAAE,KAAK,CAAC;IAEd,sCAAsC;IACtC,QAAQ,EAAE,SAAS,CAAC;IAEpB,mCAAmC;IACnC,GAAG,CAAC,EAAE,oBAAoB,CAAC;IAE3B,0EAA0E;IAC1E,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB,uCAAuC;IACvC,WAAW,CAAC,EAAE,WAAW,CAAC;IAE1B;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC;AAEF;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,aAAa,iFA8CzB,CAAC"}
+{"version":3,"file":"VerticalStack.d.ts","sourceRoot":"","sources":["../../src/VerticalStack/VerticalStack.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAc,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAUhD,MAAM,MAAM,KAAK,GACb,OAAO,GACP,QAAQ,GACR,KAAK,GACL,cAAc,GACd,eAAe,GACf,cAAc,CAAC;AACnB,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,UAAU,GAAG,SAAS,CAAC;AAE9E,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;;OAGG;IACH,EAAE,CAAC,EAAE,WAAW,CAAC;IAEjB,qCAAqC;IACrC,KAAK,CAAC,EAAE,KAAK,CAAC;IAEd,sCAAsC;IACtC,QAAQ,EAAE,SAAS,CAAC;IAEpB,mCAAmC;IACnC,GAAG,CAAC,EAAE,oBAAoB,CAAC;IAE3B,0EAA0E;IAC1E,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB,uCAAuC;IACvC,WAAW,CAAC,EAAE,WAAW,CAAC;IAE1B;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC;AAEF;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,aAAa,iFA8CzB,CAAC"}