@coinbase/cds-web 8.57.1 → 8.59.0

package/dts/dates/DateInput.d.ts

@@ -13,14 +13,7 @@ export type DateInputProps = DateInputBaseProps &
   };
 export declare const DateInput: React.MemoExoticComponent<
   React.ForwardRefExoticComponent<
-    Omit<DateInputOptions, 'intlDateFormat'> &
-      Omit<TextInputBaseProps, 'style' | 'defaultValue' | 'value' | 'inputNode'> & {
-        /** Date format separator character, e.g. the / in "MM/DD/YYYY". Defaults to forward slash (/). */
-        separator?: string;
-      } & {
-        className?: string;
-        style?: React.CSSProperties;
-      } & React.RefAttributes<HTMLInputElement>
+    Omit<DateInputProps, 'ref'> & React.RefAttributes<HTMLInputElement>
   >
 >;
 //# sourceMappingURL=DateInput.d.ts.map

package/dts/dates/DateInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DateInput.d.ts","sourceRoot":"","sources":["../../src/dates/DateInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyD,MAAM,OAAO,CAAC;AAE9E,OAAO,EAAE,KAAK,gBAAgB,EAAgB,MAAM,yCAAyC,CAAC;AAG9F,OAAO,EAAa,KAAK,kBAAkB,EAAE,KAAK,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAGhG,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,gBAAgB,EAAE,gBAAgB,CAAC,GACvE,IAAI,CAAC,kBAAkB,EAAE,WAAW,GAAG,OAAO,GAAG,cAAc,GAAG,OAAO,CAAC,GAAG;IAC3E,kGAAkG;IAClG,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEJ,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAC7C,IAAI,CAAC,cAAc,EAAE,WAAW,GAAG,OAAO,GAAG,cAAc,GAAG,OAAO,CAAC,GAAG;IACvE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAEJ,eAAO,MAAM,SAAS;IAVlB,kGAAkG;gBACtF,MAAM;;gBAKN,MAAM;YACV,KAAK,CAAC,aAAa;2CA0G9B,CAAC"}
+{"version":3,"file":"DateInput.d.ts","sourceRoot":"","sources":["../../src/dates/DateInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyD,MAAM,OAAO,CAAC;AAE9E,OAAO,EAAE,KAAK,gBAAgB,EAAgB,MAAM,yCAAyC,CAAC;AAG9F,OAAO,EAAa,KAAK,kBAAkB,EAAE,KAAK,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAGhG,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,gBAAgB,EAAE,gBAAgB,CAAC,GACvE,IAAI,CAAC,kBAAkB,EAAE,WAAW,GAAG,OAAO,GAAG,cAAc,GAAG,OAAO,CAAC,GAAG;IAC3E,kGAAkG;IAClG,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEJ,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAC7C,IAAI,CAAC,cAAc,EAAE,WAAW,GAAG,OAAO,GAAG,cAAc,GAAG,OAAO,CAAC,GAAG;IACvE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAEJ,eAAO,MAAM,SAAS,iIAuGrB,CAAC"}

package/dts/dates/DatePicker.d.ts

@@ -120,120 +120,7 @@ export type DatePickerProps = DatePickerBaseProps &
   };
 export declare const DatePicker: import('react').MemoExoticComponent<
   import('react').ForwardRefExoticComponent<
