@wordpress/boot 0.12.1-next.v.202605131032.0 → 0.14.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.
Files changed (38) hide show
  1. package/build-module/components/canvas/back-button.mjs +16 -11
  2. package/build-module/components/canvas/back-button.mjs.map +2 -2
  3. package/build-module/components/navigation/drilldown-item/index.mjs +7 -2
  4. package/build-module/components/navigation/drilldown-item/index.mjs.map +2 -2
  5. package/build-module/components/navigation/dropdown-item/index.mjs +2 -2
  6. package/build-module/components/navigation/dropdown-item/index.mjs.map +2 -2
  7. package/build-module/components/navigation/items.mjs +2 -2
  8. package/build-module/components/navigation/items.mjs.map +2 -2
  9. package/build-module/components/save-button/index.mjs +2 -2
  10. package/build-module/components/save-button/index.mjs.map +2 -2
  11. package/build-module/components/sidebar/index.mjs +27 -4
  12. package/build-module/components/sidebar/index.mjs.map +2 -2
  13. package/build-module/components/site-icon-link/index.mjs +2 -2
  14. package/build-module/components/site-icon-link/index.mjs.map +2 -2
  15. package/build-module/index.mjs +3 -3
  16. package/build-module/index.mjs.map +2 -2
  17. package/build-style/experimental-admin-bar-in-editor-rtl.css +37 -0
  18. package/build-style/experimental-admin-bar-in-editor.css +37 -0
  19. package/build-style/style-rtl.css +38 -0
  20. package/build-style/style.css +38 -0
  21. package/build-types/components/canvas/back-button.d.ts +5 -0
  22. package/build-types/components/canvas/back-button.d.ts.map +1 -1
  23. package/build-types/components/navigation/drilldown-item/index.d.ts.map +1 -1
  24. package/build-types/components/navigation/items.d.ts +1 -1
  25. package/build-types/components/navigation/items.d.ts.map +1 -1
  26. package/build-types/components/sidebar/index.d.ts +5 -0
  27. package/build-types/components/sidebar/index.d.ts.map +1 -1
  28. package/package.json +26 -26
  29. package/src/components/canvas/back-button.tsx +26 -11
  30. package/src/components/navigation/drilldown-item/index.tsx +4 -2
  31. package/src/components/navigation/dropdown-item/index.tsx +2 -2
  32. package/src/components/navigation/items.tsx +2 -2
  33. package/src/components/save-button/index.tsx +3 -3
  34. package/src/components/sidebar/index.tsx +35 -1
  35. package/src/components/sidebar/style.scss +4 -0
  36. package/src/components/site-icon-link/index.tsx +3 -3
  37. package/src/experimental-admin-bar-in-editor.scss +48 -0
  38. package/src/style.scss +1 -0
package/build-module/components/canvas/back-button.mjs CHANGED
@@ -1,12 +1,12 @@
1
1
  // packages/boot/src/components/canvas/back-button.tsx
2
2
  import {
3
3
  Button,
4
- Icon,
4
+ Icon as WCIcon,
5
5
  __unstableMotion as motion
6
6
  } from "@wordpress/components";
7
- import { arrowUpLeft } from "@wordpress/icons";
7
+ import { arrowUpLeft, arrowUpRight } from "@wordpress/icons";
8
8
  import { useReducedMotion } from "@wordpress/compose";
9
- import { __ } from "@wordpress/i18n";
9
+ import { __, isRTL } from "@wordpress/i18n";
10
10
  import SiteIcon from "../site-icon/index.mjs";
11
11
 
12
12
  // packages/boot/src/components/canvas/back-button.scss
@@ -32,6 +32,7 @@ var toggleHomeIconVariants = {
32
32
  };
33
33
  function BootBackButton({ length }) {
34
34
  const disableMotion = useReducedMotion();
35
+ const hasAdminBarInEditor = window.__experimentalAdminBarInEditor;
35
36
  const handleBack = () => {
36
37
  window.history.back();
37
38
  };
@@ -41,6 +42,7 @@ function BootBackButton({ length }) {
41
42
  const transition = {
42
43
  duration: disableMotion ? 0 : 0.3
43
44
  };
45
+ const arrowIcon = isRTL() ? arrowUpRight : arrowUpLeft;
44
46
  return /* @__PURE__ */ jsxs(
45
47
  motion.div,
46
48
  {
@@ -58,16 +60,19 @@ function BootBackButton({ length }) {
58
60
  onClick: handleBack,
59
61
  "aria-label": __("Go back"),
60
62
  __next40pxDefaultSize: true,
61
- children: /* @__PURE__ */ jsx(SiteIcon, {})
63
+ children: !hasAdminBarInEditor && /* @__PURE__ */ jsx(SiteIcon, {})
62
64
  }
63
65
  ),
64
- /* @__PURE__ */ jsx(
65
- motion.div,
66
- {
67
- className: "boot-canvas-back-button__icon",
68
- variants: toggleHomeIconVariants,
69
- children: /* @__PURE__ */ jsx(Icon, { icon: arrowUpLeft })
70
- }
66
+ hasAdminBarInEditor ? /* @__PURE__ */ jsx("div", { className: "boot-canvas-back-button__icon", children: /* @__PURE__ */ jsx(WCIcon, { icon: arrowIcon }) }) : (
67
+ /* Overlay arrow that appears on hover */
68
+ /* @__PURE__ */ jsx(
69
+ motion.div,
70
+ {
71
+ className: "boot-canvas-back-button__icon",
72
+ variants: toggleHomeIconVariants,
73
+ children: /* @__PURE__ */ jsx(WCIcon, { icon: arrowIcon })
74
+ }
75
+ )
71
76
  )
72
77
  ]
73
78
  }
package/build-module/components/canvas/back-button.mjs.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/components/canvas/back-button.tsx", "../../../src/components/canvas/back-button.scss"],
4
- "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tIcon,\n\t__unstableMotion as motion,\n} from '@wordpress/components';\nimport { arrowUpLeft } from '@wordpress/icons';\nimport { useReducedMotion } from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport SiteIcon from '../site-icon';\nimport './back-button.scss';\n\n/**\n * Overlay arrow animation that appears on hover.\n * Matches next-admin implementation with clip-path.\n */\nconst toggleHomeIconVariants = {\n\tedit: {\n\t\topacity: 0,\n\t\tscale: 0.2,\n\t},\n\thover: {\n\t\topacity: 1,\n\t\tscale: 1,\n\t\tclipPath: 'inset( 22% round 2px )',\n\t},\n};\n\n/**\n * Back button component that appears in full-screen canvas mode.\n * Matches next-admin's SiteIconBackButton design.\n *\n * @param {Object} props Component props\n * @param {number} props.length Number of BackButton fills (from Slot)\n * @return Back button with slide and hover animations\n */\nexport default function BootBackButton( { length }: { length: number } ) {\n\tconst disableMotion = useReducedMotion();\n\n\tconst handleBack = () => {\n\t\twindow.history.back();\n\t};\n\n\t// Only render if this is the only back button\n\tif ( length > 1 ) {\n\t\treturn null;\n\t}\n\n\tconst transition = {\n\t\tduration: disableMotion ? 0 : 0.3,\n\t};\n\n\treturn (\n\t\t<motion.div\n\t\t\tclassName=\"boot-canvas-back-button\"\n\t\t\tanimate=\"edit\"\n\t\t\tinitial=\"edit\"\n\t\t\twhileHover=\"hover\"\n\t\t\twhileTap=\"tap\"\n\t\t\ttransition={ transition }\n\t\t>\n\t\t\t<Button\n\t\t\t\tclassName=\"boot-canvas-back-button__link\"\n\t\t\t\tonClick={ handleBack }\n\t\t\t\taria-label={ __( 'Go back' ) }\n\t\t\t\t__next40pxDefaultSize\n\t\t\t>\n\t\t\t\t<SiteIcon />\n\t\t\t</Button>\n\n\t\t\t{ /* Overlay arrow that appears on hover */ }\n\t\t\t<motion.div\n\t\t\t\tclassName=\"boot-canvas-back-button__icon\"\n\t\t\t\tvariants={ toggleHomeIconVariants }\n\t\t\t>\n\t\t\t\t<Icon icon={ arrowUpLeft } />\n\t\t\t</motion.div>\n\t\t</motion.div>\n\t);\n}\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='c8750e18d1']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"c8750e18d1\");\n\tstyle.appendChild(document.createTextNode(\".boot-canvas-back-button{height:64px;left:0;position:absolute;top:0;width:64px;z-index:100}.boot-canvas-back-button__container{height:100%;position:relative;width:100%}.boot-canvas-back-button__link.components-button{align-items:center;background:var(--wpds-color-bg-surface-neutral-weak,#f4f4f4);border-radius:0;display:inline-flex;height:64px;justify-content:center;padding:0;text-decoration:none;width:64px}@media not (prefers-reduced-motion){.boot-canvas-back-button__link.components-button{transition:outline .1s ease-out}}.boot-canvas-back-button__link.components-button:focus:not(:active){outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));outline-offset:calc(var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px))*-1)}.boot-canvas-back-button__icon{align-items:center;background-color:#ccc;display:flex;height:64px;justify-content:center;left:0;pointer-events:none;position:absolute;top:0;width:64px}.boot-canvas-back-button__icon svg{fill:currentColor}.boot-canvas-back-button__icon.has-site-icon{-webkit-backdrop-filter:saturate(180%) blur(15px);backdrop-filter:saturate(180%) blur(15px);background-color:#fff9}.interface-interface-skeleton__header{margin-top:0!important}\"));\n\tdocument.head.appendChild(style);\n}\n"],
5
- "mappings": ";AAGA;AAAA,EACC;AAAA,EACA;AAAA,EACA,oBAAoB;AAAA,OACd;AACP,SAAS,mBAAmB;AAC5B,SAAS,wBAAwB;AACjC,SAAS,UAAU;AAKnB,OAAO,cAAc;;;ACfrB,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,2xCAA2xC,CAAC;AACt0C,WAAS,KAAK,YAAY,KAAK;AAChC;;;ADsDE,SAcE,KAdF;AArCF,IAAM,yBAAyB;AAAA,EAC9B,MAAM;AAAA,IACL,SAAS;AAAA,IACT,OAAO;AAAA,EACR;AAAA,EACA,OAAO;AAAA,IACN,SAAS;AAAA,IACT,OAAO;AAAA,IACP,UAAU;AAAA,EACX;AACD;AAUe,SAAR,eAAiC,EAAE,OAAO,GAAwB;AACxE,QAAM,gBAAgB,iBAAiB;AAEvC,QAAM,aAAa,MAAM;AACxB,WAAO,QAAQ,KAAK;AAAA,EACrB;AAGA,MAAK,SAAS,GAAI;AACjB,WAAO;AAAA,EACR;AAEA,QAAM,aAAa;AAAA,IAClB,UAAU,gBAAgB,IAAI;AAAA,EAC/B;AAEA,SACC;AAAA,IAAC,OAAO;AAAA,IAAP;AAAA,MACA,WAAU;AAAA,MACV,SAAQ;AAAA,MACR,SAAQ;AAAA,MACR,YAAW;AAAA,MACX,UAAS;AAAA,MACT;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACA,WAAU;AAAA,YACV,SAAU;AAAA,YACV,cAAa,GAAI,SAAU;AAAA,YAC3B,uBAAqB;AAAA,YAErB,8BAAC,YAAS;AAAA;AAAA,QACX;AAAA,QAGA;AAAA,UAAC,OAAO;AAAA,UAAP;AAAA,YACA,WAAU;AAAA,YACV,UAAW;AAAA,YAEX,8BAAC,QAAK,MAAO,aAAc;AAAA;AAAA,QAC5B;AAAA;AAAA;AAAA,EACD;AAEF;",
4
+ "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tIcon as WCIcon,\n\t__unstableMotion as motion,\n} from '@wordpress/components';\nimport { arrowUpLeft, arrowUpRight } from '@wordpress/icons';\nimport { useReducedMotion } from '@wordpress/compose';\nimport { __, isRTL } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport SiteIcon from '../site-icon';\nimport './back-button.scss';\n\ndeclare global {\n\tinterface Window {\n\t\t__experimentalAdminBarInEditor?: boolean;\n\t}\n}\n\n/**\n * Overlay arrow animation that appears on hover.\n * Matches next-admin implementation with clip-path.\n */\nconst toggleHomeIconVariants = {\n\tedit: {\n\t\topacity: 0,\n\t\tscale: 0.2,\n\t},\n\thover: {\n\t\topacity: 1,\n\t\tscale: 1,\n\t\tclipPath: 'inset( 22% round 2px )',\n\t},\n};\n\n/**\n * Back button component that appears in full-screen canvas mode.\n * Matches next-admin's SiteIconBackButton design.\n *\n * @param {Object} props Component props\n * @param {number} props.length Number of BackButton fills (from Slot)\n * @return Back button with slide and hover animations\n */\nexport default function BootBackButton( { length }: { length: number } ) {\n\tconst disableMotion = useReducedMotion();\n\tconst hasAdminBarInEditor = window.__experimentalAdminBarInEditor;\n\n\tconst handleBack = () => {\n\t\twindow.history.back();\n\t};\n\n\t// Only render if this is the only back button\n\tif ( length > 1 ) {\n\t\treturn null;\n\t}\n\n\tconst transition = {\n\t\tduration: disableMotion ? 0 : 0.3,\n\t};\n\n\tconst arrowIcon = isRTL() ? arrowUpRight : arrowUpLeft;\n\n\treturn (\n\t\t<motion.div\n\t\t\tclassName=\"boot-canvas-back-button\"\n\t\t\tanimate=\"edit\"\n\t\t\tinitial=\"edit\"\n\t\t\twhileHover=\"hover\"\n\t\t\twhileTap=\"tap\"\n\t\t\ttransition={ transition }\n\t\t>\n\t\t\t<Button\n\t\t\t\tclassName=\"boot-canvas-back-button__link\"\n\t\t\t\tonClick={ handleBack }\n\t\t\t\taria-label={ __( 'Go back' ) }\n\t\t\t\t__next40pxDefaultSize\n\t\t\t>\n\t\t\t\t{ ! hasAdminBarInEditor && <SiteIcon /> }\n\t\t\t</Button>\n\n\t\t\t{ hasAdminBarInEditor ? (\n\t\t\t\t<div className=\"boot-canvas-back-button__icon\">\n\t\t\t\t\t<WCIcon icon={ arrowIcon } />\n\t\t\t\t</div>\n\t\t\t) : (\n\t\t\t\t/* Overlay arrow that appears on hover */\n\t\t\t\t<motion.div\n\t\t\t\t\tclassName=\"boot-canvas-back-button__icon\"\n\t\t\t\t\tvariants={ toggleHomeIconVariants }\n\t\t\t\t>\n\t\t\t\t\t<WCIcon icon={ arrowIcon } />\n\t\t\t\t</motion.div>\n\t\t\t) }\n\t\t</motion.div>\n\t);\n}\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='c8750e18d1']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"c8750e18d1\");\n\tstyle.appendChild(document.createTextNode(\".boot-canvas-back-button{height:64px;left:0;position:absolute;top:0;width:64px;z-index:100}.boot-canvas-back-button__container{height:100%;position:relative;width:100%}.boot-canvas-back-button__link.components-button{align-items:center;background:var(--wpds-color-bg-surface-neutral-weak,#f4f4f4);border-radius:0;display:inline-flex;height:64px;justify-content:center;padding:0;text-decoration:none;width:64px}@media not (prefers-reduced-motion){.boot-canvas-back-button__link.components-button{transition:outline .1s ease-out}}.boot-canvas-back-button__link.components-button:focus:not(:active){outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));outline-offset:calc(var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px))*-1)}.boot-canvas-back-button__icon{align-items:center;background-color:#ccc;display:flex;height:64px;justify-content:center;left:0;pointer-events:none;position:absolute;top:0;width:64px}.boot-canvas-back-button__icon svg{fill:currentColor}.boot-canvas-back-button__icon.has-site-icon{-webkit-backdrop-filter:saturate(180%) blur(15px);backdrop-filter:saturate(180%) blur(15px);background-color:#fff9}.interface-interface-skeleton__header{margin-top:0!important}\"));\n\tdocument.head.appendChild(style);\n}\n"],
5
+ "mappings": ";AAGA;AAAA,EACC;AAAA,EACA,QAAQ;AAAA,EACR,oBAAoB;AAAA,OACd;AACP,SAAS,aAAa,oBAAoB;AAC1C,SAAS,wBAAwB;AACjC,SAAS,IAAI,aAAa;AAK1B,OAAO,cAAc;;;ACfrB,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,2xCAA2xC,CAAC;AACt0C,WAAS,KAAK,YAAY,KAAK;AAChC;;;AD+DE,SAc6B,KAd7B;AAxCF,IAAM,yBAAyB;AAAA,EAC9B,MAAM;AAAA,IACL,SAAS;AAAA,IACT,OAAO;AAAA,EACR;AAAA,EACA,OAAO;AAAA,IACN,SAAS;AAAA,IACT,OAAO;AAAA,IACP,UAAU;AAAA,EACX;AACD;AAUe,SAAR,eAAiC,EAAE,OAAO,GAAwB;AACxE,QAAM,gBAAgB,iBAAiB;AACvC,QAAM,sBAAsB,OAAO;AAEnC,QAAM,aAAa,MAAM;AACxB,WAAO,QAAQ,KAAK;AAAA,EACrB;AAGA,MAAK,SAAS,GAAI;AACjB,WAAO;AAAA,EACR;AAEA,QAAM,aAAa;AAAA,IAClB,UAAU,gBAAgB,IAAI;AAAA,EAC/B;AAEA,QAAM,YAAY,MAAM,IAAI,eAAe;AAE3C,SACC;AAAA,IAAC,OAAO;AAAA,IAAP;AAAA,MACA,WAAU;AAAA,MACV,SAAQ;AAAA,MACR,SAAQ;AAAA,MACR,YAAW;AAAA,MACX,UAAS;AAAA,MACT;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACA,WAAU;AAAA,YACV,SAAU;AAAA,YACV,cAAa,GAAI,SAAU;AAAA,YAC3B,uBAAqB;AAAA,YAEnB,WAAE,uBAAuB,oBAAC,YAAS;AAAA;AAAA,QACtC;AAAA,QAEE,sBACD,oBAAC,SAAI,WAAU,iCACd,8BAAC,UAAO,MAAO,WAAY,GAC5B;AAAA;AAAA,UAGA;AAAA,YAAC,OAAO;AAAA,YAAP;AAAA,cACA,WAAU;AAAA,cACV,UAAW;AAAA,cAEX,8BAAC,UAAO,MAAO,WAAY;AAAA;AAAA,UAC5B;AAAA;AAAA;AAAA;AAAA,EAEF;AAEF;",
6
6
  "names": []
7
7
  }
package/build-module/components/navigation/drilldown-item/index.mjs CHANGED
@@ -4,7 +4,7 @@ import {
4
4
  FlexBlock,
5
5
  __experimentalItem as Item,
6
6
  __experimentalHStack as HStack,
7
- Icon
7
+ Icon as WCIcon
8
8
  } from "@wordpress/components";
9
9
  import { isRTL } from "@wordpress/i18n";
10
10
  import { chevronRightSmall, chevronLeftSmall } from "@wordpress/icons";
@@ -36,7 +36,12 @@ function DrilldownItem({
36
36
  children: [
37
37
  wrapIcon(icon, shouldShowPlaceholder),
38
38
  /* @__PURE__ */ jsx(FlexBlock, { children }),
39
- /* @__PURE__ */ jsx(Icon, { icon: isRTL() ? chevronLeftSmall : chevronRightSmall })
39
+ /* @__PURE__ */ jsx(
40
+ WCIcon,
41
+ {
42
+ icon: isRTL() ? chevronLeftSmall : chevronRightSmall
43
+ }
44
+ )
40
45
  ]
41
46
  }
42
47
  )
