@total_onion/onion-library 3.2.0 → 3.2.2

package/components/component-block-padding-v3/block-padding-v3.scss

@@ -0,0 +1,64 @@
+@use '../fields-core-mixins-v3/core-mixins-v3';
+@use '../fields-core-functions-v3/core-functions-v3';
+@use '../../breakpoints';
+
+@mixin blockPadding() {
+	@layer components {
+		.cmpl-block-padding {
+			padding: calc(
+					var(--global-inline-spacing) *
+						var(--padding-block-multiplier-mobile-top, 0)
+				)
+				calc(
+					var(--global-inline-spacing) *
+						var(--padding-inline-multiplier-mobile-right, 0)
+				)
+				calc(
+					var(--global-inline-spacing) *
+						var(--padding-block-multiplier-mobile-bottom, 0)
+				)
+				calc(
+					var(--global-inline-spacing) *
+						var(--padding-inline-multiplier-mobile-left, 0)
+				);
+
+			@include core-mixins-v3.device(breakpoints.$tabPortrait) {
+				padding: calc(
+						var(--global-inline-spacing) *
+							var(--padding-block-multiplier-portrait-top, 0)
+					)
+					calc(
+						var(--global-inline-spacing) *
+							var(--padding-inline-multiplier-portrait-right, 0)
+					)
+					calc(
+						var(--global-inline-spacing) *
+							var(--padding-block-multiplier-portrait-bottom, 0)
+					)
+					calc(
+						var(--global-inline-spacing) *
+							var(--padding-inline-multiplier-portrait-left, 0)
+					);
+			}
+
+			@include core-mixins-v3.device(breakpoints.$tabLandscape) {
+				padding: calc(
+						var(--global-inline-spacing) *
+							var(--padding-block-multiplier-desktop-top, 0)
+					)
+					calc(
+						var(--global-inline-spacing) *
+							var(--padding-inline-multiplier-desktop-right, 0)
+					)
+					calc(
+						var(--global-inline-spacing) *
+							var(--padding-block-multiplier-desktop-bottom, 0)
+					)
+					calc(
+						var(--global-inline-spacing) *
+							var(--padding-inline-multiplier-desktop-left, 0)
+					);
+			}
+		}
+	}
+}

package/components/component-block-padding-v3/block-padding-v3.twig

