@wordpress/components 37.0.1-next.v.202607070741.0 → 38.0.0

package/src/validated-form-controls/components/stories/overview.story.tsx

@@ -365,6 +365,57 @@ export const ShowingErrorsAtArbitraryTimes: StoryObj<
 	},
 };
 
+/**
+ * A synthetic `invalid` event can be dispatched to reveal an existing error
+ * without moving focus.
+ */
+export const ShowingErrorsWithoutMovingFocus: StoryObj<
+	typeof ValidatedInputControl
+> = {
+	args: {
+		label: 'Text',
+		required: true,
+		help: 'The word "error" will trigger an error.',
+	},
+	decorators: [],
+	render: function Template( { ...args } ) {
+		const [ text, setText ] = useState< string | undefined >( 'error' );
+		const ref = useRef< HTMLInputElement >( null );
+
+		return (
+			<VStack spacing={ 4 } alignment="left">
+				<ValidatedInputControl
+					ref={ ref }
+					{ ...args }
+					value={ text }
+					onChange={ setText }
+					customValidity={
+						text === 'error'
+							? {
+									type: 'invalid',
+									message: 'The word "error" is not allowed.',
+							  }
+							: undefined
+					}
+				/>
+				<Button
+					__next40pxDefaultSize
+					variant="secondary"
+					onClick={ () =>
+						ref.current?.dispatchEvent(
+							new Event( 'invalid', {
+								cancelable: true,
+							} )
+						)
+					}
+				>
+					Show errors
+				</Button>
+			</VStack>
+		);
+	},
+};
+
 /**
  * A `form` wrapper and `type="submit"` button can be used to force validation when
  * the user tries to commit their changes, while still allowing the modal to be closed by canceling.

package/src/validated-form-controls/control-with-error.tsx

@@ -124,6 +124,15 @@ function UnforwardedControlWithError< C extends React.ReactElement >(
 		const suppressNativePopover = ( event: Event ) => {
 			event.preventDefault();
 
+			// Only trusted `invalid` events (a form submission or a
+			// `reportValidity()` call) mirror the native focus behavior.
+			// Consumers may dispatch a synthetic `invalid` event to reveal
+			// this control's error message without disturbing the user's
+			// place in the form, so it must not move focus.
+			if ( ! event.isTrusted ) {
+				return;
+			}
+
 			const target = event.target as ValidityTarget;
 			const firstErrorInForm = Array.from(
 				target.form?.elements ?? []
@@ -310,7 +319,7 @@ function UnforwardedControlWithError< C extends React.ReactElement >(
 				),
 				required,
 			} ) }
-			<div aria-live="polite">{ visibleMessage }</div>
+			{ visibleMessage }
 		</div>
 	);
 }

package/src/validated-form-controls/style.scss

@@ -21,7 +21,7 @@
 	.components-combobox-control__suggestions-container:has(
 	input:invalid[data-validity-visible]
 ):not(:has([aria-expanded="true"])) {
-		--wp-components-color-accent: #{$alert-red};
+		--wp-admin-theme-color: #{$alert-red};
 	}
 }
 
@@ -41,7 +41,14 @@
 
 	// For FormTokenField
 	&:has(input:invalid[data-validity-visible]) .components-form-token-field__input-container:not(:has([aria-expanded="true"])) {
-		--wp-components-color-accent: #{$alert-red};
+		--wp-admin-theme-color: #{$alert-red};
+		border-color: $alert-red;
+	}
+
+	// For ContentEditableControl
+	&:has(input:invalid[data-validity-visible])
+	.components-validated-control__content-editable [role="textbox"] {
+		--wp-admin-theme-color: #{$alert-red};
 		border-color: $alert-red;
 	}
 }

package/src/validated-form-controls/test/content-editable-control.tsx

@@ -0,0 +1,71 @@
+import { render, screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { ValidatedContentEditableControl } from '../components';
+
+describe( 'ValidatedContentEditableControl', () => {
+	it( 'should preserve the help description', () => {
+		render(
+			<ValidatedContentEditableControl
+				label="Bio"
+				help="A short bio."
+				value=""
+			/>
+		);
+
+		expect(
+			screen.getByRole( 'textbox', { name: 'Bio' } )
+		).toHaveAccessibleDescription( 'A short bio.' );
+	} );
+
+	// The validity (and its description) lives on the hidden delegate input,
+	// not the editable that assistive technology interacts with. This is the
+	// same pre-existing limitation as the other delegate-based controls,
+	// tracked in #76741.
+	// eslint-disable-next-line jest/no-disabled-tests
+	it.skip( 'should append the validation error alongside the help description', async () => {
+		const user = userEvent.setup();
+		render(
+			<form>
+				<ValidatedContentEditableControl
+					label="Bio"
+					help="A short bio."
+					value=""
+					required
+				/>
+				<button type="submit">Submit</button>
+			</form>
+		);
+
+		// The hidden validity delegate is also a textbox, so scope the query
+		// to the accessible name only the labeled editable has.
+		const textbox = screen.getByRole( 'textbox', {
+			name: /^Bio/,
+		} );
+
+		await user.click( screen.getByRole( 'button', { name: 'Submit' } ) );
+
+		await waitFor( () => {
+			expect( textbox ).toHaveAccessibleDescription(
+				expect.stringContaining( 'Constraints not satisfied' )
+			);
+		} );
+		expect( textbox ).toHaveAccessibleDescription(
+			expect.stringContaining( 'A short bio.' )
+		);
+	} );
+
+	it( 'should move focus to the editable when the delegate is focused', async () => {
+		render(
+			<ValidatedContentEditableControl label="Bio" value="" required />
+		);
+
+		const textbox = screen.getByRole( 'textbox', { name: /^Bio/ } );
+
+		// Constraint validation lands focus on the hidden delegate; the
+		// wrapper forwards it to the editable the user actually interacts
+		// with.
+		screen.getByRole( 'textbox', { name: '' } ).focus();
+
+		await waitFor( () => expect( textbox ).toHaveFocus() );
+	} );
+} );

package/src/validated-form-controls/test/control-with-error.tsx

@@ -542,5 +542,47 @@ describe( 'ControlWithError', () => {
 				).toHaveFocus();
 			} );
 		} );
+
+		it( 'should show the error message without moving focus on a synthetic `invalid` event', async () => {
+			const user = userEvent.setup();
+			function ValidatedInputControlWithRef(
+				props: React.ComponentProps< typeof ValidatedInputControl >
+			) {
+				const ref = useRef< HTMLInputElement >( null );
+				return (
+					<>
+						<ValidatedInputControl ref={ ref } { ...props } />
+						<button
+							type="button"
+							onClick={ () =>
+								ref.current?.dispatchEvent(
+									new Event( 'invalid', {
+										cancelable: true,
+									} )
+								)
+							}
+						>
+							Show errors
+						</button>
+					</>
+				);
+			}
+
+			render( <ValidatedInputControlWithRef label="Text" required /> );
+
+			const button = screen.getByRole( 'button', {
+				name: 'Show errors',
+			} );
+			await user.click( button );
+
+			// The error message is revealed...
+			await waitFor( () => {
+				expect(
+					screen.getByText( 'Constraints not satisfied' )
+				).toBeVisible();
+			} );
+			// ...but focus is not moved to the invalid field.
+			expect( button ).toHaveFocus();
+		} );
 	} );
 } );

package/src/view/test/__snapshots__/index.js.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`props should ignore legacy css prop styles (array) 1`] = `
 <div>

package/src/visually-hidden/stories/index.story.tsx

@@ -17,7 +17,7 @@ const meta: Meta< typeof VisuallyHidden > = {
 		componentStatus: {
 			status: 'not-recommended',
 			whereUsed: 'global',
-			notes: 'Use `VisuallyHidden` from `@wordpress/ui` instead.',
+			notes: 'Use [`VisuallyHidden`](?path=/docs/design-system-components-visuallyhidden--docs) from `@wordpress/ui` instead.',
 		},
 	},
 };

package/build/confirm-dialog/styles.cjs

@@ -1,42 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// packages/components/src/confirm-dialog/styles.ts
-var styles_exports = {};
-__export(styles_exports, {
-  wrapper: () => wrapper
-});
-module.exports = __toCommonJS(styles_exports);
-var import_react = require("@emotion/react");
-function _EMOTION_STRINGIFIED_CSS_ERROR__() {
-  return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
-}
-var wrapper = process.env.NODE_ENV === "production" ? {
-  name: "7g5ii0",
-  styles: "&&{z-index:1000001;}"
-} : {
-  name: "1gucf3d-wrapper",
-  styles: "&&{z-index:1000001;};label:wrapper;/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFhMEIiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIFRoZSB6LWluZGV4IGZvciBDb25maXJtRGlhbG9nIGlzIGJlaW5nIHNldCBoZXJlIGluc3RlYWQgb2YgaW5cbiAqIHBhY2thZ2VzL2Jhc2Utc3R5bGVzL196LWluZGV4LnNjc3MsIGJlY2F1c2UgdGhpcyBjb21wb25lbnQgdXNlc1xuICogZW1vdGlvbiBpbnN0ZWFkIG9mIHNhc3MuXG4gKlxuICogQ29uZmlybURpYWxvZyBuZWVkcyB0aGlzIGhpZ2hlciB6LWluZGV4IHRvIGVuc3VyZSBpdCByZW5kZXJzIG9uIHRvcCBvZlxuICogYW55IHBhcmVudCBQb3BvdmVyIGNvbXBvbmVudC5cbiAqL1xuZXhwb3J0IGNvbnN0IHdyYXBwZXIgPSBjc3NgXG5cdCYmIHtcblx0XHR6LWluZGV4OiAxMDAwMDAxO1xuXHR9XG5gO1xuIl19 */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  wrapper
-});
-//# sourceMappingURL=styles.cjs.map

