@ktjs/shortcuts 0.6.6 → 0.7.3

package/dist/index.d.ts

@@ -83,19 +83,11 @@ interface KTBaseAttribute {
   method?: 'POST' | 'GET' | 'PUT' | 'DELETE' | 'PATCH' | 'HEAD' | 'OPTIONS' | 'CONNECT' | 'TRACE' | otherstring;
 }
 
-type KTEventHandlersOrAttribute = {
-  [EventName in keyof HTMLElementEventMap]?: ((ev: HTMLElementEventMap[EventName]) => void) | string;
-};
-
-/**
- * Event handlers with @ prefix (e.g., @click, @input)
- * When key starts with @, it's always registered as an event handler
- */
 type KTPrefixedEventHandlers = {
-  [EventName in keyof HTMLElementEventMap as `@${EventName}`]?: (ev: HTMLElementEventMap[EventName]) => void;
+  [EventName in keyof HTMLElementEventMap as `on:${EventName}`]?: (ev: HTMLElementEventMap[EventName]) => void;
 };
 
-type KTAttribute = KTBaseAttribute & KTEventHandlersOrAttribute & KTPrefixedEventHandlers;
+type KTAttribute = KTBaseAttribute & KTPrefixedEventHandlers;
 
 /**
  * Wrap `h`(or its shortcuts) with default attributes.

package/dist/index.iife.js

@@ -1 +1,113 @@
-var __ktjs_shortcuts__=function(t,o){"use strict";const n=t=>{const n=(n,e)=>o.h(t,n,e);return window.__ktjs__.mark(n,t),n},e=n("div"),s=n("span"),i=n("label"),r=n("p"),c=n("h1"),u=n("h2"),_=n("h3"),h=n("h4"),l=n("h5"),a=n("h6"),f=n("ul"),b=n("ol"),d=n("li"),p=n("button"),w=n("form"),y=n("input"),j=n("select"),g=n("option"),k=n("table"),m=n("thead"),v=n("tbody"),A=n("tr"),D=n("th"),q=n("td"),x=n("a"),z=n("img");return t.a=x,t.btn=p,t.div=e,t.form=w,t.h1=c,t.h2=u,t.h3=_,t.h4=h,t.h5=l,t.h6=a,t.img=z,t.input=y,t.label=i,t.li=d,t.ol=b,t.option=g,t.p=r,t.select=j,t.span=s,t.table=k,t.tbody=v,t.td=q,t.th=D,t.thead=m,t.tr=A,t.ul=f,t.withDefaults=(t,o)=>{"t"in t==!1&&window.__ktjs__.throws("withDefaults can only be used with h function or its alias"),null!==o&&"object"==typeof o||window.__ktjs__.throws("defaultAttr must be an object");const n="string"==typeof o.class?t=>{if("string"==typeof t){const n={...o};return n.class=t+" "+o.class,n}if(t&&"object"==typeof t){const n={...o,...t};return n.class=(t.class??"")+" "+o.class,n}}:t=>"string"==typeof t?{...o,class:t}:t&&"object"==typeof t?{...o,...t}:void 0;return"h"===t.t?(o,e,s)=>t(o,n(e),s):(o,e)=>t(n(o),e)},t}({},__ktjs_core__);
+var __ktjs_shortcuts__ = (function (exports, core) {
+    'use strict';
+
+    const aliasH = (tag) => {
+        const newFunc = (attr, content) => {
+            return core.h(tag, attr, content);
+        };
+        window.__ktjs__.mark(newFunc, tag);
+        return newFunc;
+    };
+
+    const div = aliasH('div');
+    const span = aliasH('span');
+    const label = aliasH('label');
+    const p = aliasH('p');
+    const h1 = aliasH('h1');
+    const h2 = aliasH('h2');
+    const h3 = aliasH('h3');
+    const h4 = aliasH('h4');
+    const h5 = aliasH('h5');
+    const h6 = aliasH('h6');
+    const ul = aliasH('ul');
+    const ol = aliasH('ol');
+    const li = aliasH('li');
+    const btn = aliasH('button');
+    const form = aliasH('form');
+    const input = aliasH('input');
+    const select = aliasH('select');
+    const option = aliasH('option');
+    const table = aliasH('table');
+    const thead = aliasH('thead');
+    const tbody = aliasH('tbody');
+    const tr = aliasH('tr');
+    const th = aliasH('th');
+    const td = aliasH('td');
+    const a = aliasH('a');
+    const img = aliasH('img');
+
+    /**
+     * Wrap `h`(or its shortcuts) with default attributes.
+     * - `defaultAttr.class` will be merged with the provided `class` attribute.
+     * @param func `h` or its shortcuts.
+     * @param defaultAttr default KTAttribute, must be an object.
+     * @returns new h function with default attributes.
+     */
+    const withDefaults = (func, defaultAttr) => {
+        if ('__ktjs_h__' in func === false) {
+            window.__ktjs__.throws('withDefaults can only be used with h function or its alias');
+        }
+        if (defaultAttr === null || typeof defaultAttr !== 'object') {
+            window.__ktjs__.throws('defaultAttr must be an object');
+        }
+        // create different merger for defaultAttr with class and not
+        const merge = typeof defaultAttr.class === 'string'
+            ? (attr) => {
+                if (typeof attr === 'string') {
+                    const newAttr = { ...defaultAttr };
+                    newAttr.class = attr + ' ' + defaultAttr.class;
+                    return newAttr;
+                }
+                else if (attr && typeof attr === 'object') {
+                    const newAttr = { ...defaultAttr, ...attr };
+                    newAttr.class = (attr.class ?? '') + ' ' + defaultAttr.class;
+                    return newAttr;
+                }
+            }
+            : (attr) => {
+                if (typeof attr === 'string') {
+                    return { ...defaultAttr, class: attr };
+                }
+                else if (attr && typeof attr === 'object') {
+                    return { ...defaultAttr, ...attr };
+                }
+            };
+        if (func.__ktjs_h__ === 'h') {
+            return ((tag, attr, content) => func(tag, merge(attr), content));
+        }
+        else {
+            return ((attr, content) => func(merge(attr), content));
+        }
+    };
+
+    exports.a = a;
+    exports.btn = btn;
+    exports.div = div;
+    exports.form = form;
+    exports.h1 = h1;
+    exports.h2 = h2;
+    exports.h3 = h3;
+    exports.h4 = h4;
+    exports.h5 = h5;
+    exports.h6 = h6;
+    exports.img = img;
+    exports.input = input;
+    exports.label = label;
+    exports.li = li;
+    exports.ol = ol;
+    exports.option = option;
+    exports.p = p;
+    exports.select = select;
+    exports.span = span;
+    exports.table = table;
+    exports.tbody = tbody;
+    exports.td = td;
+    exports.th = th;
+    exports.thead = thead;
+    exports.tr = tr;
+    exports.ul = ul;
+    exports.withDefaults = withDefaults;
+
+    return exports;
+
+})({}, __ktjs_core__);