@@ -0,0 +1,33 @@
+{% set paddingVertMultiplierDesktopTop = "--padding-block-multiplier-desktop-top: 0;" %}
+{% set paddingVertMultiplierDesktopBottom = "--padding-block-multiplier-desktop-bottom: 0;" %}
+{% set paddingHorizMultiplierDesktopRight = "--padding-inline-multiplier-desktop-right: 0;" %}
+{% set paddingHorizMultiplierDesktopLeft = "--padding-inline-multiplier-desktop-left: 0;" %}
+{% set paddingVertMultiplierDesktop = "--padding-block-multiplier-desktop: 0;" %}
+{% set paddingVertMultiplierPortraitTop = "--padding-block-multiplier-portrait-top: 0;" %}
+{% set paddingVertMultiplierPortraitBottom = "--padding-block-multiplier-portrait-bottom: 0;" %}
+{% set paddingHorizMultiplierPortraitRight = "--padding-inline-multiplier-portrait-right: 0;" %}
+{% set paddingHorizMultiplierPortraitLeft = "--padding-inline-multiplier-portrait-left: 0;" %}
+{% set paddingVertMultiplierPortrait = "--padding-block-multiplier-portrait: 0;" %}
+{% set paddingVertMultiplierMobileTop = "--padding-block-multiplier-mobile-top: 0;" %}
+{% set paddingVertMultiplierMobileBottom = "--padding-block-multiplier-mobile-bottom: 0;" %}
+{% set paddingHorizMultiplierMobileRight = "--padding-inline-multiplier-mobile-right: 0;" %}
+{% set paddingHorizMultiplierMobileLeft = "--padding-inline-multiplier-mobile-left: 0;" %}
+{% set paddingVertMultiplierMobile = "--padding-block-multiplier-mobile: 0;" %}
+
+{% if fields.enable_block_padding %}
+	{% set paddingVertMultiplierMobileTop = "--padding-block-multiplier-mobile-top:" ~ fields.block_vertical_padding_mobile_top ~ ";" %}
+	{% set paddingVertMultiplierMobileBottom = "--padding-block-multiplier-mobile-bottom:" ~ fields.block_vertical_padding_mobile_bottom ~ ";" %}
+	{% set paddingHorizMultiplierMobileRight = "--padding-inline-multiplier-mobile-right:" ~ fields.block_horizontal_padding_mobile_right ~ ";" %}
+	{% set paddingHorizMultiplierMobileLeft = "--padding-inline-multiplier-mobile-left:" ~ fields.block_horizontal_padding_mobile_left ~ ";" %}
+	{% set paddingVertMultiplierPortraitTop = "--padding-block-multiplier-portrait-top:" ~ fields.block_vertical_padding_portrait_top ~ ";" %}
+	{% set paddingVertMultiplierPortraitBottom = "--padding-block-multiplier-portrait-bottom:" ~ fields.block_vertical_padding_portrait_bottom ~ ";" %}
+	{% set paddingHorizMultiplierPortraitRight = "--padding-inline-multiplier-portrait-right:" ~ fields.block_horizontal_padding_portrait_right ~ ";" %}
+	{% set paddingHorizMultiplierPortraitLeft = "--padding-inline-multiplier-portrait-left:" ~ fields.block_horizontal_padding_portrait_left ~ ";" %}
+	{% set paddingVertMultiplierDesktopTop = "--padding-block-multiplier-desktop-top:" ~ fields.block_vertical_padding_desktop_top ~ ";" %}
+	{% set paddingVertMultiplierDesktopBottom = "--padding-block-multiplier-desktop-bottom:" ~ fields.block_vertical_padding_desktop_bottom ~ ";" %}
+	{% set paddingHorizMultiplierDesktopRight = "--padding-inline-multiplier-desktop-right:" ~ fields.block_horizontal_padding_desktop_right ~ ";" %}
+	{% set paddingHorizMultiplierDesktopLeft = "--padding-inline-multiplier-desktop-left:" ~ fields.block_horizontal_padding_desktop_left ~ ";" %}
+{% endif %}
+
+{% set blockPaddingString = paddingVertMultiplierDesktop ~ paddingVertMultiplierDesktopTop ~ paddingVertMultiplierDesktopBottom ~ paddingHorizMultiplierDesktopRight ~ paddingHorizMultiplierDesktopLeft ~ paddingVertMultiplierMobileTop ~ paddingVertMultiplierMobileBottom ~ paddingHorizMultiplierMobileLeft ~ paddingHorizMultiplierMobileRight ~ paddingVertMultiplierMobile ~ paddingVertMultiplierPortraitTop ~ paddingVertMultiplierPortraitBottom ~ paddingHorizMultiplierPortraitLeft ~ paddingHorizMultiplierPortraitRight ~ paddingVertMultiplierPortrait %}
+{{blockPaddingString}}

package/components/component-block-padding-v3/group_689f66f3e26df.json

