@wordpress/components 30.6.1 → 30.7.1-next.36001005c.0

package/build-style/style.css

@@ -178,7 +178,6 @@
   min-height: 24px;
   border-radius: 2px;
   line-height: 0;
-  max-width: 100%;
   display: inline-block;
 }
 .components-badge:where(.is-default) {
@@ -258,6 +257,7 @@
   text-decoration: none;
   font-family: inherit;
   font-size: 13px;
+  font-weight: 499;
   margin: 0;
   border: 0;
   cursor: pointer;
@@ -437,6 +437,7 @@ p + .components-button.is-tertiary {
   background: none;
   outline: none;
   text-align: left;
+  font-weight: 400;
   color: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
   text-decoration: underline;
 }
@@ -536,6 +537,7 @@ p + .components-button.is-tertiary {
 .components-button svg {
   fill: currentColor;
   outline: none;
+  flex-shrink: 0;
 }
 @media (forced-colors: active) {
   .components-button svg {
@@ -1597,6 +1599,7 @@ body.is-dragging-components-draggable {
   outline: none;
   cursor: pointer;
   white-space: nowrap;
+  font-weight: 400;
 }
 .components-dropdown-menu__menu .components-dropdown-menu__menu-item.has-separator,
 .components-dropdown-menu__menu .components-menu-item.has-separator {
@@ -2143,13 +2146,14 @@ body.is-dragging-components-draggable {
   color: #757575;
   text-transform: uppercase;
   font-size: 11px;
-  font-weight: 500;
+  font-weight: 499;
   white-space: nowrap;
 }
 
 .components-menu-item__button,
 .components-menu-item__button.components-button {
   width: 100%;
+  font-weight: 400;
 }
 .components-menu-item__button[role=menuitemradio] .components-menu-item__item:only-child, .components-menu-item__button[role=menuitemcheckbox] .components-menu-item__item:only-child,
 .components-menu-item__button.components-button[role=menuitemradio] .components-menu-item__item:only-child,
@@ -2595,7 +2599,7 @@ body.is-dragging-components-draggable {
   padding: 16px 48px 16px 16px;
   outline: none;
   width: 100%;
-  font-weight: 500;
+  font-weight: 499;
   text-align: left;
   color: #1e1e1e;
   border: none;
@@ -3422,7 +3426,7 @@ body.lockscroll {
   cursor: pointer;
   padding: 3px 16px;
   margin-left: 0;
-  font-weight: 500;
+  font-weight: 400;
 }
 .components-tab-panel__tabs-item:focus:not(:disabled) {
   position: relative;

package/build-types/color-palette/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/color-palette/styles.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,YAAY;;;;;;;;;UAQxB,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/color-palette/styles.ts"],"names":[],"mappings":"AAWA,eAAO,MAAM,YAAY;;;;;;;;;UAQxB,CAAC"}

package/build-types/date-time/date/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/date-time/date/styles.ts"],"names":[],"mappings":"AAcA,eAAO,MAAM,OAAO;;SAO8B,MAC/C,WAAW;yGANb,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;;;UAMrB,CAAC;AAEF,eAAO,MAAM,uBAAuB;;UAEnC,CAAC;AAEF,eAAO,MAAM,mBAAmB;;UAE/B,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;;;;;;UAQ5B,CAAC;AAEF,eAAO,MAAM,QAAQ;;SAvB6B,MAC/C,WAAW;yGA4Bb,CAAC;AAEF,eAAO,MAAM,SAAS;;SA/B4B,MAC/C,WAAW;yGAkCb,CAAC;AAEF,eAAO,MAAM,SAAS;;;YAIb,MAAM;gBACF,OAAO;aACV,OAAO;eACL,OAAO;UAmElB,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/date-time/date/styles.ts"],"names":[],"mappings":"AAcA,eAAO,MAAM,OAAO;;SAO8B,MAC/C,WAAW;yGANb,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;;;UAMrB,CAAC;AAEF,eAAO,MAAM,uBAAuB;;UAEnC,CAAC;AAEF,eAAO,MAAM,mBAAmB;;UAE/B,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;;;;;;UAQ5B,CAAC;AAEF,eAAO,MAAM,QAAQ;;SAvB6B,MAC/C,WAAW;yGA4Bb,CAAC;AAEF,eAAO,MAAM,SAAS;;SA/B4B,MAC/C,WAAW;yGAkCb,CAAC;AAEF,eAAO,MAAM,SAAS;;;YAIb,MAAM;gBACF,OAAO;aACV,OAAO;eACL,OAAO;UAoElB,CAAC"}

package/build-types/font-size-picker/font-size-picker-select.d.ts

@@ -1,6 +1,3 @@
-/**
- * Internal dependencies
- */
 import type { FontSizePickerSelectProps } from './types';
 declare const FontSizePickerSelect: (props: FontSizePickerSelectProps) => import("react").JSX.Element;
 export default FontSizePickerSelect;

package/build-types/font-size-picker/font-size-picker-select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"font-size-picker-select.d.ts","sourceRoot":"","sources":["../../src/font-size-picker/font-size-picker-select.tsx"],"names":[],"mappings":"AAMA;;GAEG;AACH,OAAO,KAAK,EACX,yBAAyB,EAEzB,MAAM,SAAS,CAAC;AAUjB,QAAA,MAAM,oBAAoB,UAAY,yBAAyB,gCA+E9D,CAAC;AAEF,eAAe,oBAAoB,CAAC"}
+{"version":3,"file":"font-size-picker-select.d.ts","sourceRoot":"","sources":["../../src/font-size-picker/font-size-picker-select.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EACX,yBAAyB,EAEzB,MAAM,SAAS,CAAC;AASjB,QAAA,MAAM,oBAAoB,UAAY,yBAAyB,gCA+C9D,CAAC;AAEF,eAAe,oBAAoB,CAAC"}

package/build-types/font-size-picker/font-size-picker-toggle-group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"font-size-picker-toggle-group.d.ts","sourceRoot":"","sources":["../../src/font-size-picker/font-size-picker-toggle-group.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,8BAA8B,EAAE,MAAM,SAAS,CAAC;AAE9D,QAAA,MAAM,yBAAyB,UAAY,8BAA8B,gCA+ExE,CAAC;AAEF,eAAe,yBAAyB,CAAC"}
+{"version":3,"file":"font-size-picker-toggle-group.d.ts","sourceRoot":"","sources":["../../src/font-size-picker/font-size-picker-toggle-group.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,8BAA8B,EAAE,MAAM,SAAS,CAAC;AAE9D,QAAA,MAAM,yBAAyB,UAAY,8BAA8B,gCAyBxE,CAAC;AAEF,eAAe,yBAAyB,CAAC"}

package/build-types/font-size-picker/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/font-size-picker/index.tsx"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAiRnD,eAAO,MAAM,cAAc,qGAA0C,CAAC;AAEtE,eAAe,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/font-size-picker/index.tsx"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAwPnD,eAAO,MAAM,cAAc,qGAA0C,CAAC;AAEtE,eAAe,cAAc,CAAC"}

package/build-types/font-size-picker/styles.d.ts

@@ -18,7 +18,4 @@ export declare const HeaderLabel: import("@emotion/styled").StyledComponent<impo
 } & import("react").RefAttributes<any> & {
     theme?: import("@emotion/react").Theme;
 }, {}, {}>;
-export declare const StyledCustomSelectControl: import("@emotion/styled").StyledComponent<import("../custom-select-control/types").CustomSelectProps<import("../custom-select-control/types").CustomSelectOption> & {
-    theme?: import("@emotion/react").Theme;
-}, {}, {}>;
 //# sourceMappingURL=styles.d.ts.map

package/build-types/font-size-picker/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/font-size-picker/styles.ts"],"names":[],"mappings":"AAcA,eAAO,MAAM,SAAS;;SAWc,MAAO,WACpC;2HAPN,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;UAElB,CAAC;AAEF,eAAO,MAAM,YAAY;;UAExB,CAAC;AAEF,eAAO,MAAM,WAAW;;;;UAKvB,CAAC;AAGF,eAAO,MAAM,yBAAyB;;UAKrC,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/font-size-picker/styles.ts"],"names":[],"mappings":"AAaA,eAAO,MAAM,SAAS;;SAeR,MAAO,WAAW;2HAV/B,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;UAElB,CAAC;AAEF,eAAO,MAAM,YAAY;;UAExB,CAAC;AAEF,eAAO,MAAM,WAAW;;;;UAKvB,CAAC"}

package/build-types/font-size-picker/types.d.ts

@@ -37,14 +37,6 @@ export type FontSizePickerProps = {
      * as a number, the component operates in "unitless mode" where the `units` property has no effect.
      */
     value?: number | string;
-    /**
-     * Determines how the `value` prop should be interpreted.
-     * - `'literal'`: The `value` prop contains the actual font size value (number or string)
-     * - `'slug'`: The `value` prop contains the slug of the selected font size
-     *
-     * @default 'literal'
-     */
-    valueMode?: 'literal' | 'slug';
     /**
      * If `true`, a slider will be displayed alongside the input field when a
      * custom font size is active. Has no effect when `disableCustomFontSizes`
@@ -100,17 +92,11 @@ export type FontSize = {
      * size. Used for the class generation process.
      */
     slug: string;
-    /**
-     * The `hint` property is an optional string that provides additional information
-     * about the font size, such as fluid typography ranges or custom descriptions.
-     * Consumers can use this to provide their own preferred hints.
-     */
-    hint?: string;
 };
-export type FontSizePickerSelectProps = Pick<FontSizePickerProps, 'value' | 'size' | 'valueMode'> & {
+export type FontSizePickerSelectProps = Pick<FontSizePickerProps, 'value' | 'size'> & {
     fontSizes: NonNullable<FontSizePickerProps['fontSizes']>;
     disableCustomFontSizes: NonNullable<FontSizePickerProps['disableCustomFontSizes']>;
-    onChange: (value: number | string | undefined, selectedItem?: FontSize) => void;
+    onChange: NonNullable<FontSizePickerProps['onChange']>;
     onSelectCustom: () => void;
     __next40pxDefaultSize: boolean;
 };
@@ -120,8 +106,8 @@ export type FontSizePickerSelectOption = {
     value?: FontSize['size'];
     hint?: string;
 };
-export type FontSizePickerToggleGroupProps = Pick<FontSizePickerProps, 'value' | 'size' | '__next40pxDefaultSize' | 'valueMode'> & {
+export type FontSizePickerToggleGroupProps = Pick<FontSizePickerProps, 'value' | 'size' | '__next40pxDefaultSize'> & {
     fontSizes: NonNullable<FontSizePickerProps['fontSizes']>;
-    onChange: (value: number | string | undefined, selectedItem?: FontSize) => void;
+    onChange: NonNullable<FontSizePickerProps['onChange']>;
 };
 //# sourceMappingURL=types.d.ts.map

package/build-types/font-size-picker/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/font-size-picker/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,mBAAmB,GAAG;IACjC;;;;;OAKG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;;OAGG;IACH,SAAS,CAAC,EAAE,QAAQ,EAAE,CAAC;IACvB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,CACV,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,EAClC,YAAY,CAAC,EAAE,QAAQ,KACnB,IAAI,CAAC;IACV;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAC/B;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;;;;OAQG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,kBAAkB,CAAC;CACtC,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG;IACtB;;;;OAIG;IACH,IAAI,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAC3C,mBAAmB,EACnB,OAAO,GAAG,MAAM,GAAG,WAAW,CAC9B,GAAG;IACH,SAAS,EAAE,WAAW,CAAE,mBAAmB,CAAE,WAAW,CAAE,CAAE,CAAC;IAC7D,sBAAsB,EAAE,WAAW,CAClC,mBAAmB,CAAE,wBAAwB,CAAE,CAC/C,CAAC;IACF,QAAQ,EAAE,CACT,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,EAClC,YAAY,CAAC,EAAE,QAAQ,KACnB,IAAI,CAAC;IACV,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,qBAAqB,EAAE,OAAO,CAAC;CAC/B,CAAC;AAEF,MAAM,MAAM,0BAA0B,GAAG;IACxC,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,QAAQ,CAAE,MAAM,CAAE,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,8BAA8B,GAAG,IAAI,CAChD,mBAAmB,EACnB,OAAO,GAAG,MAAM,GAAG,uBAAuB,GAAG,WAAW,CACxD,GAAG;IACH,SAAS,EAAE,WAAW,CAAE,mBAAmB,CAAE,WAAW,CAAE,CAAE,CAAC;IAC7D,QAAQ,EAAE,CACT,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,EAClC,YAAY,CAAC,EAAE,QAAQ,KACnB,IAAI,CAAC;CACV,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/font-size-picker/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,mBAAmB,GAAG;IACjC;;;;;OAKG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;;OAGG;IACH,SAAS,CAAC,EAAE,QAAQ,EAAE,CAAC;IACvB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,CACV,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,EAClC,YAAY,CAAC,EAAE,QAAQ,KACnB,IAAI,CAAC;IACV;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;;;;OAQG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,kBAAkB,CAAC;CACtC,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG;IACtB;;;;OAIG;IACH,IAAI,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,IAAI,EAAE,MAAM,CAAC;CACb,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAC3C,mBAAmB,EACnB,OAAO,GAAG,MAAM,CAChB,GAAG;IACH,SAAS,EAAE,WAAW,CAAE,mBAAmB,CAAE,WAAW,CAAE,CAAE,CAAC;IAC7D,sBAAsB,EAAE,WAAW,CAClC,mBAAmB,CAAE,wBAAwB,CAAE,CAC/C,CAAC;IACF,QAAQ,EAAE,WAAW,CAAE,mBAAmB,CAAE,UAAU,CAAE,CAAE,CAAC;IAC3D,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,qBAAqB,EAAE,OAAO,CAAC;CAC/B,CAAC;AAEF,MAAM,MAAM,0BAA0B,GAAG;IACxC,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,QAAQ,CAAE,MAAM,CAAE,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,8BAA8B,GAAG,IAAI,CAChD,mBAAmB,EACnB,OAAO,GAAG,MAAM,GAAG,uBAAuB,CAC1C,GAAG;IACH,SAAS,EAAE,WAAW,CAAE,mBAAmB,CAAE,WAAW,CAAE,CAAE,CAAC;IAC7D,QAAQ,EAAE,WAAW,CAAE,mBAAmB,CAAE,UAAU,CAAE,CAAE,CAAC;CAC3D,CAAC"}

package/build-types/font-size-picker/utils.d.ts

@@ -1,7 +1,7 @@
 /**
  * Internal dependencies
  */
-import type { FontSizePickerProps, FontSize } from './types';
+import type { FontSizePickerProps } from './types';
 /**
  * Some themes use css vars for their font sizes, so until we
  * have the way of calculating them don't display them.
@@ -10,13 +10,4 @@ import type { FontSizePickerProps, FontSize } from './types';
  * @return Whether the value is a simple css value.
  */
 export declare function isSimpleCssValue(value: NonNullable<FontSizePickerProps['value']>): boolean;
-/**
- * Generates hint text for a font size.
- * This function returns the hint provided by the consumer, if any.
- * If no hint is provided, it falls back to showing the size value for simple CSS values.
- *
- * @param fontSize The font size object to generate hint text for.
- * @return The hint text provided by the consumer, or the size value for simple CSS values, or undefined.
- */
-export declare function generateFontSizeHint(fontSize: FontSize): string | undefined;
 //# sourceMappingURL=utils.d.ts.map

package/build-types/font-size-picker/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/font-size-picker/utils.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,mBAAmB,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAE7D;;;;;;GAMG;AACH,wBAAgB,gBAAgB,CAC/B,KAAK,EAAE,WAAW,CAAE,mBAAmB,CAAE,OAAO,CAAE,CAAE,WAKpD;AAED;;;;;;;GAOG;AACH,wBAAgB,oBAAoB,CAAE,QAAQ,EAAE,QAAQ,GAAI,MAAM,GAAG,SAAS,CAY7E"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/font-size-picker/utils.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEnD;;;;;;GAMG;AACH,wBAAgB,gBAAgB,CAC/B,KAAK,EAAE,WAAW,CAAE,mBAAmB,CAAE,OAAO,CAAE,CAAE,WAKpD"}

package/build-types/popover/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/popover/index.tsx"],"names":[],"mappings":"AAwDA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AAC1D,OAAO,KAAK,EACX,YAAY,EAGZ,gBAAgB,EAChB,MAAM,SAAS,CAAC;AAIjB;;;;GAIG;AACH,eAAO,MAAM,SAAS,YAAY,CAAC;AAuanC,eAAO,MAAM,WAAW,6GAWvB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,eAAO,MAAM,OAAO;IAGlB;;OAEG;;;;IAIH;;;;OAIG;;;;CAKJ,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/popover/index.tsx"],"names":[],"mappings":"AAwDA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AAC1D,OAAO,KAAK,EACX,YAAY,EAGZ,gBAAgB,EAChB,MAAM,SAAS,CAAC;AAIjB;;;;GAIG;AACH,eAAO,MAAM,SAAS,YAAY,CAAC;AA4bnC,eAAO,MAAM,WAAW,6GAWvB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,eAAO,MAAM,OAAO;IAGlB;;OAEG;;;;IAIH;;;;OAIG;;;;CAKJ,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/build-types/utils/base-label.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"base-label.d.ts","sourceRoot":"","sources":["../../src/utils/base-label.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,mBAAmB,2CAK/B,CAAC"}
+{"version":3,"file":"base-label.d.ts","sourceRoot":"","sources":["../../src/utils/base-label.ts"],"names":[],"mappings":"AAYA,eAAO,MAAM,mBAAmB,2CAK/B,CAAC"}

package/build-types/utils/config-values.d.ts

@@ -37,6 +37,7 @@ declare const _default: {
     fontSizeXSmall: string;
     fontLineHeightBase: string;
     fontWeight: string;
+    fontWeightMedium: string;
     fontWeightHeading: string;
     gridBase: string;
     cardPaddingXSmall: string;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/components",
-	"version": "30.6.1",
+	"version": "30.7.1-next.36001005c.0",
 	"description": "UI components for WordPress.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -54,24 +54,24 @@
 		"@types/gradient-parser": "1.1.0",
 		"@types/highlight-words-core": "1.2.1",
 		"@use-gesture/react": "^10.3.1",
-		"@wordpress/a11y": "^4.33.1",
-		"@wordpress/base-styles": "^6.9.1",
-		"@wordpress/compose": "^7.33.1",
-		"@wordpress/date": "^5.33.1",
-		"@wordpress/deprecated": "^4.33.1",
-		"@wordpress/dom": "^4.33.1",
-		"@wordpress/element": "^6.33.1",
-		"@wordpress/escape-html": "^3.33.1",
-		"@wordpress/hooks": "^4.33.1",
-		"@wordpress/html-entities": "^4.33.1",
-		"@wordpress/i18n": "^6.6.1",
-		"@wordpress/icons": "^11.0.1",
-		"@wordpress/is-shallow-equal": "^5.33.1",
-		"@wordpress/keycodes": "^4.33.1",
-		"@wordpress/primitives": "^4.33.1",
-		"@wordpress/private-apis": "^1.33.1",
-		"@wordpress/rich-text": "^7.33.1",
-		"@wordpress/warning": "^3.33.1",
+		"@wordpress/a11y": "^4.33.1-next.36001005c.0",
+		"@wordpress/base-styles": "^6.10.1-next.36001005c.0",
+		"@wordpress/compose": "^7.33.1-next.36001005c.0",
+		"@wordpress/date": "^5.33.1-next.36001005c.0",
+		"@wordpress/deprecated": "^4.33.1-next.36001005c.0",
+		"@wordpress/dom": "^4.33.1-next.36001005c.0",
+		"@wordpress/element": "^6.33.1-next.36001005c.0",
+		"@wordpress/escape-html": "^3.33.1-next.36001005c.0",
+		"@wordpress/hooks": "^4.33.1-next.36001005c.0",
+		"@wordpress/html-entities": "^4.33.1-next.36001005c.0",
+		"@wordpress/i18n": "^6.6.1-next.36001005c.0",
+		"@wordpress/icons": "^11.0.1-next.36001005c.0",
+		"@wordpress/is-shallow-equal": "^5.33.1-next.36001005c.0",
+		"@wordpress/keycodes": "^4.33.1-next.36001005c.0",
+		"@wordpress/primitives": "^4.33.1-next.36001005c.0",
+		"@wordpress/private-apis": "^1.33.1-next.36001005c.0",
+		"@wordpress/rich-text": "^7.33.1-next.36001005c.0",
+		"@wordpress/warning": "^3.33.1-next.36001005c.0",
 		"change-case": "^4.1.2",
 		"clsx": "^2.1.1",
 		"colord": "^2.7.0",
@@ -97,5 +97,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "5f84bafdec1bed05247c1080c12f6a237951b862"
+	"gitHead": "b73a8a22e779c59efb8f911e32b681652f237d60"
 }

package/src/badge/styles.scss

@@ -18,7 +18,6 @@ $badge-colors: (
 	min-height: $grid-unit-30;
 	border-radius: $radius-small;
 	line-height: 0;
-	max-width: 100%;
 
 	// Prevents anchor text-decoration styles from being applied through a parent.
 	display: inline-block;

package/src/button/style.scss

@@ -15,13 +15,14 @@
 	text-decoration: none;
 	font-family: inherit;
 	font-size: $default-font-size;
+	font-weight: $font-weight-medium;
 	margin: 0;
 	border: 0;
 	cursor: pointer;
 	-webkit-appearance: none;
 	background: none;
 
-	@media not (prefers-reduced-motion) {
+	@media not ( prefers-reduced-motion ) {
 		transition: box-shadow 0.1s linear;
 	}
 
@@ -251,6 +252,7 @@
 		background: none;
 		outline: none;
 		text-align: left;
+		font-weight: $font-weight-regular;
 		color: $components-color-accent;
 		text-decoration: underline;
 
@@ -385,6 +387,7 @@
 	svg {
 		fill: currentColor;
 		outline: none;
+		flex-shrink: 0;
 
 		// Optimize for high contrast modes.
 		// See also https://blogs.windows.com/msedgedev/2020/09/17/styling-for-windows-high-contrast-with-new-standards-for-forced-colors/.

package/src/color-palette/styles.ts

@@ -7,11 +7,12 @@ import styled from '@emotion/styled';
  * Internal dependencies
  */
 import { Heading } from '../heading';
+import { CONFIG } from '../utils';
 
 export const ColorHeading = styled( Heading )`
 	text-transform: uppercase;
 	line-height: 24px;
-	font-weight: 500;
+	font-weight: ${ CONFIG.fontWeightMedium };
 	&&& {
 		font-size: 11px;
 		margin-bottom: 0;

package/src/custom-select-control-v2/custom-select.tsx

@@ -12,7 +12,7 @@ import { __, _n, sprintf } from '@wordpress/i18n';
 /**
  * Internal dependencies
  */
-import { VisuallyHidden } from '../visually-hidden';
+import { VisuallyHidden } from '..';
 import * as Styled from './styles';
 import type {
 	CustomSelectContext as CustomSelectContextType,

package/src/date-time/date/styles.ts

@@ -79,6 +79,7 @@ export const DayButton = styled( Button, {
 		border-radius: ${ CONFIG.radiusRound };
 		height: ${ space( 7 ) };
 		width: ${ space( 7 ) };
+		font-weight: 400;
 
 		${ ( props ) =>
 			props.isSelected &&

package/src/dimension-control/test/__snapshots__/index.test.js.snap

@@ -74,7 +74,7 @@ exports[`DimensionControl rendering renders with custom sizes 1`] = `
 
 .emotion-12.emotion-12.emotion-12 {
   font-size: 11px;
-  font-weight: 500;
+  font-weight: 499;
   line-height: 1.4;
   text-transform: uppercase;
   box-sizing: border-box;
@@ -356,7 +356,7 @@ exports[`DimensionControl rendering renders with defaults 1`] = `
 
 .emotion-12.emotion-12.emotion-12 {
   font-size: 11px;
-  font-weight: 500;
+  font-weight: 499;
   line-height: 1.4;
   text-transform: uppercase;
   box-sizing: border-box;
@@ -648,7 +648,7 @@ exports[`DimensionControl rendering renders with icon and custom icon label 1`]
 
 .emotion-12.emotion-12.emotion-12 {
   font-size: 11px;
-  font-weight: 500;
+  font-weight: 499;
   line-height: 1.4;
   text-transform: uppercase;
   box-sizing: border-box;
@@ -952,7 +952,7 @@ exports[`DimensionControl rendering renders with icon and default icon label 1`]
 
 .emotion-12.emotion-12.emotion-12 {
   font-size: 11px;
-  font-weight: 500;
+  font-weight: 499;
   line-height: 1.4;
   text-transform: uppercase;
   box-sizing: border-box;

package/src/dropdown-menu/style.scss

@@ -18,6 +18,7 @@
 		outline: none;
 		cursor: pointer;
 		white-space: nowrap;
+		font-weight: $font-weight-regular;
 
 		&.has-separator {
 			margin-top: 6px;

package/src/font-size-picker/README.md

@@ -103,16 +103,6 @@ The current font size value.
 
 -   Required: No
 
-### `valueMode`: `'literal' | 'slug'`
-
-Determines how the `value` prop should be interpreted.
-
-- `'literal'`: The `value` prop contains the actual font size value (number or string).
-- `'slug'`: The `value` prop contains the slug of the selected font size.
-
--   Required: No
--   Default: `'literal'`
-
 ### `withReset`: `boolean`
 
 If `true`, a reset button will be displayed alongside the input field when a custom font size is active. Has no effect when `disableCustomFontSizes` is `true`.

package/src/font-size-picker/font-size-picker-select.tsx

@@ -2,17 +2,16 @@
  * WordPress dependencies
  */
 import { __, sprintf } from '@wordpress/i18n';
-import { useMemo } from '@wordpress/element';
 
 /**
  * Internal dependencies
  */
+import CustomSelectControl from '../custom-select-control';
 import type {
 	FontSizePickerSelectProps,
 	FontSizePickerSelectOption,
 } from './types';
-import { generateFontSizeHint } from './utils';
-import { StyledCustomSelectControl } from './styles';
+import { isSimpleCssValue } from './utils';
 
 const DEFAULT_OPTION: FontSizePickerSelectOption = {
 	key: 'default',
@@ -21,19 +20,15 @@ const DEFAULT_OPTION: FontSizePickerSelectOption = {
 };
 
 const FontSizePickerSelect = ( props: FontSizePickerSelectProps ) => {
-	const {
-		__next40pxDefaultSize,
-		fontSizes,
-		value,
-		size,
-		valueMode = 'literal',
-		onChange,
-	} = props;
+	const { __next40pxDefaultSize, fontSizes, value, size, onChange } = props;
 
 	const options: FontSizePickerSelectOption[] = [
 		DEFAULT_OPTION,
 		...fontSizes.map( ( fontSize ) => {
-			const hint = generateFontSizeHint( fontSize );
+			let hint;
+			if ( isSimpleCssValue( fontSize.size ) ) {
+				hint = String( fontSize.size );
+			}
 			return {
 				key: fontSize.slug,
 				name: fontSize.name || fontSize.slug,
@@ -43,30 +38,11 @@ const FontSizePickerSelect = ( props: FontSizePickerSelectProps ) => {
 		} ),
 	];
 
-	const selectedOption = useMemo( () => {
-		if ( value === undefined ) {
-			return DEFAULT_OPTION;
-		}
-
-		// If valueMode is 'slug', find by slug
-		if ( valueMode === 'slug' ) {
-			const optionBySlug = options.find(
-				( option ) => option.key === value
-			);
-			if ( optionBySlug ) {
-				return optionBySlug;
-			}
-		}
-
-		// If valueMode is 'literal', find by value (size)
-		return (
-			options.find( ( option ) => option.value === value ) ??
-			DEFAULT_OPTION
-		);
-	}, [ value, valueMode, options ] );
+	const selectedOption =
+		options.find( ( option ) => option.value === value ) ?? DEFAULT_OPTION;
 
 	return (
-		<StyledCustomSelectControl
+		<CustomSelectControl
 			__next40pxDefaultSize={ __next40pxDefaultSize }
 			__shouldNotWarnDeprecated36pxSize
 			className="components-font-size-picker__select"
@@ -85,16 +61,7 @@ const FontSizePickerSelect = ( props: FontSizePickerSelectProps ) => {
 			}: {
 				selectedItem: FontSizePickerSelectOption;
 			} ) => {
-				// Find the corresponding FontSize object
-				const matchingFontSize =
-					selectedItem.key === 'default'
-						? undefined
-						: fontSizes.find(
-								( fontSize ) =>
-									fontSize.slug === selectedItem.key
-						  );
-
-				onChange( selectedItem.value, matchingFontSize );
+				onChange( selectedItem.value );
 			} }
 			size={ size }
 		/>

package/src/font-size-picker/font-size-picker-toggle-group.tsx

@@ -14,46 +14,7 @@ import { T_SHIRT_ABBREVIATIONS, T_SHIRT_NAMES } from './constants';
 import type { FontSizePickerToggleGroupProps } from './types';
 
 const FontSizePickerToggleGroup = ( props: FontSizePickerToggleGroupProps ) => {
-	const {
-		fontSizes,
-		value,
-		valueMode = 'literal',
-		__next40pxDefaultSize,
-		size,
-		onChange,
-	} = props;
-
-	// Find the current value based on valueMode
-	const currentValue = ( () => {
-		if ( ! value ) {
-			return undefined;
-		}
-
-		// If valueMode is 'slug', the value is already the slug
-		if ( valueMode === 'slug' ) {
-			return String( value );
-		}
-
-		// If valueMode is 'literal', find the font size by size value
-		// If multiple font sizes have the same size value, we can't distinguish them
-		// without additional information, so we return undefined to avoid incorrect selection
-		const matchingFontSizes = fontSizes.filter(
-			( fontSize ) => fontSize.size === value
-		);
-
-		// If there are multiple matches, return undefined to avoid selecting the wrong font size
-		if ( matchingFontSizes.length > 1 ) {
-			return undefined;
-		}
-
-		// Find the font size by size value
-		const fontSizeBySize = fontSizes.find(
-			( fontSize ) => fontSize.size === value
-		);
-
-		return fontSizeBySize?.slug;
-	} )();
-
+	const { fontSizes, value, __next40pxDefaultSize, size, onChange } = props;
 	return (
 		<ToggleGroupControl
 			__nextHasNoMarginBottom
@@ -61,30 +22,15 @@ const FontSizePickerToggleGroup = ( props: FontSizePickerToggleGroupProps ) => {
 			__shouldNotWarnDeprecated36pxSize
 			label={ __( 'Font size' ) }
 			hideLabelFromVision
-			value={ currentValue }
-			onChange={ ( newSlug: string | number | undefined ) => {
-				if ( newSlug === undefined ) {
-					onChange( undefined );
-				} else {
-					// Find the font size by slug
-					const selectedFontSize = fontSizes.find(
-						( fontSize ) => fontSize.slug === String( newSlug )
-					);
-					if ( selectedFontSize ) {
-						onChange(
-							selectedFontSize.size as number | string,
-							selectedFontSize
-						);
-					}
-				}
-			} }
+			value={ value }
+			onChange={ onChange }
 			isBlock
 			size={ size }
 		>
 			{ fontSizes.map( ( fontSize, index ) => (
 				<ToggleGroupControlOption
 					key={ fontSize.slug }
-					value={ fontSize.slug }
+					value={ fontSize.size }
 					label={ T_SHIRT_ABBREVIATIONS[ index ] }
 					aria-label={ fontSize.name || T_SHIRT_NAMES[ index ] }
 					showTooltip