package/dist/index.legacy.js

@@ -1 +1,147 @@
-var __ktjs_shortcuts__=function(t,n){"use strict";var r=function(t){var r=function(r,o){return n.h(t,r,o)};return window.__ktjs__.mark(r,t),r},o=r("div"),e=r("span"),u=r("label"),i=r("p"),c=r("h1"),f=r("h2"),s=r("h3"),a=r("h4"),l=r("h5"),h=r("h6"),p=r("ul"),_=r("ol"),d=r("li"),b=r("button"),v=r("form"),j=r("input"),y=r("select"),w=r("option"),g=r("table"),k=r("thead"),m=r("tbody"),E=r("tr"),O=r("th"),S=r("td"),A=r("a"),D=r("img"),q=function(){return q=Object.assign||function(t){for(var n,r=1,o=arguments.length;r<o;r++)for(var e in n=arguments[r])Object.prototype.hasOwnProperty.call(n,e)&&(t[e]=n[e]);return t},q.apply(this,arguments)};"function"==typeof SuppressedError&&SuppressedError;return t.a=A,t.btn=b,t.div=o,t.form=v,t.h1=c,t.h2=f,t.h3=s,t.h4=a,t.h5=l,t.h6=h,t.img=D,t.input=j,t.label=u,t.li=d,t.ol=_,t.option=w,t.p=i,t.select=y,t.span=e,t.table=g,t.tbody=m,t.td=S,t.th=O,t.thead=k,t.tr=E,t.ul=p,t.withDefaults=function(t,n){"t"in t==!1&&window.__ktjs__.throws("withDefaults can only be used with h function or its alias"),null!==n&&"object"==typeof n||window.__ktjs__.throws("defaultAttr must be an object");var r="string"==typeof n.class?function(t){var r,o;return"string"==typeof t?((o=q({},n)).class=t+" "+n.class,o):t&&"object"==typeof t?((o=q(q({},n),t)).class=(null!==(r=t.class)&&void 0!==r?r:"")+" "+n.class,o):void 0}:function(t){return"string"==typeof t?q(q({},n),{class:t}):t&&"object"==typeof t?q(q({},n),t):void 0};return"h"===t.t?function(n,o,e){return t(n,r(o),e)}:function(n,o){return t(r(n),o)}},t}({},__ktjs_core__);
+var __ktjs_shortcuts__ = (function (exports, core) {
+    'use strict';
+
+    var aliasH = function (tag) {
+        var newFunc = function (attr, content) {
+            return core.h(tag, attr, content);
+        };
+        window.__ktjs__.mark(newFunc, tag);
+        return newFunc;
+    };
+
+    var div = aliasH('div');
+    var span = aliasH('span');
+    var label = aliasH('label');
+    var p = aliasH('p');
+    var h1 = aliasH('h1');
+    var h2 = aliasH('h2');
+    var h3 = aliasH('h3');
+    var h4 = aliasH('h4');
+    var h5 = aliasH('h5');
+    var h6 = aliasH('h6');
+    var ul = aliasH('ul');
+    var ol = aliasH('ol');
+    var li = aliasH('li');
+    var btn = aliasH('button');
+    var form = aliasH('form');
+    var input = aliasH('input');
+    var select = aliasH('select');
+    var option = aliasH('option');
+    var table = aliasH('table');
+    var thead = aliasH('thead');
+    var tbody = aliasH('tbody');
+    var tr = aliasH('tr');
+    var th = aliasH('th');
+    var td = aliasH('td');
+    var a = aliasH('a');
+    var img = aliasH('img');
+
+    /******************************************************************************
+    Copyright (c) Microsoft Corporation.
+
+    Permission to use, copy, modify, and/or distribute this software for any
+    purpose with or without fee is hereby granted.
+
+    THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+    REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+    AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+    INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+    LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+    OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+    PERFORMANCE OF THIS SOFTWARE.
+    ***************************************************************************** */
+    /* global Reflect, Promise, SuppressedError, Symbol, Iterator */
+
+
+    var __assign = function() {
+        __assign = Object.assign || function __assign(t) {
+            for (var s, i = 1, n = arguments.length; i < n; i++) {
+                s = arguments[i];
+                for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+            }
+            return t;
+        };
+        return __assign.apply(this, arguments);
+    };
+
+    typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+        var e = new Error(message);
+        return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+    };
+
+    /**
+     * Wrap `h`(or its shortcuts) with default attributes.
+     * - `defaultAttr.class` will be merged with the provided `class` attribute.
+     * @param func `h` or its shortcuts.
+     * @param defaultAttr default KTAttribute, must be an object.
+     * @returns new h function with default attributes.
+     */
+    var withDefaults = function (func, defaultAttr) {
+        if ('__ktjs_h__' in func === false) {
+            window.__ktjs__.throws('withDefaults can only be used with h function or its alias');
+        }
+        if (defaultAttr === null || typeof defaultAttr !== 'object') {
+            window.__ktjs__.throws('defaultAttr must be an object');
+        }
+        // create different merger for defaultAttr with class and not
+        var merge = typeof defaultAttr.class === 'string'
+            ? function (attr) {
+                var _a;
+                if (typeof attr === 'string') {
+                    var newAttr = __assign({}, defaultAttr);
+                    newAttr.class = attr + ' ' + defaultAttr.class;
+                    return newAttr;
+                }
+                else if (attr && typeof attr === 'object') {
+                    var newAttr = __assign(__assign({}, defaultAttr), attr);
+                    newAttr.class = ((_a = attr.class) !== null && _a !== void 0 ? _a : '') + ' ' + defaultAttr.class;
+                    return newAttr;
+                }
+            }
+            : function (attr) {
+                if (typeof attr === 'string') {
+                    return __assign(__assign({}, defaultAttr), { class: attr });
+                }
+                else if (attr && typeof attr === 'object') {
+                    return __assign(__assign({}, defaultAttr), attr);
+                }
+            };
+        if (func.__ktjs_h__ === 'h') {
+            return (function (tag, attr, content) { return func(tag, merge(attr), content); });
+        }
+        else {
+            return (function (attr, content) { return func(merge(attr), content); });
+        }
+    };
+
+    exports.a = a;
+    exports.btn = btn;
+    exports.div = div;
+    exports.form = form;
+    exports.h1 = h1;
+    exports.h2 = h2;
+    exports.h3 = h3;
+    exports.h4 = h4;
+    exports.h5 = h5;
+    exports.h6 = h6;
+    exports.img = img;
+    exports.input = input;
+    exports.label = label;
+    exports.li = li;
+    exports.ol = ol;
+    exports.option = option;
+    exports.p = p;
+    exports.select = select;
+    exports.span = span;
+    exports.table = table;
+    exports.tbody = tbody;
+    exports.td = td;
+    exports.th = th;
+    exports.thead = thead;
+    exports.tr = tr;
+    exports.ul = ul;
+    exports.withDefaults = withDefaults;
+
+    return exports;
+
+})({}, __ktjs_core__);