package/build-module/components/navigation/drilldown-item/index.mjs.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/components/navigation/drilldown-item/index.tsx"],
4
- "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tFlexBlock,\n\t__experimentalItem as Item,\n\t// @ts-ignore\n\t__experimentalHStack as HStack,\n\tIcon,\n} from '@wordpress/components';\nimport { isRTL } from '@wordpress/i18n';\nimport { chevronRightSmall, chevronLeftSmall } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { wrapIcon } from '../items';\nimport type { IconType } from '../../../store/types';\n\ninterface DrilldownItemProps {\n\t/**\n\t * Optional CSS class name.\n\t */\n\tclassName?: string;\n\t/**\n\t * Identifier of the navigation item.\n\t */\n\tid: string;\n\t/**\n\t * Icon to display with the navigation item.\n\t */\n\ticon?: IconType;\n\t/**\n\t * Whether to show placeholder icons for alignment.\n\t */\n\tshouldShowPlaceholder?: boolean;\n\t/**\n\t * Content to display inside the navigation item.\n\t */\n\tchildren: ReactNode;\n\t/**\n\t * Function to handle sidebar navigation when the item is clicked.\n\t */\n\tonNavigate: ( {\n\t\tid,\n\t\tdirection,\n\t}: {\n\t\tid?: string;\n\t\tdirection: 'forward' | 'backward';\n\t} ) => void;\n}\n\nexport default function DrilldownItem( {\n\tclassName,\n\tid,\n\ticon,\n\tshouldShowPlaceholder = true,\n\tchildren,\n\tonNavigate,\n}: DrilldownItemProps ) {\n\tconst handleClick = ( e: React.MouseEvent ) => {\n\t\te.preventDefault();\n\t\tonNavigate( { id, direction: 'forward' } );\n\t};\n\n\treturn (\n\t\t<Item\n\t\t\tclassName={ clsx( 'boot-navigation-item', className ) }\n\t\t\tonClick={ handleClick }\n\t\t>\n\t\t\t<HStack\n\t\t\t\tjustify=\"flex-start\"\n\t\t\t\tspacing={ 2 }\n\t\t\t\tstyle={ { flexGrow: '1' } }\n\t\t\t>\n\t\t\t\t{ wrapIcon( icon, shouldShowPlaceholder ) }\n\t\t\t\t<FlexBlock>{ children }</FlexBlock>\n\t\t\t\t<Icon icon={ isRTL() ? chevronLeftSmall : chevronRightSmall } />\n\t\t\t</HStack>\n\t\t</Item>\n\t);\n}\n"],
5
- "mappings": ";AAGA,OAAO,UAAU;AAMjB;AAAA,EACC;AAAA,EACA,sBAAsB;AAAA,EAEtB,wBAAwB;AAAA,EACxB;AAAA,OACM;AACP,SAAS,aAAa;AACtB,SAAS,mBAAmB,wBAAwB;AAKpD,SAAS,gBAAgB;AAsDtB,SAMC,KAND;AAlBY,SAAR,cAAgC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA,wBAAwB;AAAA,EACxB;AAAA,EACA;AACD,GAAwB;AACvB,QAAM,cAAc,CAAE,MAAyB;AAC9C,MAAE,eAAe;AACjB,eAAY,EAAE,IAAI,WAAW,UAAU,CAAE;AAAA,EAC1C;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAY,KAAM,wBAAwB,SAAU;AAAA,MACpD,SAAU;AAAA,MAEV;AAAA,QAAC;AAAA;AAAA,UACA,SAAQ;AAAA,UACR,SAAU;AAAA,UACV,OAAQ,EAAE,UAAU,IAAI;AAAA,UAEtB;AAAA,qBAAU,MAAM,qBAAsB;AAAA,YACxC,oBAAC,aAAY,UAAU;AAAA,YACvB,oBAAC,QAAK,MAAO,MAAM,IAAI,mBAAmB,mBAAoB;AAAA;AAAA;AAAA,MAC/D;AAAA;AAAA,EACD;AAEF;",
4
+ "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tFlexBlock,\n\t__experimentalItem as Item,\n\t// @ts-ignore\n\t__experimentalHStack as HStack,\n\tIcon as WCIcon,\n} from '@wordpress/components';\nimport { isRTL } from '@wordpress/i18n';\nimport { chevronRightSmall, chevronLeftSmall } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { wrapIcon } from '../items';\nimport type { IconType } from '../../../store/types';\n\ninterface DrilldownItemProps {\n\t/**\n\t * Optional CSS class name.\n\t */\n\tclassName?: string;\n\t/**\n\t * Identifier of the navigation item.\n\t */\n\tid: string;\n\t/**\n\t * Icon to display with the navigation item.\n\t */\n\ticon?: IconType;\n\t/**\n\t * Whether to show placeholder icons for alignment.\n\t */\n\tshouldShowPlaceholder?: boolean;\n\t/**\n\t * Content to display inside the navigation item.\n\t */\n\tchildren: ReactNode;\n\t/**\n\t * Function to handle sidebar navigation when the item is clicked.\n\t */\n\tonNavigate: ( {\n\t\tid,\n\t\tdirection,\n\t}: {\n\t\tid?: string;\n\t\tdirection: 'forward' | 'backward';\n\t} ) => void;\n}\n\nexport default function DrilldownItem( {\n\tclassName,\n\tid,\n\ticon,\n\tshouldShowPlaceholder = true,\n\tchildren,\n\tonNavigate,\n}: DrilldownItemProps ) {\n\tconst handleClick = ( e: React.MouseEvent ) => {\n\t\te.preventDefault();\n\t\tonNavigate( { id, direction: 'forward' } );\n\t};\n\n\treturn (\n\t\t<Item\n\t\t\tclassName={ clsx( 'boot-navigation-item', className ) }\n\t\t\tonClick={ handleClick }\n\t\t>\n\t\t\t<HStack\n\t\t\t\tjustify=\"flex-start\"\n\t\t\t\tspacing={ 2 }\n\t\t\t\tstyle={ { flexGrow: '1' } }\n\t\t\t>\n\t\t\t\t{ wrapIcon( icon, shouldShowPlaceholder ) }\n\t\t\t\t<FlexBlock>{ children }</FlexBlock>\n\t\t\t\t<WCIcon\n\t\t\t\t\ticon={ isRTL() ? chevronLeftSmall : chevronRightSmall }\n\t\t\t\t/>\n\t\t\t</HStack>\n\t\t</Item>\n\t);\n}\n"],
5
+ "mappings": ";AAGA,OAAO,UAAU;AAMjB;AAAA,EACC;AAAA,EACA,sBAAsB;AAAA,EAEtB,wBAAwB;AAAA,EACxB,QAAQ;AAAA,OACF;AACP,SAAS,aAAa;AACtB,SAAS,mBAAmB,wBAAwB;AAKpD,SAAS,gBAAgB;AAsDtB,SAMC,KAND;AAlBY,SAAR,cAAgC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA,wBAAwB;AAAA,EACxB;AAAA,EACA;AACD,GAAwB;AACvB,QAAM,cAAc,CAAE,MAAyB;AAC9C,MAAE,eAAe;AACjB,eAAY,EAAE,IAAI,WAAW,UAAU,CAAE;AAAA,EAC1C;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAY,KAAM,wBAAwB,SAAU;AAAA,MACpD,SAAU;AAAA,MAEV;AAAA,QAAC;AAAA;AAAA,UACA,SAAQ;AAAA,UACR,SAAU;AAAA,UACV,OAAQ,EAAE,UAAU,IAAI;AAAA,UAEtB;AAAA,qBAAU,MAAM,qBAAsB;AAAA,YACxC,oBAAC,aAAY,UAAU;AAAA,YACvB;AAAA,cAAC;AAAA;AAAA,gBACA,MAAO,MAAM,IAAI,mBAAmB;AAAA;AAAA,YACrC;AAAA;AAAA;AAAA,MACD;AAAA;AAAA,EACD;AAEF;",
6
6
  "names": []
7
7
  }
package/build-module/components/navigation/dropdown-item/index.mjs CHANGED
@@ -4,7 +4,7 @@ import {
4
4
  FlexBlock,
5
5
  __experimentalItem as Item,
6
6
  __experimentalHStack as HStack,
7
- Icon,
7
+ Icon as WCIcon,
8
8
  __unstableMotion as motion,
9
9
  __unstableAnimatePresence as AnimatePresence
10
10
  } from "@wordpress/components";
