@themarioga/grid-editor 8.0.0 → 8.1.0

package/docs/locale-keys.md

@@ -329,6 +329,7 @@ The inline-style plugin's accordion, in a node's settings panel or in the dialog
 | `inline_style.shadow_color` | Color | A part of the shadow builder |
 | `inline_style.shadow_inset` | Inset | The shadow builder's inset checkbox |
 | `inline_style.shadow_text_mode` | Edit as text | Link under the shadow builder that edits the value as text |
+| `inline_style.shadow_builder_mode` | Edit with the builder | Link under a shadow edited as text that goes back to the builder, when the value is one shadow or none |
 | `inline_style.prop_width` | Width | Label of the `width` field |
 | `inline_style.prop_height` | Height | Label of the `height` field |
 | `inline_style.prop_min_width` | Min width | Label of the `min-width` field |

package/package.json

@@ -33,7 +33,7 @@
     "comment": "A scoped package publishes restricted unless it is told otherwise.",
     "access": "public"
   },
-  "version": "8.0.0",
+  "version": "8.1.0",
   "main": "dist/grideditor.js",
   "module": "dist/grideditor.esm.js",
   "types": "dist/grideditor.d.ts",

package/src/js/grideditor.js

@@ -142,10 +142,14 @@ var NESTED_SETTINGS = {
         auto: false, // Treat every child of a content area as an element
     },
     resize: {
-        enabled: true,
+        enabled: true, // The handle on the column's edge
+        tools: true, // The narrower and wider tools in the column's drawer
         handles: 'e', // Which edges carry a handle: 'e', 'w', or 'e, w'
         balance: 'next', // 'next' takes the units out of the following column
     },
+    indent: {
+        tools: true, // The indent tools in the column's drawer
+    },
     drag: {
         delay: 0, // Milliseconds to hold before a drag starts
         touch_delay: 100, // The same for touch, where 0 eats the page's scrolling
@@ -380,6 +384,7 @@ function build(instance, baseElem, optionsOrMethod) {
             'layout_modes'      : VIEW_KEYS.slice(), // Which views the dropdown offers
             'default_view'      : ALL_VIEW,
             'resize'            : NESTED_SETTINGS.resize, // Resizing a column by dragging its edge
+            'indent'            : NESTED_SETTINGS.indent, // Indenting a column, offset-*
             'source_textarea'   : '',
             'edit_source'       : true, // The toolbar's button to edit the canvas as html
             'locale'            : 'en', // Code of a locale in GridEditor.locales
@@ -2973,30 +2978,34 @@ function build(instance, baseElem, optionsOrMethod) {
 
                 createMoveTool(drawer);
 
-                createTool(drawer, t('tool.column_narrower'), 'ge-decrease-col-width', 'bi bi-dash-lg', function(e) {
-                    resizeColumn(col, e.shiftKey
-                        ? smallest(settings.valid_col_sizes)
-                        : stepThrough(settings.valid_col_sizes.filter(isUnits), currentUnits(col), -1),
-                        'tool');
-                });
+                if (settings.resize.tools !== false) {
+                    createTool(drawer, t('tool.column_narrower'), 'ge-decrease-col-width', 'bi bi-dash-lg', function(e) {
+                        resizeColumn(col, e.shiftKey
+                            ? smallest(settings.valid_col_sizes)
+                            : stepThrough(settings.valid_col_sizes.filter(isUnits), currentUnits(col), -1),
+                            'tool');
+                    });
 
-                createTool(drawer, t('tool.column_wider'), 'ge-increase-col-width', 'bi bi-plus-lg', function(e) {
-                    resizeColumn(col, e.shiftKey
-                        ? widestFor(col)
-                        : stepThrough(settings.valid_col_sizes.filter(isUnits), currentUnits(col), 1),
-                        'tool');
-                });
+                    createTool(drawer, t('tool.column_wider'), 'ge-increase-col-width', 'bi bi-plus-lg', function(e) {
+                        resizeColumn(col, e.shiftKey
+                            ? widestFor(col)
+                            : stepThrough(settings.valid_col_sizes.filter(isUnits), currentUnits(col), 1),
+                            'tool');
+                    });
+                }
 
-                createTool(drawer, t('tool.indent_decrease'), 'ge-decrease-col-offset', 'bi bi-text-indent-right', function(e) {
-                    indentColumn(col, e.shiftKey
-                        ? smallest(settings.valid_col_offsets)
-                        : stepThrough(settings.valid_col_offsets, currentOffset(col), -1),
-                        'tool');
-                });
+                if (settings.indent.tools !== false) {
+                    createTool(drawer, t('tool.indent_decrease'), 'ge-decrease-col-offset', 'bi bi-text-indent-right', function(e) {
+                        indentColumn(col, e.shiftKey
+                            ? smallest(settings.valid_col_offsets)
+                            : stepThrough(settings.valid_col_offsets, currentOffset(col), -1),
+                            'tool');
+                    });
 
-                createTool(drawer, t('tool.indent_increase'), 'ge-increase-col-offset', 'bi bi-text-indent-left', function(e) {
-                    indentColumn(col, e.shiftKey ? deepestFor(col) : stepThrough(settings.valid_col_offsets, currentOffset(col), 1), 'tool');
-                });
+                    createTool(drawer, t('tool.indent_increase'), 'ge-increase-col-offset', 'bi bi-text-indent-left', function(e) {
+                        indentColumn(col, e.shiftKey ? deepestFor(col) : stepThrough(settings.valid_col_offsets, currentOffset(col), 1), 'tool');
+                    });
+                }
 
                 addSettingsTool(drawer, col, settings.col_classes);
 

package/src/js/inline-style/fields.js

@@ -276,6 +276,16 @@ function shadowControl(ge, node, property, changed) {
             }
             writeValue(input.value, input);
         });
+
+        // Back to the builder, when it can hold the value: one shadow, or none
+        if (parseShadow(value, box)) {
+            var toBuilder = holder.appendChild(dom.element('a', { href: '#', 'class': 'ge-inline-style-shadow-mode' }, ge.t('inline_style.shadow_builder_mode')));
+            toBuilder.addEventListener('click', function(e) {
+                e.preventDefault();
+                textMode = false;
+                render();
+            });
+        }
     }
 
     var shown = null; // The value the builder or the text was last built for