-    Pick<
-      CalendarBaseProps,
-      | 'disabled'
-      | 'previousArrowAccessibilityLabel'
-      | 'nextArrowAccessibilityLabel'
-      | 'highlightedDateAccessibilityHint'
-      | 'seedDate'
-      | 'disabledDates'
-      | 'highlightedDates'
-      | 'minDate'
-      | 'maxDate'
-      | 'disabledDateError'
-    > & {
-      /** Control the date value of the DatePicker. */
-      date: Date | null;
-      /** Callback function fired when the date changes, e.g. when a valid date is selected or unselected. */
-      onChangeDate: (selectedDate: Date | null) => void;
-      /** Control the error value of the DatePicker. */
-      error: DateInputValidationError | null;
-      /** Callback function fired when validation finds an error, e.g. required input fields and impossible or disabled dates. Will always be called after `onChangeDate`. */
-      onErrorDate: (error: DateInputValidationError | null) => void;
-      /** Callback function fired when the picker is opened. */
-      onOpen?: () => void;
-      /** Callback function fired when the picker is closed. Will always be called after `onCancel`, `onConfirm`, and `onChangeDate`. */
-      onClose?: () => void;
-      /** Callback function fired when the user selects a date using the picker. Interacting with the DateInput does not fire this callback. Will always be called before `onClose`. */
-      onConfirm?: () => void;
-      /** Callback function fired when the user closes the picker without selecting a date. Interacting with the DateInput does not fire this callback. Will always be called before `onClose`. */
-      onCancel?: () => void;
-      /**
-       * Accessibility label describing the calendar IconButton, which opens the calendar when pressed.
-       * @deprecated Use openCalendarAccessibilityLabel/closeCalendarAccessibilityLabel instead. This will be removed in a future major release.
-       * @deprecationExpectedRemoval v9
-       */
-      calendarIconButtonAccessibilityLabel?: string;
-      /**
-       * Accessibility label for the calendar IconButton when the popover is closed (opens the calendar when pressed).
-       * @default 'Open calendar'
-       */
-      openCalendarAccessibilityLabel?: string;
-      /**
-       * Accessibility label for the calendar IconButton when the popover is open (closes the calendar when pressed).
-       * @default 'Close calendar'
-       */
-      closeCalendarAccessibilityLabel?: string;
-    } & Pick<PopoverProps, 'showOverlay'> &
-      Omit<
-        DateInputProps,
-        | 'style'
-        | 'className'
-        | 'separator'
-        | 'date'
-        | 'disabledDates'
-        | 'minDate'
-        | 'maxDate'
-        | 'disabledDateError'
-        | 'onChangeDate'
-      > & {
-        /** Control the default open state of the Calendar popover. */
-        defaultOpen?: boolean;
-        /** Callback function fired when the DateInput text value changes. Prefer to use `onChangeDate` instead. Will always be called before `onChangeDate`. This prop should only be used for edge cases, such as custom error handling.  */
-        onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
-        /**
-         * If `true`, the focus trap will restore focus to the previously focused element when it unmounts.
-         *
-         * WARNING: If you disable this, you need to ensure that focus is restored properly so it doesn't end up on the body
-         * @default true
-         */
-        restoreFocusOnUnmount?: boolean;
-        /**
-         * Custom style to apply to the Calendar container.
-         * @deprecated Use `styles.calendar` instead. This will be removed in a future major release.
-         * @deprecationExpectedRemoval v9
-         */
-        calendarStyle?: React.CSSProperties;
-        /**
-         * Custom class name to apply to the Calendar container.
-         * @deprecated Use `classNames.calendar` instead. This will be removed in a future major release.
-         * @deprecationExpectedRemoval v9
-         */
-        calendarClassName?: string;
-        /**
-         * Custom style to apply to the DateInput.
-         * @deprecated Use `styles.dateInput` instead. This will be removed in a future major release.
-         * @deprecationExpectedRemoval v9
-         */
-        dateInputStyle?: React.CSSProperties;
-        /**
-         * Custom class name to apply to the DateInput.
-         * @deprecated Use `classNames.dateInput` instead. This will be removed in a future major release.
-         * @deprecationExpectedRemoval v9
-         */
-        dateInputClassName?: string;
-        /** Custom class names for the DateInput and Calendar subcomponents. */
-        classNames?: {
-          dateInput?: string;
-          calendar?: string;
-          calendarHeader?: string;
-          calendarTitle?: string;
-          calendarNavigation?: string;
-          calendarContent?: string;
-          calendarDay?: string;
-        };
-        /** Custom styles for the DateInput and Calendar subcomponents. */
-        styles?: {
-          dateInput?: React.CSSProperties;
-          calendar?: React.CSSProperties;
-          calendarHeader?: React.CSSProperties;
-          calendarTitle?: React.CSSProperties;
-          calendarNavigation?: React.CSSProperties;
-          calendarContent?: React.CSSProperties;
-          calendarDay?: React.CSSProperties;
-        };
-      } & import('react').RefAttributes<HTMLDivElement>
+    Omit<DatePickerProps, 'ref'> & import('react').RefAttributes<HTMLDivElement>
   >
 >;
 //# sourceMappingURL=DatePicker.d.ts.map

package/dts/dates/DatePicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../src/dates/DatePicker.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../src/dates/DatePicker.tsx"],"names":[],"mappings":"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"}

package/esm/alpha/combobox/Combobox.js

@@ -1,5 +1,5 @@
 const _excluded = ["ComboboxControlComponent"],