package/build/confirm-dialog/styles.cjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/confirm-dialog/styles.ts"],
-  "sourcesContent": ["function _EMOTION_STRINGIFIED_CSS_ERROR__() { return \"You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).\"; }\n/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\n\n/**\n * The z-index for ConfirmDialog is being set here instead of in\n * packages/base-styles/_z-index.scss, because this component uses\n * emotion instead of sass.\n *\n * ConfirmDialog needs this higher z-index to ensure it renders on top of\n * any parent Popover component.\n */\nexport const wrapper = process.env.NODE_ENV === \"production\" ? {\n  name: \"7g5ii0\",\n  styles: \"&&{z-index:1000001;}\"\n} : {\n  name: \"1gucf3d-wrapper\",\n  styles: \"&&{z-index:1000001;};label:wrapper;/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFhMEIiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIFRoZSB6LWluZGV4IGZvciBDb25maXJtRGlhbG9nIGlzIGJlaW5nIHNldCBoZXJlIGluc3RlYWQgb2YgaW5cbiAqIHBhY2thZ2VzL2Jhc2Utc3R5bGVzL196LWluZGV4LnNjc3MsIGJlY2F1c2UgdGhpcyBjb21wb25lbnQgdXNlc1xuICogZW1vdGlvbiBpbnN0ZWFkIG9mIHNhc3MuXG4gKlxuICogQ29uZmlybURpYWxvZyBuZWVkcyB0aGlzIGhpZ2hlciB6LWluZGV4IHRvIGVuc3VyZSBpdCByZW5kZXJzIG9uIHRvcCBvZlxuICogYW55IHBhcmVudCBQb3BvdmVyIGNvbXBvbmVudC5cbiAqL1xuZXhwb3J0IGNvbnN0IHdyYXBwZXIgPSBjc3NgXG5cdCYmIHtcblx0XHR6LWluZGV4OiAxMDAwMDAxO1xuXHR9XG5gO1xuIl19 */\",\n  toString: _EMOTION_STRINGIFIED_CSS_ERROR__\n};"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA,mBAAoB;AAJpB,SAAS,mCAAmC;AAAE,SAAO;AAAmO;AAcjR,IAAM,UAAU,QAAQ,IAAI,aAAa,eAAe;AAAA,EAC7D,MAAM;AAAA,EACN,QAAQ;AACV,IAAI;AAAA,EACF,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,UAAU;AACZ;",
-  "names": []
-}