@@ -64,7 +64,7 @@ function DropdownItem({
64
64
  wrapIcon(icon, false),
65
65
  /* @__PURE__ */ jsx(FlexBlock, { children }),
66
66
  /* @__PURE__ */ jsx(
67
- Icon,
67
+ WCIcon,
68
68
  {
69
69
  icon: chevronDownSmall,
70
70
  className: clsx("boot-dropdown-item__chevron", {
package/build-module/components/navigation/dropdown-item/index.mjs.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/components/navigation/dropdown-item/index.tsx", "../../../../src/components/navigation/dropdown-item/style.scss"],
4
- "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tFlexBlock,\n\t__experimentalItem as Item,\n\t// @ts-ignore\n\t__experimentalHStack as HStack,\n\tIcon,\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '@wordpress/components';\nimport { chevronDownSmall } from '@wordpress/icons';\nimport { useReducedMotion } from '@wordpress/compose';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { STORE_NAME } from '../../../store';\nimport NavigationItem from '../navigation-item';\nimport { wrapIcon } from '../items';\nimport type { IconType, MenuItem } from '../../../store/types';\nimport './style.scss';\n\nconst ANIMATION_DURATION = 0.2;\n\ninterface DropdownItemProps {\n\t/**\n\t * Optional CSS class name.\n\t */\n\tclassName?: string;\n\t/**\n\t * Identifier of the parent menu item.\n\t */\n\tid: string;\n\t/**\n\t * Icon to display with the dropdown item.\n\t */\n\ticon?: IconType;\n\t/**\n\t * Whether to show placeholder icons for alignment.\n\t */\n\tshouldShowPlaceholder?: boolean;\n\t/**\n\t * Content to display inside the dropdown item.\n\t */\n\tchildren: ReactNode;\n\t/**\n\t * Whether this dropdown is currently expanded.\n\t */\n\tisExpanded: boolean;\n\t/**\n\t * Function to toggle this dropdown's expanded state.\n\t */\n\tonToggle: () => void;\n}\n\nexport default function DropdownItem( {\n\tclassName,\n\tid,\n\ticon,\n\tchildren,\n\tisExpanded,\n\tonToggle,\n}: DropdownItemProps ) {\n\tconst menuItems: MenuItem[] = useSelect(\n\t\t( select ) =>\n\t\t\t// @ts-ignore\n\t\t\tselect( STORE_NAME ).getMenuItems(),\n\t\t[]\n\t);\n\tconst items = menuItems.filter( ( item ) => item.parent === id );\n\tconst disableMotion = useReducedMotion();\n\treturn (\n\t\t<div className=\"boot-dropdown-item\">\n\t\t\t<Item\n\t\t\t\tclassName={ clsx( 'boot-navigation-item', className ) }\n\t\t\t\tonClick={ ( e ) => {\n\t\t\t\t\te.preventDefault();\n\t\t\t\t\te.stopPropagation();\n\t\t\t\t\tonToggle();\n\t\t\t\t} }\n\t\t\t\tonMouseDown={ ( e ) => e.preventDefault() }\n\t\t\t>\n\t\t\t\t<HStack\n\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\tspacing={ 2 }\n\t\t\t\t\tstyle={ { flexGrow: '1' } }\n\t\t\t\t>\n\t\t\t\t\t{ wrapIcon( icon, false ) }\n\t\t\t\t\t<FlexBlock>{ children }</FlexBlock>\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={ chevronDownSmall }\n\t\t\t\t\t\tclassName={ clsx( 'boot-dropdown-item__chevron', {\n\t\t\t\t\t\t\t'is-up': isExpanded,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t/>\n\t\t\t\t</HStack>\n\t\t\t</Item>\n\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t{ isExpanded && (\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tinitial={ { height: 0 } }\n\t\t\t\t\t\tanimate={ { height: 'auto' } }\n\t\t\t\t\t\texit={ { height: 0 } }\n\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\tduration: disableMotion ? 0 : ANIMATION_DURATION,\n\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tclassName=\"boot-dropdown-item__children\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ items.map( ( item, index ) => (\n\t\t\t\t\t\t\t<NavigationItem\n\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\tto={ item.to }\n\t\t\t\t\t\t\t\tshouldShowPlaceholder={ false }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ item.label }\n\t\t\t\t\t\t\t</NavigationItem>\n\t\t\t\t\t\t) ) }\n\t\t\t\t\t</motion.div>\n\t\t\t\t) }\n\t\t\t</AnimatePresence>\n\t\t</div>\n\t);\n}\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='608eff82f3']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"608eff82f3\");\n\tstyle.appendChild(document.createTextNode(\".boot-dropdown-item__children{display:flex;flex-direction:column;margin-block-end:2px;margin-block-start:-2px;margin-inline-start:30px;overflow:hidden;padding:2px}.boot-dropdown-item__chevron.is-up{transform:rotate(180deg)}\"));\n\tdocument.head.appendChild(style);\n}\n"],
5
- "mappings": ";AAGA,OAAO,UAAU;AAMjB;AAAA,EACC;AAAA,EACA,sBAAsB;AAAA,EAEtB,wBAAwB;AAAA,EACxB;AAAA,EACA,oBAAoB;AAAA,EACpB,6BAA6B;AAAA,OACvB;AACP,SAAS,wBAAwB;AACjC,SAAS,wBAAwB;AACjC,SAAS,iBAAiB;AAK1B,SAAS,kBAAkB;AAC3B,OAAO,oBAAoB;AAC3B,SAAS,gBAAgB;;;AC3BzB,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,iOAAiO,CAAC;AAC5Q,WAAS,KAAK,YAAY,KAAK;AAChC;;;ADsFI,SAMC,KAND;AA5DJ,IAAM,qBAAqB;AAiCZ,SAAR,aAA+B;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAuB;AACtB,QAAM,YAAwB;AAAA,IAC7B,CAAE;AAAA;AAAA,MAED,OAAQ,UAAW,EAAE,aAAa;AAAA;AAAA,IACnC,CAAC;AAAA,EACF;AACA,QAAM,QAAQ,UAAU,OAAQ,CAAE,SAAU,KAAK,WAAW,EAAG;AAC/D,QAAM,gBAAgB,iBAAiB;AACvC,SACC,qBAAC,SAAI,WAAU,sBACd;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,WAAY,KAAM,wBAAwB,SAAU;AAAA,QACpD,SAAU,CAAE,MAAO;AAClB,YAAE,eAAe;AACjB,YAAE,gBAAgB;AAClB,mBAAS;AAAA,QACV;AAAA,QACA,aAAc,CAAE,MAAO,EAAE,eAAe;AAAA,QAExC;AAAA,UAAC;AAAA;AAAA,YACA,SAAQ;AAAA,YACR,SAAU;AAAA,YACV,OAAQ,EAAE,UAAU,IAAI;AAAA,YAEtB;AAAA,uBAAU,MAAM,KAAM;AAAA,cACxB,oBAAC,aAAY,UAAU;AAAA,cACvB;AAAA,gBAAC;AAAA;AAAA,kBACA,MAAO;AAAA,kBACP,WAAY,KAAM,+BAA+B;AAAA,oBAChD,SAAS;AAAA,kBACV,CAAE;AAAA;AAAA,cACH;AAAA;AAAA;AAAA,QACD;AAAA;AAAA,IACD;AAAA,IACA,oBAAC,mBAAgB,SAAU,OACxB,wBACD;AAAA,MAAC,OAAO;AAAA,MAAP;AAAA,QACA,SAAU,EAAE,QAAQ,EAAE;AAAA,QACtB,SAAU,EAAE,QAAQ,OAAO;AAAA,QAC3B,MAAO,EAAE,QAAQ,EAAE;AAAA,QACnB,YAAa;AAAA,UACZ,MAAM;AAAA,UACN,UAAU,gBAAgB,IAAI;AAAA,UAC9B,MAAM;AAAA,QACP;AAAA,QACA,WAAU;AAAA,QAER,gBAAM,IAAK,CAAE,MAAM,UACpB;AAAA,UAAC;AAAA;AAAA,YAEA,IAAK,KAAK;AAAA,YACV,uBAAwB;AAAA,YAEtB,eAAK;AAAA;AAAA,UAJD;AAAA,QAKP,CACC;AAAA;AAAA,IACH,GAEF;AAAA,KACD;AAEF;",
4
+ "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tFlexBlock,\n\t__experimentalItem as Item,\n\t// @ts-ignore\n\t__experimentalHStack as HStack,\n\tIcon as WCIcon,\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '@wordpress/components';\nimport { chevronDownSmall } from '@wordpress/icons';\nimport { useReducedMotion } from '@wordpress/compose';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { STORE_NAME } from '../../../store';\nimport NavigationItem from '../navigation-item';\nimport { wrapIcon } from '../items';\nimport type { IconType, MenuItem } from '../../../store/types';\nimport './style.scss';\n\nconst ANIMATION_DURATION = 0.2;\n\ninterface DropdownItemProps {\n\t/**\n\t * Optional CSS class name.\n\t */\n\tclassName?: string;\n\t/**\n\t * Identifier of the parent menu item.\n\t */\n\tid: string;\n\t/**\n\t * Icon to display with the dropdown item.\n\t */\n\ticon?: IconType;\n\t/**\n\t * Whether to show placeholder icons for alignment.\n\t */\n\tshouldShowPlaceholder?: boolean;\n\t/**\n\t * Content to display inside the dropdown item.\n\t */\n\tchildren: ReactNode;\n\t/**\n\t * Whether this dropdown is currently expanded.\n\t */\n\tisExpanded: boolean;\n\t/**\n\t * Function to toggle this dropdown's expanded state.\n\t */\n\tonToggle: () => void;\n}\n\nexport default function DropdownItem( {\n\tclassName,\n\tid,\n\ticon,\n\tchildren,\n\tisExpanded,\n\tonToggle,\n}: DropdownItemProps ) {\n\tconst menuItems: MenuItem[] = useSelect(\n\t\t( select ) =>\n\t\t\t// @ts-ignore\n\t\t\tselect( STORE_NAME ).getMenuItems(),\n\t\t[]\n\t);\n\tconst items = menuItems.filter( ( item ) => item.parent === id );\n\tconst disableMotion = useReducedMotion();\n\treturn (\n\t\t<div className=\"boot-dropdown-item\">\n\t\t\t<Item\n\t\t\t\tclassName={ clsx( 'boot-navigation-item', className ) }\n\t\t\t\tonClick={ ( e ) => {\n\t\t\t\t\te.preventDefault();\n\t\t\t\t\te.stopPropagation();\n\t\t\t\t\tonToggle();\n\t\t\t\t} }\n\t\t\t\tonMouseDown={ ( e ) => e.preventDefault() }\n\t\t\t>\n\t\t\t\t<HStack\n\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\tspacing={ 2 }\n\t\t\t\t\tstyle={ { flexGrow: '1' } }\n\t\t\t\t>\n\t\t\t\t\t{ wrapIcon( icon, false ) }\n\t\t\t\t\t<FlexBlock>{ children }</FlexBlock>\n\t\t\t\t\t<WCIcon\n\t\t\t\t\t\ticon={ chevronDownSmall }\n\t\t\t\t\t\tclassName={ clsx( 'boot-dropdown-item__chevron', {\n\t\t\t\t\t\t\t'is-up': isExpanded,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t/>\n\t\t\t\t</HStack>\n\t\t\t</Item>\n\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t{ isExpanded && (\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tinitial={ { height: 0 } }\n\t\t\t\t\t\tanimate={ { height: 'auto' } }\n\t\t\t\t\t\texit={ { height: 0 } }\n\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\tduration: disableMotion ? 0 : ANIMATION_DURATION,\n\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tclassName=\"boot-dropdown-item__children\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ items.map( ( item, index ) => (\n\t\t\t\t\t\t\t<NavigationItem\n\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\tto={ item.to }\n\t\t\t\t\t\t\t\tshouldShowPlaceholder={ false }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ item.label }\n\t\t\t\t\t\t\t</NavigationItem>\n\t\t\t\t\t\t) ) }\n\t\t\t\t\t</motion.div>\n\t\t\t\t) }\n\t\t\t</AnimatePresence>\n\t\t</div>\n\t);\n}\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='608eff82f3']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"608eff82f3\");\n\tstyle.appendChild(document.createTextNode(\".boot-dropdown-item__children{display:flex;flex-direction:column;margin-block-end:2px;margin-block-start:-2px;margin-inline-start:30px;overflow:hidden;padding:2px}.boot-dropdown-item__chevron.is-up{transform:rotate(180deg)}\"));\n\tdocument.head.appendChild(style);\n}\n"],
5
+ "mappings": ";AAGA,OAAO,UAAU;AAMjB;AAAA,EACC;AAAA,EACA,sBAAsB;AAAA,EAEtB,wBAAwB;AAAA,EACxB,QAAQ;AAAA,EACR,oBAAoB;AAAA,EACpB,6BAA6B;AAAA,OACvB;AACP,SAAS,wBAAwB;AACjC,SAAS,wBAAwB;AACjC,SAAS,iBAAiB;AAK1B,SAAS,kBAAkB;AAC3B,OAAO,oBAAoB;AAC3B,SAAS,gBAAgB;;;AC3BzB,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,iOAAiO,CAAC;AAC5Q,WAAS,KAAK,YAAY,KAAK;AAChC;;;ADsFI,SAMC,KAND;AA5DJ,IAAM,qBAAqB;AAiCZ,SAAR,aAA+B;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAuB;AACtB,QAAM,YAAwB;AAAA,IAC7B,CAAE;AAAA;AAAA,MAED,OAAQ,UAAW,EAAE,aAAa;AAAA;AAAA,IACnC,CAAC;AAAA,EACF;AACA,QAAM,QAAQ,UAAU,OAAQ,CAAE,SAAU,KAAK,WAAW,EAAG;AAC/D,QAAM,gBAAgB,iBAAiB;AACvC,SACC,qBAAC,SAAI,WAAU,sBACd;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,WAAY,KAAM,wBAAwB,SAAU;AAAA,QACpD,SAAU,CAAE,MAAO;AAClB,YAAE,eAAe;AACjB,YAAE,gBAAgB;AAClB,mBAAS;AAAA,QACV;AAAA,QACA,aAAc,CAAE,MAAO,EAAE,eAAe;AAAA,QAExC;AAAA,UAAC;AAAA;AAAA,YACA,SAAQ;AAAA,YACR,SAAU;AAAA,YACV,OAAQ,EAAE,UAAU,IAAI;AAAA,YAEtB;AAAA,uBAAU,MAAM,KAAM;AAAA,cACxB,oBAAC,aAAY,UAAU;AAAA,cACvB;AAAA,gBAAC;AAAA;AAAA,kBACA,MAAO;AAAA,kBACP,WAAY,KAAM,+BAA+B;AAAA,oBAChD,SAAS;AAAA,kBACV,CAAE;AAAA;AAAA,cACH;AAAA;AAAA;AAAA,QACD;AAAA;AAAA,IACD;AAAA,IACA,oBAAC,mBAAgB,SAAU,OACxB,wBACD;AAAA,MAAC,OAAO;AAAA,MAAP;AAAA,QACA,SAAU,EAAE,QAAQ,EAAE;AAAA,QACtB,SAAU,EAAE,QAAQ,OAAO;AAAA,QAC3B,MAAO,EAAE,QAAQ,EAAE;AAAA,QACnB,YAAa;AAAA,UACZ,MAAM;AAAA,UACN,UAAU,gBAAgB,IAAI;AAAA,UAC9B,MAAM;AAAA,QACP;AAAA,QACA,WAAU;AAAA,QAER,gBAAM,IAAK,CAAE,MAAM,UACpB;AAAA,UAAC;AAAA;AAAA,YAEA,IAAK,KAAK;AAAA,YACV,uBAAwB;AAAA,YAEtB,eAAK;AAAA;AAAA,UAJD;AAAA,QAKP,CACC;AAAA;AAAA,IACH,GAEF;AAAA,KACD;AAEF;",
6
6
  "names": []
7
7
  }
package/build-module/components/navigation/items.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  // packages/boot/src/components/navigation/items.tsx
2
2
  import { isValidElement } from "@wordpress/element";
3
- import { Dashicon, Icon } from "@wordpress/components";
3
+ import { Dashicon, Icon as WCIcon } from "@wordpress/components";
4
4
  import { SVG } from "@wordpress/primitives";
5
5
  import { jsx } from "react/jsx-runtime";
6
6
  function isSvg(element) {
@@ -8,7 +8,7 @@ function isSvg(element) {
8
8
  }
9
9
  function wrapIcon(icon, shouldShowPlaceholder = true) {
10
10
  if (isSvg(icon)) {
11
- return /* @__PURE__ */ jsx(Icon, { icon });
11
+ return /* @__PURE__ */ jsx(WCIcon, { icon });
12
12
  }
13
13
  if (typeof icon === "string" && icon.startsWith("dashicons-")) {
14
14
  const iconKey = icon.replace(
package/build-module/components/navigation/items.mjs.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/components/navigation/items.tsx"],
4
- "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { isValidElement } from '@wordpress/element';\nimport { Dashicon, Icon } from '@wordpress/components';\nimport { SVG } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport type { IconType } from '../../store/types';\n\n/**\n * Type guard for verifying whether a given element\n * is a valid SVG element for the Icon component.\n *\n * @param element - The element to check\n */\nfunction isSvg( element: unknown ): element is React.JSX.Element {\n\treturn (\n\t\tisValidElement( element ) &&\n\t\t( element.type === SVG || element.type === 'svg' )\n\t);\n}\n\n/**\n * Converts the given IconType into a renderable component:\n * - Dashicon string into a Dashicon component\n * - JSX SVG element into an Icon component\n * - Data URL into an img element\n *\n * @param icon - The icon to convert\n * @param shouldShowPlaceholder - Whether to show placeholder when no icon is provided\n * @return The converted icon as a JSX element\n */\nexport function wrapIcon(\n\ticon?: IconType,\n\tshouldShowPlaceholder: boolean = true\n) {\n\tif ( isSvg( icon ) ) {\n\t\treturn <Icon icon={ icon } />;\n\t}\n\n\tif ( typeof icon === 'string' && icon.startsWith( 'dashicons-' ) ) {\n\t\tconst iconKey = icon.replace(\n\t\t\t/^dashicons-/,\n\t\t\t''\n\t\t) as React.ComponentProps< typeof Dashicon >[ 'icon' ];\n\n\t\treturn (\n\t\t\t<Dashicon\n\t\t\t\tstyle={ { padding: '2px' } }\n\t\t\t\ticon={ iconKey }\n\t\t\t\taria-hidden=\"true\"\n\t\t\t/>\n\t\t);\n\t}\n\n\t// Handle data URLs (SVG images)\n\tif ( typeof icon === 'string' && icon.startsWith( 'data:' ) ) {\n\t\treturn (\n\t\t\t<img\n\t\t\t\tsrc={ icon }\n\t\t\t\talt=\"\"\n\t\t\t\taria-hidden=\"true\"\n\t\t\t\tstyle={ {\n\t\t\t\t\twidth: '20px',\n\t\t\t\t\theight: '20px',\n\t\t\t\t\tdisplay: 'block',\n\t\t\t\t\tpadding: '2px',\n\t\t\t\t} }\n\t\t\t/>\n\t\t);\n\t}\n\n\t// If icon is provided and valid, return it as-is\n\tif ( icon ) {\n\t\treturn icon;\n\t}\n\n\t// Return empty 24px placeholder for alignment when no icon is provided\n\t// Only if shouldShowPlaceholder is true\n\tif ( shouldShowPlaceholder ) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tstyle={ { width: '24px', height: '24px' } }\n\t\t\t\taria-hidden=\"true\"\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn null;\n}\n"],
5
- "mappings": ";AAGA,SAAS,sBAAsB;AAC/B,SAAS,UAAU,YAAY;AAC/B,SAAS,WAAW;AAmCX;AAtBT,SAAS,MAAO,SAAiD;AAChE,SACC,eAAgB,OAAQ,MACtB,QAAQ,SAAS,OAAO,QAAQ,SAAS;AAE7C;AAYO,SAAS,SACf,MACA,wBAAiC,MAChC;AACD,MAAK,MAAO,IAAK,GAAI;AACpB,WAAO,oBAAC,QAAK,MAAc;AAAA,EAC5B;AAEA,MAAK,OAAO,SAAS,YAAY,KAAK,WAAY,YAAa,GAAI;AAClE,UAAM,UAAU,KAAK;AAAA,MACpB;AAAA,MACA;AAAA,IACD;AAEA,WACC;AAAA,MAAC;AAAA;AAAA,QACA,OAAQ,EAAE,SAAS,MAAM;AAAA,QACzB,MAAO;AAAA,QACP,eAAY;AAAA;AAAA,IACb;AAAA,EAEF;AAGA,MAAK,OAAO,SAAS,YAAY,KAAK,WAAY,OAAQ,GAAI;AAC7D,WACC;AAAA,MAAC;AAAA;AAAA,QACA,KAAM;AAAA,QACN,KAAI;AAAA,QACJ,eAAY;AAAA,QACZ,OAAQ;AAAA,UACP,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,SAAS;AAAA,UACT,SAAS;AAAA,QACV;AAAA;AAAA,IACD;AAAA,EAEF;AAGA,MAAK,MAAO;AACX,WAAO;AAAA,EACR;AAIA,MAAK,uBAAwB;AAC5B,WACC;AAAA,MAAC;AAAA;AAAA,QACA,OAAQ,EAAE,OAAO,QAAQ,QAAQ,OAAO;AAAA,QACxC,eAAY;AAAA;AAAA,IACb;AAAA,EAEF;AAEA,SAAO;AACR;",
4
+ "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { isValidElement } from '@wordpress/element';\nimport { Dashicon, Icon as WCIcon } from '@wordpress/components';\nimport { SVG } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport type { IconType } from '../../store/types';\n\n/**\n * Type guard for verifying whether a given element\n * is a valid SVG element for the Icon component.\n *\n * @param element - The element to check\n */\nfunction isSvg( element: unknown ): element is React.JSX.Element {\n\treturn (\n\t\tisValidElement( element ) &&\n\t\t( element.type === SVG || element.type === 'svg' )\n\t);\n}\n\n/**\n * Converts the given IconType into a renderable component:\n * - Dashicon string into a Dashicon component\n * - JSX SVG element into an Icon component\n * - Data URL into an img element\n *\n * @param icon - The icon to convert\n * @param shouldShowPlaceholder - Whether to show placeholder when no icon is provided\n * @return The converted icon as a JSX element\n */\nexport function wrapIcon(\n\ticon?: IconType,\n\tshouldShowPlaceholder: boolean = true\n) {\n\tif ( isSvg( icon ) ) {\n\t\treturn <WCIcon icon={ icon } />;\n\t}\n\n\tif ( typeof icon === 'string' && icon.startsWith( 'dashicons-' ) ) {\n\t\tconst iconKey = icon.replace(\n\t\t\t/^dashicons-/,\n\t\t\t''\n\t\t) as React.ComponentProps< typeof Dashicon >[ 'icon' ];\n\n\t\treturn (\n\t\t\t<Dashicon\n\t\t\t\tstyle={ { padding: '2px' } }\n\t\t\t\ticon={ iconKey }\n\t\t\t\taria-hidden=\"true\"\n\t\t\t/>\n\t\t);\n\t}\n\n\t// Handle data URLs (SVG images)\n\tif ( typeof icon === 'string' && icon.startsWith( 'data:' ) ) {\n\t\treturn (\n\t\t\t<img\n\t\t\t\tsrc={ icon }\n\t\t\t\talt=\"\"\n\t\t\t\taria-hidden=\"true\"\n\t\t\t\tstyle={ {\n\t\t\t\t\twidth: '20px',\n\t\t\t\t\theight: '20px',\n\t\t\t\t\tdisplay: 'block',\n\t\t\t\t\tpadding: '2px',\n\t\t\t\t} }\n\t\t\t/>\n\t\t);\n\t}\n\n\t// If icon is provided and valid, return it as-is\n\tif ( icon ) {\n\t\treturn icon;\n\t}\n\n\t// Return empty 24px placeholder for alignment when no icon is provided\n\t// Only if shouldShowPlaceholder is true\n\tif ( shouldShowPlaceholder ) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tstyle={ { width: '24px', height: '24px' } }\n\t\t\t\taria-hidden=\"true\"\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn null;\n}\n"],
5
+ "mappings": ";AAGA,SAAS,sBAAsB;AAC/B,SAAS,UAAU,QAAQ,cAAc;AACzC,SAAS,WAAW;AAmCX;AAtBT,SAAS,MAAO,SAAiD;AAChE,SACC,eAAgB,OAAQ,MACtB,QAAQ,SAAS,OAAO,QAAQ,SAAS;AAE7C;AAYO,SAAS,SACf,MACA,wBAAiC,MAChC;AACD,MAAK,MAAO,IAAK,GAAI;AACpB,WAAO,oBAAC,UAAO,MAAc;AAAA,EAC9B;AAEA,MAAK,OAAO,SAAS,YAAY,KAAK,WAAY,YAAa,GAAI;AAClE,UAAM,UAAU,KAAK;AAAA,MACpB;AAAA,MACA;AAAA,IACD;AAEA,WACC;AAAA,MAAC;AAAA;AAAA,QACA,OAAQ,EAAE,SAAS,MAAM;AAAA,QACzB,MAAO;AAAA,QACP,eAAY;AAAA;AAAA,IACb;AAAA,EAEF;AAGA,MAAK,OAAO,SAAS,YAAY,KAAK,WAAY,OAAQ,GAAI;AAC7D,WACC;AAAA,MAAC;AAAA;AAAA,QACA,KAAM;AAAA,QACN,KAAI;AAAA,QACJ,eAAY;AAAA,QACZ,OAAQ;AAAA,UACP,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,SAAS;AAAA,UACT,SAAS;AAAA,QACV;AAAA;AAAA,IACD;AAAA,EAEF;AAGA,MAAK,MAAO;AACX,WAAO;AAAA,EACR;AAIA,MAAK,uBAAwB;AAC5B,WACC;AAAA,MAAC;AAAA;AAAA,QACA,OAAQ,EAAE,OAAO,QAAQ,QAAQ,OAAO;AAAA,QACxC,eAAY;AAAA;AAAA,IACb;AAAA,EAEF;AAEA,SAAO;AACR;",
6
6
  "names": []
7
7
  }
package/build-module/components/save-button/index.mjs CHANGED
@@ -6,7 +6,7 @@ import { store as coreStore } from "@wordpress/core-data";
6
6
  import { displayShortcut, rawShortcut } from "@wordpress/keycodes";
7
7
  import { check } from "@wordpress/icons";
8
8
  import { EntitiesSavedStates } from "@wordpress/editor";
9
- import { Button, Modal, Tooltip } from "@wordpress/components";
9
+ import { Button, Modal, Tooltip as WCTooltip } from "@wordpress/components";
10
10
 
11
11
  // packages/boot/src/components/save-button/style.scss
12
12
  if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='294e36b777']")) {
@@ -72,7 +72,7 @@ function SaveButton() {
72
72
  const label = getLabel();
73
73
  return /* @__PURE__ */ jsxs(Fragment, { children: [
74
74
  /* @__PURE__ */ jsx(
75
- Tooltip,
75
+ WCTooltip,
76
76
  {
77
77
  text: hasChanges ? label : void 0,
78
78
  shortcut: displayShortcut.primary("s"),
package/build-module/components/save-button/index.mjs.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/components/save-button/index.tsx", "../../../src/components/save-button/style.scss"],
4
- "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useEffect, useState } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport { _n, __, sprintf } from '@wordpress/i18n';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { displayShortcut, rawShortcut } from '@wordpress/keycodes';\nimport { check } from '@wordpress/icons';\nimport { EntitiesSavedStates } from '@wordpress/editor';\nimport { Button, Modal, Tooltip } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport './style.scss';\nimport useSaveShortcut from '../save-panel/use-save-shortcut';\n\nexport default function SaveButton() {\n\tconst [ isSaveViewOpen, setIsSaveViewOpened ] = useState( false );\n\tconst { isSaving, dirtyEntityRecordsCount } = useSelect( ( select ) => {\n\t\tconst { isSavingEntityRecord, __experimentalGetDirtyEntityRecords } =\n\t\t\tselect( coreStore );\n\t\tconst dirtyEntityRecords = __experimentalGetDirtyEntityRecords();\n\t\treturn {\n\t\t\tisSaving: dirtyEntityRecords.some( ( record ) =>\n\t\t\t\tisSavingEntityRecord( record.kind, record.name, record.key )\n\t\t\t),\n\t\t\tdirtyEntityRecordsCount: dirtyEntityRecords.length,\n\t\t};\n\t}, [] );\n\tconst [ showSavedState, setShowSavedState ] = useState( false );\n\n\tuseEffect( () => {\n\t\tif ( isSaving ) {\n\t\t\t// Proactively expect to show saved state. This is done once save\n\t\t\t// starts to avoid race condition where setting it after would cause\n\t\t\t// the button to be unmounted before state is updated.\n\t\t\tsetShowSavedState( true );\n\t\t}\n\t}, [ isSaving ] );\n\n\tconst hasChanges = dirtyEntityRecordsCount > 0;\n\n\t// Handle save failure case: If we were showing saved state but saving\n\t// failed, reset to show changes again.\n\tuseEffect( () => {\n\t\tif ( ! isSaving && hasChanges ) {\n\t\t\tsetShowSavedState( false );\n\t\t}\n\t}, [ isSaving, hasChanges ] );\n\n\tfunction hideSavedState() {\n\t\tif ( showSavedState ) {\n\t\t\tsetShowSavedState( false );\n\t\t}\n\t}\n\n\tconst shouldShowButton = hasChanges || showSavedState;\n\n\tuseSaveShortcut( { openSavePanel: () => setIsSaveViewOpened( true ) } );\n\n\tif ( ! shouldShowButton ) {\n\t\treturn null;\n\t}\n\n\tconst isInSavedState = showSavedState && ! hasChanges;\n\tconst disabled = isSaving || isInSavedState;\n\n\tconst getLabel = () => {\n\t\tif ( isInSavedState ) {\n\t\t\treturn __( 'Saved' );\n\t\t}\n\t\treturn sprintf(\n\t\t\t// translators: %d: number of unsaved changes (number).\n\t\t\t_n(\n\t\t\t\t'Review %d change\u2026',\n\t\t\t\t'Review %d changes\u2026',\n\t\t\t\tdirtyEntityRecordsCount\n\t\t\t),\n\t\t\tdirtyEntityRecordsCount\n\t\t);\n\t};\n\tconst label = getLabel();\n\n\treturn (\n\t\t<>\n\t\t\t<Tooltip\n\t\t\t\ttext={ hasChanges ? label : undefined }\n\t\t\t\tshortcut={ displayShortcut.primary( 's' ) }\n\t\t\t>\n\t\t\t\t<Button\n\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\tonClick={ () => setIsSaveViewOpened( true ) }\n\t\t\t\t\tonBlur={ hideSavedState }\n\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\tisBusy={ isSaving }\n\t\t\t\t\taria-keyshortcuts={ rawShortcut.primary( 's' ) }\n\t\t\t\t\tclassName=\"boot-save-button\"\n\t\t\t\t\ticon={ isInSavedState ? check : undefined }\n\t\t\t\t>\n\t\t\t\t\t{ label }\n\t\t\t\t</Button>\n\t\t\t</Tooltip>\n\t\t\t{ isSaveViewOpen && (\n\t\t\t\t<Modal\n\t\t\t\t\ttitle={ __( 'Review changes' ) }\n\t\t\t\t\tonRequestClose={ () => setIsSaveViewOpened( false ) }\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t>\n\t\t\t\t\t<EntitiesSavedStates\n\t\t\t\t\t\tclose={ () => setIsSaveViewOpened( false ) }\n\t\t\t\t\t\tvariant=\"inline\"\n\t\t\t\t\t/>\n\t\t\t\t</Modal>\n\t\t\t) }\n\t\t</>\n\t);\n}\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='294e36b777']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"294e36b777\");\n\tstyle.appendChild(document.createTextNode(\".boot-save-button{width:100%}\"));\n\tdocument.head.appendChild(style);\n}\n"],
5
- "mappings": ";AAGA,SAAS,WAAW,gBAAgB;AACpC,SAAS,iBAAiB;AAC1B,SAAS,IAAI,IAAI,eAAe;AAChC,SAAS,SAAS,iBAAiB;AACnC,SAAS,iBAAiB,mBAAmB;AAC7C,SAAS,aAAa;AACtB,SAAS,2BAA2B;AACpC,SAAS,QAAQ,OAAO,eAAe;;;ACVvC,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,+BAA+B,CAAC;AAC1E,WAAS,KAAK,YAAY,KAAK;AAChC;;;ADWA,OAAO,qBAAqB;AAsE1B,mBAKE,KALF;AApEa,SAAR,aAA8B;AACpC,QAAM,CAAE,gBAAgB,mBAAoB,IAAI,SAAU,KAAM;AAChE,QAAM,EAAE,UAAU,wBAAwB,IAAI,UAAW,CAAE,WAAY;AACtE,UAAM,EAAE,sBAAsB,oCAAoC,IACjE,OAAQ,SAAU;AACnB,UAAM,qBAAqB,oCAAoC;AAC/D,WAAO;AAAA,MACN,UAAU,mBAAmB;AAAA,QAAM,CAAE,WACpC,qBAAsB,OAAO,MAAM,OAAO,MAAM,OAAO,GAAI;AAAA,MAC5D;AAAA,MACA,yBAAyB,mBAAmB;AAAA,IAC7C;AAAA,EACD,GAAG,CAAC,CAAE;AACN,QAAM,CAAE,gBAAgB,iBAAkB,IAAI,SAAU,KAAM;AAE9D,YAAW,MAAM;AAChB,QAAK,UAAW;AAIf,wBAAmB,IAAK;AAAA,IACzB;AAAA,EACD,GAAG,CAAE,QAAS,CAAE;AAEhB,QAAM,aAAa,0BAA0B;AAI7C,YAAW,MAAM;AAChB,QAAK,CAAE,YAAY,YAAa;AAC/B,wBAAmB,KAAM;AAAA,IAC1B;AAAA,EACD,GAAG,CAAE,UAAU,UAAW,CAAE;AAE5B,WAAS,iBAAiB;AACzB,QAAK,gBAAiB;AACrB,wBAAmB,KAAM;AAAA,IAC1B;AAAA,EACD;AAEA,QAAM,mBAAmB,cAAc;AAEvC,kBAAiB,EAAE,eAAe,MAAM,oBAAqB,IAAK,EAAE,CAAE;AAEtE,MAAK,CAAE,kBAAmB;AACzB,WAAO;AAAA,EACR;AAEA,QAAM,iBAAiB,kBAAkB,CAAE;AAC3C,QAAM,WAAW,YAAY;AAE7B,QAAM,WAAW,MAAM;AACtB,QAAK,gBAAiB;AACrB,aAAO,GAAI,OAAQ;AAAA,IACpB;AACA,WAAO;AAAA;AAAA,MAEN;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,MACD;AAAA,MACA;AAAA,IACD;AAAA,EACD;AACA,QAAM,QAAQ,SAAS;AAEvB,SACC,iCACC;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,MAAO,aAAa,QAAQ;AAAA,QAC5B,UAAW,gBAAgB,QAAS,GAAI;AAAA,QAExC;AAAA,UAAC;AAAA;AAAA,YACA,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,SAAU,MAAM,oBAAqB,IAAK;AAAA,YAC1C,QAAS;AAAA,YACT;AAAA,YACA,wBAAsB;AAAA,YACtB,QAAS;AAAA,YACT,qBAAoB,YAAY,QAAS,GAAI;AAAA,YAC7C,WAAU;AAAA,YACV,MAAO,iBAAiB,QAAQ;AAAA,YAE9B;AAAA;AAAA,QACH;AAAA;AAAA,IACD;AAAA,IACE,kBACD;AAAA,MAAC;AAAA;AAAA,QACA,OAAQ,GAAI,gBAAiB;AAAA,QAC7B,gBAAiB,MAAM,oBAAqB,KAAM;AAAA,QAClD,MAAK;AAAA,QAEL;AAAA,UAAC;AAAA;AAAA,YACA,OAAQ,MAAM,oBAAqB,KAAM;AAAA,YACzC,SAAQ;AAAA;AAAA,QACT;AAAA;AAAA,IACD;AAAA,KAEF;AAEF;",
4
+ "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useEffect, useState } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport { _n, __, sprintf } from '@wordpress/i18n';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { displayShortcut, rawShortcut } from '@wordpress/keycodes';\nimport { check } from '@wordpress/icons';\nimport { EntitiesSavedStates } from '@wordpress/editor';\nimport { Button, Modal, Tooltip as WCTooltip } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport './style.scss';\nimport useSaveShortcut from '../save-panel/use-save-shortcut';\n\nexport default function SaveButton() {\n\tconst [ isSaveViewOpen, setIsSaveViewOpened ] = useState( false );\n\tconst { isSaving, dirtyEntityRecordsCount } = useSelect( ( select ) => {\n\t\tconst { isSavingEntityRecord, __experimentalGetDirtyEntityRecords } =\n\t\t\tselect( coreStore );\n\t\tconst dirtyEntityRecords = __experimentalGetDirtyEntityRecords();\n\t\treturn {\n\t\t\tisSaving: dirtyEntityRecords.some( ( record ) =>\n\t\t\t\tisSavingEntityRecord( record.kind, record.name, record.key )\n\t\t\t),\n\t\t\tdirtyEntityRecordsCount: dirtyEntityRecords.length,\n\t\t};\n\t}, [] );\n\tconst [ showSavedState, setShowSavedState ] = useState( false );\n\n\tuseEffect( () => {\n\t\tif ( isSaving ) {\n\t\t\t// Proactively expect to show saved state. This is done once save\n\t\t\t// starts to avoid race condition where setting it after would cause\n\t\t\t// the button to be unmounted before state is updated.\n\t\t\tsetShowSavedState( true );\n\t\t}\n\t}, [ isSaving ] );\n\n\tconst hasChanges = dirtyEntityRecordsCount > 0;\n\n\t// Handle save failure case: If we were showing saved state but saving\n\t// failed, reset to show changes again.\n\tuseEffect( () => {\n\t\tif ( ! isSaving && hasChanges ) {\n\t\t\tsetShowSavedState( false );\n\t\t}\n\t}, [ isSaving, hasChanges ] );\n\n\tfunction hideSavedState() {\n\t\tif ( showSavedState ) {\n\t\t\tsetShowSavedState( false );\n\t\t}\n\t}\n\n\tconst shouldShowButton = hasChanges || showSavedState;\n\n\tuseSaveShortcut( { openSavePanel: () => setIsSaveViewOpened( true ) } );\n\n\tif ( ! shouldShowButton ) {\n\t\treturn null;\n\t}\n\n\tconst isInSavedState = showSavedState && ! hasChanges;\n\tconst disabled = isSaving || isInSavedState;\n\n\tconst getLabel = () => {\n\t\tif ( isInSavedState ) {\n\t\t\treturn __( 'Saved' );\n\t\t}\n\t\treturn sprintf(\n\t\t\t// translators: %d: number of unsaved changes (number).\n\t\t\t_n(\n\t\t\t\t'Review %d change\u2026',\n\t\t\t\t'Review %d changes\u2026',\n\t\t\t\tdirtyEntityRecordsCount\n\t\t\t),\n\t\t\tdirtyEntityRecordsCount\n\t\t);\n\t};\n\tconst label = getLabel();\n\n\treturn (\n\t\t<>\n\t\t\t<WCTooltip\n\t\t\t\ttext={ hasChanges ? label : undefined }\n\t\t\t\tshortcut={ displayShortcut.primary( 's' ) }\n\t\t\t>\n\t\t\t\t<Button\n\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\tonClick={ () => setIsSaveViewOpened( true ) }\n\t\t\t\t\tonBlur={ hideSavedState }\n\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\tisBusy={ isSaving }\n\t\t\t\t\taria-keyshortcuts={ rawShortcut.primary( 's' ) }\n\t\t\t\t\tclassName=\"boot-save-button\"\n\t\t\t\t\ticon={ isInSavedState ? check : undefined }\n\t\t\t\t>\n\t\t\t\t\t{ label }\n\t\t\t\t</Button>\n\t\t\t</WCTooltip>\n\t\t\t{ isSaveViewOpen && (\n\t\t\t\t<Modal\n\t\t\t\t\ttitle={ __( 'Review changes' ) }\n\t\t\t\t\tonRequestClose={ () => setIsSaveViewOpened( false ) }\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t>\n\t\t\t\t\t<EntitiesSavedStates\n\t\t\t\t\t\tclose={ () => setIsSaveViewOpened( false ) }\n\t\t\t\t\t\tvariant=\"inline\"\n\t\t\t\t\t/>\n\t\t\t\t</Modal>\n\t\t\t) }\n\t\t</>\n\t);\n}\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='294e36b777']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"294e36b777\");\n\tstyle.appendChild(document.createTextNode(\".boot-save-button{width:100%}\"));\n\tdocument.head.appendChild(style);\n}\n"],
5
+ "mappings": ";AAGA,SAAS,WAAW,gBAAgB;AACpC,SAAS,iBAAiB;AAC1B,SAAS,IAAI,IAAI,eAAe;AAChC,SAAS,SAAS,iBAAiB;AACnC,SAAS,iBAAiB,mBAAmB;AAC7C,SAAS,aAAa;AACtB,SAAS,2BAA2B;AACpC,SAAS,QAAQ,OAAO,WAAW,iBAAiB;;;ACVpD,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,+BAA+B,CAAC;AAC1E,WAAS,KAAK,YAAY,KAAK;AAChC;;;ADWA,OAAO,qBAAqB;AAsE1B,mBAKE,KALF;AApEa,SAAR,aAA8B;AACpC,QAAM,CAAE,gBAAgB,mBAAoB,IAAI,SAAU,KAAM;AAChE,QAAM,EAAE,UAAU,wBAAwB,IAAI,UAAW,CAAE,WAAY;AACtE,UAAM,EAAE,sBAAsB,oCAAoC,IACjE,OAAQ,SAAU;AACnB,UAAM,qBAAqB,oCAAoC;AAC/D,WAAO;AAAA,MACN,UAAU,mBAAmB;AAAA,QAAM,CAAE,WACpC,qBAAsB,OAAO,MAAM,OAAO,MAAM,OAAO,GAAI;AAAA,MAC5D;AAAA,MACA,yBAAyB,mBAAmB;AAAA,IAC7C;AAAA,EACD,GAAG,CAAC,CAAE;AACN,QAAM,CAAE,gBAAgB,iBAAkB,IAAI,SAAU,KAAM;AAE9D,YAAW,MAAM;AAChB,QAAK,UAAW;AAIf,wBAAmB,IAAK;AAAA,IACzB;AAAA,EACD,GAAG,CAAE,QAAS,CAAE;AAEhB,QAAM,aAAa,0BAA0B;AAI7C,YAAW,MAAM;AAChB,QAAK,CAAE,YAAY,YAAa;AAC/B,wBAAmB,KAAM;AAAA,IAC1B;AAAA,EACD,GAAG,CAAE,UAAU,UAAW,CAAE;AAE5B,WAAS,iBAAiB;AACzB,QAAK,gBAAiB;AACrB,wBAAmB,KAAM;AAAA,IAC1B;AAAA,EACD;AAEA,QAAM,mBAAmB,cAAc;AAEvC,kBAAiB,EAAE,eAAe,MAAM,oBAAqB,IAAK,EAAE,CAAE;AAEtE,MAAK,CAAE,kBAAmB;AACzB,WAAO;AAAA,EACR;AAEA,QAAM,iBAAiB,kBAAkB,CAAE;AAC3C,QAAM,WAAW,YAAY;AAE7B,QAAM,WAAW,MAAM;AACtB,QAAK,gBAAiB;AACrB,aAAO,GAAI,OAAQ;AAAA,IACpB;AACA,WAAO;AAAA;AAAA,MAEN;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,MACD;AAAA,MACA;AAAA,IACD;AAAA,EACD;AACA,QAAM,QAAQ,SAAS;AAEvB,SACC,iCACC;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,MAAO,aAAa,QAAQ;AAAA,QAC5B,UAAW,gBAAgB,QAAS,GAAI;AAAA,QAExC;AAAA,UAAC;AAAA;AAAA,YACA,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,SAAU,MAAM,oBAAqB,IAAK;AAAA,YAC1C,QAAS;AAAA,YACT;AAAA,YACA,wBAAsB;AAAA,YACtB,QAAS;AAAA,YACT,qBAAoB,YAAY,QAAS,GAAI;AAAA,YAC7C,WAAU;AAAA,YACV,MAAO,iBAAiB,QAAQ;AAAA,YAE9B;AAAA;AAAA,QACH;AAAA;AAAA,IACD;AAAA,IACE,kBACD;AAAA,MAAC;AAAA;AAAA,QACA,OAAQ,GAAI,gBAAiB;AAAA,QAC7B,gBAAiB,MAAM,oBAAqB,KAAM;AAAA,QAClD,MAAK;AAAA,QAEL;AAAA,UAAC;AAAA;AAAA,YACA,OAAQ,MAAM,oBAAqB,KAAM;AAAA,YACzC,SAAQ;AAAA;AAAA,QACT;AAAA;AAAA,IACD;AAAA,KAEF;AAEF;",
6
6
  "names": []
7
7
  }
package/build-module/components/sidebar/index.mjs CHANGED
@@ -1,21 +1,44 @@
1
1
  // packages/boot/src/components/sidebar/index.tsx
2
+ import { Button } from "@wordpress/components";
3
+ import { useSelect } from "@wordpress/data";
4
+ import { __, isRTL } from "@wordpress/i18n";
5
+ import { chevronLeft, chevronRight } from "@wordpress/icons";
2
6
  import SiteHub from "../site-hub/index.mjs";
3
7
  import Navigation from "../navigation/index.mjs";
4
8
  import SaveButton from "../save-button/index.mjs";
9
+ import { store as bootStore } from "../../store/index.mjs";
5
10
 
6
11
  // packages/boot/src/components/sidebar/style.scss
7
- if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='6064f6f183']")) {
12
+ if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='1f27eae1b9']")) {
8
13
  const style = document.createElement("style");
9
- style.setAttribute("data-wp-hash", "6064f6f183");
10
- style.appendChild(document.createTextNode(".boot-sidebar__scrollable{display:flex;flex-direction:column;height:100%;overflow:auto;position:relative}.boot-sidebar__content{contain:content;flex-grow:1;position:relative}.boot-sidebar__footer{padding:16px 8px 8px 16px}"));
14
+ style.setAttribute("data-wp-hash", "1f27eae1b9");
15
+ style.appendChild(document.createTextNode(".boot-sidebar__scrollable{display:flex;flex-direction:column;height:100%;overflow:auto;position:relative}.boot-sidebar__content{contain:content;flex-grow:1;position:relative}.boot-sidebar__footer{padding:16px 8px 8px 16px}.boot-sidebar__back-button{margin:8px 12px}"));
11
16
  document.head.appendChild(style);
12
17
  }
13
18
 
14
19
  // packages/boot/src/components/sidebar/index.tsx
15
20
  import { jsx, jsxs } from "react/jsx-runtime";
21
+ function DashboardBackButton() {
22
+ const dashboardLink = useSelect(
23
+ (select) => select(bootStore).getDashboardLink(),
24
+ []
25
+ );
26
+ return /* @__PURE__ */ jsx(
27
+ Button,
28
+ {
29
+ __next40pxDefaultSize: true,
30
+ className: "boot-sidebar__back-button",
31
+ href: dashboardLink || "/",
32
+ icon: isRTL() ? chevronRight : chevronLeft,
33
+ label: __("Go to the Dashboard"),
34
+ children: __("Dashboard")
35
+ }
36
+ );
37
+ }
16
38
  function Sidebar() {
39
+ const hasAdminBarInEditor = window.__experimentalAdminBarInEditor;
17
40
  return /* @__PURE__ */ jsxs("div", { className: "boot-sidebar__scrollable", children: [
18
- /* @__PURE__ */ jsx(SiteHub, {}),
41
+ hasAdminBarInEditor ? /* @__PURE__ */ jsx(DashboardBackButton, {}) : /* @__PURE__ */ jsx(SiteHub, {}),
19
42
  /* @__PURE__ */ jsx("div", { className: "boot-sidebar__content", children: /* @__PURE__ */ jsx(Navigation, {}) }),
20
43
  /* @__PURE__ */ jsx("div", { className: "boot-sidebar__footer", children: /* @__PURE__ */ jsx(SaveButton, {}) })
21
44
  ] });
package/build-module/components/sidebar/index.mjs.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/components/sidebar/index.tsx", "../../../src/components/sidebar/style.scss"],
4
- "sourcesContent": ["/**\n * Internal dependencies\n */\nimport SiteHub from '../site-hub';\nimport Navigation from '../navigation';\nimport SaveButton from '../save-button';\nimport './style.scss';\n\nexport default function Sidebar() {\n\treturn (\n\t\t<div className=\"boot-sidebar__scrollable\">\n\t\t\t<SiteHub />\n\t\t\t<div className=\"boot-sidebar__content\">\n\t\t\t\t<Navigation />\n\t\t\t</div>\n\t\t\t<div className=\"boot-sidebar__footer\">\n\t\t\t\t<SaveButton />\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='6064f6f183']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"6064f6f183\");\n\tstyle.appendChild(document.createTextNode(\".boot-sidebar__scrollable{display:flex;flex-direction:column;height:100%;overflow:auto;position:relative}.boot-sidebar__content{contain:content;flex-grow:1;position:relative}.boot-sidebar__footer{padding:16px 8px 8px 16px}\"));\n\tdocument.head.appendChild(style);\n}\n"],
5
- "mappings": ";AAGA,OAAO,aAAa;AACpB,OAAO,gBAAgB;AACvB,OAAO,gBAAgB;;;ACLvB,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,gOAAgO,CAAC;AAC3Q,WAAS,KAAK,YAAY,KAAK;AAChC;;;ADKE,SACC,KADD;AAFa,SAAR,UAA2B;AACjC,SACC,qBAAC,SAAI,WAAU,4BACd;AAAA,wBAAC,WAAQ;AAAA,IACT,oBAAC,SAAI,WAAU,yBACd,8BAAC,cAAW,GACb;AAAA,IACA,oBAAC,SAAI,WAAU,wBACd,8BAAC,cAAW,GACb;AAAA,KACD;AAEF;",
4
+ "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { Button } from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\nimport { __, isRTL } from '@wordpress/i18n';\nimport { chevronLeft, chevronRight } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport SiteHub from '../site-hub';\nimport Navigation from '../navigation';\nimport SaveButton from '../save-button';\nimport { store as bootStore } from '../../store';\nimport './style.scss';\n\ndeclare global {\n\tinterface Window {\n\t\t__experimentalAdminBarInEditor?: boolean;\n\t}\n}\n\nfunction DashboardBackButton() {\n\tconst dashboardLink = useSelect(\n\t\t( select ) => select( bootStore ).getDashboardLink(),\n\t\t[]\n\t);\n\treturn (\n\t\t<Button\n\t\t\t__next40pxDefaultSize\n\t\t\tclassName=\"boot-sidebar__back-button\"\n\t\t\thref={ dashboardLink || '/' }\n\t\t\ticon={ isRTL() ? chevronRight : chevronLeft }\n\t\t\tlabel={ __( 'Go to the Dashboard' ) }\n\t\t>\n\t\t\t{ __( 'Dashboard' ) }\n\t\t</Button>\n\t);\n}\n\nexport default function Sidebar() {\n\tconst hasAdminBarInEditor = window.__experimentalAdminBarInEditor;\n\treturn (\n\t\t<div className=\"boot-sidebar__scrollable\">\n\t\t\t{ hasAdminBarInEditor ? <DashboardBackButton /> : <SiteHub /> }\n\t\t\t<div className=\"boot-sidebar__content\">\n\t\t\t\t<Navigation />\n\t\t\t</div>\n\t\t\t<div className=\"boot-sidebar__footer\">\n\t\t\t\t<SaveButton />\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='1f27eae1b9']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"1f27eae1b9\");\n\tstyle.appendChild(document.createTextNode(\".boot-sidebar__scrollable{display:flex;flex-direction:column;height:100%;overflow:auto;position:relative}.boot-sidebar__content{contain:content;flex-grow:1;position:relative}.boot-sidebar__footer{padding:16px 8px 8px 16px}.boot-sidebar__back-button{margin:8px 12px}\"));\n\tdocument.head.appendChild(style);\n}\n"],
5
+ "mappings": ";AAGA,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,SAAS,IAAI,aAAa;AAC1B,SAAS,aAAa,oBAAoB;AAK1C,OAAO,aAAa;AACpB,OAAO,gBAAgB;AACvB,OAAO,gBAAgB;AACvB,SAAS,SAAS,iBAAiB;;;ACdnC,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,2QAA2Q,CAAC;AACtT,WAAS,KAAK,YAAY,KAAK;AAChC;;;ADwBE,cAeA,YAfA;AANF,SAAS,sBAAsB;AAC9B,QAAM,gBAAgB;AAAA,IACrB,CAAE,WAAY,OAAQ,SAAU,EAAE,iBAAiB;AAAA,IACnD,CAAC;AAAA,EACF;AACA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,uBAAqB;AAAA,MACrB,WAAU;AAAA,MACV,MAAO,iBAAiB;AAAA,MACxB,MAAO,MAAM,IAAI,eAAe;AAAA,MAChC,OAAQ,GAAI,qBAAsB;AAAA,MAEhC,aAAI,WAAY;AAAA;AAAA,EACnB;AAEF;AAEe,SAAR,UAA2B;AACjC,QAAM,sBAAsB,OAAO;AACnC,SACC,qBAAC,SAAI,WAAU,4BACZ;AAAA,0BAAsB,oBAAC,uBAAoB,IAAK,oBAAC,WAAQ;AAAA,IAC3D,oBAAC,SAAI,WAAU,yBACd,8BAAC,cAAW,GACb;AAAA,IACA,oBAAC,SAAI,WAAU,wBACd,8BAAC,cAAW,GACb;AAAA,KACD;AAEF;",
6
6
  "names": []
7
7
  }
package/build-module/components/site-icon-link/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  // packages/boot/src/components/site-icon-link/index.tsx
2
2
  import { Link, privateApis as routePrivateApis } from "@wordpress/route";
3
- import { Tooltip } from "@wordpress/components";
3
+ import { Tooltip as WCTooltip } from "@wordpress/components";
4
4
  import { unlock } from "../../lock-unlock.mjs";
5
5
  import SiteIcon from "../site-icon/index.mjs";
6
6
 
@@ -22,7 +22,7 @@ function SiteIconLink({
22
22
  }) {
23
23
  const router = useRouter();
24
24
  const canGoBack = useCanGoBack();
25
- return /* @__PURE__ */ jsx(Tooltip, { text: props["aria-label"], placement: "right", children: /* @__PURE__ */ jsx(
25
+ return /* @__PURE__ */ jsx(WCTooltip, { text: props["aria-label"], placement: "right", children: /* @__PURE__ */ jsx(
26
26
  Link,
27
27
  {
28
28
  to,
package/build-module/components/site-icon-link/index.mjs.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/components/site-icon-link/index.tsx", "../../../src/components/site-icon-link/style.scss"],
4
- "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { Link, privateApis as routePrivateApis } from '@wordpress/route';\nimport { Tooltip } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport SiteIcon from '../site-icon';\nimport './style.scss';\n\nconst { useCanGoBack, useRouter } = unlock( routePrivateApis );\n\nfunction SiteIconLink( {\n\tto,\n\tisBackButton,\n\t...props\n}: {\n\tto: string;\n\t'aria-label': string;\n\tisBackButton?: boolean;\n} ) {\n\tconst router = useRouter();\n\tconst canGoBack = useCanGoBack();\n\n\treturn (\n\t\t<Tooltip text={ props[ 'aria-label' ] } placement=\"right\">\n\t\t\t<Link\n\t\t\t\tto={ to }\n\t\t\t\taria-label={ props[ 'aria-label' ] }\n\t\t\t\tclassName=\"boot-site-icon-link\"\n\t\t\t\tonClick={ ( event ) => {\n\t\t\t\t\t// If possible, restore the previous page with\n\t\t\t\t\t// filters etc.\n\t\t\t\t\tif ( canGoBack && isBackButton ) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\trouter.history.back();\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<SiteIcon />\n\t\t\t</Link>\n\t\t</Tooltip>\n\t);\n}\n\nexport default SiteIconLink;\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='5aacc86eea']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"5aacc86eea\");\n\tstyle.appendChild(document.createTextNode(\".boot-site-icon-link{align-items:center;background:var(--wpds-color-bg-surface-neutral-weak,#f4f4f4);display:inline-flex;height:64px;justify-content:center;text-decoration:none;width:64px}@media not (prefers-reduced-motion){.boot-site-icon-link{transition:outline .1s ease-out}}.boot-site-icon-link:focus:not(:active){outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));outline-offset:calc(var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px))*-1)}\"));\n\tdocument.head.appendChild(style);\n}\n"],
5
- "mappings": ";AAGA,SAAS,MAAM,eAAe,wBAAwB;AACtD,SAAS,eAAe;AAKxB,SAAS,cAAc;AACvB,OAAO,cAAc;;;ACVrB,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,6jBAA6jB,CAAC;AACxmB,WAAS,KAAK,YAAY,KAAK;AAChC;;;ADqCI;AA7BJ,IAAM,EAAE,cAAc,UAAU,IAAI,OAAQ,gBAAiB;AAE7D,SAAS,aAAc;AAAA,EACtB;AAAA,EACA;AAAA,EACA,GAAG;AACJ,GAII;AACH,QAAM,SAAS,UAAU;AACzB,QAAM,YAAY,aAAa;AAE/B,SACC,oBAAC,WAAQ,MAAO,MAAO,YAAa,GAAI,WAAU,SACjD;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA,cAAa,MAAO,YAAa;AAAA,MACjC,WAAU;AAAA,MACV,SAAU,CAAE,UAAW;AAGtB,YAAK,aAAa,cAAe;AAChC,gBAAM,eAAe;AACrB,iBAAO,QAAQ,KAAK;AAAA,QACrB;AAAA,MACD;AAAA,MAEA,8BAAC,YAAS;AAAA;AAAA,EACX,GACD;AAEF;AAEA,IAAO,yBAAQ;",
4
+ "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { Link, privateApis as routePrivateApis } from '@wordpress/route';\nimport { Tooltip as WCTooltip } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport SiteIcon from '../site-icon';\nimport './style.scss';\n\nconst { useCanGoBack, useRouter } = unlock( routePrivateApis );\n\nfunction SiteIconLink( {\n\tto,\n\tisBackButton,\n\t...props\n}: {\n\tto: string;\n\t'aria-label': string;\n\tisBackButton?: boolean;\n} ) {\n\tconst router = useRouter();\n\tconst canGoBack = useCanGoBack();\n\n\treturn (\n\t\t<WCTooltip text={ props[ 'aria-label' ] } placement=\"right\">\n\t\t\t<Link\n\t\t\t\tto={ to }\n\t\t\t\taria-label={ props[ 'aria-label' ] }\n\t\t\t\tclassName=\"boot-site-icon-link\"\n\t\t\t\tonClick={ ( event ) => {\n\t\t\t\t\t// If possible, restore the previous page with\n\t\t\t\t\t// filters etc.\n\t\t\t\t\tif ( canGoBack && isBackButton ) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\trouter.history.back();\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<SiteIcon />\n\t\t\t</Link>\n\t\t</WCTooltip>\n\t);\n}\n\nexport default SiteIconLink;\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='5aacc86eea']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"5aacc86eea\");\n\tstyle.appendChild(document.createTextNode(\".boot-site-icon-link{align-items:center;background:var(--wpds-color-bg-surface-neutral-weak,#f4f4f4);display:inline-flex;height:64px;justify-content:center;text-decoration:none;width:64px}@media not (prefers-reduced-motion){.boot-site-icon-link{transition:outline .1s ease-out}}.boot-site-icon-link:focus:not(:active){outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus-brand,var(--wp-admin-theme-color,#3858e9));outline-offset:calc(var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px))*-1)}\"));\n\tdocument.head.appendChild(style);\n}\n"],
5
+ "mappings": ";AAGA,SAAS,MAAM,eAAe,wBAAwB;AACtD,SAAS,WAAW,iBAAiB;AAKrC,SAAS,cAAc;AACvB,OAAO,cAAc;;;ACVrB,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,6jBAA6jB,CAAC;AACxmB,WAAS,KAAK,YAAY,KAAK;AAChC;;;ADqCI;AA7BJ,IAAM,EAAE,cAAc,UAAU,IAAI,OAAQ,gBAAiB;AAE7D,SAAS,aAAc;AAAA,EACtB;AAAA,EACA;AAAA,EACA,GAAG;AACJ,GAII;AACH,QAAM,SAAS,UAAU;AACzB,QAAM,YAAY,aAAa;AAE/B,SACC,oBAAC,aAAU,MAAO,MAAO,YAAa,GAAI,WAAU,SACnD;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA,cAAa,MAAO,YAAa;AAAA,MACjC,WAAU;AAAA,MACV,SAAU,CAAE,UAAW;AAGtB,YAAK,aAAa,cAAe;AAChC,gBAAM,eAAe;AACrB,iBAAO,QAAQ,KAAK;AAAA,QACrB;AAAA,MACD;AAAA,MAEA,8BAAC,YAAS;AAAA;AAAA,EACX,GACD;AAEF;AAEA,IAAO,yBAAQ;",
6
6
  "names": []
7
7
  }
package/build-module/index.mjs CHANGED
@@ -1,8 +1,8 @@
1
1
  // packages/boot/src/style.scss
2
- if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='fd7d52554d']")) {
2
+ if (typeof document !== "undefined" && process.env.NODE_ENV !== "test" && !document.head.querySelector("style[data-wp-hash='9947af2e2a']")) {
3
3
  const style = document.createElement("style");
4
- style.setAttribute("data-wp-hash", "fd7d52554d");
5
- style.appendChild(document.createTextNode(':root{--wpds-border-radius-xs:1px;--wpds-border-radius-sm:2px;--wpds-border-radius-md:4px;--wpds-border-radius-lg:8px;--wpds-border-width-xs:1px;--wpds-border-width-sm:2px;--wpds-border-width-md:4px;--wpds-border-width-lg:8px;--wpds-border-width-focus:2px;--wpds-color-bg-surface-neutral:#fcfcfc;--wpds-color-bg-surface-neutral-strong:#fff;--wpds-color-bg-surface-neutral-weak:#f4f4f4;--wpds-color-bg-surface-brand:#ecf0fa;--wpds-color-bg-surface-success:#c6f7cd;--wpds-color-bg-surface-success-weak:#ebffed;--wpds-color-bg-surface-info:#deebfa;--wpds-color-bg-surface-info-weak:#f3f9ff;--wpds-color-bg-surface-warning:#fde6be;--wpds-color-bg-surface-warning-weak:#fff7e1;--wpds-color-bg-surface-caution:#fee995;--wpds-color-bg-surface-caution-weak:#fff9ca;--wpds-color-bg-surface-error:#f6e6e3;--wpds-color-bg-surface-error-weak:#fff6f5;--wpds-color-bg-interactive-neutral-strong:#2d2d2d;--wpds-color-bg-interactive-neutral-strong-active:#1e1e1e;--wpds-color-bg-interactive-neutral-strong-disabled:#e6e6e6;--wpds-color-bg-interactive-neutral-weak:#0000;--wpds-color-bg-interactive-neutral-weak-active:#ededed;--wpds-color-bg-interactive-neutral-weak-disabled:#0000;--wpds-color-bg-interactive-brand-strong:#3858e9;--wpds-color-bg-interactive-brand-strong-active:#2e49d9;--wpds-color-bg-interactive-brand-weak:#0000;--wpds-color-bg-interactive-brand-weak-active:#e6eaf4;--wpds-color-bg-interactive-error:#0000;--wpds-color-bg-interactive-error-active:#fff6f5;--wpds-color-bg-interactive-error-strong:#cc1818;--wpds-color-bg-interactive-error-strong-active:#b90000;--wpds-color-bg-interactive-error-weak:#0000;--wpds-color-bg-interactive-error-weak-active:#f6e6e3;--wpds-color-bg-track-neutral-weak:#e4e4e4;--wpds-color-bg-track-neutral:#dbdbdb;--wpds-color-bg-thumb-neutral-weak:#8d8d8d;--wpds-color-bg-thumb-neutral-weak-active:#6e6e6e;--wpds-color-bg-thumb-brand:#3858e9;--wpds-color-bg-thumb-brand-active:#3858e9;--wpds-color-bg-thumb-neutral-disabled:#dbdbdb;--wpds-color-fg-content-neutral:#1e1e1e;--wpds-color-fg-content-neutral-weak:#707070;--wpds-color-fg-content-success:#002900;--wpds-color-fg-content-success-weak:#008030;--wpds-color-fg-content-info:#001b4f;--wpds-color-fg-content-info-weak:#006bd7;--wpds-color-fg-content-warning:#2e1900;--wpds-color-fg-content-warning-weak:#926300;--wpds-color-fg-content-caution:#281d00;--wpds-color-fg-content-caution-weak:#826a00;--wpds-color-fg-content-error:#470000;--wpds-color-fg-content-error-weak:#cc1818;--wpds-color-fg-interactive-neutral:#1e1e1e;--wpds-color-fg-interactive-neutral-active:#1e1e1e;--wpds-color-fg-interactive-neutral-disabled:#8d8d8d;--wpds-color-fg-interactive-neutral-strong:#f0f0f0;--wpds-color-fg-interactive-neutral-strong-active:#f0f0f0;--wpds-color-fg-interactive-neutral-strong-disabled:#8d8d8d;--wpds-color-fg-interactive-neutral-weak:#707070;--wpds-color-fg-interactive-neutral-weak-disabled:#8d8d8d;--wpds-color-fg-interactive-brand:#3858e9;--wpds-color-fg-interactive-brand-active:#3858e9;--wpds-color-fg-interactive-brand-strong:#eff0f2;--wpds-color-fg-interactive-brand-strong-active:#eff0f2;--wpds-color-fg-interactive-error:#cc1818;--wpds-color-fg-interactive-error-active:#cc1818;--wpds-color-fg-interactive-error-strong:#f2efef;--wpds-color-fg-interactive-error-strong-active:#f2efef;--wpds-color-stroke-surface-neutral:#dbdbdb;--wpds-color-stroke-surface-neutral-weak:#e4e4e4;--wpds-color-stroke-surface-neutral-strong:#8d8d8d;--wpds-color-stroke-surface-brand:#a3b1d4;--wpds-color-stroke-surface-brand-strong:#3858e9;--wpds-color-stroke-surface-success:#8ac894;--wpds-color-stroke-surface-success-strong:#008030;--wpds-color-stroke-surface-info:#9fbcdc;--wpds-color-stroke-surface-info-strong:#006bd7;--wpds-color-stroke-surface-warning:#d0b481;--wpds-color-stroke-surface-warning-strong:#926300;--wpds-color-stroke-surface-error:#daa39b;--wpds-color-stroke-surface-error-strong:#cc1818;--wpds-color-stroke-interactive-neutral:#8d8d8d;--wpds-color-stroke-interactive-neutral-active:#6e6e6e;--wpds-color-stroke-interactive-neutral-disabled:#dbdbdb;--wpds-color-stroke-interactive-neutral-strong:#6e6e6e;--wpds-color-stroke-interactive-brand:#3858e9;--wpds-color-stroke-interactive-brand-active:#2337c8;--wpds-color-stroke-interactive-error:#cc1818;--wpds-color-stroke-interactive-error-active:#9d0000;--wpds-color-stroke-interactive-error-strong:#cc1818;--wpds-color-stroke-focus-brand:#3858e9;--wpds-cursor-control:pointer;--wpds-dimension-base:4px;--wpds-dimension-padding-xs:4px;--wpds-dimension-padding-sm:8px;--wpds-dimension-padding-md:12px;--wpds-dimension-padding-lg:16px;--wpds-dimension-padding-xl:20px;--wpds-dimension-padding-2xl:24px;--wpds-dimension-padding-3xl:32px;--wpds-dimension-gap-xs:4px;--wpds-dimension-gap-sm:8px;--wpds-dimension-gap-md:12px;--wpds-dimension-gap-lg:16px;--wpds-dimension-gap-xl:24px;--wpds-dimension-gap-2xl:32px;--wpds-dimension-gap-3xl:40px;--wpds-dimension-surface-width-xs:240px;--wpds-dimension-surface-width-sm:320px;--wpds-dimension-surface-width-md:400px;--wpds-dimension-surface-width-lg:560px;--wpds-dimension-surface-width-xl:720px;--wpds-dimension-surface-width-2xl:960px;--wpds-elevation-xs:0 1px 1px 0 #00000008,0 1px 2px 0 #00000005,0 3px 3px 0 #00000005,0 4px 4px 0 #00000003;--wpds-elevation-sm:0 1px 2px 0 #0000000d,0 2px 3px 0 #0000000a,0 6px 6px 0 #00000008,0 8px 8px 0 #00000005;--wpds-elevation-md:0 2px 3px 0 #0000000d,0 4px 5px 0 #0000000a,0 12px 12px 0 #00000008,0 16px 16px 0 #00000005;--wpds-elevation-lg:0 5px 15px 0 #00000014,0 15px 27px 0 #00000012,0 30px 36px 0 #0000000a,0 50px 43px 0 #00000005;--wpds-motion-duration-xs:50ms;--wpds-motion-duration-sm:100ms;--wpds-motion-duration-md:200ms;--wpds-motion-duration-lg:300ms;--wpds-motion-duration-xl:400ms;--wpds-motion-easing-subtle:cubic-bezier(0.15,0,0.15,1);--wpds-motion-easing-balanced:cubic-bezier(0.4,0,0.2,1);--wpds-motion-easing-expressive:cubic-bezier(0.25,0,0,1);--wpds-typography-font-family-heading:-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif;--wpds-typography-font-family-body:-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif;--wpds-typography-font-family-mono:"Menlo","Consolas",monaco,monospace;--wpds-typography-font-size-xs:11px;--wpds-typography-font-size-sm:12px;--wpds-typography-font-size-md:13px;--wpds-typography-font-size-lg:15px;--wpds-typography-font-size-xl:20px;--wpds-typography-font-size-2xl:32px;--wpds-typography-line-height-xs:16px;--wpds-typography-line-height-sm:20px;--wpds-typography-line-height-md:24px;--wpds-typography-line-height-lg:28px;--wpds-typography-line-height-xl:32px;--wpds-typography-line-height-2xl:40px;--wpds-typography-font-weight-regular:400;--wpds-typography-font-weight-medium:499}[data-wpds-theme-provider-id][data-wpds-density=compact]{--wpds-dimension-padding-xs:4px;--wpds-dimension-padding-sm:4px;--wpds-dimension-padding-md:8px;--wpds-dimension-padding-lg:12px;--wpds-dimension-padding-xl:16px;--wpds-dimension-padding-2xl:20px;--wpds-dimension-padding-3xl:24px;--wpds-dimension-gap-xs:4px;--wpds-dimension-gap-sm:4px;--wpds-dimension-gap-md:8px;--wpds-dimension-gap-lg:12px;--wpds-dimension-gap-xl:20px;--wpds-dimension-gap-2xl:24px;--wpds-dimension-gap-3xl:32px}[data-wpds-theme-provider-id][data-wpds-density=comfortable]{--wpds-dimension-padding-xs:8px;--wpds-dimension-padding-sm:12px;--wpds-dimension-padding-md:16px;--wpds-dimension-padding-lg:20px;--wpds-dimension-padding-xl:24px;--wpds-dimension-padding-2xl:32px;--wpds-dimension-padding-3xl:40px;--wpds-dimension-gap-xs:8px;--wpds-dimension-gap-sm:12px;--wpds-dimension-gap-md:16px;--wpds-dimension-gap-lg:20px;--wpds-dimension-gap-xl:32px;--wpds-dimension-gap-2xl:40px;--wpds-dimension-gap-3xl:48px}[data-wpds-theme-provider-id][data-wpds-density=default]{--wpds-dimension-base:4px;--wpds-dimension-padding-xs:4px;--wpds-dimension-padding-sm:8px;--wpds-dimension-padding-md:12px;--wpds-dimension-padding-lg:16px;--wpds-dimension-padding-xl:20px;--wpds-dimension-padding-2xl:24px;--wpds-dimension-padding-3xl:32px;--wpds-dimension-gap-xs:4px;--wpds-dimension-gap-sm:8px;--wpds-dimension-gap-md:12px;--wpds-dimension-gap-lg:16px;--wpds-dimension-gap-xl:24px;--wpds-dimension-gap-2xl:32px;--wpds-dimension-gap-3xl:40px;--wpds-dimension-surface-width-xs:240px;--wpds-dimension-surface-width-sm:320px;--wpds-dimension-surface-width-md:400px;--wpds-dimension-surface-width-lg:560px;--wpds-dimension-surface-width-xl:720px;--wpds-dimension-surface-width-2xl:960px}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){:root{--wpds-border-width-focus:1.5px}}@media (min-width:600px){.boot-layout-container .boot-layout{bottom:0;left:0;min-height:calc(100vh - 46px);position:absolute;right:0;top:0}}@media (min-width:782px){.boot-layout-container .boot-layout{min-height:calc(100vh - 32px)}body:has(.boot-layout.has-full-canvas) .boot-layout-container .boot-layout{min-height:100vh}}.boot-layout-container .boot-layout img{height:auto;max-width:100%}.boot-layout .boot-notices__snackbar{bottom:24px;box-sizing:border-box;display:flex;flex-direction:column;left:0;padding-inline:16px;pointer-events:none;position:fixed;right:0}.boot-layout .boot-notices__snackbar .components-snackbar{margin-inline:auto}'));
4
+ style.setAttribute("data-wp-hash", "9947af2e2a");
5
+ style.appendChild(document.createTextNode(':root{--wpds-border-radius-xs:1px;--wpds-border-radius-sm:2px;--wpds-border-radius-md:4px;--wpds-border-radius-lg:8px;--wpds-border-width-xs:1px;--wpds-border-width-sm:2px;--wpds-border-width-md:4px;--wpds-border-width-lg:8px;--wpds-border-width-focus:2px;--wpds-color-bg-surface-neutral:#fcfcfc;--wpds-color-bg-surface-neutral-strong:#fff;--wpds-color-bg-surface-neutral-weak:#f4f4f4;--wpds-color-bg-surface-brand:#ecf0fa;--wpds-color-bg-surface-success:#c6f7cd;--wpds-color-bg-surface-success-weak:#ebffed;--wpds-color-bg-surface-info:#deebfa;--wpds-color-bg-surface-info-weak:#f3f9ff;--wpds-color-bg-surface-warning:#fde6be;--wpds-color-bg-surface-warning-weak:#fff7e1;--wpds-color-bg-surface-caution:#fee995;--wpds-color-bg-surface-caution-weak:#fff9ca;--wpds-color-bg-surface-error:#f6e6e3;--wpds-color-bg-surface-error-weak:#fff6f5;--wpds-color-bg-interactive-neutral-strong:#2d2d2d;--wpds-color-bg-interactive-neutral-strong-active:#1e1e1e;--wpds-color-bg-interactive-neutral-strong-disabled:#e6e6e6;--wpds-color-bg-interactive-neutral-weak:#0000;--wpds-color-bg-interactive-neutral-weak-active:#ededed;--wpds-color-bg-interactive-neutral-weak-disabled:#0000;--wpds-color-bg-interactive-brand-strong:#3858e9;--wpds-color-bg-interactive-brand-strong-active:#2e49d9;--wpds-color-bg-interactive-brand-weak:#0000;--wpds-color-bg-interactive-brand-weak-active:#e6eaf4;--wpds-color-bg-interactive-error:#0000;--wpds-color-bg-interactive-error-active:#fff6f5;--wpds-color-bg-interactive-error-strong:#cc1818;--wpds-color-bg-interactive-error-strong-active:#b90000;--wpds-color-bg-interactive-error-weak:#0000;--wpds-color-bg-interactive-error-weak-active:#f6e6e3;--wpds-color-bg-track-neutral-weak:#e4e4e4;--wpds-color-bg-track-neutral:#dbdbdb;--wpds-color-bg-thumb-neutral-weak:#8d8d8d;--wpds-color-bg-thumb-neutral-weak-active:#6e6e6e;--wpds-color-bg-thumb-brand:#3858e9;--wpds-color-bg-thumb-brand-active:#3858e9;--wpds-color-bg-thumb-neutral-disabled:#dbdbdb;--wpds-color-fg-content-neutral:#1e1e1e;--wpds-color-fg-content-neutral-weak:#707070;--wpds-color-fg-content-success:#002900;--wpds-color-fg-content-success-weak:#008030;--wpds-color-fg-content-info:#001b4f;--wpds-color-fg-content-info-weak:#006bd7;--wpds-color-fg-content-warning:#2e1900;--wpds-color-fg-content-warning-weak:#926300;--wpds-color-fg-content-caution:#281d00;--wpds-color-fg-content-caution-weak:#826a00;--wpds-color-fg-content-error:#470000;--wpds-color-fg-content-error-weak:#cc1818;--wpds-color-fg-interactive-neutral:#1e1e1e;--wpds-color-fg-interactive-neutral-active:#1e1e1e;--wpds-color-fg-interactive-neutral-disabled:#8d8d8d;--wpds-color-fg-interactive-neutral-strong:#f0f0f0;--wpds-color-fg-interactive-neutral-strong-active:#f0f0f0;--wpds-color-fg-interactive-neutral-strong-disabled:#8d8d8d;--wpds-color-fg-interactive-neutral-weak:#707070;--wpds-color-fg-interactive-neutral-weak-disabled:#8d8d8d;--wpds-color-fg-interactive-brand:#3858e9;--wpds-color-fg-interactive-brand-active:#3858e9;--wpds-color-fg-interactive-brand-strong:#eff0f2;--wpds-color-fg-interactive-brand-strong-active:#eff0f2;--wpds-color-fg-interactive-error:#cc1818;--wpds-color-fg-interactive-error-active:#cc1818;--wpds-color-fg-interactive-error-strong:#f2efef;--wpds-color-fg-interactive-error-strong-active:#f2efef;--wpds-color-stroke-surface-neutral:#dbdbdb;--wpds-color-stroke-surface-neutral-weak:#e4e4e4;--wpds-color-stroke-surface-neutral-strong:#8d8d8d;--wpds-color-stroke-surface-brand:#a3b1d4;--wpds-color-stroke-surface-brand-strong:#3858e9;--wpds-color-stroke-surface-success:#8ac894;--wpds-color-stroke-surface-success-strong:#008030;--wpds-color-stroke-surface-info:#9fbcdc;--wpds-color-stroke-surface-info-strong:#006bd7;--wpds-color-stroke-surface-warning:#d0b481;--wpds-color-stroke-surface-warning-strong:#926300;--wpds-color-stroke-surface-error:#daa39b;--wpds-color-stroke-surface-error-strong:#cc1818;--wpds-color-stroke-interactive-neutral:#8d8d8d;--wpds-color-stroke-interactive-neutral-active:#6e6e6e;--wpds-color-stroke-interactive-neutral-disabled:#dbdbdb;--wpds-color-stroke-interactive-neutral-strong:#6e6e6e;--wpds-color-stroke-interactive-brand:#3858e9;--wpds-color-stroke-interactive-brand-active:#2337c8;--wpds-color-stroke-interactive-error:#cc1818;--wpds-color-stroke-interactive-error-active:#9d0000;--wpds-color-stroke-interactive-error-strong:#cc1818;--wpds-color-stroke-focus-brand:#3858e9;--wpds-cursor-control:pointer;--wpds-dimension-base:4px;--wpds-dimension-padding-xs:4px;--wpds-dimension-padding-sm:8px;--wpds-dimension-padding-md:12px;--wpds-dimension-padding-lg:16px;--wpds-dimension-padding-xl:20px;--wpds-dimension-padding-2xl:24px;--wpds-dimension-padding-3xl:32px;--wpds-dimension-gap-xs:4px;--wpds-dimension-gap-sm:8px;--wpds-dimension-gap-md:12px;--wpds-dimension-gap-lg:16px;--wpds-dimension-gap-xl:24px;--wpds-dimension-gap-2xl:32px;--wpds-dimension-gap-3xl:40px;--wpds-dimension-surface-width-xs:240px;--wpds-dimension-surface-width-sm:320px;--wpds-dimension-surface-width-md:400px;--wpds-dimension-surface-width-lg:560px;--wpds-dimension-surface-width-xl:720px;--wpds-dimension-surface-width-2xl:960px;--wpds-elevation-xs:0 1px 1px 0 #00000008,0 1px 2px 0 #00000005,0 3px 3px 0 #00000005,0 4px 4px 0 #00000003;--wpds-elevation-sm:0 1px 2px 0 #0000000d,0 2px 3px 0 #0000000a,0 6px 6px 0 #00000008,0 8px 8px 0 #00000005;--wpds-elevation-md:0 2px 3px 0 #0000000d,0 4px 5px 0 #0000000a,0 12px 12px 0 #00000008,0 16px 16px 0 #00000005;--wpds-elevation-lg:0 5px 15px 0 #00000014,0 15px 27px 0 #00000012,0 30px 36px 0 #0000000a,0 50px 43px 0 #00000005;--wpds-motion-duration-xs:50ms;--wpds-motion-duration-sm:100ms;--wpds-motion-duration-md:200ms;--wpds-motion-duration-lg:300ms;--wpds-motion-duration-xl:400ms;--wpds-motion-easing-subtle:cubic-bezier(0.15,0,0.15,1);--wpds-motion-easing-balanced:cubic-bezier(0.4,0,0.2,1);--wpds-motion-easing-expressive:cubic-bezier(0.25,0,0,1);--wpds-typography-font-family-heading:-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif;--wpds-typography-font-family-body:-apple-system,system-ui,"Segoe UI","Roboto","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif;--wpds-typography-font-family-mono:"Menlo","Consolas",monaco,monospace;--wpds-typography-font-size-xs:11px;--wpds-typography-font-size-sm:12px;--wpds-typography-font-size-md:13px;--wpds-typography-font-size-lg:15px;--wpds-typography-font-size-xl:20px;--wpds-typography-font-size-2xl:32px;--wpds-typography-line-height-xs:16px;--wpds-typography-line-height-sm:20px;--wpds-typography-line-height-md:24px;--wpds-typography-line-height-lg:28px;--wpds-typography-line-height-xl:32px;--wpds-typography-line-height-2xl:40px;--wpds-typography-font-weight-regular:400;--wpds-typography-font-weight-medium:499}[data-wpds-theme-provider-id][data-wpds-density=compact]{--wpds-dimension-padding-xs:4px;--wpds-dimension-padding-sm:4px;--wpds-dimension-padding-md:8px;--wpds-dimension-padding-lg:12px;--wpds-dimension-padding-xl:16px;--wpds-dimension-padding-2xl:20px;--wpds-dimension-padding-3xl:24px;--wpds-dimension-gap-xs:4px;--wpds-dimension-gap-sm:4px;--wpds-dimension-gap-md:8px;--wpds-dimension-gap-lg:12px;--wpds-dimension-gap-xl:20px;--wpds-dimension-gap-2xl:24px;--wpds-dimension-gap-3xl:32px}[data-wpds-theme-provider-id][data-wpds-density=comfortable]{--wpds-dimension-padding-xs:8px;--wpds-dimension-padding-sm:12px;--wpds-dimension-padding-md:16px;--wpds-dimension-padding-lg:20px;--wpds-dimension-padding-xl:24px;--wpds-dimension-padding-2xl:32px;--wpds-dimension-padding-3xl:40px;--wpds-dimension-gap-xs:8px;--wpds-dimension-gap-sm:12px;--wpds-dimension-gap-md:16px;--wpds-dimension-gap-lg:20px;--wpds-dimension-gap-xl:32px;--wpds-dimension-gap-2xl:40px;--wpds-dimension-gap-3xl:48px}[data-wpds-theme-provider-id][data-wpds-density=default]{--wpds-dimension-base:4px;--wpds-dimension-padding-xs:4px;--wpds-dimension-padding-sm:8px;--wpds-dimension-padding-md:12px;--wpds-dimension-padding-lg:16px;--wpds-dimension-padding-xl:20px;--wpds-dimension-padding-2xl:24px;--wpds-dimension-padding-3xl:32px;--wpds-dimension-gap-xs:4px;--wpds-dimension-gap-sm:8px;--wpds-dimension-gap-md:12px;--wpds-dimension-gap-lg:16px;--wpds-dimension-gap-xl:24px;--wpds-dimension-gap-2xl:32px;--wpds-dimension-gap-3xl:40px;--wpds-dimension-surface-width-xs:240px;--wpds-dimension-surface-width-sm:320px;--wpds-dimension-surface-width-md:400px;--wpds-dimension-surface-width-lg:560px;--wpds-dimension-surface-width-xl:720px;--wpds-dimension-surface-width-2xl:960px}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){:root{--wpds-border-width-focus:1.5px}}body.has-admin-bar-in-editor #wpadminbar{display:block}body.has-admin-bar-in-editor .boot-canvas-back-button__link{background:#0000}body.has-admin-bar-in-editor .boot-canvas-back-button__icon{background-color:initial}body.has-admin-bar-in-editor #site-editor-v2-app{bottom:0;height:calc(100vh - 32px)!important;left:0;position:fixed;right:0;top:32px}body.has-admin-bar-in-editor .boot-layout.has-full-canvas .boot-layout__canvas{height:calc(100vh - 32px);top:32px}@media (max-width:782px){body.has-admin-bar-in-editor #site-editor-v2-app{height:calc(100vh - 46px)!important;top:46px}body.has-admin-bar-in-editor .boot-layout.has-full-canvas .boot-layout__canvas,body.has-admin-bar-in-editor .boot-layout__canvas:not(.has-mobile-drawer),body.has-admin-bar-in-editor .boot-layout__inspector,body.has-admin-bar-in-editor .boot-layout__stage{height:calc(100vh - 46px);top:46px}body.has-admin-bar-in-editor .boot-layout__mobile-sidebar-drawer{top:46px}}@media (min-width:600px){.boot-layout-container .boot-layout{bottom:0;left:0;min-height:calc(100vh - 46px);position:absolute;right:0;top:0}}@media (min-width:782px){.boot-layout-container .boot-layout{min-height:calc(100vh - 32px)}body:has(.boot-layout.has-full-canvas) .boot-layout-container .boot-layout{min-height:100vh}}.boot-layout-container .boot-layout img{height:auto;max-width:100%}.boot-layout .boot-notices__snackbar{bottom:24px;box-sizing:border-box;display:flex;flex-direction:column;left:0;padding-inline:16px;pointer-events:none;position:fixed;right:0}.boot-layout .boot-notices__snackbar .components-snackbar{margin-inline:auto}'));
6
6
  document.head.appendChild(style);
7
7
  }
8
8
 
package/build-module/index.mjs.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../src/style.scss", "../src/view-transitions.scss", "../src/index.tsx"],
4
- "sourcesContent": ["if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='fd7d52554d']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"fd7d52554d\");\n\tstyle.appendChild(document.createTextNode(\":root{--wpds-border-radius-xs:1px;--wpds-border-radius-sm:2px;--wpds-border-radius-md:4px;--wpds-border-radius-lg:8px;--wpds-border-width-xs:1px;--wpds-border-width-sm:2px;--wpds-border-width-md:4px;--wpds-border-width-lg:8px;--wpds-border-width-focus:2px;--wpds-color-bg-surface-neutral:#fcfcfc;--wpds-color-bg-surface-neutral-strong:#fff;--wpds-color-bg-surface-neutral-weak:#f4f4f4;--wpds-color-bg-surface-brand:#ecf0fa;--wpds-color-bg-surface-success:#c6f7cd;--wpds-color-bg-surface-success-weak:#ebffed;--wpds-color-bg-surface-info:#deebfa;--wpds-color-bg-surface-info-weak:#f3f9ff;--wpds-color-bg-surface-warning:#fde6be;--wpds-color-bg-surface-warning-weak:#fff7e1;--wpds-color-bg-surface-caution:#fee995;--wpds-color-bg-surface-caution-weak:#fff9ca;--wpds-color-bg-surface-error:#f6e6e3;--wpds-color-bg-surface-error-weak:#fff6f5;--wpds-color-bg-interactive-neutral-strong:#2d2d2d;--wpds-color-bg-interactive-neutral-strong-active:#1e1e1e;--wpds-color-bg-interactive-neutral-strong-disabled:#e6e6e6;--wpds-color-bg-interactive-neutral-weak:#0000;--wpds-color-bg-interactive-neutral-weak-active:#ededed;--wpds-color-bg-interactive-neutral-weak-disabled:#0000;--wpds-color-bg-interactive-brand-strong:#3858e9;--wpds-color-bg-interactive-brand-strong-active:#2e49d9;--wpds-color-bg-interactive-brand-weak:#0000;--wpds-color-bg-interactive-brand-weak-active:#e6eaf4;--wpds-color-bg-interactive-error:#0000;--wpds-color-bg-interactive-error-active:#fff6f5;--wpds-color-bg-interactive-error-strong:#cc1818;--wpds-color-bg-interactive-error-strong-active:#b90000;--wpds-color-bg-interactive-error-weak:#0000;--wpds-color-bg-interactive-error-weak-active:#f6e6e3;--wpds-color-bg-track-neutral-weak:#e4e4e4;--wpds-color-bg-track-neutral:#dbdbdb;--wpds-color-bg-thumb-neutral-weak:#8d8d8d;--wpds-color-bg-thumb-neutral-weak-active:#6e6e6e;--wpds-color-bg-thumb-brand:#3858e9;--wpds-color-bg-thumb-brand-active:#3858e9;--wpds-color-bg-thumb-neutral-disabled:#dbdbdb;--wpds-color-fg-content-neutral:#1e1e1e;--wpds-color-fg-content-neutral-weak:#707070;--wpds-color-fg-content-success:#002900;--wpds-color-fg-content-success-weak:#008030;--wpds-color-fg-content-info:#001b4f;--wpds-color-fg-content-info-weak:#006bd7;--wpds-color-fg-content-warning:#2e1900;--wpds-color-fg-content-warning-weak:#926300;--wpds-color-fg-content-caution:#281d00;--wpds-color-fg-content-caution-weak:#826a00;--wpds-color-fg-content-error:#470000;--wpds-color-fg-content-error-weak:#cc1818;--wpds-color-fg-interactive-neutral:#1e1e1e;--wpds-color-fg-interactive-neutral-active:#1e1e1e;--wpds-color-fg-interactive-neutral-disabled:#8d8d8d;--wpds-color-fg-interactive-neutral-strong:#f0f0f0;--wpds-color-fg-interactive-neutral-strong-active:#f0f0f0;--wpds-color-fg-interactive-neutral-strong-disabled:#8d8d8d;--wpds-color-fg-interactive-neutral-weak:#707070;--wpds-color-fg-interactive-neutral-weak-disabled:#8d8d8d;--wpds-color-fg-interactive-brand:#3858e9;--wpds-color-fg-interactive-brand-active:#3858e9;--wpds-color-fg-interactive-brand-strong:#eff0f2;--wpds-color-fg-interactive-brand-strong-active:#eff0f2;--wpds-color-fg-interactive-error:#cc1818;--wpds-color-fg-interactive-error-active:#cc1818;--wpds-color-fg-interactive-error-strong:#f2efef;--wpds-color-fg-interactive-error-strong-active:#f2efef;--wpds-color-stroke-surface-neutral:#dbdbdb;--wpds-color-stroke-surface-neutral-weak:#e4e4e4;--wpds-color-stroke-surface-neutral-strong:#8d8d8d;--wpds-color-stroke-surface-brand:#a3b1d4;--wpds-color-stroke-surface-brand-strong:#3858e9;--wpds-color-stroke-surface-success:#8ac894;--wpds-color-stroke-surface-success-strong:#008030;--wpds-color-stroke-surface-info:#9fbcdc;--wpds-color-stroke-surface-info-strong:#006bd7;--wpds-color-stroke-surface-warning:#d0b481;--wpds-color-stroke-surface-warning-strong:#926300;--wpds-color-stroke-surface-error:#daa39b;--wpds-color-stroke-surface-error-strong:#cc1818;--wpds-color-stroke-interactive-neutral:#8d8d8d;--wpds-color-stroke-interactive-neutral-active:#6e6e6e;--wpds-color-stroke-interactive-neutral-disabled:#dbdbdb;--wpds-color-stroke-interactive-neutral-strong:#6e6e6e;--wpds-color-stroke-interactive-brand:#3858e9;--wpds-color-stroke-interactive-brand-active:#2337c8;--wpds-color-stroke-interactive-error:#cc1818;--wpds-color-stroke-interactive-error-active:#9d0000;--wpds-color-stroke-interactive-error-strong:#cc1818;--wpds-color-stroke-focus-brand:#3858e9;--wpds-cursor-control:pointer;--wpds-dimension-base:4px;--wpds-dimension-padding-xs:4px;--wpds-dimension-padding-sm:8px;--wpds-dimension-padding-md:12px;--wpds-dimension-padding-lg:16px;--wpds-dimension-padding-xl:20px;--wpds-dimension-padding-2xl:24px;--wpds-dimension-padding-3xl:32px;--wpds-dimension-gap-xs:4px;--wpds-dimension-gap-sm:8px;--wpds-dimension-gap-md:12px;--wpds-dimension-gap-lg:16px;--wpds-dimension-gap-xl:24px;--wpds-dimension-gap-2xl:32px;--wpds-dimension-gap-3xl:40px;--wpds-dimension-surface-width-xs:240px;--wpds-dimension-surface-width-sm:320px;--wpds-dimension-surface-width-md:400px;--wpds-dimension-surface-width-lg:560px;--wpds-dimension-surface-width-xl:720px;--wpds-dimension-surface-width-2xl:960px;--wpds-elevation-xs:0 1px 1px 0 #00000008,0 1px 2px 0 #00000005,0 3px 3px 0 #00000005,0 4px 4px 0 #00000003;--wpds-elevation-sm:0 1px 2px 0 #0000000d,0 2px 3px 0 #0000000a,0 6px 6px 0 #00000008,0 8px 8px 0 #00000005;--wpds-elevation-md:0 2px 3px 0 #0000000d,0 4px 5px 0 #0000000a,0 12px 12px 0 #00000008,0 16px 16px 0 #00000005;--wpds-elevation-lg:0 5px 15px 0 #00000014,0 15px 27px 0 #00000012,0 30px 36px 0 #0000000a,0 50px 43px 0 #00000005;--wpds-motion-duration-xs:50ms;--wpds-motion-duration-sm:100ms;--wpds-motion-duration-md:200ms;--wpds-motion-duration-lg:300ms;--wpds-motion-duration-xl:400ms;--wpds-motion-easing-subtle:cubic-bezier(0.15,0,0.15,1);--wpds-motion-easing-balanced:cubic-bezier(0.4,0,0.2,1);--wpds-motion-easing-expressive:cubic-bezier(0.25,0,0,1);--wpds-typography-font-family-heading:-apple-system,system-ui,\\\"Segoe UI\\\",\\\"Roboto\\\",\\\"Oxygen-Sans\\\",\\\"Ubuntu\\\",\\\"Cantarell\\\",\\\"Helvetica Neue\\\",sans-serif;--wpds-typography-font-family-body:-apple-system,system-ui,\\\"Segoe UI\\\",\\\"Roboto\\\",\\\"Oxygen-Sans\\\",\\\"Ubuntu\\\",\\\"Cantarell\\\",\\\"Helvetica Neue\\\",sans-serif;--wpds-typography-font-family-mono:\\\"Menlo\\\",\\\"Consolas\\\",monaco,monospace;--wpds-typography-font-size-xs:11px;--wpds-typography-font-size-sm:12px;--wpds-typography-font-size-md:13px;--wpds-typography-font-size-lg:15px;--wpds-typography-font-size-xl:20px;--wpds-typography-font-size-2xl:32px;--wpds-typography-line-height-xs:16px;--wpds-typography-line-height-sm:20px;--wpds-typography-line-height-md:24px;--wpds-typography-line-height-lg:28px;--wpds-typography-line-height-xl:32px;--wpds-typography-line-height-2xl:40px;--wpds-typography-font-weight-regular:400;--wpds-typography-font-weight-medium:499}[data-wpds-theme-provider-id][data-wpds-density=compact]{--wpds-dimension-padding-xs:4px;--wpds-dimension-padding-sm:4px;--wpds-dimension-padding-md:8px;--wpds-dimension-padding-lg:12px;--wpds-dimension-padding-xl:16px;--wpds-dimension-padding-2xl:20px;--wpds-dimension-padding-3xl:24px;--wpds-dimension-gap-xs:4px;--wpds-dimension-gap-sm:4px;--wpds-dimension-gap-md:8px;--wpds-dimension-gap-lg:12px;--wpds-dimension-gap-xl:20px;--wpds-dimension-gap-2xl:24px;--wpds-dimension-gap-3xl:32px}[data-wpds-theme-provider-id][data-wpds-density=comfortable]{--wpds-dimension-padding-xs:8px;--wpds-dimension-padding-sm:12px;--wpds-dimension-padding-md:16px;--wpds-dimension-padding-lg:20px;--wpds-dimension-padding-xl:24px;--wpds-dimension-padding-2xl:32px;--wpds-dimension-padding-3xl:40px;--wpds-dimension-gap-xs:8px;--wpds-dimension-gap-sm:12px;--wpds-dimension-gap-md:16px;--wpds-dimension-gap-lg:20px;--wpds-dimension-gap-xl:32px;--wpds-dimension-gap-2xl:40px;--wpds-dimension-gap-3xl:48px}[data-wpds-theme-provider-id][data-wpds-density=default]{--wpds-dimension-base:4px;--wpds-dimension-padding-xs:4px;--wpds-dimension-padding-sm:8px;--wpds-dimension-padding-md:12px;--wpds-dimension-padding-lg:16px;--wpds-dimension-padding-xl:20px;--wpds-dimension-padding-2xl:24px;--wpds-dimension-padding-3xl:32px;--wpds-dimension-gap-xs:4px;--wpds-dimension-gap-sm:8px;--wpds-dimension-gap-md:12px;--wpds-dimension-gap-lg:16px;--wpds-dimension-gap-xl:24px;--wpds-dimension-gap-2xl:32px;--wpds-dimension-gap-3xl:40px;--wpds-dimension-surface-width-xs:240px;--wpds-dimension-surface-width-sm:320px;--wpds-dimension-surface-width-md:400px;--wpds-dimension-surface-width-lg:560px;--wpds-dimension-surface-width-xl:720px;--wpds-dimension-surface-width-2xl:960px}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){:root{--wpds-border-width-focus:1.5px}}@media (min-width:600px){.boot-layout-container .boot-layout{bottom:0;left:0;min-height:calc(100vh - 46px);position:absolute;right:0;top:0}}@media (min-width:782px){.boot-layout-container .boot-layout{min-height:calc(100vh - 32px)}body:has(.boot-layout.has-full-canvas) .boot-layout-container .boot-layout{min-height:100vh}}.boot-layout-container .boot-layout img{height:auto;max-width:100%}.boot-layout .boot-notices__snackbar{bottom:24px;box-sizing:border-box;display:flex;flex-direction:column;left:0;padding-inline:16px;pointer-events:none;position:fixed;right:0}.boot-layout .boot-notices__snackbar .components-snackbar{margin-inline:auto}\"));\n\tdocument.head.appendChild(style);\n}\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='cc217bc358']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"cc217bc358\");\n\tstyle.appendChild(document.createTextNode(\"@media (max-width:782px){*{view-transition-name:none!important}}::view-transition-new(root),::view-transition-old(root){animation-duration:.25s}@media not (prefers-reduced-motion:reduce){.boot-layout__canvas .interface-interface-skeleton__header{view-transition-name:boot--canvas-header}.boot-layout__canvas .interface-interface-skeleton__sidebar{view-transition-name:boot--canvas-sidebar}.boot-layout.has-full-canvas .boot-layout__canvas .boot-site-icon-link,.boot-layout:not(.has-full-canvas) .boot-site-hub .boot-site-icon-link{view-transition-name:boot--site-icon-link}.boot-layout__stage{view-transition-name:boot--stage}.boot-layout__inspector{view-transition-name:boot--inspector}.boot-layout__canvas.is-full-canvas .interface-interface-skeleton__content,.boot-layout__canvas:not(.is-full-canvas){view-transition-name:boot--canvas}@supports (-webkit-hyphens:none) and (not (-moz-appearance:none)){.boot-layout__stage{view-transition-name:boot-safari--stage}.boot-layout__inspector{view-transition-name:boot-safari--inspector}.boot-layout__canvas.is-full-canvas .interface-interface-skeleton__content,.boot-layout__canvas:not(.is-full-canvas){view-transition-name:boot-safari--canvas}}.components-popover:first-of-type{view-transition-name:boot--components-popover}}::view-transition-group(boot--canvas),::view-transition-group(boot--canvas-header),::view-transition-group(boot--canvas-sidebar),::view-transition-group(boot-safari--canvas){z-index:1}::view-transition-group(boot--site-icon-link){z-index:2}::view-transition-new(boot--site-icon-link),::view-transition-old(boot--site-icon-link){animation:none}::view-transition-new(boot-safari--canvas),::view-transition-new(boot-safari--inspector),::view-transition-new(boot-safari--stage),::view-transition-old(boot-safari--canvas),::view-transition-old(boot-safari--inspector),::view-transition-old(boot-safari--stage){width:auto}::view-transition-new(boot--canvas),::view-transition-new(boot--inspector),::view-transition-new(boot--stage),::view-transition-old(boot--canvas),::view-transition-old(boot--inspector),::view-transition-old(boot--stage){background:#fff;border-radius:8px;height:100%;object-fit:none;object-position:left top;overflow:hidden;width:100%}::view-transition-new(boot--canvas),::view-transition-old(boot--canvas){object-position:center top}::view-transition-old(boot--inspector):only-child,::view-transition-old(boot--stage):only-child,::view-transition-old(boot-safari--inspector):only-child,::view-transition-old(boot-safari--stage):only-child{animation-name:zoomOut;will-change:transform,opacity}::view-transition-new(boot--inspector):only-child,::view-transition-new(boot--stage):only-child,::view-transition-new(boot-safari--inspector):only-child,::view-transition-new(boot-safari--stage):only-child{animation-name:zoomIn;will-change:transform,opacity}@keyframes zoomOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.9)}}@keyframes zoomIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}::view-transition-new(boot--canvas):only-child,::view-transition-new(boot-safari--canvas):only-child{animation-name:slideFromRight;will-change:transform}::view-transition-old(boot--canvas):only-child,::view-transition-old(boot-safari--canvas):only-child{animation-name:slideToRight;will-change:transform}@keyframes slideFromRight{0%{transform:translateX(100vw)}to{transform:translateX(0)}}@keyframes slideToRight{0%{transform:translateX(0)}to{transform:translateX(100vw)}}::view-transition-new(boot--canvas-header):only-child{animation-name:slideHeaderFromTop;will-change:transform}::view-transition-old(boot--canvas-header):only-child{animation-name:slideHeaderToTop;will-change:transform}@keyframes slideHeaderFromTop{0%{transform:translateY(-100%)}}@keyframes slideHeaderToTop{to{transform:translateY(-100%)}}::view-transition-new(boot--canvas-sidebar):only-child{animation-name:slideSidebarFromRight;will-change:transform}::view-transition-old(boot--canvas-sidebar):only-child{animation-name:slideSidebarToRight;will-change:transform}@keyframes slideSidebarFromRight{0%{transform:translateX(100%)}}@keyframes slideSidebarToRight{to{transform:translateX(100%)}}\"));\n\tdocument.head.appendChild(style);\n}\n", "/**\n * Internal dependencies\n */\nimport './style.scss';\nimport './view-transitions.scss';\nexport { init, initSinglePage } from './components/app';\nexport { store } from './store';\n"],
5
- "mappings": ";AAAA,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,0jSAAslS,CAAC;AACjoS,WAAS,KAAK,YAAY,KAAK;AAChC;;;ACLA,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,8kIAA8kI,CAAC;AACznI,WAAS,KAAK,YAAY,KAAK;AAChC;;;ACAA,SAAS,MAAM,sBAAsB;AACrC,SAAS,aAAa;",
4
+ "sourcesContent": ["if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='9947af2e2a']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"9947af2e2a\");\n\tstyle.appendChild(document.createTextNode(\":root{--wpds-border-radius-xs:1px;--wpds-border-radius-sm:2px;--wpds-border-radius-md:4px;--wpds-border-radius-lg:8px;--wpds-border-width-xs:1px;--wpds-border-width-sm:2px;--wpds-border-width-md:4px;--wpds-border-width-lg:8px;--wpds-border-width-focus:2px;--wpds-color-bg-surface-neutral:#fcfcfc;--wpds-color-bg-surface-neutral-strong:#fff;--wpds-color-bg-surface-neutral-weak:#f4f4f4;--wpds-color-bg-surface-brand:#ecf0fa;--wpds-color-bg-surface-success:#c6f7cd;--wpds-color-bg-surface-success-weak:#ebffed;--wpds-color-bg-surface-info:#deebfa;--wpds-color-bg-surface-info-weak:#f3f9ff;--wpds-color-bg-surface-warning:#fde6be;--wpds-color-bg-surface-warning-weak:#fff7e1;--wpds-color-bg-surface-caution:#fee995;--wpds-color-bg-surface-caution-weak:#fff9ca;--wpds-color-bg-surface-error:#f6e6e3;--wpds-color-bg-surface-error-weak:#fff6f5;--wpds-color-bg-interactive-neutral-strong:#2d2d2d;--wpds-color-bg-interactive-neutral-strong-active:#1e1e1e;--wpds-color-bg-interactive-neutral-strong-disabled:#e6e6e6;--wpds-color-bg-interactive-neutral-weak:#0000;--wpds-color-bg-interactive-neutral-weak-active:#ededed;--wpds-color-bg-interactive-neutral-weak-disabled:#0000;--wpds-color-bg-interactive-brand-strong:#3858e9;--wpds-color-bg-interactive-brand-strong-active:#2e49d9;--wpds-color-bg-interactive-brand-weak:#0000;--wpds-color-bg-interactive-brand-weak-active:#e6eaf4;--wpds-color-bg-interactive-error:#0000;--wpds-color-bg-interactive-error-active:#fff6f5;--wpds-color-bg-interactive-error-strong:#cc1818;--wpds-color-bg-interactive-error-strong-active:#b90000;--wpds-color-bg-interactive-error-weak:#0000;--wpds-color-bg-interactive-error-weak-active:#f6e6e3;--wpds-color-bg-track-neutral-weak:#e4e4e4;--wpds-color-bg-track-neutral:#dbdbdb;--wpds-color-bg-thumb-neutral-weak:#8d8d8d;--wpds-color-bg-thumb-neutral-weak-active:#6e6e6e;--wpds-color-bg-thumb-brand:#3858e9;--wpds-color-bg-thumb-brand-active:#3858e9;--wpds-color-bg-thumb-neutral-disabled:#dbdbdb;--wpds-color-fg-content-neutral:#1e1e1e;--wpds-color-fg-content-neutral-weak:#707070;--wpds-color-fg-content-success:#002900;--wpds-color-fg-content-success-weak:#008030;--wpds-color-fg-content-info:#001b4f;--wpds-color-fg-content-info-weak:#006bd7;--wpds-color-fg-content-warning:#2e1900;--wpds-color-fg-content-warning-weak:#926300;--wpds-color-fg-content-caution:#281d00;--wpds-color-fg-content-caution-weak:#826a00;--wpds-color-fg-content-error:#470000;--wpds-color-fg-content-error-weak:#cc1818;--wpds-color-fg-interactive-neutral:#1e1e1e;--wpds-color-fg-interactive-neutral-active:#1e1e1e;--wpds-color-fg-interactive-neutral-disabled:#8d8d8d;--wpds-color-fg-interactive-neutral-strong:#f0f0f0;--wpds-color-fg-interactive-neutral-strong-active:#f0f0f0;--wpds-color-fg-interactive-neutral-strong-disabled:#8d8d8d;--wpds-color-fg-interactive-neutral-weak:#707070;--wpds-color-fg-interactive-neutral-weak-disabled:#8d8d8d;--wpds-color-fg-interactive-brand:#3858e9;--wpds-color-fg-interactive-brand-active:#3858e9;--wpds-color-fg-interactive-brand-strong:#eff0f2;--wpds-color-fg-interactive-brand-strong-active:#eff0f2;--wpds-color-fg-interactive-error:#cc1818;--wpds-color-fg-interactive-error-active:#cc1818;--wpds-color-fg-interactive-error-strong:#f2efef;--wpds-color-fg-interactive-error-strong-active:#f2efef;--wpds-color-stroke-surface-neutral:#dbdbdb;--wpds-color-stroke-surface-neutral-weak:#e4e4e4;--wpds-color-stroke-surface-neutral-strong:#8d8d8d;--wpds-color-stroke-surface-brand:#a3b1d4;--wpds-color-stroke-surface-brand-strong:#3858e9;--wpds-color-stroke-surface-success:#8ac894;--wpds-color-stroke-surface-success-strong:#008030;--wpds-color-stroke-surface-info:#9fbcdc;--wpds-color-stroke-surface-info-strong:#006bd7;--wpds-color-stroke-surface-warning:#d0b481;--wpds-color-stroke-surface-warning-strong:#926300;--wpds-color-stroke-surface-error:#daa39b;--wpds-color-stroke-surface-error-strong:#cc1818;--wpds-color-stroke-interactive-neutral:#8d8d8d;--wpds-color-stroke-interactive-neutral-active:#6e6e6e;--wpds-color-stroke-interactive-neutral-disabled:#dbdbdb;--wpds-color-stroke-interactive-neutral-strong:#6e6e6e;--wpds-color-stroke-interactive-brand:#3858e9;--wpds-color-stroke-interactive-brand-active:#2337c8;--wpds-color-stroke-interactive-error:#cc1818;--wpds-color-stroke-interactive-error-active:#9d0000;--wpds-color-stroke-interactive-error-strong:#cc1818;--wpds-color-stroke-focus-brand:#3858e9;--wpds-cursor-control:pointer;--wpds-dimension-base:4px;--wpds-dimension-padding-xs:4px;--wpds-dimension-padding-sm:8px;--wpds-dimension-padding-md:12px;--wpds-dimension-padding-lg:16px;--wpds-dimension-padding-xl:20px;--wpds-dimension-padding-2xl:24px;--wpds-dimension-padding-3xl:32px;--wpds-dimension-gap-xs:4px;--wpds-dimension-gap-sm:8px;--wpds-dimension-gap-md:12px;--wpds-dimension-gap-lg:16px;--wpds-dimension-gap-xl:24px;--wpds-dimension-gap-2xl:32px;--wpds-dimension-gap-3xl:40px;--wpds-dimension-surface-width-xs:240px;--wpds-dimension-surface-width-sm:320px;--wpds-dimension-surface-width-md:400px;--wpds-dimension-surface-width-lg:560px;--wpds-dimension-surface-width-xl:720px;--wpds-dimension-surface-width-2xl:960px;--wpds-elevation-xs:0 1px 1px 0 #00000008,0 1px 2px 0 #00000005,0 3px 3px 0 #00000005,0 4px 4px 0 #00000003;--wpds-elevation-sm:0 1px 2px 0 #0000000d,0 2px 3px 0 #0000000a,0 6px 6px 0 #00000008,0 8px 8px 0 #00000005;--wpds-elevation-md:0 2px 3px 0 #0000000d,0 4px 5px 0 #0000000a,0 12px 12px 0 #00000008,0 16px 16px 0 #00000005;--wpds-elevation-lg:0 5px 15px 0 #00000014,0 15px 27px 0 #00000012,0 30px 36px 0 #0000000a,0 50px 43px 0 #00000005;--wpds-motion-duration-xs:50ms;--wpds-motion-duration-sm:100ms;--wpds-motion-duration-md:200ms;--wpds-motion-duration-lg:300ms;--wpds-motion-duration-xl:400ms;--wpds-motion-easing-subtle:cubic-bezier(0.15,0,0.15,1);--wpds-motion-easing-balanced:cubic-bezier(0.4,0,0.2,1);--wpds-motion-easing-expressive:cubic-bezier(0.25,0,0,1);--wpds-typography-font-family-heading:-apple-system,system-ui,\\\"Segoe UI\\\",\\\"Roboto\\\",\\\"Oxygen-Sans\\\",\\\"Ubuntu\\\",\\\"Cantarell\\\",\\\"Helvetica Neue\\\",sans-serif;--wpds-typography-font-family-body:-apple-system,system-ui,\\\"Segoe UI\\\",\\\"Roboto\\\",\\\"Oxygen-Sans\\\",\\\"Ubuntu\\\",\\\"Cantarell\\\",\\\"Helvetica Neue\\\",sans-serif;--wpds-typography-font-family-mono:\\\"Menlo\\\",\\\"Consolas\\\",monaco,monospace;--wpds-typography-font-size-xs:11px;--wpds-typography-font-size-sm:12px;--wpds-typography-font-size-md:13px;--wpds-typography-font-size-lg:15px;--wpds-typography-font-size-xl:20px;--wpds-typography-font-size-2xl:32px;--wpds-typography-line-height-xs:16px;--wpds-typography-line-height-sm:20px;--wpds-typography-line-height-md:24px;--wpds-typography-line-height-lg:28px;--wpds-typography-line-height-xl:32px;--wpds-typography-line-height-2xl:40px;--wpds-typography-font-weight-regular:400;--wpds-typography-font-weight-medium:499}[data-wpds-theme-provider-id][data-wpds-density=compact]{--wpds-dimension-padding-xs:4px;--wpds-dimension-padding-sm:4px;--wpds-dimension-padding-md:8px;--wpds-dimension-padding-lg:12px;--wpds-dimension-padding-xl:16px;--wpds-dimension-padding-2xl:20px;--wpds-dimension-padding-3xl:24px;--wpds-dimension-gap-xs:4px;--wpds-dimension-gap-sm:4px;--wpds-dimension-gap-md:8px;--wpds-dimension-gap-lg:12px;--wpds-dimension-gap-xl:20px;--wpds-dimension-gap-2xl:24px;--wpds-dimension-gap-3xl:32px}[data-wpds-theme-provider-id][data-wpds-density=comfortable]{--wpds-dimension-padding-xs:8px;--wpds-dimension-padding-sm:12px;--wpds-dimension-padding-md:16px;--wpds-dimension-padding-lg:20px;--wpds-dimension-padding-xl:24px;--wpds-dimension-padding-2xl:32px;--wpds-dimension-padding-3xl:40px;--wpds-dimension-gap-xs:8px;--wpds-dimension-gap-sm:12px;--wpds-dimension-gap-md:16px;--wpds-dimension-gap-lg:20px;--wpds-dimension-gap-xl:32px;--wpds-dimension-gap-2xl:40px;--wpds-dimension-gap-3xl:48px}[data-wpds-theme-provider-id][data-wpds-density=default]{--wpds-dimension-base:4px;--wpds-dimension-padding-xs:4px;--wpds-dimension-padding-sm:8px;--wpds-dimension-padding-md:12px;--wpds-dimension-padding-lg:16px;--wpds-dimension-padding-xl:20px;--wpds-dimension-padding-2xl:24px;--wpds-dimension-padding-3xl:32px;--wpds-dimension-gap-xs:4px;--wpds-dimension-gap-sm:8px;--wpds-dimension-gap-md:12px;--wpds-dimension-gap-lg:16px;--wpds-dimension-gap-xl:24px;--wpds-dimension-gap-2xl:32px;--wpds-dimension-gap-3xl:40px;--wpds-dimension-surface-width-xs:240px;--wpds-dimension-surface-width-sm:320px;--wpds-dimension-surface-width-md:400px;--wpds-dimension-surface-width-lg:560px;--wpds-dimension-surface-width-xl:720px;--wpds-dimension-surface-width-2xl:960px}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){:root{--wpds-border-width-focus:1.5px}}body.has-admin-bar-in-editor #wpadminbar{display:block}body.has-admin-bar-in-editor .boot-canvas-back-button__link{background:#0000}body.has-admin-bar-in-editor .boot-canvas-back-button__icon{background-color:initial}body.has-admin-bar-in-editor #site-editor-v2-app{bottom:0;height:calc(100vh - 32px)!important;left:0;position:fixed;right:0;top:32px}body.has-admin-bar-in-editor .boot-layout.has-full-canvas .boot-layout__canvas{height:calc(100vh - 32px);top:32px}@media (max-width:782px){body.has-admin-bar-in-editor #site-editor-v2-app{height:calc(100vh - 46px)!important;top:46px}body.has-admin-bar-in-editor .boot-layout.has-full-canvas .boot-layout__canvas,body.has-admin-bar-in-editor .boot-layout__canvas:not(.has-mobile-drawer),body.has-admin-bar-in-editor .boot-layout__inspector,body.has-admin-bar-in-editor .boot-layout__stage{height:calc(100vh - 46px);top:46px}body.has-admin-bar-in-editor .boot-layout__mobile-sidebar-drawer{top:46px}}@media (min-width:600px){.boot-layout-container .boot-layout{bottom:0;left:0;min-height:calc(100vh - 46px);position:absolute;right:0;top:0}}@media (min-width:782px){.boot-layout-container .boot-layout{min-height:calc(100vh - 32px)}body:has(.boot-layout.has-full-canvas) .boot-layout-container .boot-layout{min-height:100vh}}.boot-layout-container .boot-layout img{height:auto;max-width:100%}.boot-layout .boot-notices__snackbar{bottom:24px;box-sizing:border-box;display:flex;flex-direction:column;left:0;padding-inline:16px;pointer-events:none;position:fixed;right:0}.boot-layout .boot-notices__snackbar .components-snackbar{margin-inline:auto}\"));\n\tdocument.head.appendChild(style);\n}\n", "if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && !document.head.querySelector(\"style[data-wp-hash='cc217bc358']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"cc217bc358\");\n\tstyle.appendChild(document.createTextNode(\"@media (max-width:782px){*{view-transition-name:none!important}}::view-transition-new(root),::view-transition-old(root){animation-duration:.25s}@media not (prefers-reduced-motion:reduce){.boot-layout__canvas .interface-interface-skeleton__header{view-transition-name:boot--canvas-header}.boot-layout__canvas .interface-interface-skeleton__sidebar{view-transition-name:boot--canvas-sidebar}.boot-layout.has-full-canvas .boot-layout__canvas .boot-site-icon-link,.boot-layout:not(.has-full-canvas) .boot-site-hub .boot-site-icon-link{view-transition-name:boot--site-icon-link}.boot-layout__stage{view-transition-name:boot--stage}.boot-layout__inspector{view-transition-name:boot--inspector}.boot-layout__canvas.is-full-canvas .interface-interface-skeleton__content,.boot-layout__canvas:not(.is-full-canvas){view-transition-name:boot--canvas}@supports (-webkit-hyphens:none) and (not (-moz-appearance:none)){.boot-layout__stage{view-transition-name:boot-safari--stage}.boot-layout__inspector{view-transition-name:boot-safari--inspector}.boot-layout__canvas.is-full-canvas .interface-interface-skeleton__content,.boot-layout__canvas:not(.is-full-canvas){view-transition-name:boot-safari--canvas}}.components-popover:first-of-type{view-transition-name:boot--components-popover}}::view-transition-group(boot--canvas),::view-transition-group(boot--canvas-header),::view-transition-group(boot--canvas-sidebar),::view-transition-group(boot-safari--canvas){z-index:1}::view-transition-group(boot--site-icon-link){z-index:2}::view-transition-new(boot--site-icon-link),::view-transition-old(boot--site-icon-link){animation:none}::view-transition-new(boot-safari--canvas),::view-transition-new(boot-safari--inspector),::view-transition-new(boot-safari--stage),::view-transition-old(boot-safari--canvas),::view-transition-old(boot-safari--inspector),::view-transition-old(boot-safari--stage){width:auto}::view-transition-new(boot--canvas),::view-transition-new(boot--inspector),::view-transition-new(boot--stage),::view-transition-old(boot--canvas),::view-transition-old(boot--inspector),::view-transition-old(boot--stage){background:#fff;border-radius:8px;height:100%;object-fit:none;object-position:left top;overflow:hidden;width:100%}::view-transition-new(boot--canvas),::view-transition-old(boot--canvas){object-position:center top}::view-transition-old(boot--inspector):only-child,::view-transition-old(boot--stage):only-child,::view-transition-old(boot-safari--inspector):only-child,::view-transition-old(boot-safari--stage):only-child{animation-name:zoomOut;will-change:transform,opacity}::view-transition-new(boot--inspector):only-child,::view-transition-new(boot--stage):only-child,::view-transition-new(boot-safari--inspector):only-child,::view-transition-new(boot-safari--stage):only-child{animation-name:zoomIn;will-change:transform,opacity}@keyframes zoomOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.9)}}@keyframes zoomIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}::view-transition-new(boot--canvas):only-child,::view-transition-new(boot-safari--canvas):only-child{animation-name:slideFromRight;will-change:transform}::view-transition-old(boot--canvas):only-child,::view-transition-old(boot-safari--canvas):only-child{animation-name:slideToRight;will-change:transform}@keyframes slideFromRight{0%{transform:translateX(100vw)}to{transform:translateX(0)}}@keyframes slideToRight{0%{transform:translateX(0)}to{transform:translateX(100vw)}}::view-transition-new(boot--canvas-header):only-child{animation-name:slideHeaderFromTop;will-change:transform}::view-transition-old(boot--canvas-header):only-child{animation-name:slideHeaderToTop;will-change:transform}@keyframes slideHeaderFromTop{0%{transform:translateY(-100%)}}@keyframes slideHeaderToTop{to{transform:translateY(-100%)}}::view-transition-new(boot--canvas-sidebar):only-child{animation-name:slideSidebarFromRight;will-change:transform}::view-transition-old(boot--canvas-sidebar):only-child{animation-name:slideSidebarToRight;will-change:transform}@keyframes slideSidebarFromRight{0%{transform:translateX(100%)}}@keyframes slideSidebarToRight{to{transform:translateX(100%)}}\"));\n\tdocument.head.appendChild(style);\n}\n", "/**\n * Internal dependencies\n */\nimport './style.scss';\nimport './view-transitions.scss';\nexport { init, initSinglePage } from './components/app';\nexport { store } from './store';\n"],
5
+ "mappings": ";AAAA,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,8+TAA0gU,CAAC;AACrjU,WAAS,KAAK,YAAY,KAAK;AAChC;;;ACLA,IAAI,OAAO,aAAa,eAAe,QAAQ,IAAI,aAAa,UAAU,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AAC3I,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,8kIAA8kI,CAAC;AACznI,WAAS,KAAK,YAAY,KAAK;AAChC;;;ACAA,SAAS,MAAM,sBAAsB;AACrC,SAAS,aAAa;",
6
6
  "names": []
7
7
  }
package/build-style/experimental-admin-bar-in-editor-rtl.css ADDED
@@ -0,0 +1,37 @@
1
+ body.has-admin-bar-in-editor #wpadminbar {
2
+ display: block;
3
+ }
4
+ body.has-admin-bar-in-editor .boot-canvas-back-button__link {
5
+ background: transparent;
6
+ }
7
+ body.has-admin-bar-in-editor .boot-canvas-back-button__icon {
8
+ background-color: transparent;
9
+ }
10
+ body.has-admin-bar-in-editor #site-editor-v2-app {
11
+ position: fixed;
12
+ top: 32px;
13
+ right: 0;
14
+ left: 0;
15
+ bottom: 0;
16
+ height: calc(100vh - 32px) !important;
17
+ }
18
+ body.has-admin-bar-in-editor .boot-layout.has-full-canvas .boot-layout__canvas {
19
+ top: 32px;
20
+ height: calc(100vh - 32px);
21
+ }
22
+ @media (max-width: 782px) {
23
+ body.has-admin-bar-in-editor #site-editor-v2-app {
24
+ top: 46px;
25
+ height: calc(100vh - 46px) !important;
26
+ }
27
+ body.has-admin-bar-in-editor .boot-layout__stage,
28
+ body.has-admin-bar-in-editor .boot-layout__inspector,
29
+ body.has-admin-bar-in-editor .boot-layout__canvas:not(.has-mobile-drawer),
30
+ body.has-admin-bar-in-editor .boot-layout.has-full-canvas .boot-layout__canvas {
31
+ top: 46px;
32
+ height: calc(100vh - 46px);
33
+ }
34
+ body.has-admin-bar-in-editor .boot-layout__mobile-sidebar-drawer {
35
+ top: 46px;
36
+ }
37
+ }
package/build-style/experimental-admin-bar-in-editor.css ADDED
@@ -0,0 +1,37 @@
1
+ body.has-admin-bar-in-editor #wpadminbar {
2
+ display: block;
3
+ }
4
+ body.has-admin-bar-in-editor .boot-canvas-back-button__link {
5
+ background: transparent;
6
+ }
7
+ body.has-admin-bar-in-editor .boot-canvas-back-button__icon {
8
+ background-color: transparent;
9
+ }
10
+ body.has-admin-bar-in-editor #site-editor-v2-app {
11
+ position: fixed;
12
+ top: 32px;
13
+ left: 0;
14
+ right: 0;
15
+ bottom: 0;
16
+ height: calc(100vh - 32px) !important;
17
+ }
18
+ body.has-admin-bar-in-editor .boot-layout.has-full-canvas .boot-layout__canvas {
19
+ top: 32px;
20
+ height: calc(100vh - 32px);
21
+ }
22
+ @media (max-width: 782px) {
23
+ body.has-admin-bar-in-editor #site-editor-v2-app {
24
+ top: 46px;
25
+ height: calc(100vh - 46px) !important;
26
+ }
27
+ body.has-admin-bar-in-editor .boot-layout__stage,
28
+ body.has-admin-bar-in-editor .boot-layout__inspector,
29
+ body.has-admin-bar-in-editor .boot-layout__canvas:not(.has-mobile-drawer),
30
+ body.has-admin-bar-in-editor .boot-layout.has-full-canvas .boot-layout__canvas {
31
+ top: 46px;
32
+ height: calc(100vh - 46px);
33
+ }
34
+ body.has-admin-bar-in-editor .boot-layout__mobile-sidebar-drawer {
35
+ top: 46px;
36
+ }
37
+ }
package/build-style/style-rtl.css CHANGED
@@ -511,6 +511,44 @@
511
511
  * Creates a checkerboard pattern background to indicate transparency.
