| @@ -7,15 +7,8 @@ | ||
| 7 | 7 | module.exports = (function() { return this["React"]; }()); |
| 8 | 8 | |
| 9 | 9 | /***/ }, |
| 10 | 10 | |
| 11 | -/***/ 419 | |
| 12 | -(module) { | |
| 13 | - | |
| 14 | -module.exports = (function() { return this["lodash"]; }()); | |
| 15 | - | |
| 16 | -/***/ }, | |
| 17 | - | |
| 18 | 11 | /***/ 631 |
| 19 | 12 | (module) { |
| 20 | 13 | |
| 21 | 14 | module.exports = (function() { return this["wp"]["apiFetch"]; }()); |
| @@ -77,8 +70,15 @@ | ||
| 77 | 70 | module.exports = (function() { return this["wp"]["i18n"]; }()); |
| 78 | 71 | |
| 79 | 72 | /***/ }, |
| 80 | 73 | |
| 74 | +/***/ 672 | |
| 75 | +(module) { | |
| 76 | + | |
| 77 | +module.exports = (function() { return this["wp"]["notices"]; }()); | |
| 78 | + | |
| 79 | +/***/ }, | |
| 80 | + | |
| 81 | 81 | /***/ 933 |
| 82 | 82 | (module) { |
| 83 | 83 | |
| 84 | 84 | module.exports = (function() { return this["wp"]["primitives"]; }()); |
| @@ -217,138 +217,327 @@ | ||
| 217 | 217 | d: "M11 7H9.49c-.63 0-1.25.3-1.59.7L7 5H4.13l-2.39 7h1.69l.74-2H7v4H2c-1.1 0-2-.9-2-2V5c0-1.1.9-2 2-2h7c1.1 0 2 .9 2 2v2zM6.51 9H4.49l1-2.93zM10 8h7c1.1 0 2 .9 2 2v7c0 1.1-.9 2-2 2h-7c-1.1 0-2-.9-2-2v-7c0-1.1.9-2 2-2zm7.25 5v-1.08h-3.17V9.75h-1.16v2.17H9.75V13h1.28c.11.85.56 1.85 1.28 2.62-.87.36-1.89.62-2.31.62-.01.02.22.97.2 1.46.84 0 2.21-.5 3.28-1.15 1.09.65 2.48 1.15 3.34 1.15-.02-.49.2-1.44.2-1.46-.43 0-1.49-.27-2.38-.63.7-.77 1.14-1.77 1.25-2.61h1.36zm-3.81 1.93c-.5-.46-.85-1.13-1.01-1.93h2.09c-.17.8-.51 1.47-1 1.93l-.04.03s-.03-.02-.04-.03z" |
| 218 | 218 | }) |
| 219 | 219 | }) : 'translation'; |
| 220 | 220 | /* harmony default export */ const icons_translation = (translation); |
| 221 | -// EXTERNAL MODULE: external {"this":["wp","i18n"]} | |
| 222 | -var external_this_wp_i18n_ = __webpack_require__(75); | |
| 221 | +;// ./js/src/blocks/language-switcher/deprecated.js | |
| 222 | +/** | |
| 223 | + * Deprecated language switcher block. | |
| 224 | + */ | |
| 225 | + | |
| 226 | +const V2Attributes = { | |
| 227 | + layout: 'vertical', | |
| 228 | + show_labels: 'names', | |
| 229 | + show_flags: false, | |
| 230 | + force_home: false, | |
| 231 | + hide_current: false, | |
| 232 | + hide_if_no_translation: false, | |
| 233 | + flag_aspect_ratio: '3:2', | |
| 234 | + flag_border_radius: 0, | |
| 235 | + flag_width: '18px', | |
| 236 | + flag_label_spacing: '0.3em', | |
| 237 | + className: '' | |
| 238 | +}; | |
| 239 | +const v1 = { | |
| 240 | + attributes: { | |
| 241 | + dropdown: { | |
| 242 | + type: 'boolean', | |
| 243 | + default: false | |
| 244 | + }, | |
| 245 | + show_names: { | |
| 246 | + type: 'boolean', | |
| 247 | + default: true | |
| 248 | + }, | |
| 249 | + show_flags: { | |
| 250 | + type: 'boolean', | |
| 251 | + default: false | |
| 252 | + }, | |
| 253 | + force_home: { | |
| 254 | + type: 'boolean', | |
| 255 | + default: false | |
| 256 | + }, | |
| 257 | + hide_current: { | |
| 258 | + type: 'boolean', | |
| 259 | + default: false | |
| 260 | + }, | |
| 261 | + hide_if_no_translation: { | |
| 262 | + type: 'boolean', | |
| 263 | + default: false | |
| 264 | + }, | |
| 265 | + className: { | |
| 266 | + type: 'string', | |
| 267 | + default: '' | |
| 268 | + } | |
| 269 | + }, | |
| 270 | + isEligible: attributes => 'dropdown' in attributes || 'show_names' in attributes, | |
| 271 | + migrate(attributes) { | |
| 272 | + const { | |
| 273 | + dropdown, | |
| 274 | + show_names, | |
| 275 | + show_flags, | |
| 276 | + force_home, | |
| 277 | + hide_current, | |
| 278 | + hide_if_no_translation, | |
| 279 | + className | |
| 280 | + } = attributes; | |
| 281 | + return { | |
| 282 | + ...V2Attributes, | |
| 283 | + layout: dropdown ? 'select' : 'vertical', | |
| 284 | + show_labels: show_names ? 'names' : '', | |
| 285 | + show_flags: show_names ? show_flags : true, | |
| 286 | + force_home, | |
| 287 | + hide_current, | |
| 288 | + hide_if_no_translation, | |
| 289 | + className: className || '' | |
| 290 | + }; | |
| 291 | + } | |
| 292 | +}; | |
| 293 | +/* harmony default export */ const deprecated = ([v1]); | |
| 223 | 294 | // EXTERNAL MODULE: external {"this":["wp","blockEditor"]} |
| 224 | 295 | var external_this_wp_blockEditor_ = __webpack_require__(89); |
| 225 | 296 | // EXTERNAL MODULE: external {"this":["wp","components"]} |
| 226 | 297 | var external_this_wp_components_ = __webpack_require__(959); |
| 227 | -// EXTERNAL MODULE: external "lodash" | |
| 228 | -var external_lodash_ = __webpack_require__(419); | |
| 229 | -;// ./js/src/blocks/language-switcher-edit.js | |
| 298 | +// EXTERNAL MODULE: external {"this":["wp","apiFetch"]} | |
| 299 | +var external_this_wp_apiFetch_ = __webpack_require__(631); | |
| 300 | +var external_this_wp_apiFetch_default = /*#__PURE__*/__webpack_require__.n(external_this_wp_apiFetch_); | |
| 301 | +// EXTERNAL MODULE: external {"this":["wp","element"]} | |
| 302 | +var external_this_wp_element_ = __webpack_require__(601); | |
| 303 | +;// ./node_modules/@wpsyntex/polylang-react-library/build/hooks/use-languages-list.js | |
| 230 | 304 | /** |
| 231 | - * Language switcher block edit. | |
| 305 | + * WordPress dependencies | |
| 232 | 306 | */ |
| 233 | 307 | |
| 308 | + | |
| 309 | + | |
| 234 | 310 | /** |
| 235 | - * External dependencies | |
| 311 | + * Custom hook to get the languages list. | |
| 312 | + * | |
| 313 | + * @return {Array|null} The languages list, `null` if not loaded yet. | |
| 236 | 314 | */ |
| 315 | +const useLanguagesList = () => { | |
| 316 | + const [languages, setLanguages] = (0,external_this_wp_element_.useState)(null); | |
| 317 | + (0,external_this_wp_element_.useEffect)(() => { | |
| 318 | + external_this_wp_apiFetch_default()({ | |
| 319 | + path: '/pll/v1/languages', | |
| 320 | + method: 'GET' | |
| 321 | + }).then(response => setLanguages(response)); | |
| 322 | + }, []); | |
| 323 | + return languages; | |
| 324 | +}; | |
| 325 | +;// ./node_modules/@wpsyntex/polylang-react-library/build/hooks/use-curated-languages.js | |
| 326 | +/** | |
| 327 | + * WordPress dependencies | |
| 328 | + */ | |
| 237 | 329 | |
| 238 | 330 | |
| 239 | 331 | /** |
| 332 | + * Hook to curate the languages. | |
| 333 | + * Returns an array of languages ensuring that the current language is always the first one. | |
| 334 | + * | |
| 335 | + * @param {Object[]} languages The languages. | |
| 336 | + * @param {Object} currentLanguage The current language. | |
| 337 | + * @param {boolean} reduceToOneItem Whether to reduce the languages to one item. | |
| 338 | + * @return {Object[]} The curated languages. | |
| 339 | + */ | |
| 340 | +const useCuratedLanguages = (languages, currentLanguage, reduceToOneItem) => { | |
| 341 | + const curatedLanguages = (0,external_this_wp_element_.useMemo)(() => { | |
| 342 | + if (!currentLanguage) { | |
| 343 | + return []; | |
| 344 | + } | |
| 345 | + if (reduceToOneItem) { | |
| 346 | + return [currentLanguage]; | |
| 347 | + } | |
| 348 | + return [currentLanguage, ...languages.filter(language => { | |
| 349 | + return language.slug !== currentLanguage.slug; | |
| 350 | + })]; | |
| 351 | + }, [languages, currentLanguage, reduceToOneItem]); | |
| 352 | + return curatedLanguages; | |
| 353 | +}; | |
| 354 | +;// ./node_modules/@wpsyntex/polylang-react-library/build/icons/submenu.js | |
| 355 | +/** | |
| 356 | + * Submenu icon | |
| 357 | + */ | |
| 358 | + | |
| 359 | +/** | |
| 240 | 360 | * WordPress dependencies |
| 241 | 361 | */ |
| 242 | 362 | |
| 243 | 363 | |
| 244 | -const i18nAttributeStrings = pll_block_editor_blocks_settings; | |
| 245 | -function createLanguageSwitcherEdit(props) { | |
| 246 | - const createToggleAttribute = function (propName) { | |
| 247 | - return () => { | |
| 248 | - const value = props.attributes[propName]; | |
| 249 | - const { | |
| 250 | - setAttributes | |
| 251 | - } = props; | |
| 252 | - let updatedAttributes = { | |
| 253 | - [propName]: !value | |
| 254 | - }; | |
| 255 | - let forcedAttributeName; | |
| 256 | - let forcedAttributeUnchecked; | |
| 364 | +const submenu_isPrimitivesComponents = 'undefined' !== typeof wp.primitives; | |
| 365 | +const SubmenuIcon = () => submenu_isPrimitivesComponents ? /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_primitives_.SVG, { | |
| 366 | + xmlns: "http://www.w3.org/2000/svg", | |
| 367 | + width: "12", | |
| 368 | + height: "12", | |
| 369 | + viewBox: "0 0 12 12", | |
| 370 | + fill: "none", | |
| 371 | + children: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_primitives_.Path, { | |
| 372 | + d: "M1.50002 4L6.00002 8L10.5 4", | |
| 373 | + strokeWidth: "1.5" | |
| 374 | + }) | |
| 375 | +}) : 'submenu'; | |
| 376 | +/* harmony default export */ const submenu = (SubmenuIcon); | |
| 377 | +;// ./js/src/blocks/components/switcher-link-element.js | |
| 257 | 378 | |
| 258 | - // Both show_names and show_flags attributes can't be unchecked together. | |
| 259 | - switch (propName) { | |
| 260 | - case 'show_names': | |
| 261 | - forcedAttributeName = 'show_flags'; | |
| 262 | - forcedAttributeUnchecked = !props.attributes[forcedAttributeName]; | |
| 263 | - break; | |
| 264 | - case 'show_flags': | |
| 265 | - forcedAttributeName = 'show_names'; | |
| 266 | - forcedAttributeUnchecked = !props.attributes[forcedAttributeName]; | |
| 267 | - break; | |
| 268 | - } | |
| 269 | - if ('show_names' === propName || 'show_flags' === propName) { | |
| 270 | - if (value && forcedAttributeUnchecked) { | |
| 271 | - updatedAttributes = (0,external_lodash_.assign)(updatedAttributes, { | |
| 272 | - [forcedAttributeName]: forcedAttributeUnchecked | |
| 273 | - }); | |
| 274 | - } | |
| 275 | - } | |
| 276 | - setAttributes(updatedAttributes); | |
| 277 | - }; | |
| 278 | - }; | |
| 279 | - const toggleDropdown = createToggleAttribute('dropdown'); | |
| 280 | - const toggleShowNames = createToggleAttribute('show_names'); | |
| 281 | - const toggleShowFlags = createToggleAttribute('show_flags'); | |
| 282 | - const toggleForceHome = createToggleAttribute('force_home'); | |
| 283 | - const toggleHideCurrent = createToggleAttribute('hide_current'); | |
| 284 | - const toggleHideIfNoTranslation = createToggleAttribute('hide_if_no_translation'); | |
| 285 | - const { | |
| 286 | - dropdown, | |
| 287 | - show_names, | |
| 288 | - show_flags, | |
| 289 | - force_home, | |
| 290 | - hide_current, | |
| 291 | - hide_if_no_translation | |
| 292 | - } = props.attributes; | |
| 293 | - function ToggleControlDropdown() { | |
| 294 | - return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.ToggleControl, { | |
| 295 | - label: i18nAttributeStrings.dropdown, | |
| 296 | - checked: dropdown, | |
| 297 | - onChange: toggleDropdown | |
| 298 | - }); | |
| 379 | +/** | |
| 380 | + * Switcher link element component. | |
| 381 | + * | |
| 382 | + * @param {Object} props Component props. | |
| 383 | + * @param {ReactElement} props.flag Flag to display. | |
| 384 | + * @param {string} props.label Label to display. | |
| 385 | + * @param {string} props.labelSpacing CSS length for the space between flag and label. | |
| 386 | + * @return {ReactElement} The Switcher element component. | |
| 387 | + */ | |
| 388 | +const SwitcherLinkElement = ({ | |
| 389 | + flag, | |
| 390 | + label, | |
| 391 | + labelSpacing | |
| 392 | +}) => { | |
| 393 | + const hasLabel = '' !== label; | |
| 394 | + const labelStyle = hasLabel && labelSpacing ? { | |
| 395 | + '--pll-flag-label-spacing': labelSpacing | |
| 396 | + } : undefined; | |
| 397 | + return ( | |
| 398 | + /*#__PURE__*/ | |
| 399 | + // eslint-disable-next-line jsx-a11y/anchor-is-valid | |
| 400 | + (0,react_jsx_runtime_production_min_namespaceFn().jsxs)("a", { | |
| 401 | + href: '#', | |
| 402 | + children: [flag, hasLabel && /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("span", { | |
| 403 | + className: "pll-switcher-label", | |
| 404 | + style: labelStyle, | |
| 405 | + children: label | |
| 406 | + })] | |
| 407 | + }) | |
| 408 | + ); | |
| 409 | +}; | |
| 410 | +;// ./js/src/blocks/components/switcher-utils.js | |
| 411 | +/** | |
| 412 | + * Returns the switcher wrapper class names. | |
| 413 | + * | |
| 414 | + * @param {string} layout The switcher layout. | |
| 415 | + * @param {boolean} showFlags Whether flags are displayed. | |
| 416 | + * @param {string} flagAspectRatio The flag aspect ratio. | |
| 417 | + * @param {string} [alignment] The items alignment. Omitted when unset. | |
| 418 | + * @return {string} The switcher class names. | |
| 419 | + */ | |
| 420 | +const getSwitcherClassName = (layout, showFlags, flagAspectRatio, alignment) => { | |
| 421 | + const classes = ['pll-switcher', `pll-layout-${layout}`]; | |
| 422 | + if (alignment) { | |
| 423 | + classes.push(`pll-alignment-${alignment}`); | |
| 299 | 424 | } |
| 300 | - function ToggleControlShowNames() { | |
| 301 | - return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.ToggleControl, { | |
| 302 | - label: i18nAttributeStrings.show_names, | |
| 303 | - checked: show_names // eslint-disable-line camelcase | |
| 304 | - , | |
| 305 | - onChange: toggleShowNames | |
| 306 | - }); | |
| 425 | + if (showFlags) { | |
| 426 | + classes.push(`pll-aspect-ratio-${flagAspectRatio.replace(':', '')}`); | |
| 307 | 427 | } |
| 308 | - function ToggleControlShowFlags() { | |
| 309 | - return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.ToggleControl, { | |
| 310 | - label: i18nAttributeStrings.show_flags, | |
| 311 | - checked: show_flags // eslint-disable-line camelcase | |
| 312 | - , | |
| 313 | - onChange: toggleShowFlags | |
| 314 | - }); | |
| 428 | + return classes.join(' '); | |
| 429 | +}; | |
| 430 | + | |
| 431 | +/** | |
| 432 | + * Gets the label for a language. | |
| 433 | + * | |
| 434 | + * @param {Object} language The language object. | |
| 435 | + * @param {string} showLabels Whether to show the names. Can be 'names', 'codes' or ''. | |
| 436 | + * @return {string} The label for the language. | |
| 437 | + */ | |
| 438 | +const getLabel = (language, showLabels) => { | |
| 439 | + let label = ''; | |
| 440 | + if (showLabels === 'names') { | |
| 441 | + label = language.name; | |
| 442 | + } else if (showLabels === 'codes') { | |
| 443 | + label = language.slug.toUpperCase(); | |
| 315 | 444 | } |
| 316 | - function ToggleControlForceHome() { | |
| 317 | - return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.ToggleControl, { | |
| 318 | - label: i18nAttributeStrings.force_home, | |
| 319 | - checked: force_home // eslint-disable-line camelcase | |
| 320 | - , | |
| 321 | - onChange: toggleForceHome | |
| 322 | - }); | |
| 445 | + return label; | |
| 446 | +}; | |
| 447 | + | |
| 448 | +/** | |
| 449 | + * Returns the CSS length for the space between flag and label. | |
| 450 | + * | |
| 451 | + * @param {string} showLabels Whether to show labels. Can be 'names', 'codes' or ''. | |
| 452 | + * @param {string} flagLabelSpacing CSS length for the space between flag and label. | |
| 453 | + * @return {string|undefined} The label spacing, or undefined when labels are hidden. | |
| 454 | + */ | |
| 455 | +const getLabelSpacing = (showLabels, flagLabelSpacing) => { | |
| 456 | + if ('' === showLabels) { | |
| 457 | + return undefined; | |
| 323 | 458 | } |
| 324 | - function ToggleControlHideCurrent() { | |
| 325 | - return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.ToggleControl, { | |
| 326 | - label: i18nAttributeStrings.hide_current, | |
| 327 | - checked: hide_current // eslint-disable-line camelcase | |
| 328 | - , | |
| 329 | - onChange: toggleHideCurrent | |
| 459 | + return flagLabelSpacing; | |
| 460 | +}; | |
| 461 | +;// ./js/src/blocks/hooks/use-memoized-flag.js | |
| 462 | +/** | |
| 463 | + * WordPress dependencies | |
| 464 | + */ | |
| 465 | + | |
| 466 | + | |
| 467 | +/** | |
| 468 | + * Strips fixed dimensions from flag HTML markup. | |
| 469 | + * | |
| 470 | + * @param {string} html The flag HTML markup. | |
| 471 | + * @return {string} The flag HTML without fixed dimensions. | |
| 472 | + */ | |
| 473 | + | |
| 474 | +const stripFlagDimensions = html => { | |
| 475 | + return html.replace(/\s(?:width|height)=["'][^"']*["']/gi, '').replace(/\sstyle=["'][^"']*["']/gi, ''); | |
| 476 | +}; | |
| 477 | + | |
| 478 | +/** | |
| 479 | + * Returns a memoized flag element for a language. | |
| 480 | + * | |
| 481 | + * @param {Object} language The language object. | |
| 482 | + * @param {boolean} showFlags Whether to show the flags. | |
| 483 | + * @param {number} flagBorderRadius The border radius of the flags. | |
| 484 | + * @param {string} flagWidth The width of the flags as a CSS length. | |
| 485 | + * @return {ReactElement|null} The flag for the language. | |
| 486 | + */ | |
| 487 | +const useMemoizedFlag = (language, showFlags, flagBorderRadius, flagWidth) => { | |
| 488 | + return (0,external_this_wp_element_.useMemo)(() => { | |
| 489 | + if (!showFlags || !language?.flag) { | |
| 490 | + return null; | |
| 491 | + } | |
| 492 | + return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("span", { | |
| 493 | + className: "pll-switcher-flag", | |
| 494 | + style: { | |
| 495 | + '--pll-flag-border-radius': flagBorderRadius, | |
| 496 | + '--pll-flag-width': flagWidth | |
| 497 | + }, | |
| 498 | + dangerouslySetInnerHTML: { | |
| 499 | + __html: stripFlagDimensions(language.flag) | |
| 500 | + } | |
| 330 | 501 | }); |
| 331 | - } | |
| 332 | - function ToggleControlHideIfNoTranslations() { | |
| 333 | - return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.ToggleControl, { | |
| 334 | - label: i18nAttributeStrings.hide_if_no_translation, | |
| 335 | - checked: hide_if_no_translation // eslint-disable-line camelcase | |
| 336 | - , | |
| 337 | - onChange: toggleHideIfNoTranslation | |
| 338 | - }); | |
| 339 | - } | |
| 340 | - return { | |
| 341 | - ToggleControlDropdown, | |
| 342 | - ToggleControlShowNames, | |
| 343 | - ToggleControlShowFlags, | |
| 344 | - ToggleControlForceHome, | |
| 345 | - ToggleControlHideCurrent, | |
| 346 | - ToggleControlHideIfNoTranslations | |
| 347 | - }; | |
| 348 | -} | |
| 349 | -// EXTERNAL MODULE: external {"this":["wp","element"]} | |
| 350 | -var external_this_wp_element_ = __webpack_require__(601); | |
| 502 | + }, [language?.flag, showFlags, flagBorderRadius, flagWidth]); | |
| 503 | +}; | |
| 504 | +;// ./js/src/blocks/components/switcher-language-link.js | |
| 505 | +/** | |
| 506 | + * Internal dependencies | |
| 507 | + */ | |
| 508 | + | |
| 509 | + | |
| 510 | + | |
| 511 | + | |
| 512 | +/** | |
| 513 | + * Renders a language link for the switcher preview. | |
| 514 | + * | |
| 515 | + * @param {Object} props Component props. | |
| 516 | + * @param {Object} props.language The language object. | |
| 517 | + * @param {string} props.showLabels Whether to show labels. Can be 'names', 'codes' or ''. | |
| 518 | + * @param {boolean} props.showFlags Whether to show the flags. | |
| 519 | + * @param {number} props.flagBorderRadius The border radius of the flags. | |
| 520 | + * @param {string} props.flagWidth The width of the flags as a CSS length. | |
| 521 | + * @param {string|undefined} props.labelSpacing CSS length for the space between flag and label. | |
| 522 | + * @return {ReactElement} The language link element. | |
| 523 | + */ | |
| 524 | + | |
| 525 | +const SwitcherLanguageLink = ({ | |
| 526 | + language, | |
| 527 | + showLabels, | |
| 528 | + showFlags, | |
| 529 | + flagBorderRadius, | |
| 530 | + flagWidth, | |
| 531 | + labelSpacing | |
| 532 | +}) => { | |
| 533 | + const flag = useMemoizedFlag(language, showFlags, flagBorderRadius, flagWidth); | |
| 534 | + return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(SwitcherLinkElement, { | |
| 535 | + label: getLabel(language, showLabels), | |
| 536 | + flag: flag, | |
| 537 | + labelSpacing: labelSpacing | |
| 538 | + }); | |
| 539 | +}; | |
| 351 | 540 | // EXTERNAL MODULE: external {"this":["wp","data"]} |
| 352 | 541 | var external_this_wp_data_ = __webpack_require__(987); |
| 353 | 542 | ;// ./js/src/blocks/hooks/use-current-language-with-editor-context.js |
| 354 | 543 | /** |
| @@ -413,220 +602,394 @@ | ||
| 413 | 602 | * |
| 414 | 603 | * @type {React.Context<null>} |
| 415 | 604 | */ |
| 416 | 605 | const LanguagesContext = (0,external_this_wp_element_.createContext)(null); |
| 417 | -;// ./js/src/blocks/hooks/use-memoized-switcher-label.js | |
| 606 | +;// ./js/src/blocks/language-switcher/rendered-switcher.js | |
| 418 | 607 | /** |
| 419 | 608 | * WordPress dependencies |
| 420 | 609 | */ |
| 421 | -// '@wordpress/element' is provided by WordPress core. | |
| 422 | -// eslint-disable-next-line import/no-extraneous-dependencies | |
| 423 | 610 | |
| 424 | 611 | |
| 425 | 612 | /** |
| 426 | - * Hook to memoize the switcher label. | |
| 427 | - * | |
| 428 | - * @param {Object} language The language object. | |
| 429 | - * @param {boolean} showFlags Whether to show the flags. | |
| 430 | - * @param {boolean} showNames Whether to show the names. | |
| 431 | - * @return {Object} The memoized switcher label containing the text and the flag. | |
| 613 | + * External dependencies | |
| 432 | 614 | */ |
| 433 | -const useMemoizedSwitcherLabel = (language, showFlags, showNames) => { | |
| 434 | - const { | |
| 435 | - text, | |
| 436 | - flag | |
| 437 | - } = (0,external_this_wp_element_.useMemo)(() => { | |
| 438 | - let memoizedText = ''; | |
| 439 | - if (showNames) { | |
| 440 | - if (showFlags) { | |
| 441 | - memoizedText = ` ${language.name}`; | |
| 442 | - } else { | |
| 443 | - memoizedText = language.name; | |
| 444 | - } | |
| 445 | - } | |
| 446 | - const memoizedFlag = showFlags ? language.flag : ''; | |
| 447 | - return { | |
| 448 | - text: memoizedText, | |
| 449 | - flag: memoizedFlag | |
| 450 | - }; | |
| 451 | - }, [language, showFlags, showNames]); | |
| 452 | - return { | |
| 453 | - text, | |
| 454 | - flag | |
| 455 | - }; | |
| 456 | -}; | |
| 457 | -;// ./js/src/blocks/language-switcher/components/switcher-list-element.js | |
| 615 | + | |
| 616 | + | |
| 458 | 617 | /** |
| 459 | 618 | * Internal dependencies |
| 460 | 619 | */ |
| 461 | 620 | |
| 462 | 621 | |
| 463 | -/** | |
| 464 | - * Switcher list element component. | |
| 465 | - * | |
| 466 | - * @param {Object} props Component props. | |
| 467 | - * @param {Object} props.language Language object. | |
| 468 | - * @param {boolean} props.showFlags Whether to show the flags. | |
| 469 | - * @param {boolean} props.showNames Whether to show the names. | |
| 470 | - * @return {ReactElement} The Switcher element component. | |
| 471 | - */ | |
| 472 | 622 | |
| 473 | -const SwitcherListElement = ({ | |
| 474 | - language, | |
| 475 | - showFlags, | |
| 476 | - showNames | |
| 477 | -}) => { | |
| 478 | - const { | |
| 479 | - text, | |
| 480 | - flag | |
| 481 | - } = useMemoizedSwitcherLabel(language, showFlags, showNames); | |
| 482 | - return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsxs)("li", { | |
| 483 | - children: [/*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("span", { | |
| 484 | - dangerouslySetInnerHTML: { | |
| 485 | - __html: flag | |
| 486 | - } | |
| 487 | - }), " ", text, " "] | |
| 488 | - }); | |
| 489 | -}; | |
| 490 | -;// ./js/src/blocks/language-switcher/components/switcher-ui.js | |
| 491 | -/** | |
| 492 | - * Internal dependencies | |
| 493 | - */ | |
| 494 | 623 | |
| 495 | 624 | |
| 496 | 625 | /** |
| 497 | - * Switcher UI component. | |
| 626 | + * Rendered switcher component. | |
| 498 | 627 | * |
| 499 | - * @param {Object} props The component props. | |
| 500 | - * @param {Array} props.languages The languages to display. | |
| 501 | - * @param {boolean} props.showFlags Whether to show the flags. | |
| 502 | - * @param {boolean} props.showNames Whether to show the names. | |
| 503 | - * @param {boolean} props.isDropdown Whether to show the dropdown. | |
| 504 | - * @return {ReactElement} The Switcher UI component. | |
| 628 | + * @param {Object} props The component props. | |
| 629 | + * @param {Object} props.attributes The block attributes. | |
| 630 | + * @return {ReactElement} The rendered switcher. | |
| 505 | 631 | */ |
| 506 | 632 | |
| 507 | -const SwitcherUI = ({ | |
| 508 | - languages, | |
| 509 | - showFlags, | |
| 510 | - showNames, | |
| 511 | - isDropdown | |
| 633 | +const RenderedSwitcher = ({ | |
| 634 | + attributes | |
| 512 | 635 | }) => { |
| 513 | - if (isDropdown) { | |
| 514 | - return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("select", { | |
| 515 | - children: languages.map(language => { | |
| 516 | - return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("option", { | |
| 517 | - value: language.slug, | |
| 518 | - children: language.name | |
| 519 | - }, language.slug); | |
| 636 | + const { | |
| 637 | + layout, | |
| 638 | + show_labels, | |
| 639 | + show_flags, | |
| 640 | + flag_aspect_ratio, | |
| 641 | + flag_border_radius, | |
| 642 | + flag_width, | |
| 643 | + flag_label_spacing, | |
| 644 | + style | |
| 645 | + } = attributes; | |
| 646 | + const { | |
| 647 | + languages | |
| 648 | + } = (0,external_this_wp_element_.useContext)(LanguagesContext); | |
| 649 | + const currentLanguage = useCurrentLanguageWithEditorContext(languages); | |
| 650 | + const curatedLanguages = useCuratedLanguages(languages, currentLanguage, false); | |
| 651 | + const alignment = style?.typography?.textAlign; | |
| 652 | + const switcherClassName = getSwitcherClassName(layout, show_flags, flag_aspect_ratio, alignment); | |
| 653 | + const labelSpacing = getLabelSpacing(show_labels, flag_label_spacing); | |
| 654 | + const linkProps = { | |
| 655 | + showLabels: show_labels, | |
| 656 | + showFlags: show_flags, | |
| 657 | + flagBorderRadius: flag_border_radius, | |
| 658 | + flagWidth: flag_width, | |
| 659 | + labelSpacing | |
| 660 | + }; | |
| 661 | + if (layout === 'dropdown') { | |
| 662 | + const currentLanguageItem = curatedLanguages[0]; | |
| 663 | + return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("nav", { | |
| 664 | + className: switcherClassName, | |
| 665 | + children: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsxs)("div", { | |
| 666 | + className: "pll-switcher-inner", | |
| 667 | + children: [currentLanguageItem && /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(SwitcherLanguageLink, { | |
| 668 | + language: currentLanguageItem, | |
| 669 | + ...linkProps | |
| 670 | + }), /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("button", { | |
| 671 | + className: "pll-submenu-toggle", | |
| 672 | + children: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(submenu, {}) | |
| 673 | + })] | |
| 520 | 674 | }) |
| 521 | 675 | }); |
| 522 | 676 | } |
| 523 | - return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("ul", { | |
| 524 | - children: languages.map(language => { | |
| 525 | - return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(SwitcherListElement, { | |
| 526 | - language: language, | |
| 527 | - showFlags: showFlags, | |
| 528 | - showNames: showNames | |
| 529 | - }, language.slug); | |
| 677 | + if (layout === 'select') { | |
| 678 | + return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("div", { | |
| 679 | + className: switcherClassName, | |
| 680 | + children: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("select", { | |
| 681 | + className: "pll-switcher-select", | |
| 682 | + children: curatedLanguages.map(language => { | |
| 683 | + return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("option", { | |
| 684 | + value: language.slug, | |
| 685 | + children: getLabel(language, show_labels) | |
| 686 | + }, language.slug); | |
| 687 | + }) | |
| 688 | + }) | |
| 689 | + }); | |
| 690 | + } | |
| 691 | + return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("nav", { | |
| 692 | + className: switcherClassName, | |
| 693 | + children: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("ul", { | |
| 694 | + children: curatedLanguages.map(language => { | |
| 695 | + return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("li", { | |
| 696 | + children: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(SwitcherLanguageLink, { | |
| 697 | + language: language, | |
| 698 | + ...linkProps | |
| 699 | + }) | |
| 700 | + }, language.slug); | |
| 701 | + }) | |
| 530 | 702 | }) |
| 531 | 703 | }); |
| 532 | 704 | }; |
| 533 | -;// ./node_modules/@wpsyntex/polylang-react-library/build/hooks/use-curated-languages.js | |
| 705 | +// EXTERNAL MODULE: external {"this":["wp","i18n"]} | |
| 706 | +var external_this_wp_i18n_ = __webpack_require__(75); | |
| 707 | +// EXTERNAL MODULE: external {"this":["wp","notices"]} | |
| 708 | +var external_this_wp_notices_ = __webpack_require__(672); | |
| 709 | +;// ./js/src/blocks/components/switcher-controls.js | |
| 534 | 710 | /** |
| 535 | 711 | * WordPress dependencies |
| 536 | 712 | */ |
| 537 | 713 | |
| 538 | 714 | |
| 539 | -/** | |
| 540 | - * Hook to curate the languages. | |
| 541 | - * Returns an array of languages ensuring that the current language is always the first one. | |
| 542 | - * | |
| 543 | - * @param {Object[]} languages The languages. | |
| 544 | - * @param {Object} currentLanguage The current language. | |
| 545 | - * @param {boolean} reduceToOneItem Whether to reduce the languages to one item. | |
| 546 | - * @return {Object[]} The curated languages. | |
| 547 | - */ | |
| 548 | -const useCuratedLanguages = (languages, currentLanguage, reduceToOneItem) => { | |
| 549 | - const curatedLanguages = (0,external_this_wp_element_.useMemo)(() => { | |
| 550 | - if (!currentLanguage) { | |
| 551 | - return []; | |
| 552 | - } | |
| 553 | - if (reduceToOneItem) { | |
| 554 | - return [currentLanguage]; | |
| 555 | - } | |
| 556 | - return [currentLanguage, ...languages.filter(language => { | |
| 557 | - return language.slug !== currentLanguage.slug; | |
| 558 | - })]; | |
| 559 | - }, [languages, currentLanguage, reduceToOneItem]); | |
| 560 | - return curatedLanguages; | |
| 561 | -}; | |
| 562 | -;// ./js/src/blocks/language-switcher/components/switcher-container.js | |
| 563 | -/** | |
| 564 | - * WordPress dependencies | |
| 565 | - */ | |
| 566 | 715 | |
| 567 | 716 | |
| 568 | -/** | |
| 569 | - * Internal dependencies | |
| 570 | - */ | |
| 571 | 717 | |
| 572 | 718 | |
| 719 | +const CSS_LENGTH_UNITS = [{ | |
| 720 | + value: 'px', | |
| 721 | + label: 'px' | |
| 722 | +}, { | |
| 723 | + value: 'em', | |
| 724 | + label: 'em' | |
| 725 | +}, { | |
| 726 | + value: 'rem', | |
| 727 | + label: 'rem' | |
| 728 | +}, { | |
| 729 | + value: 'vh', | |
| 730 | + label: 'vh' | |
| 731 | +}, { | |
| 732 | + value: 'vw', | |
| 733 | + label: 'vw' | |
| 734 | +}]; | |
| 735 | +const LABEL_SPACING_DEFAULT_VALUE = '0.3em'; | |
| 736 | +const ALL_LAYOUT_OPTIONS = [{ | |
| 737 | + label: (0,external_this_wp_i18n_._x)('Horizontal', 'layout', 'polylang'), | |
| 738 | + value: 'horizontal' | |
| 739 | +}, { | |
| 740 | + label: (0,external_this_wp_i18n_._x)('Vertical', 'layout', 'polylang'), | |
| 741 | + value: 'vertical' | |
| 742 | +}, { | |
| 743 | + label: (0,external_this_wp_i18n_.__)('Dropdown', 'polylang'), | |
| 744 | + value: 'dropdown' | |
| 745 | +}, { | |
| 746 | + label: (0,external_this_wp_i18n_.__)('Selector', 'polylang'), | |
| 747 | + value: 'select' | |
| 748 | +}]; | |
| 749 | +const ALL_LAYOUT_TOOLBAR_CONTROLS = [{ | |
| 750 | + title: (0,external_this_wp_i18n_._x)('Horizontal', 'layout', 'polylang'), | |
| 751 | + layout: 'horizontal' | |
| 752 | +}, { | |
| 753 | + title: (0,external_this_wp_i18n_._x)('Vertical', 'layout', 'polylang'), | |
| 754 | + layout: 'vertical' | |
| 755 | +}, { | |
| 756 | + title: (0,external_this_wp_i18n_.__)('Dropdown', 'polylang'), | |
| 757 | + layout: 'dropdown' | |
| 758 | +}]; | |
| 573 | 759 | |
| 574 | - | |
| 575 | - | |
| 576 | 760 | /** |
| 577 | - * Switcher container component. | |
| 761 | + * Switcher controls component for toolbar and inspector controls. | |
| 578 | 762 | * |
| 579 | - * @param {Object} props The component props. | |
| 580 | - * @param {Object} props.attributes The block attributes. | |
| 581 | - * @return {ReactElement} The Switcher component. | |
| 763 | + * @param {Object} props The component props. | |
| 764 | + * @param {Object} props.attributes The block attributes. | |
| 765 | + * @param {Function} props.setAttributes The function to set the block attributes. | |
| 766 | + * @param {Array<string>} props.layoutOptions Optional layout values to expose. | |
| 767 | + * @return {React.ReactNode} The switcher controls component. | |
| 582 | 768 | */ |
| 583 | - | |
| 584 | -const SwitcherContainer = ({ | |
| 585 | - attributes | |
| 769 | +const SwitcherControls = ({ | |
| 770 | + attributes, | |
| 771 | + setAttributes, | |
| 772 | + layoutOptions = ['horizontal', 'vertical', 'dropdown', 'select'] | |
| 586 | 773 | }) => { |
| 587 | 774 | const { |
| 588 | - dropdown, | |
| 775 | + layout, | |
| 776 | + show_labels, | |
| 589 | 777 | show_flags, |
| 590 | - show_names | |
| 778 | + force_home, | |
| 779 | + hide_current, | |
| 780 | + flag_aspect_ratio, | |
| 781 | + flag_border_radius, | |
| 782 | + flag_width, | |
| 783 | + flag_label_spacing, | |
| 784 | + hide_if_no_translation | |
| 591 | 785 | } = attributes; |
| 592 | 786 | const { |
| 593 | - languages | |
| 594 | - } = (0,external_this_wp_element_.useContext)(LanguagesContext); | |
| 595 | - const currentLanguage = useCurrentLanguageWithEditorContext(languages); | |
| 596 | - const curatedLanguages = useCuratedLanguages(languages, currentLanguage, dropdown); | |
| 597 | - return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(SwitcherUI, { | |
| 598 | - languages: curatedLanguages, | |
| 599 | - showFlags: show_flags, | |
| 600 | - showNames: show_names, | |
| 601 | - isDropdown: dropdown | |
| 787 | + createWarningNotice | |
| 788 | + } = (0,external_this_wp_data_.useDispatch)(external_this_wp_notices_.store); | |
| 789 | + const layoutSelectOptions = ALL_LAYOUT_OPTIONS.filter(option => layoutOptions.includes(option.value)); | |
| 790 | + const layoutToolbarControls = ALL_LAYOUT_TOOLBAR_CONTROLS.filter(control => layoutOptions.includes(control.layout)).map(control => ({ | |
| 791 | + title: control.title, | |
| 792 | + onClick: () => setAttributes({ | |
| 793 | + layout: control.layout | |
| 794 | + }) | |
| 795 | + })); | |
| 796 | + const labelOptions = [{ | |
| 797 | + label: (0,external_this_wp_i18n_.__)('Language names', 'polylang'), | |
| 798 | + value: 'names' | |
| 799 | + }, { | |
| 800 | + label: (0,external_this_wp_i18n_.__)('Language codes', 'polylang'), | |
| 801 | + value: 'codes' | |
| 802 | + }]; | |
| 803 | + if (show_flags) { | |
| 804 | + labelOptions.push({ | |
| 805 | + label: (0,external_this_wp_i18n_._x)('None', 'Labels', 'polylang'), | |
| 806 | + value: '' | |
| 807 | + }); | |
| 808 | + } | |
| 809 | + const toolbarLabelControls = [{ | |
| 810 | + title: (0,external_this_wp_i18n_.__)('Language names', 'polylang'), | |
| 811 | + onClick: () => setAttributes({ | |
| 812 | + show_labels: 'names' | |
| 813 | + }) | |
| 814 | + }, { | |
| 815 | + title: (0,external_this_wp_i18n_.__)('Language codes', 'polylang'), | |
| 816 | + onClick: () => setAttributes({ | |
| 817 | + show_labels: 'codes' | |
| 818 | + }) | |
| 819 | + }]; | |
| 820 | + if (show_flags) { | |
| 821 | + toolbarLabelControls.push({ | |
| 822 | + title: (0,external_this_wp_i18n_._x)('None', 'Labels', 'polylang'), | |
| 823 | + onClick: () => { | |
| 824 | + if (!show_flags) { | |
| 825 | + createWarningNotice((0,external_this_wp_i18n_.__)('Labels cannot be hidden if flags are not shown.', 'polylang')); | |
| 826 | + return; | |
| 827 | + } | |
| 828 | + setAttributes({ | |
| 829 | + show_labels: '', | |
| 830 | + flag_label_spacing: LABEL_SPACING_DEFAULT_VALUE | |
| 831 | + }); | |
| 832 | + } | |
| 833 | + }); | |
| 834 | + } | |
| 835 | + return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsxs)((react_jsx_runtime_production_min_namespaceFn().Fragment), { | |
| 836 | + children: [/*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsxs)(external_this_wp_blockEditor_.InspectorControls, { | |
| 837 | + children: [/*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsxs)(external_this_wp_components_.PanelBody, { | |
| 838 | + title: (0,external_this_wp_i18n_.__)('Display', 'polylang'), | |
| 839 | + children: [/*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.SelectControl, { | |
| 840 | + label: (0,external_this_wp_i18n_.__)('Layout', 'polylang'), | |
| 841 | + value: layout, | |
| 842 | + options: layoutSelectOptions, | |
| 843 | + onChange: value => { | |
| 844 | + setAttributes({ | |
| 845 | + layout: value | |
| 846 | + }); | |
| 847 | + if ('select' === value) { | |
| 848 | + setAttributes({ | |
| 849 | + show_flags: false | |
| 850 | + }); | |
| 851 | + if ('' === show_labels) { | |
| 852 | + setAttributes({ | |
| 853 | + show_labels: 'names' | |
| 854 | + }); | |
| 855 | + } | |
| 856 | + } | |
| 857 | + }, | |
| 858 | + __next40pxDefaultSize: true | |
| 859 | + }), 'select' !== layout && /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.SelectControl, { | |
| 860 | + label: (0,external_this_wp_i18n_.__)('Labels', 'polylang'), | |
| 861 | + value: show_labels, | |
| 862 | + options: labelOptions, | |
| 863 | + onChange: value => { | |
| 864 | + if ('' === value) { | |
| 865 | + if (!show_flags) { | |
| 866 | + createWarningNotice((0,external_this_wp_i18n_.__)('Labels cannot be hidden if flags are not shown.', 'polylang')); | |
| 867 | + return; | |
| 868 | + } | |
| 869 | + setAttributes({ | |
| 870 | + show_labels: value, | |
| 871 | + flag_label_spacing: LABEL_SPACING_DEFAULT_VALUE | |
| 872 | + }); | |
| 873 | + return; | |
| 874 | + } | |
| 875 | + setAttributes({ | |
| 876 | + show_labels: value | |
| 877 | + }); | |
| 878 | + }, | |
| 879 | + __next40pxDefaultSize: true | |
| 880 | + })] | |
| 881 | + }), 'select' !== layout && /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsxs)(external_this_wp_components_.PanelBody, { | |
| 882 | + title: (0,external_this_wp_i18n_.__)('Flags Settings', 'polylang'), | |
| 883 | + children: [/*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.ToggleControl, { | |
| 884 | + label: (0,external_this_wp_i18n_.__)('Display flags', 'polylang'), | |
| 885 | + checked: show_flags, | |
| 886 | + onChange: value => { | |
| 887 | + if ('' === show_labels && !value) { | |
| 888 | + createWarningNotice((0,external_this_wp_i18n_.__)('Flags cannot be hidden if labels are not displayed.', 'polylang')); | |
| 889 | + return; | |
| 890 | + } | |
| 891 | + setAttributes({ | |
| 892 | + show_flags: value | |
| 893 | + }); | |
| 894 | + } | |
| 895 | + }), show_flags && /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsxs)((react_jsx_runtime_production_min_namespaceFn().Fragment), { | |
| 896 | + children: [/*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.RadioControl, { | |
| 897 | + label: (0,external_this_wp_i18n_.__)('Aspect', 'polylang'), | |
| 898 | + selected: flag_aspect_ratio, | |
| 899 | + options: [{ | |
| 900 | + label: (0,external_this_wp_i18n_.__)('Landscape (3:2)', 'polylang'), | |
| 901 | + value: '3:2' | |
| 902 | + }, { | |
| 903 | + label: (0,external_this_wp_i18n_.__)('Square (1:1)', 'polylang'), | |
| 904 | + value: '1:1' | |
| 905 | + }], | |
| 906 | + onChange: value => setAttributes({ | |
| 907 | + flag_aspect_ratio: value | |
| 908 | + }) | |
| 909 | + }), /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.RangeControl, { | |
| 910 | + label: (0,external_this_wp_i18n_.__)('Border radius', 'polylang'), | |
| 911 | + initialPosition: 0, | |
| 912 | + value: flag_border_radius, | |
| 913 | + min: 0, | |
| 914 | + max: 100, | |
| 915 | + step: 1, | |
| 916 | + allowReset: true, | |
| 917 | + resetFallbackValue: 0, | |
| 918 | + onChange: value => setAttributes({ | |
| 919 | + flag_border_radius: value | |
| 920 | + }), | |
| 921 | + __next40pxDefaultSize: true | |
| 922 | + }), /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.__experimentalUnitControl, { | |
| 923 | + __next40pxDefaultSize: true, | |
| 924 | + label: (0,external_this_wp_i18n_.__)('Size', 'polylang'), | |
| 925 | + value: flag_width, | |
| 926 | + units: CSS_LENGTH_UNITS, | |
| 927 | + onChange: value => setAttributes({ | |
| 928 | + flag_width: value | |
| 929 | + }) | |
| 930 | + }), '' !== show_labels && /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.__experimentalUnitControl, { | |
| 931 | + __next40pxDefaultSize: true, | |
| 932 | + label: (0,external_this_wp_i18n_.__)('Label spacing', 'polylang'), | |
| 933 | + value: flag_label_spacing, | |
| 934 | + units: CSS_LENGTH_UNITS, | |
| 935 | + onChange: value => setAttributes({ | |
| 936 | + flag_label_spacing: value | |
| 937 | + }) | |
| 938 | + })] | |
| 939 | + })] | |
| 940 | + }), /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsxs)(external_this_wp_components_.PanelBody, { | |
| 941 | + title: (0,external_this_wp_i18n_.__)('Behavior', 'polylang'), | |
| 942 | + children: [/*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.ToggleControl, { | |
| 943 | + label: (0,external_this_wp_i18n_.__)('Force link to front page', 'polylang'), | |
| 944 | + checked: force_home, | |
| 945 | + onChange: value => setAttributes({ | |
| 946 | + force_home: value | |
| 947 | + }) | |
| 948 | + }), /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.ToggleControl, { | |
| 949 | + label: (0,external_this_wp_i18n_.__)('Hide the current language', 'polylang'), | |
| 950 | + checked: hide_current, | |
| 951 | + onChange: value => setAttributes({ | |
| 952 | + hide_current: value | |
| 953 | + }) | |
| 954 | + }), /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.ToggleControl, { | |
| 955 | + label: (0,external_this_wp_i18n_.__)('Hide languages with no translation', 'polylang'), | |
| 956 | + checked: hide_if_no_translation, | |
| 957 | + onChange: value => setAttributes({ | |
| 958 | + hide_if_no_translation: value | |
| 959 | + }) | |
| 960 | + })] | |
| 961 | + })] | |
| 962 | + }), /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_blockEditor_.BlockControls, { | |
| 963 | + children: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsxs)(external_this_wp_components_.ToolbarGroup, { | |
| 964 | + children: [/*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.ToolbarDropdownMenu, { | |
| 965 | + label: (0,external_this_wp_i18n_.__)('Layout', 'polylang'), | |
| 966 | + controls: layoutToolbarControls | |
| 967 | + }), 'select' !== layout && /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.ToolbarButton, { | |
| 968 | + icon: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("span", { | |
| 969 | + className: "dashicons dashicons-flag" | |
| 970 | + }), | |
| 971 | + label: show_flags ? (0,external_this_wp_i18n_.__)('Hide flags', 'polylang') : (0,external_this_wp_i18n_.__)('Display flags', 'polylang'), | |
| 972 | + onClick: () => { | |
| 973 | + if (show_flags && '' === show_labels) { | |
| 974 | + createWarningNotice((0,external_this_wp_i18n_.__)('Flags cannot be hidden if labels are not displayed.', 'polylang')); | |
| 975 | + return; | |
| 976 | + } | |
| 977 | + setAttributes({ | |
| 978 | + show_flags: !show_flags | |
| 979 | + }); | |
| 980 | + } | |
| 981 | + }), 'select' !== layout && /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.ToolbarDropdownMenu, { | |
| 982 | + icon: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("span", { | |
| 983 | + className: "dashicons dashicons-editor-textcolor" | |
| 984 | + }), | |
| 985 | + label: (0,external_this_wp_i18n_.__)('Labels', 'polylang'), | |
| 986 | + controls: toolbarLabelControls | |
| 987 | + })] | |
| 988 | + }) | |
| 989 | + })] | |
| 602 | 990 | }); |
| 603 | 991 | }; |
| 604 | -// EXTERNAL MODULE: external {"this":["wp","apiFetch"]} | |
| 605 | -var external_this_wp_apiFetch_ = __webpack_require__(631); | |
| 606 | -var external_this_wp_apiFetch_default = /*#__PURE__*/__webpack_require__.n(external_this_wp_apiFetch_); | |
| 607 | -;// ./node_modules/@wpsyntex/polylang-react-library/build/hooks/use-languages-list.js | |
| 608 | -/** | |
| 609 | - * WordPress dependencies | |
| 610 | - */ | |
| 611 | - | |
| 612 | - | |
| 613 | - | |
| 614 | -/** | |
| 615 | - * Custom hook to get the languages list. | |
| 616 | - * | |
| 617 | - * @return {Array|null} The languages list, `null` if not loaded yet. | |
| 618 | - */ | |
| 619 | -const useLanguagesList = () => { | |
| 620 | - const [languages, setLanguages] = (0,external_this_wp_element_.useState)(null); | |
| 621 | - (0,external_this_wp_element_.useEffect)(() => { | |
| 622 | - external_this_wp_apiFetch_default()({ | |
| 623 | - path: '/pll/v1/languages', | |
| 624 | - method: 'GET' | |
| 625 | - }).then(response => setLanguages(response)); | |
| 626 | - }, []); | |
| 627 | - return languages; | |
| 628 | -}; | |
| 629 | 992 | ;// ./js/src/blocks/language-switcher/edit.js |
| 630 | 993 | /** |
| 631 | 994 | * Edit callback for language switcher block. |
| 632 | 995 | */ |
| @@ -636,9 +999,8 @@ | ||
| 636 | 999 | */ |
| 637 | 1000 | |
| 638 | 1001 | |
| 639 | 1002 | |
| 640 | - | |
| 641 | 1003 | /** |
| 642 | 1004 | * Internal dependencies |
| 643 | 1005 | */ |
| 644 | 1006 | |
| @@ -648,39 +1010,31 @@ | ||
| 648 | 1010 | |
| 649 | 1011 | /** |
| 650 | 1012 | * Edit callback for language switcher block. |
| 651 | 1013 | * |
| 652 | - * @param {Object} props Block properties. | |
| 1014 | + * @param {Object} props Block properties. | |
| 1015 | + * @param {Object} props.attributes Block attributes. | |
| 1016 | + * @param {Function} props.setAttributes Function to set block attributes. | |
| 653 | 1017 | * @return {ReactElement} The block content and controls. |
| 654 | 1018 | */ |
| 655 | 1019 | |
| 656 | -const Edit = props => { | |
| 657 | - const { | |
| 658 | - dropdown | |
| 659 | - } = props.attributes; | |
| 1020 | +const Edit = ({ | |
| 1021 | + attributes, | |
| 1022 | + setAttributes | |
| 1023 | +}) => { | |
| 660 | 1024 | const languages = useLanguagesList(); |
| 661 | - const { | |
| 662 | - ToggleControlDropdown, | |
| 663 | - ToggleControlShowNames, | |
| 664 | - ToggleControlShowFlags, | |
| 665 | - ToggleControlForceHome, | |
| 666 | - ToggleControlHideCurrent, | |
| 667 | - ToggleControlHideIfNoTranslations | |
| 668 | - } = createLanguageSwitcherEdit(props); | |
| 669 | 1025 | return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsxs)("div", { |
| 670 | 1026 | ...(0,external_this_wp_blockEditor_.useBlockProps)(), |
| 671 | - children: [/*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_blockEditor_.InspectorControls, { | |
| 672 | - children: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsxs)(external_this_wp_components_.PanelBody, { | |
| 673 | - title: (0,external_this_wp_i18n_.__)('Language switcher settings', 'polylang'), | |
| 674 | - children: [/*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(ToggleControlDropdown, {}), !dropdown && /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(ToggleControlShowNames, {}), !dropdown && /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(ToggleControlShowFlags, {}), /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(ToggleControlForceHome, {}), !dropdown && /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(ToggleControlHideCurrent, {}), /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(ToggleControlHideIfNoTranslations, {})] | |
| 675 | - }) | |
| 1027 | + children: [/*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(SwitcherControls, { | |
| 1028 | + attributes: attributes, | |
| 1029 | + setAttributes: setAttributes | |
| 676 | 1030 | }), /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.Disabled, { |
| 677 | 1031 | children: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(LanguagesContext.Provider, { |
| 678 | 1032 | value: { |
| 679 | 1033 | languages |
| 680 | 1034 | }, |
| 681 | - children: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(SwitcherContainer, { | |
| 682 | - attributes: props.attributes | |
| 1035 | + children: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(RenderedSwitcher, { | |
| 1036 | + attributes: attributes | |
| 683 | 1037 | }) |
| 684 | 1038 | }) |
| 685 | 1039 | })] |
| 686 | 1040 | }); |
| @@ -702,123 +1056,89 @@ | ||
| 702 | 1056 | */ |
| 703 | 1057 | |
| 704 | 1058 | |
| 705 | 1059 | |
| 1060 | + | |
| 706 | 1061 | (0,external_this_wp_blocks_.registerBlockType)(block_namespaceObject.UU, { |
| 707 | 1062 | icon: icons_translation, |
| 708 | - edit: Edit | |
| 1063 | + edit: Edit, | |
| 1064 | + deprecated: deprecated | |
| 709 | 1065 | }); |
| 710 | 1066 | // EXTERNAL MODULE: external {"this":["wp","hooks"]} |
| 711 | 1067 | var external_this_wp_hooks_ = __webpack_require__(873); |
| 712 | -;// ./js/src/blocks/navigation-language-switcher/components/switcher-link-element.js | |
| 1068 | +;// ./js/src/blocks/navigation-language-switcher/deprecated.js | |
| 713 | 1069 | /** |
| 714 | - * Internal dependencies | |
| 1070 | + * Deprecated navigation language switcher block. | |
| 715 | 1071 | */ |
| 716 | 1072 | |
| 717 | - | |
| 718 | -/** | |
| 719 | - * Switcher link element component. | |
| 720 | - * | |
| 721 | - * @param {Object} props Component props. | |
| 722 | - * @param {Object} props.language Language object. | |
| 723 | - * @param {boolean} props.isTopLevel Whether the language is the top level language. | |
| 724 | - * @param {boolean} props.showFlags Whether to show the flags. | |
| 725 | - * @param {boolean} props.showNames Whether to show the names. | |
| 726 | - * @return {ReactElement} The Switcher element component. | |
| 727 | - */ | |
| 728 | - | |
| 729 | -const SwitcherLinkElement = ({ | |
| 730 | - language, | |
| 731 | - isTopLevel, | |
| 732 | - showFlags, | |
| 733 | - showNames | |
| 734 | -}) => { | |
| 735 | - const { | |
| 736 | - text, | |
| 737 | - flag | |
| 738 | - } = useMemoizedSwitcherLabel(language, showFlags, showNames); | |
| 739 | - const prefix = isTopLevel ? '' : ' '; | |
| 740 | - return ( | |
| 741 | - /*#__PURE__*/ | |
| 742 | - // eslint-disable-next-line jsx-a11y/anchor-is-valid | |
| 743 | - (0,react_jsx_runtime_production_min_namespaceFn().jsxs)("a", { | |
| 744 | - href: '#', | |
| 745 | - children: [prefix, /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("span", { | |
| 746 | - dangerouslySetInnerHTML: { | |
| 747 | - __html: flag | |
| 748 | - } | |
| 749 | - }), " ", text, " "] | |
| 750 | - }) | |
| 751 | - ); | |
| 1073 | +const deprecated_V2Attributes = { | |
| 1074 | + layout: 'horizontal', | |
| 1075 | + show_labels: 'names', | |
| 1076 | + show_flags: false, | |
| 1077 | + force_home: false, | |
| 1078 | + hide_current: false, | |
| 1079 | + hide_if_no_translation: false, | |
| 1080 | + flag_aspect_ratio: '3:2', | |
| 1081 | + flag_border_radius: 0, | |
| 1082 | + flag_width: '18px', | |
| 1083 | + flag_label_spacing: '0.3em', | |
| 1084 | + className: '' | |
| 752 | 1085 | }; |
| 753 | -;// ./node_modules/@wpsyntex/polylang-react-library/build/icons/submenu.js | |
| 754 | -/** | |
| 755 | - * Submenu icon | |
| 756 | - */ | |
| 757 | - | |
| 758 | -/** | |
| 759 | - * WordPress dependencies | |
| 760 | - */ | |
| 761 | - | |
| 762 | - | |
| 763 | -const submenu_isPrimitivesComponents = 'undefined' !== typeof wp.primitives; | |
| 764 | -const SubmenuIcon = () => submenu_isPrimitivesComponents ? /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_primitives_.SVG, { | |
| 765 | - xmlns: "http://www.w3.org/2000/svg", | |
| 766 | - width: "12", | |
| 767 | - height: "12", | |
| 768 | - viewBox: "0 0 12 12", | |
| 769 | - fill: "none", | |
| 770 | - children: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_primitives_.Path, { | |
| 771 | - d: "M1.50002 4L6.00002 8L10.5 4", | |
| 772 | - strokeWidth: "1.5" | |
| 773 | - }) | |
| 774 | -}) : 'submenu'; | |
| 775 | -/* harmony default export */ const submenu = (SubmenuIcon); | |
| 776 | -;// ./js/src/blocks/navigation-language-switcher/components/switcher-ui.js | |
| 777 | -/** | |
| 778 | - * WordPress dependencies | |
| 779 | - */ | |
| 780 | - | |
| 781 | - | |
| 782 | -/** | |
| 783 | - * Internal dependencies | |
| 784 | - */ | |
| 785 | - | |
| 786 | - | |
| 787 | - | |
| 788 | -/** | |
| 789 | - * Switcher UI component. | |
| 790 | - * | |
| 791 | - * @param {Object} props The component props. | |
| 792 | - * @param {Array} props.languages The languages to display. | |
| 793 | - * @param {boolean} props.showFlags Whether to show the flags. | |
| 794 | - * @param {boolean} props.showNames Whether to show the names. | |
| 795 | - * @param {boolean} props.withSubmenuIcon Whether to show the submenu icon. | |
| 796 | - * @return {ReactElement} The Switcher UI component. | |
| 797 | - */ | |
| 798 | - | |
| 799 | -const switcher_ui_SwitcherUI = ({ | |
| 800 | - languages, | |
| 801 | - showFlags, | |
| 802 | - showNames, | |
| 803 | - withSubmenuIcon | |
| 804 | -}) => { | |
| 805 | - return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)((react_jsx_runtime_production_min_namespaceFn().Fragment), { | |
| 806 | - children: languages && languages.map(language => { | |
| 807 | - return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsxs)(external_this_wp_element_.Fragment, { | |
| 808 | - children: [/*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(SwitcherLinkElement, { | |
| 809 | - language: language, | |
| 810 | - isTopLevel: languages.indexOf(language) === 0, | |
| 811 | - showFlags: showFlags, | |
| 812 | - showNames: showNames | |
| 813 | - }), withSubmenuIcon && /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("span", { | |
| 814 | - className: "wp-block-navigation__submenu-icon", | |
| 815 | - children: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(submenu, {}) | |
| 816 | - })] | |
| 817 | - }, language.slug); | |
| 818 | - }) | |
| 819 | - }); | |
| 1086 | +const deprecated_v1 = { | |
| 1087 | + attributes: { | |
| 1088 | + dropdown: { | |
| 1089 | + type: 'boolean', | |
| 1090 | + default: false | |
| 1091 | + }, | |
| 1092 | + show_names: { | |
| 1093 | + type: 'boolean', | |
| 1094 | + default: true | |
| 1095 | + }, | |
| 1096 | + show_flags: { | |
| 1097 | + type: 'boolean', | |
| 1098 | + default: false | |
| 1099 | + }, | |
| 1100 | + force_home: { | |
| 1101 | + type: 'boolean', | |
| 1102 | + default: false | |
| 1103 | + }, | |
| 1104 | + hide_current: { | |
| 1105 | + type: 'boolean', | |
| 1106 | + default: false | |
| 1107 | + }, | |
| 1108 | + hide_if_no_translation: { | |
| 1109 | + type: 'boolean', | |
| 1110 | + default: false | |
| 1111 | + }, | |
| 1112 | + className: { | |
| 1113 | + type: 'string', | |
| 1114 | + default: '' | |
| 1115 | + } | |
| 1116 | + }, | |
| 1117 | + isEligible: attributes => 'dropdown' in attributes || 'show_names' in attributes, | |
| 1118 | + migrate(attributes) { | |
| 1119 | + const { | |
| 1120 | + dropdown, | |
| 1121 | + show_names, | |
| 1122 | + show_flags, | |
| 1123 | + force_home, | |
| 1124 | + hide_current, | |
| 1125 | + hide_if_no_translation, | |
| 1126 | + className | |
| 1127 | + } = attributes; | |
| 1128 | + return { | |
| 1129 | + ...deprecated_V2Attributes, | |
| 1130 | + layout: dropdown ? 'dropdown' : 'horizontal', | |
| 1131 | + show_labels: show_names ? 'names' : '', | |
| 1132 | + show_flags: show_names ? show_flags : true, | |
| 1133 | + force_home, | |
| 1134 | + hide_current, | |
| 1135 | + hide_if_no_translation, | |
| 1136 | + className: className || '' | |
| 1137 | + }; | |
| 1138 | + } | |
| 820 | 1139 | }; |
| 1140 | +/* harmony default export */ const navigation_language_switcher_deprecated = ([deprecated_v1]); | |
| 821 | 1141 | // EXTERNAL MODULE: external {"this":["wp","editor"]} |
| 822 | 1142 | var external_this_wp_editor_ = __webpack_require__(2); |
| 823 | 1143 | ;// ./node_modules/@wpsyntex/polylang-react-library/build/hooks/use-current-language.js |
| 824 | 1144 | /** |
| @@ -824,8 +1144,10 @@ | ||
| 824 | 1144 | /** |
| 825 | 1145 | * WordPress dependencies |
| 826 | 1146 | */ |
| 827 | 1147 | |
| 1148 | +// This package is not found in `@wordpress/scripts` like others (peer dependency). | |
| 1149 | +// eslint-disable-next-line import/no-unresolved | |
| 828 | 1150 | |
| 829 | 1151 | |
| 830 | 1152 | /** |
| 831 | 1153 | * Custom hook to get the current language from the editor. |
| @@ -837,15 +1159,16 @@ | ||
| 837 | 1159 | const currentPost = (0,external_this_wp_data_.useSelect)(select => select(external_this_wp_editor_.store).getCurrentPost()); |
| 838 | 1160 | if (!languages || !currentPost) { |
| 839 | 1161 | return null; |
| 840 | 1162 | } |
| 841 | - const currentLanguageSlug = currentPost.lang ?? pllEditorCurrentLanguageSlug; | |
| 1163 | + const currentLanguageSlug = currentPost.lang ?? pllEditorCurrentLanguageSlug; // eslint-disable-line no-undef | |
| 1164 | + | |
| 842 | 1165 | const currentLanguage = languages.find(language => { |
| 843 | 1166 | return language.slug === currentLanguageSlug; |
| 844 | 1167 | }); |
| 845 | 1168 | return currentLanguage ? currentLanguage : null; |
| 846 | 1169 | }; |
| 847 | -;// ./js/src/blocks/navigation-language-switcher/components/navigation-switcher-container.js | |
| 1170 | +;// ./js/src/blocks/navigation-language-switcher/rendered-switcher.js | |
| 848 | 1171 | /** |
| 849 | 1172 | * WordPress dependencies |
| 850 | 1173 | */ |
| 851 | 1174 | |
| @@ -850,8 +1173,13 @@ | ||
| 850 | 1173 | */ |
| 851 | 1174 | |
| 852 | 1175 | |
| 853 | 1176 | /** |
| 1177 | + * External dependencies | |
| 1178 | + */ | |
| 1179 | + | |
| 1180 | + | |
| 1181 | +/** | |
| 854 | 1182 | * Internal dependencies |
| 855 | 1183 | */ |
| 856 | 1184 | |
| 857 | 1185 | |
| @@ -857,24 +1185,27 @@ | ||
| 857 | 1185 | |
| 858 | 1186 | |
| 859 | 1187 | |
| 860 | 1188 | /** |
| 861 | - * Switcher container component. | |
| 1189 | + * Rendered switcher component. | |
| 862 | 1190 | * |
| 863 | 1191 | * @param {Object} props The component props. |
| 864 | 1192 | * @param {Object} props.attributes The block attributes. |
| 865 | 1193 | * @param {Object} props.context The block context. |
| 866 | - * @return {ReactElement} The Switcher component. | |
| 1194 | + * @return {ReactElement} The rendered switcher. | |
| 867 | 1195 | */ |
| 868 | 1196 | |
| 869 | -const NavigationSwitcherContainer = ({ | |
| 1197 | +const rendered_switcher_RenderedSwitcher = ({ | |
| 870 | 1198 | attributes, |
| 871 | 1199 | context |
| 872 | 1200 | }) => { |
| 873 | 1201 | const { |
| 874 | - dropdown, | |
| 1202 | + layout, | |
| 1203 | + show_labels, | |
| 875 | 1204 | show_flags, |
| 876 | - show_names | |
| 1205 | + flag_border_radius, | |
| 1206 | + flag_width, | |
| 1207 | + flag_label_spacing | |
| 877 | 1208 | } = attributes; |
| 878 | 1209 | const { |
| 879 | 1210 | showSubmenuIcon, |
| 880 | 1211 | openSubmenusOnClick |
| @@ -882,14 +1213,31 @@ | ||
| 882 | 1213 | const { |
| 883 | 1214 | languages |
| 884 | 1215 | } = (0,external_this_wp_element_.useContext)(LanguagesContext); |
| 885 | 1216 | const currentLanguage = useCurrentLanguage(languages); |
| 886 | - const curatedLanguages = useCuratedLanguages(languages, currentLanguage, dropdown); | |
| 887 | - return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(switcher_ui_SwitcherUI, { | |
| 888 | - languages: curatedLanguages, | |
| 889 | - showFlags: Boolean(show_flags), | |
| 890 | - showNames: Boolean(show_names), | |
| 891 | - withSubmenuIcon: Boolean((showSubmenuIcon || openSubmenusOnClick) && dropdown) | |
| 1217 | + const isDropdown = layout === 'dropdown'; | |
| 1218 | + const languagesToRender = useCuratedLanguages(languages, currentLanguage, isDropdown); | |
| 1219 | + const labelSpacing = getLabelSpacing(show_labels, flag_label_spacing); | |
| 1220 | + const withSubmenuIcon = isDropdown && (showSubmenuIcon || openSubmenusOnClick); | |
| 1221 | + const linkProps = { | |
| 1222 | + showLabels: show_labels, | |
| 1223 | + showFlags: show_flags, | |
| 1224 | + flagBorderRadius: flag_border_radius, | |
| 1225 | + flagWidth: flag_width, | |
| 1226 | + labelSpacing | |
| 1227 | + }; | |
| 1228 | + return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)((react_jsx_runtime_production_min_namespaceFn().Fragment), { | |
| 1229 | + children: languagesToRender.map(language => { | |
| 1230 | + return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsxs)(external_this_wp_element_.Fragment, { | |
| 1231 | + children: [/*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(SwitcherLanguageLink, { | |
| 1232 | + language: language, | |
| 1233 | + ...linkProps | |
| 1234 | + }), withSubmenuIcon && /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)("span", { | |
| 1235 | + className: "wp-block-navigation__submenu-icon", | |
| 1236 | + children: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(submenu, {}) | |
| 1237 | + })] | |
| 1238 | + }, language.slug); | |
| 1239 | + }) | |
| 892 | 1240 | }); |
| 893 | 1241 | }; |
| 894 | 1242 | ;// ./js/src/blocks/navigation-language-switcher/edit.js |
| 895 | 1243 | /** |
| @@ -901,9 +1249,8 @@ | ||
| 901 | 1249 | */ |
| 902 | 1250 | |
| 903 | 1251 | |
| 904 | 1252 | |
| 905 | - | |
| 906 | 1253 | /** |
| 907 | 1254 | * Internal dependencies |
| 908 | 1255 | */ |
| 909 | 1256 | |
| @@ -913,40 +1260,42 @@ | ||
| 913 | 1260 | |
| 914 | 1261 | /** |
| 915 | 1262 | * Edit callback for navigation language switcher block. |
| 916 | 1263 | * |
| 917 | - * @param {Object} props Block properties. | |
| 1264 | + * @param {Object} props Block properties. | |
| 1265 | + * @param {Object} props.attributes Block attributes. | |
| 1266 | + * @param {Object} props.context Block context. | |
| 1267 | + * @param {Function} props.setAttributes Function to set block attributes. | |
| 918 | 1268 | * @return {ReactElement} The block content and controls. |
| 919 | 1269 | */ |
| 920 | 1270 | |
| 921 | -const edit_Edit = props => { | |
| 922 | - const { | |
| 923 | - dropdown | |
| 924 | - } = props.attributes; | |
| 1271 | +const edit_Edit = ({ | |
| 1272 | + attributes, | |
| 1273 | + context, | |
| 1274 | + setAttributes | |
| 1275 | +}) => { | |
| 925 | 1276 | const languages = useLanguagesList(); |
| 926 | 1277 | const { |
| 927 | - ToggleControlDropdown, | |
| 928 | - ToggleControlShowNames, | |
| 929 | - ToggleControlShowFlags, | |
| 930 | - ToggleControlForceHome, | |
| 931 | - ToggleControlHideCurrent, | |
| 932 | - ToggleControlHideIfNoTranslations | |
| 933 | - } = createLanguageSwitcherEdit(props); | |
| 1278 | + show_flags, | |
| 1279 | + flag_aspect_ratio | |
| 1280 | + } = attributes; | |
| 1281 | + const aspectRatioClass = show_flags && flag_aspect_ratio ? `pll-aspect-ratio-${flag_aspect_ratio.replace(':', '')}` : ''; | |
| 934 | 1282 | return /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsxs)("div", { |
| 935 | - ...(0,external_this_wp_blockEditor_.useBlockProps)(), | |
| 936 | - children: [/*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_blockEditor_.InspectorControls, { | |
| 937 | - children: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsxs)(external_this_wp_components_.PanelBody, { | |
| 938 | - title: (0,external_this_wp_i18n_.__)('Language switcher settings', 'polylang'), | |
| 939 | - children: [/*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(ToggleControlDropdown, {}), /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(ToggleControlShowNames, {}), /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(ToggleControlShowFlags, {}), /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(ToggleControlForceHome, {}), !dropdown && /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(ToggleControlHideCurrent, {}), /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(ToggleControlHideIfNoTranslations, {})] | |
| 940 | - }) | |
| 1283 | + ...(0,external_this_wp_blockEditor_.useBlockProps)({ | |
| 1284 | + className: aspectRatioClass || undefined | |
| 1285 | + }), | |
| 1286 | + children: [/*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(SwitcherControls, { | |
| 1287 | + attributes: attributes, | |
| 1288 | + setAttributes: setAttributes, | |
| 1289 | + layoutOptions: ['horizontal', 'dropdown'] | |
| 941 | 1290 | }), /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(external_this_wp_components_.Disabled, { |
| 942 | 1291 | children: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(LanguagesContext.Provider, { |
| 943 | 1292 | value: { |
| 944 | 1293 | languages |
| 945 | 1294 | }, |
| 946 | - children: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(NavigationSwitcherContainer, { | |
| 947 | - attributes: props.attributes, | |
| 948 | - context: props.context | |
| 1295 | + children: /*#__PURE__*/(0,react_jsx_runtime_production_min_namespaceFn().jsx)(rendered_switcher_RenderedSwitcher, { | |
| 1296 | + attributes: attributes, | |
| 1297 | + context: context | |
| 949 | 1298 | }) |
| 950 | 1299 | }) |
| 951 | 1300 | })] |
| 952 | 1301 | }); |
| @@ -1040,8 +1389,9 @@ | ||
| 1040 | 1389 | |
| 1041 | 1390 | |
| 1042 | 1391 | |
| 1043 | 1392 | |
| 1393 | + | |
| 1044 | 1394 | (0,external_this_wp_blocks_.registerBlockType)(Navigation_block_namespaceObject.UU, { |
| 1045 | 1395 | icon: icons_translation, |
| 1046 | 1396 | transforms: { |
| 1047 | 1397 | from: [{ |
| @@ -1049,9 +1399,10 @@ | ||
| 1049 | 1399 | blocks: ['core/navigation-link'], |
| 1050 | 1400 | transform: () => (0,external_this_wp_blocks_.createBlock)(Navigation_block_namespaceObject.UU) |
| 1051 | 1401 | }] |
| 1052 | 1402 | }, |
| 1053 | - edit: edit_Edit | |
| 1403 | + edit: edit_Edit, | |
| 1404 | + deprecated: navigation_language_switcher_deprecated | |
| 1054 | 1405 | }); |
| 1055 | 1406 | |
| 1056 | 1407 | /** |
| 1057 | 1408 | * Hooks to the classic menu conversion to core/navigation block to be able to convert |