npm - htmx-router - Versions diffs - 0.1.3 → 0.2.0 - Mend

htmx-router 0.1.3 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/bin/components.d.ts CHANGED Viewed

@@ -1,6 +1,8 @@
-export declare function Link(props: {
+import type * as CSS from 'csstype';
+import html from '@kitajs/html';
+export declare function Link(props: html.PropsWithChildren<{
     to: string;
     class?: string;
+    style?: string | CSS.Properties<0 | (string & {}), string & {}>;
     target?: string;
-    style?: string;
-}, contents: string[]): string;
+}>): string;

package/bin/components.js CHANGED Viewed

@@ -1,31 +1,11 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Link = void 0;
-const elements = __importStar(require("typed-html"));
-function Link(props, contents) {
-    return elements.createElement("a", { target: props.target || "", class: props.class || "", style: props.style || "", href: props.to, "hx-get": props.to, "hx-headers": '{"Cache-Control": "no-cache"}' }, contents);
+const html_1 = __importDefault(require("@kitajs/html"));
+function Link(props) {
+    return html_1.default.createElement("a", { target: props.target || "", class: props.class || "", style: props.style || "", href: props.to, "hx-get": props.to, "hx-headers": '{"Cache-Control": "no-cache"}' }, props.children);
 }
 exports.Link = Link;

package/bin/render-args.js CHANGED Viewed

@@ -1,30 +1,10 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.RenderArgs = exports.MaskType = void 0;
-const elements = __importStar(require("typed-html"));
+const html_1 = __importDefault(require("@kitajs/html"));
 const titleScript = `<script>` +
     `document.addEventListener("DOMContentLoaded",function(){` +
     `document.body.addEventListener("setTitle",function(evt){document.title=decodeURIComponent(evt.detail.value);})` +
@@ -91,7 +71,7 @@ class RenderArgs {
             return route.render(this, mask, routeName);
         };
         this.renderHeadHTML = () => {
-            let out = elements.createElement("title", null, this.title);
+            let out = html_1.default.createElement("title", null, this.title);
             for (const elm of this.links) {
                 out += "<link";
                 for (const attr in elm) {

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
 	"name": "htmx-router",
-	"version": "0.1.3",
+	"version": "0.2.0",
 	"description": "A remix.js style file path router for htmX websites",
 	"main": "./bin/index.js",
 	"scripts": {
@@ -25,7 +25,7 @@
 		"typescript": "^5.1.6"
 	},
 	"dependencies": {
-		"csstype": "^3.1.2",
-		"typed-html": "^3.0.1"
+		"@kitajs/html": "^1.4.2",
+		"csstype": "^3.1.2"
 	}
 }

package/readme.md CHANGED Viewed

@@ -4,31 +4,31 @@
 This library attempts to be as unopinionated as possible allowing for multiple escape hatches in-case there are certain times you want a different style of behaviour.
-This library does not rely on any heavy weight dependencies such as react, instead opting to be built on the lighter weight [typed-html](https://www.npmjs.com/package/typed-html) library for it's JSX rendering, and using [csstype](https://www.npmjs.com/package/csstype), just as a type interface to improve developer ergonomics.
+This library does not rely on any heavy weight dependencies such as react, instead opting to be built on the lighter weight [kitajs/html](https://kitajs.github.io/html/) library for it's JSX rendering, and using [csstype](https://www.npmjs.com/package/csstype), just as a type interface to improve developer ergonomics.
 You can also see an example site running this library [here](https://github.com/AjaniBilby/predictable) with source code as an extra helpful example. Please be mindful the slow loading of this site is actually due to Discord APIs, and the rendering is taking less than 2ms on a raspberry pi on my floor.
 - [htmX Router](#htmx-router)
-  - [Routes](#routes)
-    - [Module Layout](#module-layout)
-      - [Auth Function](#auth-function)
-      - [Render Function](#render-function)
-      - [CatchError Function](#catcherror-function)
-  - [Router](#router)
-  - [Types](#types)
-    - [RenderArgs](#renderargs)
-      - [Outlet](#outlet)
-      - [setTitle](#settitle)
-      - [addMeta](#addmeta)
-      - [addLinks](#addlinks)
-      - [renderHeadHTML](#renderheadhtml)
-      - [shared](#shared)
-    - [ErrorResponse](#errorresponse)
-    - [Override](#override)
-    - [Redirect](#redirect)
-  - [Components](#components)
-    - [Link](#link)
-  - [StyleCSS](#stylecss)
+	- [Routes](#routes)
+		- [Module Layout](#module-layout)
+			- [Auth Function](#auth-function)
+			- [Render Function](#render-function)
+			- [CatchError Function](#catcherror-function)
+	- [Router](#router)
+	- [Types](#types)
+		- [RenderArgs](#renderargs)
+			- [Outlet](#outlet)
+			- [setTitle](#settitle)
+			- [addMeta](#addmeta)
+			- [addLinks](#addlinks)
+			- [renderHeadHTML](#renderheadhtml)
+			- [shared](#shared)
+		- [ErrorResponse](#errorresponse)
+		- [Override](#override)
+		- [Redirect](#redirect)
+	- [Components](#components)
+		- [Link](#link)
+	- [StyleCSS](#stylecss)
 ## Routes
@@ -266,7 +266,9 @@ This element will encode as a standard `<a>` with some extra html attributes, me
 ## StyleCSS
-This is a helper function allowing you to give it a [CSS.Properties](https://www.npmjs.com/package/csstype) type, and render it into a string for [typed-html](https://www.npmjs.com/package/typed-html) to use.
+> **DEPRECATED**: If you utilize `@kitajs/html` instead of `typed-html` this function is no longer needed
+This is a helper function allowing you to give it a [CSS.Properties](https://www.npmjs.com/package/csstype) type, and render it into a string for [kitajs/html](https://kitajs.github.io/html/) to use.
 ```tsx
 <div style={StyleCSS({
   height: "100%",