@easypost/easy-ui 1.0.0-alpha.45 → 1.0.0-alpha.47

package/Badge/index.js

@@ -1,21 +1,21 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
-const Icon = require("../__chunks__/Icon-C8Pv0WxJ.js");
-const Text = require("../__chunks__/Text-BIEBtikW.js");
+const Icon = require("../__chunks__/Icon-B5AFLpxS.js");
+const Text = require("../__chunks__/Text-D68nUAQK.js");
 const utilities_css = require("../utilities/css.js");
-const root = "_root_iwga8_5";
-const primary = "_primary_iwga8_16";
-const secondary = "_secondary_iwga8_17";
-const text = "_text_iwga8_32";
-const variantPrimary = "_variantPrimary_iwga8_37";
-const variantSecondary = "_variantSecondary_iwga8_44";
-const variantBlack = "_variantBlack_iwga8_51";
-const variantInverse = "_variantInverse_iwga8_58";
-const variantGray = "_variantGray_iwga8_65";
-const variantSuccess = "_variantSuccess_iwga8_72";
-const variantWarning = "_variantWarning_iwga8_79";
-const variantDanger = "_variantDanger_iwga8_86";
+const root = "_root_1gbn2_5";
+const primary = "_primary_1gbn2_16";
+const secondary = "_secondary_1gbn2_17";
+const text = "_text_1gbn2_32";
+const variantPrimary = "_variantPrimary_1gbn2_37";
+const variantSecondary = "_variantSecondary_1gbn2_44";
+const variantBlack = "_variantBlack_1gbn2_51";
+const variantInverse = "_variantInverse_1gbn2_58";
+const variantGray = "_variantGray_1gbn2_65";
+const variantSuccess = "_variantSuccess_1gbn2_72";
+const variantWarning = "_variantWarning_1gbn2_79";
+const variantDanger = "_variantDanger_1gbn2_86";
 const styles = {
   root,
   primary,

package/Badge/index.mjs

@@ -1,19 +1,19 @@
 import React__default from "react";
-import { I as Icon } from "../__chunks__/Icon-2Jqy__IK.mjs";
-import { T as Text } from "../__chunks__/Text-Bxnq33Lq.mjs";
+import { I as Icon } from "../__chunks__/Icon-BLzAgcg_.mjs";
+import { T as Text } from "../__chunks__/Text-Be2tsyQD.mjs";
 import { classNames, variationName } from "../utilities/css.mjs";
-const root = "_root_iwga8_5";
-const primary = "_primary_iwga8_16";
-const secondary = "_secondary_iwga8_17";
-const text = "_text_iwga8_32";
-const variantPrimary = "_variantPrimary_iwga8_37";
-const variantSecondary = "_variantSecondary_iwga8_44";
-const variantBlack = "_variantBlack_iwga8_51";
-const variantInverse = "_variantInverse_iwga8_58";
-const variantGray = "_variantGray_iwga8_65";
-const variantSuccess = "_variantSuccess_iwga8_72";
-const variantWarning = "_variantWarning_iwga8_79";
-const variantDanger = "_variantDanger_iwga8_86";
+const root = "_root_1gbn2_5";
+const primary = "_primary_1gbn2_16";
+const secondary = "_secondary_1gbn2_17";
+const text = "_text_1gbn2_32";
+const variantPrimary = "_variantPrimary_1gbn2_37";
+const variantSecondary = "_variantSecondary_1gbn2_44";
+const variantBlack = "_variantBlack_1gbn2_51";
+const variantInverse = "_variantInverse_1gbn2_58";
+const variantGray = "_variantGray_1gbn2_65";
+const variantSuccess = "_variantSuccess_1gbn2_72";
+const variantWarning = "_variantWarning_1gbn2_79";
+const variantDanger = "_variantDanger_1gbn2_86";
 const styles = {
   root,
   primary,

package/Banner/index.js

@@ -1,12 +1,12 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
-const Text = require("../__chunks__/Text-BIEBtikW.js");
+const Text = require("../__chunks__/Text-D68nUAQK.js");
 const utilities_css = require("../utilities/css.js");
-const colorSuccess = "_colorSuccess_16fme_5";
-const colorPrimary = "_colorPrimary_16fme_10";
-const colorNeutral = "_colorNeutral_16fme_11";
-const Banner$1 = "_Banner_16fme_23";
+const colorSuccess = "_colorSuccess_1ryi6_5";
+const colorPrimary = "_colorPrimary_1ryi6_10";
+const colorNeutral = "_colorNeutral_1ryi6_11";
+const Banner$1 = "_Banner_1ryi6_23";
 const styles = {
   colorSuccess,
   colorPrimary,

package/Banner/index.mjs

@@ -1,10 +1,10 @@
 import React__default from "react";
-import { T as Text } from "../__chunks__/Text-Bxnq33Lq.mjs";
+import { T as Text } from "../__chunks__/Text-Be2tsyQD.mjs";
 import { classNames, variationName } from "../utilities/css.mjs";
-const colorSuccess = "_colorSuccess_16fme_5";
-const colorPrimary = "_colorPrimary_16fme_10";
-const colorNeutral = "_colorNeutral_16fme_11";
-const Banner$1 = "_Banner_16fme_23";
+const colorSuccess = "_colorSuccess_1ryi6_5";
+const colorPrimary = "_colorPrimary_1ryi6_10";
+const colorNeutral = "_colorNeutral_1ryi6_11";
+const Banner$1 = "_Banner_1ryi6_23";
 const styles = {
   colorSuccess,
   colorPrimary,

package/Button/index.js

@@ -1,4 +1,4 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const Button = require("../__chunks__/Button-gX6YZjGy.js");
+const Button = require("../__chunks__/Button-eE4jYST7.js");
 exports.Button = Button.Button;

package/Button/index.mjs

@@ -1,4 +1,4 @@
-import { B } from "../__chunks__/Button-q1Fn25T4.mjs";
+import { B } from "../__chunks__/Button-B5Y5m6F7.mjs";
 export {
   B as Button
 };

package/CHANGELOG.md

@@ -1,5 +1,32 @@
 # @easypost/easy-ui
 
+## 1.0.0-alpha.47
+
+### Minor Changes
+
+- 2ac540f: Create `<Spinner />` component
+- 712edb9: feat: create EmptyStateCard component
+- 6c92ae5: Create `<ToggleCard />` component
+- b2bfda7: DataGrid support empty state
+- 4be0201: feat: support border radius, paddingX, and paddingY for `Card` and update `ToggleCard` to use new `Card` props
+- 1fd8015: Supports DataGrid loading state
+- 15309ec: fix: overflow for NexusLayoutMultipageContent component
+- 11ca1e9: feat: add SectionCard component
+
+## 1.0.0-alpha.46
+
+### Minor Changes
+
+- 2eb11dc: Create `<PillGroup />` component
+- 51e5b35: feat: create SplitToggleCard component
+
+### Patch Changes
+
+- Updated dependencies [8c1c613]
+- Updated dependencies [2eb11dc]
+  - @easypost/easy-ui-icons@1.0.0-alpha.28
+  - @easypost/easy-ui-tokens@1.0.0-alpha.12
+
 ## 1.0.0-alpha.45
 
 ### Minor Changes

package/Calendar/index.js

@@ -32,23 +32,25 @@ var __objRest = (source, exclude) => {
 };
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
-const Text = require("../__chunks__/Text-BIEBtikW.js");
-const VerticalStack = require("../__chunks__/VerticalStack-DM3U_50O.js");
-const usePress = require("../__chunks__/usePress-CJFCsGrc.js");
+const Text = require("../__chunks__/Text-D68nUAQK.js");
+const VerticalStack = require("../__chunks__/VerticalStack-u0_XuJW_.js");
+const usePress = require("../__chunks__/usePress-CVaDRJAC.js");
 const utilities_css = require("../utilities/css.js");
 const useLocalizedStringFormatter = require("../__chunks__/useLocalizedStringFormatter-BLVK8-7o.js");
 const context = require("../__chunks__/context-CVdyTo4T.js");
-const useFocusVisible = require("../__chunks__/useFocusVisible-Ck9pGy9i.js");
-const focusSafely = require("../__chunks__/focusSafely-DJl8qN5z.js");
+const mergeProps = require("../__chunks__/mergeProps-UQqzLbUj.js");
+const focusSafely = require("../__chunks__/focusSafely-sijAOUK7.js");
 const getScrollParent = require("../__chunks__/getScrollParent-DbYnnXj7.js");
-const scrollIntoView = require("../__chunks__/scrollIntoView-DhYqseLR.js");
-const useLabels = require("../__chunks__/useLabels-Cl57IhjL.js");
-const Icon = require("../__chunks__/Icon-C8Pv0WxJ.js");
-const HorizontalStack = require("../__chunks__/HorizontalStack-BXWiVrLQ.js");
-const VisuallyHidden = require("../__chunks__/VisuallyHidden-BjR6rJ8D.js");
-const UnstyledButton = require("../__chunks__/UnstyledButton-DMmFUqkd.js");
+const scrollIntoView = require("../__chunks__/scrollIntoView-BHdu5D09.js");
+const useFocusVisible = require("../__chunks__/useFocusVisible-D8TIwziQ.js");
+const useLabels = require("../__chunks__/useLabels-DI_wRC8f.js");
+const Icon = require("../__chunks__/Icon-B5AFLpxS.js");
+const HorizontalStack = require("../__chunks__/HorizontalStack-B2JZOgff.js");
+const VisuallyHidden = require("../__chunks__/VisuallyHidden-CC7DzLD_.js");
+const UnstyledButton = require("../__chunks__/UnstyledButton-DwB-70Zg.js");
 const useControlledState = require("../__chunks__/useControlledState-mnKBd6Uc.js");
 const LiveAnnouncer = require("../__chunks__/LiveAnnouncer-CWnuIRMW.js");
+const filterDOMProps = require("../__chunks__/filterDOMProps-D3iOHP0H.js");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
   if (e) {
@@ -2882,7 +2884,7 @@ function $parcel$interopDefault$1(a) {
 }
 function $c4acc1de3ab169cf$export$d652b3ea2d672d5b(props, state) {
   let stringFormatter = useLocalizedStringFormatter.$fca6afa0e843324b$export$f12b703ca79dfbb1($parcel$interopDefault$1($3904726b442bd9b2$exports), "@react-aria/calendar");
-  let domProps = focusSafely.$65484d02dcb7eb3e$export$457c3d6518dd4c6f(props);
+  let domProps = filterDOMProps.$65484d02dcb7eb3e$export$457c3d6518dd4c6f(props);
   let title = $a074e1e2d0f0a665$export$31afe65d91ef6e8(state.visibleRange.start, state.visibleRange.end, state.timeZone, false);
   let visibleRangeDescription = $a074e1e2d0f0a665$export$31afe65d91ef6e8(state.visibleRange.start, state.visibleRange.end, state.timeZone, true);
   LiveAnnouncer.$4f58c5f72bcf79f7$export$496315a1608d9602(() => {
@@ -2896,7 +2898,7 @@ function $c4acc1de3ab169cf$export$d652b3ea2d672d5b(props, state) {
   }, [
     selectedDateDescription
   ]);
-  let errorMessageId = useFocusVisible.$bdb11010cef70236$export$b4cc09c592e8fdb8([
+  let errorMessageId = mergeProps.$bdb11010cef70236$export$b4cc09c592e8fdb8([
     Boolean(props.errorMessage),
     props.isInvalid,
     props.validationState
@@ -2928,7 +2930,7 @@ function $c4acc1de3ab169cf$export$d652b3ea2d672d5b(props, state) {
     "aria-labelledby": props["aria-labelledby"]
   });
   return {
-    calendarProps: useFocusVisible.$3ef42575df84b30b$export$9d1611c77c2fe928(domProps, labelProps, {
+    calendarProps: mergeProps.$3ef42575df84b30b$export$9d1611c77c2fe928(domProps, labelProps, {
       role: "application",
       "aria-describedby": props["aria-describedby"] || void 0
     }),
@@ -3044,7 +3046,7 @@ function $e3031d1f8c9d64eb$export$cb95147730a423f5(props, state) {
     dayFormatter
   ]);
   return {
-    gridProps: useFocusVisible.$3ef42575df84b30b$export$9d1611c77c2fe928(labelProps, {
+    gridProps: mergeProps.$3ef42575df84b30b$export$9d1611c77c2fe928(labelProps, {
       role: "grid",
       "aria-readonly": state.isReadOnly || null,
       "aria-disabled": state.isDisabled || null,
@@ -3230,7 +3232,7 @@ function $36a0ac60f04457c5$export$136073280381448e(props, state, ref) {
       "aria-selected": isSelected2 || null,
       "aria-invalid": isInvalid || null
     },
-    buttonProps: useFocusVisible.$3ef42575df84b30b$export$9d1611c77c2fe928(pressProps, {
+    buttonProps: mergeProps.$3ef42575df84b30b$export$9d1611c77c2fe928(pressProps, {
       onFocus() {
         if (!isDisabled2) state.setFocusedDate(date);
       },
@@ -3263,13 +3265,13 @@ function $36a0ac60f04457c5$export$136073280381448e(props, state, ref) {
     formattedDate
   };
 }
-const CellContainer = "_CellContainer_18jjm_5";
-const CalendarCell$1 = "_CalendarCell_18jjm_9";
-const isUnavailable = "_isUnavailable_18jjm_33";
-const isSelected = "_isSelected_18jjm_33";
-const isDisabled = "_isDisabled_18jjm_33";
-const isReadOnly = "_isReadOnly_18jjm_33";
-const isOutsideCurrentMonth = "_isOutsideCurrentMonth_18jjm_36";
+const CellContainer = "_CellContainer_1q959_5";
+const CalendarCell$1 = "_CalendarCell_1q959_9";
+const isUnavailable = "_isUnavailable_1q959_33";
+const isSelected = "_isSelected_1q959_33";
+const isDisabled = "_isDisabled_1q959_33";
+const isReadOnly = "_isReadOnly_1q959_33";
+const isOutsideCurrentMonth = "_isOutsideCurrentMonth_1q959_36";
 const styles$3 = {
   CellContainer,
   CalendarCell: CalendarCell$1,
@@ -3308,8 +3310,8 @@ function CalendarCell({ state, date }) {
     variant: "body1"
   }, formattedDate)));
 }
-const CalendarGrid$1 = "_CalendarGrid_14lcf_5";
-const CalendarGridHeader = "_CalendarGridHeader_14lcf_9";
+const CalendarGrid$1 = "_CalendarGrid_et0mv_5";
+const CalendarGridHeader = "_CalendarGridHeader_et0mv_9";
 const styles$2 = {
   CalendarGrid: CalendarGrid$1,
   CalendarGridHeader
@@ -3414,7 +3416,7 @@ const KeyboardDoubleArrowRight = (_a) => {
     d: "M422.54-480.62 228.39-675.15l32-31.62 226.15 226.15-226.15 226.16-32-32 194.15-194.16Zm246.08 0L474.46-675.15l31.62-31.62 226.15 226.15-226.15 226.16-31.62-32 194.16-194.16Z"
   }));
 };
-const CalendarHeader$1 = "_CalendarHeader_yarsv_5";
+const CalendarHeader$1 = "_CalendarHeader_1pqh5_5";
 const styles$1 = {
   CalendarHeader: CalendarHeader$1
 };
@@ -3436,7 +3438,7 @@ function CalendarHeader(_c) {
     color: "neutral.000"
   }))));
 }
-const Calendar$1 = "_Calendar_1kppq_5";
+const Calendar$1 = "_Calendar_ezt39_5";
 const styles = {
   Calendar: Calendar$1
 };

package/Calendar/index.mjs

@@ -31,23 +31,25 @@ var __objRest = (source, exclude) => {
 };
 import * as React from "react";
 import React__default, { useMemo, useState, useRef, useEffect } from "react";
-import { T as Text } from "../__chunks__/Text-Bxnq33Lq.mjs";
-import { V as VerticalStack } from "../__chunks__/VerticalStack-BjQNx2AR.mjs";
-import { _ as _class_private_field_init, a as $f6c31cce2adf654f$export$45712eceda6fad21 } from "../__chunks__/usePress-ju3DTlr9.mjs";
+import { T as Text } from "../__chunks__/Text-Be2tsyQD.mjs";
+import { V as VerticalStack } from "../__chunks__/VerticalStack-Dscos9dB.mjs";
+import { _ as _class_private_field_init, $ as $f6c31cce2adf654f$export$45712eceda6fad21 } from "../__chunks__/usePress-ClFvFaQh.mjs";
 import { classNames } from "../utilities/css.mjs";
 import { $ as $fca6afa0e843324b$export$f12b703ca79dfbb1 } from "../__chunks__/useLocalizedStringFormatter-BeeOHqNm.mjs";
 import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "../__chunks__/context-D_DOjzPV.mjs";
-import { h as $bdb11010cef70236$export$b4cc09c592e8fdb8, b as $3ef42575df84b30b$export$9d1611c77c2fe928, m as $507fabe10e71c6fb$export$630ff653c5ada6a9 } from "../__chunks__/useFocusVisible-J4EYjfvG.mjs";
-import { b as $65484d02dcb7eb3e$export$457c3d6518dd4c6f, c as $7215afc6de606d6b$export$de79e2c695e052f3 } from "../__chunks__/focusSafely-Cu6jhez1.mjs";
+import { $ as $bdb11010cef70236$export$b4cc09c592e8fdb8, a as $3ef42575df84b30b$export$9d1611c77c2fe928 } from "../__chunks__/mergeProps-LaTXuy7S.mjs";
+import { b as $7215afc6de606d6b$export$de79e2c695e052f3 } from "../__chunks__/focusSafely-DyKmKF3H.mjs";
 import { $ as $62d8ded9296f3872$export$cfa2225e87938781 } from "../__chunks__/getScrollParent-DZikXhNz.mjs";
-import { $ as $ef06256079686ba0$export$f8aeda7b10753fa1, b as $2f04cbc44ee30ce0$export$c826860796309d1b } from "../__chunks__/scrollIntoView-DKi6e0cR.mjs";
-import { $ as $313b98861ee5dd6c$export$d6875122194c7b44 } from "../__chunks__/useLabels-DORKiZxT.mjs";
-import { I as Icon } from "../__chunks__/Icon-2Jqy__IK.mjs";
-import { H as HorizontalStack } from "../__chunks__/HorizontalStack-DGgYHShn.mjs";
-import { a as $5c3e21d68f1c4674$export$439d29a4e110a164 } from "../__chunks__/VisuallyHidden-kvhydz5c.mjs";
-import { U as UnstyledButton } from "../__chunks__/UnstyledButton-CTQBhhq3.mjs";
+import { $ as $ef06256079686ba0$export$f8aeda7b10753fa1, b as $2f04cbc44ee30ce0$export$c826860796309d1b } from "../__chunks__/scrollIntoView-B2o3iHso.mjs";
+import { h as $507fabe10e71c6fb$export$630ff653c5ada6a9 } from "../__chunks__/useFocusVisible-tOFdeHRg.mjs";
+import { $ as $313b98861ee5dd6c$export$d6875122194c7b44 } from "../__chunks__/useLabels-VHHFpIxv.mjs";
+import { I as Icon } from "../__chunks__/Icon-BLzAgcg_.mjs";
+import { H as HorizontalStack } from "../__chunks__/HorizontalStack-C-G7fjsz.mjs";
+import { a as $5c3e21d68f1c4674$export$439d29a4e110a164 } from "../__chunks__/VisuallyHidden-BttjYmWH.mjs";
+import { U as UnstyledButton } from "../__chunks__/UnstyledButton-B85APDZk.mjs";
 import { $ as $458b0a5536c1a7cf$export$40bfa8c7b0832715 } from "../__chunks__/useControlledState-CFWhSD5C.mjs";
 import { $ as $4f58c5f72bcf79f7$export$496315a1608d9602, a as $319e236875307eab$export$a9b970dcc4ae71a9 } from "../__chunks__/LiveAnnouncer-UhhG0KqR.mjs";
+import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../__chunks__/filterDOMProps-EDDcM64A.mjs";
 function $2b4dce13dd5a17fa$export$842a2cf37af977e1(amount, numerator) {
   return amount - numerator * Math.floor(amount / numerator);
 }
@@ -3245,13 +3247,13 @@ function $36a0ac60f04457c5$export$136073280381448e(props, state, ref) {
     formattedDate
   };
 }
-const CellContainer = "_CellContainer_18jjm_5";
-const CalendarCell$1 = "_CalendarCell_18jjm_9";
-const isUnavailable = "_isUnavailable_18jjm_33";
-const isSelected = "_isSelected_18jjm_33";
-const isDisabled = "_isDisabled_18jjm_33";
-const isReadOnly = "_isReadOnly_18jjm_33";
-const isOutsideCurrentMonth = "_isOutsideCurrentMonth_18jjm_36";
+const CellContainer = "_CellContainer_1q959_5";
+const CalendarCell$1 = "_CalendarCell_1q959_9";
+const isUnavailable = "_isUnavailable_1q959_33";
+const isSelected = "_isSelected_1q959_33";
+const isDisabled = "_isDisabled_1q959_33";
+const isReadOnly = "_isReadOnly_1q959_33";
+const isOutsideCurrentMonth = "_isOutsideCurrentMonth_1q959_36";
 const styles$3 = {
   CellContainer,
   CalendarCell: CalendarCell$1,
@@ -3290,8 +3292,8 @@ function CalendarCell({ state, date }) {
     variant: "body1"
   }, formattedDate)));
 }
-const CalendarGrid$1 = "_CalendarGrid_14lcf_5";
-const CalendarGridHeader = "_CalendarGridHeader_14lcf_9";
+const CalendarGrid$1 = "_CalendarGrid_et0mv_5";
+const CalendarGridHeader = "_CalendarGridHeader_et0mv_9";
 const styles$2 = {
   CalendarGrid: CalendarGrid$1,
   CalendarGridHeader
@@ -3396,7 +3398,7 @@ const KeyboardDoubleArrowRight = (_a) => {
     d: "M422.54-480.62 228.39-675.15l32-31.62 226.15 226.15-226.15 226.16-32-32 194.15-194.16Zm246.08 0L474.46-675.15l31.62-31.62 226.15 226.15-226.15 226.16-31.62-32 194.16-194.16Z"
   }));
 };
-const CalendarHeader$1 = "_CalendarHeader_yarsv_5";
+const CalendarHeader$1 = "_CalendarHeader_1pqh5_5";
 const styles$1 = {
   CalendarHeader: CalendarHeader$1
 };
@@ -3418,7 +3420,7 @@ function CalendarHeader(_c) {
     color: "neutral.000"
   }))));
 }