package/build/disabled/styles/disabled-styles.cjs

@@ -1,42 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// packages/components/src/disabled/styles/disabled-styles.tsx
-var disabled_styles_exports = {};
-__export(disabled_styles_exports, {
-  disabledStyles: () => disabledStyles
-});
-module.exports = __toCommonJS(disabled_styles_exports);
-var import_react = require("@emotion/react");
-function _EMOTION_STRINGIFIED_CSS_ERROR__() {
-  return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
-}
-var disabledStyles = process.env.NODE_ENV === "production" ? {
-  name: "u2jump",
-  styles: "position:relative;pointer-events:none;&::after{content:'';position:absolute;top:0;right:0;bottom:0;left:0;}*{pointer-events:none;}"
-} : {
-  name: "iqemdn-disabledStyles",
-  styles: "position:relative;pointer-events:none;&::after{content:'';position:absolute;top:0;right:0;bottom:0;left:0;}*{pointer-events:none;};label:disabledStyles;/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImRpc2FibGVkLXN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBS2lDIiwiZmlsZSI6ImRpc2FibGVkLXN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmV4cG9ydCBjb25zdCBkaXNhYmxlZFN0eWxlcyA9IGNzc2Bcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRwb2ludGVyLWV2ZW50czogbm9uZTtcblxuXHQmOjphZnRlciB7XG5cdFx0Y29udGVudDogJyc7XG5cdFx0cG9zaXRpb246IGFic29sdXRlO1xuXHRcdHRvcDogMDtcblx0XHRyaWdodDogMDtcblx0XHRib3R0b206IDA7XG5cdFx0bGVmdDogMDtcblx0fVxuXG5cdC8vIEFsc28gbWFrZSBuZXN0ZWQgYmxvY2tzIHVuc2VsZWN0YWJsZS5cblx0KiB7XG5cdFx0cG9pbnRlci1ldmVudHM6IG5vbmU7XG5cdH1cbmA7XG4iXX0= */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  disabledStyles
-});
-//# sourceMappingURL=disabled-styles.cjs.map

