@themarioga/grid-editor 8.0.0-beta.3 → 8.0.0

package/src/js/plugins/grideditor.inline-style.js

@@ -0,0 +1,185 @@
+/**
+ * Inline style for grid-editor.
+ *
+ * A utility plugin: load this file after the editor and every row, column,
+ * container, pane, element and section gets a Style accordion in its
+ * settings panel - size, spacing, border, background, text, typography,
+ * display, flex, position and free css - written to the node's own style
+ * attribute, with Bootstrap's classes for each section as chips that put
+ * them in the classes field. What it can ask the editor for is the handle
+ * its factory is called with, described in docs/plugins.md.
+ *
+ *   <script src="dist/grideditor.min.js"></script>
+ *   <script src="dist/plugins/grideditor.inline-style.min.js"></script>
+ *
+ * It also edits spacing, text alignment, display, flex, sticky and float,
+ * Bootstrap's responsive classes, per breakpoint in its sections. On a node
+ * that is flex or grid, the drawer leaves the flow, so the canvas lays the
+ * content out as the page will.
+ *
+ * Where the settings panel has no room for it - a popover, inline in the
+ * drawer - the accordion opens in a dialog, from a Style button.
+ *
+ * inline_style.sections chooses the sections, and in each the properties and
+ * whether it has a catalog; inline_style.spacing is the options of spacing, whose
+ * scale the gaps share, and inline_style.visibility those of the eye.
+ */
+import { GridEditor } from '../grideditor.js';
+import { spacingPart } from '../inline-style/spacing.js';
+import { textalignPart } from '../inline-style/textalign.js';
+import { displayPart } from '../inline-style/display.js';
+import { flexPart } from '../inline-style/flex.js';
+import { floatPart } from '../inline-style/float.js';
+import { stickyPart } from '../inline-style/sticky.js';
+import { drawerflowPart } from '../inline-style/drawerflow.js';
+import { resolveOptions } from '../inline-style/options.js';
+import { createAccordion } from '../inline-style/accordion.js';
+
+Object.assign(GridEditor.locales.en, {
+    'inline_style.section_title': 'Style',
+    'inline_style.dialog_title': 'Style: {kind}',
+    'inline_style.section_size': 'Size',
+    'inline_style.section_spacing': 'Spacing',
+    'inline_style.section_border': 'Border',
+    'inline_style.section_background': 'Background',
+    'inline_style.section_text': 'Text',
+    'inline_style.section_typography': 'Typography',
+    'inline_style.section_display': 'Display',
+    'inline_style.section_flex': 'Flex',
+    'inline_style.section_position': 'Position',
+    'inline_style.section_custom': 'Custom css',
+    'inline_style.all_sizes': 'Applies to every size',
+    'inline_style.overridden': 'The class {class} takes priority over this value',
+    'inline_style.invalid': 'Not a value this property takes',
+    'inline_style.catalog': 'Bootstrap classes',
+    'inline_style.shadow_x': 'X',
+    'inline_style.shadow_y': 'Y',
+    'inline_style.shadow_blur': 'Blur',
+    'inline_style.shadow_spread': 'Spread',
+    'inline_style.shadow_color': 'Color',
+    'inline_style.shadow_inset': 'Inset',
+    'inline_style.shadow_text_mode': 'Edit as text',
+    'inline_style.prop_width': 'Width',
+    'inline_style.prop_height': 'Height',
+    'inline_style.prop_min_width': 'Min width',
+    'inline_style.prop_min_height': 'Min height',
+    'inline_style.prop_max_width': 'Max width',
+    'inline_style.prop_max_height': 'Max height',
+    'inline_style.prop_margin_top': 'Margin top',
+    'inline_style.prop_margin_right': 'Margin right',
+    'inline_style.prop_margin_bottom': 'Margin bottom',
+    'inline_style.prop_margin_left': 'Margin left',
+    'inline_style.prop_padding_top': 'Padding top',
+    'inline_style.prop_padding_right': 'Padding right',
+    'inline_style.prop_padding_bottom': 'Padding bottom',
+    'inline_style.prop_padding_left': 'Padding left',
+    'inline_style.prop_border_width': 'Border width',
+    'inline_style.prop_border_style': 'Border style',
+    'inline_style.prop_border_color': 'Border color',
+    'inline_style.prop_border_radius': 'Border radius',
+    'inline_style.prop_box_shadow': 'Shadow',
+    'inline_style.prop_background_color': 'Background color',
+    'inline_style.prop_background_image': 'Background image',
+    'inline_style.prop_background_size': 'Background size',
+    'inline_style.prop_background_position': 'Background position',
+    'inline_style.prop_background_repeat': 'Background repeat',
+    'inline_style.prop_color': 'Color',
+    'inline_style.prop_font_size': 'Font size',
+    'inline_style.prop_text_align': 'Text align',
+    'inline_style.prop_text_shadow': 'Text shadow',
+    'inline_style.prop_font_family': 'Font family',
+    'inline_style.prop_font_weight': 'Font weight',
+    'inline_style.prop_font_style': 'Font style',
+    'inline_style.prop_line_height': 'Line height',
+    'inline_style.prop_letter_spacing': 'Letter spacing',
+    'inline_style.prop_text_transform': 'Text transform',
+    'inline_style.prop_text_decoration': 'Text decoration',
+    'inline_style.prop_display': 'Display',
+    'inline_style.prop_opacity': 'Opacity',
+    'inline_style.prop_overflow': 'Overflow',
+    'inline_style.prop_visibility': 'Visibility',
+    'inline_style.prop_position': 'Position',
+    'inline_style.prop_top': 'Top',
+    'inline_style.prop_right': 'Right',
+    'inline_style.prop_bottom': 'Bottom',
+    'inline_style.prop_left': 'Left',
+    'inline_style.prop_z_index': 'Z-index',
+});
+
+// The drawer's part last: it asks the browser how the others left the node
+var PARTS = ['spacing', 'textalign', 'display', 'flex', 'float', 'sticky', 'drawerflow'];
+
+GridEditor.utilities['inline-style'] = function(ge) {
+
+    var options = resolveOptions(ge);
+    var parts = {
+        spacing: spacingPart(ge, options.spacing),
+        textalign: textalignPart(ge),
+        display: displayPart(ge, options.visibility),
+        flex: flexPart(ge, options.spacing),
+        float: floatPart(ge),
+        sticky: stickyPart(ge),
+        drawerflow: drawerflowPart(ge),
+    };
+    var accordions = []; // { node, accordion } for every panel built since the last init
+    var context = {
+        sections: options.sections,
+        parts: parts,
+        state: { open: null },
+        opened: function(key) {
+            accordions.forEach(function(entry) { entry.accordion.open(key); });
+        },
+    };
+
+    /** Every part's hook, called in turn. */
+    function each(hook) {
+        return function() {
+            var args = arguments;
+            PARTS.forEach(function(name) {
+                if (parts[name][hook]) { parts[name][hook].apply(null, args); }
+            });
+        };
+    }
+
+    var partsRefresh = each('onRefresh');
+
+    return {
+        // The parts' families, edited in the sections rather than in Responsive
+        families: PARTS.reduce(function(all, name) {
+            return all.concat(parts[name].families.map(function(family) {
+                return Object.assign({}, family, { panel: false });
+            }));
+        }, []),
+
+        panelSection: function(node, kind) {
+            var accordion = createAccordion(ge, node, kind, context);
+            if (!accordion) { return null; }
+
+            accordions.push({ node: node, accordion: accordion });
+
+            return { labelKey: 'inline_style.section_title', titleKey: 'inline_style.dialog_title', body: accordion.element };
+        },
+
+        preview: function(node, kind, breakpoint) {
+            return parts.spacing.preview(node, kind, breakpoint);
+        },
+
+        // After a write, a change of classes or of view: the accordions of
+        // the nodes it touched follow
+        onRefresh: function(scope) {
+            partsRefresh(scope);
+
+            accordions = accordions.filter(function(entry) { return entry.accordion.element.isConnected; });
+            accordions.forEach(function(entry) {
+                if (entry.node === scope || scope.contains(entry.node)) { entry.accordion.render(); }
+            });
+        },
+
+        drawerTools: each('drawerTools'),
+
+        onDeinit: function() {
+            each('onDeinit')();
+            accordions = [];
+        },
+    };
+};