-const Calendar$1 = "_Calendar_1kppq_5";
+const Calendar$1 = "_Calendar_ezt39_5";
 const styles = {
   Calendar: Calendar$1
 };

package/Card/Card.d.ts

@@ -1,5 +1,5 @@
 import React, { AllHTMLAttributes, ElementType, ReactNode } from "react";
-import { DesignTokenNamespace, ShadowLevel, ThemeTokenNamespace } from "../types";
+import { BorderRadius, DesignTokenNamespace, ShadowLevel, ThemeTokenNamespace } from "../types";
 import { ResponsiveProp } from "../utilities/css";
 type SpaceScale = DesignTokenNamespace<"space">;
 export type CardBackground = "primary" | "secondary" | ThemeTokenNamespace<"color">;
@@ -28,6 +28,10 @@ export type CardContainerProps = {
      * Card shadow.
      */
     boxShadow?: ShadowLevel;
+    /**
+     * Card border radius.
+     */
+    borderRadius?: BorderRadius;
 } & AllHTMLAttributes<ElementType>;
 export type CardAreaProps = {
     /** Background of the card area. By default, card backgrounds are transparent. */
@@ -37,16 +41,35 @@ export type CardAreaProps = {
     /**
      * The spacing around the content area. Accepts a spacing token or an object of spacing tokens for different screen sizes.
      *
-     * @default '2'
      * @example
      * padding='2'
      * padding={{ xs: '2', sm: '3', md: '4', lg: '5', xl: '6' }}
      */
     padding?: CardPadding;
+    /**
+     * The horizontal spacing around the content area. Accepts a spacing token or an object of spacing tokens for different screen sizes.
+     *
+     * @example
+     * paddingX='2'
+     * paddingX={{ xs: '2', sm: '3', md: '4', lg: '5', xl: '6' }}
+     */
+    paddingX?: CardPadding;
+    /**
+     * The vertical spacing around the content area. Accepts a spacing token or an object of spacing tokens for different screen sizes.
+     *
+     * @example
+     * paddingY='2'
+     * paddingY={{ xs: '2', sm: '3', md: '4', lg: '5', xl: '6' }}
+     */
+    paddingY?: CardPadding;
 };
 export type CardProps = CardContainerProps & CardAreaProps;
+/**
+ * Helper for picking card area props from a superset of component props.
+ */
+export declare function pickCardAreaProps(props: Partial<CardAreaProps>): Partial<Partial<CardAreaProps>>;
 declare function CardContainer(props: CardContainerProps): React.JSX.Element;
-declare function CardArea({ background, children, padding }: CardAreaProps): React.JSX.Element;
+declare function CardArea({ background, children, padding, paddingX, paddingY, }: CardAreaProps): React.JSX.Element;
 /**
  * A styled container that groups related content.
  *
@@ -80,6 +103,30 @@ declare function CardArea({ background, children, padding }: CardAreaProps): Rea
  * ```
  *
  * @example
+ * _Border radius:_
+ * ```tsx
+ * <Card borderRadius="sm">Content</Card>
+ * ```
+ *
+ * @example
+ * _Padding:_
+ * ```tsx
+ * <Card padding={{ xs: '2', sm: '3', md: '4', lg: '5', xl: '6' }}>Content</Card>
+ * ```
+ *
+ * @example
+ * _PaddingX:_
+ * ```tsx
+ * <Card paddingX="3">Content</Card>
+ * ```
+ *
+ * @example
+ * _PaddingY:_
+ * ```tsx
+ * <Card paddingY={{ xs: '1', sm: '2', md: '3'}}>Content</Card>
+ * ```
+ *
+ * @example
  * _Composition of parts:_
  * ```tsx
  * <Card.Container variant="outlined">

package/Card/Card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../src/Card/Card.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzE,OAAO,EACL,oBAAoB,EACpB,WAAW,EACX,mBAAmB,EACpB,MAAM,UAAU,CAAC;AAClB,OAAO,EACL,cAAc,EAKf,MAAM,kBAAkB,CAAC;AAO1B,KAAK,UAAU,GAAG,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAEhD,MAAM,MAAM,cAAc,GACtB,SAAS,GACT,WAAW,GACX,mBAAmB,CAAC,OAAO,CAAC,CAAC;AACjC,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,UAAU,GAAG,SAAS,CAAC;AAC3D,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,CAAC;AACtE,MAAM,MAAM,WAAW,GAAG,cAAc,CAAC,UAAU,CAAC,CAAC;AAErD,MAAM,MAAM,kBAAkB,GAAG;IAC/B,6CAA6C;IAC7C,EAAE,CAAC,EAAE,WAAW,CAAC;IAEjB,2BAA2B;IAC3B,QAAQ,EAAE,SAAS,CAAC;IAEpB,sEAAsE;IACtE,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,sEAAsE;IACtE,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;OAEG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IAEpB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;OAEG;IACH,SAAS,CAAC,EAAE,WAAW,CAAC;CACzB,GAAG,iBAAiB,CAAC,WAAW,CAAC,CAAC;AAEnC,MAAM,MAAM,aAAa,GAAG;IAC1B,iFAAiF;IACjF,UAAU,CAAC,EAAE,cAAc,CAAC;IAE5B,gCAAgC;IAChC,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;CACvB,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG,kBAAkB,GAAG,aAAa,CAAC;AAE3D,iBAAS,aAAa,CAAC,KAAK,EAAE,kBAAkB,qBA2C/C;AAED,iBAAS,QAAQ,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAa,EAAE,EAAE,aAAa,qBAevE;AAaD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8CG;AACH,wBAAgB,IAAI,CAAC,KAAK,EAAE,SAAS,qBASpC;yBATe,IAAI"}
+{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../src/Card/Card.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzE,OAAO,EACL,YAAY,EACZ,oBAAoB,EACpB,WAAW,EACX,mBAAmB,EACpB,MAAM,UAAU,CAAC;AAClB,OAAO,EACL,cAAc,EAKf,MAAM,kBAAkB,CAAC;AAS1B,KAAK,UAAU,GAAG,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAEhD,MAAM,MAAM,cAAc,GACtB,SAAS,GACT,WAAW,GACX,mBAAmB,CAAC,OAAO,CAAC,CAAC;AACjC,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,UAAU,GAAG,SAAS,CAAC;AAC3D,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,CAAC;AACtE,MAAM,MAAM,WAAW,GAAG,cAAc,CAAC,UAAU,CAAC,CAAC;AAErD,MAAM,MAAM,kBAAkB,GAAG;IAC/B,6CAA6C;IAC7C,EAAE,CAAC,EAAE,WAAW,CAAC;IAEjB,2BAA2B;IAC3B,QAAQ,EAAE,SAAS,CAAC;IAEpB,sEAAsE;IACtE,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,sEAAsE;IACtE,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;OAEG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IAEpB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;OAEG;IACH,SAAS,CAAC,EAAE,WAAW,CAAC;IAExB;;OAEG;IACH,YAAY,CAAC,EAAE,YAAY,CAAC;CAC7B,GAAG,iBAAiB,CAAC,WAAW,CAAC,CAAC;AAEnC,MAAM,MAAM,aAAa,GAAG;IAC1B,iFAAiF;IACjF,UAAU,CAAC,EAAE,cAAc,CAAC;IAE5B,gCAAgC;IAChC,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,WAAW,CAAC;IAEvB;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,WAAW,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG,kBAAkB,GAAG,aAAa,CAAC;AAE3D;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,OAAO,CAAC,aAAa,CAAC,mCAS9D;AAED,iBAAS,aAAa,CAAC,KAAK,EAAE,kBAAkB,qBAkD/C;AAED,iBAAS,QAAQ,CAAC,EAChB,UAAU,EACV,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,QAAQ,GACT,EAAE,aAAa,qBA0Cf;AAsDD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsEG;AACH,wBAAgB,IAAI,CAAC,KAAK,EAAE,SAAS,qBAqBpC;yBArBe,IAAI"}

package/Card/Card.stories.d.ts

@@ -7,6 +7,9 @@ export declare const Outlined: Story;
 export declare const Solid: Story;
 export declare const Flagged: Story;
 export declare const Shadow: Story;
+export declare const BorderRadius: Story;
+export declare const Padding: Story;
+export declare const PaddingXAndPaddingY: Story;
 export declare const Composition: Story;
 export declare const ExampleCheckbox: Story;
 export declare const ExampleRadio: Story;

package/Card/Card.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Card.stories.d.ts","sourceRoot":"","sources":["../../src/Card/Card.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAalD,OAAO,EAAE,IAAI,EAAa,MAAM,QAAQ,CAAC;AAEzC,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAQnC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,IAAI,CAa3B,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,eAAO,MAAM,QAAQ,EAAE,KAEtB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAKnB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAWrB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAWpB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAazB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAgC7B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KA6C1B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAMzB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAM3B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAgB1B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAsB1B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAiB1B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAkBzB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAW5B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAoB5B,CAAC"}
+{"version":3,"file":"Card.stories.d.ts","sourceRoot":"","sources":["../../src/Card/Card.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAclD,OAAO,EAAE,IAAI,EAAa,MAAM,QAAQ,CAAC;AAEzC,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAQnC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,IAAI,CAc3B,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,eAAO,MAAM,QAAQ,EAAE,KAEtB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAKnB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAWrB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAWpB,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAW1B,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAWrB,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KAYjC,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAazB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAgC7B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KA6C1B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAMzB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAM3B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAgB1B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAsB1B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAiB1B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAkBzB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAW5B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAoB5B,CAAC"}

package/Card/index.js

@@ -1,4 +1,5 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const Card = require("../__chunks__/Card-D_PL5WWN.js");
+const Card = require("../__chunks__/Card-BHXE4xkl.js");
 exports.Card = Card.Card;
+exports.pickCardAreaProps = Card.pickCardAreaProps;

package/Card/index.mjs

@@ -1,4 +1,5 @@
-import { C } from "../__chunks__/Card-CBNT8prJ.mjs";
+import { C, p } from "../__chunks__/Card-DkkGa1Tq.mjs";
 export {
-  C as Card
+  C as Card,
+  p as pickCardAreaProps
 };

package/Checkbox/Checkbox.test.d.ts

@@ -1,3 +1,2 @@
-import { UserEvent } from "@testing-library/user-event/dist/types/setup/setup";
-export declare function selectCheckbox(user: UserEvent, el: HTMLElement): Promise<void>;
+export {};
 //# sourceMappingURL=Checkbox.test.d.ts.map

package/Checkbox/Checkbox.test.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.test.d.ts","sourceRoot":"","sources":["../../src/Checkbox/Checkbox.test.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,oDAAoD,CAAC;AA+F/E,wBAAsB,cAAc,CAAC,IAAI,EAAE,SAAS,EAAE,EAAE,EAAE,WAAW,iBAEpE"}
+{"version":3,"file":"Checkbox.test.d.ts","sourceRoot":"","sources":["../../src/Checkbox/Checkbox.test.tsx"],"names":[],"mappings":""}

package/Checkbox/index.js

@@ -1,5 +1,5 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const Checkbox = require("../__chunks__/Checkbox-DEl6pHno.js");
+const Checkbox = require("../__chunks__/Checkbox-ChUVjHwA.js");
 exports.Checkbox = Checkbox.Checkbox;
 exports.DEFAULT_SIZE = Checkbox.DEFAULT_SIZE;

package/Checkbox/index.mjs

@@ -1,4 +1,4 @@
-import { C, D } from "../__chunks__/Checkbox-Ag6okSMI.mjs";
+import { C, D } from "../__chunks__/Checkbox-BWFilQso.mjs";
 export {
   C as Checkbox,
   D as DEFAULT_SIZE

package/CodeBlock/index.js

@@ -17,19 +17,20 @@ var __spreadValues = (a, b) => {
 };
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
-const CodeSnippet = require("../__chunks__/CodeSnippet-CN1cTy14.js");
-const HorizontalStack = require("../__chunks__/HorizontalStack-BXWiVrLQ.js");
+const CodeSnippet = require("../__chunks__/CodeSnippet-tfOUcCdU.js");
+const HorizontalStack = require("../__chunks__/HorizontalStack-B2JZOgff.js");
 const utilities_css = require("../utilities/css.js");
 const utilities_react = require("../utilities/react.js");
-const omit = require("../__chunks__/omit-0LBTZvV9.js");
-const Icon = require("../__chunks__/Icon-C8Pv0WxJ.js");
-const Text = require("../__chunks__/Text-BIEBtikW.js");
-const Tooltip = require("../__chunks__/Tooltip-B3hdiIPX.js");
+const omit = require("../__chunks__/omit-Z0uTP2Xd.js");
+const Icon = require("../__chunks__/Icon-B5AFLpxS.js");
+const Text = require("../__chunks__/Text-D68nUAQK.js");
+const Tooltip = require("../__chunks__/Tooltip-DyIVNFqW.js");
 const useHover = require("../__chunks__/useHover-BIKwjrCT.js");
-const useFocusVisible = require("../__chunks__/useFocusVisible-Ck9pGy9i.js");
+const useFocusVisible = require("../__chunks__/useFocusVisible-D8TIwziQ.js");
+const mergeProps = require("../__chunks__/mergeProps-UQqzLbUj.js");
 const ExpandMore400 = require("../__chunks__/ExpandMore400-CJpvxyJm.js");
-const Menu = require("../__chunks__/Menu-DSXfR7ad.js");
-const UnstyledButton = require("../__chunks__/UnstyledButton-DMmFUqkd.js");
+const Menu = require("../__chunks__/Menu-CeeJaGmt.js");
+const UnstyledButton = require("../__chunks__/UnstyledButton-DwB-70Zg.js");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
   if (e) {
@@ -198,7 +199,7 @@ function useClipboard(options) {
   };
 }
 useClipboard_1 = dist.useClipboard = useClipboard;
-const CopyButton$1 = "_CopyButton_z1ltm_5";
+const CopyButton$1 = "_CopyButton_1bjen_5";
 const styles$1 = {
   CopyButton: CopyButton$1
 };
@@ -239,7 +240,7 @@ function useCopyButtonTooltipState() {
     }
   });
   return {
-    triggerProps: useFocusVisible.$3ef42575df84b30b$export$9d1611c77c2fe928(hoverProps, focusProps),
+    triggerProps: mergeProps.$3ef42575df84b30b$export$9d1611c77c2fe928(hoverProps, focusProps),
     tooltipState
   };
 }
@@ -264,12 +265,12 @@ function LanguageMenu(props) {
     key: language2
   }, CodeSnippet.friendlySnippetLanguageNames[language2]))));
 }
-const CodeBlock$1 = "_CodeBlock_1szzg_5";
-const header = "_header_1szzg_13";
-const headerTitle = "_headerTitle_1szzg_20";
-const divider = "_divider_1szzg_29";
-const colorPrimary = "_colorPrimary_1szzg_36";
-const colorSecondary = "_colorSecondary_1szzg_41";
+const CodeBlock$1 = "_CodeBlock_x7arz_5";
+const header = "_header_x7arz_13";
+const headerTitle = "_headerTitle_x7arz_20";
+const divider = "_divider_x7arz_29";
+const colorPrimary = "_colorPrimary_x7arz_36";
+const colorSecondary = "_colorSecondary_x7arz_41";
 const styles = {
   CodeBlock: CodeBlock$1,
   header,