512
512
  * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
513
513
  */
514
+ body.has-admin-bar-in-editor #wpadminbar {
515
+ display: block;
516
+ }
517
+ body.has-admin-bar-in-editor .boot-canvas-back-button__link {
518
+ background: transparent;
519
+ }
520
+ body.has-admin-bar-in-editor .boot-canvas-back-button__icon {
521
+ background-color: transparent;
522
+ }
523
+ body.has-admin-bar-in-editor #site-editor-v2-app {
524
+ position: fixed;
525
+ top: 32px;
526
+ right: 0;
527
+ left: 0;
528
+ bottom: 0;
529
+ height: calc(100vh - 32px) !important;
530
+ }
531
+ body.has-admin-bar-in-editor .boot-layout.has-full-canvas .boot-layout__canvas {
532
+ top: 32px;
533
+ height: calc(100vh - 32px);
534
+ }
535
+ @media (max-width: 782px) {
536
+ body.has-admin-bar-in-editor #site-editor-v2-app {
537
+ top: 46px;
538
+ height: calc(100vh - 46px) !important;
539
+ }
540
+ body.has-admin-bar-in-editor .boot-layout__stage,
541
+ body.has-admin-bar-in-editor .boot-layout__inspector,
542
+ body.has-admin-bar-in-editor .boot-layout__canvas:not(.has-mobile-drawer),
543
+ body.has-admin-bar-in-editor .boot-layout.has-full-canvas .boot-layout__canvas {
544
+ top: 46px;
545
+ height: calc(100vh - 46px);
546
+ }
547
+ body.has-admin-bar-in-editor .boot-layout__mobile-sidebar-drawer {
548
+ top: 46px;
549
+ }
550
+ }
551
+
514
552
  @media (min-width: 600px) {
515
553
  .boot-layout-container .boot-layout {
516
554
  position: absolute;
package/build-style/style.css CHANGED
@@ -511,6 +511,44 @@
511
511
  * Creates a checkerboard pattern background to indicate transparency.
512
512
  * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
513
513
  */
514
+ body.has-admin-bar-in-editor #wpadminbar {
515
+ display: block;
516
+ }
517
+ body.has-admin-bar-in-editor .boot-canvas-back-button__link {
518
+ background: transparent;
519
+ }
520
+ body.has-admin-bar-in-editor .boot-canvas-back-button__icon {
521
+ background-color: transparent;
522
+ }
523
+ body.has-admin-bar-in-editor #site-editor-v2-app {
524
+ position: fixed;
525
+ top: 32px;
526
+ left: 0;
527
+ right: 0;
528
+ bottom: 0;
529
+ height: calc(100vh - 32px) !important;
530
+ }
531
+ body.has-admin-bar-in-editor .boot-layout.has-full-canvas .boot-layout__canvas {
532
+ top: 32px;
533
+ height: calc(100vh - 32px);
534
+ }
535
+ @media (max-width: 782px) {
536
+ body.has-admin-bar-in-editor #site-editor-v2-app {
537
+ top: 46px;
538
+ height: calc(100vh - 46px) !important;
539
+ }
540
+ body.has-admin-bar-in-editor .boot-layout__stage,
541
+ body.has-admin-bar-in-editor .boot-layout__inspector,
542
+ body.has-admin-bar-in-editor .boot-layout__canvas:not(.has-mobile-drawer),
543
+ body.has-admin-bar-in-editor .boot-layout.has-full-canvas .boot-layout__canvas {
544
+ top: 46px;
545
+ height: calc(100vh - 46px);
546
+ }
547
+ body.has-admin-bar-in-editor .boot-layout__mobile-sidebar-drawer {
548
+ top: 46px;
549
+ }
550
+ }
551
+
514
552
  @media (min-width: 600px) {
515
553
  .boot-layout-container .boot-layout {
516
554
  position: absolute;
package/build-types/components/canvas/back-button.d.ts CHANGED
@@ -1,4 +1,9 @@
1
1
  import './back-button.scss';
2
+ declare global {
3
+ interface Window {
4
+ __experimentalAdminBarInEditor?: boolean;
5
+ }
6
+ }
2
7
  /**
3
8
  * Back button component that appears in full-screen canvas mode.
4
9
  * Matches next-admin's SiteIconBackButton design.
package/build-types/components/canvas/back-button.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"back-button.d.ts","sourceRoot":"","sources":["../../../src/components/canvas/back-button.tsx"],"names":[],"mappings":"AAgBA,OAAO,oBAAoB,CAAC;AAkB5B;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,UAAU,cAAc,CAAE,EAAE,MAAM,EAAE,EAAE;IAAE,MAAM,EAAE,MAAM,CAAA;CAAE,sCA2CrE"}
1
+ {"version":3,"file":"back-button.d.ts","sourceRoot":"","sources":["../../../src/components/canvas/back-button.tsx"],"names":[],"mappings":"AAgBA,OAAO,oBAAoB,CAAC;AAE5B,OAAO,CAAC,MAAM,CAAC,CAAC;IACf,UAAU,MAAM;QACf,8BAA8B,CAAC,EAAE,OAAO,CAAC;KACzC;CACD;AAkBD;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,UAAU,cAAc,CAAE,EAAE,MAAM,EAAE,EAAE;IAAE,MAAM,EAAE,MAAM,CAAA;CAAE,sCAoDrE"}
package/build-types/components/navigation/drilldown-item/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/navigation/drilldown-item/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAmBvC,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAErD,UAAU,kBAAkB;IAC3B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,UAAU,EAAE,CAAE,EACb,EAAE,EACF,SAAS,EACT,EAAE;QACF,EAAE,CAAC,EAAE,MAAM,CAAC;QACZ,SAAS,EAAE,SAAS,GAAG,UAAU,CAAC;KAClC,KAAM,IAAI,CAAC;CACZ;AAED,MAAM,CAAC,OAAO,UAAU,aAAa,CAAE,EACtC,SAAS,EACT,EAAE,EACF,IAAI,EACJ,qBAA4B,EAC5B,QAAQ,EACR,UAAU,EACV,EAAE,kBAAkB,+BAsBpB"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/navigation/drilldown-item/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAmBvC,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAErD,UAAU,kBAAkB;IAC3B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,UAAU,EAAE,CAAE,EACb,EAAE,EACF,SAAS,EACT,EAAE;QACF,EAAE,CAAC,EAAE,MAAM,CAAC;QACZ,SAAS,EAAE,SAAS,GAAG,UAAU,CAAC;KAClC,KAAM,IAAI,CAAC;CACZ;AAED,MAAM,CAAC,OAAO,UAAU,aAAa,CAAE,EACtC,SAAS,EACT,EAAE,EACF,IAAI,EACJ,qBAA4B,EAC5B,QAAQ,EACR,UAAU,EACV,EAAE,kBAAkB,+BAwBpB"}
package/build-types/components/navigation/items.d.ts CHANGED
@@ -12,5 +12,5 @@ import type { IconType } from '../../store/types';
12
12
  * @param shouldShowPlaceholder - Whether to show placeholder when no icon is provided
13
13
  * @return The converted icon as a JSX element
14
14
  */
15
- export declare function wrapIcon(icon?: IconType, shouldShowPlaceholder?: boolean): string | number | true | import("react").JSX.Element | Iterable<import("react").ReactNode> | null;
15
+ export declare function wrapIcon(icon?: IconType, shouldShowPlaceholder?: boolean): string | number | bigint | true | import("react").JSX.Element | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | Iterable<import("react").ReactNode> | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | import("react").ReactPortal | null | undefined> | null;
16
16
  //# sourceMappingURL=items.d.ts.map
package/build-types/components/navigation/items.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"items.d.ts","sourceRoot":"","sources":["../../../src/components/navigation/items.tsx"],"names":[],"mappings":"AAOA;;GAEG;AACH,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAelD;;;;;;;;;GASG;AACH,wBAAgB,QAAQ,CACvB,IAAI,CAAC,EAAE,QAAQ,EACf,qBAAqB,GAAE,OAAc,qGAuDrC"}
1
+ {"version":3,"file":"items.d.ts","sourceRoot":"","sources":["../../../src/components/navigation/items.tsx"],"names":[],"mappings":"AAOA;;GAEG;AACH,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAelD;;;;;;;;;GASG;AACH,wBAAgB,QAAQ,CACvB,IAAI,CAAC,EAAE,QAAQ,EACf,qBAAqB,GAAE,OAAc,gVAuDrC"}
package/build-types/components/sidebar/index.d.ts CHANGED
@@ -1,3 +1,8 @@
1
1
  import './style.scss';
2
+ declare global {
3
+ interface Window {
4
+ __experimentalAdminBarInEditor?: boolean;
5
+ }
6
+ }
2
7
  export default function Sidebar(): import("react").JSX.Element;
3
8
  //# sourceMappingURL=index.d.ts.map
package/build-types/components/sidebar/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/index.tsx"],"names":[],"mappings":"AAMA,OAAO,cAAc,CAAC;AAEtB,MAAM,CAAC,OAAO,UAAU,OAAO,gCAY9B"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/index.tsx"],"names":[],"mappings":"AAeA,OAAO,cAAc,CAAC;AAEtB,OAAO,CAAC,MAAM,CAAC,CAAC;IACf,UAAU,MAAM;QACf,8BAA8B,CAAC,EAAE,OAAO,CAAC;KACzC;CACD;AAoBD,MAAM,CAAC,OAAO,UAAU,OAAO,gCAa9B"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordpress/boot",
3
- "version": "0.12.1-next.v.202605131032.0+f6d6e7149",
3
+ "version": "0.14.0",
4
4
  "description": "Minimal boot package for WordPress admin pages.",