package/src/less/grideditor.less

@@ -248,6 +248,19 @@
         flex-direction: column;
         gap: 8px;
     }
+    /* Each section's heading: the general fields, and what plugins add */
+    .ge-section-title {
+        margin: 0 0 6px;
+        color: var(--bs-body-color, #333);
+        font-size: 0.8125rem;
+        font-weight: 600;
+    }
+    /* Every section after the first, set off from the one above */
+    .ge-panel-section,
+    .ge-utilities {
+        padding-top: 10px;
+        border-top: 1px solid var(--bs-border-color-translucent, rgba(0,0,0,0.1));
+    }
     .ge-field {
         display: flex;
         flex-direction: column;
@@ -270,7 +283,7 @@
         > .ge-utilities-toggle {
             display: block;
             color: var(--bs-body-color, #333);
-            font-weight: 500;
+            font-weight: 600;
             cursor: pointer;
             text-decoration: none;
 
@@ -342,9 +355,9 @@
     margin-top: 10px;
 }
 
-/* The style plugin's accordion: in a panel, or in the dialog, which is
+/* The inline-style plugin's accordion: in a panel, or in the dialog, which is
    outside any panel, so it carries the look of the fields it shares. */
-.ge-style {
+.ge-inline-style {
     font-size: 0.8125rem;
 
     .accordion-button {
@@ -359,26 +372,26 @@
         padding: 8px 10px;
     }
 
-    .ge-style-label,
+    .ge-inline-style-label,
     .ge-utility-label,
-    .ge-style-shadow-label {
+    .ge-inline-style-shadow-label {
         color: var(--bs-secondary-color, #6c757d);
         font-size: 0.75rem;
     }
-    .ge-style-note,
+    .ge-inline-style-note,
     .ge-utility-note,
     .ge-spacing-gutter {
         color: var(--bs-secondary-color, #666);
         font-size: 0.6875rem;
     }
 
-    .ge-style-fields,
+    .ge-inline-style-fields,
     .ge-spacing {
         display: grid;
         grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
         gap: 8px 10px;
     }
-    .ge-style-field,
+    .ge-inline-style-field,
     .ge-utility,
     .ge-spacing-group {
         display: flex;
@@ -393,47 +406,47 @@
         grid-column: 1 / -1;
     }
 
-    .ge-style-color .form-control-color {
+    .ge-inline-style-color .form-control-color {
         flex: 0 0 2.25rem;
         padding: 2px;
     }
 
-    .ge-style-shadow,
-    .ge-style-field:has(.ge-style-shadow) {
+    .ge-inline-style-shadow,
+    .ge-inline-style-field:has(.ge-inline-style-shadow) {
         grid-column: 1 / -1;
     }
-    .ge-style-shadow-builder {
+    .ge-inline-style-shadow-builder {
         display: grid;
         grid-template-columns: repeat(auto-fill, minmax(70px, 1fr));
         gap: 4px 8px;
         align-items: end;
     }
-    .ge-style-shadow-part {
+    .ge-inline-style-shadow-part {
         display: flex;
         flex-direction: column;
         gap: 2px;
         margin: 0;
     }
-    .ge-style-shadow-color {
+    .ge-inline-style-shadow-color {
         grid-column: span 2;
     }
-    .ge-style-shadow-mode {
+    .ge-inline-style-shadow-mode {
         display: inline-block;
         margin-top: 2px;
         font-size: 0.6875rem;
     }
 
-    .ge-style-catalog {
+    .ge-inline-style-catalog {
         display: flex;
         flex-direction: column;
         gap: 4px;
     }
-    .ge-style-chips {
+    .ge-inline-style-chips {
         display: flex;
         flex-wrap: wrap;
         gap: 3px;
     }
-    .ge-style-chip {
+    .ge-inline-style-chip {
         --bs-btn-padding-y: 0;
         --bs-btn-padding-x: 6px;
         --bs-btn-font-size: 0.6875rem;
@@ -523,7 +536,6 @@
         -moz-user-select: none;
         -ms-user-select: none;
         user-select: none;
-        background: blue;
         margin: 0 -@editGutter @editGutter;
         display: block;
         width: calc(~"100% +" 2 * @editGutter);
@@ -547,6 +559,10 @@
             text-align: left;
             cursor: auto;
 
+            /* The one line a drawer has room for needs no heading */
+            > .ge-section-title {
+                display: none;
+            }
             .ge-details-general {
                 flex-direction: row;
                 align-items: flex-end;
@@ -568,6 +584,12 @@
         margin-right: 0;
         
         > .ge-tools-drawer {
+            /* Bootstrap pads every child of a row by half its gutter, and
+               caps it at the row's width: the drawer is not a column */
+            padding-left: 0;
+            padding-right: 0;
+            max-width: none;
+
             > a {
                 color: #666;
             }
@@ -1143,7 +1165,7 @@
 .ge-layout-modes();
 
 /*
- * The style plugin's display. A node Bootstrap would hide is kept on the
+ * The inline-style plugin's display. A node Bootstrap would hide is kept on the
  * canvas - there would be nothing left to click to show it again - and shown
  * as it would be if it were not hidden, which data-ge-display says. The
  * selectors outweigh Bootstrap's d-* classes, which are !important too.
@@ -1186,7 +1208,7 @@
 }
 
 /*
- * The style plugin's drawer on a flex or grid node: out of the flow, on top
+ * The inline-style plugin's drawer on a flex or grid node: out of the flow, on top
  * and as wide as the node, over a transparent top border as tall as it is.
  * The border's width comes with the node's data-ge-drawer-out, from a rule
  * per height the plugin writes. The selectors outweigh Bootstrap's border
@@ -1236,10 +1258,6 @@
     > .ge-tools-drawer {
         margin-top: 0;
         margin-bottom: calc(@editGutter - var(--bs-gutter-y));
-        /* Bootstrap pads every child of a row by half its gutter, the drawer
-           too; it keeps the padding a row with no gutter class gives it */
-        padding-left: .75rem;
-        padding-right: .75rem;
     }
 
     > .column {

package/types/grideditor.d.ts

@@ -53,11 +53,11 @@ export interface PresetClass {
 }
 
 /** A content filter: run on init and deinit with the canvas. A string names a function on window. */
-/** A section of the style plugin's accordion. */
-export type StyleSectionKey = 'size' | 'spacing' | 'border' | 'background' | 'text' | 'typography' | 'display' | 'flex' | 'position' | 'custom';
+/** A section of the inline-style plugin's accordion. */
+export type InlineStyleSectionKey = 'size' | 'spacing' | 'border' | 'background' | 'text' | 'typography' | 'display' | 'flex' | 'position' | 'custom';
 
 /** A section on or off, or on with some of its properties and without its catalog. */
-export type StyleSection = boolean | { properties?: string[]; catalog?: boolean };
+export type InlineStyleSection = boolean | { properties?: string[]; catalog?: boolean };
 
 /**
  * A tabs container's variant: its strip's style, width and alignment, and
@@ -77,10 +77,10 @@ export interface CreateTabsOptions extends Placement, TabsOptions {
     labels?: string[];
 }
 
-/** The style plugin's settings. */
-export interface StyleOptions {
+/** The inline-style plugin's settings. */
+export interface InlineStyleOptions {
     /** Every section is on unless it is turned off here. */
-    sections?: Partial<Record<StyleSectionKey, StyleSection>>;
+    sections?: Partial<Record<InlineStyleSectionKey, InlineStyleSection>>;
     /** The spacing section: the values offered, and what 0 to 5 come to - for the gaps too. */
     spacing?: { values?: string[]; scale?: string[] };
     /** The eye that hides and shows a node, the display family's: false leaves it out of the drawers. */
@@ -113,8 +113,8 @@ export interface GridEditorOptions {
     content_types?: string[];
     row_cols?: boolean;
     utilities?: Record<string, unknown>;
-    /** The style plugin's sections, and the options of the utilities it carries. */
-    style?: StyleOptions;
+    /** The inline-style plugin's sections, and the options of the utilities it carries. */
+    inline_style?: InlineStyleOptions;
     /** The tabs plugin: the variant of the tabs containers made new. */
     tabs?: TabsOptions;
     elements?: { enabled?: boolean | 'auto'; selector?: string; auto?: boolean };

package/dist/plugins/grideditor.style.min.js

@@ -1,4 +0,0 @@
-(()=>{var A=window.GridEditor;if(!A||typeof A.get!="function")throw new Error("grid-editor: load grideditor.js (or grideditor.bundle.min.js) before its plugins, its locales and grideditor.jquery.js");function P(e,t){return e?Array.prototype.slice.call(e.querySelectorAll(t)):[]}function N(e,t){return e?e.querySelector(t):null}function I(e,t){if(!e)return[];var r=P(e,t);return e.nodeType===1&&e.matches(t)&&r.unshift(e),r}function J(e,t){return e?Array.prototype.filter.call(e.children,function(r){return!t||r.matches(t)}):[]}function j(e,t){return J(e,t)[0]||null}function H(e,t){return!!e&&e.nodeType===1&&e.matches(t)}function g(e,t,r){var n=document.createElement(e);return Object.keys(t||{}).forEach(function(l){var o=t[l];o!=null&&o!==!1&&n.setAttribute(l,o)}),r!=null&&(n.textContent=r),n}function Z(e,t){return oe(t).forEach(function(r){e.classList.add(r)}),e}function D(e,t){return oe(t).forEach(function(r){e.classList.remove(r)}),e}function $(e,t,r){return oe(t).forEach(function(n){r===void 0?e.classList.toggle(n):e.classList.toggle(n,!!r)}),e}function R(e,t){return!!e&&e.nodeType===1&&e.classList.contains(t)}function oe(e){return String(e||"").split(/\s+/).filter(Boolean)}function W(e){return e.getAttribute("class")||e.removeAttribute("class"),e}function ae(e,t){return Object.keys(t).forEach(function(r){var n=t[r];typeof n=="number"&&!Ve[r]&&(n=n+"px"),e.style.setProperty(r,n==null?"":String(n))}),e}var Ve={opacity:!0,"z-index":!0,"flex-grow":!0,"flex-shrink":!0,order:!0},V={};function We(e){var t=e.nodeName;if(!V[t]){var r=document.body.appendChild(document.createElement(t));V[t]=getComputedStyle(r).display,r.remove(),V[t]==="none"&&(V[t]="block")}return V[t]}function qe(e){return e.style.removeProperty("display"),getComputedStyle(e).display==="none"&&(e.style.display=We(e)),e}function Xe(e){return e.style.display="none",e}function F(e,t){return t===void 0&&(t=!Ye(e)),t?qe(e):Xe(e)}function Ye(e){return!!(e.offsetWidth||e.offsetHeight||e.getClientRects().length)}Object.assign(A.locales.en,{"utility.padding":"Padding","utility.margin":"Margin","utility.side_all":"All sides","utility.side_x":"Left and right","utility.side_y":"Top and bottom","utility.side_t":"Top","utility.side_b":"Bottom","utility.side_s":"Start","utility.side_e":"End","utility.spacing_gutter":"A column's side padding is its gutter: changing it changes the gutter"});var q=["0","1","2","3","4","5"],Je=["0",".25rem",".5rem","1rem","1.5rem","3rem"],Q=["","x","y","t","e","b","s"],Ze={"":["top","right","bottom","left"],x:["left","right"],y:["top","bottom"],t:["top"],e:["right"],b:["bottom"],s:["left"]},he=["","sm","md","lg","xl","xxl"],se={p:"padding",m:"margin"};function ve(e){return new RegExp("^"+e+"[xytbse]?-(?:(?:sm|md|lg|xl|xxl)-)?(?:[0-5]|auto)$")}function be(e,t){var r=Object.assign({values:q,scale:Je},t),n={p:ve("p"),m:ve("m")};function l(i,a){return a==="row"||a==="column"||a==="element"||H(i,"[data-ge-container]")}function o(i){return(i.getAttribute("class")||"").split(/\s+/)}function u(i,a){return o(i).some(function(p){return n[a].test(p)})}function c(i,a,p){for(var w=o(i),x=a.charAt(0)==="m"?q.concat(["auto"]):q,v=p;v>=0;v--)for(var E=0;E<x.length;E++){var O=a+(he[v]?"-"+he[v]:"")+"-"+x[E];if(w.indexOf(O)!==-1)return{tier:v,value:x[E]}}return null}function d(i,a){var p=i.getAttribute("class"),w,x={};return i.setAttribute("class",o(i).filter(function(v){return!n[a].test(v)}).join(" ")),w=getComputedStyle(i),["top","right","bottom","left"].forEach(function(v){x[v]=w.getPropertyValue(se[a]+"-"+v)}),p===null?i.removeAttribute("class"):i.setAttribute("class",p),x}function m(i,a,p){var w=e.breakpoints.indexOf(p),x={},v={},E=null;return Q.forEach(function(O,K){var k=c(i,a+O,w);k&&Ze[O].forEach(function(G){var Y=x[G];(!Y||k.tier>Y.tier||k.tier===Y.tier&&K>Y.order)&&(x[G]={tier:k.tier,order:K,value:k.value})})}),["top","right","bottom","left"].forEach(function(O){var K=x[O];K?v[se[a]+"-"+O]=K.value==="auto"?"auto":r.scale[K.value]:(E=E||d(i,a),v[se[a]+"-"+O]=E[O])}),v}function y(i,a){var p=o(i).filter(function(x){return n[a].test(x)}),w=Q.filter(function(x){return p.some(function(v){return v.indexOf(a+x+"-")===0})});return w.length?w[0]:""}function f(i){switch(i){case"x":return e.t("utility.side_x");case"y":return e.t("utility.side_y");case"t":return e.t("utility.side_t");case"b":return e.t("utility.side_b");case"s":return e.t("utility.side_s");case"e":return e.t("utility.side_e");default:return e.t("utility.side_all")}}function b(i,a,p){var w=g("div",{class:"ge-spacing-group","data-ge-spacing":a}),x=g("select",{class:"ge-spacing-side form-select form-select-sm"});w.appendChild(g("span",{class:"ge-utility-label"},p)),Q.forEach(function(E){x.appendChild(g("option",{value:E},f(E)))});var v=e.utilityField(i,a+y(i,a));return x.value=v.getAttribute("data-ge-family").slice(1),x.addEventListener("change",function(){var E=e.utilityField(i,a+this.value);v.replaceWith(E),v=E}),w.appendChild(x),w.appendChild(v),w}var S=".row, .column, .ge-element, [data-ge-container]";function T(i){I(i,S).forEach(function(a){var p=j(a,".ge-tools-drawer");if(!(!p||!l(a,e.kindOf(a)))){if(u(a,"p")){var w=getComputedStyle(a);ae(p,{"margin-top":"-"+w.paddingTop,"margin-left":"-"+w.paddingLeft,"margin-right":"-"+w.paddingRight,width:"calc(100% + "+w.paddingLeft+" + "+w.paddingRight+")"})}else ae(p,{"margin-top":"","margin-left":"","margin-right":"",width:""});if(R(a,"column")){var x=o(a).some(function(v){return/^p[xse]?-/.test(v)&&n.p.test(v)});P(p,".ge-spacing-gutter").forEach(function(v){F(v,x)})}}})}function s(i,a){var p=i==="m"?q.concat(["auto"]):q,w=r.values.concat(i==="m"?["auto"]:[]);return Q.map(function(x){return{name:i+x,prefix:i+x,values:p,appliesTo:["row","column","text","element","container"],labelKey:a,panel:!1,choices:function(){return p.filter(function(v){return w.indexOf(v)!==-1})}}})}return{families:s("p","utility.padding").concat(s("m","utility.margin")),panel:function(i,a){if(!l(i,a))return null;var p=g("div",{class:"ge-spacing"});return p.appendChild(b(i,"p",e.t("utility.padding"))),p.appendChild(b(i,"m",e.t("utility.margin"))),a==="column"&&p.appendChild(g("small",{class:"ge-spacing-gutter"},e.t("utility.spacing_gutter"))),p},preview:function(i,a,p){if(!l(i,a))return{};var w={};return["p","m"].forEach(function(x){u(i,x)&&Object.assign(w,m(i,x,p))}),w},onRefresh:T}}Object.assign(A.locales.en,{"utility.text_align":"Text alignment","utility.text_start":"Start","utility.text_center":"Center","utility.text_end":"End"});var Qe={start:"left",center:"center",end:"right"};function xe(e){function t(r){return r==="start"?e.t("utility.text_start"):r==="center"?e.t("utility.text_center"):e.t("utility.text_end")}return{families:[{name:"text-align",prefix:"text",values:["start","center","end"],appliesTo:["row","column","text","element","container"],labelKey:"utility.text_align",label:t,preview:function(r,n){return{"text-align":r===null?e.bareStyle(n,"text-align","text-align"):Qe[r]}}}]}}Object.assign(A.locales.en,{"utility.display":"Display","utility.visibility_hidden":"Hidden","tool.hide_in_view":"Hide in this view","tool.show_in_view":"Show in this view","badge.hidden_in":"Hidden at {breakpoints}"});var te=["none","inline","inline-block","block","grid","inline-grid","flex","inline-flex"],et=new RegExp("(?:^|\\s)d-(?:(?:sm|md|lg|xl|xxl)-)?(?:"+te.join("|")+")(?:\\s|$)"),tt=/^d-(?:(?:sm|md|lg|xl|xxl)-)?none$/,rt=".row, .column, .ge-content, .ge-element, [data-ge-container]",ee="data-ge-display";function _e(e,t){var r=Object.assign({drawer:!0},t);function n(s){return s==="row"?["none","flex"]:s==="text"||s==="plain"?["none","block"]:te}function l(s){return s==="row"?"flex":"block"}function o(s,i){return i==="row"||i==="column"||i==="element"||i==="text"||i==="plain"||H(s,"[data-ge-container]")}function u(s,i){return e.getUtility(s,"display",i)==="none"}function c(s){return e.breakpoints.filter(function(i){return u(s,i)})}function d(s){return e.view()==="all"?c(s).length===e.breakpoints.length:u(s,e.view())}function m(s){var i=e.breakpoints.indexOf(e.view());return i>0&&u(s,e.breakpoints[i-1])}function y(s,i){for(var a=e.breakpoints.indexOf(i)-1;a>=0;a--){var p=e.getUtility(s,"display",e.breakpoints[a]);if(p===null)return null;if(p!=="none")return p}return null}function f(s,i){var a=!d(s),p;e.view()==="all"?p=a?"none":null:a?p=m(s)?null:"none":p=m(s)?y(s,e.view())||l(i):null,e.setUtility(s,"display",p,{source:"tool"})}function b(s){var i=s.getAttribute("class");s.setAttribute("class",i.split(/\s+/).filter(function(p){return!tt.test(p)}).join(" "));var a=getComputedStyle(s).display;return s.setAttribute("class",i),a!=="none"&&te.indexOf(a)!==-1?a:"block"}function S(s){I(s,rt).forEach(function(i){var a=e.kindOf(i),p=o(i,a)&&et.test(i.getAttribute("class")||""),w=p?c(i):[],x=p&&d(i),v=p&&e.view()==="all"&&w.length>0&&!x;i.removeAttribute(ee),p&&getComputedStyle(i).display==="none"&&i.setAttribute(ee,b(i)),$(i,"ge-hidden-in-view",x),v?i.setAttribute("data-ge-hidden-in",e.t("badge.hidden_in",{breakpoints:w.join(", ")})):i.removeAttribute("data-ge-hidden-in"),J(i,".ge-tools-drawer").forEach(function(E){J(E,".ge-visibility-tool").forEach(function(O){O.setAttribute("title",x?e.t("tool.show_in_view"):e.t("tool.hide_in_view")),P(O,"i").forEach(function(K){K.setAttribute("class",x?"bi bi-eye-slash":"bi bi-eye")})})})})}function T(){P(e.canvas,".ge-hidden-in-view, [data-ge-hidden-in], ["+ee+"]").forEach(function(s){D(s,"ge-hidden-in-view"),s.removeAttribute("data-ge-hidden-in"),s.removeAttribute(ee),W(s)})}return{families:[{name:"display",prefix:"d",values:te,appliesTo:["row","column","text","element","container"],labelKey:"utility.display",choices:function(s,i){return n(i)},label:function(s){return s==="none"?e.t("utility.visibility_hidden"):s},preview:function(s,i){return s==="none"&&(s=y(i,e.view())),{display:s===null?e.bareStyle(i,"display","display"):s}}}],drawerTools:function(s,i,a){!r.drawer||!o(i,a)||e.createTool(s,e.t("tool.hide_in_view"),"ge-visibility-tool","bi bi-eye",function(){f(i,a)})},onRefresh:S,onDeinit:T}}Object.assign(A.locales.en,{"utility.flex_direction":"Direction","utility.flex_wrap":"Wrap","utility.justify_content":"Justify columns","utility.align_items":"Align columns","utility.align_content":"Align lines","utility.gap":"Gap","utility.row_gap":"Row gap","utility.column_gap":"Column gap","utility.flex_fill":"Fill","utility.flex_grow":"Grow","utility.flex_shrink":"Shrink"});var nt={start:"flex-start",end:"flex-end",center:"center",between:"space-between",around:"space-around",evenly:"space-evenly",baseline:"baseline",stretch:"stretch"},it=["0","1","2","3","4","5"],lt=["0",".25rem",".5rem","1rem","1.5rem","3rem"],ce=["row","column","element","container"],re=["column","element","container"];function we(e,t){var r=t&&t.scale||lt;function n(c){var d=c.property||c.name;return Object.assign({prefix:c.name,panel:!1,preview:function(m,y){var f={};return f[d]=m===null?e.bareStyle(y,c.name,d):c.css(m),f}},c)}function l(c){return n(Object.assign({appliesTo:ce,preview:function(d){var m={};return m[c.name]=d===null?"normal":nt[d],m}},c))}function o(c){return n(Object.assign({values:it,appliesTo:re,css:function(d){return r[d]}},c))}function u(c){return c}return{families:[n({name:"flex-direction",prefix:"flex",labelKey:"utility.flex_direction",values:["row","row-reverse","column","column-reverse"],appliesTo:ce,css:u}),n({name:"flex-wrap",prefix:"flex",labelKey:"utility.flex_wrap",values:["wrap","nowrap","wrap-reverse"],appliesTo:ce,css:u}),l({name:"justify-content",labelKey:"utility.justify_content",values:["start","center","end","between","around","evenly"]}),l({name:"align-items",labelKey:"utility.align_items",values:["start","center","end","baseline","stretch"]}),l({name:"align-content",labelKey:"utility.align_content",values:["start","center","end","between","around","stretch"]}),o({name:"gap",labelKey:"utility.gap"}),o({name:"row-gap",labelKey:"utility.row_gap"}),o({name:"column-gap",labelKey:"utility.column_gap"}),n({name:"flex-fill",prefix:"flex",property:"flex",labelKey:"utility.flex_fill",values:["fill"],appliesTo:re,css:function(){return"1 1 auto"}}),n({name:"flex-grow",prefix:"flex",labelKey:"utility.flex_grow",values:["grow-0","grow-1"],appliesTo:re,css:function(c){return c.slice(-1)}}),n({name:"flex-shrink",prefix:"flex",labelKey:"utility.flex_shrink",values:["shrink-0","shrink-1"],appliesTo:re,css:function(c){return c.slice(-1)}})]}}Object.assign(A.locales.en,{"utility.float":"Float","utility.float_start":"Start","utility.float_end":"End","utility.float_none":"None"});var ot={start:"left",end:"right",none:"none"};function Ee(e){function t(r){return r==="start"?e.t("utility.float_start"):r==="end"?e.t("utility.float_end"):e.t("utility.float_none")}return{families:[{name:"float",prefix:"float",values:["start","end","none"],appliesTo:["element"],labelKey:"utility.float",label:t,preview:function(r,n){return{float:r===null?e.bareStyle(n,"float","float"):ot[r]}}}]}}Object.assign(A.locales.en,{"utility.sticky":"Sticky"});var at={top:{position:"sticky",top:"0","z-index":"1020"},bottom:{position:"sticky",bottom:"0","z-index":"1020"}};function Ce(e){return{families:[{name:"sticky",prefix:"sticky",values:["top","bottom"],appliesTo:["row","column","element","container"],labelKey:"utility.sticky",panel:!1,preview:function(t,r){return t!==null?at[t]:{position:e.bareStyle(r,"sticky","position")}}}]}}var st=".row, .column, .ge-element, [data-ge-container]",U="ge-drawer-out",ne="data-ge-drawer-out",ct=5,ut=/^(?:inline-)?(?:flex|grid)$/;function Se(e){var t=null,r={},n=null;function l(y){if(!r[y]){r[y]=!0,t||(t=document.head.appendChild(g("style",{"data-ge-drawer-flow":""})));var f=".ge-canvas.ge-editing ["+ne+'="'+y+'"]';t.appendChild(document.createTextNode(f+" { border-top-width: "+y+`px !important; }
-`+f+" > .ge-tools-drawer { top: -"+y+`px; }
-`))}}function o(y){var f=getComputedStyle(y);return ut.test(f.display)?!(R(y,"row")&&f.flexDirection==="row"&&f.flexWrap==="wrap"):!1}function u(y,f){var b=Math.ceil(f.offsetHeight)+ct;l(b),y.setAttribute(ne,String(b))}function c(y){typeof ResizeObserver!="undefined"&&(n||(n=new ResizeObserver(function(f){f.forEach(function(b){var S=b.target.parentNode;S&&R(S,U)&&u(S,b.target)})})),n.observe(y))}function d(y){I(y,st).forEach(function(f){var b=j(f,".ge-tools-drawer");b&&(o(f)?(Z(f,U),u(f,b),c(b)):R(f,U)&&(D(f,U),f.removeAttribute(ne),W(f),n&&n.unobserve(b)))})}function m(){n&&n.disconnect(),n=null,P(e.canvas,"."+U).forEach(function(y){D(y,U),y.removeAttribute(ne),W(y)}),t&&t.remove(),t=null,r={}}return{families:[],onRefresh:d,onDeinit:m}}var L=["primary","secondary","success","danger","warning","info","light","dark"],ue=["top","end","bottom","start"],Oe=["10","25","50","75","100"];function C(e,t,r){return t.map(function(n){return e+n+(r||"")})}function _(e,t,r,n){return{classes:e,exclusive:t!==!1,notOn:r||[],onlyOn:n||null}}function h(e,t){return{name:e,labelKey:t.labelKey,type:t.type||"text",values:t.values||null,notOn:t.notOn||[]}}var B=["column"],ke=["element"],fe=[{key:"size",labelKey:"style.section_size",properties:[h("width",{labelKey:"style.prop_width",notOn:B}),h("height",{labelKey:"style.prop_height",notOn:B}),h("min-width",{labelKey:"style.prop_min_width"}),h("min-height",{labelKey:"style.prop_min_height"}),h("max-width",{labelKey:"style.prop_max_width"}),h("max-height",{labelKey:"style.prop_max_height"})],catalog:[_(C("w-",["25","50","75","100","auto"]),!0,B),_(C("h-",["25","50","75","100","auto"]),!0,B),_(["mw-100","mh-100","vw-100","vh-100","min-vw-100","min-vh-100"],!1,B),_(["img-fluid","img-thumbnail"],!1,[],ke),_(C("object-fit-",["contain","cover","fill","scale","none"]),!0,[],ke)],parts:[]},{key:"spacing",labelKey:"style.section_spacing",properties:[h("margin-top",{labelKey:"style.prop_margin_top"}),h("margin-right",{labelKey:"style.prop_margin_right"}),h("margin-bottom",{labelKey:"style.prop_margin_bottom"}),h("margin-left",{labelKey:"style.prop_margin_left"}),h("padding-top",{labelKey:"style.prop_padding_top"}),h("padding-right",{labelKey:"style.prop_padding_right"}),h("padding-bottom",{labelKey:"style.prop_padding_bottom"}),h("padding-left",{labelKey:"style.prop_padding_left"})],catalog:[],parts:["spacing"]},{key:"border",labelKey:"style.section_border",properties:[h("border-width",{labelKey:"style.prop_border_width"}),h("border-style",{labelKey:"style.prop_border_style",type:"select",values:["none","solid","dashed","dotted","double","groove","ridge","inset","outset"]}),h("border-color",{labelKey:"style.prop_border_color",type:"color"}),h("border-radius",{labelKey:"style.prop_border_radius"}),h("box-shadow",{labelKey:"style.prop_box_shadow",type:"shadow"})],catalog:[_(["border","border-0"].concat(C("border-",ue),C("border-",ue,"-0")),!1),_(C("border-",["1","2","3","4","5"])),_(C("border-",L.concat(["black","white"])).concat(C("border-",L,"-subtle"))),_(C("border-opacity-",Oe)),_(["rounded"].concat(C("rounded-",["0","1","2","3","4","5","circle","pill"]))),_(C("rounded-",ue),!1),_(["shadow-none","shadow-sm","shadow","shadow-lg"])],parts:[]},{key:"background",labelKey:"style.section_background",properties:[h("background-color",{labelKey:"style.prop_background_color",type:"color"}),h("background-image",{labelKey:"style.prop_background_image",type:"url"}),h("background-size",{labelKey:"style.prop_background_size"}),h("background-position",{labelKey:"style.prop_background_position"}),h("background-repeat",{labelKey:"style.prop_background_repeat",type:"select",values:["repeat","no-repeat","repeat-x","repeat-y","space","round"]})],catalog:[_(C("bg-",L.concat(["body","body-secondary","body-tertiary","white","black","transparent"])).concat(C("bg-",L,"-subtle"),C("text-bg-",L))),_(["bg-gradient"],!1),_(C("bg-opacity-",Oe))],parts:[]},{key:"text",labelKey:"style.section_text",properties:[h("color",{labelKey:"style.prop_color",type:"color"}),h("font-size",{labelKey:"style.prop_font_size"}),h("text-align",{labelKey:"style.prop_text_align",type:"select",values:["start","center","end","left","right","justify"]}),h("text-shadow",{labelKey:"style.prop_text_shadow",type:"shadow"})],catalog:[_(C("text-",L.concat(["body","body-secondary","body-tertiary","white","black"])).concat(C("text-",L,"-emphasis"),["text-body-emphasis"])),_(C("text-opacity-",["25","50","75","100"])),_(C("fs-",["1","2","3","4","5","6"])),_(C("text-decoration-",["none","underline","line-through"]))],parts:["textalign"]},{key:"typography",labelKey:"style.section_typography",properties:[h("font-family",{labelKey:"style.prop_font_family"}),h("font-weight",{labelKey:"style.prop_font_weight",type:"select",values:["100","200","300","400","500","600","700","800","900","normal","bold","lighter","bolder"]}),h("font-style",{labelKey:"style.prop_font_style",type:"select",values:["normal","italic","oblique"]}),h("line-height",{labelKey:"style.prop_line_height"}),h("letter-spacing",{labelKey:"style.prop_letter_spacing"}),h("text-transform",{labelKey:"style.prop_text_transform",type:"select",values:["none","uppercase","lowercase","capitalize"]}),h("text-decoration",{labelKey:"style.prop_text_decoration",type:"select",values:["none","underline","line-through","overline"]})],catalog:[_(C("fw-",["lighter","light","normal","medium","semibold","bold","bolder"])),_(C("fst-",["italic","normal"])),_(C("lh-",["1","sm","base","lg"])),_(C("text-",["lowercase","uppercase","capitalize"])),_(["font-monospace"],!1),_(["text-wrap","text-nowrap"]),_(["text-break"],!1)],parts:[]},{key:"display",labelKey:"style.section_display",properties:[h("display",{labelKey:"style.prop_display",type:"select",values:["none","block","inline","inline-block","flex","inline-flex","grid","inline-grid"]}),h("opacity",{labelKey:"style.prop_opacity"}),h("overflow",{labelKey:"style.prop_overflow",type:"select",values:["visible","hidden","auto","scroll","clip"]}),h("visibility",{labelKey:"style.prop_visibility",type:"select",values:["visible","hidden"]})],catalog:[_(C("opacity-",["0","25","50","75","100"])),_(C("overflow-",["auto","hidden","visible","scroll"])),_(["visible","invisible"])],parts:["display"]},{key:"flex",labelKey:"style.section_flex",properties:[],catalog:[_(["vstack","hstack"],!0,["row"])],parts:["flex"]},{key:"position",labelKey:"style.section_position",properties:[h("position",{labelKey:"style.prop_position",type:"select",values:["static","relative","absolute","fixed","sticky"]}),h("top",{labelKey:"style.prop_top",notOn:B}),h("right",{labelKey:"style.prop_right",notOn:B}),h("bottom",{labelKey:"style.prop_bottom",notOn:B}),h("left",{labelKey:"style.prop_left",notOn:B}),h("z-index",{labelKey:"style.prop_z_index"})],catalog:[_(C("position-",["static","relative","absolute","fixed","sticky"])),_(C("top-",["0","50","100"])),_(C("bottom-",["0","50","100"])),_(C("start-",["0","50","100"])),_(C("end-",["0","50","100"])),_(["translate-middle","translate-middle-x","translate-middle-y"]),_(["z-n1","z-0","z-1","z-2","z-3"]),_(["fixed-top","fixed-bottom"])],parts:["float","sticky"]},{key:"custom",labelKey:"style.section_custom",properties:[],catalog:[],parts:[],custom:!0}];function Ke(e){return fe.filter(function(t){return t.key===e})[0]||null}function le(e,t){return e.onlyOn&&e.onlyOn.indexOf(t)===-1?!1:e.notOn.indexOf(t)===-1}var ie="(?:(?:sm|md|lg|xl|xxl)-)?",pt="(?:[0-5]|auto)",dt="(?:"+L.join("|")+"|black|white)",ft="(?:"+L.join("|")+"|body|body-secondary|body-tertiary|white|black|transparent)",mt="(?:"+L.join("|")+"|body|body-secondary|body-tertiary|white|black|muted|black-50|white-50)",pe="border(?:-(?:top|end|bottom|start))?(?:-0)?",Ae="(?:"+L.join("|")+")-subtle",yt="(?:"+L.join("|")+"|body)-emphasis",Te="text-bg-(?:"+L.join("|")+")",de="sticky-"+ie;function z(e,t){var r={top:"[ty]?",bottom:"[by]?",left:"[sx]?",right:"[ex]?"}[t];return new RegExp("^"+e+r+"-"+ie+pt+"$")}var gt={width:/^(?:w-(?:25|50|75|100|auto)|vw-100)$/,height:/^(?:h-(?:25|50|75|100|auto)|vh-100)$/,"max-width":/^mw-100$/,"max-height":/^mh-100$/,"min-width":/^min-vw-100$/,"min-height":/^min-vh-100$/,"margin-top":z("m","top"),"margin-right":z("m","right"),"margin-bottom":z("m","bottom"),"margin-left":z("m","left"),"padding-top":z("p","top"),"padding-right":z("p","right"),"padding-bottom":z("p","bottom"),"padding-left":z("p","left"),"border-width":new RegExp("^(?:"+pe+"|border-[1-5])$"),"border-style":new RegExp("^"+pe+"$"),"border-color":new RegExp("^(?:"+pe+"|border-"+dt+"|border-"+Ae+")$"),"border-radius":/^rounded(?:-(?:[0-5]|circle|pill|top|end|bottom|start))?$/,"box-shadow":/^shadow(?:-(?:none|sm|lg))?$/,"background-color":new RegExp("^(?:bg-"+ft+"|bg-"+Ae+"|"+Te+")$"),"background-image":/^bg-gradient$/,color:new RegExp("^(?:text-"+mt+"|text-"+yt+"|"+Te+")$"),"font-size":/^fs-[1-6]$/,"text-align":new RegExp("^text-"+ie+"(?:start|center|end)$"),"text-decoration":/^text-decoration-(?:none|underline|line-through)$/,"font-family":/^font-monospace$/,"font-weight":/^fw-(?:lighter|light|normal|medium|semibold|bold|bolder)$/,"font-style":/^fst-(?:italic|normal)$/,"line-height":/^lh-(?:1|sm|base|lg)$/,"text-transform":/^text-(?:lowercase|uppercase|capitalize)$/,display:new RegExp("^(?:d-"+ie+"(?:none|inline|inline-block|block|grid|inline-grid|table|table-row|table-cell|flex|inline-flex)|vstack|hstack)$"),opacity:/^opacity-(?:0|25|50|75|100)$/,overflow:/^overflow-(?:auto|hidden|visible|scroll)$/,visibility:/^(?:visible|invisible)$/,position:new RegExp("^(?:position-(?:static|relative|absolute|fixed|sticky)|fixed-(?:top|bottom)|"+de+"(?:top|bottom))$"),top:new RegExp("^(?:top-(?:0|50|100)|fixed-top|"+de+"top)$"),bottom:new RegExp("^(?:bottom-(?:0|50|100)|fixed-bottom|"+de+"bottom)$"),left:/^start-(?:0|50|100)$/,right:/^end-(?:0|50|100)$/,"z-index":/^z-(?:n1|[0-3])$/};function Le(e,t){var r=gt[e];return r&&t.filter(function(n){return r.test(n)})[0]||null}function ht(e,t){var r={};return Object.keys(t||{}).forEach(function(n){Ke(n)||e.warn('style.sections: there is no "'+n+'" section: ignored')}),fe.forEach(function(n){var l=t&&t[n.key]!==void 0?t[n.key]:!0;if(l!==!1){var o=n.properties.map(function(d){return d.name}),u=n.properties,c=!0;l&&typeof l=="object"&&(Array.isArray(l.properties)&&(l.properties.forEach(function(d){o.indexOf(d)===-1&&e.warn("style.sections."+n.key+': "'+d+'" is not one of its properties: ignored')}),u=l.properties.filter(function(d){return o.indexOf(d)!==-1}).map(function(d){return n.properties[o.indexOf(d)]})),l.catalog===!1&&(c=!1)),r[n.key]={section:n,properties:u,catalog:c}}}),r}function Pe(e){var t=e.settings.style||{};return{sections:ht(e,t.sections),spacing:t.spacing,visibility:t.visibility}}var Be=new WeakMap,vt=0;function bt(e){return(e.getAttribute("class")||"").split(/\s+/).filter(Boolean)}function je(e,t,r,n){var l=String(n==null?"":n).trim(),o=/\s*!\s*important\s*$/i.exec(l),u;return o&&(l=l.slice(0,o.index).trim(),u="important"),e.setHostStyle(t,r,l,u)}function ze(e,t,r){$(e,"is-invalid",!t),t?e.removeAttribute("title"):e.setAttribute("title",r.t("style.invalid"))}function me(e,t){R(e,"is-invalid")||(e.value=t)}function X(e){return g("input",{type:"text",class:"form-control form-control-sm "+(e||"")})}var xt=/^#([0-9a-f]{3}|[0-9a-f]{6})$/i;function Re(e){var t=xt.exec(e.trim());if(!t)return null;var r=t[1];return r.length===3&&(r=r.split("").map(function(n){return n+n}).join("")),"#"+r.toLowerCase()}function Ne(e){var t=g("div",{class:"input-group input-group-sm ge-style-color"}),r=t.appendChild(g("input",{type:"color",class:"form-control form-control-color"})),n=t.appendChild(X());return r.addEventListener("input",function(){D(n,"is-invalid"),n.value=r.value,e(r.value,n)}),n.addEventListener("change",function(){var l=Re(n.value);l&&(r.value=l),e(n.value,n)}),{element:t,set:function(l){me(n,l);var o=Re(l);o&&(r.value=o)}}}var _t=/^url\(\s*(["']?)(.*)\1\s*\)$/i;function wt(e){var t=_t.exec(e.trim());return t?t[1]?t[2].replace(/\\(["\\])/g,"$1"):t[2]:e}function Et(e){return e=e.trim(),e===""||/^(?:none|inherit|initial|unset|revert)$/i.test(e)||/^[a-z-]+\(/i.test(e)?e:'url("'+e.replace(/(["\\])/g,"\\$1")+'")'}function Ct(e){for(var t=[],r=0,n="",l=0;l<e.length;l++){var o=e.charAt(l);o==="("&&r++,o===")"&&r--,r===0&&(o===" "||o===",")?(n&&t.push(n),o===","&&t.push(","),n=""):n+=o}return n&&t.push(n),t}var St=/^-?(?:\d*\.)?\d+(?:[a-z%]+)?$/i,$e=[{name:"x",labelKey:"style.shadow_x"},{name:"y",labelKey:"style.shadow_y"},{name:"blur",labelKey:"style.shadow_blur"},{name:"spread",labelKey:"style.shadow_spread"}];function Ot(e,t){if(e=e.trim(),e==="")return{inset:!1,lengths:[],color:""};if(/var\(/i.test(e))return null;var r=Ct(e);if(r.indexOf(",")!==-1)return null;var n=!1,l=[],o=[];return r.forEach(function(u){t&&u.toLowerCase()==="inset"?n=!0:St.test(u)?l.push(u):o.push(u)}),o.length>1||l.length<2||l.length>(t?4:3)||o.length&&/^(?:none|inherit|initial|unset|revert)$/i.test(o[0])?null:{inset:n,lengths:l,color:o[0]||""}}function kt(e,t){for(var r=e.lengths.slice(),n=r.length-1;n>=0;n--)r[n]===""&&r.slice(n+1).some(Boolean)&&(r[n]="0");if(r=r.filter(Boolean),!r.length&&!e.color&&!e.inset)return"";for(;r.length<2;)r.push("0");return(t&&e.inset?"inset ":"")+r.join(" ")+(e.color?" "+e.color:"")}function At(e,t,r,n){var l=r==="box-shadow",o=g("div",{class:"ge-style-shadow"}),u=!1;function c(b,S){var T=je(e,t,r,b);return ze(S,T,e),T&&n(),T}function d(b){o.innerHTML="";var S=o.appendChild(g("div",{class:"ge-style-shadow-builder"})),T=l?$e:$e.slice(0,3),s=T.map(function(E,O){var K=S.appendChild(g("label",{class:"ge-style-shadow-part"}));K.appendChild(g("span",{class:"ge-style-shadow-label"},e.t(E.labelKey)));var k=K.appendChild(X("ge-style-shadow-"+E.name));return k.value=b.lengths[O]||"",k}),i=S.appendChild(g("label",{class:"ge-style-shadow-part ge-style-shadow-color"}));i.appendChild(g("span",{class:"ge-style-shadow-label"},e.t("style.shadow_color")));var a=Ne(function(){v()});i.appendChild(a.element),a.set(b.color);var p=null;if(l){var w=S.appendChild(g("label",{class:"form-check ge-style-shadow-inset"}));p=w.appendChild(g("input",{type:"checkbox",class:"form-check-input"})),w.appendChild(g("span",{class:"form-check-label"},e.t("style.shadow_inset"))),p.checked=b.inset,p.addEventListener("change",function(){v()})}s.forEach(function(E){E.addEventListener("change",function(){v()})});var x=o.appendChild(g("a",{href:"#",class:"ge-style-shadow-mode"},e.t("style.shadow_text_mode")));x.addEventListener("click",function(E){E.preventDefault(),u=!0,f()});function v(){var E=kt({inset:p?p.checked:!1,lengths:s.map(function(O){return O.value.trim()}),color:N(a.element,'input[type="text"]').value.trim()},l);c(E,s[0])}}function m(b){o.innerHTML="";var S=o.appendChild(X("ge-style-shadow-text"));S.value=b,S.addEventListener("change",function(){if(S.value.trim()===""){c("",S)&&(u=!1,f());return}c(S.value,S)})}var y=null;function f(){if(!o.querySelector(".is-invalid")){var b=e.hostStyle(t,r).value,S=Ot(b,l);b===y&&o.firstChild&&u===!!o.querySelector(".ge-style-shadow-text")||(y=b,u||!S?(u=!!b||u,m(b)):d(S))}}return{element:o,render:f,value:function(){return e.hostStyle(t,r).value}}}function He(e,t,r,n){var l=g("div",{class:"ge-style-field","data-ge-style-property":r.name}),o=l.appendChild(g("label",{class:"ge-style-label"},e.t(r.labelKey))),u;function c(){return e.hostStyle(t,r.name).value}function d(s,i){var a=je(e,t,r.name,s);ze(i,a,e),a&&n()}if(r.type==="select"){var m=l.appendChild(g("select",{class:"form-select form-select-sm"}));m.addEventListener("change",function(){d(m.value,m)}),u=function(){var s=c(),i=r.values.slice();s&&i.indexOf(s)===-1&&i.push(s),m.innerHTML="",m.appendChild(g("option",{value:""},"")),i.forEach(function(a){m.appendChild(g("option",{value:a},a))}),m.value=s}}else if(r.type==="color"){var y=Ne(function(s,i){d(s,i)});l.appendChild(y.element),u=function(){y.set(c())}}else if(r.type==="url"){var f=l.appendChild(X());f.addEventListener("change",function(){d(Et(f.value),f)}),u=function(){me(f,wt(c()))}}else if(r.type==="shadow"){var b=At(e,t,r.name,n);l.appendChild(b.element),u=b.render}else{var S=l.appendChild(X());S.addEventListener("change",function(){d(S.value,S)}),u=function(){me(S,c())}}var T=l.querySelector("input, select");return T&&(T.id="ge-style-field-"+ ++vt,o.setAttribute("for",T.id)),l.appendChild(g("small",{class:"ge-style-note ge-style-overridden"})),Be.set(l,function(){u();var s=c()?Le(r.name,bt(t)):null,i=j(l,".ge-style-overridden");i.textContent=s?e.t("style.overridden",{class:s}):"",F(i,!!s)}),ye(l),l}function ye(e){var t=Be.get(e);t&&t()}function De(e){return(e.getAttribute("class")||"").split(/\s+/).filter(Boolean)}function Tt(e,t,r,n){var l=e.detailsOf(t),o=l?N(l,".ge-classes"):null;if(o){var u=De(t).indexOf(n)!==-1,c=o.value.split(/\s+/).filter(Boolean).filter(function(d){return d===n?!1:!(r.exclusive&&!u&&r.classes.indexOf(d)!==-1)});u||c.push(n),o.value=c.join(" "),o.dispatchEvent(new Event("change",{bubbles:!0}))}}function Me(e,t,r,n){var l=n.filter(function(u){return le(u,r)});if(!l.length)return null;var o=g("div",{class:"ge-style-catalog"});return o.appendChild(g("span",{class:"ge-style-label"},e.t("style.catalog"))),l.forEach(function(u){var c=o.appendChild(g("div",{class:"ge-style-chips"}));u.classes.forEach(function(d){var m=c.appendChild(g("button",{type:"button",class:"btn btn-sm btn-outline-secondary ge-style-chip","data-ge-class":d,"aria-pressed":"false"},d));m.addEventListener("click",function(){Tt(e,t,u,d)})})}),ge(o,t),o}function ge(e,t){var r=De(t);P(e,".ge-style-chip").forEach(function(n){var l=r.indexOf(n.getAttribute("data-ge-class"))!==-1;$(n,"active",l),n.setAttribute("aria-pressed",l?"true":"false")})}function Kt(e){var t=document.createElement("div").style,r=[];t.setProperty(e,"initial");for(var n=0;n<t.length;n++)r.push(t[n]);return r.length?r:[e]}function Ie(e){var t=document.createElement("div").style;return t.cssText=e,t}function Fe(e,t,r,n){var l={};r.forEach(function(m){Kt(m).forEach(function(y){l[y]=!0})});var o=g("div",{class:"ge-style-custom"}),u=o.appendChild(g("textarea",{class:"form-control form-control-sm font-monospace ge-style-custom-css",rows:"4",spellcheck:"false","aria-label":e.t("style.section_custom")}));function c(){for(var m=Ie(e.hostStyle(t)),y=document.createElement("div").style,f=0;f<m.length;f++){var b=m[f];l[b]||y.setProperty(b,m.getPropertyValue(b),m.getPropertyPriority(b))}return y}u.addEventListener("change",function(){var m=c(),y=Ie(u.value),f;for(f=0;f<m.length;f++)y.getPropertyValue(m[f])===""&&e.setHostStyle(t,m[f],"");for(f=0;f<y.length;f++)e.setHostStyle(t,y[f],y.getPropertyValue(y[f]),y.getPropertyPriority(y[f]));d(),n()});function d(){document.activeElement!==u&&(u.value=c().cssText.replace(/; /g,`;
-`))}return d(),{element:o,render:d}}function Lt(e,t){return t==="row"||t==="column"||t==="element"||t==="section"||H(e,"[data-ge-container]")?!0:!!j(e,".ge-tools-drawer.ge-pane-drawer")}function Pt(e,t,r){return r==="plain"&&(r="text"),e.appliesTo.indexOf(r)!==-1?!0:e.appliesTo.indexOf("container")!==-1&&H(t,"[data-ge-container]")}function Rt(e,t,r,n){if(t.panel)return t.panel(r,n);var l=t.families.filter(function(u){return Pt(u,r,n)}).map(function(u){return e.utilityField(r,u.name)});if(l.length<2)return l[0]||null;var o=g("div",{class:"ge-style-part-fields"});return l.forEach(function(u){o.appendChild(u)}),o}function Ue(e,t,r,n){var l=Lt(t,r),o=g("div",{class:"accordion ge-style"}),u=[],c=[],d=[],m=null,y=null,f=function(){s()};function b(i,a){var p=o.appendChild(g("div",{class:"accordion-item","data-ge-style-section":i})),w=p.appendChild(g("h2",{class:"accordion-header"})),x=w.appendChild(g("button",{type:"button",class:"accordion-button collapsed","aria-expanded":"false"},e.t(a))),v=p.appendChild(g("div",{class:"accordion-collapse collapse"})),E=v.appendChild(g("div",{class:"accordion-body"}));return x.addEventListener("click",function(){var O=!R(v,"show");n.state.open=O?i:null,n.opened(n.state.open)}),{entry:p,body:E}}function S(i,a){$(N(i,".accordion-collapse"),"show",a);var p=N(i,".accordion-button");$(p,"collapsed",!a),p.setAttribute("aria-expanded",a?"true":"false")}if(Object.keys(n.sections).forEach(function(i){var a=n.sections[i],p=a.section;if(p.custom){l&&(y=b(i,p.labelKey));return}var w=p.parts.map(function(k){return n.parts[k]?Rt(e,n.parts[k],t,r):null}).filter(Boolean),x=l?a.properties.filter(function(k){return le(k,r)}):[],v=l&&a.catalog?Me(e,t,r,p.catalog):null;if(!(!w.length&&!x.length&&!v)){var E=b(i,p.labelKey).body;if(w.forEach(function(k){E.appendChild(Z(k,"ge-style-part"))}),x.length){var O=E.appendChild(g("small",{class:"ge-style-note ge-style-all-sizes"},e.t("style.all_sizes")));d.push(O);var K=E.appendChild(g("div",{class:"ge-style-fields"}));x.forEach(function(k){var G=He(e,t,k,f);u.push(G),K.appendChild(G)})}v&&(c.push(v),E.appendChild(v))}}),y&&(m=Fe(e,t,u.map(function(i){return i.getAttribute("data-ge-style-property")}),f),y.body.appendChild(m.element),o.appendChild(y.entry)),!o.children.length)return null;function T(i){P(o,".accordion-item").forEach(function(a){S(a,a.getAttribute("data-ge-style-section")===i)})}T(n.state.open);function s(){u.forEach(ye),c.forEach(function(i){ge(i,t)}),m&&m.render(),d.forEach(function(i){F(i,e.view()!=="all")})}return s(),{element:o,render:s,open:T}}Object.assign(A.locales.en,{"style.section_title":"Style","style.dialog_title":"Style: {kind}","style.section_size":"Size","style.section_spacing":"Spacing","style.section_border":"Border","style.section_background":"Background","style.section_text":"Text","style.section_typography":"Typography","style.section_display":"Display","style.section_flex":"Flex","style.section_position":"Position","style.section_custom":"Custom css","style.all_sizes":"Applies to every size","style.overridden":"The class {class} takes priority over this value","style.invalid":"Not a value this property takes","style.catalog":"Bootstrap classes","style.shadow_x":"X","style.shadow_y":"Y","style.shadow_blur":"Blur","style.shadow_spread":"Spread","style.shadow_color":"Color","style.shadow_inset":"Inset","style.shadow_text_mode":"Edit as text","style.prop_width":"Width","style.prop_height":"Height","style.prop_min_width":"Min width","style.prop_min_height":"Min height","style.prop_max_width":"Max width","style.prop_max_height":"Max height","style.prop_margin_top":"Margin top","style.prop_margin_right":"Margin right","style.prop_margin_bottom":"Margin bottom","style.prop_margin_left":"Margin left","style.prop_padding_top":"Padding top","style.prop_padding_right":"Padding right","style.prop_padding_bottom":"Padding bottom","style.prop_padding_left":"Padding left","style.prop_border_width":"Border width","style.prop_border_style":"Border style","style.prop_border_color":"Border color","style.prop_border_radius":"Border radius","style.prop_box_shadow":"Shadow","style.prop_background_color":"Background color","style.prop_background_image":"Background image","style.prop_background_size":"Background size","style.prop_background_position":"Background position","style.prop_background_repeat":"Background repeat","style.prop_color":"Color","style.prop_font_size":"Font size","style.prop_text_align":"Text align","style.prop_text_shadow":"Text shadow","style.prop_font_family":"Font family","style.prop_font_weight":"Font weight","style.prop_font_style":"Font style","style.prop_line_height":"Line height","style.prop_letter_spacing":"Letter spacing","style.prop_text_transform":"Text transform","style.prop_text_decoration":"Text decoration","style.prop_display":"Display","style.prop_opacity":"Opacity","style.prop_overflow":"Overflow","style.prop_visibility":"Visibility","style.prop_position":"Position","style.prop_top":"Top","style.prop_right":"Right","style.prop_bottom":"Bottom","style.prop_left":"Left","style.prop_z_index":"Z-index"});var Ge=["spacing","textalign","display","flex","float","sticky","drawerflow"];A.utilities.style=function(e){var t=Pe(e),r={spacing:be(e,t.spacing),textalign:xe(e),display:_e(e,t.visibility),flex:we(e,t.spacing),float:Ee(e),sticky:Ce(e),drawerflow:Se(e)},n=[],l={sections:t.sections,parts:r,state:{open:null},opened:function(c){n.forEach(function(d){d.accordion.open(c)})}};function o(c){return function(){var d=arguments;Ge.forEach(function(m){r[m][c]&&r[m][c].apply(null,d)})}}var u=o("onRefresh");return{families:Ge.reduce(function(c,d){return c.concat(r[d].families.map(function(m){return Object.assign({},m,{panel:!1})}))},[]),panelSection:function(c,d){var m=Ue(e,c,d,l);return m?(n.push({node:c,accordion:m}),{labelKey:"style.section_title",titleKey:"style.dialog_title",body:m.element}):null},preview:function(c,d,m){return r.spacing.preview(c,d,m)},onRefresh:function(c){u(c),n=n.filter(function(d){return d.accordion.element.isConnected}),n.forEach(function(d){(d.node===c||c.contains(d.node))&&d.accordion.render()})},drawerTools:o("drawerTools"),onDeinit:function(){o("onDeinit")(),n=[]}}};})();