package/build/disabled/styles/disabled-styles.cjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/disabled/styles/disabled-styles.tsx"],
-  "sourcesContent": ["function _EMOTION_STRINGIFIED_CSS_ERROR__() { return \"You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).\"; }\n/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\nexport const disabledStyles = process.env.NODE_ENV === \"production\" ? {\n  name: \"u2jump\",\n  styles: \"position:relative;pointer-events:none;&::after{content:'';position:absolute;top:0;right:0;bottom:0;left:0;}*{pointer-events:none;}\"\n} : {\n  name: \"iqemdn-disabledStyles\",\n  styles: \"position:relative;pointer-events:none;&::after{content:'';position:absolute;top:0;right:0;bottom:0;left:0;}*{pointer-events:none;};label:disabledStyles;/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImRpc2FibGVkLXN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBS2lDIiwiZmlsZSI6ImRpc2FibGVkLXN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmV4cG9ydCBjb25zdCBkaXNhYmxlZFN0eWxlcyA9IGNzc2Bcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRwb2ludGVyLWV2ZW50czogbm9uZTtcblxuXHQmOjphZnRlciB7XG5cdFx0Y29udGVudDogJyc7XG5cdFx0cG9zaXRpb246IGFic29sdXRlO1xuXHRcdHRvcDogMDtcblx0XHRyaWdodDogMDtcblx0XHRib3R0b206IDA7XG5cdFx0bGVmdDogMDtcblx0fVxuXG5cdC8vIEFsc28gbWFrZSBuZXN0ZWQgYmxvY2tzIHVuc2VsZWN0YWJsZS5cblx0KiB7XG5cdFx0cG9pbnRlci1ldmVudHM6IG5vbmU7XG5cdH1cbmA7XG4iXX0= */\",\n  toString: _EMOTION_STRINGIFIED_CSS_ERROR__\n};"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA,mBAAoB;AAJpB,SAAS,mCAAmC;AAAE,SAAO;AAAmO;AAKjR,IAAM,iBAAiB,QAAQ,IAAI,aAAa,eAAe;AAAA,EACpE,MAAM;AAAA,EACN,QAAQ;AACV,IAAI;AAAA,EACF,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,UAAU;AACZ;",
-  "names": []
-}

package/build/form-token-field/styles.cjs

@@ -1,49 +0,0 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// packages/components/src/form-token-field/styles.ts
-var styles_exports = {};
-__export(styles_exports, {
-  TokensAndInputWrapperFlex: () => TokensAndInputWrapperFlex
-});
-module.exports = __toCommonJS(styles_exports);
-var import_base = __toESM(require("@emotion/styled/base"));
-var import_flex = require("../flex/index.cjs");
-var import_utils = require("../utils/index.cjs");
-var TokensAndInputWrapperFlex = /* @__PURE__ */ (0, import_base.default)(import_flex.Flex, process.env.NODE_ENV === "production" ? {
-  target: "ehq8nmi0"
-} : {
-  target: "ehq8nmi0",
-  label: "TokensAndInputWrapperFlex"
-})("padding:7px;", import_utils.boxSizingReset, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFXdUQiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBGbGV4IH0gZnJvbSAnLi4vZmxleCc7XG5pbXBvcnQgeyBib3hTaXppbmdSZXNldCB9IGZyb20gJy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFRva2Vuc0FuZElucHV0V3JhcHBlckZsZXggPSBzdHlsZWQoIEZsZXggKWBcblx0cGFkZGluZzogN3B4O1xuXHQkeyBib3hTaXppbmdSZXNldCB9XG5gO1xuIl19 */"));
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  TokensAndInputWrapperFlex
-});
-//# sourceMappingURL=styles.cjs.map