5
5
  "author": "The WordPress Contributors",
6
6
  "license": "GPL-2.0-or-later",
@@ -41,36 +41,36 @@
41
41
  "wpScriptModuleExports": "./build-module/index.mjs",
42
42
  "types": "build-types",
43
43
  "dependencies": {
44
- "@wordpress/a11y": "^4.45.1-next.v.202605131032.0+f6d6e7149",
45
- "@wordpress/admin-ui": "^2.0.2-next.v.202605131032.0+f6d6e7149",
46
- "@wordpress/base-styles": "^8.0.1-next.v.202605131032.0+f6d6e7149",
47
- "@wordpress/commands": "^1.45.1-next.v.202605131032.0+f6d6e7149",
48
- "@wordpress/components": "^33.1.1-next.v.202605131032.0+f6d6e7149",
49
- "@wordpress/compose": "^7.45.1-next.v.202605131032.0+f6d6e7149",
50
- "@wordpress/core-data": "^7.45.1-next.v.202605131032.0+f6d6e7149",
51
- "@wordpress/data": "^10.45.1-next.v.202605131032.0+f6d6e7149",
52
- "@wordpress/editor": "^14.45.2-next.v.202605131032.0+f6d6e7149",
53
- "@wordpress/element": "^6.45.1-next.v.202605131032.0+f6d6e7149",
54
- "@wordpress/html-entities": "^4.45.1-next.v.202605131032.0+f6d6e7149",
55
- "@wordpress/i18n": "^6.18.1-next.v.202605131032.0+f6d6e7149",
56
- "@wordpress/icons": "^13.0.1-next.v.202605131032.0+f6d6e7149",
57
- "@wordpress/keyboard-shortcuts": "^5.45.1-next.v.202605131032.0+f6d6e7149",
58
- "@wordpress/keycodes": "^4.45.1-next.v.202605131032.0+f6d6e7149",
59
- "@wordpress/lazy-editor": "^1.11.1-next.v.202605131032.0+f6d6e7149",
60
- "@wordpress/notices": "^5.45.1-next.v.202605131032.0+f6d6e7149",
61
- "@wordpress/primitives": "^4.45.1-next.v.202605131032.0+f6d6e7149",
62
- "@wordpress/private-apis": "^1.45.1-next.v.202605131032.0+f6d6e7149",
63
- "@wordpress/route": "^0.11.1-next.v.202605131032.0+f6d6e7149",
64
- "@wordpress/theme": "^0.13.1-next.v.202605131032.0+f6d6e7149",
65
- "@wordpress/url": "^4.45.1-next.v.202605131032.0+f6d6e7149",
44
+ "@wordpress/a11y": "^4.47.0",
45
+ "@wordpress/admin-ui": "^2.2.0",
46
+ "@wordpress/base-styles": "^9.0.0",
47
+ "@wordpress/commands": "^1.47.0",
48
+ "@wordpress/components": "^34.0.0",
49
+ "@wordpress/compose": "^8.0.0",
50
+ "@wordpress/core-data": "^7.47.0",
51
+ "@wordpress/data": "^10.47.0",
52
+ "@wordpress/editor": "^14.47.0",
53
+ "@wordpress/element": "^7.0.0",
54
+ "@wordpress/html-entities": "^4.47.0",
55
+ "@wordpress/i18n": "^6.20.0",
56
+ "@wordpress/icons": "^13.2.0",
57
+ "@wordpress/keyboard-shortcuts": "^5.47.0",
58
+ "@wordpress/keycodes": "^4.47.0",
59
+ "@wordpress/lazy-editor": "^1.13.0",
60
+ "@wordpress/notices": "^5.47.0",
61
+ "@wordpress/primitives": "^4.47.0",
62
+ "@wordpress/private-apis": "^1.47.0",
63
+ "@wordpress/route": "^0.13.0",
64
+ "@wordpress/theme": "^0.14.0",
65
+ "@wordpress/url": "^4.47.0",
66
66
  "clsx": "^2.1.1"
67
67
  },