@@ -0,0 +1,535 @@
+{
+    "key": "group_689f66f3e26df",
+    "title": "Component: Block Padding v3",
+    "fields": [
+        {
+            "key": "field_689f66f3f20a0",
+            "label": "Enable block padding",
+            "name": "enable_block_padding",
+            "aria-label": "",
+            "type": "true_false",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "50",
+                "class": "",
+                "id": ""
+            },
+            "wpml_cf_preferences": 3,
+            "user_roles": [
+                "administrator"
+            ],
+            "message": "",
+            "default_value": 0,
+            "ui_on_text": "",
+            "ui_off_text": "",
+            "ui": 1,
+            "style": ""
+        },
+        {
+            "key": "field_689f66f3f4033",
+            "label": "Desktop control:",
+            "name": "desktop_control",
+            "aria-label": "",
+            "type": "group",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": [
+                [
+                    {
+                        "field": "field_689f66f3f20a0",
+                        "operator": "==",
+                        "value": "1"
+                    },
+                    {
+                        "field": "field_689f66f3f242d",
+                        "operator": "==",
+                        "value": "1"
+                    }
+                ]
+            ],
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "wpml_cf_preferences": 3,
+            "user_roles": [
+                "administrator"
+            ],
+            "layout": "block",
+            "acfe_seamless_style": 0,
+            "acfe_group_modal": 0,
+            "acfe_group_modal_close": 0,
+            "acfe_group_modal_button": "",
+            "acfe_group_modal_size": "large",
+            "sub_fields": []
+        },
+        {
+            "key": "field_689f66f4001cb",
+            "label": "Block vertical padding desktop top",
+            "name": "block_vertical_padding_desktop_top",
+            "aria-label": "",
+            "type": "range",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": [
+                [
+                    {
+                        "field": "field_689f66f3f20a0",
+                        "operator": "==",
+                        "value": "1"
+                    }
+                ]
+            ],
+            "wrapper": {
+                "width": "50",
+                "class": "",
+                "id": ""
+            },
+            "default_value": 1,
+            "min": 0,
+            "max": 12,
+            "allow_in_bindings": 1,
+            "step": "0.125",
+            "prepend": "",
+            "append": ""
+        },
+        {
+            "key": "field_689f66f4005b5",
+            "label": "Block vertical padding desktop bottom",
+            "name": "block_vertical_padding_desktop_bottom",
+            "aria-label": "",
+            "type": "range",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": [
+                [
+                    {
+                        "field": "field_689f66f3f20a0",
+                        "operator": "==",
+                        "value": "1"
+                    }
+                ]
+            ],
+            "wrapper": {
+                "width": "50",
+                "class": "",
+                "id": ""
+            },
+            "default_value": 1,
+            "min": 0,
+            "max": 12,
+            "allow_in_bindings": 1,
+            "step": "0.125",
+            "prepend": "",
+            "append": ""
+        },
+        {
+            "key": "field_689f66f400999",
+            "label": "Block horizontal padding desktop left",
+            "name": "block_horizontal_padding_desktop_left",
+            "aria-label": "",
+            "type": "range",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": [
+                [
+                    {
+                        "field": "field_689f66f3f20a0",
+                        "operator": "==",
+                        "value": "1"
+                    }
+                ]
+            ],
+            "wrapper": {
+                "width": "50",
+                "class": "",
+                "id": ""
+            },
+            "default_value": 1,
+            "min": 0,
+            "max": 12,
+            "allow_in_bindings": 1,
+            "step": "0.125",
+            "prepend": "",
+            "append": ""
+        },
+        {
+            "key": "field_689f66f400d8a",
+            "label": "Block horizontal padding desktop right",
+            "name": "block_horizontal_padding_desktop_right",
+            "aria-label": "",
+            "type": "range",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": [
+                [
+                    {
+                        "field": "field_689f66f3f20a0",
+                        "operator": "==",
+                        "value": "1"
+                    }
+                ]
+            ],
+            "wrapper": {
+                "width": "50",
+                "class": "",
+                "id": ""
+            },
+            "default_value": 1,
+            "min": 0,
+            "max": 12,
+            "allow_in_bindings": 1,
+            "step": "0.125",
+            "prepend": "",
+            "append": ""
+        },
+        {
+            "key": "field_689f66f40116e",
+            "label": "Portrait control:",
+            "name": "portrait_control",
+            "aria-label": "",
+            "type": "group",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": [
+                [
+                    {
+                        "field": "field_689f66f3f20a0",
+                        "operator": "==",
+                        "value": "1"
+                    },
+                    {
+                        "field": "field_689f66f3f242d",
+                        "operator": "==",
+                        "value": "1"
+                    }
+                ]
+            ],
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "wpml_cf_preferences": 3,
+            "user_roles": [
+                "administrator"
+            ],
+            "layout": "block",
+            "acfe_seamless_style": 0,
+            "acfe_group_modal": 0,
+            "acfe_group_modal_close": 0,
+            "acfe_group_modal_button": "",
+            "acfe_group_modal_size": "large",
+            "sub_fields": []
+        },
+        {
+            "key": "field_689f66f401555",
+            "label": "Block vertical padding portrait top",
+            "name": "block_vertical_padding_portrait_top",
+            "aria-label": "",
+            "type": "range",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": [
+                [
+                    {
+                        "field": "field_689f66f3f20a0",
+                        "operator": "==",
+                        "value": "1"
+                    }
+                ]
+            ],
+            "wrapper": {
+                "width": "50",
+                "class": "",
+                "id": ""
+            },
+            "default_value": 1,
+            "min": 0,
+            "max": 12,
+            "allow_in_bindings": 1,
+            "step": "0.125",
+            "prepend": "",
+            "append": ""
+        },
+        {
+            "key": "field_689f66f401945",
+            "label": "Block vertical padding portrait bottom",
+            "name": "block_vertical_padding_portrait_bottom",
+            "aria-label": "",
+            "type": "range",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": [
+                [
+                    {
+                        "field": "field_689f66f3f20a0",
+                        "operator": "==",
+                        "value": "1"
+                    }
+                ]
+            ],
+            "wrapper": {
+                "width": "50",
+                "class": "",
+                "id": ""
+            },
+            "default_value": 1,
+            "min": 0,
+            "max": 12,
+            "allow_in_bindings": 1,
+            "step": "0.125",
+            "prepend": "",
+            "append": ""
+        },
+        {
+            "key": "field_689f66f401d2e",
+            "label": "Block horizontal padding portrait left",
+            "name": "block_horizontal_padding_portrait_left",
+            "aria-label": "",
+            "type": "range",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": [
+                [
+                    {
+                        "field": "field_689f66f3f20a0",
+                        "operator": "==",
+                        "value": "1"
+                    }
+                ]
+            ],
+            "wrapper": {
+                "width": "50",
+                "class": "",
+                "id": ""
+            },
+            "default_value": 1,
+            "min": 0,
+            "max": 10,
+            "allow_in_bindings": 1,
+            "step": "0.125",
+            "prepend": "",
+            "append": ""
+        },
+        {
+            "key": "field_689f66f402109",
+            "label": "Block horizontal padding portrait right",
+            "name": "block_horizontal_padding_portrait_right",
+            "aria-label": "",
+            "type": "range",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": [
+                [
+                    {
+                        "field": "field_689f66f3f20a0",
+                        "operator": "==",
+                        "value": "1"
+                    }
+                ]
+            ],
+            "wrapper": {
+                "width": "50",
+                "class": "",
+                "id": ""
+            },
+            "default_value": 1,
+            "min": 0,
+            "max": 8,
+            "allow_in_bindings": 1,
+            "step": "0.125",
+            "prepend": "",
+            "append": ""
+        },
+        {
+            "key": "field_689f66f4024f3",
+            "label": "Mobile control:",
+            "name": "mobile_control",
+            "aria-label": "",
+            "type": "group",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": [
+                [
+                    {
+                        "field": "field_689f66f3f20a0",
+                        "operator": "==",
+                        "value": "1"
+                    },
+                    {
+                        "field": "field_689f66f3f242d",
+                        "operator": "==",
+                        "value": "1"
+                    }
+                ]
+            ],
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "wpml_cf_preferences": 3,
+            "user_roles": [
+                "administrator"
+            ],
+            "layout": "block",
+            "acfe_seamless_style": 0,
+            "acfe_group_modal": 0,
+            "acfe_group_modal_close": 0,
+            "acfe_group_modal_button": "",
+            "acfe_group_modal_size": "large",
+            "sub_fields": []
+        },
+        {
+            "key": "field_689f66f4028da",
+            "label": "Block vertical padding mobile top",
+            "name": "block_vertical_padding_mobile_top",
+            "aria-label": "",
+            "type": "range",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": [
+                [
+                    {
+                        "field": "field_689f66f3f20a0",
+                        "operator": "==",
+                        "value": "1"
+                    }
+                ]
+            ],
+            "wrapper": {
+                "width": "50",
+                "class": "",
+                "id": ""
+            },
+            "default_value": 1,
+            "min": 0,
+            "max": 12,
+            "allow_in_bindings": 1,
+            "step": "0.125",
+            "prepend": "",
+            "append": ""
+        },
+        {
+            "key": "field_689f66f402cc4",
+            "label": "Block vertical padding mobile bottom",
+            "name": "block_vertical_padding_mobile_bottom",
+            "aria-label": "",
+            "type": "range",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": [
+                [
+                    {
+                        "field": "field_689f66f3f20a0",
+                        "operator": "==",
+                        "value": "1"
+                    }
+                ]
+            ],
+            "wrapper": {
+                "width": "50",
+                "class": "",
+                "id": ""
+            },
+            "default_value": 1,
+            "min": 0,
+            "max": 12,
+            "allow_in_bindings": 1,
+            "step": "0.125",
+            "prepend": "",
+            "append": ""
+        },
+        {
+            "key": "field_689f66f4030b5",
+            "label": "Block horizontal padding mobile left",
+            "name": "block_horizontal_padding_mobile_left",
+            "aria-label": "",
+            "type": "range",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": [
+                [
+                    {
+                        "field": "field_689f66f3f20a0",
+                        "operator": "==",
+                        "value": "1"
+                    }
+                ]
+            ],
+            "wrapper": {
+                "width": "50",
+                "class": "",
+                "id": ""
+            },
+            "default_value": 1,
+            "min": "",
+            "max": 8,
+            "allow_in_bindings": 1,
+            "step": "0.125",
+            "prepend": "",
+            "append": ""
+        },
+        {
+            "key": "field_689f66f403494",
+            "label": "Block horizontal padding mobile right",
+            "name": "block_horizontal_padding_mobile_right",
+            "aria-label": "",
+            "type": "range",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": [
+                [
+                    {
+                        "field": "field_689f66f3f20a0",
+                        "operator": "==",
+                        "value": "1"
+                    }
+                ]
+            ],
+            "wrapper": {
+                "width": "50",
+                "class": "",
+                "id": ""
+            },
+            "default_value": 1,
+            "min": "",
+            "max": 8,
+            "allow_in_bindings": 1,
+            "step": "0.125",
+            "prepend": "",
+            "append": ""
+        }
+    ],
+    "location": [
+        [
+            {
+                "param": "block",
+                "operator": "!=",
+                "value": "all"
+            }
+        ]
+    ],
+    "menu_order": 0,
+    "position": "side",
+    "style": "default",
+    "label_placement": "top",
+    "instruction_placement": "label",
+    "hide_on_screen": "",
+    "active": false,
+    "description": "Library version - Do not modify in this project as any changes will be overwritten by future updates.",
+    "show_in_rest": 0,
+    "display_title": "",
+    "acfe_autosync": [
+        "json"
+    ],
+    "acfe_form": 0,
+    "acfe_display_title": "",
+    "acfe_meta": "",
+    "acfe_note": "",
+    "modified": 1761474517
+}

