@eightshift/frontend-libs-tailwind 1.4.3 → 1.4.5
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/.husky/pre-commit +0 -0
- package/CHANGELOG.md +26 -0
- package/blocks/init/src/Blocks/components/image/image.php +6 -5
- package/blocks/init/src/Blocks/components/paragraph/components/paragraph-editor.js +0 -2
- package/blocks/init/src/Blocks/custom/paragraph/components/paragraph-editor.js +3 -27
- package/blocks/init/src/Blocks/custom/paragraph/manifest.json +3 -0
- package/bun.lockb +0 -0
- package/package.json +90 -91
- package/scripts/components/block-inserter.js +17 -1
- package/scripts/editor/registration.js +7 -1
package/.husky/pre-commit
CHANGED
|
File without changes
|
package/CHANGELOG.md
CHANGED
|
@@ -6,11 +6,35 @@ This projects adheres to [Semantic Versioning](https://semver.org/) and [Keep a
|
|
|
6
6
|
|
|
7
7
|
---
|
|
8
8
|
|
|
9
|
+
## [1.4.5]
|
|
10
|
+
|
|
11
|
+
### Changed
|
|
12
|
+
|
|
13
|
+
- `BlockInserter` is now only visible when the block it's assigned to is selected. This behavior can be changed by setting `alwaysVisible`.
|
|
14
|
+
|
|
15
|
+
### Fixed
|
|
16
|
+
|
|
17
|
+
- Image responsive breakpoints render order in the frontend.
|
|
18
|
+
|
|
19
|
+
## [1.4.4]
|
|
20
|
+
|
|
21
|
+
### Added
|
|
22
|
+
|
|
23
|
+
- Support for `supports` key in block manifests during block registration.
|
|
24
|
+
|
|
25
|
+
### Changed
|
|
26
|
+
|
|
27
|
+
- Built-in Paragraph block now uses the new block splitting logic from WP 6.6
|
|
28
|
+
- Updated dependencies
|
|
29
|
+
|
|
9
30
|
## [1.4.3]
|
|
10
31
|
|
|
11
32
|
### Fixed
|
|
12
33
|
|
|
13
34
|
- Fixing Yoast SEO plugin helpers.
|
|
35
|
+
- Manifests in some default blocks not using `base` as a `part`.
|
|
36
|
+
- Image sizing in the default Image block when set to stretch.
|
|
37
|
+
- Class for gradient *top* direction in wrapper.
|
|
14
38
|
|
|
15
39
|
## [1.4.2]
|
|
16
40
|
|
|
@@ -128,6 +152,8 @@ This projects adheres to [Semantic Versioning](https://semver.org/) and [Keep a
|
|
|
128
152
|
- Initial release.
|
|
129
153
|
|
|
130
154
|
[Unreleased]: https://github.com/infinum/eightshift-frontend-libs-tailwind/compare/master...HEAD
|
|
155
|
+
[1.4.5]: https://github.com/infinum/eightshift-frontend-libs-tailwind/compare/1.4.4...1.4.5
|
|
156
|
+
[1.4.4]: https://github.com/infinum/eightshift-frontend-libs-tailwind/compare/1.4.3...1.4.4
|
|
131
157
|
[1.4.3]: https://github.com/infinum/eightshift-frontend-libs-tailwind/compare/1.4.2...1.4.3
|
|
132
158
|
[1.4.2]: https://github.com/infinum/eightshift-frontend-libs-tailwind/compare/1.4.1...1.4.2
|
|
133
159
|
[1.4.1]: https://github.com/infinum/eightshift-frontend-libs-tailwind/compare/1.4.0...1.4.1
|
|
@@ -22,10 +22,10 @@ if (!$imageUse || empty($imageData['_default']['url'])) {
|
|
|
22
22
|
|
|
23
23
|
$imageAlt = get_post_meta($imageData['_default']['id'], '_wp_attachment_image_alt', true) ?? '';
|
|
24
24
|
|
|
25
|
-
$
|
|
25
|
+
$isDesktopFirst = $imageData['_desktopFirst'] ?? false;
|
|
26
26
|
|
|
27
27
|
$breakpointData = Helpers::getSettingsGlobalVariablesBreakpoints();
|
|
28
|
-
$breakpoints = Helpers::getTwBreakpoints(
|
|
28
|
+
$breakpoints = Helpers::getTwBreakpoints();
|
|
29
29
|
?>
|
|
30
30
|
|
|
31
31
|
<picture
|
|
@@ -45,12 +45,12 @@ $breakpoints = Helpers::getTwBreakpoints($isMobileFirst);
|
|
|
45
45
|
continue;
|
|
46
46
|
}
|
|
47
47
|
|
|
48
|
-
$breakpointWidth = $breakpointData[
|
|
48
|
+
$breakpointWidth = $breakpointData[$breakpoint];
|
|
49
49
|
|
|
50
|
-
$widthMode = $
|
|
50
|
+
$widthMode = $isDesktopFirst ? 'max-width' : 'min-width';
|
|
51
51
|
|
|
52
52
|
// phpcs:ignore Eightshift.Security.HelpersEscape.OutputNotEscaped
|
|
53
|
-
echo '<source srcset="' . esc_url($value) . '" media="(' . $widthMode . ': ' . $breakpointWidth . '
|
|
53
|
+
echo '<source srcset="' . esc_url($value) . '" media="(' . $widthMode . ': ' . $breakpointWidth . 'em)" />';
|
|
54
54
|
?>
|
|
55
55
|
<?php } ?>
|
|
56
56
|
|
|
@@ -60,3 +60,4 @@ $breakpoints = Helpers::getTwBreakpoints($isMobileFirst);
|
|
|
60
60
|
class="<?php echo esc_attr(Helpers::tailwindClasses('base', $attributes, $manifest, $additionalClass['image'] ?? $additionalClass)); ?>"
|
|
61
61
|
/>
|
|
62
62
|
</picture>
|
|
63
|
+
|
|
@@ -9,7 +9,6 @@ export const ParagraphEditor = (attributes) => {
|
|
|
9
9
|
placeholder = __('Add content', '%g_textdomain%'),
|
|
10
10
|
additionalClass,
|
|
11
11
|
|
|
12
|
-
onSplit,
|
|
13
12
|
mergeBlocks,
|
|
14
13
|
onReplace,
|
|
15
14
|
onRemove,
|
|
@@ -30,7 +29,6 @@ export const ParagraphEditor = (attributes) => {
|
|
|
30
29
|
value={paragraphContent}
|
|
31
30
|
onChange={(value) => setAttributes({ [getAttrKey('paragraphContent', attributes, manifest)]: value })}
|
|
32
31
|
allowedFormats={['core/bold', 'core/link', 'core/italic']}
|
|
33
|
-
onSplit={onSplit}
|
|
34
32
|
onMerge={mergeBlocks}
|
|
35
33
|
onReplace={onReplace}
|
|
36
34
|
onRemove={onRemove}
|
|
@@ -1,37 +1,13 @@
|
|
|
1
|
-
import React
|
|
2
|
-
import { createBlock } from '@wordpress/blocks';
|
|
1
|
+
import React from 'react';
|
|
3
2
|
import { tailwindClasses, props } from '@eightshift/frontend-libs-tailwind/scripts';
|
|
4
3
|
import { ParagraphEditor as EditorComponent } from '../../../components/paragraph/components/paragraph-editor';
|
|
5
4
|
import manifest from './../manifest.json';
|
|
6
|
-
import globalManifest from './../../../manifest.json';
|
|
7
|
-
|
|
8
|
-
export const ParagraphEditor = (keyProps) => {
|
|
9
|
-
const { attributes, setAttributes, onReplace, mergeBlocks } = keyProps;
|
|
10
|
-
|
|
11
|
-
const propsObject = props('paragraph', attributes);
|
|
12
|
-
|
|
13
|
-
/**
|
|
14
|
-
* Block-splitting logic. If content is available, creates
|
|
15
|
-
* a new block with the attributes of the original.
|
|
16
|
-
*
|
|
17
|
-
* @param {*} value Content value.
|
|
18
|
-
*/
|
|
19
|
-
const splitBlocks = (value) => {
|
|
20
|
-
if (!value) {
|
|
21
|
-
return createBlock(`${globalManifest.namespace}/${manifest.blockName}`);
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
return createBlock(`${globalManifest.namespace}/${manifest.blockName}`, {
|
|
25
|
-
...attributes,
|
|
26
|
-
[`${propsObject.prefix}Content`]: value,
|
|
27
|
-
});
|
|
28
|
-
};
|
|
29
5
|
|
|
6
|
+
export const ParagraphEditor = ({ attributes, setAttributes, onReplace, mergeBlocks }) => {
|
|
30
7
|
return (
|
|
31
8
|
<EditorComponent
|
|
32
|
-
{...
|
|
9
|
+
{...props('paragraph', attributes)}
|
|
33
10
|
setAttributes={setAttributes}
|
|
34
|
-
onSplit={splitBlocks}
|
|
35
11
|
mergeBlocks={mergeBlocks}
|
|
36
12
|
onReplace={onReplace}
|
|
37
13
|
onRemove={onReplace ? () => onReplace([]) : undefined}
|
package/bun.lockb
CHANGED
|
File without changes
|
package/package.json
CHANGED
|
@@ -1,92 +1,91 @@
|
|
|
1
1
|
{
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
}
|
|
2
|
+
"name": "@eightshift/frontend-libs-tailwind",
|
|
3
|
+
"version": "1.4.5",
|
|
4
|
+
"description": "A framework for creating modern Gutenberg themes with styling provided by Tailwind CSS.",
|
|
5
|
+
"author": {
|
|
6
|
+
"name": "Eightshift team",
|
|
7
|
+
"email": "team@eightshift.com",
|
|
8
|
+
"url": "https://eightshift.com/"
|
|
9
|
+
},
|
|
10
|
+
"repository": {
|
|
11
|
+
"type": "git",
|
|
12
|
+
"url": "git+https://github.com/infinum/eightshift-frontend-libs-tailwind.git"
|
|
13
|
+
},
|
|
14
|
+
"keywords": [
|
|
15
|
+
"frontend",
|
|
16
|
+
"css",
|
|
17
|
+
"mixin",
|
|
18
|
+
"js",
|
|
19
|
+
"utility",
|
|
20
|
+
"module",
|
|
21
|
+
"WordPress",
|
|
22
|
+
"tailwind",
|
|
23
|
+
"TailwindCSS"
|
|
24
|
+
],
|
|
25
|
+
"bugs": {
|
|
26
|
+
"url": "https://github.com/infinum/eightshift-frontend-libs-tailwind/issues"
|
|
27
|
+
},
|
|
28
|
+
"homepage": "https://github.com/infinum/eightshift-frontend-libs-tailwind#readme",
|
|
29
|
+
"license": "MIT",
|
|
30
|
+
"dependencies": {
|
|
31
|
+
"@eightshift/ui-components": "^1.7.0",
|
|
32
|
+
"@stylistic/eslint-plugin-js": "^2.10.1",
|
|
33
|
+
"@stylistic/stylelint-plugin": "^3.1.1",
|
|
34
|
+
"@swc/core": "^1.8.0",
|
|
35
|
+
"@wordpress/api-fetch": "^7.11.0",
|
|
36
|
+
"@wordpress/block-editor": "^14.6.0",
|
|
37
|
+
"@wordpress/dependency-extraction-webpack-plugin": "^5.9.0",
|
|
38
|
+
"@wordpress/dom-ready": "^4.11.0",
|
|
39
|
+
"@wordpress/server-side-render": "^5.11.0",
|
|
40
|
+
"browserslist": "^4.24.2",
|
|
41
|
+
"css-loader": "^7.1.2",
|
|
42
|
+
"css-minimizer-webpack-plugin": "^7.0.0",
|
|
43
|
+
"eslint": "^9.14.0",
|
|
44
|
+
"eslint-config-prettier": "^9.1.0",
|
|
45
|
+
"eslint-plugin-prettier": "^5.2.1",
|
|
46
|
+
"globals": "^15.12.0",
|
|
47
|
+
"husky": "^9.1.6",
|
|
48
|
+
"lightningcss": "^1.28.1",
|
|
49
|
+
"mini-css-extract-plugin": "^2.9.2",
|
|
50
|
+
"postcss": "^8.4.47",
|
|
51
|
+
"postcss-loader": "^8.1.1",
|
|
52
|
+
"prettier": "^3.3.3",
|
|
53
|
+
"prettier-plugin-tailwindcss": "^0.6.8",
|
|
54
|
+
"sonner": "^1.7.0",
|
|
55
|
+
"stylelint": "^16.10.0",
|
|
56
|
+
"stylelint-config-standard": "^36.0.1",
|
|
57
|
+
"swc-loader": "^0.2.6",
|
|
58
|
+
"terser-webpack-plugin": "^5.3.10",
|
|
59
|
+
"webpack": "^5.96.1",
|
|
60
|
+
"webpack-cli": "^5.1.4",
|
|
61
|
+
"webpack-manifest-plugin": "^5.0.0",
|
|
62
|
+
"webpack-merge": "^6.0.1"
|
|
63
|
+
},
|
|
64
|
+
"devDependencies": {
|
|
65
|
+
"embla-carousel": "^8.3.1",
|
|
66
|
+
"fluid-tailwind": "^1.0.3",
|
|
67
|
+
"lint-staged": "^15.2.10",
|
|
68
|
+
"micromodal": "^0.4.10",
|
|
69
|
+
"ol": "^10.2.1",
|
|
70
|
+
"ol-mapbox-style": "^12.3.5",
|
|
71
|
+
"tailwindcss": "^3.4.14",
|
|
72
|
+
"tailwindcss-animate": "^1.0.7"
|
|
73
|
+
},
|
|
74
|
+
"sideEffects": false,
|
|
75
|
+
"lint-staged": {
|
|
76
|
+
"*.css": [
|
|
77
|
+
"npm run lintStyle"
|
|
78
|
+
],
|
|
79
|
+
"*.js": [
|
|
80
|
+
"npm run lintJs"
|
|
81
|
+
],
|
|
82
|
+
"*.php": [
|
|
83
|
+
"composer test"
|
|
84
|
+
]
|
|
85
|
+
},
|
|
86
|
+
"scripts": {
|
|
87
|
+
"lintStyle": "stylelint **/*.css",
|
|
88
|
+
"lintJs": "npx eslint",
|
|
89
|
+
"lint": "npm run lintJs && npm run lintStyle"
|
|
90
|
+
}
|
|
91
|
+
}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { __, sprintf } from '@wordpress/i18n';
|
|
3
3
|
import { Inserter } from '@wordpress/block-editor';
|
|
4
|
+
import { useSuspenseSelect } from '@wordpress/data';
|
|
4
5
|
import { Button } from '@eightshift/ui-components';
|
|
5
6
|
import { icons } from '@eightshift/ui-components/icons';
|
|
6
7
|
import { clsx } from '@eightshift/ui-components/utilities';
|
|
@@ -15,6 +16,7 @@ import { clsx } from '@eightshift/ui-components/utilities';
|
|
|
15
16
|
* @param {boolean} [props.small] - If `true`, the button's size is reduced, perfect for added visual separation in hierarchical InnerBlocks.
|
|
16
17
|
* @param {string} [props.className] - Additional classes to add to the control base.
|
|
17
18
|
* @param {boolean} [props.prioritizePatterns] - Whether to show patterns before blocks in the inserter.
|
|
19
|
+
* @param {boolean} [props.alwaysVisible=false] - If `true`, the inserter is always visible, regardless of whether the block is selected.
|
|
18
20
|
* @param {boolean} [props.hidden] - If `true`, the component is not rendered.
|
|
19
21
|
*
|
|
20
22
|
* @returns {JSX.Element} The BlockInserter component.
|
|
@@ -25,12 +27,26 @@ import { clsx } from '@eightshift/ui-components/utilities';
|
|
|
25
27
|
* @preserve
|
|
26
28
|
*/
|
|
27
29
|
export const BlockInserter = (props) => {
|
|
28
|
-
const {
|
|
30
|
+
const {
|
|
31
|
+
clientId,
|
|
32
|
+
label,
|
|
33
|
+
small = false,
|
|
34
|
+
className,
|
|
35
|
+
prioritizePatterns = false,
|
|
36
|
+
alwaysVisible = false,
|
|
37
|
+
hidden,
|
|
38
|
+
} = props;
|
|
39
|
+
|
|
40
|
+
const currentBlockClientId = useSuspenseSelect((select) => select('core/block-editor')?.getSelectedBlockClientId());
|
|
29
41
|
|
|
30
42
|
if (hidden) {
|
|
31
43
|
return null;
|
|
32
44
|
}
|
|
33
45
|
|
|
46
|
+
if (!alwaysVisible && currentBlockClientId !== clientId) {
|
|
47
|
+
return null;
|
|
48
|
+
}
|
|
49
|
+
|
|
34
50
|
return (
|
|
35
51
|
<Inserter
|
|
36
52
|
rootClientId={clientId}
|
|
@@ -860,6 +860,11 @@ export const registerBlock = (
|
|
|
860
860
|
...getExample('', blockManifest),
|
|
861
861
|
};
|
|
862
862
|
|
|
863
|
+
// Block supports.
|
|
864
|
+
if (typeof blockManifest['supports'] === 'undefined') {
|
|
865
|
+
blockManifest['supports'] = {};
|
|
866
|
+
}
|
|
867
|
+
|
|
863
868
|
return {
|
|
864
869
|
blockName: fullBlockName,
|
|
865
870
|
options: {
|
|
@@ -887,7 +892,8 @@ export const registerBlock = (
|
|
|
887
892
|
return customName;
|
|
888
893
|
},
|
|
889
894
|
supports: {
|
|
890
|
-
|
|
895
|
+
...blockManifest['supports'],
|
|
896
|
+
__experimentalMetadata: true, // Required for renaming blocks.
|
|
891
897
|
},
|
|
892
898
|
},
|
|
893
899
|
};
|