-  _excluded2 = ["type", "value", "onChange", "options", "open", "setOpen", "label", "accessibilityLabel", "controlAccessibilityLabel", "defaultOpen", "searchText", "onSearch", "defaultSearchText", "filterFunction", "SelectControlComponent", "ComboboxControlComponent", "hideSearchInput"];
+  _excluded2 = ["type", "value", "onChange", "options", "open", "setOpen", "label", "accessibilityLabel", "controlAccessibilityLabel", "defaultOpen", "searchText", "onSearch", "defaultSearchText", "filterFunction", "SelectControlComponent", "ComboboxControlComponent", "hideSearchInput", "font"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -68,7 +68,8 @@ const ComboboxBase = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((_ref2, ref) => {
       filterFunction,
       SelectControlComponent = DefaultSelectControl,
       ComboboxControlComponent = DefaultComboboxControl,
-      hideSearchInput
+      hideSearchInput,
+      font
     } = _ref2,
     props = _objectWithoutProperties(_ref2, _excluded2);
   const [searchTextInternal, setSearchTextInternal] = useState(defaultSearchText);
@@ -101,8 +102,9 @@ const ComboboxBase = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((_ref2, ref) => {
   const ComboboxControl = useCallback(props => /*#__PURE__*/_jsx(ComboboxControlContextAdapter, _objectSpread(_objectSpread({}, props), {}, {
     ComboboxControlComponent: ComboboxControlComponent,
     SelectControlComponent: SelectControlComponent,
-    controlRef: controlRef
-  })), [SelectControlComponent, ComboboxControlComponent]);
+    controlRef: controlRef,
+    font: font
+  })), [SelectControlComponent, ComboboxControlComponent, font]);
   return /*#__PURE__*/_jsx(ComboboxContext.Provider, {
     value: {
       searchText,

package/esm/alpha/combobox/DefaultComboboxControl.js

@@ -1,4 +1,4 @@
-const _excluded = ["SelectControlComponent", "value", "placeholder", "controlRef", "hideSearchInput", "options", "open", "setOpen", "compact", "align", "searchText", "onSearch", "accessibilityLabel"];
+const _excluded = ["SelectControlComponent", "value", "placeholder", "controlRef", "hideSearchInput", "options", "open", "setOpen", "compact", "align", "searchText", "onSearch", "font", "accessibilityLabel"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -29,6 +29,7 @@ export const DefaultComboboxControl = /*#__PURE__*/memo(_ref => {
       align,
       searchText,
       onSearch,
+      font = 'body',
       accessibilityLabel
     } = _ref,
     props = _objectWithoutProperties(_ref, _excluded);
@@ -60,6 +61,7 @@ export const DefaultComboboxControl = /*#__PURE__*/memo(_ref => {
     accessibilityLabel: computedAccessibilityLabel,
     align: align,
     compact: compact,
+    font: font,
     open: open,
     options: options,
     role: "combobox",
@@ -72,6 +74,7 @@ export const DefaultComboboxControl = /*#__PURE__*/memo(_ref => {
       width: "100%",
       children: /*#__PURE__*/_jsx(NativeInput, {
         ref: searchInputRef,
+        font: font,
         onChange: handleSearchChange,
         onClick: handleSearchClick,
         onKeyDown: event => {
@@ -86,7 +89,7 @@ export const DefaultComboboxControl = /*#__PURE__*/memo(_ref => {
         style: {
           paddingLeft: 0,
           paddingRight: 0,
-          height: hasValue ? 24 : compact ? 40 : 48,
+          height: !hasValue ? compact ? 40 : 48 : undefined,
           minWidth: 0,
           flexGrow: 1,
           width: '100%',
@@ -103,7 +106,7 @@ export const DefaultComboboxControl = /*#__PURE__*/memo(_ref => {
         as: "p",
         color: "fgMuted",
         display: "block",
-        font: "body",
+        font: font,
         overflow: "truncate",
         paddingY: 0,
         textAlign: align,

package/esm/alpha/select/DefaultSelectControl.js

@@ -1,4 +1,4 @@
-const _excluded = ["role", "type", "options", "value", "onChange", "open", "placeholder", "disabled", "setOpen", "variant", "helperText", "label", "labelVariant", "contentNode", "startNode", "endNode", "compact", "blendStyles", "align", "bordered", "borderWidth", "focusedBorderWidth", "maxSelectedOptionsToShow", "hiddenSelectedOptionsLabel", "removeSelectedOptionAccessibilityLabel", "accessibilityLabel", "ariaHaspopup", "tabIndex", "styles", "classNames"];
+const _excluded = ["role", "type", "options", "value", "onChange", "open", "placeholder", "disabled", "setOpen", "variant", "helperText", "label", "labelVariant", "contentNode", "startNode", "endNode", "compact", "blendStyles", "align", "font", "bordered", "borderWidth", "focusedBorderWidth", "maxSelectedOptionsToShow", "hiddenSelectedOptionsLabel", "removeSelectedOptionAccessibilityLabel", "accessibilityLabel", "ariaHaspopup", "tabIndex", "styles", "classNames"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -57,6 +57,7 @@ const DefaultSelectControlComponent = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(
       compact,
       blendStyles,
       align = 'start',
+      font = 'body',
       bordered = true,
       borderWidth = bordered ? 100 : 0,
       focusedBorderWidth = bordered ? undefined : 200,
@@ -219,13 +220,13 @@ const DefaultSelectControlComponent = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(
       as: "p",
       color: hasValue ? 'fg' : 'fgMuted',
       display: "block",
-      font: "body",
+      font: font,
       overflow: "truncate",
       textAlign: align,
       width: "100%",
       children: singleValueContent
     }) : singleValueContent;
-  }, [hasValue, isMultiSelect, singleValueContent, align, value, maxSelectedOptionsToShow, hiddenSelectedOptionsLabel, optionsMap, removeSelectedOptionAccessibilityLabel, handleUnselectValue]);
+  }, [hasValue, isMultiSelect, singleValueContent, font, align, value, maxSelectedOptionsToShow, hiddenSelectedOptionsLabel, optionsMap, removeSelectedOptionAccessibilityLabel, handleUnselectValue]);
   const inputNode = useMemo(() => /*#__PURE__*/_jsxs(Pressable, {
     ref: controlPressableRef,
     noScaleOnPress: true,

package/esm/alpha/select/Select.js

@@ -59,6 +59,7 @@ const SelectBase = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((_ref, ref) => {
     media,
     end,
     align,
+    font,
     bordered = true,
     SelectOptionComponent = DefaultSelectOption,
     SelectAllOptionComponent = DefaultSelectAllOption,
@@ -155,6 +156,7 @@ const SelectBase = /*#__PURE__*/memo(/*#__PURE__*/forwardRef((_ref, ref) => {
       compact: compact,
       disabled: disabled,
       endNode: endNode,
+      font: font,
       helperText: helperText,
       hiddenSelectedOptionsLabel: hiddenSelectedOptionsLabel,
       label: label,

package/esm/controls/Checkbox.css

@@ -1 +1 @@
-@layer cds{.checkboxCss-c198zdvk{position:relative;width:var(--controlSize-checkboxSize);height:var(--controlSize-checkboxSize);border-style:solid;-webkit-transition: border-color, background-color 0.1s linear;transition: border-color, background-color 0.1s linear;}.checkboxCss-c198zdvk:focus{outline:none;}.checkboxCss-c198zdvk:focus-visible{outline-style:solid;outline-width:2px;outline-color:var(--color-bgPrimary);outline-offset:2px;}}
+@layer cds{.checkboxCss-c198zdvk{position:relative;border-style:solid;-webkit-transition: border-color, background-color 0.1s linear;transition: border-color, background-color 0.1s linear;}.checkboxCss-c198zdvk:focus{outline:none;}.checkboxCss-c198zdvk:focus-visible{outline-style:solid;outline-width:2px;outline-color:var(--color-bgPrimary);outline-offset:2px;}}

package/esm/controls/Checkbox.js

@@ -1,4 +1,4 @@
-const _excluded = ["children", "checked", "indeterminate", "controlColor", "background", "borderColor", "borderRadius", "borderWidth", "elevation"];
+const _excluded = ["children", "checked", "indeterminate", "controlColor", "background", "borderColor", "borderRadius", "borderWidth", "elevation", "controlSize"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -26,12 +26,13 @@ const CheckboxWithRef = /*#__PURE__*/forwardRef(function CheckboxWithRef(_ref, r
       borderColor = checked || indeterminate ? 'bgPrimary' : 'bgLineHeavy',
       borderRadius = 100,
       borderWidth = 100,
-      elevation
+      elevation,
+      controlSize
     } = _ref,
     props = _objectWithoutProperties(_ref, _excluded);
   const filled = checked || indeterminate;
   const theme = useTheme();
-  const checkboxSize = theme.controlSize.checkboxSize;
+  const checkboxSize = controlSize !== null && controlSize !== void 0 ? controlSize : theme.controlSize.checkboxSize;
   const iconPadding = checkboxSize / 5;
   const iconSize = checkboxSize - iconPadding;
   const innerContainerMotionProps = useMotionProps({
@@ -67,6 +68,10 @@ const CheckboxWithRef = /*#__PURE__*/forwardRef(function CheckboxWithRef(_ref, r
       flexShrink: 0,
       justifyContent: "center",
       role: "presentation",
+      style: {
+        width: checkboxSize,
+        height: checkboxSize
+      },
       testID: "checkbox-outer",
       children: /*#__PURE__*/_jsx(motion.div, _objectSpread(_objectSpread({}, innerContainerMotionProps), {}, {
         "data-testid": "checkbox-inner",

package/esm/controls/CheckboxCell.js

@@ -1,4 +1,4 @@
-const _excluded = ["title", "description", "checked", "onChange", "disabled", "columnGap", "rowGap", "padding", "borderWidth", "borderRadius", "titleId", "descriptionId", "testID", "style", "value", "noScaleOnPress", "readOnly", "indeterminate", "className", "classNames", "styles"];
+const _excluded = ["title", "description", "checked", "onChange", "disabled", "columnGap", "rowGap", "padding", "borderWidth", "borderRadius", "titleId", "descriptionId", "testID", "style", "value", "noScaleOnPress", "readOnly", "indeterminate", "controlSize", "className", "classNames", "styles"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -35,6 +35,7 @@ const CheckboxCellWithRef = /*#__PURE__*/forwardRef(function CheckboxCell(_ref,
       noScaleOnPress = true,
       readOnly,
       indeterminate,
+      controlSize,
       className,
       classNames,
       styles
@@ -78,6 +79,7 @@ const CheckboxCellWithRef = /*#__PURE__*/forwardRef(function CheckboxCell(_ref,
         "aria-describedby": ariaDescribedBy,
         "aria-labelledby": ariaLabelledBy,
         checked: !!checked,
+        controlSize: controlSize,
         disabled: disabled,
         indeterminate: indeterminate,
         onChange: onChange,

package/esm/controls/NativeInput.css

@@ -1,3 +1,3 @@
-@layer cds{.baseCss-bgba8xt{font-size:var(--fontSize-body);line-height:var(--lineHeight-body);font-weight:var(--fontWeight-body);font-family:var(--fontFamily-body);min-width:0;-webkit-box-flex:2;-webkit-flex-grow:2;-ms-flex-positive:2;flex-grow:2;background-color:transparent;color:var(--color-fg);border-color:transparent;}.baseCss-bgba8xt::-webkit-outer-spin-button,.baseCss-bgba8xt::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}.baseCss-bgba8xt:focus{outline-style:none;box-shadow:none;border-color:transparent;}.baseCss-bgba8xt::-webkit-input-placeholder{color:var(--color-fgMuted);opacity:1;}.baseCss-bgba8xt::-moz-placeholder{color:var(--color-fgMuted);opacity:1;}.baseCss-bgba8xt:-ms-input-placeholder{color:var(--color-fgMuted);opacity:1;}.baseCss-bgba8xt::placeholder{color:var(--color-fgMuted);opacity:1;}.baseCss-bgba8xt[type='number']{-moz-appearance:textfield;}.baseCss-bgba8xt[readonly]:not(:disabled){background-color:var(--color-bgSecondary);}.baseCss-bgba8xt[type='search']::-ms-clear{display:none;width:0;height:0;}.baseCss-bgba8xt[type='search']::-ms-reveal{display:none;width:0;height:0;}.baseCss-bgba8xt[type='search']::-webkit-search-decoration,.baseCss-bgba8xt[type='search']::-webkit-search-cancel-button,.baseCss-bgba8xt[type='search']::-webkit-search-results-button,.baseCss-bgba8xt[type='search']::-webkit-search-results-decoration{display:none;}.baseCss-bgba8xt:-webkit-autofill,.baseCss-bgba8xt:-webkit-autofill:hover,.baseCss-bgba8xt:-webkit-autofill:focus,.baseCss-bgba8xt:-webkit-autofill:active{border-radius:var(--borderRadius-200);-webkit-text-fill-color:var(--color-fg);-webkit-transition:background-color 0s ease-in-out 5000s;transition:background-color 0s ease-in-out 5000s;}
+@layer cds{.baseCss-bgba8xt{min-width:0;-webkit-box-flex:2;-webkit-flex-grow:2;-ms-flex-positive:2;flex-grow:2;background-color:transparent;color:var(--color-fg);border-color:transparent;}.baseCss-bgba8xt::-webkit-outer-spin-button,.baseCss-bgba8xt::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}.baseCss-bgba8xt:focus{outline-style:none;box-shadow:none;border-color:transparent;}.baseCss-bgba8xt::-webkit-input-placeholder{color:var(--color-fgMuted);opacity:1;}.baseCss-bgba8xt::-moz-placeholder{color:var(--color-fgMuted);opacity:1;}.baseCss-bgba8xt:-ms-input-placeholder{color:var(--color-fgMuted);opacity:1;}.baseCss-bgba8xt::placeholder{color:var(--color-fgMuted);opacity:1;}.baseCss-bgba8xt[type='number']{-moz-appearance:textfield;}.baseCss-bgba8xt[readonly]:not(:disabled){background-color:var(--color-bgSecondary);}.baseCss-bgba8xt[type='search']::-ms-clear{display:none;width:0;height:0;}.baseCss-bgba8xt[type='search']::-ms-reveal{display:none;width:0;height:0;}.baseCss-bgba8xt[type='search']::-webkit-search-decoration,.baseCss-bgba8xt[type='search']::-webkit-search-cancel-button,.baseCss-bgba8xt[type='search']::-webkit-search-results-button,.baseCss-bgba8xt[type='search']::-webkit-search-results-decoration{display:none;}.baseCss-bgba8xt:-webkit-autofill,.baseCss-bgba8xt:-webkit-autofill:hover,.baseCss-bgba8xt:-webkit-autofill:focus,.baseCss-bgba8xt:-webkit-autofill:active{border-radius:var(--borderRadius-200);-webkit-text-fill-color:var(--color-fg);-webkit-transition:background-color 0s ease-in-out 5000s;transition:background-color 0s ease-in-out 5000s;}
 .originalContainerPaddingCss-o1mz6a5p{padding:var(--space-2);}
 .compactContainerPaddingCss-c1lt56dx{padding:var(--space-1);}}

package/esm/controls/NativeInput.js

@@ -1,4 +1,4 @@
-const _excluded = ["containerSpacing", "testID", "align", "onFocus", "onClick", "onBlur", "onKeyDown", "onChange", "accessibilityLabel", "accessibilityLabelledBy", "accessibilityHint", "compact", "className", "style"];
+const _excluded = ["containerSpacing", "testID", "align", "font", "onFocus", "onClick", "onBlur", "onKeyDown", "onChange", "accessibilityLabel", "accessibilityLabelledBy", "accessibilityHint", "compact", "className", "style"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -9,6 +9,7 @@ function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t =
 import React, { forwardRef, memo, useMemo } from 'react';
 import { cx } from '../cx';
 import { useTheme } from '../hooks/useTheme';
+import { Box } from '../layout';
 import { jsx as _jsx } from "react/jsx-runtime";
 const baseCss = "baseCss-bgba8xt";
 const originalContainerPaddingCss = "originalContainerPaddingCss-o1mz6a5p";
@@ -18,6 +19,7 @@ export const NativeInput = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Na
       containerSpacing,
       testID,
       align = 'start',
+      font = 'body',
       onFocus,
       onClick,
       onBlur,
@@ -39,13 +41,15 @@ export const NativeInput = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Na
     textAlign: align,
     colorScheme: activeColorScheme
   }, style), [align, activeColorScheme, style]);
-  return /*#__PURE__*/_jsx("input", _objectSpread({
+  return /*#__PURE__*/_jsx(Box, _objectSpread({
     ref: ref,
     "aria-describedby": accessibilityHint,
     "aria-label": accessibilityLabel,
     "aria-labelledby": accessibilityLabelledBy,
+    as: "input",
     className: cx(baseCss, containerSpacing !== null && containerSpacing !== void 0 ? containerSpacing : defaultContainerPadding, className),
     "data-testid": testID,
+    font: font,
     onBlur: onBlur,
     onChange: onChange,
     onClick: onClick,

package/esm/controls/Radio.css

@@ -1 +1 @@
-@layer cds{.baseCss-b1rohblb{position:relative;-webkit-appearance:radio;-moz-appearance:radio;appearance:radio;width:var(--controlSize-radioSize);height:var(--controlSize-radioSize);border-style:solid;border-radius:var(--borderRadius-1000);-webkit-transition:border-color 0.2s linear;transition:border-color 0.2s linear;}.baseCss-b1rohblb:focus{outline:none;}.baseCss-b1rohblb:focus-visible{outline-style:solid;outline-width:2px;outline-color:var(--color-bgPrimary);outline-offset:2px;}}
+@layer cds{.baseCss-b1rohblb{position:relative;-webkit-appearance:radio;-moz-appearance:radio;appearance:radio;border-style:solid;border-radius:var(--borderRadius-1000);-webkit-transition:border-color 0.2s linear;transition:border-color 0.2s linear;}.baseCss-b1rohblb:focus{outline:none;}.baseCss-b1rohblb:focus-visible{outline-style:solid;outline-width:2px;outline-color:var(--color-bgPrimary);outline-offset:2px;}}

package/esm/controls/Radio.js

@@ -1,4 +1,4 @@
-const _excluded = ["children", "controlColor", "checked", "background", "borderColor", "borderWidth", "elevation"];
+const _excluded = ["children", "controlColor", "checked", "background", "borderColor", "borderWidth", "elevation", "controlSize", "dotSize"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -17,7 +17,8 @@ import { jsx as _jsx } from "react/jsx-runtime";
 const DotSvg = _ref => {
   let {
     color = 'black',
-    width = 20
+    width = 20,
+    dotSize = 2 * width / 3
   } = _ref;
   return /*#__PURE__*/_jsx("svg", {
     fill: "none",
@@ -28,7 +29,7 @@ const DotSvg = _ref => {
       cx: "50%",
       cy: "50%",
       fill: color,
-      r: width / 3
+      r: dotSize / 2
     })
   });
 };
@@ -41,11 +42,13 @@ const RadioWithRef = /*#__PURE__*/forwardRef(function RadioWithRef(_ref2, ref) {
       background = 'bg',
       borderColor = checked ? controlColor : 'bgLineHeavy',
       borderWidth = 100,
-      elevation
+      elevation,
+      controlSize,
+      dotSize
     } = _ref2,
     props = _objectWithoutProperties(_ref2, _excluded);
   const theme = useTheme();
-  const iconWidth = theme.controlSize.radioSize;
+  const iconWidth = controlSize !== null && controlSize !== void 0 ? controlSize : theme.controlSize.radioSize;
   const innerContainerMotionProps = useMotionProps({
     enterConfigs: [checkboxOpacityEnterConfig, checkboxScaleEnterConfig],
     exitConfigs: [checkboxOpacityExitConfig, checkboxScaleExitConfig],
@@ -68,6 +71,10 @@ const RadioWithRef = /*#__PURE__*/forwardRef(function RadioWithRef(_ref2, ref) {
       flexShrink: 0,
       justifyContent: "center",
       role: "presentation",
+      style: {
+        width: iconWidth,
+        height: iconWidth
+      },
       children: /*#__PURE__*/_jsx(motion.div, _objectSpread(_objectSpread({}, innerContainerMotionProps), {}, {
         children: checked &&
         /*#__PURE__*/
@@ -77,6 +84,7 @@ const RadioWithRef = /*#__PURE__*/forwardRef(function RadioWithRef(_ref2, ref) {
           testID: "radio-icon",
           children: /*#__PURE__*/_jsx(DotSvg, {
             color: "currentColor",
+            dotSize: dotSize,
             width: iconWidth
           })
         })

package/esm/controls/SearchInput.js

@@ -1,4 +1,4 @@
-const _excluded = ["onChange", "onClear", "onChangeText", "onSearch", "testID", "value", "compact", "hideStartIcon", "hideEndIcon", "startIcon", "end", "startIconAccessibilityLabel", "clearIconAccessibilityLabel"];
+const _excluded = ["onChange", "onClear", "onChangeText", "onSearch", "testID", "value", "compact", "hideStartIcon", "hideEndIcon", "startIcon", "end", "startIconAccessibilityLabel", "clearIconAccessibilityLabel", "borderRadius"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -34,7 +34,8 @@ export const SearchInput = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Se
       startIcon,
       end,
       startIconAccessibilityLabel = 'Back',
-      clearIconAccessibilityLabel = 'Clear search query'
+      clearIconAccessibilityLabel = 'Clear search query',
+      borderRadius = 1000
     } = _ref,
     props = _objectWithoutProperties(_ref, _excluded);
   const internalRef = useRef(null);
@@ -59,7 +60,7 @@ export const SearchInput = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Se
   const determineStartIconAccessibilityLabel = useMemo(() => startIcon === 'backArrow' ? startIconAccessibilityLabel : undefined, [startIconAccessibilityLabel, startIcon]);
   return /*#__PURE__*/_jsx(TextInput, _objectSpread({
     ref: refs,
-    borderRadius: 1000,
+    borderRadius: borderRadius,
     className: cx(baseCss, compact && compactCss),
     end: end !== null && end !== void 0 ? end : !!value && !hideEndIcon && /*#__PURE__*/_jsx(Box, {
       marginEnd: compact ? -0.5 : 0,

package/esm/controls/TextInput.js

@@ -1,4 +1,4 @@
-const _excluded = ["label", "accessibilityLabel", "helperText", "variant", "testID", "testIDMap", "start", "end", "width", "disabled", "align", "compact", "suffix", "onFocus", "onBlur", "borderRadius", "height", "inputNode", "bordered", "focusedBorderWidth", "enableColorSurge", "helperTextErrorIconAccessibilityLabel", "labelVariant", "labelNode", "inputBackground"];
+const _excluded = ["label", "accessibilityLabel", "helperText", "variant", "testID", "testIDMap", "start", "end", "width", "disabled", "align", "font", "compact", "suffix", "onFocus", "onBlur", "borderRadius", "height", "inputNode", "bordered", "focusedBorderWidth", "enableColorSurge", "helperTextErrorIconAccessibilityLabel", "labelVariant", "labelNode", "inputBackground"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -56,6 +56,7 @@ export const TextInput = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Text
       width = '100%',
       disabled = false,
       align = 'start',
+      font = 'body',
       compact = false,
       suffix = '',
       onFocus,
@@ -71,7 +72,7 @@ export const TextInput = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Text
       labelNode,
       inputBackground
     } = _ref,
-    htmlInputElmProps = _objectWithoutProperties(_ref, _excluded);
+    nativeInputRestProps = _objectWithoutProperties(_ref, _excluded);
   const [focused, setFocused] = useState(false);
   const focusedVariant = useInputVariant(focused, variant);
   const internalRef = useRef();
@@ -108,11 +109,11 @@ export const TextInput = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Text
 
   // Define a distinct read-only style to differentiate it from the disabled style.
   const readOnlyInputBackground = useMemo(() => {
-    if (!disabled && htmlInputElmProps.readOnly) {
+    if (!disabled && nativeInputRestProps.readOnly) {
       return 'bgSecondary';
     }
     return undefined;
-  }, [disabled, htmlInputElmProps.readOnly]);
+  }, [disabled, nativeInputRestProps.readOnly]);
   const hasLabel = useMemo(() => !!label || !!labelNode, [label, labelNode]);
   const inputElement = useMemo(() => {
     /** Ensures that the renderedInput has the blurring, focusing, disabled features */
@@ -142,12 +143,13 @@ export const TextInput = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function Text
       "data-labelvariant": compact || !hasLabel ? 'outside' : labelVariant,
       "data-start": !!start || compact,
       disabled: disabled,
+      font: font,
       id: shouldSetLabelId ? labelId : undefined,
       onBlur: handleOnBlur,
       onFocus: handleOnFocus,
       testID: testID
-    }, htmlInputElmProps));
-  }, [inputNode, refs, shouldSetHelperTextId, helperTextId, accessibilityLabel, label, hasLabel, align, variant, compact, labelVariant, start, disabled, shouldSetLabelId, labelId, handleOnBlur, handleOnFocus, testID, htmlInputElmProps]);
+    }, nativeInputRestProps));
+  }, [inputNode, refs, shouldSetHelperTextId, helperTextId, accessibilityLabel, label, hasLabel, align, font, variant, compact, labelVariant, start, disabled, shouldSetLabelId, labelId, handleOnBlur, handleOnFocus, testID, nativeInputRestProps]);
   return /*#__PURE__*/_jsx(TextInputFocusVariantContext.Provider, {
     value: focused ? focusedVariant : undefined,
     children: /*#__PURE__*/_jsx(InputStack, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coinbase/cds-web",
-  "version": "8.57.1",
+  "version": "8.59.0",
   "description": "Coinbase Design System - Web",
   "repository": {
     "type": "git",
@@ -207,9 +207,9 @@
     "react-dom": "^18.3.1"
   },
   "dependencies": {
-    "@coinbase/cds-common": "^8.57.1",
+    "@coinbase/cds-common": "^8.59.0",
     "@coinbase/cds-icons": "^5.13.0",
-    "@coinbase/cds-illustrations": "^4.35.0",
+    "@coinbase/cds-illustrations": "^4.36.0",
     "@coinbase/cds-lottie-files": "^3.3.4",
     "@coinbase/cds-utils": "^2.3.5",
     "@floating-ui/react-dom": "^2.1.1",