braid-design-system 32.5.0 → 32.7.0

package/dist/{Toggle.chunk.mjs → index.chunk.mjs}

@@ -1,41 +1,41 @@
-import { useThemeName, useResponsiveValue, Stack, Box, buildDataAttributes, Divider, useIcon, virtualTouchable, Columns, Column, Inline, Text, Overlay, ActionsContext, useBackground, iconContainerSize, IconClear, IconPositive, IconCritical, TextContext, HeadingContext, useBackgroundLightness, textStyles, FieldOverlay, ButtonIcon, Bleed, useColoredBoxClasses, BackgroundProvider, ButtonContainer, useButtonStyles, ButtonOverlays, ButtonText, resolveResponsiveRangeProps, optimizeResponsiveArray, Typography, BraidPortal, TextLinkButton, AvoidWidowIcon, useDefaultTextProps, flattenChildren, DefaultTextPropsProvider, iconSize, Hidden, useSpace, negativeMargin, resolveResponsiveProp } from "./ToastContext.chunk.mjs";
 import { useBraidTheme, useLinkComponent } from "./side-effects/lib/components/BraidProvider/BraidProvider.mjs";
+import { useThemeName, useResponsiveValue, Stack, Box, buildDataAttributes, Divider, useIcon, virtualTouchable, Columns, Column, Inline, Text, Overlay, ActionsContext, useBackground, iconContainerSize, IconClear, IconPositive, IconCritical, TextContext, HeadingContext, useBackgroundLightness, textStyles, FieldOverlay, ButtonIcon, Bleed, useColoredBoxClasses, BackgroundProvider, ButtonContainer, useButtonStyles, ButtonOverlays, ButtonText, resolveResponsiveRangeProps, optimizeResponsiveArray, Typography, ContentBlock, BraidPortal, TextLinkButton, AvoidWidowIcon, useDefaultTextProps, flattenChildren, DefaultTextPropsProvider, iconSize, Hidden, useSpace, negativeMargin, resolveResponsiveProp } from "./ToastContext.chunk.mjs";
 import { jsx, jsxs, Fragment as Fragment$1 } from "react/jsx-runtime";
 import assert from "assert";
 import { createContext, useMemo, useState, useContext, cloneElement, useEffect, Fragment, forwardRef, useCallback, useRef, useReducer, Children, createRef } from "react";
 import { normalizeResponsiveValue, mapResponsiveValue } from "./styles/lib/css/atoms/sprinkles.css.mjs";
-import { root, rotate, flip, mirror } from "./styles/lib/components/icons/IconArrow/IconArrow.css.mjs";
-import { root as root$2, down } from "./styles/lib/components/icons/IconThumb/IconThumb.css.mjs";
 import { button, focusRing } from "./styles/lib/components/Accordion/AccordionItem.css.mjs";
+import { root as root$1, up, left, right } from "./styles/lib/components/icons/IconChevron/IconChevron.css.mjs";
 import { hideFocusRingsClassName } from "./styles/lib/components/private/hideFocusRings/hideFocusRings.css.mjs";
 import { textAlignedToIcon } from "./styles/lib/css/textAlignedToIcon.css.mjs";
 import { closeButton, closeButtonFocus, closeButtonHover } from "./styles/lib/components/Alert/Alert.css.mjs";
 import dedent from "dedent";
 import parseHighlights from "autosuggest-highlight/parse/index.js";
+import { fontWeight, tone, touchableText, fontFamily, headingWeight, heading } from "./styles/lib/css/typography.css.mjs";
 import { root as root$3 } from "./styles/lib/components/HiddenVisually/HiddenVisually.css.mjs";
 import { createPortal } from "react-dom";
 import { atoms } from "./styles/lib/css/atoms/atoms.mjs";
-import { fontWeight, tone, touchableText, fontFamily, headingWeight, heading } from "./styles/lib/css/typography.css.mjs";
+import clsx from "clsx";
+import { secondaryIconSpace, field, placeholderColor, iconSpace, verticalDivider, hideBorderOnDarkBackgroundInLightMode, focusOverlay, hoverOverlay } from "./styles/lib/components/private/Field/Field.css.mjs";
 import { RemoveScroll } from "react-remove-scroll";
 import { backdrop, backdropVisible, menu, groupHeading } from "./styles/lib/components/Autosuggest/Autosuggest.css.mjs";
 import matchHighlights from "autosuggest-highlight/match/index.js";
-import clsx from "clsx";
 import { noRadiusOnRight, largestWidth, width, tone as tone$1, lightMode, darkMode } from "./styles/lib/components/private/Keyline/Keyline.css.mjs";
+import { realField, sizeVars, isMixed, fakeField, hideBorderOnDarkBackgroundInLightMode as hideBorderOnDarkBackgroundInLightMode$1, selected, focusOverlay as focusOverlay$1, hoverOverlay as hoverOverlay$1, checkboxIndicator, radioIndicator, labelOffset, children } from "./styles/lib/components/private/InlineField/InlineField.css.mjs";
 import FocusLock from "react-focus-lock";
 import { externalGutter } from "./styles/lib/components/private/Modal/ModalExternalGutter.mjs";
 import { headingRoot, headingFocus, pointerEventsAll, maxSize, closeIconOffset, resetStackingContext, backdrop as backdrop$1, horiztontalTransition, modalContainer, entrance, exit, fixedStackingContext } from "./styles/lib/components/private/Modal/Modal.css.mjs";