package/build/form-token-field/styles.cjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/form-token-field/styles.ts"],
-  "sourcesContent": ["import _styled from \"@emotion/styled/base\";\n/**\n * External dependencies\n */\n\n/**\n * Internal dependencies\n */\nimport { Flex } from '../flex';\nimport { boxSizingReset } from '../utils';\nexport const TokensAndInputWrapperFlex = /*#__PURE__*/_styled(Flex, process.env.NODE_ENV === \"production\" ? {\n  target: \"ehq8nmi0\"\n} : {\n  target: \"ehq8nmi0\",\n  label: \"TokensAndInputWrapperFlex\"\n})(\"padding:7px;\", boxSizingReset, \";\" + (process.env.NODE_ENV === \"production\" ? \"\" : \"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFXdUQiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBGbGV4IH0gZnJvbSAnLi4vZmxleCc7XG5pbXBvcnQgeyBib3hTaXppbmdSZXNldCB9IGZyb20gJy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFRva2Vuc0FuZElucHV0V3JhcHBlckZsZXggPSBzdHlsZWQoIEZsZXggKWBcblx0cGFkZGluZzogN3B4O1xuXHQkeyBib3hTaXppbmdSZXNldCB9XG5gO1xuIl19 */\"));"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAoB;AAQpB,kBAAqB;AACrB,mBAA+B;AACxB,IAAM,4BAAyC,gCAAAA,SAAQ,kBAAM,QAAQ,IAAI,aAAa,eAAe;AAAA,EAC1G,QAAQ;AACV,IAAI;AAAA,EACF,QAAQ;AAAA,EACR,OAAO;AACT,CAAC,EAAE,gBAAgB,6BAAgB,OAAO,QAAQ,IAAI,aAAa,eAAe,KAAK,8lBAA8lB;",
-  "names": ["_styled"]
-}

package/build/search-control/styles.cjs