package/components/component-block-settings-v3/block-settings-v3.scss

@@ -0,0 +1,46 @@
+@use '../../breakpoints';
+@use '../fields-core-mixins-v3/core-mixins-v3';
+@use '../fields-core-functions-v3/core-functions-v3';
+
+@mixin blockSettings() {
+	@layer components {
+		.cmpl-block-settings {
+			min-height: core-functions-v3.fluidSize(
+				var(--block-min-height-mobile, 0),
+				'mobile'
+			);
+			height: var(--block-height-mobile, auto);
+			overflow: var(--block-overflow, hidden);
+			border-radius: var(--block-border-radius);
+			position: var(--block-position-type, relative);
+			z-index: var(--block-z-index, 5);
+			top: var(--block-position-top, unset);
+			right: var(--block-position-right, unset);
+			bottom: var(--block-position-bottom, unset);
+			left: var(--block-position-left, unset);
+			background-color: var(--block-background-colour, transparent);
+			pointer-events: var(--block-pointer-events, all);
+			aspect-ratio: var(--block-aspect-ratio-mobile, unset);
+			.wp-admin & {
+				position: relative;
+			}
+
+			@include core-mixins-v3.device(breakpoints.$tabPortrait) {
+				height: var(--block-height-portrait, auto);
+				aspect-ratio: var(--block-aspect-ratio-portrait, unset);
+				min-height: core-functions-v3.fluidSize(
+					var(--block-min-height-portrait, 0),
+					'portrait'
+				);
+			}
+			@include core-mixins-v3.device(breakpoints.$tabLandscape) {
+				height: var(--block-height-desktop, auto);
+				aspect-ratio: var(--block-aspect-ratio, unset);
+				min-height: core-functions-v3.fluidSize(
+					var(--block-min-height-desktop, 0),
+					'landscape'
+				);
+			}
+		}
+	}
+}