+import { field as field$1 } from "./styles/lib/components/Dropdown/Dropdown.css.mjs";
 import { lineHeightContainer } from "./styles/lib/css/lineHeightContainer.css.mjs";
 import { currentColor, size, minCharacterWidth, trimGutter } from "./styles/lib/components/List/List.css.mjs";
 import { rootSize, delay, size as size$1, currentColor as currentColor$1, circle } from "./styles/lib/components/Loader/Loader.css.mjs";
-import { checkboxSize } from "./styles/lib/components/MenuItemCheckbox/MenuItemCheckbox.css.mjs";
-import { menuItem } from "./styles/lib/components/MenuItem/useMenuItem.css.mjs";
 import { backdrop as backdrop$2, menuIsClosed, width as width$1, placementBottom } from "./styles/lib/components/MenuRenderer/MenuRenderer.css.mjs";
+import { menuItem } from "./styles/lib/components/MenuItem/useMenuItem.css.mjs";
+import { checkboxSize } from "./styles/lib/components/MenuItemCheckbox/MenuItemCheckbox.css.mjs";
 import { triggerOffset } from "./styles/lib/components/OverflowMenu/OverflowMenu.css.mjs";
 import { isMobile } from "is-mobile";
-import { field as field$1 } from "./styles/lib/components/Dropdown/Dropdown.css.mjs";
 import { nativeInput } from "./styles/lib/components/MonthPicker/MonthPicker.css.mjs";
 import { hover, background, current, lightModeCurrentKeyline, darkModeCurrentKeyline } from "./styles/lib/components/Pagination/Pagination.css.mjs";
-import { realField, sizeVars, isMixed, fakeField, hideBorderOnDarkBackgroundInLightMode as hideBorderOnDarkBackgroundInLightMode$1, selected, focusOverlay as focusOverlay$1, hoverOverlay as hoverOverlay$1, checkboxIndicator, radioIndicator, labelOffset, children } from "./styles/lib/components/private/InlineField/InlineField.css.mjs";
 import { starSpacing, textSpacing, lightModeStarColor, darkModeStarColor } from "./styles/lib/components/Rating/Rating.css.mjs";
 import { step, tone as tone$2, progressTrack, progressTrackCentered, progressLine, progressUnfilled, indicatorContainer, focusOverlay as focusOverlay$2, indicator, highlight, complete, active, inner, tick, stretch, stretchLastAboveTablet } from "./styles/lib/components/Stepper/Stepper.css.mjs";
 import { tab, cropToIconX, hoveredTab, tabFocusRing, scroll as scroll$1, nowrap, mask, marginAuto, divider, tabUnderline, tabUnderlineActiveDarkMode, underlineLeft, underlineWidth, tabPanel, tabPanelFocusRing } from "./styles/lib/components/Tabs/Tabs.css.mjs";
@@ -44,10 +44,10 @@ import { clearGutter } from "./styles/lib/components/Tag/Tag.css.mjs";
 import { root as root$4, caution, critical } from "./styles/lib/components/Textarea/Highlight/Highlight.css.mjs";
 import { highlights, field as field$2 } from "./styles/lib/components/Textarea/Textarea.css.mjs";
 import { select, focusOverlay as focusOverlay$3 } from "./styles/lib/components/TextDropdown/TextDropdown.css.mjs";
-import { root as root$1, up, left, right } from "./styles/lib/components/icons/IconChevron/IconChevron.css.mjs";
-import { secondaryIconSpace, field, placeholderColor, iconSpace, verticalDivider, hideBorderOnDarkBackgroundInLightMode, focusOverlay, hoverOverlay } from "./styles/lib/components/private/Field/Field.css.mjs";
 import { columnsWide, columnsDesktop, columnsTablet, columnsMobile } from "./styles/lib/components/Tiles/Tiles.css.mjs";
 import { root as root$5, realField as realField$1, realFieldPosition, fieldSize, slideContainer, slideContainerSize, slideTrack, slideTrackMask, slideTrackBgLightMode, slideTrackBgDarkMode, slideTrackSelected, slider, hideBorderOnDarkBackgroundInLightMode as hideBorderOnDarkBackgroundInLightMode$2, icon as icon$1, focusOverlay as focusOverlay$4, hoverOverlay as hoverOverlay$2, label } from "./styles/lib/components/Toggle/Toggle.css.mjs";
+import { root, rotate, flip, mirror } from "./styles/lib/components/icons/IconArrow/IconArrow.css.mjs";
+import { root as root$2, down } from "./styles/lib/components/icons/IconThumb/IconThumb.css.mjs";
 const ThemeNameConsumer = ({ children: children2 }) => children2(useThemeName());
 const useColor = () => useBraidTheme().color;
 const useBreakpoint = () => {
@@ -953,6 +953,37 @@ const IconMail = (props) => {
   const iconProps = useIcon(props);
   return /* @__PURE__ */ jsx(Box, { component: IconMailSvg, ...iconProps });
 };
+const IconMessageSvg = ({ title, titleId, ...props }) => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 16,
+    height: 16,
+    viewBox: "0 0 24 24",
+    focusable: "false",
+    fill: "currentColor",
+    "aria-labelledby": titleId,
+    ...props,
+    children: [
+      title ? /* @__PURE__ */ jsx("title", { id: titleId, children: title }) : null,
+      /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M12 3a9 9 0 0 0-7.605 13.815L3 21l4.909-.982A9 9 0 1 0 12 3Z",
+          fill: "none",
+          stroke: "currentColor",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: 2
+        }
+      )
+    ]
+  }
+);
+const IconMessage = (props) => {
+  const iconProps = useIcon(props);
+  return /* @__PURE__ */ jsx(Box, { component: IconMessageSvg, ...iconProps });
+};
 const IconMinusSvg = ({ title, titleId, ...props }) => /* @__PURE__ */ jsxs(
   "svg",
   {
@@ -4262,35 +4293,68 @@ const Heading = ({
     ]
   }
 ) });