@@ -1,74 +0,0 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// packages/components/src/search-control/styles.ts
-var styles_exports = {};
-__export(styles_exports, {
-  StyledIcon: () => StyledIcon,
-  StyledInputControl: () => StyledInputControl
-});
-module.exports = __toCommonJS(styles_exports);
-var import_base = __toESM(require("@emotion/styled/base"));
-var import_input_control = __toESM(require("../input-control/index.cjs"));
-var import_icon = __toESM(require("../icon/index.cjs"));
-function _EMOTION_STRINGIFIED_CSS_ERROR__() {
-  return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
-}
-var StyledInputControl = /* @__PURE__ */ (0, import_base.default)(import_input_control.default, process.env.NODE_ENV === "production" ? {
-  target: "effl84m1"
-} : {
-  target: "effl84m1",
-  label: "StyledInputControl"
-})(process.env.NODE_ENV === "production" ? {
-  name: "37btb2",
-  styles: "input[type='search']{&::-webkit-search-decoration,&::-webkit-search-cancel-button,&::-webkit-search-results-button,&::-webkit-search-results-decoration{-webkit-appearance:none;}}"
-} : {
-  name: "37btb2",
-  styles: "input[type='search']{&::-webkit-search-decoration,&::-webkit-search-cancel-button,&::-webkit-search-results-button,&::-webkit-search-results-decoration{-webkit-appearance:none;}}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFXd0QiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgSW5wdXRDb250cm9sIGZyb20gJy4uL2lucHV0LWNvbnRyb2wnO1xuaW1wb3J0IEljb24gZnJvbSAnLi4vaWNvbic7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRJbnB1dENvbnRyb2wgPSBzdHlsZWQoIElucHV0Q29udHJvbCApYFxuXHRpbnB1dFt0eXBlPSdzZWFyY2gnXSB7XG5cdFx0Jjo6LXdlYmtpdC1zZWFyY2gtZGVjb3JhdGlvbixcblx0XHQmOjotd2Via2l0LXNlYXJjaC1jYW5jZWwtYnV0dG9uLFxuXHRcdCY6Oi13ZWJraXQtc2VhcmNoLXJlc3VsdHMtYnV0dG9uLFxuXHRcdCY6Oi13ZWJraXQtc2VhcmNoLXJlc3VsdHMtZGVjb3JhdGlvbiB7XG5cdFx0XHQtd2Via2l0LWFwcGVhcmFuY2U6IG5vbmU7XG5cdFx0fVxuXHR9XG5gO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkSWNvbiA9IHN0eWxlZCggSWNvbiApYFxuXHQmOmRpciggbHRyICkge1xuXHRcdHRyYW5zZm9ybTogc2NhbGVYKCAtMSApO1xuXHR9XG5gO1xuIl19 */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-var StyledIcon = /* @__PURE__ */ (0, import_base.default)(import_icon.default, process.env.NODE_ENV === "production" ? {
-  target: "effl84m0"
-} : {
-  target: "effl84m0",
-  label: "StyledIcon"
-})(process.env.NODE_ENV === "production" ? {
-  name: "1i54h4p",
-  styles: "&:dir( ltr ){transform:scaleX( -1 );}"
-} : {
-  name: "1i54h4p",
-  styles: "&:dir( ltr ){transform:scaleX( -1 );}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzQndDIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IElucHV0Q29udHJvbCBmcm9tICcuLi9pbnB1dC1jb250cm9sJztcbmltcG9ydCBJY29uIGZyb20gJy4uL2ljb24nO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkSW5wdXRDb250cm9sID0gc3R5bGVkKCBJbnB1dENvbnRyb2wgKWBcblx0aW5wdXRbdHlwZT0nc2VhcmNoJ10ge1xuXHRcdCY6Oi13ZWJraXQtc2VhcmNoLWRlY29yYXRpb24sXG5cdFx0Jjo6LXdlYmtpdC1zZWFyY2gtY2FuY2VsLWJ1dHRvbixcblx0XHQmOjotd2Via2l0LXNlYXJjaC1yZXN1bHRzLWJ1dHRvbixcblx0XHQmOjotd2Via2l0LXNlYXJjaC1yZXN1bHRzLWRlY29yYXRpb24ge1xuXHRcdFx0LXdlYmtpdC1hcHBlYXJhbmNlOiBub25lO1xuXHRcdH1cblx0fVxuYDtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZEljb24gPSBzdHlsZWQoIEljb24gKWBcblx0JjpkaXIoIGx0ciApIHtcblx0XHR0cmFuc2Zvcm06IHNjYWxlWCggLTEgKTtcblx0fVxuYDtcbiJdfQ== */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  StyledIcon,
-  StyledInputControl
-});
-//# sourceMappingURL=styles.cjs.map