package/src/js/locales/grideditor.es.js

@@ -210,6 +210,7 @@ GridEditor.locales.es = {
     'inline_style.shadow_color': 'Color',
     'inline_style.shadow_inset': 'Interior',
     'inline_style.shadow_text_mode': 'Editar como texto',
+    'inline_style.shadow_builder_mode': 'Editar con el constructor',
     'inline_style.prop_width': 'Ancho',
     'inline_style.prop_height': 'Alto',
     'inline_style.prop_min_width': 'Ancho mínimo',

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

@@ -59,6 +59,7 @@ Object.assign(GridEditor.locales.en, {
     'inline_style.shadow_color': 'Color',
     'inline_style.shadow_inset': 'Inset',
     'inline_style.shadow_text_mode': 'Edit as text',
+    'inline_style.shadow_builder_mode': 'Edit with the builder',
     'inline_style.prop_width': 'Width',
     'inline_style.prop_height': 'Height',
     'inline_style.prop_min_width': 'Min width',

package/types/grideditor.d.ts

@@ -124,7 +124,10 @@ export interface GridEditorOptions {
     add_column?: { size?: ColumnSize | null; picker?: boolean; delay?: number };
     layout_modes?: View[];
     default_view?: View;
-    resize?: { enabled?: boolean; handles?: string; balance?: 'next' | false };
+    /** enabled is the handle on the column's edge, tools the narrower and wider tools in its drawer. */
+    resize?: { enabled?: boolean; tools?: boolean; handles?: string; balance?: 'next' | false };
+    /** tools is the indent tools in a column's drawer. */
+    indent?: { tools?: boolean };
     /** A textarea whose html the canvas starts with. */
     source_textarea?: Target | '';
     edit_source?: boolean;