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

package/src/js/style/sections.js

@@ -9,6 +9,7 @@
 
 var COLORS = ['primary', 'secondary', 'success', 'danger', 'warning', 'info', 'light', 'dark'];
 var SIDES = ['top', 'end', 'bottom', 'start'];
+var OPACITIES = ['10', '25', '50', '75', '100'];
 
 function each(prefix, values, suffix) {
     return values.map(function(value) { return prefix + value + (suffix || ''); });
@@ -17,10 +18,10 @@ function each(prefix, values, suffix) {
 /**
  * A catalog group: the classes it offers and whether they exclude each
  * other, so choosing one takes the others off. `notOn` names the kinds of
- * node it is never offered on.
+ * node it is never offered on, `onlyOn` the only ones it is.
  */
-function group(classes, exclusive, notOn) {
-    return { classes: classes, exclusive: exclusive !== false, notOn: notOn || [] };
+function group(classes, exclusive, notOn, onlyOn) {
+    return { classes: classes, exclusive: exclusive !== false, notOn: notOn || [], onlyOn: onlyOn || null };
 }
 
 /**
@@ -41,6 +42,9 @@ function prop(name, options) {
 
 var NOT_ON_COLUMN = ['column'];
 
+/** The image classes are for the markup an element holds. */
+var ONLY_ON_ELEMENT = ['element'];
+
 export var SECTIONS = [
     {
         key: 'size',
@@ -57,6 +61,8 @@ export var SECTIONS = [
             group(each('w-', ['25', '50', '75', '100', 'auto']), true, NOT_ON_COLUMN),
             group(each('h-', ['25', '50', '75', '100', 'auto']), true, NOT_ON_COLUMN),
             group(['mw-100', 'mh-100', 'vw-100', 'vh-100', 'min-vw-100', 'min-vh-100'], false, NOT_ON_COLUMN),
+            group(['img-fluid', 'img-thumbnail'], false, [], ONLY_ON_ELEMENT),
+            group(each('object-fit-', ['contain', 'cover', 'fill', 'scale', 'none']), true, [], ONLY_ON_ELEMENT),
         ],
         parts: [],
     },
@@ -83,7 +89,8 @@ export var SECTIONS = [
         catalog: [
             group(['border', 'border-0'].concat(each('border-', SIDES), each('border-', SIDES, '-0')), false),
             group(each('border-', ['1', '2', '3', '4', '5'])),
-            group(each('border-', COLORS.concat(['black', 'white']))),
+            group(each('border-', COLORS.concat(['black', 'white'])).concat(each('border-', COLORS, '-subtle'))),
+            group(each('border-opacity-', OPACITIES)),
             group(['rounded'].concat(each('rounded-', ['0', '1', '2', '3', '4', '5', 'circle', 'pill']))),
             group(each('rounded-', SIDES), false),
             group(['shadow-none', 'shadow-sm', 'shadow', 'shadow-lg']),
@@ -101,8 +108,10 @@ export var SECTIONS = [
             prop('background-repeat', { labelKey: 'style.prop_background_repeat', type: 'select', values: ['repeat', 'no-repeat', 'repeat-x', 'repeat-y', 'space', 'round'] }),
         ],
         catalog: [
-            group(each('bg-', COLORS.concat(['body', 'body-secondary', 'body-tertiary', 'white', 'black', 'transparent']))),
+            group(each('bg-', COLORS.concat(['body', 'body-secondary', 'body-tertiary', 'white', 'black', 'transparent']))
+                .concat(each('bg-', COLORS, '-subtle'), each('text-bg-', COLORS))),
             group(['bg-gradient'], false),
+            group(each('bg-opacity-', OPACITIES)),
         ],
         parts: [],
     },
@@ -116,7 +125,9 @@ export var SECTIONS = [
             prop('text-shadow', { labelKey: 'style.prop_text_shadow', type: 'shadow' }),
         ],
         catalog: [
-            group(each('text-', COLORS.concat(['body', 'body-secondary', 'body-tertiary', 'white', 'black']))),
+            group(each('text-', COLORS.concat(['body', 'body-secondary', 'body-tertiary', 'white', 'black']))
+                .concat(each('text-', COLORS, '-emphasis'), ['text-body-emphasis'])),
+            group(each('text-opacity-', ['25', '50', '75', '100'])),
             group(each('fs-', ['1', '2', '3', '4', '5', '6'])),
             group(each('text-decoration-', ['none', 'underline', 'line-through'])),
         ],
@@ -159,7 +170,16 @@ export var SECTIONS = [
             group(each('overflow-', ['auto', 'hidden', 'visible', 'scroll'])),
             group(['visible', 'invisible']),
         ],
-        parts: ['visibility'],
+        parts: ['display'],
+    },
+    {
+        key: 'flex',
+        labelKey: 'style.section_flex',
+        properties: [],
+        catalog: [
+            group(['vstack', 'hstack'], true, ['row']),
+        ],
+        parts: ['flex'],
     },
     {
         key: 'position',
@@ -180,8 +200,9 @@ export var SECTIONS = [
             group(each('end-', ['0', '50', '100'])),
             group(['translate-middle', 'translate-middle-x', 'translate-middle-y']),
             group(['z-n1', 'z-0', 'z-1', 'z-2', 'z-3']),
+            group(['fixed-top', 'fixed-bottom']),
         ],
-        parts: ['float'],
+        parts: ['float', 'sticky'],
     },
     {
         key: 'custom',
@@ -199,6 +220,8 @@ export function section(key) {
 
 /** Whether a property or a catalog group is offered on this kind of node. */
 export function offeredOn(item, kind) {
+    if (item.onlyOn && item.onlyOn.indexOf(kind) === -1) { return false; }
+
     return item.notOn.indexOf(kind) === -1;
 }
 
@@ -208,6 +231,10 @@ var COLOR = '(?:' + COLORS.join('|') + '|black|white)';
 var BG = '(?:' + COLORS.join('|') + '|body|body-secondary|body-tertiary|white|black|transparent)';
 var TEXT_COLOR = '(?:' + COLORS.join('|') + '|body|body-secondary|body-tertiary|white|black|muted|black-50|white-50)';
 var BORDER = 'border(?:-(?:top|end|bottom|start))?(?:-0)?';
+var SUBTLE = '(?:' + COLORS.join('|') + ')-subtle';
+var EMPHASIS = '(?:' + COLORS.join('|') + '|body)-emphasis';
+var TEXT_BG = 'text-bg-(?:' + COLORS.join('|') + ')';
+var STICKY = 'sticky-' + BREAKPOINT;
 
 function spacing(key, side) {
     var sides = { top: '[ty]?', bottom: '[by]?', left: '[sx]?', right: '[ex]?' }[side];
@@ -236,12 +263,12 @@ var SETS = {
     'padding-left': spacing('p', 'left'),
     'border-width': new RegExp('^(?:' + BORDER + '|border-[1-5])$'),
     'border-style': new RegExp('^' + BORDER + '$'),
-    'border-color': new RegExp('^(?:' + BORDER + '|border-' + COLOR + ')$'),
+    'border-color': new RegExp('^(?:' + BORDER + '|border-' + COLOR + '|border-' + SUBTLE + ')$'),
     'border-radius': /^rounded(?:-(?:[0-5]|circle|pill|top|end|bottom|start))?$/,
     'box-shadow': /^shadow(?:-(?:none|sm|lg))?$/,
-    'background-color': new RegExp('^bg-' + BG + '$'),
+    'background-color': new RegExp('^(?:bg-' + BG + '|bg-' + SUBTLE + '|' + TEXT_BG + ')$'),
     'background-image': /^bg-gradient$/,
-    'color': new RegExp('^text-' + TEXT_COLOR + '$'),
+    'color': new RegExp('^(?:text-' + TEXT_COLOR + '|text-' + EMPHASIS + '|' + TEXT_BG + ')$'),
     'font-size': /^fs-[1-6]$/,
     'text-align': new RegExp('^text-' + BREAKPOINT + '(?:start|center|end)$'),
     'text-decoration': /^text-decoration-(?:none|underline|line-through)$/,
@@ -250,13 +277,13 @@ var SETS = {
     'font-style': /^fst-(?:italic|normal)$/,
     'line-height': /^lh-(?:1|sm|base|lg)$/,
     'text-transform': /^text-(?:lowercase|uppercase|capitalize)$/,
-    'display': new RegExp('^d-' + BREAKPOINT + '(?:none|inline|inline-block|block|grid|inline-grid|table|table-row|table-cell|flex|inline-flex)$'),
+    'display': new RegExp('^(?:d-' + BREAKPOINT + '(?: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': /^position-(?:static|relative|absolute|fixed|sticky)$/,
-    'top': /^top-(?:0|50|100)$/,
-    'bottom': /^bottom-(?:0|50|100)$/,
+    'position': new RegExp('^(?:position-(?:static|relative|absolute|fixed|sticky)|fixed-(?:top|bottom)|' + STICKY + '(?:top|bottom))$'),
+    'top': new RegExp('^(?:top-(?:0|50|100)|fixed-top|' + STICKY + 'top)$'),
+    'bottom': new RegExp('^(?:bottom-(?:0|50|100)|fixed-bottom|' + STICKY + 'bottom)$'),
     'left': /^start-(?:0|50|100)$/,
     'right': /^end-(?:0|50|100)$/,
     'z-index': /^z-(?:n1|[0-3])$/,

package/src/js/style/spacing.js

@@ -2,10 +2,8 @@
  * Spacing, a part of the style plugin: padding and margin per breakpoint, with Bootstrap's p-{breakpoint}-*,
  * pt-, px- … and m-{breakpoint}-*, mt-, mx- … classes.
  *
- * The part is what the spacing plugin was up to 7.2 - its families, and
- * whatever it did on the canvas - as a function of the handle and its options.
- * grideditor.style.js puts it in its sections; the deprecated
- * grideditor.spacing.js still registers it on its own, as it always did.
+ * Its families, and whatever it does on the canvas, as a function of the
+ * handle and its options: grideditor.style.js puts them in its sections.
  */
 import { GridEditor } from '../grideditor.js';
 import * as dom from '../dom.js';

package/src/js/style/sticky.js

@@ -0,0 +1,39 @@
+/**
+ * Sticky, a part of the style plugin: sticking a node to the top or the
+ * bottom of the page as it scrolls, per breakpoint, with Bootstrap's
+ * sticky-{breakpoint}-top and -bottom classes.
+ *
+ * Its families, and whatever it does on the canvas, as a function of the
+ * handle: grideditor.style.js puts them in its sections.
+ */
+import { GridEditor } from '../grideditor.js';
+
+Object.assign(GridEditor.locales.en, {
+    'utility.sticky': 'Sticky',
+});
+
+/** What Bootstrap's sticky-top and sticky-bottom are. */
+var STUCK = {
+    top: { position: 'sticky', top: '0', 'z-index': '1020' },
+    bottom: { position: 'sticky', bottom: '0', 'z-index': '1020' },
+};
+
+export function stickyPart(ge) {
+    return {
+        families: [{
+            name: 'sticky',
+            prefix: 'sticky',
+            values: ['top', 'bottom'],
+            appliesTo: ['row', 'column', 'element', 'container'],
+            labelKey: 'utility.sticky',
+            panel: false,
+
+            /** With no class applying here, where the node is without one. */
+            preview: function(value, node) {
+                if (value !== null) { return STUCK[value]; }
+
+                return { position: ge.bareStyle(node, 'sticky', 'position') };
+            },
+        }],
+    };
+}

package/src/js/style/textalign.js

@@ -2,10 +2,8 @@
  * Text alignment, a part of the style plugin: text alignment per breakpoint, with Bootstrap's text-{breakpoint}-start,
  * -center and -end classes.
  *
- * The part is what the textalign plugin was up to 7.2 - its families, and
- * whatever it did on the canvas - as a function of the handle.
- * grideditor.style.js puts it in its sections; the deprecated
- * grideditor.textalign.js still registers it on its own, as it always did.
+ * Its families, and whatever it does on the canvas, as a function of the
+ * handle: grideditor.style.js puts them in its sections.
  */
 import { GridEditor } from '../grideditor.js';
 

package/src/js/text/grideditor.text.js

@@ -210,7 +210,7 @@ if (!GridEditor.features.text) {
             var before = readBefore.get(block);
             var open = before ? attributesOf(block) : null;
 
-            // Every content area is told, as in 5.x: one whose editor never
+            // Every content area is told: one whose editor never
             // started is the plugin's to ignore
             if (text) { text.stop([block]); }
 

package/src/less/grideditor.less

@@ -474,6 +474,14 @@
     width: 360px;
     max-width: calc(100vw - 16px);
 
+    /* Bootstrap's css leaves the arrow's position to Popper, which puts it on
+       as an inline style. Without it the arrow stays in the flow, a strip as
+       tall as the arrow above the header; out of it, the top or bottom of
+       .bs-popover-bottom and .bs-popover-top hang it outside the edge */
+    > .popover-arrow {
+        position: absolute;
+    }
+
     > .popover-header {
         display: flex;
         align-items: center;
@@ -706,6 +714,34 @@
         }
     }
 
+    /* A tabs container laid out vertically from a breakpoint: Bootstrap's
+       classes answer to the window, and a breakpoint view narrows the canvas
+       instead, so the tabs plugin says which layout the view has and that is
+       what shows. The selectors outweigh Bootstrap's !important utilities.
+       Vertical, the container wraps, so its drawer is a line of its own
+       above the strip and the panes */
+    [data-ge-tabs-layout="vertical"] {
+        display: flex !important;
+        flex-wrap: wrap;
+        align-items: flex-start !important;
+
+        > .ge-container-drawer {
+            flex-shrink: 0;
+        }
+        > .nav {
+            flex-direction: column !important;
+            margin-right: 1rem !important;
+        }
+    }
+    [data-ge-tabs-layout="horizontal"] {
+        display: block !important;
+
+        > .nav {
+            flex-direction: row !important;
+            margin-right: 0 !important;
+        }
+    }
+
     /* The label is edited in place, so it needs to look like it can be */
     .ge-pane-label {
         &:hover {
@@ -1107,18 +1143,19 @@
 .ge-layout-modes();
 
 /*
- * The visibility plugin. A node Bootstrap would hide is kept on the canvas -
- * there would be nothing left to click to show it again - and shown the way
- * the view sees it instead. The selectors outweigh Bootstrap's d-* classes,
- * which are !important too.
+ * The 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.
  */
+@ge-displays: inline, inline-block, block, grid, inline-grid, flex, inline-flex;
+
 .ge-canvas.ge-editing {
-    .ge-visibility {
-        display: block !important;
-    }
-    .row.ge-visibility {
-        display: flex !important;
-    }
+    each(@ge-displays, {
+        [data-ge-display="@{value}"] {
+            display: @value !important;
+        }
+    });
 
     .ge-hidden-in-view {
         opacity: .45;
@@ -1148,6 +1185,27 @@
     }
 }
 
+/*
+ * The 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
+ * classes and the drawer's own margins, which the spacing part sets inline.
+ */
+.ge-canvas.ge-editing .ge-drawer-out {
+    position: relative;
+    border-top-style: solid !important;
+    border-top-color: transparent !important;
+
+    > .ge-tools-drawer {
+        position: absolute;
+        left: 0;
+        right: 0;
+        width: auto !important;
+        margin: 0 !important;
+    }
+}
+
 /* The order plugin: a column ordered by class in this view says where */
 .ge-canvas.ge-editing .column[data-ge-order]::before {
     content: attr(data-ge-order);

package/types/grideditor.d.ts

@@ -54,18 +54,36 @@ 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' | 'position' | 'custom';
+export type StyleSectionKey = '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 };
 
+/**
+ * A tabs container's variant: its strip's style, width and alignment, and
+ * whether it is laid out vertically - always, or from a breakpoint up.
+ */
+export interface TabsOptions {
+    variant?: 'tabs' | 'pills' | 'underline';
+    width?: 'natural' | 'fill' | 'justified';
+    /** Only with the natural width, and horizontal. */
+    align?: 'start' | 'center' | 'end';
+    vertical?: boolean | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
+}
+
+/** createContainer('tabs', …): how many tabs, their labels, and the variant. */
+export interface CreateTabsOptions extends Placement, TabsOptions {
+    tabs?: number;
+    labels?: string[];
+}
+
 /** The style plugin's settings. */
 export interface StyleOptions {
     /** Every section is on unless it is turned off here. */
     sections?: Partial<Record<StyleSectionKey, StyleSection>>;
-    /** What utilities.spacing was: the values offered, and what 0 to 5 come to. */
+    /** The spacing section: the values offered, and what 0 to 5 come to - for the gaps too. */
     spacing?: { values?: string[]; scale?: string[] };
-    /** What utilities.visibility was: false leaves the eye out of the drawers. */
+    /** The eye that hides and shows a node, the display family's: false leaves it out of the drawers. */
     visibility?: { drawer?: boolean };
 }
 
@@ -97,6 +115,8 @@ export interface GridEditorOptions {
     utilities?: Record<string, unknown>;
     /** The style plugin's sections, and the options of the utilities it carries. */
     style?: StyleOptions;
+    /** The tabs plugin: the variant of the tabs containers made new. */
+    tabs?: TabsOptions;
     elements?: { enabled?: boolean | 'auto'; selector?: string; auto?: boolean };
     custom_filter?: CustomFilter | CustomFilter[] | '';
     valid_col_sizes?: ColumnSize[];
@@ -328,6 +348,7 @@ export declare class GridEditor {
     createText(options: CreateTextOptions): HTMLElement | null;
     createElement(content: string | Node | ArrayLike<Node>, options?: CreateElementOptions): HTMLElement | null;
     createSection(options?: CreateSectionOptions): HTMLElement | null;
+    createContainer(type: 'tabs', options?: CreateTabsOptions): HTMLElement | null;
     createContainer(type: string, options?: Placement & Record<string, unknown>): HTMLElement | null;
     addTab(container: Target, options?: PaneOptions): HTMLElement | null;
     addAccordionItem(container: Target, options?: PaneOptions): HTMLElement | null;

package/dist/plugins/grideditor.float.esm.js

@@ -1,43 +0,0 @@
-// src/js/plugins/grideditor.float.js
-import { GridEditor as GridEditor2 } from "../grideditor.esm.js";
-
-// src/js/style/float.js
-import { GridEditor } from "../grideditor.esm.js";
-Object.assign(GridEditor.locales.en, {
-  "utility.float": "Float",
-  "utility.float_start": "Start",
-  "utility.float_end": "End",
-  "utility.float_none": "None"
-});
-var CSS = { start: "left", end: "right", none: "none" };
-function floatPart(ge) {
-  function label(value) {
-    if (value === "start") {
-      return ge.t("utility.float_start");
-    }
-    if (value === "end") {
-      return ge.t("utility.float_end");
-    }
-    return ge.t("utility.float_none");
-  }
-  return {
-    families: [{
-      name: "float",
-      prefix: "float",
-      values: ["start", "end", "none"],
-      appliesTo: ["element"],
-      labelKey: "utility.float",
-      label,
-      /** With no class applying here, whatever the host's css floats it as. */
-      preview: function(value, node) {
-        return { float: value === null ? ge.bareStyle(node, "float", "float") : CSS[value] };
-      }
-    }]
-  };
-}
-
-// src/js/plugins/grideditor.float.js
-GridEditor2.utilities.float = function(ge) {
-  ge.warn('the "float" plugin is deprecated and will be removed in 8.0: load grideditor.style.js');
-  return floatPart(ge);
-};

package/dist/plugins/grideditor.float.js

@@ -1,47 +0,0 @@
-(() => {
-  // src/js/register.js
-  var GridEditor = window.GridEditor;
-  if (!GridEditor || typeof GridEditor.get !== "function") {
-    throw new Error("grid-editor: load grideditor.js (or grideditor.bundle.min.js) before its plugins, its locales and grideditor.jquery.js");
-  }
-
-  // src/js/style/float.js
-  Object.assign(GridEditor.locales.en, {
-    "utility.float": "Float",
-    "utility.float_start": "Start",
-    "utility.float_end": "End",
-    "utility.float_none": "None"
-  });
-  var CSS = { start: "left", end: "right", none: "none" };
-  function floatPart(ge) {
-    function label(value) {
-      if (value === "start") {
-        return ge.t("utility.float_start");
-      }
-      if (value === "end") {
-        return ge.t("utility.float_end");
-      }
-      return ge.t("utility.float_none");
-    }
-    return {
-      families: [{
-        name: "float",
-        prefix: "float",
-        values: ["start", "end", "none"],
-        appliesTo: ["element"],
-        labelKey: "utility.float",
-        label,
-        /** With no class applying here, whatever the host's css floats it as. */
-        preview: function(value, node) {
-          return { float: value === null ? ge.bareStyle(node, "float", "float") : CSS[value] };
-        }
-      }]
-    };
-  }
-
-  // src/js/plugins/grideditor.float.js
-  GridEditor.utilities.float = function(ge) {
-    ge.warn('the "float" plugin is deprecated and will be removed in 8.0: load grideditor.style.js');
-    return floatPart(ge);
-  };
-})();

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

@@ -1 +0,0 @@
-(()=>{var i=window.GridEditor;if(!i||typeof i.get!="function")throw new Error("grid-editor: load grideditor.js (or grideditor.bundle.min.js) before its plugins, its locales and grideditor.jquery.js");Object.assign(i.locales.en,{"utility.float":"Float","utility.float_start":"Start","utility.float_end":"End","utility.float_none":"None"});var n={start:"left",end:"right",none:"none"};function o(t){function e(r){return r==="start"?t.t("utility.float_start"):r==="end"?t.t("utility.float_end"):t.t("utility.float_none")}return{families:[{name:"float",prefix:"float",values:["start","end","none"],appliesTo:["element"],labelKey:"utility.float",label:e,preview:function(r,l){return{float:r===null?t.bareStyle(l,"float","float"):n[r]}}}]}}i.utilities.float=function(t){return t.warn('the "float" plugin is deprecated and will be removed in 8.0: load grideditor.style.js'),o(t)};})();

package/dist/plugins/grideditor.float.min.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/js/register.js", "../../src/js/style/float.js", "../../src/js/plugins/grideditor.float.js"],
-  "sourcesContent": ["/**\n * What a plugin's or a locale's classic script imports in place of the\n * editor: the GridEditor the page already loaded.\n *\n * The build points `import { GridEditor } from '../grideditor.js'` here for\n * the classic scripts, so each registers on the editor the page has rather\n * than bringing its own. Loaded before the editor there is nothing to\n * register on, and saying so is better than a TypeError three calls later.\n */\nvar GridEditor = window.GridEditor;\n\nif (!GridEditor || typeof GridEditor.get !== 'function') {\n    throw new Error('grid-editor: load grideditor.js (or grideditor.bundle.min.js) before its plugins, ' +\n        'its locales and grideditor.jquery.js');\n}\n\nexport { GridEditor };\nexport default GridEditor;\n", "/**\n * Float, a part of the style plugin: floating an element per breakpoint, with Bootstrap's\n * float-{breakpoint}-start, -end and -none classes.\n *\n * The part is what the float plugin was up to 7.2 - its families, and\n * whatever it did on the canvas - as a function of the handle.\n * grideditor.style.js puts it in its sections; the deprecated\n * grideditor.float.js still registers it on its own, as it always did.\n */\nimport { GridEditor } from '../grideditor.js';\n\nObject.assign(GridEditor.locales.en, {\n    'utility.float': 'Float',\n    'utility.float_start': 'Start',\n    'utility.float_end': 'End',\n    'utility.float_none': 'None',\n});\n\n/** Start and end are left and right: Bootstrap's css is left to right. */\nvar CSS = { start: 'left', end: 'right', none: 'none' };\n\nexport function floatPart(ge) {\n\n    function label(value) {\n        if (value === 'start') { return ge.t('utility.float_start'); }\n        if (value === 'end') { return ge.t('utility.float_end'); }\n\n        return ge.t('utility.float_none');\n    }\n\n    return {\n        families: [{\n            name: 'float',\n            prefix: 'float',\n            values: ['start', 'end', 'none'],\n            appliesTo: ['element'],\n            labelKey: 'utility.float',\n            label: label,\n\n            /** With no class applying here, whatever the host's css floats it as. */\n            preview: function(value, node) {\n                return { float: value === null ? ge.bareStyle(node, 'float', 'float') : CSS[value] };\n            },\n        }],\n    };\n}\n", "/**\n * Floating elements for grid-editor.\n *\n * A utility plugin: load this file after the editor and after the elements\n * plugin, and an element can float to the start or the end of its content\n * area per breakpoint, with the text around it, using Bootstrap's\n * float-{breakpoint}-start, -end and -none classes. What it can ask the\n * editor for is the handle its factory is called with, described in\n * docs/plugins.md.\n *\n *   <script src=\"dist/grideditor.min.js\"></script>\n *   <script src=\"dist/plugins/grideditor.elements.min.js\"></script>\n *   <script src=\"dist/plugins/grideditor.float.min.js\"></script>\n *\n * Elements only. A floated row or column stops being part of the grid, and a\n * container sits beside the content areas rather than in their text.\n *\n * Deprecated since 7.3, and gone in 8.0: grideditor.style.js carries this\n * plugin's families, and edits them in its own sections. This file is that\n * part on its own, as it was, and says so once per editor. Loaded beside\n * the style plugin, it stands down.\n */\nimport { GridEditor } from '../grideditor.js';\nimport { floatPart } from '../style/float.js';\n\nGridEditor.utilities.float = function(ge) {\n    ge.warn('the \"float\" plugin is deprecated and will be removed in 8.0: load grideditor.style.js');\n    return floatPart(ge);\n};\n"],
-  "mappings": "MASA,IAAIA,EAAa,OAAO,WAExB,GAAI,CAACA,GAAc,OAAOA,EAAW,KAAQ,WACzC,MAAM,IAAI,MAAM,wHAC0B,ECF9C,OAAO,OAAOC,EAAW,QAAQ,GAAI,CACjC,gBAAiB,QACjB,sBAAuB,QACvB,oBAAqB,MACrB,qBAAsB,MAC1B,CAAC,EAGD,IAAIC,EAAM,CAAE,MAAO,OAAQ,IAAK,QAAS,KAAM,MAAO,EAE/C,SAASC,EAAUC,EAAI,CAE1B,SAASC,EAAMC,EAAO,CAClB,OAAIA,IAAU,QAAkBF,EAAG,EAAE,qBAAqB,EACtDE,IAAU,MAAgBF,EAAG,EAAE,mBAAmB,EAE/CA,EAAG,EAAE,oBAAoB,CACpC,CAEA,MAAO,CACH,SAAU,CAAC,CACP,KAAM,QACN,OAAQ,QACR,OAAQ,CAAC,QAAS,MAAO,MAAM,EAC/B,UAAW,CAAC,SAAS,EACrB,SAAU,gBACV,MAAOC,EAGP,QAAS,SAASC,EAAOC,EAAM,CAC3B,MAAO,CAAE,MAAOD,IAAU,KAAOF,EAAG,UAAUG,EAAM,QAAS,OAAO,EAAIL,EAAII,CAAK,CAAE,CACvF,CACJ,CAAC,CACL,CACJ,CCpBAE,EAAW,UAAU,MAAQ,SAASC,EAAI,CACtC,OAAAA,EAAG,KAAK,uFAAuF,EACxFC,EAAUD,CAAE,CACvB",
-  "names": ["GridEditor", "GridEditor", "CSS", "floatPart", "ge", "label", "value", "node", "GridEditor", "ge", "floatPart"]
-}