@wordpress/customize-widgets 3.1.1 → 3.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -2,6 +2,10 @@
2
2
 
3
3
  ## Unreleased
4
4
 
5
+ ## 3.3.0 (2022-04-08)
6
+
7
+ ## 3.2.0 (2022-03-23)
8
+
5
9
  ## 3.1.0 (2022-03-11)
6
10
 
7
11
  ## 3.0.0 (2022-02-10)
@@ -26,6 +26,11 @@ function getSidebarSection() {
26
26
  customize
27
27
  }
28
28
  } = window;
29
+ const reduceMotionMediaQuery = window.matchMedia('(prefers-reduced-motion: reduce)');
30
+ let isReducedMotion = reduceMotionMediaQuery.matches;
31
+ reduceMotionMediaQuery.addEventListener('change', event => {
32
+ isReducedMotion = event.matches;
33
+ });
29
34
  return class SidebarSection extends customize.Section {
30
35
  ready() {
31
36
  const InspectorSection = (0, _inspectorSection.default)();
@@ -64,18 +69,21 @@ function getSidebarSection() {
64
69
  this.contentContainer.addClass(['busy', 'open']);
65
70
  this.contentContainer.removeClass('is-sub-section-open');
66
71
  this.contentContainer.closest('.wp-full-overlay').addClass('section-open');
67
- this.contentContainer.one('transitionend', () => {
68
- this.contentContainer.removeClass('busy');
69
- args.completeCallback();
70
- });
71
72
  } else {
72
73
  this.contentContainer.addClass(['busy', 'is-sub-section-open']);
73
74
  this.contentContainer.closest('.wp-full-overlay').addClass('section-open');
74
75
  this.contentContainer.removeClass('open');
75
- this.contentContainer.one('transitionend', () => {
76
- this.contentContainer.removeClass('busy');
77
- args.completeCallback();
78
- });
76
+ }
77
+
78
+ const handleTransitionEnd = () => {
79
+ this.contentContainer.removeClass('busy');
80
+ args.completeCallback();
81
+ };
82
+
83
+ if (isReducedMotion) {
84
+ handleTransitionEnd();
85
+ } else {
86
+ this.contentContainer.one('transitionend', handleTransitionEnd);
79
87
  }
80
88
  } else {
81
89
  super.onChangeExpanded(expanded, args);
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/customize-widgets/src/controls/sidebar-section.js"],"names":["getInspectorSectionId","sidebarId","getSidebarSection","wp","customize","window","SidebarSection","Section","ready","InspectorSection","inspector","id","title","parentSection","customizeAction","params","join","section","add","contentContainer","classList","hasSubSectionOpened","expanded","onChangeExpanded","_args","controls","args","completeCallback","forEach","control","onChangeSectionExpanded","manualTransition","addClass","removeClass","closest","one"],"mappings":";;;;;;;;;AAGA;;AAKA;;AARA;AACA;AACA;;AAGA;AACA;AACA;AAGA,MAAMA,qBAAqB,GAAKC,SAAF,IAC5B,qBAAqBA,SAAW,EADlC;;AAGe,SAASC,iBAAT,GAA6B;AAC3C,QAAM;AACLC,IAAAA,EAAE,EAAE;AAAEC,MAAAA;AAAF;AADC,MAEFC,MAFJ;AAIA,SAAO,MAAMC,cAAN,SAA6BF,SAAS,CAACG,OAAvC,CAA+C;AACrDC,IAAAA,KAAK,GAAG;AACP,YAAMC,gBAAgB,GAAG,gCAAzB;AACA,WAAKC,SAAL,GAAiB,IAAID,gBAAJ,CAChBT,qBAAqB,CAAE,KAAKW,EAAP,CADL,EAEhB;AACCC,QAAAA,KAAK,EAAE,cAAI,gBAAJ,CADR;AAECC,QAAAA,aAAa,EAAE,IAFhB;AAGCC,QAAAA,eAAe,EAAE,CAChB,cAAI,aAAJ,CADgB,EAEhB,cAAI,SAAJ,CAFgB,EAGhB,KAAKC,MAAL,CAAYH,KAHI,EAIfI,IAJe,CAIT,KAJS;AAHlB,OAFgB,CAAjB;AAYAZ,MAAAA,SAAS,CAACa,OAAV,CAAkBC,GAAlB,CAAuB,KAAKR,SAA5B;AACA,WAAKS,gBAAL,CAAuB,CAAvB,EAA2BC,SAA3B,CAAqCF,GAArC,CACC,oCADD;AAGA;;AACDG,IAAAA,mBAAmB,GAAG;AACrB,aAAO,KAAKX,SAAL,CAAeY,QAAf,EAAP;AACA;;AACDC,IAAAA,gBAAgB,CAAED,QAAF,EAAYE,KAAZ,EAAoB;AACnC,YAAMC,QAAQ,GAAG,KAAKA,QAAL,EAAjB;AACA,YAAMC,IAAI,GAAG,EACZ,GAAGF,KADS;;AAEZG,QAAAA,gBAAgB,GAAG;AAAA;;AAClBF,UAAAA,QAAQ,CAACG,OAAT,CAAoBC,OAAF,IAAe;AAAA;;AAChC,qCAAAA,OAAO,CAACC,uBAAR,qFAAAD,OAAO,EAA4BP,QAA5B,EAAsCI,IAAtC,CAAP;AACA,WAFD;AAGA,mCAAAF,KAAK,CAACG,gBAAN,qFAAAH,KAAK;AACL;;AAPW,OAAb;;AAUA,UAAKE,IAAI,CAACK,gBAAV,EAA6B;AAC5B,YAAKT,QAAL,EAAgB;AACf,eAAKH,gBAAL,CAAsBa,QAAtB,CAAgC,CAAE,MAAF,EAAU,MAAV,CAAhC;AACA,eAAKb,gBAAL,CAAsBc,WAAtB,CAAmC,qBAAnC;AACA,eAAKd,gBAAL,CACEe,OADF,CACW,kBADX,EAEEF,QAFF,CAEY,cAFZ;AAGA,eAAKb,gBAAL,CAAsBgB,GAAtB,CAA2B,eAA3B,EAA4C,MAAM;AACjD,iBAAKhB,gBAAL,CAAsBc,WAAtB,CAAmC,MAAnC;AACAP,YAAAA,IAAI,CAACC,gBAAL;AACA,WAHD;AAIA,SAVD,MAUO;AACN,eAAKR,gBAAL,CAAsBa,QAAtB,CAAgC,CAC/B,MAD+B,EAE/B,qBAF+B,CAAhC;AAIA,eAAKb,gBAAL,CACEe,OADF,CACW,kBADX,EAEEF,QAFF,CAEY,cAFZ;AAGA,eAAKb,gBAAL,CAAsBc,WAAtB,CAAmC,MAAnC;AACA,eAAKd,gBAAL,CAAsBgB,GAAtB,CAA2B,eAA3B,EAA4C,MAAM;AACjD,iBAAKhB,gBAAL,CAAsBc,WAAtB,CAAmC,MAAnC;AACAP,YAAAA,IAAI,CAACC,gBAAL;AACA,WAHD;AAIA;AACD,OAzBD,MAyBO;AACN,cAAMJ,gBAAN,CAAwBD,QAAxB,EAAkCI,IAAlC;AACA;AACD;;AA/DoD,GAAtD;AAiEA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport getInspectorSection from './inspector-section';\n\nconst getInspectorSectionId = ( sidebarId ) =>\n\t`widgets-inspector-${ sidebarId }`;\n\nexport default function getSidebarSection() {\n\tconst {\n\t\twp: { customize },\n\t} = window;\n\n\treturn class SidebarSection extends customize.Section {\n\t\tready() {\n\t\t\tconst InspectorSection = getInspectorSection();\n\t\t\tthis.inspector = new InspectorSection(\n\t\t\t\tgetInspectorSectionId( this.id ),\n\t\t\t\t{\n\t\t\t\t\ttitle: __( 'Block Settings' ),\n\t\t\t\t\tparentSection: this,\n\t\t\t\t\tcustomizeAction: [\n\t\t\t\t\t\t__( 'Customizing' ),\n\t\t\t\t\t\t__( 'Widgets' ),\n\t\t\t\t\t\tthis.params.title,\n\t\t\t\t\t].join( ' ▸ ' ),\n\t\t\t\t}\n\t\t\t);\n\t\t\tcustomize.section.add( this.inspector );\n\t\t\tthis.contentContainer[ 0 ].classList.add(\n\t\t\t\t'customize-widgets__sidebar-section'\n\t\t\t);\n\t\t}\n\t\thasSubSectionOpened() {\n\t\t\treturn this.inspector.expanded();\n\t\t}\n\t\tonChangeExpanded( expanded, _args ) {\n\t\t\tconst controls = this.controls();\n\t\t\tconst args = {\n\t\t\t\t..._args,\n\t\t\t\tcompleteCallback() {\n\t\t\t\t\tcontrols.forEach( ( control ) => {\n\t\t\t\t\t\tcontrol.onChangeSectionExpanded?.( expanded, args );\n\t\t\t\t\t} );\n\t\t\t\t\t_args.completeCallback?.();\n\t\t\t\t},\n\t\t\t};\n\n\t\t\tif ( args.manualTransition ) {\n\t\t\t\tif ( expanded ) {\n\t\t\t\t\tthis.contentContainer.addClass( [ 'busy', 'open' ] );\n\t\t\t\t\tthis.contentContainer.removeClass( 'is-sub-section-open' );\n\t\t\t\t\tthis.contentContainer\n\t\t\t\t\t\t.closest( '.wp-full-overlay' )\n\t\t\t\t\t\t.addClass( 'section-open' );\n\t\t\t\t\tthis.contentContainer.one( 'transitionend', () => {\n\t\t\t\t\t\tthis.contentContainer.removeClass( 'busy' );\n\t\t\t\t\t\targs.completeCallback();\n\t\t\t\t\t} );\n\t\t\t\t} else {\n\t\t\t\t\tthis.contentContainer.addClass( [\n\t\t\t\t\t\t'busy',\n\t\t\t\t\t\t'is-sub-section-open',\n\t\t\t\t\t] );\n\t\t\t\t\tthis.contentContainer\n\t\t\t\t\t\t.closest( '.wp-full-overlay' )\n\t\t\t\t\t\t.addClass( 'section-open' );\n\t\t\t\t\tthis.contentContainer.removeClass( 'open' );\n\t\t\t\t\tthis.contentContainer.one( 'transitionend', () => {\n\t\t\t\t\t\tthis.contentContainer.removeClass( 'busy' );\n\t\t\t\t\t\targs.completeCallback();\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tsuper.onChangeExpanded( expanded, args );\n\t\t\t}\n\t\t}\n\t};\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/customize-widgets/src/controls/sidebar-section.js"],"names":["getInspectorSectionId","sidebarId","getSidebarSection","wp","customize","window","reduceMotionMediaQuery","matchMedia","isReducedMotion","matches","addEventListener","event","SidebarSection","Section","ready","InspectorSection","inspector","id","title","parentSection","customizeAction","params","join","section","add","contentContainer","classList","hasSubSectionOpened","expanded","onChangeExpanded","_args","controls","args","completeCallback","forEach","control","onChangeSectionExpanded","manualTransition","addClass","removeClass","closest","handleTransitionEnd","one"],"mappings":";;;;;;;;;AAGA;;AAKA;;AARA;AACA;AACA;;AAGA;AACA;AACA;AAGA,MAAMA,qBAAqB,GAAKC,SAAF,IAC5B,qBAAqBA,SAAW,EADlC;;AAGe,SAASC,iBAAT,GAA6B;AAC3C,QAAM;AACLC,IAAAA,EAAE,EAAE;AAAEC,MAAAA;AAAF;AADC,MAEFC,MAFJ;AAIA,QAAMC,sBAAsB,GAAGD,MAAM,CAACE,UAAP,CAC9B,kCAD8B,CAA/B;AAGA,MAAIC,eAAe,GAAGF,sBAAsB,CAACG,OAA7C;AACAH,EAAAA,sBAAsB,CAACI,gBAAvB,CAAyC,QAAzC,EAAqDC,KAAF,IAAa;AAC/DH,IAAAA,eAAe,GAAGG,KAAK,CAACF,OAAxB;AACA,GAFD;AAIA,SAAO,MAAMG,cAAN,SAA6BR,SAAS,CAACS,OAAvC,CAA+C;AACrDC,IAAAA,KAAK,GAAG;AACP,YAAMC,gBAAgB,GAAG,gCAAzB;AACA,WAAKC,SAAL,GAAiB,IAAID,gBAAJ,CAChBf,qBAAqB,CAAE,KAAKiB,EAAP,CADL,EAEhB;AACCC,QAAAA,KAAK,EAAE,cAAI,gBAAJ,CADR;AAECC,QAAAA,aAAa,EAAE,IAFhB;AAGCC,QAAAA,eAAe,EAAE,CAChB,cAAI,aAAJ,CADgB,EAEhB,cAAI,SAAJ,CAFgB,EAGhB,KAAKC,MAAL,CAAYH,KAHI,EAIfI,IAJe,CAIT,KAJS;AAHlB,OAFgB,CAAjB;AAYAlB,MAAAA,SAAS,CAACmB,OAAV,CAAkBC,GAAlB,CAAuB,KAAKR,SAA5B;AACA,WAAKS,gBAAL,CAAuB,CAAvB,EAA2BC,SAA3B,CAAqCF,GAArC,CACC,oCADD;AAGA;;AACDG,IAAAA,mBAAmB,GAAG;AACrB,aAAO,KAAKX,SAAL,CAAeY,QAAf,EAAP;AACA;;AACDC,IAAAA,gBAAgB,CAAED,QAAF,EAAYE,KAAZ,EAAoB;AACnC,YAAMC,QAAQ,GAAG,KAAKA,QAAL,EAAjB;AACA,YAAMC,IAAI,GAAG,EACZ,GAAGF,KADS;;AAEZG,QAAAA,gBAAgB,GAAG;AAAA;;AAClBF,UAAAA,QAAQ,CAACG,OAAT,CAAoBC,OAAF,IAAe;AAAA;;AAChC,qCAAAA,OAAO,CAACC,uBAAR,qFAAAD,OAAO,EAA4BP,QAA5B,EAAsCI,IAAtC,CAAP;AACA,WAFD;AAGA,mCAAAF,KAAK,CAACG,gBAAN,qFAAAH,KAAK;AACL;;AAPW,OAAb;;AAUA,UAAKE,IAAI,CAACK,gBAAV,EAA6B;AAC5B,YAAKT,QAAL,EAAgB;AACf,eAAKH,gBAAL,CAAsBa,QAAtB,CAAgC,CAAE,MAAF,EAAU,MAAV,CAAhC;AACA,eAAKb,gBAAL,CAAsBc,WAAtB,CAAmC,qBAAnC;AACA,eAAKd,gBAAL,CACEe,OADF,CACW,kBADX,EAEEF,QAFF,CAEY,cAFZ;AAGA,SAND,MAMO;AACN,eAAKb,gBAAL,CAAsBa,QAAtB,CAAgC,CAC/B,MAD+B,EAE/B,qBAF+B,CAAhC;AAIA,eAAKb,gBAAL,CACEe,OADF,CACW,kBADX,EAEEF,QAFF,CAEY,cAFZ;AAGA,eAAKb,gBAAL,CAAsBc,WAAtB,CAAmC,MAAnC;AACA;;AAED,cAAME,mBAAmB,GAAG,MAAM;AACjC,eAAKhB,gBAAL,CAAsBc,WAAtB,CAAmC,MAAnC;AACAP,UAAAA,IAAI,CAACC,gBAAL;AACA,SAHD;;AAKA,YAAKzB,eAAL,EAAuB;AACtBiC,UAAAA,mBAAmB;AACnB,SAFD,MAEO;AACN,eAAKhB,gBAAL,CAAsBiB,GAAtB,CACC,eADD,EAECD,mBAFD;AAIA;AACD,OA/BD,MA+BO;AACN,cAAMZ,gBAAN,CAAwBD,QAAxB,EAAkCI,IAAlC;AACA;AACD;;AArEoD,GAAtD;AAuEA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport getInspectorSection from './inspector-section';\n\nconst getInspectorSectionId = ( sidebarId ) =>\n\t`widgets-inspector-${ sidebarId }`;\n\nexport default function getSidebarSection() {\n\tconst {\n\t\twp: { customize },\n\t} = window;\n\n\tconst reduceMotionMediaQuery = window.matchMedia(\n\t\t'(prefers-reduced-motion: reduce)'\n\t);\n\tlet isReducedMotion = reduceMotionMediaQuery.matches;\n\treduceMotionMediaQuery.addEventListener( 'change', ( event ) => {\n\t\tisReducedMotion = event.matches;\n\t} );\n\n\treturn class SidebarSection extends customize.Section {\n\t\tready() {\n\t\t\tconst InspectorSection = getInspectorSection();\n\t\t\tthis.inspector = new InspectorSection(\n\t\t\t\tgetInspectorSectionId( this.id ),\n\t\t\t\t{\n\t\t\t\t\ttitle: __( 'Block Settings' ),\n\t\t\t\t\tparentSection: this,\n\t\t\t\t\tcustomizeAction: [\n\t\t\t\t\t\t__( 'Customizing' ),\n\t\t\t\t\t\t__( 'Widgets' ),\n\t\t\t\t\t\tthis.params.title,\n\t\t\t\t\t].join( ' ▸ ' ),\n\t\t\t\t}\n\t\t\t);\n\t\t\tcustomize.section.add( this.inspector );\n\t\t\tthis.contentContainer[ 0 ].classList.add(\n\t\t\t\t'customize-widgets__sidebar-section'\n\t\t\t);\n\t\t}\n\t\thasSubSectionOpened() {\n\t\t\treturn this.inspector.expanded();\n\t\t}\n\t\tonChangeExpanded( expanded, _args ) {\n\t\t\tconst controls = this.controls();\n\t\t\tconst args = {\n\t\t\t\t..._args,\n\t\t\t\tcompleteCallback() {\n\t\t\t\t\tcontrols.forEach( ( control ) => {\n\t\t\t\t\t\tcontrol.onChangeSectionExpanded?.( expanded, args );\n\t\t\t\t\t} );\n\t\t\t\t\t_args.completeCallback?.();\n\t\t\t\t},\n\t\t\t};\n\n\t\t\tif ( args.manualTransition ) {\n\t\t\t\tif ( expanded ) {\n\t\t\t\t\tthis.contentContainer.addClass( [ 'busy', 'open' ] );\n\t\t\t\t\tthis.contentContainer.removeClass( 'is-sub-section-open' );\n\t\t\t\t\tthis.contentContainer\n\t\t\t\t\t\t.closest( '.wp-full-overlay' )\n\t\t\t\t\t\t.addClass( 'section-open' );\n\t\t\t\t} else {\n\t\t\t\t\tthis.contentContainer.addClass( [\n\t\t\t\t\t\t'busy',\n\t\t\t\t\t\t'is-sub-section-open',\n\t\t\t\t\t] );\n\t\t\t\t\tthis.contentContainer\n\t\t\t\t\t\t.closest( '.wp-full-overlay' )\n\t\t\t\t\t\t.addClass( 'section-open' );\n\t\t\t\t\tthis.contentContainer.removeClass( 'open' );\n\t\t\t\t}\n\n\t\t\t\tconst handleTransitionEnd = () => {\n\t\t\t\t\tthis.contentContainer.removeClass( 'busy' );\n\t\t\t\t\targs.completeCallback();\n\t\t\t\t};\n\n\t\t\t\tif ( isReducedMotion ) {\n\t\t\t\t\thandleTransitionEnd();\n\t\t\t\t} else {\n\t\t\t\t\tthis.contentContainer.one(\n\t\t\t\t\t\t'transitionend',\n\t\t\t\t\t\thandleTransitionEnd\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tsuper.onChangeExpanded( expanded, args );\n\t\t\t}\n\t\t}\n\t};\n}\n"]}
@@ -16,6 +16,11 @@ export default function getSidebarSection() {
16
16
  customize
17
17
  }
18
18
  } = window;
19
+ const reduceMotionMediaQuery = window.matchMedia('(prefers-reduced-motion: reduce)');
20
+ let isReducedMotion = reduceMotionMediaQuery.matches;
21
+ reduceMotionMediaQuery.addEventListener('change', event => {
22
+ isReducedMotion = event.matches;
23
+ });
19
24
  return class SidebarSection extends customize.Section {
20
25
  ready() {
21
26
  const InspectorSection = getInspectorSection();
@@ -54,18 +59,21 @@ export default function getSidebarSection() {
54
59
  this.contentContainer.addClass(['busy', 'open']);
55
60
  this.contentContainer.removeClass('is-sub-section-open');
56
61
  this.contentContainer.closest('.wp-full-overlay').addClass('section-open');
57
- this.contentContainer.one('transitionend', () => {
58
- this.contentContainer.removeClass('busy');
59
- args.completeCallback();
60
- });
61
62
  } else {
62
63
  this.contentContainer.addClass(['busy', 'is-sub-section-open']);
63
64
  this.contentContainer.closest('.wp-full-overlay').addClass('section-open');
64
65
  this.contentContainer.removeClass('open');
65
- this.contentContainer.one('transitionend', () => {
66
- this.contentContainer.removeClass('busy');
67
- args.completeCallback();
68
- });
66
+ }
67
+
68
+ const handleTransitionEnd = () => {
69
+ this.contentContainer.removeClass('busy');
70
+ args.completeCallback();
71
+ };
72
+
73
+ if (isReducedMotion) {
74
+ handleTransitionEnd();
75
+ } else {
76
+ this.contentContainer.one('transitionend', handleTransitionEnd);
69
77
  }
70
78
  } else {
71
79
  super.onChangeExpanded(expanded, args);
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/customize-widgets/src/controls/sidebar-section.js"],"names":["__","getInspectorSection","getInspectorSectionId","sidebarId","getSidebarSection","wp","customize","window","SidebarSection","Section","ready","InspectorSection","inspector","id","title","parentSection","customizeAction","params","join","section","add","contentContainer","classList","hasSubSectionOpened","expanded","onChangeExpanded","_args","controls","args","completeCallback","forEach","control","onChangeSectionExpanded","manualTransition","addClass","removeClass","closest","one"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,OAAOC,mBAAP,MAAgC,qBAAhC;;AAEA,MAAMC,qBAAqB,GAAKC,SAAF,IAC5B,qBAAqBA,SAAW,EADlC;;AAGA,eAAe,SAASC,iBAAT,GAA6B;AAC3C,QAAM;AACLC,IAAAA,EAAE,EAAE;AAAEC,MAAAA;AAAF;AADC,MAEFC,MAFJ;AAIA,SAAO,MAAMC,cAAN,SAA6BF,SAAS,CAACG,OAAvC,CAA+C;AACrDC,IAAAA,KAAK,GAAG;AACP,YAAMC,gBAAgB,GAAGV,mBAAmB,EAA5C;AACA,WAAKW,SAAL,GAAiB,IAAID,gBAAJ,CAChBT,qBAAqB,CAAE,KAAKW,EAAP,CADL,EAEhB;AACCC,QAAAA,KAAK,EAAEd,EAAE,CAAE,gBAAF,CADV;AAECe,QAAAA,aAAa,EAAE,IAFhB;AAGCC,QAAAA,eAAe,EAAE,CAChBhB,EAAE,CAAE,aAAF,CADc,EAEhBA,EAAE,CAAE,SAAF,CAFc,EAGhB,KAAKiB,MAAL,CAAYH,KAHI,EAIfI,IAJe,CAIT,KAJS;AAHlB,OAFgB,CAAjB;AAYAZ,MAAAA,SAAS,CAACa,OAAV,CAAkBC,GAAlB,CAAuB,KAAKR,SAA5B;AACA,WAAKS,gBAAL,CAAuB,CAAvB,EAA2BC,SAA3B,CAAqCF,GAArC,CACC,oCADD;AAGA;;AACDG,IAAAA,mBAAmB,GAAG;AACrB,aAAO,KAAKX,SAAL,CAAeY,QAAf,EAAP;AACA;;AACDC,IAAAA,gBAAgB,CAAED,QAAF,EAAYE,KAAZ,EAAoB;AACnC,YAAMC,QAAQ,GAAG,KAAKA,QAAL,EAAjB;AACA,YAAMC,IAAI,GAAG,EACZ,GAAGF,KADS;;AAEZG,QAAAA,gBAAgB,GAAG;AAAA;;AAClBF,UAAAA,QAAQ,CAACG,OAAT,CAAoBC,OAAF,IAAe;AAAA;;AAChC,qCAAAA,OAAO,CAACC,uBAAR,qFAAAD,OAAO,EAA4BP,QAA5B,EAAsCI,IAAtC,CAAP;AACA,WAFD;AAGA,mCAAAF,KAAK,CAACG,gBAAN,qFAAAH,KAAK;AACL;;AAPW,OAAb;;AAUA,UAAKE,IAAI,CAACK,gBAAV,EAA6B;AAC5B,YAAKT,QAAL,EAAgB;AACf,eAAKH,gBAAL,CAAsBa,QAAtB,CAAgC,CAAE,MAAF,EAAU,MAAV,CAAhC;AACA,eAAKb,gBAAL,CAAsBc,WAAtB,CAAmC,qBAAnC;AACA,eAAKd,gBAAL,CACEe,OADF,CACW,kBADX,EAEEF,QAFF,CAEY,cAFZ;AAGA,eAAKb,gBAAL,CAAsBgB,GAAtB,CAA2B,eAA3B,EAA4C,MAAM;AACjD,iBAAKhB,gBAAL,CAAsBc,WAAtB,CAAmC,MAAnC;AACAP,YAAAA,IAAI,CAACC,gBAAL;AACA,WAHD;AAIA,SAVD,MAUO;AACN,eAAKR,gBAAL,CAAsBa,QAAtB,CAAgC,CAC/B,MAD+B,EAE/B,qBAF+B,CAAhC;AAIA,eAAKb,gBAAL,CACEe,OADF,CACW,kBADX,EAEEF,QAFF,CAEY,cAFZ;AAGA,eAAKb,gBAAL,CAAsBc,WAAtB,CAAmC,MAAnC;AACA,eAAKd,gBAAL,CAAsBgB,GAAtB,CAA2B,eAA3B,EAA4C,MAAM;AACjD,iBAAKhB,gBAAL,CAAsBc,WAAtB,CAAmC,MAAnC;AACAP,YAAAA,IAAI,CAACC,gBAAL;AACA,WAHD;AAIA;AACD,OAzBD,MAyBO;AACN,cAAMJ,gBAAN,CAAwBD,QAAxB,EAAkCI,IAAlC;AACA;AACD;;AA/DoD,GAAtD;AAiEA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport getInspectorSection from './inspector-section';\n\nconst getInspectorSectionId = ( sidebarId ) =>\n\t`widgets-inspector-${ sidebarId }`;\n\nexport default function getSidebarSection() {\n\tconst {\n\t\twp: { customize },\n\t} = window;\n\n\treturn class SidebarSection extends customize.Section {\n\t\tready() {\n\t\t\tconst InspectorSection = getInspectorSection();\n\t\t\tthis.inspector = new InspectorSection(\n\t\t\t\tgetInspectorSectionId( this.id ),\n\t\t\t\t{\n\t\t\t\t\ttitle: __( 'Block Settings' ),\n\t\t\t\t\tparentSection: this,\n\t\t\t\t\tcustomizeAction: [\n\t\t\t\t\t\t__( 'Customizing' ),\n\t\t\t\t\t\t__( 'Widgets' ),\n\t\t\t\t\t\tthis.params.title,\n\t\t\t\t\t].join( ' ▸ ' ),\n\t\t\t\t}\n\t\t\t);\n\t\t\tcustomize.section.add( this.inspector );\n\t\t\tthis.contentContainer[ 0 ].classList.add(\n\t\t\t\t'customize-widgets__sidebar-section'\n\t\t\t);\n\t\t}\n\t\thasSubSectionOpened() {\n\t\t\treturn this.inspector.expanded();\n\t\t}\n\t\tonChangeExpanded( expanded, _args ) {\n\t\t\tconst controls = this.controls();\n\t\t\tconst args = {\n\t\t\t\t..._args,\n\t\t\t\tcompleteCallback() {\n\t\t\t\t\tcontrols.forEach( ( control ) => {\n\t\t\t\t\t\tcontrol.onChangeSectionExpanded?.( expanded, args );\n\t\t\t\t\t} );\n\t\t\t\t\t_args.completeCallback?.();\n\t\t\t\t},\n\t\t\t};\n\n\t\t\tif ( args.manualTransition ) {\n\t\t\t\tif ( expanded ) {\n\t\t\t\t\tthis.contentContainer.addClass( [ 'busy', 'open' ] );\n\t\t\t\t\tthis.contentContainer.removeClass( 'is-sub-section-open' );\n\t\t\t\t\tthis.contentContainer\n\t\t\t\t\t\t.closest( '.wp-full-overlay' )\n\t\t\t\t\t\t.addClass( 'section-open' );\n\t\t\t\t\tthis.contentContainer.one( 'transitionend', () => {\n\t\t\t\t\t\tthis.contentContainer.removeClass( 'busy' );\n\t\t\t\t\t\targs.completeCallback();\n\t\t\t\t\t} );\n\t\t\t\t} else {\n\t\t\t\t\tthis.contentContainer.addClass( [\n\t\t\t\t\t\t'busy',\n\t\t\t\t\t\t'is-sub-section-open',\n\t\t\t\t\t] );\n\t\t\t\t\tthis.contentContainer\n\t\t\t\t\t\t.closest( '.wp-full-overlay' )\n\t\t\t\t\t\t.addClass( 'section-open' );\n\t\t\t\t\tthis.contentContainer.removeClass( 'open' );\n\t\t\t\t\tthis.contentContainer.one( 'transitionend', () => {\n\t\t\t\t\t\tthis.contentContainer.removeClass( 'busy' );\n\t\t\t\t\t\targs.completeCallback();\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tsuper.onChangeExpanded( expanded, args );\n\t\t\t}\n\t\t}\n\t};\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/customize-widgets/src/controls/sidebar-section.js"],"names":["__","getInspectorSection","getInspectorSectionId","sidebarId","getSidebarSection","wp","customize","window","reduceMotionMediaQuery","matchMedia","isReducedMotion","matches","addEventListener","event","SidebarSection","Section","ready","InspectorSection","inspector","id","title","parentSection","customizeAction","params","join","section","add","contentContainer","classList","hasSubSectionOpened","expanded","onChangeExpanded","_args","controls","args","completeCallback","forEach","control","onChangeSectionExpanded","manualTransition","addClass","removeClass","closest","handleTransitionEnd","one"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport getInspectorSection from './inspector-section';\n\nconst getInspectorSectionId = ( sidebarId ) =>\n\t`widgets-inspector-${ sidebarId }`;\n\nexport default function getSidebarSection() {\n\tconst {\n\t\twp: { customize },\n\t} = window;\n\n\tconst reduceMotionMediaQuery = window.matchMedia(\n\t\t'(prefers-reduced-motion: reduce)'\n\t);\n\tlet isReducedMotion = reduceMotionMediaQuery.matches;\n\treduceMotionMediaQuery.addEventListener( 'change', ( event ) => {\n\t\tisReducedMotion = event.matches;\n\t} );\n\n\treturn class SidebarSection extends customize.Section {\n\t\tready() {\n\t\t\tconst InspectorSection = getInspectorSection();\n\t\t\tthis.inspector = new InspectorSection(\n\t\t\t\tgetInspectorSectionId( this.id ),\n\t\t\t\t{\n\t\t\t\t\ttitle: __( 'Block Settings' ),\n\t\t\t\t\tparentSection: this,\n\t\t\t\t\tcustomizeAction: [\n\t\t\t\t\t\t__( 'Customizing' ),\n\t\t\t\t\t\t__( 'Widgets' ),\n\t\t\t\t\t\tthis.params.title,\n\t\t\t\t\t].join( ' ▸ ' ),\n\t\t\t\t}\n\t\t\t);\n\t\t\tcustomize.section.add( this.inspector );\n\t\t\tthis.contentContainer[ 0 ].classList.add(\n\t\t\t\t'customize-widgets__sidebar-section'\n\t\t\t);\n\t\t}\n\t\thasSubSectionOpened() {\n\t\t\treturn this.inspector.expanded();\n\t\t}\n\t\tonChangeExpanded( expanded, _args ) {\n\t\t\tconst controls = this.controls();\n\t\t\tconst args = {\n\t\t\t\t..._args,\n\t\t\t\tcompleteCallback() {\n\t\t\t\t\tcontrols.forEach( ( control ) => {\n\t\t\t\t\t\tcontrol.onChangeSectionExpanded?.( expanded, args );\n\t\t\t\t\t} );\n\t\t\t\t\t_args.completeCallback?.();\n\t\t\t\t},\n\t\t\t};\n\n\t\t\tif ( args.manualTransition ) {\n\t\t\t\tif ( expanded ) {\n\t\t\t\t\tthis.contentContainer.addClass( [ 'busy', 'open' ] );\n\t\t\t\t\tthis.contentContainer.removeClass( 'is-sub-section-open' );\n\t\t\t\t\tthis.contentContainer\n\t\t\t\t\t\t.closest( '.wp-full-overlay' )\n\t\t\t\t\t\t.addClass( 'section-open' );\n\t\t\t\t} else {\n\t\t\t\t\tthis.contentContainer.addClass( [\n\t\t\t\t\t\t'busy',\n\t\t\t\t\t\t'is-sub-section-open',\n\t\t\t\t\t] );\n\t\t\t\t\tthis.contentContainer\n\t\t\t\t\t\t.closest( '.wp-full-overlay' )\n\t\t\t\t\t\t.addClass( 'section-open' );\n\t\t\t\t\tthis.contentContainer.removeClass( 'open' );\n\t\t\t\t}\n\n\t\t\t\tconst handleTransitionEnd = () => {\n\t\t\t\t\tthis.contentContainer.removeClass( 'busy' );\n\t\t\t\t\targs.completeCallback();\n\t\t\t\t};\n\n\t\t\t\tif ( isReducedMotion ) {\n\t\t\t\t\thandleTransitionEnd();\n\t\t\t\t} else {\n\t\t\t\t\tthis.contentContainer.one(\n\t\t\t\t\t\t'transitionend',\n\t\t\t\t\t\thandleTransitionEnd\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tsuper.onChangeExpanded( expanded, args );\n\t\t\t}\n\t\t}\n\t};\n}\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordpress/customize-widgets",
3
- "version": "3.1.1",
3
+ "version": "3.3.1",
4
4
  "description": "Widgets blocks in Customizer Module for WordPress.",
5
5
  "author": "The WordPress Contributors",
6
6
  "license": "GPL-2.0-or-later",
@@ -24,25 +24,25 @@
24
24
  "react-native": "src/index",
25
25
  "dependencies": {
26
26
  "@babel/runtime": "^7.16.0",
27
- "@wordpress/block-editor": "^8.3.1",
28
- "@wordpress/block-library": "^7.1.1",
29
- "@wordpress/blocks": "^11.3.1",
30
- "@wordpress/components": "^19.6.1",
31
- "@wordpress/compose": "^5.2.1",
32
- "@wordpress/core-data": "^4.2.1",
33
- "@wordpress/data": "^6.4.1",
34
- "@wordpress/dom": "^3.4.1",
35
- "@wordpress/element": "^4.2.1",
36
- "@wordpress/hooks": "^3.4.1",
37
- "@wordpress/i18n": "^4.4.1",
38
- "@wordpress/icons": "^8.0.1",
39
- "@wordpress/interface": "^4.3.1",
40
- "@wordpress/is-shallow-equal": "^4.4.1",
41
- "@wordpress/keyboard-shortcuts": "^3.2.1",
42
- "@wordpress/keycodes": "^3.4.1",
43
- "@wordpress/media-utils": "^3.2.1",
44
- "@wordpress/preferences": "^1.0.0",
45
- "@wordpress/widgets": "^2.2.1",
27
+ "@wordpress/block-editor": "^8.5.1",
28
+ "@wordpress/block-library": "^7.3.1",
29
+ "@wordpress/blocks": "^11.5.1",
30
+ "@wordpress/components": "^19.8.0",
31
+ "@wordpress/compose": "^5.4.0",
32
+ "@wordpress/core-data": "^4.4.1",
33
+ "@wordpress/data": "^6.6.0",
34
+ "@wordpress/dom": "^3.6.0",
35
+ "@wordpress/element": "^4.4.0",
36
+ "@wordpress/hooks": "^3.6.0",
37
+ "@wordpress/i18n": "^4.6.0",
38
+ "@wordpress/icons": "^8.2.0",
39
+ "@wordpress/interface": "^4.5.0",
40
+ "@wordpress/is-shallow-equal": "^4.6.0",
41
+ "@wordpress/keyboard-shortcuts": "^3.4.0",
42
+ "@wordpress/keycodes": "^3.6.0",
43
+ "@wordpress/media-utils": "^3.4.0",
44
+ "@wordpress/preferences": "^1.2.0",
45
+ "@wordpress/widgets": "^2.4.1",
46
46
  "classnames": "^2.3.1",
47
47
  "lodash": "^4.17.21"
48
48
  },
@@ -53,5 +53,5 @@
53
53
  "publishConfig": {
54
54
  "access": "public"
55
55
  },
56
- "gitHead": "3494eafea7cb345728166c902b3d1223c4a8db6f"
56
+ "gitHead": "9c15c669843d53c5ca6024a4c486d01d819d123f"
57
57
  }
@@ -16,6 +16,14 @@ export default function getSidebarSection() {
16
16
  wp: { customize },
17
17
  } = window;
18
18
 
19
+ const reduceMotionMediaQuery = window.matchMedia(
20
+ '(prefers-reduced-motion: reduce)'
21
+ );
22
+ let isReducedMotion = reduceMotionMediaQuery.matches;
23
+ reduceMotionMediaQuery.addEventListener( 'change', ( event ) => {
24
+ isReducedMotion = event.matches;
25
+ } );
26
+
19
27
  return class SidebarSection extends customize.Section {
20
28
  ready() {
21
29
  const InspectorSection = getInspectorSection();
@@ -58,10 +66,6 @@ export default function getSidebarSection() {
58
66
  this.contentContainer
59
67
  .closest( '.wp-full-overlay' )
60
68
  .addClass( 'section-open' );
61
- this.contentContainer.one( 'transitionend', () => {
62
- this.contentContainer.removeClass( 'busy' );
63
- args.completeCallback();
64
- } );
65
69
  } else {
66
70
  this.contentContainer.addClass( [
67
71
  'busy',
@@ -71,10 +75,20 @@ export default function getSidebarSection() {
71
75
  .closest( '.wp-full-overlay' )
72
76
  .addClass( 'section-open' );
73
77
  this.contentContainer.removeClass( 'open' );
74
- this.contentContainer.one( 'transitionend', () => {
75
- this.contentContainer.removeClass( 'busy' );
76
- args.completeCallback();
77
- } );
78
+ }
79
+
80
+ const handleTransitionEnd = () => {
81
+ this.contentContainer.removeClass( 'busy' );
82
+ args.completeCallback();
83
+ };
84
+
85
+ if ( isReducedMotion ) {
86
+ handleTransitionEnd();
87
+ } else {
88
+ this.contentContainer.one(
89
+ 'transitionend',
90
+ handleTransitionEnd
91
+ );
78
92
  }
79
93
  } else {
80
94
  super.onChangeExpanded( expanded, args );