package/dist/index.mjs

@@ -1 +1,82 @@
-import{h as t}from"@ktjs/core";const o=o=>{const e=(e,n)=>t(o,e,n);return window.__ktjs__.mark(e,o),e},e=o("div"),n=o("span"),i=o("label"),r=o("p"),s=o("h1"),c=o("h2"),l=o("h3"),f=o("h4"),h=o("h5"),u=o("h6"),a=o("ul"),p=o("ol"),b=o("li"),d=o("button"),w=o("form"),y=o("input"),j=o("select"),m=o("option"),_=o("table"),g=o("thead"),k=o("tbody"),v=o("tr"),x=o("th"),A=o("td"),D=o("a"),q=o("img"),z=(t,o)=>{"t"in t==!1&&window.__ktjs__.throws("withDefaults can only be used with h function or its alias"),null!==o&&"object"==typeof o||window.__ktjs__.throws("defaultAttr must be an object");const e="string"==typeof o.class?t=>{if("string"==typeof t){const e={...o};return e.class=t+" "+o.class,e}if(t&&"object"==typeof t){const e={...o,...t};return e.class=(t.class??"")+" "+o.class,e}}:t=>"string"==typeof t?{...o,class:t}:t&&"object"==typeof t?{...o,...t}:void 0;return"h"===t.t?(o,n,i)=>t(o,e(n),i):(o,n)=>t(e(o),n)};export{D as a,d as btn,e as div,w as form,s as h1,c as h2,l as h3,f as h4,h as h5,u as h6,q as img,y as input,i as label,b as li,p as ol,m as option,r as p,j as select,n as span,_ as table,k as tbody,A as td,x as th,g as thead,v as tr,a as ul,z as withDefaults};
+import { h } from '@ktjs/core';
+
+const aliasH = (tag) => {
+    const newFunc = (attr, content) => {
+        return h(tag, attr, content);
+    };
+    window.__ktjs__.mark(newFunc, tag);
+    return newFunc;
+};
+
+const div = aliasH('div');
+const span = aliasH('span');
+const label = aliasH('label');
+const p = aliasH('p');
+const h1 = aliasH('h1');
+const h2 = aliasH('h2');
+const h3 = aliasH('h3');
+const h4 = aliasH('h4');
+const h5 = aliasH('h5');
+const h6 = aliasH('h6');
+const ul = aliasH('ul');
+const ol = aliasH('ol');
+const li = aliasH('li');
+const btn = aliasH('button');
+const form = aliasH('form');
+const input = aliasH('input');
+const select = aliasH('select');
+const option = aliasH('option');
+const table = aliasH('table');
+const thead = aliasH('thead');
+const tbody = aliasH('tbody');
+const tr = aliasH('tr');
+const th = aliasH('th');
+const td = aliasH('td');
+const a = aliasH('a');
+const img = aliasH('img');
+
+/**
+ * Wrap `h`(or its shortcuts) with default attributes.
+ * - `defaultAttr.class` will be merged with the provided `class` attribute.
+ * @param func `h` or its shortcuts.
+ * @param defaultAttr default KTAttribute, must be an object.
+ * @returns new h function with default attributes.
+ */
+const withDefaults = (func, defaultAttr) => {
+    if ('__ktjs_h__' in func === false) {
+        window.__ktjs__.throws('withDefaults can only be used with h function or its alias');
+    }
+    if (defaultAttr === null || typeof defaultAttr !== 'object') {
+        window.__ktjs__.throws('defaultAttr must be an object');
+    }
+    // create different merger for defaultAttr with class and not
+    const merge = typeof defaultAttr.class === 'string'
+        ? (attr) => {
+            if (typeof attr === 'string') {
+                const newAttr = { ...defaultAttr };
+                newAttr.class = attr + ' ' + defaultAttr.class;
+                return newAttr;
+            }
+            else if (attr && typeof attr === 'object') {
+                const newAttr = { ...defaultAttr, ...attr };
+                newAttr.class = (attr.class ?? '') + ' ' + defaultAttr.class;
+                return newAttr;
+            }
+        }
+        : (attr) => {
+            if (typeof attr === 'string') {
+                return { ...defaultAttr, class: attr };
+            }
+            else if (attr && typeof attr === 'object') {
+                return { ...defaultAttr, ...attr };
+            }
+        };
+    if (func.__ktjs_h__ === 'h') {
+        return ((tag, attr, content) => func(tag, merge(attr), content));
+    }
+    else {
+        return ((attr, content) => func(merge(attr), content));
+    }
+};
+
+export { a, btn, div, form, h1, h2, h3, h4, h5, h6, img, input, label, li, ol, option, p, select, span, table, tbody, td, th, thead, tr, ul, withDefaults };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ktjs/shortcuts",
-  "version": "0.6.6",
+  "version": "0.7.3",
   "description": "Shortcut functions for kt.js - common DOM operations",
   "type": "module",
   "module": "./dist/index.mjs",
@@ -30,7 +30,7 @@
     "directory": "packages/shortcuts"
   },
   "dependencies": {
-    "@ktjs/core": "0.6.6"
+    "@ktjs/core": "0.7.3"
   },
   "scripts": {
     "build": "rollup -c rollup.config.mjs",