@engines/ax-appkit-codemirror - npm Package Compare versions

Comparing version 0.0.26 to 0.0.28

ax-appkit-codemirror.js

@@ -13,10 +13,11 @@ // Ax, copyright (c) Lachlan Douglas
 
-ax.extension.codemirror = function (options = {}) {
-  let a = ax.a;
-  let x = ax.x;
+const a = ax.a,
+  x = ax.x,
+  is = ax.is;
 
+ax.extensions.codemirror = function (options = {}) {
   return a['ax-appkit-codemirror'](
     [
       ax.is.false(options.toolbar)
-        ? null
+        ? ''
         : x.codemirror.toolbar({
@@ -27,2 +28,3 @@ keymap: false,
       a.textarea(options.value || '', {
+        style: { display: 'none' },
         $init: (el) => {
@@ -64,3 +66,3 @@ let intersection = new IntersectionObserver(() => {
     ],
-    options.codemirrorTag
+    options.codemirrorTag || {}
   );
@@ -71,30 +73,45 @@ };
   'ax-appkit-codemirror': {
-    display: 'block',
+    $: {
+      display: 'block',
+    },
     'div.CodeMirror': {
-      minHeight: '2em',
-      borderRadius: 'unset',
-      padding: 'unset',
-      fontFamily: 'monospace',
-      zIndex: 1,
+      $: {
+        minHeight: '2em',
+        borderRadius: 'unset',
+        padding: 'unset',
+        fontFamily: 'monospace',
+        zIndex: 1,
+        border: '1px solid #e6e6e6',
+      },
       'div.CodeMirror-scroll': {
-        minHeight: 'unset',
+        $: {
+          minHeight: 'unset',
+        },
       },
     },
     'div.CodeMirror.disabled': {
-      backgroundColor: '#e9ecef',
+      $: {
+        backgroundColor: '#e9ecef',
+      },
     },
     '&.fullscreen': {
-      position: 'fixed',
-      top: '0',
-      left: '0',
-      right: '0',
-      bottom: '0',
-      border: 'none',
-      borderRadius: '0px',
-      zIndex: '999',
+      $: {
+        position: 'fixed',
+        top: '0',
+        left: '0',
+        right: '0',
+        bottom: '0',
+        border: 'none',
+        borderRadius: '0px',
+        zIndex: '999',
+      },
       'ax-appkit-codemirror-toolbar': {
-        overflow: 'hidden',
+        $: {
+          overflow: 'hidden',
+        },
         'ax-appkit-codemirror-label': {
-          display: 'block',
-          maxHeight: '1.8rem',
+          $: {
+            display: 'block',
+            maxHeight: '1.8rem',
+          },
         },
@@ -105,44 +122,62 @@ },
   'ax-appkit-codemirror-toolbar': {
-    display: 'block',
-    overflow: 'auto',
-    color: '#333',
-    backgroundColor: 'white',
-    border: '1px solid #e6e6e6',
-    borderBottom: 'none',
+    $: {
+      display: 'block',
+      overflow: 'auto',
+      color: '#333',
+      backgroundColor: 'white',
+      border: '1px solid #e6e6e6',
+      borderBottom: 'none',
+    },
     button: {
-      padding: '0px 5px',
-      margin: '1px',
-      fontSize: '1.2em',
-      border: 'none',
-      backgroundColor: 'transparent',
-      cursor: 'pointer',
+      $: {
+        padding: '0px 5px',
+        margin: '1px',
+        fontSize: '1.2em',
+        border: 'none',
+        backgroundColor: 'transparent',
+        cursor: 'pointer',
+      },
     },
     select: {
-      border: 'none',
-      backgroundColor: 'transparent',
-      height: '1.5rem',
+      $: {
+        border: 'none',
+        backgroundColor: 'transparent',
+        height: '1.5rem',
+      },
     },
     'ax-appkit-codemirror-label': {
-      display: 'block',
-      padding: '4px 4px',
+      $: {
+        display: 'block',
+        padding: '4px 4px',
+      },
     },
     'ax-appkit-codemirror-toolbar-right': {
-      float: 'right',
+      $: {
+        float: 'right',
+      },
       label: {
-        margin: '0px',
-        padding: '0px 5px',
+        $: {
+          margin: '0px',
+          padding: '0px 5px',
+        },
       },
       '& > *': {
-        verticalAlign: 'text-bottom',
+        $: {
+          verticalAlign: 'text-bottom',
+        },
       },
     },
     'ax-appkit-codemirror-mode': {
-      display: 'inline-block',
-      border: '1px solid #e6e6e6',
-      margin: '0px 2px',
+      $: {
+        display: 'inline-block',
+        border: '1px solid #e6e6e6',
+        margin: '0px 2px',
+      },
     },
     'ax-appkit-codemirror-keymap': {
-      display: 'inline-block',
-      border: '1px solid #e6e6e6',
-      margin: '0px 2px',
+      $: {
+        display: 'inline-block',
+        border: '1px solid #e6e6e6',
+        margin: '0px 2px',
+      },
     },
@@ -152,25 +187,24 @@ },
 
-ax.extension.codemirror.CodeMirror =
+ax.extensions.codemirror.CodeMirror =
   dependencies.CodeMirror || window.CodeMirror;
 
-ax.extension.codemirror.form = {};
+ax.extensions.codemirror.form = {};
 
-ax.extension.codemirror.report = {};
+ax.extensions.codemirror.report = {};
 
-ax.extension.codemirror.toolbar = function (options = {}) {
-  let a = ax.a;
-
+ax.extensions.codemirror.toolbar = function (options = {}) {
   return a['ax-appkit-codemirror-toolbar']([
     a['ax-appkit-codemirror-toolbar-right']([
-      ax.extension.codemirror.toolbar.mode(options),
-      ax.extension.codemirror.toolbar.keymap(options),
+      ax.extensions.codemirror.toolbar.mode(options),
+      ax.extensions.codemirror.toolbar.keymap(options),
       a['ax-appkit-codemirror-fullscreen'](
-        a.button('🗖', {
+        a.button({
+          $html: '🗖',
           type: 'button',
           $on: {
-            'click: toggle full screen': (el) => (e) => {
+            'click: toggle full screen': (e, el) => {
               let wrapper = el.$('^ax-appkit-codemirror');
               let codemirror = wrapper.$('textarea').$codemirror;
               if (wrapper.classList.contains('fullscreen')) {
-                el.$text = '🗖';
+                el.$html = '🗖';
                 el.$('^body').style.overflowY = 'unset';
@@ -180,3 +214,3 @@ wrapper.classList.remove('fullscreen');
               } else {
-                el.$text = '🗗';
+                el.$html = '🗗';
                 el.$('^body').style.overflowY = 'hidden';
@@ -191,10 +225,7 @@ wrapper.classList.add('fullscreen');
     ]),
-    a['ax-appkit-codemirror-label'](options.label || null),
+    a['ax-appkit-codemirror-label'](options.label || ''),
   ]);
 };
 
-ax.extension.codemirror.form.control = function (r, options = {}) {
-  let a = ax.a;
-  let x = ax.x;
-
+ax.extensions.codemirror.form.control = function (r, options = {}) {
   return a['ax-appkit-form-control'](
@@ -211,7 +242,7 @@ a['ax-appkit-codemirror-control']([
           $on: {
-            'keyup: update textarea value': (el) => (e) => {
+            'keyup: update textarea value': (e, el) => {
               el.$send('ax.appkit.form.control.change');
               el.$('textarea').$codemirror.save();
             },
-            'keydown: check for exit': (el) => (e) => {
+            'keydown: check for exit': (e, el) => {
               let control = el.$('^ax-appkit-codemirror-control');
@@ -274,3 +305,3 @@ let allowEsc =
 
-ax.extension.codemirror.form.shim = {
+ax.extensions.codemirror.form.shim = {
   controls: {
@@ -283,6 +314,3 @@ codemirror: (f, target) => (options = {}) => {
 
-ax.extension.codemirror.report.control = function (r, options = {}) {
-  let a = ax.a;
-  let x = ax.x;
-
+ax.extensions.codemirror.report.control = function (r, options = {}) {
   return a['ax-appkit-report-control'](
@@ -295,3 +323,3 @@ a['ax-appkit-codemirror-control']([
           $on: {
-            'keydown: check for exit': (el) => (e) => {
+            'keydown: check for exit': (e, el) => {
               let control = el.$('^ax-appkit-codemirror-control');
@@ -333,3 +361,3 @@
 
-ax.extension.codemirror.report.shim = {
+ax.extensions.codemirror.report.shim = {
   controls: {
@@ -341,6 +369,3 @@ codemirror: (f, target) => (options = {}) =>
 
-ax.extension.codemirror.toolbar.keymap = function (options = {}) {
-  let a = ax.a,
-    x = ax.x;
-
+ax.extensions.codemirror.toolbar.keymap = function (options = {}) {
   let keymap = options.keymap;
@@ -375,3 +400,3 @@
         $on: {
-          'change: set editor keyMap': (el) => (e) => {
+          'change: set editor keyMap': (e, el) => {
             el.$(
@@ -387,3 +412,3 @@ '^ax-appkit-codemirror-control ax-appkit-codemirror textarea'
   if (!keymap) {
-    component = null;
+    component = '';
   } else if (ax.is.string(keymap)) {
@@ -398,10 +423,7 @@ component = a.label(keymapLabel(keymap));
   return component
-    ? a['ax-appkit-codemirror-keymap'](component, options.keymapTag)
-    : null;
+    ? a['ax-appkit-codemirror-keymap'](component, options.keymapTag || {})
+    : '';
 };
 
-ax.extension.codemirror.toolbar.mode = function (options = {}) {
-  let a = ax.a,
-    x = ax.x;
-
+ax.extensions.codemirror.toolbar.mode = function (options = {}) {
   let mode = options.mode;
@@ -438,3 +460,3 @@ let component;
         $on: {
-          'change: set editor mode': (el) => (e) => {
+          'change: set editor mode': (e, el) => {
             el.$(
@@ -448,10 +470,10 @@ '^ax-appkit-codemirror-control ax-appkit-codemirror textarea'
   } else {
-    component = null;
+    component = '';
   }
 
   return component
-    ? a['ax-appkit-codemirror-mode'](component, options.modeTag)
-    : null;
+    ? a['ax-appkit-codemirror-mode'](component, options.modeTag || {})
+    : '';
 };
 
 }));

package.json

 {
   "name": "@engines/ax-appkit-codemirror",
-  "version": "0.0.26",
+  "version": "0.0.28",
   "description": "An Ax extension for CodeMirror.",
@@ -5,0 +5,0 @@ "main": "ax-appkit-codemirror.js",

No alert changes

Improved metrics

Total package byte prevSize

12864

increased by3.15%

Lines of code

429

increased by6.72%

No dependency changes