-const modalPadding = ["gutter", "large"];
+const validPageBlockComponents = [
+  "div",
+  "article",
+  "aside",
+  "main",
+  "section",
+  "nav"
+];
+const gutters = { mobile: "xsmall", tablet: "gutter" };
+const PageBlock = ({
+  children: children2,
+  width: width2 = "large",
+  component: componentProp,
+  data,
+  ...restProps
+}) => {
+  const component = componentProp && validPageBlockComponents.includes(componentProp) ? componentProp : "div";
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      component,
+      paddingX: gutters,
+      ...buildDataAttributes({ data, validateRestProps: restProps }),
+      children: /* @__PURE__ */ jsx(ContentBlock, { width: width2, children: children2 })
+    }
+  );
+};
+const modalPadding = { mobile: "gutter", tablet: "large" };
 const ModalContentHeader = forwardRef(
-  ({ title, headingLevel, description, descriptionId, center }, ref) => /* @__PURE__ */ jsxs(Stack, { space: "small", children: [
-    /* @__PURE__ */ jsx(Heading, { level: headingLevel, align: center ? "center" : void 0, children: /* @__PURE__ */ jsxs(
-      Box,
-      {
-        ref,
-        component: "span",
-        tabIndex: -1,
-        outline: "none",
-        position: "relative",
-        className: headingRoot,
-        children: [
-          title,
-          /* @__PURE__ */ jsx(
-            Overlay,
-            {
-              boxShadow: "outlineFocus",
-              borderRadius: "standard",
-              transition: "fast",
-              className: headingFocus,
-              onlyVisibleForKeyboardNavigation: true
-            }
-          )
-        ]
-      }
-    ) }),
-    description ? /* @__PURE__ */ jsx(Box, { id: descriptionId, children: description }) : null
-  ] })
+  ({ title, headingLevel, description, descriptionId, center }, ref) => /* @__PURE__ */ jsxs(
+    Stack,
+    {
+      space: headingLevel === "2" ? { mobile: "small", tablet: "medium" } : "small",
+      children: [
+        /* @__PURE__ */ jsx(Heading, { level: headingLevel, align: center ? "center" : void 0, children: /* @__PURE__ */ jsxs(
+          Box,
+          {
+            ref,
+            component: "span",
+            tabIndex: -1,
+            outline: "none",
+            position: "relative",
+            className: headingRoot,
+            children: [
+              title,
+              /* @__PURE__ */ jsx(
+                Overlay,
+                {
+                  boxShadow: "outlineFocus",
+                  borderRadius: "standard",
+                  transition: "fast",
+                  className: headingFocus,
+                  onlyVisibleForKeyboardNavigation: true
+                }
+              )
+            ]
+          }
+        ) }),
+        description ? /* @__PURE__ */ jsx(Box, { id: descriptionId, children: description }) : null
+      ]
+    }
+  )
 );
 const ModalContent = ({
   id,
@@ -4358,7 +4422,8 @@ const ModalContent = ({
                 boxShadow: "large",
                 width: width2 !== "content" ? "full" : void 0,
                 height: position === "right" || position === "left" ? "full" : void 0,
-                padding: modalPadding,
+                paddingY: modalPadding,
+                paddingX: position !== "center" ? gutters : modalPadding,
                 className: [
                   pointerEventsAll,
                   position === "center" && maxSize[position]
@@ -4407,15 +4472,14 @@ const ModalContent = ({
                 display: "flex",
                 justifyContent: "flexEnd",
                 paddingTop: modalPadding,
-                paddingRight: modalPadding,
+                paddingRight: position !== "center" ? gutters : modalPadding,
                 className: position === "center" && maxSize[position],
-                children: /* @__PURE__ */ jsx(Bleed, { space: "xsmall", children: /* @__PURE__ */ jsx(
+                children: /* @__PURE__ */ jsx(
                   Box,
                   {
                     position: "relative",
                     background: "surface",
                     borderRadius: "full",
-                    padding: "xsmall",
                     className: [closeIconOffset, pointerEventsAll],
                     children: /* @__PURE__ */ jsx(
                       ButtonIcon,
@@ -4430,7 +4494,7 @@ const ModalContent = ({
                       }
                     )
                   }
-                ) })
+                )
               }
             )
           ]
@@ -4523,24 +4587,28 @@ const Modal = ({
   const closeHandlerRef = useRef(onClose);
   const initiateClose = () => {
     if (allowClose) {
-      dispatch(CLOSE_MODAL);
+      const result = closeHandlerRef.current(false);
+      if (result === false) {
+        return result;
+      }
+      if (openRef.current) {
+        dispatch(CLOSE_MODAL);
+      }
     }
   };
   useEffect(() => {
     openRef.current = open;
     dispatch(open ? OPEN_MODAL : CLOSE_MODAL);
   }, [open]);
+  const closing = state === CLOSING;
   useEffect(() => {
-    if (state === CLOSING) {
+    if (closing) {
       const timer = setTimeout(() => {
         dispatch(ANIMATION_COMPLETE);
       }, ANIMATION_DURATION);
       return () => clearTimeout(timer);
     }
-    if (state === CLOSED && openRef.current) {
-      closeHandlerRef.current(false);
-    }
-  }, [state]);
+  }, [closing]);
   const shouldAriaHideOthers = state === OPEN || state === CLOSING;
   useEffect(() => {
     if (shouldAriaHideOthers && modalRef.current) {
@@ -4607,7 +4675,7 @@ const Modal = ({
             padding: position === "center" ? externalGutter : void 0,
             className: [
               modalContainer,
-              position === "left" || position === "right" && horiztontalTransition,
+              (position === "left" || position === "right") && horiztontalTransition,
               state === OPENING && entrance[position],
               state === CLOSING && position in exit && exit[position]
             ],
@@ -8156,6 +8224,7 @@ export {
   IconList,
   IconLocation,
   IconMail,
+  IconMessage,
   IconMinus,
   IconMobile,
   IconMoney,
@@ -8213,6 +8282,7 @@ export {
   MonthPicker,
   Notice,
   OverflowMenu,
+  PageBlock,
   Pagination,
   PasswordField,
   Radio,

package/dist/index.cjs

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const sideEffects_lib_components_BraidProvider_BraidProvider_cjs = require("./side-effects/lib/components/BraidProvider/BraidProvider.cjs");
 const ToastContext = require("./ToastContext.chunk.cjs");
-const Toggle = require("./Toggle.chunk.cjs");
+const index = require("./index.chunk.cjs");
 exports.BraidProvider = sideEffects_lib_components_BraidProvider_BraidProvider_cjs.BraidProvider;
 exports.makeLinkComponent = sideEffects_lib_components_BraidProvider_BraidProvider_cjs.makeLinkComponent;
 exports.Bleed = ToastContext.Bleed;
@@ -30,137 +30,139 @@ exports.useResponsiveValue = ToastContext.useResponsiveValue;
 exports.useSpace = ToastContext.useSpace;
 exports.useThemeName = ToastContext.useThemeName;
 exports.useToast = ToastContext.useToast;
-exports.Accordion = Toggle.Accordion;
-exports.AccordionItem = Toggle.AccordionItem;
-exports.Actions = Toggle.Actions;
-exports.Alert = Toggle.Alert;
-exports.Autosuggest = Toggle.Autosuggest;
-exports.Badge = Toggle.Badge;
-exports.BoxRenderer = Toggle.BoxRenderer;
-exports.ButtonLink = Toggle.ButtonLink;
-exports.Card = Toggle.Card;
-exports.Checkbox = Toggle.Checkbox;
-exports.CheckboxStandalone = Toggle.CheckboxStandalone;
-exports.Dialog = Toggle.Dialog;
-exports.Disclosure = Toggle.Disclosure;
-exports.Drawer = Toggle.Drawer;
-exports.Dropdown = Toggle.Dropdown;
-exports.FieldLabel = Toggle.FieldLabel;
-exports.FieldMessage = Toggle.FieldMessage;
-exports.Heading = Toggle.Heading;
-exports.HiddenVisually = Toggle.HiddenVisually;
-exports.IconAdd = Toggle.IconAdd;
-exports.IconArrow = Toggle.IconArrow;
-exports.IconBookmark = Toggle.IconBookmark;
-exports.IconCaution = Toggle.IconCaution;
-exports.IconChevron = Toggle.IconChevron;
-exports.IconCompany = Toggle.IconCompany;
-exports.IconCompose = Toggle.IconCompose;
-exports.IconCopy = Toggle.IconCopy;
-exports.IconCreditCard = Toggle.IconCreditCard;
-exports.IconDate = Toggle.IconDate;
-exports.IconDelete = Toggle.IconDelete;
-exports.IconDesktop = Toggle.IconDesktop;
-exports.IconDocument = Toggle.IconDocument;
-exports.IconDocumentBroken = Toggle.IconDocumentBroken;
-exports.IconDownload = Toggle.IconDownload;
-exports.IconEdit = Toggle.IconEdit;
-exports.IconEducation = Toggle.IconEducation;
-exports.IconFilter = Toggle.IconFilter;
-exports.IconFlag = Toggle.IconFlag;
-exports.IconGrid = Toggle.IconGrid;
-exports.IconHeart = Toggle.IconHeart;
-exports.IconHelp = Toggle.IconHelp;
-exports.IconHistory = Toggle.IconHistory;
-exports.IconHome = Toggle.IconHome;
-exports.IconImage = Toggle.IconImage;
-exports.IconInfo = Toggle.IconInfo;
-exports.IconInvoice = Toggle.IconInvoice;
-exports.IconLanguage = Toggle.IconLanguage;
-exports.IconLink = Toggle.IconLink;
-exports.IconLinkBroken = Toggle.IconLinkBroken;
-exports.IconList = Toggle.IconList;
-exports.IconLocation = Toggle.IconLocation;
-exports.IconMail = Toggle.IconMail;
-exports.IconMinus = Toggle.IconMinus;
-exports.IconMobile = Toggle.IconMobile;
-exports.IconMoney = Toggle.IconMoney;
-exports.IconNewWindow = Toggle.IconNewWindow;
-exports.IconNote = Toggle.IconNote;
-exports.IconNotification = Toggle.IconNotification;
-exports.IconOverflow = Toggle.IconOverflow;
-exports.IconPeople = Toggle.IconPeople;
-exports.IconPersonAdd = Toggle.IconPersonAdd;
-exports.IconPersonVerified = Toggle.IconPersonVerified;
-exports.IconPhone = Toggle.IconPhone;
-exports.IconPlatformAndroid = Toggle.IconPlatformAndroid;
-exports.IconPlatformApple = Toggle.IconPlatformApple;
-exports.IconPrint = Toggle.IconPrint;
-exports.IconProfile = Toggle.IconProfile;
-exports.IconPromote = Toggle.IconPromote;
-exports.IconRecommended = Toggle.IconRecommended;
-exports.IconRefresh = Toggle.IconRefresh;
-exports.IconResume = Toggle.IconResume;
-exports.IconSearch = Toggle.IconSearch;
-exports.IconSecurity = Toggle.IconSecurity;
-exports.IconSend = Toggle.IconSend;
-exports.IconSent = Toggle.IconSent;
-exports.IconSettings = Toggle.IconSettings;
-exports.IconShare = Toggle.IconShare;
-exports.IconSocialFacebook = Toggle.IconSocialFacebook;
-exports.IconSocialGitHub = Toggle.IconSocialGitHub;
-exports.IconSocialInstagram = Toggle.IconSocialInstagram;
-exports.IconSocialLinkedIn = Toggle.IconSocialLinkedIn;
-exports.IconSocialMedium = Toggle.IconSocialMedium;
-exports.IconSocialTwitter = Toggle.IconSocialTwitter;
-exports.IconSocialYouTube = Toggle.IconSocialYouTube;
-exports.IconStar = Toggle.IconStar;
-exports.IconStatistics = Toggle.IconStatistics;
-exports.IconSubCategory = Toggle.IconSubCategory;
-exports.IconTag = Toggle.IconTag;
-exports.IconThumb = Toggle.IconThumb;
-exports.IconTick = Toggle.IconTick;
-exports.IconTime = Toggle.IconTime;
-exports.IconTip = Toggle.IconTip;
-exports.IconUpload = Toggle.IconUpload;
-exports.IconVideo = Toggle.IconVideo;
-exports.IconVisibility = Toggle.IconVisibility;
-exports.IconWorkExperience = Toggle.IconWorkExperience;
-exports.IconZoomIn = Toggle.IconZoomIn;
-exports.IconZoomOut = Toggle.IconZoomOut;
-exports.Link = Toggle.Link;
-exports.List = Toggle.List;
-exports.Loader = Toggle.Loader;
-exports.MenuItem = Toggle.MenuItem;
-exports.MenuItemCheckbox = Toggle.MenuItemCheckbox;
-exports.MenuItemDivider = Toggle.MenuItemDivider;
-exports.MenuItemLink = Toggle.MenuItemLink;
-exports.MenuRenderer = Toggle.MenuRenderer;
-exports.MonthPicker = Toggle.MonthPicker;
-exports.Notice = Toggle.Notice;
-exports.OverflowMenu = Toggle.OverflowMenu;
-exports.Pagination = Toggle.Pagination;
-exports.PasswordField = Toggle.PasswordField;
-exports.Radio = Toggle.Radio;
-exports.RadioGroup = Toggle.RadioGroup;
-exports.RadioItem = Toggle.RadioItem;
-exports.Rating = Toggle.Rating;
-exports.Secondary = Toggle.Secondary;
-exports.Step = Toggle.Step;
-exports.Stepper = Toggle.Stepper;
-exports.Strong = Toggle.Strong;
-exports.Tab = Toggle.Tab;
-exports.TabPanel = Toggle.TabPanel;
-exports.TabPanels = Toggle.TabPanels;
-exports.Tabs = Toggle.Tabs;
-exports.TabsProvider = Toggle.TabsProvider;
-exports.Tag = Toggle.Tag;
-exports.TextDropdown = Toggle.TextDropdown;
-exports.TextField = Toggle.TextField;
-exports.Textarea = Toggle.Textarea;
-exports.ThemeNameConsumer = Toggle.ThemeNameConsumer;
-exports.Tiles = Toggle.Tiles;
-exports.Toggle = Toggle.Toggle;
-exports.filterSuggestions = Toggle.filterSuggestions;
-exports.useBreakpoint = Toggle.useBreakpoint;
-exports.useColor = Toggle.useColor;
+exports.Accordion = index.Accordion;
+exports.AccordionItem = index.AccordionItem;
+exports.Actions = index.Actions;
+exports.Alert = index.Alert;
+exports.Autosuggest = index.Autosuggest;
+exports.Badge = index.Badge;
+exports.BoxRenderer = index.BoxRenderer;
+exports.ButtonLink = index.ButtonLink;
+exports.Card = index.Card;
+exports.Checkbox = index.Checkbox;
+exports.CheckboxStandalone = index.CheckboxStandalone;
+exports.Dialog = index.Dialog;
+exports.Disclosure = index.Disclosure;
+exports.Drawer = index.Drawer;
+exports.Dropdown = index.Dropdown;
+exports.FieldLabel = index.FieldLabel;
+exports.FieldMessage = index.FieldMessage;
+exports.Heading = index.Heading;
+exports.HiddenVisually = index.HiddenVisually;
+exports.IconAdd = index.IconAdd;
+exports.IconArrow = index.IconArrow;
+exports.IconBookmark = index.IconBookmark;
+exports.IconCaution = index.IconCaution;
+exports.IconChevron = index.IconChevron;
+exports.IconCompany = index.IconCompany;
+exports.IconCompose = index.IconCompose;
+exports.IconCopy = index.IconCopy;
+exports.IconCreditCard = index.IconCreditCard;
+exports.IconDate = index.IconDate;
+exports.IconDelete = index.IconDelete;
+exports.IconDesktop = index.IconDesktop;
+exports.IconDocument = index.IconDocument;
+exports.IconDocumentBroken = index.IconDocumentBroken;
+exports.IconDownload = index.IconDownload;
+exports.IconEdit = index.IconEdit;
+exports.IconEducation = index.IconEducation;
+exports.IconFilter = index.IconFilter;
+exports.IconFlag = index.IconFlag;
+exports.IconGrid = index.IconGrid;
+exports.IconHeart = index.IconHeart;
+exports.IconHelp = index.IconHelp;
+exports.IconHistory = index.IconHistory;
+exports.IconHome = index.IconHome;
+exports.IconImage = index.IconImage;
+exports.IconInfo = index.IconInfo;
+exports.IconInvoice = index.IconInvoice;
+exports.IconLanguage = index.IconLanguage;
+exports.IconLink = index.IconLink;
+exports.IconLinkBroken = index.IconLinkBroken;
+exports.IconList = index.IconList;
+exports.IconLocation = index.IconLocation;
+exports.IconMail = index.IconMail;
+exports.IconMessage = index.IconMessage;
+exports.IconMinus = index.IconMinus;
+exports.IconMobile = index.IconMobile;
+exports.IconMoney = index.IconMoney;
+exports.IconNewWindow = index.IconNewWindow;
+exports.IconNote = index.IconNote;
+exports.IconNotification = index.IconNotification;
+exports.IconOverflow = index.IconOverflow;
+exports.IconPeople = index.IconPeople;
+exports.IconPersonAdd = index.IconPersonAdd;
+exports.IconPersonVerified = index.IconPersonVerified;
+exports.IconPhone = index.IconPhone;
+exports.IconPlatformAndroid = index.IconPlatformAndroid;
+exports.IconPlatformApple = index.IconPlatformApple;
+exports.IconPrint = index.IconPrint;
+exports.IconProfile = index.IconProfile;
+exports.IconPromote = index.IconPromote;
+exports.IconRecommended = index.IconRecommended;
+exports.IconRefresh = index.IconRefresh;
+exports.IconResume = index.IconResume;
+exports.IconSearch = index.IconSearch;
+exports.IconSecurity = index.IconSecurity;
+exports.IconSend = index.IconSend;
+exports.IconSent = index.IconSent;
+exports.IconSettings = index.IconSettings;
+exports.IconShare = index.IconShare;
+exports.IconSocialFacebook = index.IconSocialFacebook;
+exports.IconSocialGitHub = index.IconSocialGitHub;
+exports.IconSocialInstagram = index.IconSocialInstagram;
+exports.IconSocialLinkedIn = index.IconSocialLinkedIn;
+exports.IconSocialMedium = index.IconSocialMedium;
+exports.IconSocialTwitter = index.IconSocialTwitter;
+exports.IconSocialYouTube = index.IconSocialYouTube;
+exports.IconStar = index.IconStar;
+exports.IconStatistics = index.IconStatistics;
+exports.IconSubCategory = index.IconSubCategory;
+exports.IconTag = index.IconTag;
+exports.IconThumb = index.IconThumb;
+exports.IconTick = index.IconTick;
+exports.IconTime = index.IconTime;
+exports.IconTip = index.IconTip;
+exports.IconUpload = index.IconUpload;
+exports.IconVideo = index.IconVideo;
+exports.IconVisibility = index.IconVisibility;
+exports.IconWorkExperience = index.IconWorkExperience;
+exports.IconZoomIn = index.IconZoomIn;
+exports.IconZoomOut = index.IconZoomOut;
+exports.Link = index.Link;
+exports.List = index.List;
+exports.Loader = index.Loader;
+exports.MenuItem = index.MenuItem;
+exports.MenuItemCheckbox = index.MenuItemCheckbox;
+exports.MenuItemDivider = index.MenuItemDivider;
+exports.MenuItemLink = index.MenuItemLink;
+exports.MenuRenderer = index.MenuRenderer;
+exports.MonthPicker = index.MonthPicker;
+exports.Notice = index.Notice;
+exports.OverflowMenu = index.OverflowMenu;
+exports.PageBlock = index.PageBlock;
+exports.Pagination = index.Pagination;
+exports.PasswordField = index.PasswordField;
+exports.Radio = index.Radio;
+exports.RadioGroup = index.RadioGroup;
+exports.RadioItem = index.RadioItem;
+exports.Rating = index.Rating;
+exports.Secondary = index.Secondary;
+exports.Step = index.Step;
+exports.Stepper = index.Stepper;
+exports.Strong = index.Strong;
+exports.Tab = index.Tab;
+exports.TabPanel = index.TabPanel;
+exports.TabPanels = index.TabPanels;
+exports.Tabs = index.Tabs;
+exports.TabsProvider = index.TabsProvider;
+exports.Tag = index.Tag;
+exports.TextDropdown = index.TextDropdown;
+exports.TextField = index.TextField;
+exports.Textarea = index.Textarea;
+exports.ThemeNameConsumer = index.ThemeNameConsumer;
+exports.Tiles = index.Tiles;
+exports.Toggle = index.Toggle;
+exports.filterSuggestions = index.filterSuggestions;
+exports.useBreakpoint = index.useBreakpoint;
+exports.useColor = index.useColor;

package/dist/index.d.ts

@@ -1 +1 @@
-export { Accordion, AccordionItem, Actions, Alert, Autosuggest, Badge, Bleed, PublicBox as Box, BoxRenderer, BraidPortal, BraidProvider, Button, ButtonIcon, ButtonLink, Card, Checkbox, CheckboxStandalone, Column, Columns, ContentBlock, Dialog, Disclosure, Divider, Drawer, Dropdown, FieldLabel, FieldMessage, Heading, Hidden, HiddenVisually, IconAdd, IconArrow, IconBookmark, IconCaution, IconChevron, IconClear, IconCompany, IconCompose, IconCopy, IconCreditCard, IconCritical, IconDate, IconDelete, IconDesktop, IconDocument, IconDocumentBroken, IconDownload, IconEdit, IconEducation, IconFilter, IconFlag, IconGrid, IconHeart, IconHelp, IconHistory, IconHome, IconImage, IconInfo, IconInvoice, IconLanguage, IconLink, IconLinkBroken, IconList, IconLocation, IconMail, IconMinus, IconMobile, IconMoney, IconNewWindow, IconNote, IconNotification, IconOverflow, IconPeople, IconPersonAdd, IconPersonVerified, IconPhone, IconPlatformAndroid, IconPlatformApple, IconPositive, IconPrint, IconProfile, IconPromote, IconRecommended, IconRefresh, IconRenderer, IconResume, IconSearch, IconSecurity, IconSend, IconSent, IconSettings, IconShare, IconSocialFacebook, IconSocialGitHub, IconSocialInstagram, IconSocialLinkedIn, IconSocialMedium, IconSocialTwitter, IconSocialYouTube, IconStar, IconStatistics, IconSubCategory, IconTag, IconThumb, IconTick, IconTime, IconTip, IconUpload, IconVideo, IconVisibility, IconWorkExperience, IconZoomIn, IconZoomOut, Inline, Link, LinkComponent, List, Loader, MenuItem, MenuItemCheckbox, MenuItemDivider, MenuItemLink, MenuRenderer, MonthPicker, Notice, OverflowMenu, Pagination, PasswordField, Radio, RadioGroup, RadioItem, Rating, Secondary, Stack, Step, Stepper, Strong, Tab, TabPanel, TabPanels, Tabs, TabsProvider, Tag, Text, TextDropdown, TextField, TextLink, TextLinkButton, Textarea, ThemeNameConsumer, Tiles, ToastProvider, Toggle, TooltipRenderer, filterSuggestions, makeLinkComponent, useBreakpoint, useColor, useResponsiveValue, useSpace, useThemeName, useToast } from './reset.js';
+export { Accordion, AccordionItem, Actions, Alert, Autosuggest, Badge, Bleed, PublicBox as Box, BoxRenderer, BraidPortal, BraidProvider, Button, ButtonIcon, ButtonLink, Card, Checkbox, CheckboxStandalone, Column, Columns, ContentBlock, Dialog, Disclosure, Divider, Drawer, Dropdown, FieldLabel, FieldMessage, Heading, Hidden, HiddenVisually, IconAdd, IconArrow, IconBookmark, IconCaution, IconChevron, IconClear, IconCompany, IconCompose, IconCopy, IconCreditCard, IconCritical, IconDate, IconDelete, IconDesktop, IconDocument, IconDocumentBroken, IconDownload, IconEdit, IconEducation, IconFilter, IconFlag, IconGrid, IconHeart, IconHelp, IconHistory, IconHome, IconImage, IconInfo, IconInvoice, IconLanguage, IconLink, IconLinkBroken, IconList, IconLocation, IconMail, IconMessage, IconMinus, IconMobile, IconMoney, IconNewWindow, IconNote, IconNotification, IconOverflow, IconPeople, IconPersonAdd, IconPersonVerified, IconPhone, IconPlatformAndroid, IconPlatformApple, IconPositive, IconPrint, IconProfile, IconPromote, IconRecommended, IconRefresh, IconRenderer, IconResume, IconSearch, IconSecurity, IconSend, IconSent, IconSettings, IconShare, IconSocialFacebook, IconSocialGitHub, IconSocialInstagram, IconSocialLinkedIn, IconSocialMedium, IconSocialTwitter, IconSocialYouTube, IconStar, IconStatistics, IconSubCategory, IconTag, IconThumb, IconTick, IconTime, IconTip, IconUpload, IconVideo, IconVisibility, IconWorkExperience, IconZoomIn, IconZoomOut, Inline, Link, LinkComponent, List, Loader, MenuItem, MenuItemCheckbox, MenuItemDivider, MenuItemLink, MenuRenderer, MonthPicker, Notice, OverflowMenu, PageBlock, Pagination, PasswordField, Radio, RadioGroup, RadioItem, Rating, Secondary, Stack, Step, Stepper, Strong, Tab, TabPanel, TabPanels, Tabs, TabsProvider, Tag, Text, TextDropdown, TextField, TextLink, TextLinkButton, Textarea, ThemeNameConsumer, Tiles, ToastProvider, Toggle, TooltipRenderer, filterSuggestions, makeLinkComponent, useBreakpoint, useColor, useResponsiveValue, useSpace, useThemeName, useToast } from './reset.js';

package/dist/index.mjs

@@ -1,6 +1,6 @@
 import { BraidProvider, makeLinkComponent } from "./side-effects/lib/components/BraidProvider/BraidProvider.mjs";
 import { Bleed, PublicBox, BraidPortal, Button, ButtonIcon, Column, Columns, ContentBlock, Divider, Hidden, IconClear, IconCritical, IconPositive, IconRenderer, Inline, Stack, Text, TextLink, TextLinkButton, ToastProvider, TooltipRenderer, useResponsiveValue, useSpace, useThemeName, useToast } from "./ToastContext.chunk.mjs";
-import { Accordion, AccordionItem, Actions, Alert, Autosuggest, Badge, BoxRenderer, ButtonLink, Card, Checkbox, CheckboxStandalone, Dialog, Disclosure, Drawer, Dropdown, FieldLabel, FieldMessage, Heading, HiddenVisually, IconAdd, IconArrow, IconBookmark, IconCaution, IconChevron, IconCompany, IconCompose, IconCopy, IconCreditCard, IconDate, IconDelete, IconDesktop, IconDocument, IconDocumentBroken, IconDownload, IconEdit, IconEducation, IconFilter, IconFlag, IconGrid, IconHeart, IconHelp, IconHistory, IconHome, IconImage, IconInfo, IconInvoice, IconLanguage, IconLink, IconLinkBroken, IconList, IconLocation, IconMail, IconMinus, IconMobile, IconMoney, IconNewWindow, IconNote, IconNotification, IconOverflow, IconPeople, IconPersonAdd, IconPersonVerified, IconPhone, IconPlatformAndroid, IconPlatformApple, IconPrint, IconProfile, IconPromote, IconRecommended, IconRefresh, IconResume, IconSearch, IconSecurity, IconSend, IconSent, IconSettings, IconShare, IconSocialFacebook, IconSocialGitHub, IconSocialInstagram, IconSocialLinkedIn, IconSocialMedium, IconSocialTwitter, IconSocialYouTube, IconStar, IconStatistics, IconSubCategory, IconTag, IconThumb, IconTick, IconTime, IconTip, IconUpload, IconVideo, IconVisibility, IconWorkExperience, IconZoomIn, IconZoomOut, Link, List, Loader, MenuItem, MenuItemCheckbox, MenuItemDivider, MenuItemLink, MenuRenderer, MonthPicker, Notice, OverflowMenu, Pagination, PasswordField, Radio, RadioGroup, RadioItem, Rating, Secondary, Step, Stepper, Strong, Tab, TabPanel, TabPanels, Tabs, TabsProvider, Tag, TextDropdown, TextField, Textarea, ThemeNameConsumer, Tiles, Toggle, filterSuggestions, useBreakpoint, useColor } from "./Toggle.chunk.mjs";
+import { Accordion, AccordionItem, Actions, Alert, Autosuggest, Badge, BoxRenderer, ButtonLink, Card, Checkbox, CheckboxStandalone, Dialog, Disclosure, Drawer, Dropdown, FieldLabel, FieldMessage, Heading, HiddenVisually, IconAdd, IconArrow, IconBookmark, IconCaution, IconChevron, IconCompany, IconCompose, IconCopy, IconCreditCard, IconDate, IconDelete, IconDesktop, IconDocument, IconDocumentBroken, IconDownload, IconEdit, IconEducation, IconFilter, IconFlag, IconGrid, IconHeart, IconHelp, IconHistory, IconHome, IconImage, IconInfo, IconInvoice, IconLanguage, IconLink, IconLinkBroken, IconList, IconLocation, IconMail, IconMessage, IconMinus, IconMobile, IconMoney, IconNewWindow, IconNote, IconNotification, IconOverflow, IconPeople, IconPersonAdd, IconPersonVerified, IconPhone, IconPlatformAndroid, IconPlatformApple, IconPrint, IconProfile, IconPromote, IconRecommended, IconRefresh, IconResume, IconSearch, IconSecurity, IconSend, IconSent, IconSettings, IconShare, IconSocialFacebook, IconSocialGitHub, IconSocialInstagram, IconSocialLinkedIn, IconSocialMedium, IconSocialTwitter, IconSocialYouTube, IconStar, IconStatistics, IconSubCategory, IconTag, IconThumb, IconTick, IconTime, IconTip, IconUpload, IconVideo, IconVisibility, IconWorkExperience, IconZoomIn, IconZoomOut, Link, List, Loader, MenuItem, MenuItemCheckbox, MenuItemDivider, MenuItemLink, MenuRenderer, MonthPicker, Notice, OverflowMenu, PageBlock, Pagination, PasswordField, Radio, RadioGroup, RadioItem, Rating, Secondary, Step, Stepper, Strong, Tab, TabPanel, TabPanels, Tabs, TabsProvider, Tag, TextDropdown, TextField, Textarea, ThemeNameConsumer, Tiles, Toggle, filterSuggestions, useBreakpoint, useColor } from "./index.chunk.mjs";
 export {
   Accordion,
   AccordionItem,
@@ -67,6 +67,7 @@ export {
   IconList,
   IconLocation,
   IconMail,
+  IconMessage,
   IconMinus,
   IconMobile,
   IconMoney,
@@ -127,6 +128,7 @@ export {
   MonthPicker,
   Notice,
   OverflowMenu,
+  PageBlock,
   Pagination,
   PasswordField,
   Radio,