68
68
  "peerDependencies": {
69
- "react": "^18.0.0",
70
- "react-dom": "^18.0.0"
69
+ "react": "^19.2.4",
70
+ "react-dom": "^19.2.4"
71
71
  },
72
72
  "publishConfig": {
73
73
  "access": "public"
74
74
  },
75
- "gitHead": "0e198c7ac7ca634e73ded9220ce048c0302174dd"
75
+ "gitHead": "d653c5fd6161571a0c2ebde28553d6e25624eacc"
76
76
  }
package/src/components/canvas/back-button.tsx CHANGED
@@ -3,12 +3,12 @@
3
3
  */
4
4
  import {
5
5
  Button,
6
- Icon,
6
+ Icon as WCIcon,
7
7
  __unstableMotion as motion,
8
8
  } from '@wordpress/components';
9
- import { arrowUpLeft } from '@wordpress/icons';
9
+ import { arrowUpLeft, arrowUpRight } from '@wordpress/icons';
10
10
  import { useReducedMotion } from '@wordpress/compose';
11
- import { __ } from '@wordpress/i18n';
11
+ import { __, isRTL } from '@wordpress/i18n';
12
12
 
13
13
  /**
14
14
  * Internal dependencies
@@ -16,6 +16,12 @@ import { __ } from '@wordpress/i18n';
16
16
  import SiteIcon from '../site-icon';
17
17
  import './back-button.scss';
18
18
 
19
+ declare global {
20
+ interface Window {
21
+ __experimentalAdminBarInEditor?: boolean;
22
+ }
23
+ }
24
+
19
25
  /**
20
26
  * Overlay arrow animation that appears on hover.
21
27
  * Matches next-admin implementation with clip-path.
@@ -42,6 +48,7 @@ const toggleHomeIconVariants = {
42
48
  */
