@wordpress/components 29.5.2 → 29.5.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +5 -0
- package/build/private-apis.js +2 -0
- package/build/private-apis.js.map +1 -1
- package/build/toggle-group-control/toggle-group-control/component.js +1 -1
- package/build/toggle-group-control/toggle-group-control/component.js.map +1 -1
- package/build-module/private-apis.js +2 -0
- package/build-module/private-apis.js.map +1 -1
- package/build-module/toggle-group-control/toggle-group-control/component.js +1 -1
- package/build-module/toggle-group-control/toggle-group-control/component.js.map +1 -1
- package/build-types/popover/overlay-middlewares.d.ts +6 -1
- package/build-types/popover/overlay-middlewares.d.ts.map +1 -1
- package/build-types/private-apis.d.ts.map +1 -1
- package/package.json +6 -6
- package/src/private-apis.ts +2 -0
- package/src/toggle-group-control/toggle-group-control/component.tsx +1 -1
- package/tsconfig.tsbuildinfo +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -4,8 +4,13 @@
|
|
|
4
4
|
|
|
5
5
|
### Bug Fixes
|
|
6
6
|
|
|
7
|
+
- `ToggleGroupControl`: Fix active background for empty string value ([#69969](https://github.com/WordPress/gutenberg/pull/69969)).
|
|
7
8
|
- `Button`: Fix tertiary variant displaying incorrect text color in pressed and hover states ([#68542](https://github.com/WordPress/gutenberg/pull/68542)).
|
|
8
9
|
|
|
10
|
+
### Internal
|
|
11
|
+
|
|
12
|
+
- Mark `withIgnoreIMEEvents()` function as private API ([#70056](https://github.com/WordPress/gutenberg/pull/70056)).
|
|
13
|
+
|
|
9
14
|
### Enhancement
|
|
10
15
|
|
|
11
16
|
- `QueryControls`: Add menu_order sorting option if supported by the post type. ([#68781](https://github.com/WordPress/gutenberg/pull/68781)).
|
package/build/private-apis.js
CHANGED
|
@@ -11,6 +11,7 @@ var _contextSystemProvider = require("./context/context-system-provider");
|
|
|
11
11
|
var _theme = _interopRequireDefault(require("./theme"));
|
|
12
12
|
var _tabs = require("./tabs");
|
|
13
13
|
var _strings = require("./utils/strings");
|
|
14
|
+
var _withIgnoreImeEvents = require("./utils/with-ignore-ime-events");
|
|
14
15
|
var _lockUnlock = require("./lock-unlock");
|
|
15
16
|
var _badge = _interopRequireDefault(require("./badge"));
|
|
16
17
|
/**
|
|
@@ -25,6 +26,7 @@ const privateApis = exports.privateApis = {};
|
|
|
25
26
|
Theme: _theme.default,
|
|
26
27
|
Menu: _menu.Menu,
|
|
27
28
|
kebabCase: _strings.kebabCase,
|
|
29
|
+
withIgnoreIMEEvents: _withIgnoreImeEvents.withIgnoreIMEEvents,
|
|
28
30
|
Badge: _badge.default
|
|
29
31
|
});
|
|
30
32
|
//# sourceMappingURL=private-apis.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_utils","require","_menu","_contextSystemProvider","_theme","_interopRequireDefault","_tabs","_strings","_lockUnlock","_badge","privateApis","exports","lock","__experimentalPopoverLegacyPositionToPlacement","ComponentsContext","Tabs","Theme","Menu","kebabCase","Badge"],"sources":["@wordpress/components/src/private-apis.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport { positionToPlacement as __experimentalPopoverLegacyPositionToPlacement } from './popover/utils';\nimport { Menu } from './menu';\nimport { ComponentsContext } from './context/context-system-provider';\nimport Theme from './theme';\nimport { Tabs } from './tabs';\nimport { kebabCase } from './utils/strings';\nimport { lock } from './lock-unlock';\nimport Badge from './badge';\n\nexport const privateApis = {};\nlock( privateApis, {\n\t__experimentalPopoverLegacyPositionToPlacement,\n\tComponentsContext,\n\tTabs,\n\tTheme,\n\tMenu,\n\tkebabCase,\n\tBadge,\n} );\n"],"mappings":";;;;;;;AAGA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,sBAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAC,sBAAA,CAAAJ,OAAA;AACA,IAAAK,KAAA,GAAAL,OAAA;AACA,IAAAM,QAAA,GAAAN,OAAA;AACA,IAAAO,
|
|
1
|
+
{"version":3,"names":["_utils","require","_menu","_contextSystemProvider","_theme","_interopRequireDefault","_tabs","_strings","_withIgnoreImeEvents","_lockUnlock","_badge","privateApis","exports","lock","__experimentalPopoverLegacyPositionToPlacement","ComponentsContext","Tabs","Theme","Menu","kebabCase","withIgnoreIMEEvents","Badge"],"sources":["@wordpress/components/src/private-apis.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport { positionToPlacement as __experimentalPopoverLegacyPositionToPlacement } from './popover/utils';\nimport { Menu } from './menu';\nimport { ComponentsContext } from './context/context-system-provider';\nimport Theme from './theme';\nimport { Tabs } from './tabs';\nimport { kebabCase } from './utils/strings';\nimport { withIgnoreIMEEvents } from './utils/with-ignore-ime-events';\nimport { lock } from './lock-unlock';\nimport Badge from './badge';\n\nexport const privateApis = {};\nlock( privateApis, {\n\t__experimentalPopoverLegacyPositionToPlacement,\n\tComponentsContext,\n\tTabs,\n\tTheme,\n\tMenu,\n\tkebabCase,\n\twithIgnoreIMEEvents,\n\tBadge,\n} );\n"],"mappings":";;;;;;;AAGA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,sBAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAC,sBAAA,CAAAJ,OAAA;AACA,IAAAK,KAAA,GAAAL,OAAA;AACA,IAAAM,QAAA,GAAAN,OAAA;AACA,IAAAO,oBAAA,GAAAP,OAAA;AACA,IAAAQ,WAAA,GAAAR,OAAA;AACA,IAAAS,MAAA,GAAAL,sBAAA,CAAAJ,OAAA;AAXA;AACA;AACA;;AAWO,MAAMU,WAAW,GAAAC,OAAA,CAAAD,WAAA,GAAG,CAAC,CAAC;AAC7B,IAAAE,gBAAI,EAAEF,WAAW,EAAE;EAClBG,8CAA8C,EAA9CA,0BAA8C;EAC9CC,iBAAiB,EAAjBA,wCAAiB;EACjBC,IAAI,EAAJA,UAAI;EACJC,KAAK,EAALA,cAAK;EACLC,IAAI,EAAJA,UAAI;EACJC,SAAS,EAATA,kBAAS;EACTC,mBAAmB,EAAnBA,wCAAmB;EACnBC,KAAK,EAALA;AACD,CAAE,CAAC","ignoreList":[]}
|
|
@@ -54,7 +54,7 @@ function UnconnectedToggleGroupControl(props, forwardedRef) {
|
|
|
54
54
|
const [selectedElement, setSelectedElement] = (0, _element.useState)();
|
|
55
55
|
const [controlElement, setControlElement] = (0, _element.useState)();
|
|
56
56
|
const refs = (0, _compose.useMergeRefs)([setControlElement, forwardedRef]);
|
|
57
|
-
const selectedRect = (0, _elementRect.useTrackElementOffsetRect)(value
|
|
57
|
+
const selectedRect = (0, _elementRect.useTrackElementOffsetRect)(value !== null && value !== undefined ? selectedElement : undefined);
|
|
58
58
|
(0, _useAnimatedOffsetRect.useAnimatedOffsetRect)(controlElement, selectedRect, {
|
|
59
59
|
prefix: 'selected',
|
|
60
60
|
dataAttribute: 'indicator-animated',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_element","require","_context","_hooks","_baseControl","_interopRequireDefault","_styles","_interopRequireWildcard","styles","_asRadioGroup","_asButtonGroup","_elementRect","_compose","_useAnimatedOffsetRect","_deprecated36pxSize","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","UnconnectedToggleGroupControl","props","forwardedRef","__nextHasNoMarginBottom","__next40pxDefaultSize","__shouldNotWarnDeprecated36pxSize","className","isAdaptiveWidth","isBlock","isDeselectable","label","hideLabelFromVision","help","onChange","size","value","children","otherProps","useContextSystem","normalizedSize","selectedElement","setSelectedElement","useState","controlElement","setControlElement","refs","useMergeRefs","selectedRect","useTrackElementOffsetRect","undefined","useAnimatedOffsetRect","prefix","dataAttribute","transitionEndFilter","event","pseudoElement","roundRect","cx","useCx","classes","useMemo","toggleGroupControl","block","MainControl","ToggleGroupControlAsButtonGroup","ToggleGroupControlAsRadioGroup","maybeWarnDeprecated36pxSize","componentName","jsxs","__associatedWPComponentName","jsx","VisualLabelWrapper","VisualLabel","ref","ToggleGroupControl","exports","contextConnect","_default"],"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect, useContextSystem } from '../../context';\nimport { useCx } from '../../utils/hooks';\nimport BaseControl from '../../base-control';\nimport type { ToggleGroupControlProps } from '../types';\nimport { VisualLabelWrapper } from './styles';\nimport * as styles from './styles';\nimport { ToggleGroupControlAsRadioGroup } from './as-radio-group';\nimport { ToggleGroupControlAsButtonGroup } from './as-button-group';\nimport { useTrackElementOffsetRect } from '../../utils/element-rect';\nimport { useMergeRefs } from '@wordpress/compose';\nimport { useAnimatedOffsetRect } from '../../utils/hooks/use-animated-offset-rect';\nimport { maybeWarnDeprecated36pxSize } from '../../utils/deprecated-36px-size';\n\nfunction UnconnectedToggleGroupControl(\n\tprops: WordPressComponentProps< ToggleGroupControlProps, 'div', false >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\t__nextHasNoMarginBottom = false,\n\t\t__next40pxDefaultSize = false,\n\t\t__shouldNotWarnDeprecated36pxSize,\n\t\tclassName,\n\t\tisAdaptiveWidth = false,\n\t\tisBlock = false,\n\t\tisDeselectable = false,\n\t\tlabel,\n\t\thideLabelFromVision = false,\n\t\thelp,\n\t\tonChange,\n\t\tsize = 'default',\n\t\tvalue,\n\t\tchildren,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToggleGroupControl' );\n\n\tconst normalizedSize =\n\t\t__next40pxDefaultSize && size === 'default' ? '__unstable-large' : size;\n\n\tconst [ selectedElement, setSelectedElement ] = useState< HTMLElement >();\n\tconst [ controlElement, setControlElement ] = useState< HTMLElement >();\n\tconst refs = useMergeRefs( [ setControlElement, forwardedRef ] );\n\tconst selectedRect = useTrackElementOffsetRect(\n\t\tvalue || value === 0 ? selectedElement : undefined\n\t);\n\tuseAnimatedOffsetRect( controlElement, selectedRect, {\n\t\tprefix: 'selected',\n\t\tdataAttribute: 'indicator-animated',\n\t\ttransitionEndFilter: ( event ) => event.pseudoElement === '::before',\n\t\troundRect: true,\n\t} );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.toggleGroupControl( {\n\t\t\t\t\tisBlock,\n\t\t\t\t\tisDeselectable,\n\t\t\t\t\tsize: normalizedSize,\n\t\t\t\t} ),\n\t\t\t\tisBlock && styles.block,\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, cx, isBlock, isDeselectable, normalizedSize ]\n\t);\n\n\tconst MainControl = isDeselectable\n\t\t? ToggleGroupControlAsButtonGroup\n\t\t: ToggleGroupControlAsRadioGroup;\n\n\tmaybeWarnDeprecated36pxSize( {\n\t\tcomponentName: 'ToggleGroupControl',\n\t\tsize,\n\t\t__next40pxDefaultSize,\n\t\t__shouldNotWarnDeprecated36pxSize,\n\t} );\n\n\treturn (\n\t\t<BaseControl\n\t\t\thelp={ help }\n\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t__associatedWPComponentName=\"ToggleGroupControl\"\n\t\t>\n\t\t\t{ ! hideLabelFromVision && (\n\t\t\t\t<VisualLabelWrapper>\n\t\t\t\t\t<BaseControl.VisualLabel>{ label }</BaseControl.VisualLabel>\n\t\t\t\t</VisualLabelWrapper>\n\t\t\t) }\n\t\t\t<MainControl\n\t\t\t\t{ ...otherProps }\n\t\t\t\tsetSelectedElement={ setSelectedElement }\n\t\t\t\tclassName={ classes }\n\t\t\t\tisAdaptiveWidth={ isAdaptiveWidth }\n\t\t\t\tlabel={ label }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tref={ refs }\n\t\t\t\tsize={ normalizedSize }\n\t\t\t\tvalue={ value }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</MainControl>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * `ToggleGroupControl` is a form component that lets users choose options\n * represented in horizontal segments. To render options for this control use\n * `ToggleGroupControlOption` component.\n *\n * This component is intended for selecting a single persistent value from a set of options,\n * similar to a how a radio button group would work. If you simply want a toggle to switch between views,\n * use a `TabPanel` instead.\n *\n * Only use this control when you know for sure the labels of items inside won't\n * wrap. For items with longer labels, you can consider a `SelectControl` or a\n * `CustomSelectControl` component instead.\n *\n * ```jsx\n * import {\n * __experimentalToggleGroupControl as ToggleGroupControl,\n * __experimentalToggleGroupControlOption as ToggleGroupControlOption,\n * } from '@wordpress/components';\n *\n * function Example() {\n * return (\n * <ToggleGroupControl\n * label=\"my label\"\n * value=\"vertical\"\n * isBlock\n * __nextHasNoMarginBottom\n * __next40pxDefaultSize\n * >\n * <ToggleGroupControlOption value=\"horizontal\" label=\"Horizontal\" />\n * <ToggleGroupControlOption value=\"vertical\" label=\"Vertical\" />\n * </ToggleGroupControl>\n * );\n * }\n * ```\n */\nexport const ToggleGroupControl = contextConnect(\n\tUnconnectedToggleGroupControl,\n\t'ToggleGroupControl'\n);\n\nexport default ToggleGroupControl;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["_element","require","_context","_hooks","_baseControl","_interopRequireDefault","_styles","_interopRequireWildcard","styles","_asRadioGroup","_asButtonGroup","_elementRect","_compose","_useAnimatedOffsetRect","_deprecated36pxSize","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","UnconnectedToggleGroupControl","props","forwardedRef","__nextHasNoMarginBottom","__next40pxDefaultSize","__shouldNotWarnDeprecated36pxSize","className","isAdaptiveWidth","isBlock","isDeselectable","label","hideLabelFromVision","help","onChange","size","value","children","otherProps","useContextSystem","normalizedSize","selectedElement","setSelectedElement","useState","controlElement","setControlElement","refs","useMergeRefs","selectedRect","useTrackElementOffsetRect","undefined","useAnimatedOffsetRect","prefix","dataAttribute","transitionEndFilter","event","pseudoElement","roundRect","cx","useCx","classes","useMemo","toggleGroupControl","block","MainControl","ToggleGroupControlAsButtonGroup","ToggleGroupControlAsRadioGroup","maybeWarnDeprecated36pxSize","componentName","jsxs","__associatedWPComponentName","jsx","VisualLabelWrapper","VisualLabel","ref","ToggleGroupControl","exports","contextConnect","_default"],"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect, useContextSystem } from '../../context';\nimport { useCx } from '../../utils/hooks';\nimport BaseControl from '../../base-control';\nimport type { ToggleGroupControlProps } from '../types';\nimport { VisualLabelWrapper } from './styles';\nimport * as styles from './styles';\nimport { ToggleGroupControlAsRadioGroup } from './as-radio-group';\nimport { ToggleGroupControlAsButtonGroup } from './as-button-group';\nimport { useTrackElementOffsetRect } from '../../utils/element-rect';\nimport { useMergeRefs } from '@wordpress/compose';\nimport { useAnimatedOffsetRect } from '../../utils/hooks/use-animated-offset-rect';\nimport { maybeWarnDeprecated36pxSize } from '../../utils/deprecated-36px-size';\n\nfunction UnconnectedToggleGroupControl(\n\tprops: WordPressComponentProps< ToggleGroupControlProps, 'div', false >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\t__nextHasNoMarginBottom = false,\n\t\t__next40pxDefaultSize = false,\n\t\t__shouldNotWarnDeprecated36pxSize,\n\t\tclassName,\n\t\tisAdaptiveWidth = false,\n\t\tisBlock = false,\n\t\tisDeselectable = false,\n\t\tlabel,\n\t\thideLabelFromVision = false,\n\t\thelp,\n\t\tonChange,\n\t\tsize = 'default',\n\t\tvalue,\n\t\tchildren,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToggleGroupControl' );\n\n\tconst normalizedSize =\n\t\t__next40pxDefaultSize && size === 'default' ? '__unstable-large' : size;\n\n\tconst [ selectedElement, setSelectedElement ] = useState< HTMLElement >();\n\tconst [ controlElement, setControlElement ] = useState< HTMLElement >();\n\tconst refs = useMergeRefs( [ setControlElement, forwardedRef ] );\n\tconst selectedRect = useTrackElementOffsetRect(\n\t\tvalue !== null && value !== undefined ? selectedElement : undefined\n\t);\n\tuseAnimatedOffsetRect( controlElement, selectedRect, {\n\t\tprefix: 'selected',\n\t\tdataAttribute: 'indicator-animated',\n\t\ttransitionEndFilter: ( event ) => event.pseudoElement === '::before',\n\t\troundRect: true,\n\t} );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.toggleGroupControl( {\n\t\t\t\t\tisBlock,\n\t\t\t\t\tisDeselectable,\n\t\t\t\t\tsize: normalizedSize,\n\t\t\t\t} ),\n\t\t\t\tisBlock && styles.block,\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, cx, isBlock, isDeselectable, normalizedSize ]\n\t);\n\n\tconst MainControl = isDeselectable\n\t\t? ToggleGroupControlAsButtonGroup\n\t\t: ToggleGroupControlAsRadioGroup;\n\n\tmaybeWarnDeprecated36pxSize( {\n\t\tcomponentName: 'ToggleGroupControl',\n\t\tsize,\n\t\t__next40pxDefaultSize,\n\t\t__shouldNotWarnDeprecated36pxSize,\n\t} );\n\n\treturn (\n\t\t<BaseControl\n\t\t\thelp={ help }\n\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t__associatedWPComponentName=\"ToggleGroupControl\"\n\t\t>\n\t\t\t{ ! hideLabelFromVision && (\n\t\t\t\t<VisualLabelWrapper>\n\t\t\t\t\t<BaseControl.VisualLabel>{ label }</BaseControl.VisualLabel>\n\t\t\t\t</VisualLabelWrapper>\n\t\t\t) }\n\t\t\t<MainControl\n\t\t\t\t{ ...otherProps }\n\t\t\t\tsetSelectedElement={ setSelectedElement }\n\t\t\t\tclassName={ classes }\n\t\t\t\tisAdaptiveWidth={ isAdaptiveWidth }\n\t\t\t\tlabel={ label }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tref={ refs }\n\t\t\t\tsize={ normalizedSize }\n\t\t\t\tvalue={ value }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</MainControl>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * `ToggleGroupControl` is a form component that lets users choose options\n * represented in horizontal segments. To render options for this control use\n * `ToggleGroupControlOption` component.\n *\n * This component is intended for selecting a single persistent value from a set of options,\n * similar to a how a radio button group would work. If you simply want a toggle to switch between views,\n * use a `TabPanel` instead.\n *\n * Only use this control when you know for sure the labels of items inside won't\n * wrap. For items with longer labels, you can consider a `SelectControl` or a\n * `CustomSelectControl` component instead.\n *\n * ```jsx\n * import {\n * __experimentalToggleGroupControl as ToggleGroupControl,\n * __experimentalToggleGroupControlOption as ToggleGroupControlOption,\n * } from '@wordpress/components';\n *\n * function Example() {\n * return (\n * <ToggleGroupControl\n * label=\"my label\"\n * value=\"vertical\"\n * isBlock\n * __nextHasNoMarginBottom\n * __next40pxDefaultSize\n * >\n * <ToggleGroupControlOption value=\"horizontal\" label=\"Horizontal\" />\n * <ToggleGroupControlOption value=\"vertical\" label=\"Vertical\" />\n * </ToggleGroupControl>\n * );\n * }\n * ```\n */\nexport const ToggleGroupControl = contextConnect(\n\tUnconnectedToggleGroupControl,\n\t'ToggleGroupControl'\n);\n\nexport default ToggleGroupControl;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -7,6 +7,7 @@ import { ComponentsContext } from './context/context-system-provider';
|
|
|
7
7
|
import Theme from './theme';
|
|
8
8
|
import { Tabs } from './tabs';
|
|
9
9
|
import { kebabCase } from './utils/strings';
|
|
10
|
+
import { withIgnoreIMEEvents } from './utils/with-ignore-ime-events';
|
|
10
11
|
import { lock } from './lock-unlock';
|
|
11
12
|
import Badge from './badge';
|
|
12
13
|
export const privateApis = {};
|
|
@@ -17,6 +18,7 @@ lock(privateApis, {
|
|
|
17
18
|
Theme,
|
|
18
19
|
Menu,
|
|
19
20
|
kebabCase,
|
|
21
|
+
withIgnoreIMEEvents,
|
|
20
22
|
Badge
|
|
21
23
|
});
|
|
22
24
|
//# sourceMappingURL=private-apis.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["positionToPlacement","__experimentalPopoverLegacyPositionToPlacement","Menu","ComponentsContext","Theme","Tabs","kebabCase","lock","Badge","privateApis"],"sources":["@wordpress/components/src/private-apis.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport { positionToPlacement as __experimentalPopoverLegacyPositionToPlacement } from './popover/utils';\nimport { Menu } from './menu';\nimport { ComponentsContext } from './context/context-system-provider';\nimport Theme from './theme';\nimport { Tabs } from './tabs';\nimport { kebabCase } from './utils/strings';\nimport { lock } from './lock-unlock';\nimport Badge from './badge';\n\nexport const privateApis = {};\nlock( privateApis, {\n\t__experimentalPopoverLegacyPositionToPlacement,\n\tComponentsContext,\n\tTabs,\n\tTheme,\n\tMenu,\n\tkebabCase,\n\tBadge,\n} );\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,mBAAmB,IAAIC,8CAA8C,QAAQ,iBAAiB;AACvG,SAASC,IAAI,QAAQ,QAAQ;AAC7B,SAASC,iBAAiB,QAAQ,mCAAmC;AACrE,OAAOC,KAAK,MAAM,SAAS;AAC3B,SAASC,IAAI,QAAQ,QAAQ;AAC7B,SAASC,SAAS,QAAQ,iBAAiB;AAC3C,SAASC,IAAI,QAAQ,eAAe;AACpC,OAAOC,KAAK,MAAM,SAAS;AAE3B,OAAO,MAAMC,WAAW,GAAG,CAAC,CAAC;AAC7BF,IAAI,CAAEE,WAAW,EAAE;
|
|
1
|
+
{"version":3,"names":["positionToPlacement","__experimentalPopoverLegacyPositionToPlacement","Menu","ComponentsContext","Theme","Tabs","kebabCase","withIgnoreIMEEvents","lock","Badge","privateApis"],"sources":["@wordpress/components/src/private-apis.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport { positionToPlacement as __experimentalPopoverLegacyPositionToPlacement } from './popover/utils';\nimport { Menu } from './menu';\nimport { ComponentsContext } from './context/context-system-provider';\nimport Theme from './theme';\nimport { Tabs } from './tabs';\nimport { kebabCase } from './utils/strings';\nimport { withIgnoreIMEEvents } from './utils/with-ignore-ime-events';\nimport { lock } from './lock-unlock';\nimport Badge from './badge';\n\nexport const privateApis = {};\nlock( privateApis, {\n\t__experimentalPopoverLegacyPositionToPlacement,\n\tComponentsContext,\n\tTabs,\n\tTheme,\n\tMenu,\n\tkebabCase,\n\twithIgnoreIMEEvents,\n\tBadge,\n} );\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,mBAAmB,IAAIC,8CAA8C,QAAQ,iBAAiB;AACvG,SAASC,IAAI,QAAQ,QAAQ;AAC7B,SAASC,iBAAiB,QAAQ,mCAAmC;AACrE,OAAOC,KAAK,MAAM,SAAS;AAC3B,SAASC,IAAI,QAAQ,QAAQ;AAC7B,SAASC,SAAS,QAAQ,iBAAiB;AAC3C,SAASC,mBAAmB,QAAQ,gCAAgC;AACpE,SAASC,IAAI,QAAQ,eAAe;AACpC,OAAOC,KAAK,MAAM,SAAS;AAE3B,OAAO,MAAMC,WAAW,GAAG,CAAC,CAAC;AAC7BF,IAAI,CAAEE,WAAW,EAAE;EAClBT,8CAA8C;EAC9CE,iBAAiB;EACjBE,IAAI;EACJD,KAAK;EACLF,IAAI;EACJI,SAAS;EACTC,mBAAmB;EACnBE;AACD,CAAE,CAAC","ignoreList":[]}
|
|
@@ -45,7 +45,7 @@ function UnconnectedToggleGroupControl(props, forwardedRef) {
|
|
|
45
45
|
const [selectedElement, setSelectedElement] = useState();
|
|
46
46
|
const [controlElement, setControlElement] = useState();
|
|
47
47
|
const refs = useMergeRefs([setControlElement, forwardedRef]);
|
|
48
|
-
const selectedRect = useTrackElementOffsetRect(value
|
|
48
|
+
const selectedRect = useTrackElementOffsetRect(value !== null && value !== undefined ? selectedElement : undefined);
|
|
49
49
|
useAnimatedOffsetRect(controlElement, selectedRect, {
|
|
50
50
|
prefix: 'selected',
|
|
51
51
|
dataAttribute: 'indicator-animated',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useMemo","useState","contextConnect","useContextSystem","useCx","BaseControl","VisualLabelWrapper","styles","ToggleGroupControlAsRadioGroup","ToggleGroupControlAsButtonGroup","useTrackElementOffsetRect","useMergeRefs","useAnimatedOffsetRect","maybeWarnDeprecated36pxSize","jsx","_jsx","jsxs","_jsxs","UnconnectedToggleGroupControl","props","forwardedRef","__nextHasNoMarginBottom","__next40pxDefaultSize","__shouldNotWarnDeprecated36pxSize","className","isAdaptiveWidth","isBlock","isDeselectable","label","hideLabelFromVision","help","onChange","size","value","children","otherProps","normalizedSize","selectedElement","setSelectedElement","controlElement","setControlElement","refs","selectedRect","undefined","prefix","dataAttribute","transitionEndFilter","event","pseudoElement","roundRect","cx","classes","toggleGroupControl","block","MainControl","componentName","__associatedWPComponentName","VisualLabel","ref","ToggleGroupControl"],"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect, useContextSystem } from '../../context';\nimport { useCx } from '../../utils/hooks';\nimport BaseControl from '../../base-control';\nimport type { ToggleGroupControlProps } from '../types';\nimport { VisualLabelWrapper } from './styles';\nimport * as styles from './styles';\nimport { ToggleGroupControlAsRadioGroup } from './as-radio-group';\nimport { ToggleGroupControlAsButtonGroup } from './as-button-group';\nimport { useTrackElementOffsetRect } from '../../utils/element-rect';\nimport { useMergeRefs } from '@wordpress/compose';\nimport { useAnimatedOffsetRect } from '../../utils/hooks/use-animated-offset-rect';\nimport { maybeWarnDeprecated36pxSize } from '../../utils/deprecated-36px-size';\n\nfunction UnconnectedToggleGroupControl(\n\tprops: WordPressComponentProps< ToggleGroupControlProps, 'div', false >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\t__nextHasNoMarginBottom = false,\n\t\t__next40pxDefaultSize = false,\n\t\t__shouldNotWarnDeprecated36pxSize,\n\t\tclassName,\n\t\tisAdaptiveWidth = false,\n\t\tisBlock = false,\n\t\tisDeselectable = false,\n\t\tlabel,\n\t\thideLabelFromVision = false,\n\t\thelp,\n\t\tonChange,\n\t\tsize = 'default',\n\t\tvalue,\n\t\tchildren,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToggleGroupControl' );\n\n\tconst normalizedSize =\n\t\t__next40pxDefaultSize && size === 'default' ? '__unstable-large' : size;\n\n\tconst [ selectedElement, setSelectedElement ] = useState< HTMLElement >();\n\tconst [ controlElement, setControlElement ] = useState< HTMLElement >();\n\tconst refs = useMergeRefs( [ setControlElement, forwardedRef ] );\n\tconst selectedRect = useTrackElementOffsetRect(\n\t\tvalue
|
|
1
|
+
{"version":3,"names":["useMemo","useState","contextConnect","useContextSystem","useCx","BaseControl","VisualLabelWrapper","styles","ToggleGroupControlAsRadioGroup","ToggleGroupControlAsButtonGroup","useTrackElementOffsetRect","useMergeRefs","useAnimatedOffsetRect","maybeWarnDeprecated36pxSize","jsx","_jsx","jsxs","_jsxs","UnconnectedToggleGroupControl","props","forwardedRef","__nextHasNoMarginBottom","__next40pxDefaultSize","__shouldNotWarnDeprecated36pxSize","className","isAdaptiveWidth","isBlock","isDeselectable","label","hideLabelFromVision","help","onChange","size","value","children","otherProps","normalizedSize","selectedElement","setSelectedElement","controlElement","setControlElement","refs","selectedRect","undefined","prefix","dataAttribute","transitionEndFilter","event","pseudoElement","roundRect","cx","classes","toggleGroupControl","block","MainControl","componentName","__associatedWPComponentName","VisualLabel","ref","ToggleGroupControl"],"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect, useContextSystem } from '../../context';\nimport { useCx } from '../../utils/hooks';\nimport BaseControl from '../../base-control';\nimport type { ToggleGroupControlProps } from '../types';\nimport { VisualLabelWrapper } from './styles';\nimport * as styles from './styles';\nimport { ToggleGroupControlAsRadioGroup } from './as-radio-group';\nimport { ToggleGroupControlAsButtonGroup } from './as-button-group';\nimport { useTrackElementOffsetRect } from '../../utils/element-rect';\nimport { useMergeRefs } from '@wordpress/compose';\nimport { useAnimatedOffsetRect } from '../../utils/hooks/use-animated-offset-rect';\nimport { maybeWarnDeprecated36pxSize } from '../../utils/deprecated-36px-size';\n\nfunction UnconnectedToggleGroupControl(\n\tprops: WordPressComponentProps< ToggleGroupControlProps, 'div', false >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\t__nextHasNoMarginBottom = false,\n\t\t__next40pxDefaultSize = false,\n\t\t__shouldNotWarnDeprecated36pxSize,\n\t\tclassName,\n\t\tisAdaptiveWidth = false,\n\t\tisBlock = false,\n\t\tisDeselectable = false,\n\t\tlabel,\n\t\thideLabelFromVision = false,\n\t\thelp,\n\t\tonChange,\n\t\tsize = 'default',\n\t\tvalue,\n\t\tchildren,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToggleGroupControl' );\n\n\tconst normalizedSize =\n\t\t__next40pxDefaultSize && size === 'default' ? '__unstable-large' : size;\n\n\tconst [ selectedElement, setSelectedElement ] = useState< HTMLElement >();\n\tconst [ controlElement, setControlElement ] = useState< HTMLElement >();\n\tconst refs = useMergeRefs( [ setControlElement, forwardedRef ] );\n\tconst selectedRect = useTrackElementOffsetRect(\n\t\tvalue !== null && value !== undefined ? selectedElement : undefined\n\t);\n\tuseAnimatedOffsetRect( controlElement, selectedRect, {\n\t\tprefix: 'selected',\n\t\tdataAttribute: 'indicator-animated',\n\t\ttransitionEndFilter: ( event ) => event.pseudoElement === '::before',\n\t\troundRect: true,\n\t} );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.toggleGroupControl( {\n\t\t\t\t\tisBlock,\n\t\t\t\t\tisDeselectable,\n\t\t\t\t\tsize: normalizedSize,\n\t\t\t\t} ),\n\t\t\t\tisBlock && styles.block,\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, cx, isBlock, isDeselectable, normalizedSize ]\n\t);\n\n\tconst MainControl = isDeselectable\n\t\t? ToggleGroupControlAsButtonGroup\n\t\t: ToggleGroupControlAsRadioGroup;\n\n\tmaybeWarnDeprecated36pxSize( {\n\t\tcomponentName: 'ToggleGroupControl',\n\t\tsize,\n\t\t__next40pxDefaultSize,\n\t\t__shouldNotWarnDeprecated36pxSize,\n\t} );\n\n\treturn (\n\t\t<BaseControl\n\t\t\thelp={ help }\n\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t__associatedWPComponentName=\"ToggleGroupControl\"\n\t\t>\n\t\t\t{ ! hideLabelFromVision && (\n\t\t\t\t<VisualLabelWrapper>\n\t\t\t\t\t<BaseControl.VisualLabel>{ label }</BaseControl.VisualLabel>\n\t\t\t\t</VisualLabelWrapper>\n\t\t\t) }\n\t\t\t<MainControl\n\t\t\t\t{ ...otherProps }\n\t\t\t\tsetSelectedElement={ setSelectedElement }\n\t\t\t\tclassName={ classes }\n\t\t\t\tisAdaptiveWidth={ isAdaptiveWidth }\n\t\t\t\tlabel={ label }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tref={ refs }\n\t\t\t\tsize={ normalizedSize }\n\t\t\t\tvalue={ value }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</MainControl>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * `ToggleGroupControl` is a form component that lets users choose options\n * represented in horizontal segments. To render options for this control use\n * `ToggleGroupControlOption` component.\n *\n * This component is intended for selecting a single persistent value from a set of options,\n * similar to a how a radio button group would work. If you simply want a toggle to switch between views,\n * use a `TabPanel` instead.\n *\n * Only use this control when you know for sure the labels of items inside won't\n * wrap. For items with longer labels, you can consider a `SelectControl` or a\n * `CustomSelectControl` component instead.\n *\n * ```jsx\n * import {\n * __experimentalToggleGroupControl as ToggleGroupControl,\n * __experimentalToggleGroupControlOption as ToggleGroupControlOption,\n * } from '@wordpress/components';\n *\n * function Example() {\n * return (\n * <ToggleGroupControl\n * label=\"my label\"\n * value=\"vertical\"\n * isBlock\n * __nextHasNoMarginBottom\n * __next40pxDefaultSize\n * >\n * <ToggleGroupControlOption value=\"horizontal\" label=\"Horizontal\" />\n * <ToggleGroupControlOption value=\"vertical\" label=\"Vertical\" />\n * </ToggleGroupControl>\n * );\n * }\n * ```\n */\nexport const ToggleGroupControl = contextConnect(\n\tUnconnectedToggleGroupControl,\n\t'ToggleGroupControl'\n);\n\nexport default ToggleGroupControl;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -8,6 +8,11 @@ export declare function overlayMiddlewares(): ({
|
|
|
8
8
|
fn: (state: MiddlewareState) => import("@floating-ui/core").MiddlewareReturn | Promise<import("@floating-ui/core").MiddlewareReturn>;
|
|
9
9
|
} | {
|
|
10
10
|
name: string;
|
|
11
|
-
fn({ rects }: MiddlewareState):
|
|
11
|
+
fn({ rects }: MiddlewareState): {
|
|
12
|
+
x: number;
|
|
13
|
+
y: number;
|
|
14
|
+
height: number;
|
|
15
|
+
width: number;
|
|
16
|
+
};
|
|
12
17
|
})[];
|
|
13
18
|
//# sourceMappingURL=overlay-middlewares.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"overlay-middlewares.d.ts","sourceRoot":"","sources":["../../src/popover/overlay-middlewares.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAG9D,wBAAgB,kBAAkB;;;;;;kBAIhB,eAAe
|
|
1
|
+
{"version":3,"file":"overlay-middlewares.d.ts","sourceRoot":"","sources":["../../src/popover/overlay-middlewares.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAG9D,wBAAgB,kBAAkB;;;;;;kBAIhB,eAAe;;;;;;KAqBhC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"private-apis.d.ts","sourceRoot":"","sources":["../src/private-apis.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"private-apis.d.ts","sourceRoot":"","sources":["../src/private-apis.ts"],"names":[],"mappings":"AAaA,eAAO,MAAM,WAAW,IAAK,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wordpress/components",
|
|
3
|
-
"version": "29.5.
|
|
3
|
+
"version": "29.5.4",
|
|
4
4
|
"description": "UI components for WordPress.",
|
|
5
5
|
"author": "The WordPress Contributors",
|
|
6
6
|
"license": "GPL-2.0-or-later",
|
|
@@ -40,15 +40,15 @@
|
|
|
40
40
|
"@emotion/serialize": "^1.0.2",
|
|
41
41
|
"@emotion/styled": "^11.6.0",
|
|
42
42
|
"@emotion/utils": "^1.0.0",
|
|
43
|
-
"@floating-ui/react-dom": "
|
|
43
|
+
"@floating-ui/react-dom": "2.0.8",
|
|
44
44
|
"@types/gradient-parser": "0.1.3",
|
|
45
45
|
"@types/highlight-words-core": "1.2.1",
|
|
46
46
|
"@use-gesture/react": "^10.3.1",
|
|
47
47
|
"@wordpress/a11y": "^4.19.1",
|
|
48
|
-
"@wordpress/compose": "^7.19.
|
|
48
|
+
"@wordpress/compose": "^7.19.2",
|
|
49
49
|
"@wordpress/date": "^5.19.1",
|
|
50
50
|
"@wordpress/deprecated": "^4.19.1",
|
|
51
|
-
"@wordpress/dom": "^4.19.
|
|
51
|
+
"@wordpress/dom": "^4.19.2",
|
|
52
52
|
"@wordpress/element": "^6.19.1",
|
|
53
53
|
"@wordpress/escape-html": "^3.19.1",
|
|
54
54
|
"@wordpress/hooks": "^4.19.1",
|
|
@@ -59,7 +59,7 @@
|
|
|
59
59
|
"@wordpress/keycodes": "^4.19.1",
|
|
60
60
|
"@wordpress/primitives": "^4.19.1",
|
|
61
61
|
"@wordpress/private-apis": "^1.19.1",
|
|
62
|
-
"@wordpress/rich-text": "^7.19.
|
|
62
|
+
"@wordpress/rich-text": "^7.19.2",
|
|
63
63
|
"@wordpress/warning": "^3.19.1",
|
|
64
64
|
"change-case": "^4.1.2",
|
|
65
65
|
"clsx": "^2.1.1",
|
|
@@ -85,5 +85,5 @@
|
|
|
85
85
|
"publishConfig": {
|
|
86
86
|
"access": "public"
|
|
87
87
|
},
|
|
88
|
-
"gitHead": "
|
|
88
|
+
"gitHead": "018f5b628fb5006dd45a1b7cd63463c73bd9d641"
|
|
89
89
|
}
|
package/src/private-apis.ts
CHANGED
|
@@ -7,6 +7,7 @@ import { ComponentsContext } from './context/context-system-provider';
|
|
|
7
7
|
import Theme from './theme';
|
|
8
8
|
import { Tabs } from './tabs';
|
|
9
9
|
import { kebabCase } from './utils/strings';
|
|
10
|
+
import { withIgnoreIMEEvents } from './utils/with-ignore-ime-events';
|
|
10
11
|
import { lock } from './lock-unlock';
|
|
11
12
|
import Badge from './badge';
|
|
12
13
|
|
|
@@ -18,5 +19,6 @@ lock( privateApis, {
|
|
|
18
19
|
Theme,
|
|
19
20
|
Menu,
|
|
20
21
|
kebabCase,
|
|
22
|
+
withIgnoreIMEEvents,
|
|
21
23
|
Badge,
|
|
22
24
|
} );
|
|
@@ -54,7 +54,7 @@ function UnconnectedToggleGroupControl(
|
|
|
54
54
|
const [ controlElement, setControlElement ] = useState< HTMLElement >();
|
|
55
55
|
const refs = useMergeRefs( [ setControlElement, forwardedRef ] );
|
|
56
56
|
const selectedRect = useTrackElementOffsetRect(
|
|
57
|
-
value
|
|
57
|
+
value !== null && value !== undefined ? selectedElement : undefined
|
|
58
58
|
);
|
|
59
59
|
useAnimatedOffsetRect( controlElement, selectedRect, {
|
|
60
60
|
prefix: 'selected',
|