Update to Kirki 4.2.0

This commit is contained in:
AlxMedia 2023-08-04 15:41:48 +02:00
parent cbfd4f27e4
commit 77ecd4ca69
440 changed files with 6230 additions and 5211 deletions

View file

@ -0,0 +1,21 @@
MIT License
Copyright (c) 2019 kirki-framework
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

View file

@ -0,0 +1,2 @@
.kirki-tooltip-wrapper{position:relative;z-index:5}.kirki-tooltip-wrapper .tooltip-trigger{left:3px;position:relative;text-decoration:none;top:0}.kirki-tooltip-wrapper .tooltip-trigger:hover+.tooltip-content{bottom:32px;opacity:1;visibility:visible;z-index:99999}.kirki-tooltip-wrapper .tooltip-trigger .dashicons{font-size:18px;height:18px;width:18px}.kirki-tooltip-wrapper .tooltip-content{background:#000;border-radius:3px;bottom:29px;color:#fff;font-size:13px;height:fit-content;left:0;line-height:1.4em;min-width:275px;opacity:0;padding:7px;position:absolute;transition:all .2s linear;visibility:hidden;width:100%;z-index:-1}.kirki-tooltip-wrapper .tooltip-content a{color:#00a0d2}
/*# sourceMappingURL=control.css.map */

View file

@ -0,0 +1 @@
{"mappings":"AAAA,uBACC,iBAAA,CACA,SCCD,CDCC,wCAGC,QAAA,CAFA,iBAAA,CAGA,oBAAA,CAFA,KCGF,CDEG,+DACC,WAAA,CACA,SAAA,CACA,kBAAA,CACA,aCAJ,CDIE,mDACC,cAAA,CAEA,WAAA,CADA,UCDH,CDMC,wCAWC,eAAA,CACA,iBAAA,CAVA,WAAA,CAOA,UAAA,CADA,cAAA,CADA,kBAAA,CAJA,MAAA,CAOA,iBAAA,CALA,eAAA,CAQA,SAAA,CATA,WAAA,CAHA,iBAAA,CAeA,yBAAA,CAFA,iBAAA,CARA,UAAA,CASA,UCHF,CDmBE,0CACC,aCjBH","sources":["packages/kirki-framework/module-tooltips/src/control.scss","%3Cinput%20css%20gZwkcc%3E"],"sourcesContent":[".kirki-tooltip-wrapper {\n\tposition: relative;\n\tz-index: 5; // 2 is enough, but.. just to be safe.\n\n\t.tooltip-trigger {\n\t\tposition: relative;\n\t\ttop: 0;\n\t\tleft: 3px;\n\t\ttext-decoration: none;\n\n\t\t&:hover {\n\t\t\t+ .tooltip-content {\n\t\t\t\tbottom: 32px;\n\t\t\t\topacity: 1;\n\t\t\t\tvisibility: visible;\n\t\t\t\tz-index: 99999;\n\t\t\t}\n\t\t}\n\n\t\t.dashicons {\n\t\t\tfont-size: 18px;\n\t\t\twidth: 18px;\n\t\t\theight: 18px;\n\t\t}\n\t}\n\n\t.tooltip-content {\n\t\tposition: absolute;\n\t\tbottom: 29px;\n\t\tleft: 0;\n\t\tpadding: 7px;\n\t\tmin-width: 275px;\n\t\twidth: 100%;\n\t\theight: fit-content;\n\t\tfont-size: 13px;\n\t\tcolor: #fff;\n\t\tline-height: 1.4em;\n\t\tbackground: #000;\n\t\tborder-radius: 3px;\n\t\topacity: 0;\n\t\tvisibility: hidden;\n\t\tz-index: -1;\n\t\ttransition: all 0.2s linear;\n\n\t\t/// We might want to bring it back in the future.\n\t\t// &::before {\n\t\t// \tcontent: '';\n\t\t// \tposition: absolute;\n\t\t// \tbottom: -6px;\n\t\t// \tdisplay: block;\n\t\t// \twidth: 0;\n\t\t// \theight: 0;\n\t\t// \tborder-left: 10px solid transparent;\n\t\t// \tborder-right: 10px solid transparent;\n\t\t// \tborder-top: 10px solid #000;\n\t\t// }\n\n\t\ta {\n\t\t\tcolor: #00a0d2;\n\t\t}\n\t}\n}\n\n/*# sourceMappingURL=tooltip.css.map */\n",".kirki-tooltip-wrapper {\n position: relative;\n z-index: 5;\n}\n.kirki-tooltip-wrapper .tooltip-trigger {\n position: relative;\n top: 0;\n left: 3px;\n text-decoration: none;\n}\n.kirki-tooltip-wrapper .tooltip-trigger:hover + .tooltip-content {\n bottom: 32px;\n opacity: 1;\n visibility: visible;\n z-index: 99999;\n}\n.kirki-tooltip-wrapper .tooltip-trigger .dashicons {\n font-size: 18px;\n width: 18px;\n height: 18px;\n}\n.kirki-tooltip-wrapper .tooltip-content {\n position: absolute;\n bottom: 29px;\n left: 0;\n padding: 7px;\n min-width: 275px;\n width: 100%;\n height: fit-content;\n font-size: 13px;\n color: #fff;\n line-height: 1.4em;\n background: #000;\n border-radius: 3px;\n opacity: 0;\n visibility: hidden;\n z-index: -1;\n transition: all 0.2s linear;\n}\n.kirki-tooltip-wrapper .tooltip-content a {\n color: #00a0d2;\n}\n\n/*# sourceMappingURL=tooltip.css.map */\n/*# sourceMappingURL=control.css.map */\n"],"names":[],"version":3,"file":"control.css.map"}

View file

@ -0,0 +1,2 @@
!function(){function t(t){_.each(kirkiTooltips,(function(n){if(n.id===t.id&&!t.container.find(".tooltip-content").length){var i=document.querySelector("#customize-control-"+n.id+" .customize-control-title");if(i){i.classList.add("kirki-tooltip-wrapper");var o='<span class="tooltip-content">'+n.content+"</span>",e=jQuery(i);jQuery('<span class="tooltip-trigger"><span class="dashicons dashicons-editor-help"></span></span>').appendTo(e),jQuery(o).appendTo(e)}}}))}jQuery(document).ready((function(){var n=[];wp.customize.control.each((function(i){n.includes(i.section())||n.push(i.section()),wp.customize.section(i.section(),(function(n){n.expanded()||wp.customize.settings.autofocus.control===i.id?t(i):n.expanded.bind((function(n){n&&t(i)}))}))})),jQuery("head").append(jQuery('<style class="kirki-tooltip-inline-styles"></style>'));var i=jQuery(".kirki-tooltip-inline-styles"),o=jQuery(".wp-full-overlay-sidebar-content");n.forEach((function(t){wp.customize.section(t,(function(t){t.expanded.bind((function(n){n&&(t.contentContainer[0].scrollHeight>o.height()?i.html(".kirki-tooltip-wrapper span.tooltip-content {min-width: 258px;}"):i.empty())}))}))}))}))}();
//# sourceMappingURL=control.js.map

View file

@ -0,0 +1 @@
{"mappings":"YAE0B,SACjBA,EAAiBC,GACzBC,EAAEC,KAAMC,eAAe,SAAWC,GACjC,GAAKA,EAAQC,KAAOL,EAAQK,KAIvBL,EAAQM,UAAUC,KAAM,oBAAqBC,OAAlD,CAEA,IAAMC,EAASC,SAASC,cACvB,sBAAwBP,EAAQC,GAAK,6BAGtC,GAAOI,EAAP,CACAA,EAAOG,UAAUC,IAAK,yBAGtB,IAIMC,EACL,iCAAmCV,EAAQU,QAAU,UAEhDC,EAAUC,OAAQP,GAGxBO,OATC,8FASiBC,SAAUF,GAC5BC,OAAQF,GAAUG,SAAUF,QAI9BC,OAAQN,UAAWQ,OAAO,WACzB,IAAIC,EAAe,GAEnBC,GAAGC,UAAUrB,QAAQE,MAAM,SAAWF,GAC9BmB,EAAaG,SAAUtB,EAAQuB,YACrCJ,EAAaK,KAAMxB,EAAQuB,WAG5BH,GAAGC,UAAUE,QAASvB,EAAQuB,WAAW,SAAWA,GAElDA,EAAQE,YACRL,GAAGC,UAAUK,SAASC,UAAU3B,UAAYA,EAAQK,GAEpDN,EAAiBC,GAEjBuB,EAAQE,SAASG,MAAM,SAAWH,GAC5BA,GACJ1B,EAAiBC,YAOtBgB,OAAQ,QAASa,OAChBb,OAAQ,wDAGT,IAAMc,EAAkBd,OAAQ,gCAC1Be,EAAkBf,OAAQ,oCAEhCG,EAAaa,SAAS,SAAWC,GAChCb,GAAGC,UAAUE,QAASU,GAAa,SAAWV,GAC7CA,EAAQE,SAASG,MAAM,SAAWH,GAC5BA,IAEHF,EAAQW,iBAAiB,GAAGC,aAC5BJ,EAAgBK,SAEhBN,EAAgBO,KACf,mEAGDP,EAAgBQ","sources":["packages/kirki-framework/module-tooltips/src/control.js"],"sourcesContent":["import './control.scss';\n\n/* global kirkiTooltips */\nfunction kirkiTooltipAdd( control ) {\n\t_.each( kirkiTooltips, function ( tooltip ) {\n\t\tif ( tooltip.id !== control.id ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( control.container.find( '.tooltip-content' ).length ) return;\n\n\t\tconst target = document.querySelector(\n\t\t\t'#customize-control-' + tooltip.id + ' .customize-control-title'\n\t\t);\n\n\t\tif ( ! target ) return;\n\t\ttarget.classList.add( 'kirki-tooltip-wrapper' );\n\n\t\t// Build the tooltip trigger.\n\t\tconst trigger =\n\t\t\t'<span class=\"tooltip-trigger\"><span class=\"dashicons dashicons-editor-help\"></span></span>';\n\n\t\t// Build the tooltip content.\n\t\tconst content =\n\t\t\t'<span class=\"tooltip-content\">' + tooltip.content + '</span>';\n\n\t\tconst $target = jQuery( target );\n\n\t\t// Append the trigger & content next to the control's title.\n\t\tjQuery( trigger ).appendTo( $target );\n\t\tjQuery( content ).appendTo( $target );\n\t} );\n}\n\njQuery( document ).ready( function () {\n\tlet sectionNames = [];\n\n\twp.customize.control.each( function ( control ) {\n\t\tif ( ! sectionNames.includes( control.section() ) ) {\n\t\t\tsectionNames.push( control.section() );\n\t\t}\n\n\t\twp.customize.section( control.section(), function ( section ) {\n\t\t\tif (\n\t\t\t\tsection.expanded() ||\n\t\t\t\twp.customize.settings.autofocus.control === control.id\n\t\t\t) {\n\t\t\t\tkirkiTooltipAdd( control );\n\t\t\t} else {\n\t\t\t\tsection.expanded.bind( function ( expanded ) {\n\t\t\t\t\tif ( expanded ) {\n\t\t\t\t\t\tkirkiTooltipAdd( control );\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t}\n\t\t} );\n\t} );\n\n\tjQuery( 'head' ).append(\n\t\tjQuery( '<style class=\"kirki-tooltip-inline-styles\"></style>' )\n\t);\n\n\tconst $tooltipStyleEl = jQuery( '.kirki-tooltip-inline-styles' );\n\tconst $sidebarOverlay = jQuery( '.wp-full-overlay-sidebar-content' );\n\n\tsectionNames.forEach( function ( sectionName ) {\n\t\twp.customize.section( sectionName, function ( section ) {\n\t\t\tsection.expanded.bind( function ( expanded ) {\n\t\t\t\tif ( expanded ) {\n\t\t\t\t\tif (\n\t\t\t\t\t\tsection.contentContainer[0].scrollHeight >\n\t\t\t\t\t\t$sidebarOverlay.height()\n\t\t\t\t\t) {\n\t\t\t\t\t\t$tooltipStyleEl.html(\n\t\t\t\t\t\t\t'.kirki-tooltip-wrapper span.tooltip-content {min-width: 258px;}'\n\t\t\t\t\t\t);\n\t\t\t\t\t} else {\n\t\t\t\t\t\t$tooltipStyleEl.empty();\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} );\n\t\t} );\n\t} );\n} );\n"],"names":["$1a3e97217cc9f59a$var$kirkiTooltipAdd","control","_","each","kirkiTooltips","tooltip","id","container","find","length","target","document","querySelector","classList","add","content","$target","jQuery","appendTo","ready","sectionNames","wp","customize","includes","section","push","expanded","settings","autofocus","bind","append","$tooltipStyleEl","$sidebarOverlay","forEach","sectionName","contentContainer","scrollHeight","height","html","empty"],"version":3,"file":"control.js.map"}

View file

@ -0,0 +1,79 @@
<?php
/**
* Injects tooltips to controls when the 'tooltip' argument is used.
*
* @package Kirki
* @category Modules
* @author Themeum
* @copyright Copyright (c) 2023, Themeum
* @license https://opensource.org/licenses/MIT
* @since 1.0
*/
namespace Kirki\Module;
use Kirki\URL;
/**
* Adds the tooltips.
*
* @since 1.0
*/
class Tooltips {
/**
* An array containing field identifieds and their tooltips.
*
* @access private
* @since 1.0
* @var array
*/
private $tooltips_content = [];
/**
* The class constructor
*
* @access public
* @since 1.0
*/
public function __construct() {
add_action( 'customize_controls_print_footer_scripts', [ $this, 'customize_controls_print_footer_scripts' ] );
add_filter( 'kirki_field_add_control_args', [ $this, 'filter_control_args' ], 10, 2 );
}
/**
* Enqueue scripts.
*
* @access public
* @since 1.0
*/
public function customize_controls_print_footer_scripts() {
wp_enqueue_style( 'kirki-tooltip', URL::get_from_path( dirname( __DIR__ ) . '/dist/control.css' ), [], '1.0.10' );
wp_enqueue_script( 'kirki-tooltip', URL::get_from_path( dirname( __DIR__ ) . '/dist/control.js' ), [ 'jquery' ], '1.0.10', false );
wp_localize_script( 'kirki-tooltip', 'kirkiTooltips', $this->tooltips_content );
}
/**
* Filter control args.
*
* @access public
* @since 1.0
* @param array $args The field arguments.
* @param WP_Customize_Manager $wp_customize The customizer instance.
* @return array
*/
public function filter_control_args( $args, $wp_customize ) {
if ( isset( $args['tooltip'] ) && $args['tooltip'] ) {
$this->tooltips_content[ $args['settings'] ] = [
'id' => sanitize_key( $args['settings'] ),
'content' => wp_kses_post( $args['tooltip'] ),
];
}
return $args;
}
}

View file

@ -0,0 +1,84 @@
import './control.scss';
/* global kirkiTooltips */
function kirkiTooltipAdd( control ) {
_.each( kirkiTooltips, function ( tooltip ) {
if ( tooltip.id !== control.id ) {
return;
}
if ( control.container.find( '.tooltip-content' ).length ) return;
const target = document.querySelector(
'#customize-control-' + tooltip.id + ' .customize-control-title'
);
if ( ! target ) return;
target.classList.add( 'kirki-tooltip-wrapper' );
// Build the tooltip trigger.
const trigger =
'<span class="tooltip-trigger"><span class="dashicons dashicons-editor-help"></span></span>';
// Build the tooltip content.
const content =
'<span class="tooltip-content">' + tooltip.content + '</span>';
const $target = jQuery( target );
// Append the trigger & content next to the control's title.
jQuery( trigger ).appendTo( $target );
jQuery( content ).appendTo( $target );
} );
}
jQuery( document ).ready( function () {
let sectionNames = [];
wp.customize.control.each( function ( control ) {
if ( ! sectionNames.includes( control.section() ) ) {
sectionNames.push( control.section() );
}
wp.customize.section( control.section(), function ( section ) {
if (
section.expanded() ||
wp.customize.settings.autofocus.control === control.id
) {
kirkiTooltipAdd( control );
} else {
section.expanded.bind( function ( expanded ) {
if ( expanded ) {
kirkiTooltipAdd( control );
}
} );
}
} );
} );
jQuery( 'head' ).append(
jQuery( '<style class="kirki-tooltip-inline-styles"></style>' )
);
const $tooltipStyleEl = jQuery( '.kirki-tooltip-inline-styles' );
const $sidebarOverlay = jQuery( '.wp-full-overlay-sidebar-content' );
sectionNames.forEach( function ( sectionName ) {
wp.customize.section( sectionName, function ( section ) {
section.expanded.bind( function ( expanded ) {
if ( expanded ) {
if (
section.contentContainer[0].scrollHeight >
$sidebarOverlay.height()
) {
$tooltipStyleEl.html(
'.kirki-tooltip-wrapper span.tooltip-content {min-width: 258px;}'
);
} else {
$tooltipStyleEl.empty();
}
}
} );
} );
} );
} );

View file

@ -0,0 +1,64 @@
.kirki-tooltip-wrapper {
position: relative;
z-index: 5; // 2 is enough, but.. just to be safe.
.tooltip-trigger {
position: relative;
top: 0;
left: 3px;
text-decoration: none;
&:hover {
+ .tooltip-content {
bottom: 32px;
opacity: 1;
visibility: visible;
z-index: 99999;
}
}
.dashicons {
font-size: 18px;
width: 18px;
height: 18px;
}
}
.tooltip-content {
position: absolute;
bottom: 29px;
left: 0;
padding: 7px;
min-width: 275px;
width: 100%;
height: fit-content;
font-size: 13px;
color: #fff;
line-height: 1.4em;
background: #000;
border-radius: 3px;
opacity: 0;
visibility: hidden;
z-index: -1;
transition: all 0.2s linear;
/// We might want to bring it back in the future.
// &::before {
// content: '';
// position: absolute;
// bottom: -6px;
// display: block;
// width: 0;
// height: 0;
// border-left: 10px solid transparent;
// border-right: 10px solid transparent;
// border-top: 10px solid #000;
// }
a {
color: #00a0d2;
}
}
}
/*# sourceMappingURL=tooltip.css.map */