43
49
  export default function BootBackButton( { length }: { length: number } ) {
44
50
  const disableMotion = useReducedMotion();
51
+ const hasAdminBarInEditor = window.__experimentalAdminBarInEditor;
45
52
 
46
53
  const handleBack = () => {
47
54
  window.history.back();
@@ -56,6 +63,8 @@ export default function BootBackButton( { length }: { length: number } ) {
56
63
  duration: disableMotion ? 0 : 0.3,
57
64
  };
58
65
 
66
+ const arrowIcon = isRTL() ? arrowUpRight : arrowUpLeft;
67
+
59
68
  return (
60
69
  <motion.div
61
70
  className="boot-canvas-back-button"
@@ -71,16 +80,22 @@ export default function BootBackButton( { length }: { length: number } ) {
71
80
  aria-label={ __( 'Go back' ) }
72
81
  __next40pxDefaultSize
73
82
  >
74
- <SiteIcon />
83
+ { ! hasAdminBarInEditor && <SiteIcon /> }
75
84
  </Button>
76
85
 
77
- { /* Overlay arrow that appears on hover */ }
78
- <motion.div
79
- className="boot-canvas-back-button__icon"
80
- variants={ toggleHomeIconVariants }
81
- >
82
- <Icon icon={ arrowUpLeft } />
83
- </motion.div>
86
+ { hasAdminBarInEditor ? (
87
+ <div className="boot-canvas-back-button__icon">
88
+ <WCIcon icon={ arrowIcon } />
89
+ </div>
90
+ ) : (
91
+ /* Overlay arrow that appears on hover */
92
+ <motion.div
93
+ className="boot-canvas-back-button__icon"
94
+ variants={ toggleHomeIconVariants }
95
+ >
96
+ <WCIcon icon={ arrowIcon } />
97
+ </motion.div>
98
+ ) }
84
99
  </motion.div>
85
100
  );
86
101
  }
package/src/components/navigation/drilldown-item/index.tsx CHANGED
@@ -12,7 +12,7 @@ import {
12
12
  __experimentalItem as Item,
13
13
  // @ts-ignore
14
14
  __experimentalHStack as HStack,
15
- Icon,
15
+ Icon as WCIcon,
16
16
  } from '@wordpress/components';
17
17
  import { isRTL } from '@wordpress/i18n';
18
18
  import { chevronRightSmall, chevronLeftSmall } from '@wordpress/icons';
@@ -81,7 +81,9 @@ export default function DrilldownItem( {
81
81
  >
82
82
  { wrapIcon( icon, shouldShowPlaceholder ) }
83
83
  <FlexBlock>{ children }</FlexBlock>
84
- <Icon icon={ isRTL() ? chevronLeftSmall : chevronRightSmall } />
84
+ <WCIcon
85
+ icon={ isRTL() ? chevronLeftSmall : chevronRightSmall }
86
+ />
85
87
  </HStack>
86
88
  </Item>
87
89
  );
package/src/components/navigation/dropdown-item/index.tsx CHANGED
@@ -12,7 +12,7 @@ import {
12
12
  __experimentalItem as Item,
13
13
  // @ts-ignore
14
14
  __experimentalHStack as HStack,
15
- Icon,
15
+ Icon as WCIcon,
16
16
  __unstableMotion as motion,
17
17
  __unstableAnimatePresence as AnimatePresence,
18
18
  } from '@wordpress/components';
@@ -96,7 +96,7 @@ export default function DropdownItem( {
96
96
  >
97
97
  { wrapIcon( icon, false ) }
98
98
  <FlexBlock>{ children }</FlexBlock>
99
- <Icon
99
+ <WCIcon
100
100
  icon={ chevronDownSmall }
101
101
  className={ clsx( 'boot-dropdown-item__chevron', {
102
102
  'is-up': isExpanded,
package/src/components/navigation/items.tsx CHANGED
@@ -2,7 +2,7 @@
2
2
  * WordPress dependencies
3
3
  */
4
4
  import { isValidElement } from '@wordpress/element';
5
- import { Dashicon, Icon } from '@wordpress/components';
5
+ import { Dashicon, Icon as WCIcon } from '@wordpress/components';
6
6
  import { SVG } from '@wordpress/primitives';
7
7
 
8
8
  /**
@@ -38,7 +38,7 @@ export function wrapIcon(
38
38
  shouldShowPlaceholder: boolean = true
39
39
  ) {
40
40
  if ( isSvg( icon ) ) {
41
- return <Icon icon={ icon } />;
41
+ return <WCIcon icon={ icon } />;
42
42
  }
43
43
 
44
44
  if ( typeof icon === 'string' && icon.startsWith( 'dashicons-' ) ) {
package/src/components/save-button/index.tsx CHANGED
@@ -8,7 +8,7 @@ import { store as coreStore } from '@wordpress/core-data';
8
8
  import { displayShortcut, rawShortcut } from '@wordpress/keycodes';
9
9
  import { check } from '@wordpress/icons';
10
10
  import { EntitiesSavedStates } from '@wordpress/editor';
11
- import { Button, Modal, Tooltip } from '@wordpress/components';
11
+ import { Button, Modal, Tooltip as WCTooltip } from '@wordpress/components';
12
12
 
13
13
  /**
14
14
  * Internal dependencies
@@ -85,7 +85,7 @@ export default function SaveButton() {
85
85
 
86
86
  return (
87
87
  <>
88
- <Tooltip
88
+ <WCTooltip
89
89
  text={ hasChanges ? label : undefined }
90
90
  shortcut={ displayShortcut.primary( 's' ) }
91
91
  >
@@ -103,7 +103,7 @@ export default function SaveButton() {
103
103
  >
104
104
  { label }
105
105
  </Button>
106
- </Tooltip>
106
+ </WCTooltip>
107
107
  { isSaveViewOpen && (
108
108
  <Modal
109
109
  title={ __( 'Review changes' ) }
package/src/components/sidebar/index.tsx CHANGED
@@ -1,15 +1,49 @@
1
+ /**
2
+ * WordPress dependencies
3
+ */
4
+ import { Button } from '@wordpress/components';
5
+ import { useSelect } from '@wordpress/data';
6
+ import { __, isRTL } from '@wordpress/i18n';
7
+ import { chevronLeft, chevronRight } from '@wordpress/icons';
8
+
1
9
  /**
2
10
  * Internal dependencies
3
11
  */
4
12
  import SiteHub from '../site-hub';
5
13
  import Navigation from '../navigation';
6
14
  import SaveButton from '../save-button';
15
+ import { store as bootStore } from '../../store';
7
16
  import './style.scss';
8
17
 
18
+ declare global {
19
+ interface Window {
20
+ __experimentalAdminBarInEditor?: boolean;
21
+ }
22
+ }
23
+
24
+ function DashboardBackButton() {
25
+ const dashboardLink = useSelect(
26
+ ( select ) => select( bootStore ).getDashboardLink(),
27
+ []
28
+ );
29
+ return (
30
+ <Button
31
+ __next40pxDefaultSize
32
+ className="boot-sidebar__back-button"
33
+ href={ dashboardLink || '/' }
34
+ icon={ isRTL() ? chevronRight : chevronLeft }
35
+ label={ __( 'Go to the Dashboard' ) }
36
+ >
37
+ { __( 'Dashboard' ) }
38
+ </Button>
39
+ );
40
+ }
41
+
9
42
  export default function Sidebar() {
43
+ const hasAdminBarInEditor = window.__experimentalAdminBarInEditor;
10
44
  return (
11
45
  <div className="boot-sidebar__scrollable">
12
- <SiteHub />
46
+ { hasAdminBarInEditor ? <DashboardBackButton /> : <SiteHub /> }
13
47
  <div className="boot-sidebar__content">
14
48
  <Navigation />
15
49
  </div>
package/src/components/sidebar/style.scss CHANGED
@@ -17,3 +17,7 @@
17
17
  .boot-sidebar__footer {
18
18
  padding: variables.$grid-unit-20 variables.$grid-unit-10 variables.$grid-unit-10 variables.$grid-unit-20;
19
19
  }
20
+
21
+ .boot-sidebar__back-button {
22
+ margin: variables.$grid-unit-10 variables.$grid-unit-15;
23
+ }
package/src/components/site-icon-link/index.tsx CHANGED
@@ -2,7 +2,7 @@
2
2
  * WordPress dependencies
3
3
  */
4
4
  import { Link, privateApis as routePrivateApis } from '@wordpress/route';
5
- import { Tooltip } from '@wordpress/components';
5
+ import { Tooltip as WCTooltip } from '@wordpress/components';
6
6
 
7
7
  /**
8
8
  * Internal dependencies
@@ -26,7 +26,7 @@ function SiteIconLink( {
26
26
  const canGoBack = useCanGoBack();
27
27
 
28
28
  return (
29
- <Tooltip text={ props[ 'aria-label' ] } placement="right">
29
+ <WCTooltip text={ props[ 'aria-label' ] } placement="right">
30
30
  <Link
31
31
  to={ to }
32
32
  aria-label={ props[ 'aria-label' ] }
@@ -42,7 +42,7 @@ function SiteIconLink( {
42
42
  >
43
43
  <SiteIcon />
44
44
  </Link>
45
- </Tooltip>
45
+ </WCTooltip>
46
46
  );
47
47
  }
48
48
 
package/src/experimental-admin-bar-in-editor.scss ADDED
@@ -0,0 +1,48 @@
1
+ // Styles for the experimental admin bar in editor.
2
+
3
+ body.has-admin-bar-in-editor {
4
+ #wpadminbar {
5
+ display: block;
6
+ }
7
+
8
+ .boot-canvas-back-button__link {
9
+ background: transparent;
10
+ }
11
+
12
+ .boot-canvas-back-button__icon {
13
+ background-color: transparent;
14
+ }
15
+
16
+ #site-editor-v2-app {
17
+ position: fixed;
18
+ top: 32px;
19
+ left: 0;
20
+ right: 0;
21
+ bottom: 0;
22
+ height: calc(100vh - 32px) !important;
23
+ }
24
+
25
+ .boot-layout.has-full-canvas .boot-layout__canvas {
26
+ top: 32px;
27
+ height: calc(100vh - 32px);
28
+ }
29
+
30
+ @media (max-width: 782px) {
31
+ #site-editor-v2-app {
32
+ top: 46px;
33
+ height: calc(100vh - 46px) !important;
34
+ }
35
+
36
+ .boot-layout__stage,
37
+ .boot-layout__inspector,
38
+ .boot-layout__canvas:not(.has-mobile-drawer),
39
+ .boot-layout.has-full-canvas .boot-layout__canvas {
40
+ top: 46px;
41
+ height: calc(100vh - 46px);
42
+ }
43
+
44
+ .boot-layout__mobile-sidebar-drawer {
45
+ top: 46px;
46
+ }
47
+ }
48
+ }
package/src/style.scss CHANGED
@@ -1,6 +1,7 @@
1
1
  @use "@wordpress/theme/src/prebuilt/css/design-tokens.css" as *;
2
2
  @use "@wordpress/base-styles/mixins" as *;
3
3
  @use "@wordpress/base-styles/variables" as *;
4
+ @use "./experimental-admin-bar-in-editor.scss" as *;
4
5
 
5
6
  .boot-layout-container .boot-layout {
6
7
  // On mobile the main content area has to scroll, otherwise you can invoke