package/build/search-control/styles.cjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/search-control/styles.ts"],
-  "sourcesContent": ["import _styled from \"@emotion/styled/base\";\nfunction _EMOTION_STRINGIFIED_CSS_ERROR__() { return \"You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).\"; }\n/**\n * External dependencies\n */\n\n/**\n * Internal dependencies\n */\nimport InputControl from '../input-control';\nimport Icon from '../icon';\nexport const StyledInputControl = /*#__PURE__*/_styled(InputControl, process.env.NODE_ENV === \"production\" ? {\n  target: \"effl84m1\"\n} : {\n  target: \"effl84m1\",\n  label: \"StyledInputControl\"\n})(process.env.NODE_ENV === \"production\" ? {\n  name: \"37btb2\",\n  styles: \"input[type='search']{&::-webkit-search-decoration,&::-webkit-search-cancel-button,&::-webkit-search-results-button,&::-webkit-search-results-decoration{-webkit-appearance:none;}}\"\n} : {\n  name: \"37btb2\",\n  styles: \"input[type='search']{&::-webkit-search-decoration,&::-webkit-search-cancel-button,&::-webkit-search-results-button,&::-webkit-search-results-decoration{-webkit-appearance:none;}}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFXd0QiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgSW5wdXRDb250cm9sIGZyb20gJy4uL2lucHV0LWNvbnRyb2wnO1xuaW1wb3J0IEljb24gZnJvbSAnLi4vaWNvbic7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRJbnB1dENvbnRyb2wgPSBzdHlsZWQoIElucHV0Q29udHJvbCApYFxuXHRpbnB1dFt0eXBlPSdzZWFyY2gnXSB7XG5cdFx0Jjo6LXdlYmtpdC1zZWFyY2gtZGVjb3JhdGlvbixcblx0XHQmOjotd2Via2l0LXNlYXJjaC1jYW5jZWwtYnV0dG9uLFxuXHRcdCY6Oi13ZWJraXQtc2VhcmNoLXJlc3VsdHMtYnV0dG9uLFxuXHRcdCY6Oi13ZWJraXQtc2VhcmNoLXJlc3VsdHMtZGVjb3JhdGlvbiB7XG5cdFx0XHQtd2Via2l0LWFwcGVhcmFuY2U6IG5vbmU7XG5cdFx0fVxuXHR9XG5gO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkSWNvbiA9IHN0eWxlZCggSWNvbiApYFxuXHQmOmRpciggbHRyICkge1xuXHRcdHRyYW5zZm9ybTogc2NhbGVYKCAtMSApO1xuXHR9XG5gO1xuIl19 */\",\n  toString: _EMOTION_STRINGIFIED_CSS_ERROR__\n});\nexport const StyledIcon = /*#__PURE__*/_styled(Icon, process.env.NODE_ENV === \"production\" ? {\n  target: \"effl84m0\"\n} : {\n  target: \"effl84m0\",\n  label: \"StyledIcon\"\n})(process.env.NODE_ENV === \"production\" ? {\n  name: \"1i54h4p\",\n  styles: \"&:dir( ltr ){transform:scaleX( -1 );}\"\n} : {\n  name: \"1i54h4p\",\n  styles: \"&:dir( ltr ){transform:scaleX( -1 );}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzQndDIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IElucHV0Q29udHJvbCBmcm9tICcuLi9pbnB1dC1jb250cm9sJztcbmltcG9ydCBJY29uIGZyb20gJy4uL2ljb24nO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkSW5wdXRDb250cm9sID0gc3R5bGVkKCBJbnB1dENvbnRyb2wgKWBcblx0aW5wdXRbdHlwZT0nc2VhcmNoJ10ge1xuXHRcdCY6Oi13ZWJraXQtc2VhcmNoLWRlY29yYXRpb24sXG5cdFx0Jjo6LXdlYmtpdC1zZWFyY2gtY2FuY2VsLWJ1dHRvbixcblx0XHQmOjotd2Via2l0LXNlYXJjaC1yZXN1bHRzLWJ1dHRvbixcblx0XHQmOjotd2Via2l0LXNlYXJjaC1yZXN1bHRzLWRlY29yYXRpb24ge1xuXHRcdFx0LXdlYmtpdC1hcHBlYXJhbmNlOiBub25lO1xuXHRcdH1cblx0fVxuYDtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZEljb24gPSBzdHlsZWQoIEljb24gKWBcblx0JjpkaXIoIGx0ciApIHtcblx0XHR0cmFuc2Zvcm06IHNjYWxlWCggLTEgKTtcblx0fVxuYDtcbiJdfQ== */\",\n  toString: _EMOTION_STRINGIFIED_CSS_ERROR__\n});"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAoB;AASpB,2BAAyB;AACzB,kBAAiB;AATjB,SAAS,mCAAmC;AAAE,SAAO;AAAmO;AAUjR,IAAM,qBAAkC,gCAAAA,SAAQ,qBAAAC,SAAc,QAAQ,IAAI,aAAa,eAAe;AAAA,EAC3G,QAAQ;AACV,IAAI;AAAA,EACF,QAAQ;AAAA,EACR,OAAO;AACT,CAAC,EAAE,QAAQ,IAAI,aAAa,eAAe;AAAA,EACzC,MAAM;AAAA,EACN,QAAQ;AACV,IAAI;AAAA,EACF,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,UAAU;AACZ,CAAC;AACM,IAAM,aAA0B,gCAAAD,SAAQ,YAAAE,SAAM,QAAQ,IAAI,aAAa,eAAe;AAAA,EAC3F,QAAQ;AACV,IAAI;AAAA,EACF,QAAQ;AAAA,EACR,OAAO;AACT,CAAC,EAAE,QAAQ,IAAI,aAAa,eAAe;AAAA,EACzC,MAAM;AAAA,EACN,QAAQ;AACV,IAAI;AAAA,EACF,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,UAAU;AACZ,CAAC;",
-  "names": ["_styled", "InputControl", "Icon"]
-}

package/build/theme/color-algorithms.cjs

