@wordpress/widget-dashboard 0.1.1-next.v.202606191442.0 → 0.2.0
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 +3 -1
- package/build/components/widget-chrome/widget-chrome.cjs +1 -1
- package/build/components/widget-chrome/widget-chrome.cjs.map +1 -1
- package/build/components/widgets/widget-resize-handle.cjs +1 -1
- package/build/components/widgets/widget-resize-handle.cjs.map +2 -2
- package/build-module/components/widget-chrome/widget-chrome.mjs +1 -1
- package/build-module/components/widget-chrome/widget-chrome.mjs.map +1 -1
- package/build-module/components/widgets/widget-resize-handle.mjs +1 -1
- package/build-module/components/widgets/widget-resize-handle.mjs.map +2 -2
- package/package.json +17 -17
- package/src/components/widget-chrome/widget-chrome.tsx +1 -1
- package/src/components/widgets/widget-resize-handle.module.css +2 -2
- package/src/test/actions.test.tsx +10 -8
- package/src/test/widget-dashboard.test.tsx +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -187,7 +187,7 @@ function Header({ titleId, widgetType }) {
|
|
|
187
187
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Icon, { icon: widgetType.icon })
|
|
188
188
|
}
|
|
189
189
|
),
|
|
190
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Card.Title, { id: titleId, render: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("
|
|
190
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Card.Title, { id: titleId, render: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", {}), children: widgetType.title })
|
|
191
191
|
] }) });
|
|
192
192
|
}
|
|
193
193
|
var WidgetChrome = (0, import_element.forwardRef)(
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/widget-chrome/widget-chrome.tsx", "../../../../style-runtime/src/index.ts", "../../../src/components/widget-chrome/widget-chrome.module.css"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { Spinner } from '@wordpress/components';\nimport {\n\tComponent,\n\tSuspense,\n\tforwardRef,\n\tuseId,\n\tuseMemo,\n} from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { plugins } from '@wordpress/icons';\n// eslint-disable-next-line @wordpress/use-recommended-components\nimport { Card, Icon, Stack, Notice, Text, VisuallyHidden } from '@wordpress/ui';\nimport type { WidgetType } from '@wordpress/widget-primitives';\n\n/**\n * Internal dependencies\n */\nimport { useDashboardInternalContext } from '../../context/dashboard-context';\nimport { WidgetContextProvider } from '../../context/widget-context';\nimport { WidgetRender } from '../widget-render';\nimport styles from './widget-chrome.module.css';\nimport type { DashboardWidget } from '../../types';\n\ninterface ErrorBoundaryProps {\n\tchildren: ReactNode;\n}\n\ninterface ErrorBoundaryState {\n\thasError: boolean;\n}\n\nclass WidgetErrorBoundary extends Component<\n\tErrorBoundaryProps,\n\tErrorBoundaryState\n> {\n\tstate: ErrorBoundaryState = { hasError: false };\n\n\tstatic getDerivedStateFromError(): ErrorBoundaryState {\n\t\treturn { hasError: true };\n\t}\n\n\trender() {\n\t\tif ( this.state.hasError ) {\n\t\t\treturn (\n\t\t\t\t<Notice.Root intent=\"error\">\n\t\t\t\t\t<Notice.Description>\n\t\t\t\t\t\t{ __( 'This widget encountered an error.' ) }\n\t\t\t\t\t</Notice.Description>\n\t\t\t\t</Notice.Root>\n\t\t\t);\n\t\t}\n\t\treturn this.props.children;\n\t}\n}\n\nfunction LoadingOverlay() {\n\treturn (\n\t\t<Stack justify=\"center\" align=\"center\" className={ styles.loading }>\n\t\t\t<Spinner />\n\t\t</Stack>\n\t);\n}\n\ninterface UnavailableWidgetProps {\n\twidgetTypeName: string;\n}\n\nfunction UnavailableWidget( { widgetTypeName }: UnavailableWidgetProps ) {\n\treturn (\n\t\t<>\n\t\t\t<Card.Header>\n\t\t\t\t<span\n\t\t\t\t\tclassName={ styles.widgetChromeHeaderIcon }\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t>\n\t\t\t\t\t<Icon icon={ plugins } />\n\t\t\t\t</span>\n\t\t\t</Card.Header>\n\t\t\t<Card.Content className={ styles.widgetChromeContent }>\n\t\t\t\t<Stack\n\t\t\t\t\tdirection=\"column\"\n\t\t\t\t\tjustify=\"center\"\n\t\t\t\t\talign=\"center\"\n\t\t\t\t\tgap=\"md\"\n\t\t\t\t\tclassName={ styles.unavailable }\n\t\t\t\t>\n\t\t\t\t\t<Text>{ __( 'Widget is no longer available.' ) }</Text>\n\t\t\t\t\t<Text render={ <code /> }>{ widgetTypeName }</Text>\n\t\t\t\t</Stack>\n\t\t\t</Card.Content>\n\t\t</>\n\t);\n}\n\ninterface HeaderProps {\n\ttitleId: string;\n\twidgetType: WidgetType;\n}\n\nfunction Header( { titleId, widgetType }: HeaderProps ) {\n\tif ( ! widgetType.title ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Card.Header>\n\t\t\t<Stack direction=\"row\" align=\"center\" gap=\"sm\">\n\t\t\t\t{ widgetType.icon && (\n\t\t\t\t\t<span\n\t\t\t\t\t\tclassName={ styles.widgetChromeHeaderIcon }\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={ widgetType.icon } />\n\t\t\t\t\t</span>\n\t\t\t\t) }\n\t\t\t\t<Card.Title id={ titleId } render={ <h3 /> }>\n\t\t\t\t\t{ widgetType.title }\n\t\t\t\t</Card.Title>\n\t\t\t</Stack>\n\t\t</Card.Header>\n\t);\n}\n\nexport interface WidgetChromeProps {\n\twidget: DashboardWidget< unknown >;\n\tindex: number;\n\t/**\n\t * Lifted by the surrounding `@wordpress/grid` surface into a sibling\n\t * slot of the grid item; not rendered by `WidgetChrome` itself.\n\t * Living outside `Card.Root` is what keeps these controls interactive\n\t * while edit mode applies `inert` to the chrome.\n\t */\n\tactionableArea?: ReactNode;\n\tclassName?: string;\n}\n\n/**\n * Per-instance wrapper. Owns the chrome around a widget instance: identity\n * context, header (title + icon), edit-mode `inert` attribute, and the\n * error/loading boundaries that keep neighbours mounted when one widget fails\n * or is still resolving.\n */\nexport const WidgetChrome = forwardRef< HTMLDivElement, WidgetChromeProps >(\n\tfunction WidgetChrome( { widget, index, className }, ref ) {\n\t\tconst { widgetTypes, isResolvingWidgetTypes, editMode } =\n\t\t\tuseDashboardInternalContext();\n\t\tconst widgetType = widgetTypes.find( ( t ) => t.name === widget.type );\n\t\tconst titleId = useId();\n\n\t\tconst contextValue = useMemo(\n\t\t\t() => ( {\n\t\t\t\tuuid: widget.uuid,\n\t\t\t\tname: widget.type,\n\t\t\t\tindex,\n\t\t\t} ),\n\t\t\t[ widget.uuid, widget.type, index ]\n\t\t);\n\n\t\tif ( ! widgetType ) {\n\t\t\tif ( isResolvingWidgetTypes ) {\n\t\t\t\treturn (\n\t\t\t\t\t<WidgetContextProvider value={ contextValue }>\n\t\t\t\t\t\t<Card.Root\n\t\t\t\t\t\t\trender={ <section /> }\n\t\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\t\tclassName={ clsx( styles.widgetChrome, className ) }\n\t\t\t\t\t\t\taria-busy=\"true\"\n\t\t\t\t\t\t\taria-label={ __( 'Loading' ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Card.Content\n\t\t\t\t\t\t\t\tclassName={ styles.widgetChromeContent }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<LoadingOverlay />\n\t\t\t\t\t\t\t</Card.Content>\n\t\t\t\t\t\t</Card.Root>\n\t\t\t\t\t</WidgetContextProvider>\n\t\t\t\t);\n\t\t\t}\n\n\t\t\treturn (\n\t\t\t\t<WidgetContextProvider value={ contextValue }>\n\t\t\t\t\t<Card.Root\n\t\t\t\t\t\trender={ <section /> }\n\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\tclassName={ clsx( styles.widgetChrome, className ) }\n\t\t\t\t\t\taria-label={ __( 'Missing widget' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<UnavailableWidget widgetTypeName={ widget.type } />\n\t\t\t\t\t</Card.Root>\n\t\t\t\t</WidgetContextProvider>\n\t\t\t);\n\t\t}\n\n\t\t// `presentation` encodes two independent axes. `full-bleed` hides\n\t\t// the header; both `full-bleed` and `content-bleed` let the body\n\t\t// break out of the content padding.\n\t\tconst { presentation } = widgetType;\n\t\tconst isHeaderHidden = presentation === 'full-bleed';\n\t\tconst isBodyBleeding =\n\t\t\tpresentation === 'full-bleed' || presentation === 'content-bleed';\n\t\tconst header = <Header titleId={ titleId } widgetType={ widgetType } />;\n\n\t\tconst body = (\n\t\t\t<WidgetErrorBoundary>\n\t\t\t\t<Suspense fallback={ <LoadingOverlay /> }>\n\t\t\t\t\t<WidgetRender widget={ widget } widgetType={ widgetType } />\n\t\t\t\t</Suspense>\n\t\t\t</WidgetErrorBoundary>\n\t\t);\n\n\t\treturn (\n\t\t\t<WidgetContextProvider value={ contextValue }>\n\t\t\t\t<Card.Root\n\t\t\t\t\trender={ <section /> }\n\t\t\t\t\tref={ ref }\n\t\t\t\t\tclassName={ clsx( styles.widgetChrome, className ) }\n\t\t\t\t\taria-labelledby={ widgetType.title ? titleId : undefined }\n\t\t\t\t\t{ ...( editMode ? { inert: 'true' } : {} ) }\n\t\t\t\t>\n\t\t\t\t\t{ isHeaderHidden ? (\n\t\t\t\t\t\t<VisuallyHidden>{ header }</VisuallyHidden>\n\t\t\t\t\t) : (\n\t\t\t\t\t\theader\n\t\t\t\t\t) }\n\n\t\t\t\t\t<Card.Content\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\tstyles.widgetChromeContent,\n\t\t\t\t\t\t\tisBodyBleeding && styles.widgetChromeContentBleed\n\t\t\t\t\t\t) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ isBodyBleeding ? (\n\t\t\t\t\t\t\t<Card.FullBleed\n\t\t\t\t\t\t\t\tclassName={ styles.widgetChromeBleedScroll }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ body }\n\t\t\t\t\t\t\t</Card.FullBleed>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\tbody\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Card.Content>\n\t\t\t\t</Card.Root>\n\t\t\t</WidgetContextProvider>\n\t\t);\n\t}\n);\n", "type GlobalScopeWithStyleRuntime = typeof globalThis & {\n\t// This global is shared by separately bundled copies of this package.\n\t// Keep its shape backward compatible after release.\n\t__wpStyleRuntime?: {\n\t\tdocuments: Map< Document, number >;\n\t\tstyles: Map< string, string >;\n\t\tinjectedStyles: WeakMap< Document, Set< string > >;\n\t};\n};\n\nconst STYLE_HASH_ATTRIBUTE = 'data-wp-hash';\n\n/**\n * Returns the shared style runtime registry.\n *\n * The registry is stored on `globalThis` so separately bundled copies of this\n * package can coordinate through the same document and style maps.\n *\n * @return The shared runtime registry.\n */\nfunction getRuntime() {\n\tconst globalScope = globalThis as GlobalScopeWithStyleRuntime;\n\n\tif ( globalScope.__wpStyleRuntime ) {\n\t\treturn globalScope.__wpStyleRuntime;\n\t}\n\n\tglobalScope.__wpStyleRuntime = {\n\t\tdocuments: new Map(),\n\t\tstyles: new Map(),\n\t\tinjectedStyles: new WeakMap(),\n\t};\n\n\tif ( typeof document !== 'undefined' ) {\n\t\tregisterDocument( document );\n\t}\n\n\treturn globalScope.__wpStyleRuntime;\n}\n\n/**\n * Checks whether a document already contains a style tag for a hash.\n *\n * @param targetDocument Document to inspect.\n * @param hash Stable hash for the transformed CSS.\n *\n * @return Whether the style hash already exists in the document.\n */\nfunction documentContainsStyleHash(\n\ttargetDocument: Document,\n\thash: string\n): boolean {\n\tif ( ! targetDocument.head ) {\n\t\treturn false;\n\t}\n\n\tfor ( const style of targetDocument.head.querySelectorAll(\n\t\t`style[${ STYLE_HASH_ATTRIBUTE }]`\n\t) ) {\n\t\tif ( style.getAttribute( STYLE_HASH_ATTRIBUTE ) === hash ) {\n\t\t\treturn true;\n\t\t}\n\t}\n\n\treturn false;\n}\n\n/**\n * Injects a registered style into a document, unless that document already\n * contains a style tag for the same hash.\n *\n * @param targetDocument Document to inject the style into.\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nfunction injectStyle( targetDocument: Document, hash: string, css: string ) {\n\tif ( ! targetDocument.head ) {\n\t\treturn;\n\t}\n\n\tconst runtime = getRuntime();\n\tlet injectedStyles = runtime.injectedStyles.get( targetDocument );\n\n\tif ( ! injectedStyles ) {\n\t\tinjectedStyles = new Set();\n\t\truntime.injectedStyles.set( targetDocument, injectedStyles );\n\t}\n\n\tif ( injectedStyles.has( hash ) ) {\n\t\treturn;\n\t}\n\n\t// Older generated CSS module output can still inject matching style tags\n\t// after this document's cache is created, so keep the DOM as the fallback\n\t// source of truth on cache misses.\n\tif ( documentContainsStyleHash( targetDocument, hash ) ) {\n\t\tinjectedStyles.add( hash );\n\t\treturn;\n\t}\n\n\tconst style = targetDocument.createElement( 'style' );\n\tstyle.setAttribute( STYLE_HASH_ATTRIBUTE, hash );\n\tstyle.appendChild( targetDocument.createTextNode( css ) );\n\ttargetDocument.head.appendChild( style );\n\tinjectedStyles.add( hash );\n}\n\n/**\n * Registers a document as a style injection target.\n *\n * Existing registered styles are replayed into the document immediately.\n * Documents are reference-counted so multiple providers can safely register the\n * same document without one cleanup removing it while another registration is\n * still active.\n *\n * @param targetDocument Document to receive registered styles.\n * @return Cleanup function that unregisters this document registration.\n */\nexport function registerDocument( targetDocument: Document ) {\n\tconst runtime = getRuntime();\n\n\truntime.documents.set(\n\t\ttargetDocument,\n\t\t( runtime.documents.get( targetDocument ) ?? 0 ) + 1\n\t);\n\n\tfor ( const [ hash, css ] of runtime.styles ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n\n\treturn () => {\n\t\tconst count = runtime.documents.get( targetDocument );\n\n\t\tif ( count === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( count <= 1 ) {\n\t\t\truntime.documents.delete( targetDocument );\n\t\t\treturn;\n\t\t}\n\n\t\truntime.documents.set( targetDocument, count - 1 );\n\t};\n}\n\n/**\n * Registers a style and injects it into all registered documents.\n *\n * The hash is used as the deduplication key, so calling this repeatedly with\n * the same hash will not add duplicate style tags to a document.\n * Registered styles are retained for the lifetime of the page so they can be\n * replayed into documents that are registered later.\n *\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nexport function registerStyle( hash: string, css: string ) {\n\tconst runtime = getRuntime();\n\n\truntime.styles.set( hash, css );\n\n\tfor ( const targetDocument of runtime.documents.keys() ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n}\n", "import { registerStyle } from '@wordpress/style-runtime';\nif (typeof process === 'undefined' || process.env.NODE_ENV !== 'test') {\n\tregisterStyle(\"345dedc0b8\", \"._79b45ce7d3422efe__widgetChrome{contain:layout;height:100%}._79b45ce7d3422efe__widgetChrome:has(._9f0be51a1b96c8d7__widgetChromeContent :focus-visible){outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus,var(--wp-admin-theme-color,#3858e9));outline-offset:2px}.d85f7657585b9203__widgetChromeHeaderIcon{color:var(--wpds-color-foreground-content-neutral,#1e1e1e);display:inline-flex}._9f0be51a1b96c8d7__widgetChromeContent{flex:1;height:100%;min-height:0;min-width:0;overflow-y:auto}._21770471c9c2115b__widgetChromeContentBleed{padding-block:0}._229727240ac2aa18__widgetChromeBleedScroll{height:100%;margin-block-end:0;overflow-y:auto}._3c919e86d1bb80ab__loading,._9b694d63bdec1a98__unavailable{height:100%}\");\n}\nexport default {\"widgetChrome\":\"_79b45ce7d3422efe__widgetChrome\",\"widgetChromeContent\":\"_9f0be51a1b96c8d7__widgetChromeContent\",\"widgetChromeHeaderIcon\":\"d85f7657585b9203__widgetChromeHeaderIcon\",\"widgetChromeContentBleed\":\"_21770471c9c2115b__widgetChromeContentBleed\",\"widgetChromeBleedScroll\":\"_229727240ac2aa18__widgetChromeBleedScroll\",\"loading\":\"_3c919e86d1bb80ab__loading\",\"unavailable\":\"_9b694d63bdec1a98__unavailable\"};\n"],
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { Spinner } from '@wordpress/components';\nimport {\n\tComponent,\n\tSuspense,\n\tforwardRef,\n\tuseId,\n\tuseMemo,\n} from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { plugins } from '@wordpress/icons';\n// eslint-disable-next-line @wordpress/use-recommended-components\nimport { Card, Icon, Stack, Notice, Text, VisuallyHidden } from '@wordpress/ui';\nimport type { WidgetType } from '@wordpress/widget-primitives';\n\n/**\n * Internal dependencies\n */\nimport { useDashboardInternalContext } from '../../context/dashboard-context';\nimport { WidgetContextProvider } from '../../context/widget-context';\nimport { WidgetRender } from '../widget-render';\nimport styles from './widget-chrome.module.css';\nimport type { DashboardWidget } from '../../types';\n\ninterface ErrorBoundaryProps {\n\tchildren: ReactNode;\n}\n\ninterface ErrorBoundaryState {\n\thasError: boolean;\n}\n\nclass WidgetErrorBoundary extends Component<\n\tErrorBoundaryProps,\n\tErrorBoundaryState\n> {\n\tstate: ErrorBoundaryState = { hasError: false };\n\n\tstatic getDerivedStateFromError(): ErrorBoundaryState {\n\t\treturn { hasError: true };\n\t}\n\n\trender() {\n\t\tif ( this.state.hasError ) {\n\t\t\treturn (\n\t\t\t\t<Notice.Root intent=\"error\">\n\t\t\t\t\t<Notice.Description>\n\t\t\t\t\t\t{ __( 'This widget encountered an error.' ) }\n\t\t\t\t\t</Notice.Description>\n\t\t\t\t</Notice.Root>\n\t\t\t);\n\t\t}\n\t\treturn this.props.children;\n\t}\n}\n\nfunction LoadingOverlay() {\n\treturn (\n\t\t<Stack justify=\"center\" align=\"center\" className={ styles.loading }>\n\t\t\t<Spinner />\n\t\t</Stack>\n\t);\n}\n\ninterface UnavailableWidgetProps {\n\twidgetTypeName: string;\n}\n\nfunction UnavailableWidget( { widgetTypeName }: UnavailableWidgetProps ) {\n\treturn (\n\t\t<>\n\t\t\t<Card.Header>\n\t\t\t\t<span\n\t\t\t\t\tclassName={ styles.widgetChromeHeaderIcon }\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t>\n\t\t\t\t\t<Icon icon={ plugins } />\n\t\t\t\t</span>\n\t\t\t</Card.Header>\n\t\t\t<Card.Content className={ styles.widgetChromeContent }>\n\t\t\t\t<Stack\n\t\t\t\t\tdirection=\"column\"\n\t\t\t\t\tjustify=\"center\"\n\t\t\t\t\talign=\"center\"\n\t\t\t\t\tgap=\"md\"\n\t\t\t\t\tclassName={ styles.unavailable }\n\t\t\t\t>\n\t\t\t\t\t<Text>{ __( 'Widget is no longer available.' ) }</Text>\n\t\t\t\t\t<Text render={ <code /> }>{ widgetTypeName }</Text>\n\t\t\t\t</Stack>\n\t\t\t</Card.Content>\n\t\t</>\n\t);\n}\n\ninterface HeaderProps {\n\ttitleId: string;\n\twidgetType: WidgetType;\n}\n\nfunction Header( { titleId, widgetType }: HeaderProps ) {\n\tif ( ! widgetType.title ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Card.Header>\n\t\t\t<Stack direction=\"row\" align=\"center\" gap=\"sm\">\n\t\t\t\t{ widgetType.icon && (\n\t\t\t\t\t<span\n\t\t\t\t\t\tclassName={ styles.widgetChromeHeaderIcon }\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={ widgetType.icon } />\n\t\t\t\t\t</span>\n\t\t\t\t) }\n\t\t\t\t<Card.Title id={ titleId } render={ <h2 /> }>\n\t\t\t\t\t{ widgetType.title }\n\t\t\t\t</Card.Title>\n\t\t\t</Stack>\n\t\t</Card.Header>\n\t);\n}\n\nexport interface WidgetChromeProps {\n\twidget: DashboardWidget< unknown >;\n\tindex: number;\n\t/**\n\t * Lifted by the surrounding `@wordpress/grid` surface into a sibling\n\t * slot of the grid item; not rendered by `WidgetChrome` itself.\n\t * Living outside `Card.Root` is what keeps these controls interactive\n\t * while edit mode applies `inert` to the chrome.\n\t */\n\tactionableArea?: ReactNode;\n\tclassName?: string;\n}\n\n/**\n * Per-instance wrapper. Owns the chrome around a widget instance: identity\n * context, header (title + icon), edit-mode `inert` attribute, and the\n * error/loading boundaries that keep neighbours mounted when one widget fails\n * or is still resolving.\n */\nexport const WidgetChrome = forwardRef< HTMLDivElement, WidgetChromeProps >(\n\tfunction WidgetChrome( { widget, index, className }, ref ) {\n\t\tconst { widgetTypes, isResolvingWidgetTypes, editMode } =\n\t\t\tuseDashboardInternalContext();\n\t\tconst widgetType = widgetTypes.find( ( t ) => t.name === widget.type );\n\t\tconst titleId = useId();\n\n\t\tconst contextValue = useMemo(\n\t\t\t() => ( {\n\t\t\t\tuuid: widget.uuid,\n\t\t\t\tname: widget.type,\n\t\t\t\tindex,\n\t\t\t} ),\n\t\t\t[ widget.uuid, widget.type, index ]\n\t\t);\n\n\t\tif ( ! widgetType ) {\n\t\t\tif ( isResolvingWidgetTypes ) {\n\t\t\t\treturn (\n\t\t\t\t\t<WidgetContextProvider value={ contextValue }>\n\t\t\t\t\t\t<Card.Root\n\t\t\t\t\t\t\trender={ <section /> }\n\t\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\t\tclassName={ clsx( styles.widgetChrome, className ) }\n\t\t\t\t\t\t\taria-busy=\"true\"\n\t\t\t\t\t\t\taria-label={ __( 'Loading' ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Card.Content\n\t\t\t\t\t\t\t\tclassName={ styles.widgetChromeContent }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<LoadingOverlay />\n\t\t\t\t\t\t\t</Card.Content>\n\t\t\t\t\t\t</Card.Root>\n\t\t\t\t\t</WidgetContextProvider>\n\t\t\t\t);\n\t\t\t}\n\n\t\t\treturn (\n\t\t\t\t<WidgetContextProvider value={ contextValue }>\n\t\t\t\t\t<Card.Root\n\t\t\t\t\t\trender={ <section /> }\n\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\tclassName={ clsx( styles.widgetChrome, className ) }\n\t\t\t\t\t\taria-label={ __( 'Missing widget' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<UnavailableWidget widgetTypeName={ widget.type } />\n\t\t\t\t\t</Card.Root>\n\t\t\t\t</WidgetContextProvider>\n\t\t\t);\n\t\t}\n\n\t\t// `presentation` encodes two independent axes. `full-bleed` hides\n\t\t// the header; both `full-bleed` and `content-bleed` let the body\n\t\t// break out of the content padding.\n\t\tconst { presentation } = widgetType;\n\t\tconst isHeaderHidden = presentation === 'full-bleed';\n\t\tconst isBodyBleeding =\n\t\t\tpresentation === 'full-bleed' || presentation === 'content-bleed';\n\t\tconst header = <Header titleId={ titleId } widgetType={ widgetType } />;\n\n\t\tconst body = (\n\t\t\t<WidgetErrorBoundary>\n\t\t\t\t<Suspense fallback={ <LoadingOverlay /> }>\n\t\t\t\t\t<WidgetRender widget={ widget } widgetType={ widgetType } />\n\t\t\t\t</Suspense>\n\t\t\t</WidgetErrorBoundary>\n\t\t);\n\n\t\treturn (\n\t\t\t<WidgetContextProvider value={ contextValue }>\n\t\t\t\t<Card.Root\n\t\t\t\t\trender={ <section /> }\n\t\t\t\t\tref={ ref }\n\t\t\t\t\tclassName={ clsx( styles.widgetChrome, className ) }\n\t\t\t\t\taria-labelledby={ widgetType.title ? titleId : undefined }\n\t\t\t\t\t{ ...( editMode ? { inert: 'true' } : {} ) }\n\t\t\t\t>\n\t\t\t\t\t{ isHeaderHidden ? (\n\t\t\t\t\t\t<VisuallyHidden>{ header }</VisuallyHidden>\n\t\t\t\t\t) : (\n\t\t\t\t\t\theader\n\t\t\t\t\t) }\n\n\t\t\t\t\t<Card.Content\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\tstyles.widgetChromeContent,\n\t\t\t\t\t\t\tisBodyBleeding && styles.widgetChromeContentBleed\n\t\t\t\t\t\t) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ isBodyBleeding ? (\n\t\t\t\t\t\t\t<Card.FullBleed\n\t\t\t\t\t\t\t\tclassName={ styles.widgetChromeBleedScroll }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ body }\n\t\t\t\t\t\t\t</Card.FullBleed>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\tbody\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Card.Content>\n\t\t\t\t</Card.Root>\n\t\t\t</WidgetContextProvider>\n\t\t);\n\t}\n);\n", "type GlobalScopeWithStyleRuntime = typeof globalThis & {\n\t// This global is shared by separately bundled copies of this package.\n\t// Keep its shape backward compatible after release.\n\t__wpStyleRuntime?: {\n\t\tdocuments: Map< Document, number >;\n\t\tstyles: Map< string, string >;\n\t\tinjectedStyles: WeakMap< Document, Set< string > >;\n\t};\n};\n\nconst STYLE_HASH_ATTRIBUTE = 'data-wp-hash';\n\n/**\n * Returns the shared style runtime registry.\n *\n * The registry is stored on `globalThis` so separately bundled copies of this\n * package can coordinate through the same document and style maps.\n *\n * @return The shared runtime registry.\n */\nfunction getRuntime() {\n\tconst globalScope = globalThis as GlobalScopeWithStyleRuntime;\n\n\tif ( globalScope.__wpStyleRuntime ) {\n\t\treturn globalScope.__wpStyleRuntime;\n\t}\n\n\tglobalScope.__wpStyleRuntime = {\n\t\tdocuments: new Map(),\n\t\tstyles: new Map(),\n\t\tinjectedStyles: new WeakMap(),\n\t};\n\n\tif ( typeof document !== 'undefined' ) {\n\t\tregisterDocument( document );\n\t}\n\n\treturn globalScope.__wpStyleRuntime;\n}\n\n/**\n * Checks whether a document already contains a style tag for a hash.\n *\n * @param targetDocument Document to inspect.\n * @param hash Stable hash for the transformed CSS.\n *\n * @return Whether the style hash already exists in the document.\n */\nfunction documentContainsStyleHash(\n\ttargetDocument: Document,\n\thash: string\n): boolean {\n\tif ( ! targetDocument.head ) {\n\t\treturn false;\n\t}\n\n\tfor ( const style of targetDocument.head.querySelectorAll(\n\t\t`style[${ STYLE_HASH_ATTRIBUTE }]`\n\t) ) {\n\t\tif ( style.getAttribute( STYLE_HASH_ATTRIBUTE ) === hash ) {\n\t\t\treturn true;\n\t\t}\n\t}\n\n\treturn false;\n}\n\n/**\n * Injects a registered style into a document, unless that document already\n * contains a style tag for the same hash.\n *\n * @param targetDocument Document to inject the style into.\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nfunction injectStyle( targetDocument: Document, hash: string, css: string ) {\n\tif ( ! targetDocument.head ) {\n\t\treturn;\n\t}\n\n\tconst runtime = getRuntime();\n\tlet injectedStyles = runtime.injectedStyles.get( targetDocument );\n\n\tif ( ! injectedStyles ) {\n\t\tinjectedStyles = new Set();\n\t\truntime.injectedStyles.set( targetDocument, injectedStyles );\n\t}\n\n\tif ( injectedStyles.has( hash ) ) {\n\t\treturn;\n\t}\n\n\t// Older generated CSS module output can still inject matching style tags\n\t// after this document's cache is created, so keep the DOM as the fallback\n\t// source of truth on cache misses.\n\tif ( documentContainsStyleHash( targetDocument, hash ) ) {\n\t\tinjectedStyles.add( hash );\n\t\treturn;\n\t}\n\n\tconst style = targetDocument.createElement( 'style' );\n\tstyle.setAttribute( STYLE_HASH_ATTRIBUTE, hash );\n\tstyle.appendChild( targetDocument.createTextNode( css ) );\n\ttargetDocument.head.appendChild( style );\n\tinjectedStyles.add( hash );\n}\n\n/**\n * Registers a document as a style injection target.\n *\n * Existing registered styles are replayed into the document immediately.\n * Documents are reference-counted so multiple providers can safely register the\n * same document without one cleanup removing it while another registration is\n * still active.\n *\n * @param targetDocument Document to receive registered styles.\n * @return Cleanup function that unregisters this document registration.\n */\nexport function registerDocument( targetDocument: Document ) {\n\tconst runtime = getRuntime();\n\n\truntime.documents.set(\n\t\ttargetDocument,\n\t\t( runtime.documents.get( targetDocument ) ?? 0 ) + 1\n\t);\n\n\tfor ( const [ hash, css ] of runtime.styles ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n\n\treturn () => {\n\t\tconst count = runtime.documents.get( targetDocument );\n\n\t\tif ( count === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( count <= 1 ) {\n\t\t\truntime.documents.delete( targetDocument );\n\t\t\treturn;\n\t\t}\n\n\t\truntime.documents.set( targetDocument, count - 1 );\n\t};\n}\n\n/**\n * Registers a style and injects it into all registered documents.\n *\n * The hash is used as the deduplication key, so calling this repeatedly with\n * the same hash will not add duplicate style tags to a document.\n * Registered styles are retained for the lifetime of the page so they can be\n * replayed into documents that are registered later.\n *\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nexport function registerStyle( hash: string, css: string ) {\n\tconst runtime = getRuntime();\n\n\truntime.styles.set( hash, css );\n\n\tfor ( const targetDocument of runtime.documents.keys() ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n}\n", "import { registerStyle } from '@wordpress/style-runtime';\nif (typeof process === 'undefined' || process.env.NODE_ENV !== 'test') {\n\tregisterStyle(\"345dedc0b8\", \"._79b45ce7d3422efe__widgetChrome{contain:layout;height:100%}._79b45ce7d3422efe__widgetChrome:has(._9f0be51a1b96c8d7__widgetChromeContent :focus-visible){outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus,var(--wp-admin-theme-color,#3858e9));outline-offset:2px}.d85f7657585b9203__widgetChromeHeaderIcon{color:var(--wpds-color-foreground-content-neutral,#1e1e1e);display:inline-flex}._9f0be51a1b96c8d7__widgetChromeContent{flex:1;height:100%;min-height:0;min-width:0;overflow-y:auto}._21770471c9c2115b__widgetChromeContentBleed{padding-block:0}._229727240ac2aa18__widgetChromeBleedScroll{height:100%;margin-block-end:0;overflow-y:auto}._3c919e86d1bb80ab__loading,._9b694d63bdec1a98__unavailable{height:100%}\");\n}\nexport default {\"widgetChrome\":\"_79b45ce7d3422efe__widgetChrome\",\"widgetChromeContent\":\"_9f0be51a1b96c8d7__widgetChromeContent\",\"widgetChromeHeaderIcon\":\"d85f7657585b9203__widgetChromeHeaderIcon\",\"widgetChromeContentBleed\":\"_21770471c9c2115b__widgetChromeContentBleed\",\"widgetChromeBleedScroll\":\"_229727240ac2aa18__widgetChromeBleedScroll\",\"loading\":\"_3c919e86d1bb80ab__loading\",\"unavailable\":\"_9b694d63bdec1a98__unavailable\"};\n"],
|
|
5
5
|
"mappings": "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",
|
|
6
6
|
"names": ["WidgetChrome", "clsx"]
|
|
7
7
|
}
|
|
@@ -120,7 +120,7 @@ function registerStyle(hash, css) {
|
|
|
120
120
|
|
|
121
121
|
// packages/widget-dashboard/src/components/widgets/widget-resize-handle.module.css
|
|
122
122
|
if (typeof process === "undefined" || process.env.NODE_ENV !== "test") {
|
|
123
|
-
registerStyle("
|
|
123
|
+
registerStyle("2e64f95efa", '.a70c7d5347a2f54b__handle{--widget-resize-handle-visual-inset:var(--wpds-dimension-padding-xs,4px);--widget-resize-handle-hover-scale:1.18;background:transparent;bottom:0;box-sizing:border-box;inset-inline-end:0;padding:0;position:absolute;z-index:1}.a70c7d5347a2f54b__handle:focus-visible{border-radius:var(--wpds-border-radius-sm,2px);outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus,var(--wp-admin-theme-color,#3858e9));outline-offset:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px))}.aa1d4aafe4d24e03__resizing{opacity:.72}._61d861c3afc33ad5__handleCorner{cursor:nwse-resize;height:var(--wpds-dimension-size-sm,24px);width:var(--wpds-dimension-size-sm,24px)}._61d861c3afc33ad5__handleCorner:after{border-block-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));border-block-start:none;border-end-end-radius:var(--wpds-border-radius-md,4px);border-inline-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));border-inline-start:none;bottom:var(--widget-resize-handle-visual-inset);box-sizing:border-box;content:"";height:var(--wpds-dimension-size-4xs,8px);inset-inline-end:var(--widget-resize-handle-visual-inset);position:absolute;transform:scale(1);transform-origin:100% 100%;width:var(--wpds-dimension-size-4xs,8px)}[dir=rtl] ._61d861c3afc33ad5__handleCorner:after{transform-origin:0 100%}._61d861c3afc33ad5__handleCorner.aa1d4aafe4d24e03__resizing:after,._61d861c3afc33ad5__handleCorner:focus-visible:after,._61d861c3afc33ad5__handleCorner:hover:after{border-block-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));border-inline-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));transform:scale(var(--widget-resize-handle-hover-scale))}._86ab3a6eb52bc222__handleHorizontal{align-items:center;border:none;cursor:ew-resize;display:flex;height:var(--wpds-dimension-size-lg,40px);justify-content:center;padding-inline-end:var(--widget-resize-handle-visual-inset);width:var(--wpds-dimension-size-sm,24px)}@media not (prefers-reduced-motion){._61d861c3afc33ad5__handleCorner:after{transition:transform var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)),border-block-end-color var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)),border-inline-end-color var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1))}._86ab3a6eb52bc222__handleHorizontal:after{transition:transform var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)),background-color var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1))}}._86ab3a6eb52bc222__handleHorizontal:after{background-color:var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));content:"";height:var(--wpds-dimension-size-3xs,12px);transform:scale(1);transform-origin:50% 100%;width:var(--wpds-border-width-sm,2px)}._86ab3a6eb52bc222__handleHorizontal.aa1d4aafe4d24e03__resizing:after,._86ab3a6eb52bc222__handleHorizontal:focus-visible:after,._86ab3a6eb52bc222__handleHorizontal:hover:after{background-color:var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));transform:scale(var(--widget-resize-handle-hover-scale))}@media (forced-colors:active){._61d861c3afc33ad5__handleCorner.aa1d4aafe4d24e03__resizing:after,._61d861c3afc33ad5__handleCorner:after,._61d861c3afc33ad5__handleCorner:focus-visible:after,._61d861c3afc33ad5__handleCorner:hover:after{border-block-end-color:Highlight;border-inline-end-color:Highlight}._86ab3a6eb52bc222__handleHorizontal.aa1d4aafe4d24e03__resizing:after,._86ab3a6eb52bc222__handleHorizontal:after,._86ab3a6eb52bc222__handleHorizontal:focus-visible:after,._86ab3a6eb52bc222__handleHorizontal:hover:after{background-color:Highlight}}');
|
|
124
124
|
}
|
|
125
125
|
var widget_resize_handle_default = { "handle": "a70c7d5347a2f54b__handle", "resizing": "aa1d4aafe4d24e03__resizing", "handleCorner": "_61d861c3afc33ad5__handleCorner", "handleHorizontal": "_86ab3a6eb52bc222__handleHorizontal" };
|
|
126
126
|
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/widgets/widget-resize-handle.tsx", "../../../../style-runtime/src/index.ts", "../../../src/components/widgets/widget-resize-handle.module.css"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport type { ResizeHandleRenderProps } from '@wordpress/grid';\n\n/**\n * Internal dependencies\n */\nimport styles from './widget-resize-handle.module.css';\n\ntype WidgetResizeHandleProps = Omit< ResizeHandleRenderProps, 'ref' >;\n\n/**\n * Rounded L-shaped resize affordance for the widget dashboard. Passed to\n * `DashboardGrid` via `renderResizeHandle` so the grid keeps gesture wiring.\n *\n * Uses `forwardRef` because the grid attaches dnd-kit's merged node ref via\n * the JSX `ref` attribute, not as a regular prop.\n */\nexport const WidgetResizeHandle = forwardRef<\n\tHTMLDivElement,\n\tWidgetResizeHandleProps\n>( function WidgetResizeHandle(\n\t{ listeners, attributes, verticalResizable, isResizing },\n\tref\n) {\n\tif ( ! verticalResizable ) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\tstyles.handle,\n\t\t\t\t\tstyles.handleHorizontal,\n\t\t\t\t\tisResizing && styles.resizing\n\t\t\t\t) }\n\t\t\t\t{ ...listeners }\n\t\t\t\t{ ...attributes }\n\t\t\t></div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tref={ ref }\n\t\t\tclassName={ clsx(\n\t\t\t\tstyles.handle,\n\t\t\t\tstyles.handleCorner,\n\t\t\t\tisResizing && styles.resizing\n\t\t\t) }\n\t\t\t{ ...listeners }\n\t\t\t{ ...attributes }\n\t\t></div>\n\t);\n} );\n", "type GlobalScopeWithStyleRuntime = typeof globalThis & {\n\t// This global is shared by separately bundled copies of this package.\n\t// Keep its shape backward compatible after release.\n\t__wpStyleRuntime?: {\n\t\tdocuments: Map< Document, number >;\n\t\tstyles: Map< string, string >;\n\t\tinjectedStyles: WeakMap< Document, Set< string > >;\n\t};\n};\n\nconst STYLE_HASH_ATTRIBUTE = 'data-wp-hash';\n\n/**\n * Returns the shared style runtime registry.\n *\n * The registry is stored on `globalThis` so separately bundled copies of this\n * package can coordinate through the same document and style maps.\n *\n * @return The shared runtime registry.\n */\nfunction getRuntime() {\n\tconst globalScope = globalThis as GlobalScopeWithStyleRuntime;\n\n\tif ( globalScope.__wpStyleRuntime ) {\n\t\treturn globalScope.__wpStyleRuntime;\n\t}\n\n\tglobalScope.__wpStyleRuntime = {\n\t\tdocuments: new Map(),\n\t\tstyles: new Map(),\n\t\tinjectedStyles: new WeakMap(),\n\t};\n\n\tif ( typeof document !== 'undefined' ) {\n\t\tregisterDocument( document );\n\t}\n\n\treturn globalScope.__wpStyleRuntime;\n}\n\n/**\n * Checks whether a document already contains a style tag for a hash.\n *\n * @param targetDocument Document to inspect.\n * @param hash Stable hash for the transformed CSS.\n *\n * @return Whether the style hash already exists in the document.\n */\nfunction documentContainsStyleHash(\n\ttargetDocument: Document,\n\thash: string\n): boolean {\n\tif ( ! targetDocument.head ) {\n\t\treturn false;\n\t}\n\n\tfor ( const style of targetDocument.head.querySelectorAll(\n\t\t`style[${ STYLE_HASH_ATTRIBUTE }]`\n\t) ) {\n\t\tif ( style.getAttribute( STYLE_HASH_ATTRIBUTE ) === hash ) {\n\t\t\treturn true;\n\t\t}\n\t}\n\n\treturn false;\n}\n\n/**\n * Injects a registered style into a document, unless that document already\n * contains a style tag for the same hash.\n *\n * @param targetDocument Document to inject the style into.\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nfunction injectStyle( targetDocument: Document, hash: string, css: string ) {\n\tif ( ! targetDocument.head ) {\n\t\treturn;\n\t}\n\n\tconst runtime = getRuntime();\n\tlet injectedStyles = runtime.injectedStyles.get( targetDocument );\n\n\tif ( ! injectedStyles ) {\n\t\tinjectedStyles = new Set();\n\t\truntime.injectedStyles.set( targetDocument, injectedStyles );\n\t}\n\n\tif ( injectedStyles.has( hash ) ) {\n\t\treturn;\n\t}\n\n\t// Older generated CSS module output can still inject matching style tags\n\t// after this document's cache is created, so keep the DOM as the fallback\n\t// source of truth on cache misses.\n\tif ( documentContainsStyleHash( targetDocument, hash ) ) {\n\t\tinjectedStyles.add( hash );\n\t\treturn;\n\t}\n\n\tconst style = targetDocument.createElement( 'style' );\n\tstyle.setAttribute( STYLE_HASH_ATTRIBUTE, hash );\n\tstyle.appendChild( targetDocument.createTextNode( css ) );\n\ttargetDocument.head.appendChild( style );\n\tinjectedStyles.add( hash );\n}\n\n/**\n * Registers a document as a style injection target.\n *\n * Existing registered styles are replayed into the document immediately.\n * Documents are reference-counted so multiple providers can safely register the\n * same document without one cleanup removing it while another registration is\n * still active.\n *\n * @param targetDocument Document to receive registered styles.\n * @return Cleanup function that unregisters this document registration.\n */\nexport function registerDocument( targetDocument: Document ) {\n\tconst runtime = getRuntime();\n\n\truntime.documents.set(\n\t\ttargetDocument,\n\t\t( runtime.documents.get( targetDocument ) ?? 0 ) + 1\n\t);\n\n\tfor ( const [ hash, css ] of runtime.styles ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n\n\treturn () => {\n\t\tconst count = runtime.documents.get( targetDocument );\n\n\t\tif ( count === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( count <= 1 ) {\n\t\t\truntime.documents.delete( targetDocument );\n\t\t\treturn;\n\t\t}\n\n\t\truntime.documents.set( targetDocument, count - 1 );\n\t};\n}\n\n/**\n * Registers a style and injects it into all registered documents.\n *\n * The hash is used as the deduplication key, so calling this repeatedly with\n * the same hash will not add duplicate style tags to a document.\n * Registered styles are retained for the lifetime of the page so they can be\n * replayed into documents that are registered later.\n *\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nexport function registerStyle( hash: string, css: string ) {\n\tconst runtime = getRuntime();\n\n\truntime.styles.set( hash, css );\n\n\tfor ( const targetDocument of runtime.documents.keys() ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n}\n", "import { registerStyle } from '@wordpress/style-runtime';\nif (typeof process === 'undefined' || process.env.NODE_ENV !== 'test') {\n\tregisterStyle(\"426d5d3a15\", \".a70c7d5347a2f54b__handle{--widget-resize-handle-visual-inset:var(--wpds-dimension-padding-xs,4px);--widget-resize-handle-hover-scale:1.18;background:transparent;bottom:0;box-sizing:border-box;inset-inline-end:0;padding:0;position:absolute;z-index:1}.a70c7d5347a2f54b__handle:focus-visible{border-radius:var(--wpds-border-radius-sm,2px);outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus,var(--wp-admin-theme-color,#3858e9));outline-offset:calc(var(--wpds-dimension-base, 4px)*.5)}.aa1d4aafe4d24e03__resizing{opacity:.72}._61d861c3afc33ad5__handleCorner{cursor:nwse-resize;height:var(--wpds-dimension-size-sm,24px);width:var(--wpds-dimension-size-sm,24px)}._61d861c3afc33ad5__handleCorner:after{border-block-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));border-block-start:none;border-end-end-radius:var(--wpds-border-radius-md,4px);border-inline-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));border-inline-start:none;bottom:var(--widget-resize-handle-visual-inset);box-sizing:border-box;content:\\\"\\\";height:var(--wpds-dimension-size-4xs,8px);inset-inline-end:var(--widget-resize-handle-visual-inset);position:absolute;transform:scale(1);transform-origin:100% 100%;width:var(--wpds-dimension-size-4xs,8px)}[dir=rtl] ._61d861c3afc33ad5__handleCorner:after{transform-origin:0 100%}._61d861c3afc33ad5__handleCorner.aa1d4aafe4d24e03__resizing:after,._61d861c3afc33ad5__handleCorner:focus-visible:after,._61d861c3afc33ad5__handleCorner:hover:after{border-block-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));border-inline-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));transform:scale(var(--widget-resize-handle-hover-scale))}._86ab3a6eb52bc222__handleHorizontal{align-items:center;border:none;cursor:ew-resize;display:flex;height:var(--wpds-dimension-size-lg,40px);justify-content:center;padding-inline-end:var(--widget-resize-handle-visual-inset);width:var(--wpds-dimension-size-sm,24px)}@media not (prefers-reduced-motion){._61d861c3afc33ad5__handleCorner:after{transition:transform var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)),border-block-end-color var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)),border-inline-end-color var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1))}._86ab3a6eb52bc222__handleHorizontal:after{transition:transform var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)),background-color var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1))}}._86ab3a6eb52bc222__handleHorizontal:after{background-color:var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));content:\\\"\\\";height:var(--wpds-dimension-size-3xs,12px);transform:scale(1);transform-origin:50% 100%;width:var(--wpds-border-width-sm,2px)}._86ab3a6eb52bc222__handleHorizontal.aa1d4aafe4d24e03__resizing:after,._86ab3a6eb52bc222__handleHorizontal:focus-visible:after,._86ab3a6eb52bc222__handleHorizontal:hover:after{background-color:var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));transform:scale(var(--widget-resize-handle-hover-scale))}@media (forced-colors:active){._61d861c3afc33ad5__handleCorner.aa1d4aafe4d24e03__resizing:after,._61d861c3afc33ad5__handleCorner:after,._61d861c3afc33ad5__handleCorner:focus-visible:after,._61d861c3afc33ad5__handleCorner:hover:after{border-block-end-color:Highlight;border-inline-end-color:Highlight}._86ab3a6eb52bc222__handleHorizontal.aa1d4aafe4d24e03__resizing:after,._86ab3a6eb52bc222__handleHorizontal:after,._86ab3a6eb52bc222__handleHorizontal:focus-visible:after,._86ab3a6eb52bc222__handleHorizontal:hover:after{background-color:Highlight}}\");\n}\nexport default {\"handle\":\"a70c7d5347a2f54b__handle\",\"resizing\":\"aa1d4aafe4d24e03__resizing\",\"handleCorner\":\"_61d861c3afc33ad5__handleCorner\",\"handleHorizontal\":\"_86ab3a6eb52bc222__handleHorizontal\"};\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AAKjB,qBAA2B;;;ACE3B,IAAM,uBAAuB;AAU7B,SAAS,aAAa;AACrB,QAAM,cAAc;AAEpB,MAAK,YAAY,kBAAmB;AACnC,WAAO,YAAY;AAAA,EACpB;AAEA,cAAY,mBAAmB;AAAA,IAC9B,WAAW,oBAAI,IAAI;AAAA,IACnB,QAAQ,oBAAI,IAAI;AAAA,IAChB,gBAAgB,oBAAI,QAAQ;AAAA,EAC7B;AAEA,MAAK,OAAO,aAAa,aAAc;AACtC,qBAAkB,QAAS;AAAA,EAC5B;AAEA,SAAO,YAAY;AACpB;AAUA,SAAS,0BACR,gBACA,MACU;AACV,MAAK,CAAE,eAAe,MAAO;AAC5B,WAAO;AAAA,EACR;AAEA,aAAY,SAAS,eAAe,KAAK;AAAA,IACxC,SAAU,oBAAqB;AAAA,EAChC,GAAI;AACH,QAAK,MAAM,aAAc,oBAAqB,MAAM,MAAO;AAC1D,aAAO;AAAA,IACR;AAAA,EACD;AAEA,SAAO;AACR;AAUA,SAAS,YAAa,gBAA0B,MAAc,KAAc;AAC3E,MAAK,CAAE,eAAe,MAAO;AAC5B;AAAA,EACD;AAEA,QAAM,UAAU,WAAW;AAC3B,MAAI,iBAAiB,QAAQ,eAAe,IAAK,cAAe;AAEhE,MAAK,CAAE,gBAAiB;AACvB,qBAAiB,oBAAI,IAAI;AACzB,YAAQ,eAAe,IAAK,gBAAgB,cAAe;AAAA,EAC5D;AAEA,MAAK,eAAe,IAAK,IAAK,GAAI;AACjC;AAAA,EACD;AAKA,MAAK,0BAA2B,gBAAgB,IAAK,GAAI;AACxD,mBAAe,IAAK,IAAK;AACzB;AAAA,EACD;AAEA,QAAM,QAAQ,eAAe,cAAe,OAAQ;AACpD,QAAM,aAAc,sBAAsB,IAAK;AAC/C,QAAM,YAAa,eAAe,eAAgB,GAAI,CAAE;AACxD,iBAAe,KAAK,YAAa,KAAM;AACvC,iBAAe,IAAK,IAAK;AAC1B;AAaO,SAAS,iBAAkB,gBAA2B;AAC5D,QAAM,UAAU,WAAW;AAE3B,UAAQ,UAAU;AAAA,IACjB;AAAA,KACE,QAAQ,UAAU,IAAK,cAAe,KAAK,KAAM;AAAA,EACpD;AAEA,aAAY,CAAE,MAAM,GAAI,KAAK,QAAQ,QAAS;AAC7C,gBAAa,gBAAgB,MAAM,GAAI;AAAA,EACxC;AAEA,SAAO,MAAM;AACZ,UAAM,QAAQ,QAAQ,UAAU,IAAK,cAAe;AAEpD,QAAK,UAAU,QAAY;AAC1B;AAAA,IACD;AAEA,QAAK,SAAS,GAAI;AACjB,cAAQ,UAAU,OAAQ,cAAe;AACzC;AAAA,IACD;AAEA,YAAQ,UAAU,IAAK,gBAAgB,QAAQ,CAAE;AAAA,EAClD;AACD;AAaO,SAAS,cAAe,MAAc,KAAc;AAC1D,QAAM,UAAU,WAAW;AAE3B,UAAQ,OAAO,IAAK,MAAM,GAAI;AAE9B,aAAY,kBAAkB,QAAQ,UAAU,KAAK,GAAI;AACxD,gBAAa,gBAAgB,MAAM,GAAI;AAAA,EACxC;AACD;;;ACpKA,IAAI,OAAO,YAAY,eAAe,QAAQ,IAAI,aAAa,QAAQ;AACtE,gBAAc,cAAc,
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport type { ResizeHandleRenderProps } from '@wordpress/grid';\n\n/**\n * Internal dependencies\n */\nimport styles from './widget-resize-handle.module.css';\n\ntype WidgetResizeHandleProps = Omit< ResizeHandleRenderProps, 'ref' >;\n\n/**\n * Rounded L-shaped resize affordance for the widget dashboard. Passed to\n * `DashboardGrid` via `renderResizeHandle` so the grid keeps gesture wiring.\n *\n * Uses `forwardRef` because the grid attaches dnd-kit's merged node ref via\n * the JSX `ref` attribute, not as a regular prop.\n */\nexport const WidgetResizeHandle = forwardRef<\n\tHTMLDivElement,\n\tWidgetResizeHandleProps\n>( function WidgetResizeHandle(\n\t{ listeners, attributes, verticalResizable, isResizing },\n\tref\n) {\n\tif ( ! verticalResizable ) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\tstyles.handle,\n\t\t\t\t\tstyles.handleHorizontal,\n\t\t\t\t\tisResizing && styles.resizing\n\t\t\t\t) }\n\t\t\t\t{ ...listeners }\n\t\t\t\t{ ...attributes }\n\t\t\t></div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tref={ ref }\n\t\t\tclassName={ clsx(\n\t\t\t\tstyles.handle,\n\t\t\t\tstyles.handleCorner,\n\t\t\t\tisResizing && styles.resizing\n\t\t\t) }\n\t\t\t{ ...listeners }\n\t\t\t{ ...attributes }\n\t\t></div>\n\t);\n} );\n", "type GlobalScopeWithStyleRuntime = typeof globalThis & {\n\t// This global is shared by separately bundled copies of this package.\n\t// Keep its shape backward compatible after release.\n\t__wpStyleRuntime?: {\n\t\tdocuments: Map< Document, number >;\n\t\tstyles: Map< string, string >;\n\t\tinjectedStyles: WeakMap< Document, Set< string > >;\n\t};\n};\n\nconst STYLE_HASH_ATTRIBUTE = 'data-wp-hash';\n\n/**\n * Returns the shared style runtime registry.\n *\n * The registry is stored on `globalThis` so separately bundled copies of this\n * package can coordinate through the same document and style maps.\n *\n * @return The shared runtime registry.\n */\nfunction getRuntime() {\n\tconst globalScope = globalThis as GlobalScopeWithStyleRuntime;\n\n\tif ( globalScope.__wpStyleRuntime ) {\n\t\treturn globalScope.__wpStyleRuntime;\n\t}\n\n\tglobalScope.__wpStyleRuntime = {\n\t\tdocuments: new Map(),\n\t\tstyles: new Map(),\n\t\tinjectedStyles: new WeakMap(),\n\t};\n\n\tif ( typeof document !== 'undefined' ) {\n\t\tregisterDocument( document );\n\t}\n\n\treturn globalScope.__wpStyleRuntime;\n}\n\n/**\n * Checks whether a document already contains a style tag for a hash.\n *\n * @param targetDocument Document to inspect.\n * @param hash Stable hash for the transformed CSS.\n *\n * @return Whether the style hash already exists in the document.\n */\nfunction documentContainsStyleHash(\n\ttargetDocument: Document,\n\thash: string\n): boolean {\n\tif ( ! targetDocument.head ) {\n\t\treturn false;\n\t}\n\n\tfor ( const style of targetDocument.head.querySelectorAll(\n\t\t`style[${ STYLE_HASH_ATTRIBUTE }]`\n\t) ) {\n\t\tif ( style.getAttribute( STYLE_HASH_ATTRIBUTE ) === hash ) {\n\t\t\treturn true;\n\t\t}\n\t}\n\n\treturn false;\n}\n\n/**\n * Injects a registered style into a document, unless that document already\n * contains a style tag for the same hash.\n *\n * @param targetDocument Document to inject the style into.\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nfunction injectStyle( targetDocument: Document, hash: string, css: string ) {\n\tif ( ! targetDocument.head ) {\n\t\treturn;\n\t}\n\n\tconst runtime = getRuntime();\n\tlet injectedStyles = runtime.injectedStyles.get( targetDocument );\n\n\tif ( ! injectedStyles ) {\n\t\tinjectedStyles = new Set();\n\t\truntime.injectedStyles.set( targetDocument, injectedStyles );\n\t}\n\n\tif ( injectedStyles.has( hash ) ) {\n\t\treturn;\n\t}\n\n\t// Older generated CSS module output can still inject matching style tags\n\t// after this document's cache is created, so keep the DOM as the fallback\n\t// source of truth on cache misses.\n\tif ( documentContainsStyleHash( targetDocument, hash ) ) {\n\t\tinjectedStyles.add( hash );\n\t\treturn;\n\t}\n\n\tconst style = targetDocument.createElement( 'style' );\n\tstyle.setAttribute( STYLE_HASH_ATTRIBUTE, hash );\n\tstyle.appendChild( targetDocument.createTextNode( css ) );\n\ttargetDocument.head.appendChild( style );\n\tinjectedStyles.add( hash );\n}\n\n/**\n * Registers a document as a style injection target.\n *\n * Existing registered styles are replayed into the document immediately.\n * Documents are reference-counted so multiple providers can safely register the\n * same document without one cleanup removing it while another registration is\n * still active.\n *\n * @param targetDocument Document to receive registered styles.\n * @return Cleanup function that unregisters this document registration.\n */\nexport function registerDocument( targetDocument: Document ) {\n\tconst runtime = getRuntime();\n\n\truntime.documents.set(\n\t\ttargetDocument,\n\t\t( runtime.documents.get( targetDocument ) ?? 0 ) + 1\n\t);\n\n\tfor ( const [ hash, css ] of runtime.styles ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n\n\treturn () => {\n\t\tconst count = runtime.documents.get( targetDocument );\n\n\t\tif ( count === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( count <= 1 ) {\n\t\t\truntime.documents.delete( targetDocument );\n\t\t\treturn;\n\t\t}\n\n\t\truntime.documents.set( targetDocument, count - 1 );\n\t};\n}\n\n/**\n * Registers a style and injects it into all registered documents.\n *\n * The hash is used as the deduplication key, so calling this repeatedly with\n * the same hash will not add duplicate style tags to a document.\n * Registered styles are retained for the lifetime of the page so they can be\n * replayed into documents that are registered later.\n *\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nexport function registerStyle( hash: string, css: string ) {\n\tconst runtime = getRuntime();\n\n\truntime.styles.set( hash, css );\n\n\tfor ( const targetDocument of runtime.documents.keys() ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n}\n", "import { registerStyle } from '@wordpress/style-runtime';\nif (typeof process === 'undefined' || process.env.NODE_ENV !== 'test') {\n\tregisterStyle(\"2e64f95efa\", \".a70c7d5347a2f54b__handle{--widget-resize-handle-visual-inset:var(--wpds-dimension-padding-xs,4px);--widget-resize-handle-hover-scale:1.18;background:transparent;bottom:0;box-sizing:border-box;inset-inline-end:0;padding:0;position:absolute;z-index:1}.a70c7d5347a2f54b__handle:focus-visible{border-radius:var(--wpds-border-radius-sm,2px);outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus,var(--wp-admin-theme-color,#3858e9));outline-offset:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px))}.aa1d4aafe4d24e03__resizing{opacity:.72}._61d861c3afc33ad5__handleCorner{cursor:nwse-resize;height:var(--wpds-dimension-size-sm,24px);width:var(--wpds-dimension-size-sm,24px)}._61d861c3afc33ad5__handleCorner:after{border-block-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));border-block-start:none;border-end-end-radius:var(--wpds-border-radius-md,4px);border-inline-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));border-inline-start:none;bottom:var(--widget-resize-handle-visual-inset);box-sizing:border-box;content:\\\"\\\";height:var(--wpds-dimension-size-4xs,8px);inset-inline-end:var(--widget-resize-handle-visual-inset);position:absolute;transform:scale(1);transform-origin:100% 100%;width:var(--wpds-dimension-size-4xs,8px)}[dir=rtl] ._61d861c3afc33ad5__handleCorner:after{transform-origin:0 100%}._61d861c3afc33ad5__handleCorner.aa1d4aafe4d24e03__resizing:after,._61d861c3afc33ad5__handleCorner:focus-visible:after,._61d861c3afc33ad5__handleCorner:hover:after{border-block-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));border-inline-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));transform:scale(var(--widget-resize-handle-hover-scale))}._86ab3a6eb52bc222__handleHorizontal{align-items:center;border:none;cursor:ew-resize;display:flex;height:var(--wpds-dimension-size-lg,40px);justify-content:center;padding-inline-end:var(--widget-resize-handle-visual-inset);width:var(--wpds-dimension-size-sm,24px)}@media not (prefers-reduced-motion){._61d861c3afc33ad5__handleCorner:after{transition:transform var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)),border-block-end-color var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)),border-inline-end-color var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1))}._86ab3a6eb52bc222__handleHorizontal:after{transition:transform var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)),background-color var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1))}}._86ab3a6eb52bc222__handleHorizontal:after{background-color:var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));content:\\\"\\\";height:var(--wpds-dimension-size-3xs,12px);transform:scale(1);transform-origin:50% 100%;width:var(--wpds-border-width-sm,2px)}._86ab3a6eb52bc222__handleHorizontal.aa1d4aafe4d24e03__resizing:after,._86ab3a6eb52bc222__handleHorizontal:focus-visible:after,._86ab3a6eb52bc222__handleHorizontal:hover:after{background-color:var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));transform:scale(var(--widget-resize-handle-hover-scale))}@media (forced-colors:active){._61d861c3afc33ad5__handleCorner.aa1d4aafe4d24e03__resizing:after,._61d861c3afc33ad5__handleCorner:after,._61d861c3afc33ad5__handleCorner:focus-visible:after,._61d861c3afc33ad5__handleCorner:hover:after{border-block-end-color:Highlight;border-inline-end-color:Highlight}._86ab3a6eb52bc222__handleHorizontal.aa1d4aafe4d24e03__resizing:after,._86ab3a6eb52bc222__handleHorizontal:after,._86ab3a6eb52bc222__handleHorizontal:focus-visible:after,._86ab3a6eb52bc222__handleHorizontal:hover:after{background-color:Highlight}}\");\n}\nexport default {\"handle\":\"a70c7d5347a2f54b__handle\",\"resizing\":\"aa1d4aafe4d24e03__resizing\",\"handleCorner\":\"_61d861c3afc33ad5__handleCorner\",\"handleHorizontal\":\"_86ab3a6eb52bc222__handleHorizontal\"};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["WidgetResizeHandle", "clsx"]
|
|
7
7
|
}
|
|
@@ -159,7 +159,7 @@ function Header({ titleId, widgetType }) {
|
|
|
159
159
|
children: /* @__PURE__ */ jsx(Icon, { icon: widgetType.icon })
|
|
160
160
|
}
|
|
161
161
|
),
|
|
162
|
-
/* @__PURE__ */ jsx(Card.Title, { id: titleId, render: /* @__PURE__ */ jsx("
|
|
162
|
+
/* @__PURE__ */ jsx(Card.Title, { id: titleId, render: /* @__PURE__ */ jsx("h2", {}), children: widgetType.title })
|
|
163
163
|
] }) });
|
|
164
164
|
}
|
|
165
165
|
var WidgetChrome = forwardRef(
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/widget-chrome/widget-chrome.tsx", "../../../../style-runtime/src/index.ts", "../../../src/components/widget-chrome/widget-chrome.module.css"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { Spinner } from '@wordpress/components';\nimport {\n\tComponent,\n\tSuspense,\n\tforwardRef,\n\tuseId,\n\tuseMemo,\n} from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { plugins } from '@wordpress/icons';\n// eslint-disable-next-line @wordpress/use-recommended-components\nimport { Card, Icon, Stack, Notice, Text, VisuallyHidden } from '@wordpress/ui';\nimport type { WidgetType } from '@wordpress/widget-primitives';\n\n/**\n * Internal dependencies\n */\nimport { useDashboardInternalContext } from '../../context/dashboard-context';\nimport { WidgetContextProvider } from '../../context/widget-context';\nimport { WidgetRender } from '../widget-render';\nimport styles from './widget-chrome.module.css';\nimport type { DashboardWidget } from '../../types';\n\ninterface ErrorBoundaryProps {\n\tchildren: ReactNode;\n}\n\ninterface ErrorBoundaryState {\n\thasError: boolean;\n}\n\nclass WidgetErrorBoundary extends Component<\n\tErrorBoundaryProps,\n\tErrorBoundaryState\n> {\n\tstate: ErrorBoundaryState = { hasError: false };\n\n\tstatic getDerivedStateFromError(): ErrorBoundaryState {\n\t\treturn { hasError: true };\n\t}\n\n\trender() {\n\t\tif ( this.state.hasError ) {\n\t\t\treturn (\n\t\t\t\t<Notice.Root intent=\"error\">\n\t\t\t\t\t<Notice.Description>\n\t\t\t\t\t\t{ __( 'This widget encountered an error.' ) }\n\t\t\t\t\t</Notice.Description>\n\t\t\t\t</Notice.Root>\n\t\t\t);\n\t\t}\n\t\treturn this.props.children;\n\t}\n}\n\nfunction LoadingOverlay() {\n\treturn (\n\t\t<Stack justify=\"center\" align=\"center\" className={ styles.loading }>\n\t\t\t<Spinner />\n\t\t</Stack>\n\t);\n}\n\ninterface UnavailableWidgetProps {\n\twidgetTypeName: string;\n}\n\nfunction UnavailableWidget( { widgetTypeName }: UnavailableWidgetProps ) {\n\treturn (\n\t\t<>\n\t\t\t<Card.Header>\n\t\t\t\t<span\n\t\t\t\t\tclassName={ styles.widgetChromeHeaderIcon }\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t>\n\t\t\t\t\t<Icon icon={ plugins } />\n\t\t\t\t</span>\n\t\t\t</Card.Header>\n\t\t\t<Card.Content className={ styles.widgetChromeContent }>\n\t\t\t\t<Stack\n\t\t\t\t\tdirection=\"column\"\n\t\t\t\t\tjustify=\"center\"\n\t\t\t\t\talign=\"center\"\n\t\t\t\t\tgap=\"md\"\n\t\t\t\t\tclassName={ styles.unavailable }\n\t\t\t\t>\n\t\t\t\t\t<Text>{ __( 'Widget is no longer available.' ) }</Text>\n\t\t\t\t\t<Text render={ <code /> }>{ widgetTypeName }</Text>\n\t\t\t\t</Stack>\n\t\t\t</Card.Content>\n\t\t</>\n\t);\n}\n\ninterface HeaderProps {\n\ttitleId: string;\n\twidgetType: WidgetType;\n}\n\nfunction Header( { titleId, widgetType }: HeaderProps ) {\n\tif ( ! widgetType.title ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Card.Header>\n\t\t\t<Stack direction=\"row\" align=\"center\" gap=\"sm\">\n\t\t\t\t{ widgetType.icon && (\n\t\t\t\t\t<span\n\t\t\t\t\t\tclassName={ styles.widgetChromeHeaderIcon }\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={ widgetType.icon } />\n\t\t\t\t\t</span>\n\t\t\t\t) }\n\t\t\t\t<Card.Title id={ titleId } render={ <h3 /> }>\n\t\t\t\t\t{ widgetType.title }\n\t\t\t\t</Card.Title>\n\t\t\t</Stack>\n\t\t</Card.Header>\n\t);\n}\n\nexport interface WidgetChromeProps {\n\twidget: DashboardWidget< unknown >;\n\tindex: number;\n\t/**\n\t * Lifted by the surrounding `@wordpress/grid` surface into a sibling\n\t * slot of the grid item; not rendered by `WidgetChrome` itself.\n\t * Living outside `Card.Root` is what keeps these controls interactive\n\t * while edit mode applies `inert` to the chrome.\n\t */\n\tactionableArea?: ReactNode;\n\tclassName?: string;\n}\n\n/**\n * Per-instance wrapper. Owns the chrome around a widget instance: identity\n * context, header (title + icon), edit-mode `inert` attribute, and the\n * error/loading boundaries that keep neighbours mounted when one widget fails\n * or is still resolving.\n */\nexport const WidgetChrome = forwardRef< HTMLDivElement, WidgetChromeProps >(\n\tfunction WidgetChrome( { widget, index, className }, ref ) {\n\t\tconst { widgetTypes, isResolvingWidgetTypes, editMode } =\n\t\t\tuseDashboardInternalContext();\n\t\tconst widgetType = widgetTypes.find( ( t ) => t.name === widget.type );\n\t\tconst titleId = useId();\n\n\t\tconst contextValue = useMemo(\n\t\t\t() => ( {\n\t\t\t\tuuid: widget.uuid,\n\t\t\t\tname: widget.type,\n\t\t\t\tindex,\n\t\t\t} ),\n\t\t\t[ widget.uuid, widget.type, index ]\n\t\t);\n\n\t\tif ( ! widgetType ) {\n\t\t\tif ( isResolvingWidgetTypes ) {\n\t\t\t\treturn (\n\t\t\t\t\t<WidgetContextProvider value={ contextValue }>\n\t\t\t\t\t\t<Card.Root\n\t\t\t\t\t\t\trender={ <section /> }\n\t\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\t\tclassName={ clsx( styles.widgetChrome, className ) }\n\t\t\t\t\t\t\taria-busy=\"true\"\n\t\t\t\t\t\t\taria-label={ __( 'Loading' ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Card.Content\n\t\t\t\t\t\t\t\tclassName={ styles.widgetChromeContent }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<LoadingOverlay />\n\t\t\t\t\t\t\t</Card.Content>\n\t\t\t\t\t\t</Card.Root>\n\t\t\t\t\t</WidgetContextProvider>\n\t\t\t\t);\n\t\t\t}\n\n\t\t\treturn (\n\t\t\t\t<WidgetContextProvider value={ contextValue }>\n\t\t\t\t\t<Card.Root\n\t\t\t\t\t\trender={ <section /> }\n\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\tclassName={ clsx( styles.widgetChrome, className ) }\n\t\t\t\t\t\taria-label={ __( 'Missing widget' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<UnavailableWidget widgetTypeName={ widget.type } />\n\t\t\t\t\t</Card.Root>\n\t\t\t\t</WidgetContextProvider>\n\t\t\t);\n\t\t}\n\n\t\t// `presentation` encodes two independent axes. `full-bleed` hides\n\t\t// the header; both `full-bleed` and `content-bleed` let the body\n\t\t// break out of the content padding.\n\t\tconst { presentation } = widgetType;\n\t\tconst isHeaderHidden = presentation === 'full-bleed';\n\t\tconst isBodyBleeding =\n\t\t\tpresentation === 'full-bleed' || presentation === 'content-bleed';\n\t\tconst header = <Header titleId={ titleId } widgetType={ widgetType } />;\n\n\t\tconst body = (\n\t\t\t<WidgetErrorBoundary>\n\t\t\t\t<Suspense fallback={ <LoadingOverlay /> }>\n\t\t\t\t\t<WidgetRender widget={ widget } widgetType={ widgetType } />\n\t\t\t\t</Suspense>\n\t\t\t</WidgetErrorBoundary>\n\t\t);\n\n\t\treturn (\n\t\t\t<WidgetContextProvider value={ contextValue }>\n\t\t\t\t<Card.Root\n\t\t\t\t\trender={ <section /> }\n\t\t\t\t\tref={ ref }\n\t\t\t\t\tclassName={ clsx( styles.widgetChrome, className ) }\n\t\t\t\t\taria-labelledby={ widgetType.title ? titleId : undefined }\n\t\t\t\t\t{ ...( editMode ? { inert: 'true' } : {} ) }\n\t\t\t\t>\n\t\t\t\t\t{ isHeaderHidden ? (\n\t\t\t\t\t\t<VisuallyHidden>{ header }</VisuallyHidden>\n\t\t\t\t\t) : (\n\t\t\t\t\t\theader\n\t\t\t\t\t) }\n\n\t\t\t\t\t<Card.Content\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\tstyles.widgetChromeContent,\n\t\t\t\t\t\t\tisBodyBleeding && styles.widgetChromeContentBleed\n\t\t\t\t\t\t) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ isBodyBleeding ? (\n\t\t\t\t\t\t\t<Card.FullBleed\n\t\t\t\t\t\t\t\tclassName={ styles.widgetChromeBleedScroll }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ body }\n\t\t\t\t\t\t\t</Card.FullBleed>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\tbody\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Card.Content>\n\t\t\t\t</Card.Root>\n\t\t\t</WidgetContextProvider>\n\t\t);\n\t}\n);\n", "type GlobalScopeWithStyleRuntime = typeof globalThis & {\n\t// This global is shared by separately bundled copies of this package.\n\t// Keep its shape backward compatible after release.\n\t__wpStyleRuntime?: {\n\t\tdocuments: Map< Document, number >;\n\t\tstyles: Map< string, string >;\n\t\tinjectedStyles: WeakMap< Document, Set< string > >;\n\t};\n};\n\nconst STYLE_HASH_ATTRIBUTE = 'data-wp-hash';\n\n/**\n * Returns the shared style runtime registry.\n *\n * The registry is stored on `globalThis` so separately bundled copies of this\n * package can coordinate through the same document and style maps.\n *\n * @return The shared runtime registry.\n */\nfunction getRuntime() {\n\tconst globalScope = globalThis as GlobalScopeWithStyleRuntime;\n\n\tif ( globalScope.__wpStyleRuntime ) {\n\t\treturn globalScope.__wpStyleRuntime;\n\t}\n\n\tglobalScope.__wpStyleRuntime = {\n\t\tdocuments: new Map(),\n\t\tstyles: new Map(),\n\t\tinjectedStyles: new WeakMap(),\n\t};\n\n\tif ( typeof document !== 'undefined' ) {\n\t\tregisterDocument( document );\n\t}\n\n\treturn globalScope.__wpStyleRuntime;\n}\n\n/**\n * Checks whether a document already contains a style tag for a hash.\n *\n * @param targetDocument Document to inspect.\n * @param hash Stable hash for the transformed CSS.\n *\n * @return Whether the style hash already exists in the document.\n */\nfunction documentContainsStyleHash(\n\ttargetDocument: Document,\n\thash: string\n): boolean {\n\tif ( ! targetDocument.head ) {\n\t\treturn false;\n\t}\n\n\tfor ( const style of targetDocument.head.querySelectorAll(\n\t\t`style[${ STYLE_HASH_ATTRIBUTE }]`\n\t) ) {\n\t\tif ( style.getAttribute( STYLE_HASH_ATTRIBUTE ) === hash ) {\n\t\t\treturn true;\n\t\t}\n\t}\n\n\treturn false;\n}\n\n/**\n * Injects a registered style into a document, unless that document already\n * contains a style tag for the same hash.\n *\n * @param targetDocument Document to inject the style into.\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nfunction injectStyle( targetDocument: Document, hash: string, css: string ) {\n\tif ( ! targetDocument.head ) {\n\t\treturn;\n\t}\n\n\tconst runtime = getRuntime();\n\tlet injectedStyles = runtime.injectedStyles.get( targetDocument );\n\n\tif ( ! injectedStyles ) {\n\t\tinjectedStyles = new Set();\n\t\truntime.injectedStyles.set( targetDocument, injectedStyles );\n\t}\n\n\tif ( injectedStyles.has( hash ) ) {\n\t\treturn;\n\t}\n\n\t// Older generated CSS module output can still inject matching style tags\n\t// after this document's cache is created, so keep the DOM as the fallback\n\t// source of truth on cache misses.\n\tif ( documentContainsStyleHash( targetDocument, hash ) ) {\n\t\tinjectedStyles.add( hash );\n\t\treturn;\n\t}\n\n\tconst style = targetDocument.createElement( 'style' );\n\tstyle.setAttribute( STYLE_HASH_ATTRIBUTE, hash );\n\tstyle.appendChild( targetDocument.createTextNode( css ) );\n\ttargetDocument.head.appendChild( style );\n\tinjectedStyles.add( hash );\n}\n\n/**\n * Registers a document as a style injection target.\n *\n * Existing registered styles are replayed into the document immediately.\n * Documents are reference-counted so multiple providers can safely register the\n * same document without one cleanup removing it while another registration is\n * still active.\n *\n * @param targetDocument Document to receive registered styles.\n * @return Cleanup function that unregisters this document registration.\n */\nexport function registerDocument( targetDocument: Document ) {\n\tconst runtime = getRuntime();\n\n\truntime.documents.set(\n\t\ttargetDocument,\n\t\t( runtime.documents.get( targetDocument ) ?? 0 ) + 1\n\t);\n\n\tfor ( const [ hash, css ] of runtime.styles ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n\n\treturn () => {\n\t\tconst count = runtime.documents.get( targetDocument );\n\n\t\tif ( count === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( count <= 1 ) {\n\t\t\truntime.documents.delete( targetDocument );\n\t\t\treturn;\n\t\t}\n\n\t\truntime.documents.set( targetDocument, count - 1 );\n\t};\n}\n\n/**\n * Registers a style and injects it into all registered documents.\n *\n * The hash is used as the deduplication key, so calling this repeatedly with\n * the same hash will not add duplicate style tags to a document.\n * Registered styles are retained for the lifetime of the page so they can be\n * replayed into documents that are registered later.\n *\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nexport function registerStyle( hash: string, css: string ) {\n\tconst runtime = getRuntime();\n\n\truntime.styles.set( hash, css );\n\n\tfor ( const targetDocument of runtime.documents.keys() ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n}\n", "import { registerStyle } from '@wordpress/style-runtime';\nif (typeof process === 'undefined' || process.env.NODE_ENV !== 'test') {\n\tregisterStyle(\"345dedc0b8\", \"._79b45ce7d3422efe__widgetChrome{contain:layout;height:100%}._79b45ce7d3422efe__widgetChrome:has(._9f0be51a1b96c8d7__widgetChromeContent :focus-visible){outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus,var(--wp-admin-theme-color,#3858e9));outline-offset:2px}.d85f7657585b9203__widgetChromeHeaderIcon{color:var(--wpds-color-foreground-content-neutral,#1e1e1e);display:inline-flex}._9f0be51a1b96c8d7__widgetChromeContent{flex:1;height:100%;min-height:0;min-width:0;overflow-y:auto}._21770471c9c2115b__widgetChromeContentBleed{padding-block:0}._229727240ac2aa18__widgetChromeBleedScroll{height:100%;margin-block-end:0;overflow-y:auto}._3c919e86d1bb80ab__loading,._9b694d63bdec1a98__unavailable{height:100%}\");\n}\nexport default {\"widgetChrome\":\"_79b45ce7d3422efe__widgetChrome\",\"widgetChromeContent\":\"_9f0be51a1b96c8d7__widgetChromeContent\",\"widgetChromeHeaderIcon\":\"d85f7657585b9203__widgetChromeHeaderIcon\",\"widgetChromeContentBleed\":\"_21770471c9c2115b__widgetChromeContentBleed\",\"widgetChromeBleedScroll\":\"_229727240ac2aa18__widgetChromeBleedScroll\",\"loading\":\"_3c919e86d1bb80ab__loading\",\"unavailable\":\"_9b694d63bdec1a98__unavailable\"};\n"],
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { Spinner } from '@wordpress/components';\nimport {\n\tComponent,\n\tSuspense,\n\tforwardRef,\n\tuseId,\n\tuseMemo,\n} from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { plugins } from '@wordpress/icons';\n// eslint-disable-next-line @wordpress/use-recommended-components\nimport { Card, Icon, Stack, Notice, Text, VisuallyHidden } from '@wordpress/ui';\nimport type { WidgetType } from '@wordpress/widget-primitives';\n\n/**\n * Internal dependencies\n */\nimport { useDashboardInternalContext } from '../../context/dashboard-context';\nimport { WidgetContextProvider } from '../../context/widget-context';\nimport { WidgetRender } from '../widget-render';\nimport styles from './widget-chrome.module.css';\nimport type { DashboardWidget } from '../../types';\n\ninterface ErrorBoundaryProps {\n\tchildren: ReactNode;\n}\n\ninterface ErrorBoundaryState {\n\thasError: boolean;\n}\n\nclass WidgetErrorBoundary extends Component<\n\tErrorBoundaryProps,\n\tErrorBoundaryState\n> {\n\tstate: ErrorBoundaryState = { hasError: false };\n\n\tstatic getDerivedStateFromError(): ErrorBoundaryState {\n\t\treturn { hasError: true };\n\t}\n\n\trender() {\n\t\tif ( this.state.hasError ) {\n\t\t\treturn (\n\t\t\t\t<Notice.Root intent=\"error\">\n\t\t\t\t\t<Notice.Description>\n\t\t\t\t\t\t{ __( 'This widget encountered an error.' ) }\n\t\t\t\t\t</Notice.Description>\n\t\t\t\t</Notice.Root>\n\t\t\t);\n\t\t}\n\t\treturn this.props.children;\n\t}\n}\n\nfunction LoadingOverlay() {\n\treturn (\n\t\t<Stack justify=\"center\" align=\"center\" className={ styles.loading }>\n\t\t\t<Spinner />\n\t\t</Stack>\n\t);\n}\n\ninterface UnavailableWidgetProps {\n\twidgetTypeName: string;\n}\n\nfunction UnavailableWidget( { widgetTypeName }: UnavailableWidgetProps ) {\n\treturn (\n\t\t<>\n\t\t\t<Card.Header>\n\t\t\t\t<span\n\t\t\t\t\tclassName={ styles.widgetChromeHeaderIcon }\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t>\n\t\t\t\t\t<Icon icon={ plugins } />\n\t\t\t\t</span>\n\t\t\t</Card.Header>\n\t\t\t<Card.Content className={ styles.widgetChromeContent }>\n\t\t\t\t<Stack\n\t\t\t\t\tdirection=\"column\"\n\t\t\t\t\tjustify=\"center\"\n\t\t\t\t\talign=\"center\"\n\t\t\t\t\tgap=\"md\"\n\t\t\t\t\tclassName={ styles.unavailable }\n\t\t\t\t>\n\t\t\t\t\t<Text>{ __( 'Widget is no longer available.' ) }</Text>\n\t\t\t\t\t<Text render={ <code /> }>{ widgetTypeName }</Text>\n\t\t\t\t</Stack>\n\t\t\t</Card.Content>\n\t\t</>\n\t);\n}\n\ninterface HeaderProps {\n\ttitleId: string;\n\twidgetType: WidgetType;\n}\n\nfunction Header( { titleId, widgetType }: HeaderProps ) {\n\tif ( ! widgetType.title ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Card.Header>\n\t\t\t<Stack direction=\"row\" align=\"center\" gap=\"sm\">\n\t\t\t\t{ widgetType.icon && (\n\t\t\t\t\t<span\n\t\t\t\t\t\tclassName={ styles.widgetChromeHeaderIcon }\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={ widgetType.icon } />\n\t\t\t\t\t</span>\n\t\t\t\t) }\n\t\t\t\t<Card.Title id={ titleId } render={ <h2 /> }>\n\t\t\t\t\t{ widgetType.title }\n\t\t\t\t</Card.Title>\n\t\t\t</Stack>\n\t\t</Card.Header>\n\t);\n}\n\nexport interface WidgetChromeProps {\n\twidget: DashboardWidget< unknown >;\n\tindex: number;\n\t/**\n\t * Lifted by the surrounding `@wordpress/grid` surface into a sibling\n\t * slot of the grid item; not rendered by `WidgetChrome` itself.\n\t * Living outside `Card.Root` is what keeps these controls interactive\n\t * while edit mode applies `inert` to the chrome.\n\t */\n\tactionableArea?: ReactNode;\n\tclassName?: string;\n}\n\n/**\n * Per-instance wrapper. Owns the chrome around a widget instance: identity\n * context, header (title + icon), edit-mode `inert` attribute, and the\n * error/loading boundaries that keep neighbours mounted when one widget fails\n * or is still resolving.\n */\nexport const WidgetChrome = forwardRef< HTMLDivElement, WidgetChromeProps >(\n\tfunction WidgetChrome( { widget, index, className }, ref ) {\n\t\tconst { widgetTypes, isResolvingWidgetTypes, editMode } =\n\t\t\tuseDashboardInternalContext();\n\t\tconst widgetType = widgetTypes.find( ( t ) => t.name === widget.type );\n\t\tconst titleId = useId();\n\n\t\tconst contextValue = useMemo(\n\t\t\t() => ( {\n\t\t\t\tuuid: widget.uuid,\n\t\t\t\tname: widget.type,\n\t\t\t\tindex,\n\t\t\t} ),\n\t\t\t[ widget.uuid, widget.type, index ]\n\t\t);\n\n\t\tif ( ! widgetType ) {\n\t\t\tif ( isResolvingWidgetTypes ) {\n\t\t\t\treturn (\n\t\t\t\t\t<WidgetContextProvider value={ contextValue }>\n\t\t\t\t\t\t<Card.Root\n\t\t\t\t\t\t\trender={ <section /> }\n\t\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\t\tclassName={ clsx( styles.widgetChrome, className ) }\n\t\t\t\t\t\t\taria-busy=\"true\"\n\t\t\t\t\t\t\taria-label={ __( 'Loading' ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Card.Content\n\t\t\t\t\t\t\t\tclassName={ styles.widgetChromeContent }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<LoadingOverlay />\n\t\t\t\t\t\t\t</Card.Content>\n\t\t\t\t\t\t</Card.Root>\n\t\t\t\t\t</WidgetContextProvider>\n\t\t\t\t);\n\t\t\t}\n\n\t\t\treturn (\n\t\t\t\t<WidgetContextProvider value={ contextValue }>\n\t\t\t\t\t<Card.Root\n\t\t\t\t\t\trender={ <section /> }\n\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\tclassName={ clsx( styles.widgetChrome, className ) }\n\t\t\t\t\t\taria-label={ __( 'Missing widget' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<UnavailableWidget widgetTypeName={ widget.type } />\n\t\t\t\t\t</Card.Root>\n\t\t\t\t</WidgetContextProvider>\n\t\t\t);\n\t\t}\n\n\t\t// `presentation` encodes two independent axes. `full-bleed` hides\n\t\t// the header; both `full-bleed` and `content-bleed` let the body\n\t\t// break out of the content padding.\n\t\tconst { presentation } = widgetType;\n\t\tconst isHeaderHidden = presentation === 'full-bleed';\n\t\tconst isBodyBleeding =\n\t\t\tpresentation === 'full-bleed' || presentation === 'content-bleed';\n\t\tconst header = <Header titleId={ titleId } widgetType={ widgetType } />;\n\n\t\tconst body = (\n\t\t\t<WidgetErrorBoundary>\n\t\t\t\t<Suspense fallback={ <LoadingOverlay /> }>\n\t\t\t\t\t<WidgetRender widget={ widget } widgetType={ widgetType } />\n\t\t\t\t</Suspense>\n\t\t\t</WidgetErrorBoundary>\n\t\t);\n\n\t\treturn (\n\t\t\t<WidgetContextProvider value={ contextValue }>\n\t\t\t\t<Card.Root\n\t\t\t\t\trender={ <section /> }\n\t\t\t\t\tref={ ref }\n\t\t\t\t\tclassName={ clsx( styles.widgetChrome, className ) }\n\t\t\t\t\taria-labelledby={ widgetType.title ? titleId : undefined }\n\t\t\t\t\t{ ...( editMode ? { inert: 'true' } : {} ) }\n\t\t\t\t>\n\t\t\t\t\t{ isHeaderHidden ? (\n\t\t\t\t\t\t<VisuallyHidden>{ header }</VisuallyHidden>\n\t\t\t\t\t) : (\n\t\t\t\t\t\theader\n\t\t\t\t\t) }\n\n\t\t\t\t\t<Card.Content\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\tstyles.widgetChromeContent,\n\t\t\t\t\t\t\tisBodyBleeding && styles.widgetChromeContentBleed\n\t\t\t\t\t\t) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ isBodyBleeding ? (\n\t\t\t\t\t\t\t<Card.FullBleed\n\t\t\t\t\t\t\t\tclassName={ styles.widgetChromeBleedScroll }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ body }\n\t\t\t\t\t\t\t</Card.FullBleed>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\tbody\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Card.Content>\n\t\t\t\t</Card.Root>\n\t\t\t</WidgetContextProvider>\n\t\t);\n\t}\n);\n", "type GlobalScopeWithStyleRuntime = typeof globalThis & {\n\t// This global is shared by separately bundled copies of this package.\n\t// Keep its shape backward compatible after release.\n\t__wpStyleRuntime?: {\n\t\tdocuments: Map< Document, number >;\n\t\tstyles: Map< string, string >;\n\t\tinjectedStyles: WeakMap< Document, Set< string > >;\n\t};\n};\n\nconst STYLE_HASH_ATTRIBUTE = 'data-wp-hash';\n\n/**\n * Returns the shared style runtime registry.\n *\n * The registry is stored on `globalThis` so separately bundled copies of this\n * package can coordinate through the same document and style maps.\n *\n * @return The shared runtime registry.\n */\nfunction getRuntime() {\n\tconst globalScope = globalThis as GlobalScopeWithStyleRuntime;\n\n\tif ( globalScope.__wpStyleRuntime ) {\n\t\treturn globalScope.__wpStyleRuntime;\n\t}\n\n\tglobalScope.__wpStyleRuntime = {\n\t\tdocuments: new Map(),\n\t\tstyles: new Map(),\n\t\tinjectedStyles: new WeakMap(),\n\t};\n\n\tif ( typeof document !== 'undefined' ) {\n\t\tregisterDocument( document );\n\t}\n\n\treturn globalScope.__wpStyleRuntime;\n}\n\n/**\n * Checks whether a document already contains a style tag for a hash.\n *\n * @param targetDocument Document to inspect.\n * @param hash Stable hash for the transformed CSS.\n *\n * @return Whether the style hash already exists in the document.\n */\nfunction documentContainsStyleHash(\n\ttargetDocument: Document,\n\thash: string\n): boolean {\n\tif ( ! targetDocument.head ) {\n\t\treturn false;\n\t}\n\n\tfor ( const style of targetDocument.head.querySelectorAll(\n\t\t`style[${ STYLE_HASH_ATTRIBUTE }]`\n\t) ) {\n\t\tif ( style.getAttribute( STYLE_HASH_ATTRIBUTE ) === hash ) {\n\t\t\treturn true;\n\t\t}\n\t}\n\n\treturn false;\n}\n\n/**\n * Injects a registered style into a document, unless that document already\n * contains a style tag for the same hash.\n *\n * @param targetDocument Document to inject the style into.\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nfunction injectStyle( targetDocument: Document, hash: string, css: string ) {\n\tif ( ! targetDocument.head ) {\n\t\treturn;\n\t}\n\n\tconst runtime = getRuntime();\n\tlet injectedStyles = runtime.injectedStyles.get( targetDocument );\n\n\tif ( ! injectedStyles ) {\n\t\tinjectedStyles = new Set();\n\t\truntime.injectedStyles.set( targetDocument, injectedStyles );\n\t}\n\n\tif ( injectedStyles.has( hash ) ) {\n\t\treturn;\n\t}\n\n\t// Older generated CSS module output can still inject matching style tags\n\t// after this document's cache is created, so keep the DOM as the fallback\n\t// source of truth on cache misses.\n\tif ( documentContainsStyleHash( targetDocument, hash ) ) {\n\t\tinjectedStyles.add( hash );\n\t\treturn;\n\t}\n\n\tconst style = targetDocument.createElement( 'style' );\n\tstyle.setAttribute( STYLE_HASH_ATTRIBUTE, hash );\n\tstyle.appendChild( targetDocument.createTextNode( css ) );\n\ttargetDocument.head.appendChild( style );\n\tinjectedStyles.add( hash );\n}\n\n/**\n * Registers a document as a style injection target.\n *\n * Existing registered styles are replayed into the document immediately.\n * Documents are reference-counted so multiple providers can safely register the\n * same document without one cleanup removing it while another registration is\n * still active.\n *\n * @param targetDocument Document to receive registered styles.\n * @return Cleanup function that unregisters this document registration.\n */\nexport function registerDocument( targetDocument: Document ) {\n\tconst runtime = getRuntime();\n\n\truntime.documents.set(\n\t\ttargetDocument,\n\t\t( runtime.documents.get( targetDocument ) ?? 0 ) + 1\n\t);\n\n\tfor ( const [ hash, css ] of runtime.styles ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n\n\treturn () => {\n\t\tconst count = runtime.documents.get( targetDocument );\n\n\t\tif ( count === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( count <= 1 ) {\n\t\t\truntime.documents.delete( targetDocument );\n\t\t\treturn;\n\t\t}\n\n\t\truntime.documents.set( targetDocument, count - 1 );\n\t};\n}\n\n/**\n * Registers a style and injects it into all registered documents.\n *\n * The hash is used as the deduplication key, so calling this repeatedly with\n * the same hash will not add duplicate style tags to a document.\n * Registered styles are retained for the lifetime of the page so they can be\n * replayed into documents that are registered later.\n *\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nexport function registerStyle( hash: string, css: string ) {\n\tconst runtime = getRuntime();\n\n\truntime.styles.set( hash, css );\n\n\tfor ( const targetDocument of runtime.documents.keys() ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n}\n", "import { registerStyle } from '@wordpress/style-runtime';\nif (typeof process === 'undefined' || process.env.NODE_ENV !== 'test') {\n\tregisterStyle(\"345dedc0b8\", \"._79b45ce7d3422efe__widgetChrome{contain:layout;height:100%}._79b45ce7d3422efe__widgetChrome:has(._9f0be51a1b96c8d7__widgetChromeContent :focus-visible){outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus,var(--wp-admin-theme-color,#3858e9));outline-offset:2px}.d85f7657585b9203__widgetChromeHeaderIcon{color:var(--wpds-color-foreground-content-neutral,#1e1e1e);display:inline-flex}._9f0be51a1b96c8d7__widgetChromeContent{flex:1;height:100%;min-height:0;min-width:0;overflow-y:auto}._21770471c9c2115b__widgetChromeContentBleed{padding-block:0}._229727240ac2aa18__widgetChromeBleedScroll{height:100%;margin-block-end:0;overflow-y:auto}._3c919e86d1bb80ab__loading,._9b694d63bdec1a98__unavailable{height:100%}\");\n}\nexport default {\"widgetChrome\":\"_79b45ce7d3422efe__widgetChrome\",\"widgetChromeContent\":\"_9f0be51a1b96c8d7__widgetChromeContent\",\"widgetChromeHeaderIcon\":\"d85f7657585b9203__widgetChromeHeaderIcon\",\"widgetChromeContentBleed\":\"_21770471c9c2115b__widgetChromeContentBleed\",\"widgetChromeBleedScroll\":\"_229727240ac2aa18__widgetChromeBleedScroll\",\"loading\":\"_3c919e86d1bb80ab__loading\",\"unavailable\":\"_9b694d63bdec1a98__unavailable\"};\n"],
|
|
5
5
|
"mappings": "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",
|
|
6
6
|
"names": ["WidgetChrome"]
|
|
7
7
|
}
|
|
@@ -86,7 +86,7 @@ function registerStyle(hash, css) {
|
|
|
86
86
|
|
|
87
87
|
// packages/widget-dashboard/src/components/widgets/widget-resize-handle.module.css
|
|
88
88
|
if (typeof process === "undefined" || process.env.NODE_ENV !== "test") {
|
|
89
|
-
registerStyle("
|
|
89
|
+
registerStyle("2e64f95efa", '.a70c7d5347a2f54b__handle{--widget-resize-handle-visual-inset:var(--wpds-dimension-padding-xs,4px);--widget-resize-handle-hover-scale:1.18;background:transparent;bottom:0;box-sizing:border-box;inset-inline-end:0;padding:0;position:absolute;z-index:1}.a70c7d5347a2f54b__handle:focus-visible{border-radius:var(--wpds-border-radius-sm,2px);outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus,var(--wp-admin-theme-color,#3858e9));outline-offset:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px))}.aa1d4aafe4d24e03__resizing{opacity:.72}._61d861c3afc33ad5__handleCorner{cursor:nwse-resize;height:var(--wpds-dimension-size-sm,24px);width:var(--wpds-dimension-size-sm,24px)}._61d861c3afc33ad5__handleCorner:after{border-block-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));border-block-start:none;border-end-end-radius:var(--wpds-border-radius-md,4px);border-inline-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));border-inline-start:none;bottom:var(--widget-resize-handle-visual-inset);box-sizing:border-box;content:"";height:var(--wpds-dimension-size-4xs,8px);inset-inline-end:var(--widget-resize-handle-visual-inset);position:absolute;transform:scale(1);transform-origin:100% 100%;width:var(--wpds-dimension-size-4xs,8px)}[dir=rtl] ._61d861c3afc33ad5__handleCorner:after{transform-origin:0 100%}._61d861c3afc33ad5__handleCorner.aa1d4aafe4d24e03__resizing:after,._61d861c3afc33ad5__handleCorner:focus-visible:after,._61d861c3afc33ad5__handleCorner:hover:after{border-block-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));border-inline-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));transform:scale(var(--widget-resize-handle-hover-scale))}._86ab3a6eb52bc222__handleHorizontal{align-items:center;border:none;cursor:ew-resize;display:flex;height:var(--wpds-dimension-size-lg,40px);justify-content:center;padding-inline-end:var(--widget-resize-handle-visual-inset);width:var(--wpds-dimension-size-sm,24px)}@media not (prefers-reduced-motion){._61d861c3afc33ad5__handleCorner:after{transition:transform var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)),border-block-end-color var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)),border-inline-end-color var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1))}._86ab3a6eb52bc222__handleHorizontal:after{transition:transform var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)),background-color var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1))}}._86ab3a6eb52bc222__handleHorizontal:after{background-color:var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));content:"";height:var(--wpds-dimension-size-3xs,12px);transform:scale(1);transform-origin:50% 100%;width:var(--wpds-border-width-sm,2px)}._86ab3a6eb52bc222__handleHorizontal.aa1d4aafe4d24e03__resizing:after,._86ab3a6eb52bc222__handleHorizontal:focus-visible:after,._86ab3a6eb52bc222__handleHorizontal:hover:after{background-color:var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));transform:scale(var(--widget-resize-handle-hover-scale))}@media (forced-colors:active){._61d861c3afc33ad5__handleCorner.aa1d4aafe4d24e03__resizing:after,._61d861c3afc33ad5__handleCorner:after,._61d861c3afc33ad5__handleCorner:focus-visible:after,._61d861c3afc33ad5__handleCorner:hover:after{border-block-end-color:Highlight;border-inline-end-color:Highlight}._86ab3a6eb52bc222__handleHorizontal.aa1d4aafe4d24e03__resizing:after,._86ab3a6eb52bc222__handleHorizontal:after,._86ab3a6eb52bc222__handleHorizontal:focus-visible:after,._86ab3a6eb52bc222__handleHorizontal:hover:after{background-color:Highlight}}');
|
|
90
90
|
}
|
|
91
91
|
var widget_resize_handle_default = { "handle": "a70c7d5347a2f54b__handle", "resizing": "aa1d4aafe4d24e03__resizing", "handleCorner": "_61d861c3afc33ad5__handleCorner", "handleHorizontal": "_86ab3a6eb52bc222__handleHorizontal" };
|
|
92
92
|
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/widgets/widget-resize-handle.tsx", "../../../../style-runtime/src/index.ts", "../../../src/components/widgets/widget-resize-handle.module.css"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport type { ResizeHandleRenderProps } from '@wordpress/grid';\n\n/**\n * Internal dependencies\n */\nimport styles from './widget-resize-handle.module.css';\n\ntype WidgetResizeHandleProps = Omit< ResizeHandleRenderProps, 'ref' >;\n\n/**\n * Rounded L-shaped resize affordance for the widget dashboard. Passed to\n * `DashboardGrid` via `renderResizeHandle` so the grid keeps gesture wiring.\n *\n * Uses `forwardRef` because the grid attaches dnd-kit's merged node ref via\n * the JSX `ref` attribute, not as a regular prop.\n */\nexport const WidgetResizeHandle = forwardRef<\n\tHTMLDivElement,\n\tWidgetResizeHandleProps\n>( function WidgetResizeHandle(\n\t{ listeners, attributes, verticalResizable, isResizing },\n\tref\n) {\n\tif ( ! verticalResizable ) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\tstyles.handle,\n\t\t\t\t\tstyles.handleHorizontal,\n\t\t\t\t\tisResizing && styles.resizing\n\t\t\t\t) }\n\t\t\t\t{ ...listeners }\n\t\t\t\t{ ...attributes }\n\t\t\t></div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tref={ ref }\n\t\t\tclassName={ clsx(\n\t\t\t\tstyles.handle,\n\t\t\t\tstyles.handleCorner,\n\t\t\t\tisResizing && styles.resizing\n\t\t\t) }\n\t\t\t{ ...listeners }\n\t\t\t{ ...attributes }\n\t\t></div>\n\t);\n} );\n", "type GlobalScopeWithStyleRuntime = typeof globalThis & {\n\t// This global is shared by separately bundled copies of this package.\n\t// Keep its shape backward compatible after release.\n\t__wpStyleRuntime?: {\n\t\tdocuments: Map< Document, number >;\n\t\tstyles: Map< string, string >;\n\t\tinjectedStyles: WeakMap< Document, Set< string > >;\n\t};\n};\n\nconst STYLE_HASH_ATTRIBUTE = 'data-wp-hash';\n\n/**\n * Returns the shared style runtime registry.\n *\n * The registry is stored on `globalThis` so separately bundled copies of this\n * package can coordinate through the same document and style maps.\n *\n * @return The shared runtime registry.\n */\nfunction getRuntime() {\n\tconst globalScope = globalThis as GlobalScopeWithStyleRuntime;\n\n\tif ( globalScope.__wpStyleRuntime ) {\n\t\treturn globalScope.__wpStyleRuntime;\n\t}\n\n\tglobalScope.__wpStyleRuntime = {\n\t\tdocuments: new Map(),\n\t\tstyles: new Map(),\n\t\tinjectedStyles: new WeakMap(),\n\t};\n\n\tif ( typeof document !== 'undefined' ) {\n\t\tregisterDocument( document );\n\t}\n\n\treturn globalScope.__wpStyleRuntime;\n}\n\n/**\n * Checks whether a document already contains a style tag for a hash.\n *\n * @param targetDocument Document to inspect.\n * @param hash Stable hash for the transformed CSS.\n *\n * @return Whether the style hash already exists in the document.\n */\nfunction documentContainsStyleHash(\n\ttargetDocument: Document,\n\thash: string\n): boolean {\n\tif ( ! targetDocument.head ) {\n\t\treturn false;\n\t}\n\n\tfor ( const style of targetDocument.head.querySelectorAll(\n\t\t`style[${ STYLE_HASH_ATTRIBUTE }]`\n\t) ) {\n\t\tif ( style.getAttribute( STYLE_HASH_ATTRIBUTE ) === hash ) {\n\t\t\treturn true;\n\t\t}\n\t}\n\n\treturn false;\n}\n\n/**\n * Injects a registered style into a document, unless that document already\n * contains a style tag for the same hash.\n *\n * @param targetDocument Document to inject the style into.\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nfunction injectStyle( targetDocument: Document, hash: string, css: string ) {\n\tif ( ! targetDocument.head ) {\n\t\treturn;\n\t}\n\n\tconst runtime = getRuntime();\n\tlet injectedStyles = runtime.injectedStyles.get( targetDocument );\n\n\tif ( ! injectedStyles ) {\n\t\tinjectedStyles = new Set();\n\t\truntime.injectedStyles.set( targetDocument, injectedStyles );\n\t}\n\n\tif ( injectedStyles.has( hash ) ) {\n\t\treturn;\n\t}\n\n\t// Older generated CSS module output can still inject matching style tags\n\t// after this document's cache is created, so keep the DOM as the fallback\n\t// source of truth on cache misses.\n\tif ( documentContainsStyleHash( targetDocument, hash ) ) {\n\t\tinjectedStyles.add( hash );\n\t\treturn;\n\t}\n\n\tconst style = targetDocument.createElement( 'style' );\n\tstyle.setAttribute( STYLE_HASH_ATTRIBUTE, hash );\n\tstyle.appendChild( targetDocument.createTextNode( css ) );\n\ttargetDocument.head.appendChild( style );\n\tinjectedStyles.add( hash );\n}\n\n/**\n * Registers a document as a style injection target.\n *\n * Existing registered styles are replayed into the document immediately.\n * Documents are reference-counted so multiple providers can safely register the\n * same document without one cleanup removing it while another registration is\n * still active.\n *\n * @param targetDocument Document to receive registered styles.\n * @return Cleanup function that unregisters this document registration.\n */\nexport function registerDocument( targetDocument: Document ) {\n\tconst runtime = getRuntime();\n\n\truntime.documents.set(\n\t\ttargetDocument,\n\t\t( runtime.documents.get( targetDocument ) ?? 0 ) + 1\n\t);\n\n\tfor ( const [ hash, css ] of runtime.styles ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n\n\treturn () => {\n\t\tconst count = runtime.documents.get( targetDocument );\n\n\t\tif ( count === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( count <= 1 ) {\n\t\t\truntime.documents.delete( targetDocument );\n\t\t\treturn;\n\t\t}\n\n\t\truntime.documents.set( targetDocument, count - 1 );\n\t};\n}\n\n/**\n * Registers a style and injects it into all registered documents.\n *\n * The hash is used as the deduplication key, so calling this repeatedly with\n * the same hash will not add duplicate style tags to a document.\n * Registered styles are retained for the lifetime of the page so they can be\n * replayed into documents that are registered later.\n *\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nexport function registerStyle( hash: string, css: string ) {\n\tconst runtime = getRuntime();\n\n\truntime.styles.set( hash, css );\n\n\tfor ( const targetDocument of runtime.documents.keys() ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n}\n", "import { registerStyle } from '@wordpress/style-runtime';\nif (typeof process === 'undefined' || process.env.NODE_ENV !== 'test') {\n\tregisterStyle(\"426d5d3a15\", \".a70c7d5347a2f54b__handle{--widget-resize-handle-visual-inset:var(--wpds-dimension-padding-xs,4px);--widget-resize-handle-hover-scale:1.18;background:transparent;bottom:0;box-sizing:border-box;inset-inline-end:0;padding:0;position:absolute;z-index:1}.a70c7d5347a2f54b__handle:focus-visible{border-radius:var(--wpds-border-radius-sm,2px);outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus,var(--wp-admin-theme-color,#3858e9));outline-offset:calc(var(--wpds-dimension-base, 4px)*.5)}.aa1d4aafe4d24e03__resizing{opacity:.72}._61d861c3afc33ad5__handleCorner{cursor:nwse-resize;height:var(--wpds-dimension-size-sm,24px);width:var(--wpds-dimension-size-sm,24px)}._61d861c3afc33ad5__handleCorner:after{border-block-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));border-block-start:none;border-end-end-radius:var(--wpds-border-radius-md,4px);border-inline-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));border-inline-start:none;bottom:var(--widget-resize-handle-visual-inset);box-sizing:border-box;content:\\\"\\\";height:var(--wpds-dimension-size-4xs,8px);inset-inline-end:var(--widget-resize-handle-visual-inset);position:absolute;transform:scale(1);transform-origin:100% 100%;width:var(--wpds-dimension-size-4xs,8px)}[dir=rtl] ._61d861c3afc33ad5__handleCorner:after{transform-origin:0 100%}._61d861c3afc33ad5__handleCorner.aa1d4aafe4d24e03__resizing:after,._61d861c3afc33ad5__handleCorner:focus-visible:after,._61d861c3afc33ad5__handleCorner:hover:after{border-block-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));border-inline-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));transform:scale(var(--widget-resize-handle-hover-scale))}._86ab3a6eb52bc222__handleHorizontal{align-items:center;border:none;cursor:ew-resize;display:flex;height:var(--wpds-dimension-size-lg,40px);justify-content:center;padding-inline-end:var(--widget-resize-handle-visual-inset);width:var(--wpds-dimension-size-sm,24px)}@media not (prefers-reduced-motion){._61d861c3afc33ad5__handleCorner:after{transition:transform var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)),border-block-end-color var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)),border-inline-end-color var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1))}._86ab3a6eb52bc222__handleHorizontal:after{transition:transform var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)),background-color var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1))}}._86ab3a6eb52bc222__handleHorizontal:after{background-color:var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));content:\\\"\\\";height:var(--wpds-dimension-size-3xs,12px);transform:scale(1);transform-origin:50% 100%;width:var(--wpds-border-width-sm,2px)}._86ab3a6eb52bc222__handleHorizontal.aa1d4aafe4d24e03__resizing:after,._86ab3a6eb52bc222__handleHorizontal:focus-visible:after,._86ab3a6eb52bc222__handleHorizontal:hover:after{background-color:var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));transform:scale(var(--widget-resize-handle-hover-scale))}@media (forced-colors:active){._61d861c3afc33ad5__handleCorner.aa1d4aafe4d24e03__resizing:after,._61d861c3afc33ad5__handleCorner:after,._61d861c3afc33ad5__handleCorner:focus-visible:after,._61d861c3afc33ad5__handleCorner:hover:after{border-block-end-color:Highlight;border-inline-end-color:Highlight}._86ab3a6eb52bc222__handleHorizontal.aa1d4aafe4d24e03__resizing:after,._86ab3a6eb52bc222__handleHorizontal:after,._86ab3a6eb52bc222__handleHorizontal:focus-visible:after,._86ab3a6eb52bc222__handleHorizontal:hover:after{background-color:Highlight}}\");\n}\nexport default {\"handle\":\"a70c7d5347a2f54b__handle\",\"resizing\":\"aa1d4aafe4d24e03__resizing\",\"handleCorner\":\"_61d861c3afc33ad5__handleCorner\",\"handleHorizontal\":\"_86ab3a6eb52bc222__handleHorizontal\"};\n"],
|
|
5
|
-
"mappings": ";AAGA,OAAO,UAAU;AAKjB,SAAS,kBAAkB;;;ACE3B,IAAM,uBAAuB;AAU7B,SAAS,aAAa;AACrB,QAAM,cAAc;AAEpB,MAAK,YAAY,kBAAmB;AACnC,WAAO,YAAY;AAAA,EACpB;AAEA,cAAY,mBAAmB;AAAA,IAC9B,WAAW,oBAAI,IAAI;AAAA,IACnB,QAAQ,oBAAI,IAAI;AAAA,IAChB,gBAAgB,oBAAI,QAAQ;AAAA,EAC7B;AAEA,MAAK,OAAO,aAAa,aAAc;AACtC,qBAAkB,QAAS;AAAA,EAC5B;AAEA,SAAO,YAAY;AACpB;AAUA,SAAS,0BACR,gBACA,MACU;AACV,MAAK,CAAE,eAAe,MAAO;AAC5B,WAAO;AAAA,EACR;AAEA,aAAY,SAAS,eAAe,KAAK;AAAA,IACxC,SAAU,oBAAqB;AAAA,EAChC,GAAI;AACH,QAAK,MAAM,aAAc,oBAAqB,MAAM,MAAO;AAC1D,aAAO;AAAA,IACR;AAAA,EACD;AAEA,SAAO;AACR;AAUA,SAAS,YAAa,gBAA0B,MAAc,KAAc;AAC3E,MAAK,CAAE,eAAe,MAAO;AAC5B;AAAA,EACD;AAEA,QAAM,UAAU,WAAW;AAC3B,MAAI,iBAAiB,QAAQ,eAAe,IAAK,cAAe;AAEhE,MAAK,CAAE,gBAAiB;AACvB,qBAAiB,oBAAI,IAAI;AACzB,YAAQ,eAAe,IAAK,gBAAgB,cAAe;AAAA,EAC5D;AAEA,MAAK,eAAe,IAAK,IAAK,GAAI;AACjC;AAAA,EACD;AAKA,MAAK,0BAA2B,gBAAgB,IAAK,GAAI;AACxD,mBAAe,IAAK,IAAK;AACzB;AAAA,EACD;AAEA,QAAM,QAAQ,eAAe,cAAe,OAAQ;AACpD,QAAM,aAAc,sBAAsB,IAAK;AAC/C,QAAM,YAAa,eAAe,eAAgB,GAAI,CAAE;AACxD,iBAAe,KAAK,YAAa,KAAM;AACvC,iBAAe,IAAK,IAAK;AAC1B;AAaO,SAAS,iBAAkB,gBAA2B;AAC5D,QAAM,UAAU,WAAW;AAE3B,UAAQ,UAAU;AAAA,IACjB;AAAA,KACE,QAAQ,UAAU,IAAK,cAAe,KAAK,KAAM;AAAA,EACpD;AAEA,aAAY,CAAE,MAAM,GAAI,KAAK,QAAQ,QAAS;AAC7C,gBAAa,gBAAgB,MAAM,GAAI;AAAA,EACxC;AAEA,SAAO,MAAM;AACZ,UAAM,QAAQ,QAAQ,UAAU,IAAK,cAAe;AAEpD,QAAK,UAAU,QAAY;AAC1B;AAAA,IACD;AAEA,QAAK,SAAS,GAAI;AACjB,cAAQ,UAAU,OAAQ,cAAe;AACzC;AAAA,IACD;AAEA,YAAQ,UAAU,IAAK,gBAAgB,QAAQ,CAAE;AAAA,EAClD;AACD;AAaO,SAAS,cAAe,MAAc,KAAc;AAC1D,QAAM,UAAU,WAAW;AAE3B,UAAQ,OAAO,IAAK,MAAM,GAAI;AAE9B,aAAY,kBAAkB,QAAQ,UAAU,KAAK,GAAI;AACxD,gBAAa,gBAAgB,MAAM,GAAI;AAAA,EACxC;AACD;;;ACpKA,IAAI,OAAO,YAAY,eAAe,QAAQ,IAAI,aAAa,QAAQ;AACtE,gBAAc,cAAc,
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport type { ResizeHandleRenderProps } from '@wordpress/grid';\n\n/**\n * Internal dependencies\n */\nimport styles from './widget-resize-handle.module.css';\n\ntype WidgetResizeHandleProps = Omit< ResizeHandleRenderProps, 'ref' >;\n\n/**\n * Rounded L-shaped resize affordance for the widget dashboard. Passed to\n * `DashboardGrid` via `renderResizeHandle` so the grid keeps gesture wiring.\n *\n * Uses `forwardRef` because the grid attaches dnd-kit's merged node ref via\n * the JSX `ref` attribute, not as a regular prop.\n */\nexport const WidgetResizeHandle = forwardRef<\n\tHTMLDivElement,\n\tWidgetResizeHandleProps\n>( function WidgetResizeHandle(\n\t{ listeners, attributes, verticalResizable, isResizing },\n\tref\n) {\n\tif ( ! verticalResizable ) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\tstyles.handle,\n\t\t\t\t\tstyles.handleHorizontal,\n\t\t\t\t\tisResizing && styles.resizing\n\t\t\t\t) }\n\t\t\t\t{ ...listeners }\n\t\t\t\t{ ...attributes }\n\t\t\t></div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tref={ ref }\n\t\t\tclassName={ clsx(\n\t\t\t\tstyles.handle,\n\t\t\t\tstyles.handleCorner,\n\t\t\t\tisResizing && styles.resizing\n\t\t\t) }\n\t\t\t{ ...listeners }\n\t\t\t{ ...attributes }\n\t\t></div>\n\t);\n} );\n", "type GlobalScopeWithStyleRuntime = typeof globalThis & {\n\t// This global is shared by separately bundled copies of this package.\n\t// Keep its shape backward compatible after release.\n\t__wpStyleRuntime?: {\n\t\tdocuments: Map< Document, number >;\n\t\tstyles: Map< string, string >;\n\t\tinjectedStyles: WeakMap< Document, Set< string > >;\n\t};\n};\n\nconst STYLE_HASH_ATTRIBUTE = 'data-wp-hash';\n\n/**\n * Returns the shared style runtime registry.\n *\n * The registry is stored on `globalThis` so separately bundled copies of this\n * package can coordinate through the same document and style maps.\n *\n * @return The shared runtime registry.\n */\nfunction getRuntime() {\n\tconst globalScope = globalThis as GlobalScopeWithStyleRuntime;\n\n\tif ( globalScope.__wpStyleRuntime ) {\n\t\treturn globalScope.__wpStyleRuntime;\n\t}\n\n\tglobalScope.__wpStyleRuntime = {\n\t\tdocuments: new Map(),\n\t\tstyles: new Map(),\n\t\tinjectedStyles: new WeakMap(),\n\t};\n\n\tif ( typeof document !== 'undefined' ) {\n\t\tregisterDocument( document );\n\t}\n\n\treturn globalScope.__wpStyleRuntime;\n}\n\n/**\n * Checks whether a document already contains a style tag for a hash.\n *\n * @param targetDocument Document to inspect.\n * @param hash Stable hash for the transformed CSS.\n *\n * @return Whether the style hash already exists in the document.\n */\nfunction documentContainsStyleHash(\n\ttargetDocument: Document,\n\thash: string\n): boolean {\n\tif ( ! targetDocument.head ) {\n\t\treturn false;\n\t}\n\n\tfor ( const style of targetDocument.head.querySelectorAll(\n\t\t`style[${ STYLE_HASH_ATTRIBUTE }]`\n\t) ) {\n\t\tif ( style.getAttribute( STYLE_HASH_ATTRIBUTE ) === hash ) {\n\t\t\treturn true;\n\t\t}\n\t}\n\n\treturn false;\n}\n\n/**\n * Injects a registered style into a document, unless that document already\n * contains a style tag for the same hash.\n *\n * @param targetDocument Document to inject the style into.\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nfunction injectStyle( targetDocument: Document, hash: string, css: string ) {\n\tif ( ! targetDocument.head ) {\n\t\treturn;\n\t}\n\n\tconst runtime = getRuntime();\n\tlet injectedStyles = runtime.injectedStyles.get( targetDocument );\n\n\tif ( ! injectedStyles ) {\n\t\tinjectedStyles = new Set();\n\t\truntime.injectedStyles.set( targetDocument, injectedStyles );\n\t}\n\n\tif ( injectedStyles.has( hash ) ) {\n\t\treturn;\n\t}\n\n\t// Older generated CSS module output can still inject matching style tags\n\t// after this document's cache is created, so keep the DOM as the fallback\n\t// source of truth on cache misses.\n\tif ( documentContainsStyleHash( targetDocument, hash ) ) {\n\t\tinjectedStyles.add( hash );\n\t\treturn;\n\t}\n\n\tconst style = targetDocument.createElement( 'style' );\n\tstyle.setAttribute( STYLE_HASH_ATTRIBUTE, hash );\n\tstyle.appendChild( targetDocument.createTextNode( css ) );\n\ttargetDocument.head.appendChild( style );\n\tinjectedStyles.add( hash );\n}\n\n/**\n * Registers a document as a style injection target.\n *\n * Existing registered styles are replayed into the document immediately.\n * Documents are reference-counted so multiple providers can safely register the\n * same document without one cleanup removing it while another registration is\n * still active.\n *\n * @param targetDocument Document to receive registered styles.\n * @return Cleanup function that unregisters this document registration.\n */\nexport function registerDocument( targetDocument: Document ) {\n\tconst runtime = getRuntime();\n\n\truntime.documents.set(\n\t\ttargetDocument,\n\t\t( runtime.documents.get( targetDocument ) ?? 0 ) + 1\n\t);\n\n\tfor ( const [ hash, css ] of runtime.styles ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n\n\treturn () => {\n\t\tconst count = runtime.documents.get( targetDocument );\n\n\t\tif ( count === undefined ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( count <= 1 ) {\n\t\t\truntime.documents.delete( targetDocument );\n\t\t\treturn;\n\t\t}\n\n\t\truntime.documents.set( targetDocument, count - 1 );\n\t};\n}\n\n/**\n * Registers a style and injects it into all registered documents.\n *\n * The hash is used as the deduplication key, so calling this repeatedly with\n * the same hash will not add duplicate style tags to a document.\n * Registered styles are retained for the lifetime of the page so they can be\n * replayed into documents that are registered later.\n *\n * @param hash Stable hash for the transformed CSS.\n * @param css CSS text to inject.\n */\nexport function registerStyle( hash: string, css: string ) {\n\tconst runtime = getRuntime();\n\n\truntime.styles.set( hash, css );\n\n\tfor ( const targetDocument of runtime.documents.keys() ) {\n\t\tinjectStyle( targetDocument, hash, css );\n\t}\n}\n", "import { registerStyle } from '@wordpress/style-runtime';\nif (typeof process === 'undefined' || process.env.NODE_ENV !== 'test') {\n\tregisterStyle(\"2e64f95efa\", \".a70c7d5347a2f54b__handle{--widget-resize-handle-visual-inset:var(--wpds-dimension-padding-xs,4px);--widget-resize-handle-hover-scale:1.18;background:transparent;bottom:0;box-sizing:border-box;inset-inline-end:0;padding:0;position:absolute;z-index:1}.a70c7d5347a2f54b__handle:focus-visible{border-radius:var(--wpds-border-radius-sm,2px);outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus,var(--wp-admin-theme-color,#3858e9));outline-offset:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px))}.aa1d4aafe4d24e03__resizing{opacity:.72}._61d861c3afc33ad5__handleCorner{cursor:nwse-resize;height:var(--wpds-dimension-size-sm,24px);width:var(--wpds-dimension-size-sm,24px)}._61d861c3afc33ad5__handleCorner:after{border-block-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));border-block-start:none;border-end-end-radius:var(--wpds-border-radius-md,4px);border-inline-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));border-inline-start:none;bottom:var(--widget-resize-handle-visual-inset);box-sizing:border-box;content:\\\"\\\";height:var(--wpds-dimension-size-4xs,8px);inset-inline-end:var(--widget-resize-handle-visual-inset);position:absolute;transform:scale(1);transform-origin:100% 100%;width:var(--wpds-dimension-size-4xs,8px)}[dir=rtl] ._61d861c3afc33ad5__handleCorner:after{transform-origin:0 100%}._61d861c3afc33ad5__handleCorner.aa1d4aafe4d24e03__resizing:after,._61d861c3afc33ad5__handleCorner:focus-visible:after,._61d861c3afc33ad5__handleCorner:hover:after{border-block-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));border-inline-end:var(--wpds-border-width-sm,2px) solid var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));transform:scale(var(--widget-resize-handle-hover-scale))}._86ab3a6eb52bc222__handleHorizontal{align-items:center;border:none;cursor:ew-resize;display:flex;height:var(--wpds-dimension-size-lg,40px);justify-content:center;padding-inline-end:var(--widget-resize-handle-visual-inset);width:var(--wpds-dimension-size-sm,24px)}@media not (prefers-reduced-motion){._61d861c3afc33ad5__handleCorner:after{transition:transform var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)),border-block-end-color var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)),border-inline-end-color var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1))}._86ab3a6eb52bc222__handleHorizontal:after{transition:transform var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1)),background-color var(--wpds-motion-duration-xs,50ms) var(--wpds-motion-easing-balanced,cubic-bezier(.4,0,.2,1))}}._86ab3a6eb52bc222__handleHorizontal:after{background-color:var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));content:\\\"\\\";height:var(--wpds-dimension-size-3xs,12px);transform:scale(1);transform-origin:50% 100%;width:var(--wpds-border-width-sm,2px)}._86ab3a6eb52bc222__handleHorizontal.aa1d4aafe4d24e03__resizing:after,._86ab3a6eb52bc222__handleHorizontal:focus-visible:after,._86ab3a6eb52bc222__handleHorizontal:hover:after{background-color:var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));transform:scale(var(--widget-resize-handle-hover-scale))}@media (forced-colors:active){._61d861c3afc33ad5__handleCorner.aa1d4aafe4d24e03__resizing:after,._61d861c3afc33ad5__handleCorner:after,._61d861c3afc33ad5__handleCorner:focus-visible:after,._61d861c3afc33ad5__handleCorner:hover:after{border-block-end-color:Highlight;border-inline-end-color:Highlight}._86ab3a6eb52bc222__handleHorizontal.aa1d4aafe4d24e03__resizing:after,._86ab3a6eb52bc222__handleHorizontal:after,._86ab3a6eb52bc222__handleHorizontal:focus-visible:after,._86ab3a6eb52bc222__handleHorizontal:hover:after{background-color:Highlight}}\");\n}\nexport default {\"handle\":\"a70c7d5347a2f54b__handle\",\"resizing\":\"aa1d4aafe4d24e03__resizing\",\"handleCorner\":\"_61d861c3afc33ad5__handleCorner\",\"handleHorizontal\":\"_86ab3a6eb52bc222__handleHorizontal\"};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["WidgetResizeHandle"]
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wordpress/widget-dashboard",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.2.0",
|
|
4
4
|
"description": "Stateless rendering engine for widget dashboards: the WidgetDashboard compound component and its grid-settings kit.",
|
|
5
5
|
"author": "The WordPress Contributors",
|
|
6
6
|
"license": "GPL-2.0-or-later",
|
|
@@ -47,21 +47,21 @@
|
|
|
47
47
|
"src/**/*.module.css"
|
|
48
48
|
],
|
|
49
49
|
"dependencies": {
|
|
50
|
-
"@wordpress/commands": "^1.
|
|
51
|
-
"@wordpress/components": "^
|
|
52
|
-
"@wordpress/compose": "^8.
|
|
53
|
-
"@wordpress/data": "^10.
|
|
54
|
-
"@wordpress/dataviews": "^17.
|
|
55
|
-
"@wordpress/element": "^8.
|
|
56
|
-
"@wordpress/grid": "^0.
|
|
57
|
-
"@wordpress/i18n": "^6.
|
|
58
|
-
"@wordpress/icons": "^
|
|
59
|
-
"@wordpress/primitives": "^4.
|
|
60
|
-
"@wordpress/private-apis": "^1.
|
|
61
|
-
"@wordpress/style-runtime": "^0.
|
|
62
|
-
"@wordpress/ui": "^0.
|
|
63
|
-
"@wordpress/viewport": "^6.
|
|
64
|
-
"@wordpress/widget-primitives": "^0.
|
|
50
|
+
"@wordpress/commands": "^1.50.0",
|
|
51
|
+
"@wordpress/components": "^36.1.0",
|
|
52
|
+
"@wordpress/compose": "^8.3.0",
|
|
53
|
+
"@wordpress/data": "^10.50.0",
|
|
54
|
+
"@wordpress/dataviews": "^17.1.0",
|
|
55
|
+
"@wordpress/element": "^8.2.0",
|
|
56
|
+
"@wordpress/grid": "^0.2.0",
|
|
57
|
+
"@wordpress/i18n": "^6.23.0",
|
|
58
|
+
"@wordpress/icons": "^15.1.0",
|
|
59
|
+
"@wordpress/primitives": "^4.50.0",
|
|
60
|
+
"@wordpress/private-apis": "^1.50.0",
|
|
61
|
+
"@wordpress/style-runtime": "^0.6.0",
|
|
62
|
+
"@wordpress/ui": "^0.17.0",
|
|
63
|
+
"@wordpress/viewport": "^6.50.0",
|
|
64
|
+
"@wordpress/widget-primitives": "^0.2.0",
|
|
65
65
|
"clsx": "^2.1.1",
|
|
66
66
|
"fast-deep-equal": "^3.1.3",
|
|
67
67
|
"uuid": "^14.0.0"
|
|
@@ -86,5 +86,5 @@
|
|
|
86
86
|
"publishConfig": {
|
|
87
87
|
"access": "public"
|
|
88
88
|
},
|
|
89
|
-
"gitHead": "
|
|
89
|
+
"gitHead": "fee6e24e8e63d36f6bbcf487c193461e9bd79753"
|
|
90
90
|
}
|
|
@@ -122,7 +122,7 @@ function Header( { titleId, widgetType }: HeaderProps ) {
|
|
|
122
122
|
<Icon icon={ widgetType.icon } />
|
|
123
123
|
</span>
|
|
124
124
|
) }
|
|
125
|
-
<Card.Title id={ titleId } render={ <
|
|
125
|
+
<Card.Title id={ titleId } render={ <h2 /> }>
|
|
126
126
|
{ widgetType.title }
|
|
127
127
|
</Card.Title>
|
|
128
128
|
</Stack>
|
|
@@ -13,8 +13,8 @@
|
|
|
13
13
|
|
|
14
14
|
.handle:focus-visible {
|
|
15
15
|
outline: var(--wpds-border-width-focus) solid var(--wpds-color-stroke-focus);
|
|
16
|
-
/*
|
|
17
|
-
outline-offset:
|
|
16
|
+
/* Offset the ring by an amount equal to its own width. */
|
|
17
|
+
outline-offset: var(--wpds-border-width-focus);
|
|
18
18
|
border-radius: var(--wpds-border-radius-sm);
|
|
19
19
|
}
|
|
20
20
|
|
|
@@ -65,6 +65,12 @@ function Harness( {
|
|
|
65
65
|
}
|
|
66
66
|
|
|
67
67
|
describe( 'WidgetDashboard.Actions', () => {
|
|
68
|
+
let user: ReturnType< typeof userEvent.setup >;
|
|
69
|
+
|
|
70
|
+
beforeEach( () => {
|
|
71
|
+
user = userEvent.setup();
|
|
72
|
+
} );
|
|
73
|
+
|
|
68
74
|
it( 'renders the Customize button when editMode is false', () => {
|
|
69
75
|
render( <Harness /> );
|
|
70
76
|
|
|
@@ -91,9 +97,7 @@ describe( 'WidgetDashboard.Actions', () => {
|
|
|
91
97
|
const onEditChange = jest.fn();
|
|
92
98
|
render( <Harness onEditChange={ onEditChange } /> );
|
|
93
99
|
|
|
94
|
-
await
|
|
95
|
-
screen.getByRole( 'button', { name: 'Customize' } )
|
|
96
|
-
);
|
|
100
|
+
await user.click( screen.getByRole( 'button', { name: 'Customize' } ) );
|
|
97
101
|
|
|
98
102
|
expect( onEditChange ).toHaveBeenLastCalledWith( true );
|
|
99
103
|
} );
|
|
@@ -117,9 +121,7 @@ describe( 'WidgetDashboard.Actions', () => {
|
|
|
117
121
|
/>
|
|
118
122
|
);
|
|
119
123
|
|
|
120
|
-
await
|
|
121
|
-
screen.getByRole( 'button', { name: 'Cancel' } )
|
|
122
|
-
);
|
|
124
|
+
await user.click( screen.getByRole( 'button', { name: 'Cancel' } ) );
|
|
123
125
|
|
|
124
126
|
expect( onEditChange ).toHaveBeenLastCalledWith( false );
|
|
125
127
|
expect( onLayoutChange ).not.toHaveBeenCalled();
|
|
@@ -176,7 +178,7 @@ describe( 'WidgetDashboard.Actions', () => {
|
|
|
176
178
|
<Harness initialEditMode onGridSettingsChange={ () => {} } />
|
|
177
179
|
);
|
|
178
180
|
|
|
179
|
-
await
|
|
181
|
+
await user.click(
|
|
180
182
|
screen.getByRole( 'button', { name: 'Layout settings' } )
|
|
181
183
|
);
|
|
182
184
|
|
|
@@ -202,7 +204,7 @@ describe( 'WidgetDashboard.Actions', () => {
|
|
|
202
204
|
</WidgetDashboard>
|
|
203
205
|
);
|
|
204
206
|
|
|
205
|
-
await
|
|
207
|
+
await user.click(
|
|
206
208
|
screen.getByRole( 'button', { name: 'More options' } )
|
|
207
209
|
);
|
|
208
210
|
|
|
@@ -181,7 +181,7 @@ describe( 'WidgetDashboard', () => {
|
|
|
181
181
|
).toBeInTheDocument();
|
|
182
182
|
expect( screen.getByText( 'does/not-exist' ) ).toBeInTheDocument();
|
|
183
183
|
expect(
|
|
184
|
-
screen.queryByRole( 'heading', { level:
|
|
184
|
+
screen.queryByRole( 'heading', { level: 2 } )
|
|
185
185
|
).not.toBeInTheDocument();
|
|
186
186
|
} );
|
|
187
187
|
|