@@ -1,131 +0,0 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// packages/components/src/theme/color-algorithms.ts
-var color_algorithms_exports = {};
-__export(color_algorithms_exports, {
-  checkContrasts: () => checkContrasts,
-  generateShades: () => generateShades,
-  generateThemeVariables: () => generateThemeVariables
-});
-module.exports = __toCommonJS(color_algorithms_exports);
-var import_colord = require("colord");
-var import_a11y = __toESM(require("colord/plugins/a11y"));
-var import_names = __toESM(require("colord/plugins/names"));
-var import_warning = __toESM(require("@wordpress/warning"));
-var import_utils = require("../utils/index.cjs");
-(0, import_colord.extend)([import_names.default, import_a11y.default]);
-function generateThemeVariables(inputs) {
-  validateInputs(inputs);
-  const generatedColors = {
-    ...generateAccentDependentColors(inputs.accent),
-    ...generateBackgroundDependentColors(inputs.background)
-  };
-  warnContrastIssues(checkContrasts(inputs, generatedColors));
-  return {
-    colors: generatedColors
-  };
-}
-function validateInputs(inputs) {
-  for (const [key, value] of Object.entries(inputs)) {
-    if (typeof value !== "undefined" && !(0, import_colord.colord)(value).isValid()) {
-      globalThis.SCRIPT_DEBUG === true ? (0, import_warning.default)(`wp.components.Theme: "${value}" is not a valid color value for the '${key}' prop.`) : void 0;
-    }
-  }
-}
-function checkContrasts(inputs, outputs) {
-  const background = inputs.background || import_utils.COLORS.white;
-  const accent = inputs.accent || "#3858e9";
-  const foreground = outputs.foreground || import_utils.COLORS.gray[900];
-  const gray = outputs.gray || import_utils.COLORS.gray;
-  return {
-    accent: (0, import_colord.colord)(background).isReadable(accent) ? void 0 : `The background color ("${background}") does not have sufficient contrast against the accent color ("${accent}").`,
-    foreground: (0, import_colord.colord)(background).isReadable(foreground) ? void 0 : `The background color provided ("${background}") does not have sufficient contrast against the standard foreground colors.`,
-    grays: (0, import_colord.colord)(background).contrast(gray[600]) >= 3 && (0, import_colord.colord)(background).contrast(gray[700]) >= 4.5 ? void 0 : `The background color provided ("${background}") cannot generate a set of grayscale foreground colors with sufficient contrast. Try adjusting the color to be lighter or darker.`
-  };
-}
-function warnContrastIssues(issues) {
-  for (const error of Object.values(issues)) {
-    if (error) {
-      globalThis.SCRIPT_DEBUG === true ? (0, import_warning.default)("wp.components.Theme: " + error) : void 0;
-    }
-  }
-}
-function generateAccentDependentColors(accent) {
-  if (!accent) {
-    return {};
-  }
-  return {
-    accent,
-    accentDarker10: (0, import_colord.colord)(accent).darken(0.1).toHex(),
-    accentDarker20: (0, import_colord.colord)(accent).darken(0.2).toHex(),
-    accentInverted: getForegroundForColor(accent)
-  };
-}
-function generateBackgroundDependentColors(background) {
-  if (!background) {
-    return {};
-  }
-  const foreground = getForegroundForColor(background);
-  return {
-    background,
-    foreground,
-    foregroundInverted: getForegroundForColor(foreground),
-    gray: generateShades(background, foreground)
-  };
-}
-function getForegroundForColor(color) {
-  return (0, import_colord.colord)(color).isDark() ? import_utils.COLORS.white : import_utils.COLORS.gray[900];
-}
-function generateShades(background, foreground) {
-  const SHADES = {
-    100: 0.06,
-    200: 0.121,
-    300: 0.132,
-    400: 0.2,
-    600: 0.42,
-    700: 0.543,
-    800: 0.821
-  };
-  const limit = 0.884;
-  const direction = (0, import_colord.colord)(background).isDark() ? "lighten" : "darken";
-  const range = Math.abs((0, import_colord.colord)(background).toHsl().l - (0, import_colord.colord)(foreground).toHsl().l) / 100;
-  const result = {};
-  Object.entries(SHADES).forEach(([key, value]) => {
-    result[parseInt(key)] = (0, import_colord.colord)(background)[direction](value / limit * range).toHex();
-  });
-  return result;
-}
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  checkContrasts,
-  generateShades,
-  generateThemeVariables
-});
-//# sourceMappingURL=color-algorithms.cjs.map