@cedx/ui 0.1.0 → 0.2.0

package/ReadMe.md

@@ -1,6 +1,6 @@
 # Belin UI
-Component library by [Cédric Belin](https://cedric-belin.fr), full stack developer,
-implemented in [C#](https://learn.microsoft.com/en-us/dotnet/csharp) and [TypeScript](https://www.typescriptlang.org).
+Component library by [Cédric Belin](https://cedric-belin.fr), full stack developer, implemented in
+[C#](https://learn.microsoft.com/en-us/dotnet/csharp), [PowerShell](https://learn.microsoft.com/en-us/powershell) and [TypeScript](https://www.typescriptlang.org).
 
 > This library is dedicated to personal/side projects.  
 > **Use at your own risk!** No support will be provided.

package/lib/AppTheme.d.ts

@@ -26,9 +26,9 @@ export type AppTheme = typeof AppTheme[keyof typeof AppTheme];
  */
 export declare function icon(theme: AppTheme): string;
 /**
- * Gets the label corresponding to the specified theme.
+ * Gets the text corresponding to the specified theme.
  * @param theme The application theme.
- * @returns The label corresponding to the specified theme.
+ * @returns The text corresponding to the specified theme.
  */
-export declare function label(theme: AppTheme): string;
+export declare function text(theme: AppTheme): string;
 //# sourceMappingURL=AppTheme.d.ts.map

package/lib/AppTheme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AppTheme.d.ts","sourceRoot":"","sources":["../src/Client/AppTheme.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,eAAO,MAAM,QAAQ;IAEpB;;OAEG;;IAGH;;OAEG;;IAGH;;OAEG;;EAEF,CAAC;AAEH;;GAEG;AACH,MAAM,MAAM,QAAQ,GAAG,OAAO,QAAQ,CAAC,MAAM,OAAO,QAAQ,CAAC,CAAC;AAE9D;;;;GAIG;AACH,wBAAgB,IAAI,CAAC,KAAK,EAAE,QAAQ,GAAG,MAAM,CAM5C;AAED;;;;GAIG;AACH,wBAAgB,KAAK,CAAC,KAAK,EAAE,QAAQ,GAAG,MAAM,CAM7C"}
+{"version":3,"file":"AppTheme.d.ts","sourceRoot":"","sources":["../src/Client/AppTheme.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,eAAO,MAAM,QAAQ;IAEpB;;OAEG;;IAGH;;OAEG;;IAGH;;OAEG;;EAEF,CAAC;AAEH;;GAEG;AACH,MAAM,MAAM,QAAQ,GAAG,OAAO,QAAQ,CAAC,MAAM,OAAO,QAAQ,CAAC,CAAC;AAE9D;;;;GAIG;AACH,wBAAgB,IAAI,CAAC,KAAK,EAAE,QAAQ,GAAG,MAAM,CAM5C;AAED;;;;GAIG;AACH,wBAAgB,IAAI,CAAC,KAAK,EAAE,QAAQ,GAAG,MAAM,CAM5C"}

package/lib/AppTheme.js

@@ -28,11 +28,11 @@ export function icon(theme) {
     }
 }
 /**
- * Gets the label corresponding to the specified theme.
+ * Gets the text corresponding to the specified theme.
  * @param theme The application theme.
- * @returns The label corresponding to the specified theme.
+ * @returns The text corresponding to the specified theme.
  */
-export function label(theme) {
+export function text(theme) {
     switch (theme) {
         case AppTheme.Dark: return "Sombre";
         case AppTheme.Light: return "Clair";

package/lib/Components/ThemeDropdown.d.ts

@@ -33,16 +33,16 @@ export declare class ThemeDropdown extends HTMLElement {
      */
     get cookieDomain(): string;
     set cookieDomain(value: string);
-    /**
-     * The label of the dropdown menu.
-     */
-    get label(): string;
-    set label(value: string);
     /**
      * The key of the storage entry providing the saved application theme.
      */
     get storageKey(): string;
     set storageKey(value: string);
+    /**
+     * The text of the dropdown menu.
+     */
+    get text(): string;
+    set text(value: string);
     /**
      * Method invoked when an attribute has been changed.
      * @param attribute The attribute name.

package/lib/Components/ThemeDropdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeDropdown.d.ts","sourceRoot":"","sources":["../../src/Client/Components/ThemeDropdown.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,SAAS,EAAC,MAAM,iBAAiB,CAAC;AAC1C,OAAO,EAAC,QAAQ,EAAO,MAAM,gBAAgB,CAAC;AAE9C;;GAEG;AACH,qBAAa,aAAc,SAAQ,WAAW;;IAE7C;;OAEG;IACH,MAAM,CAAC,QAAQ,CAAC,kBAAkB,WAAsC;IAiBxE;;OAEG;;IAaH;;OAEG;IACH,IAAI,SAAS,IAAI,SAAS,CAGzB;IACD,IAAI,SAAS,CAAC,KAAK,EAAE,SAAS,EAE7B;IAED;;OAEG;IACH,IAAI,QAAQ,IAAI,QAAQ,CAGvB;IACD,IAAI,QAAQ,CAAC,KAAK,EAAE,QAAQ,EAE3B;IAED;;OAEG;IACH,IAAI,MAAM,IAAI,OAAO,CAEpB;IACD,IAAI,MAAM,CAAC,KAAK,EAAE,OAAO,EAExB;IAED;;OAEG;IACH,IAAI,YAAY,IAAI,MAAM,CAEzB;IACD,IAAI,YAAY,CAAC,KAAK,EAAE,MAAM,EAE7B;IAED;;OAEG;IACH,IAAI,KAAK,IAAI,MAAM,CAGlB;IACD,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAEtB;IAED;;OAEG;IACH,IAAI,UAAU,IAAI,MAAM,CAGvB;IACD,IAAI,UAAU,CAAC,KAAK,EAAE,MAAM,EAE3B;IAED;;;;;OAKG;IACH,wBAAwB,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAC,IAAI,EAAE,QAAQ,EAAE,MAAM,GAAC,IAAI,GAAG,IAAI;IAS/F;;OAEG;IACH,KAAK,IAAI,IAAI;IAIb;;;OAGG;IACG,iBAAiB,IAAI,OAAO,CAAC,IAAI,CAAC;IAaxC;;OAEG;IACH,oBAAoB,IAAI,IAAI;IAK5B;;OAEG;IACH,IAAI,IAAI,IAAI;IAIZ;;OAEG;IACH,IAAI,IAAI,IAAI;CAwDZ;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEd;;OAEG;IACH,UAAU,qBAAqB;QAC9B,gBAAgB,EAAE,aAAa,CAAC;KAChC;CACD"}
+{"version":3,"file":"ThemeDropdown.d.ts","sourceRoot":"","sources":["../../src/Client/Components/ThemeDropdown.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,SAAS,EAAC,MAAM,iBAAiB,CAAC;AAC1C,OAAO,EAAC,QAAQ,EAAO,MAAM,gBAAgB,CAAC;AAE9C;;GAEG;AACH,qBAAa,aAAc,SAAQ,WAAW;;IAE7C;;OAEG;IACH,MAAM,CAAC,QAAQ,CAAC,kBAAkB,WAAqC;IAiBvE;;OAEG;;IAaH;;OAEG;IACH,IAAI,SAAS,IAAI,SAAS,CAGzB;IACD,IAAI,SAAS,CAAC,KAAK,EAAE,SAAS,EAE7B;IAED;;OAEG;IACH,IAAI,QAAQ,IAAI,QAAQ,CAGvB;IACD,IAAI,QAAQ,CAAC,KAAK,EAAE,QAAQ,EAE3B;IAED;;OAEG;IACH,IAAI,MAAM,IAAI,OAAO,CAEpB;IACD,IAAI,MAAM,CAAC,KAAK,EAAE,OAAO,EAExB;IAED;;OAEG;IACH,IAAI,YAAY,IAAI,MAAM,CAEzB;IACD,IAAI,YAAY,CAAC,KAAK,EAAE,MAAM,EAE7B;IAED;;OAEG;IACH,IAAI,UAAU,IAAI,MAAM,CAGvB;IACD,IAAI,UAAU,CAAC,KAAK,EAAE,MAAM,EAE3B;IAED;;OAEG;IACH,IAAI,IAAI,IAAI,MAAM,CAGjB;IACD,IAAI,IAAI,CAAC,KAAK,EAAE,MAAM,EAErB;IAED;;;;;OAKG;IACH,wBAAwB,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAC,IAAI,EAAE,QAAQ,EAAE,MAAM,GAAC,IAAI,GAAG,IAAI;IAS/F;;OAEG;IACH,KAAK,IAAI,IAAI;IAIb;;;OAGG;IACG,iBAAiB,IAAI,OAAO,CAAC,IAAI,CAAC;IAaxC;;OAEG;IACH,oBAAoB,IAAI,IAAI;IAK5B;;OAEG;IACH,IAAI,IAAI,IAAI;IAIZ;;OAEG;IACH,IAAI,IAAI,IAAI;CAwDZ;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEd;;OAEG;IACH,UAAU,qBAAqB;QAC9B,gBAAgB,EAAE,aAAa,CAAC;KAChC;CACD"}

package/lib/Components/ThemeDropdown.js

@@ -8,7 +8,7 @@ export class ThemeDropdown extends HTMLElement {
     /**
      * The list of observed attributes.
      */
-    static observedAttributes = ["alignment", "apptheme", "label"];
+    static observedAttributes = ["alignment", "apptheme", "text"];
     /**
      * The abort controller used to remove the event listeners.
      */
@@ -73,16 +73,6 @@ export class ThemeDropdown extends HTMLElement {
     set cookieDomain(value) {
         this.setAttribute("cookiedomain", value);
     }
-    /**
-     * The label of the dropdown menu.
-     */
-    get label() {
-        const value = this.getAttribute("label") ?? "";
-        return value.trim() || "Thème";
-    }
-    set label(value) {
-        this.setAttribute("label", value);
-    }
     /**
      * The key of the storage entry providing the saved application theme.
      */
@@ -93,6 +83,16 @@ export class ThemeDropdown extends HTMLElement {
     set storageKey(value) {
         this.setAttribute("storagekey", value);
     }
+    /**
+     * The text of the dropdown menu.
+     */
+    get text() {
+        const value = this.getAttribute("text") ?? "";
+        return value.trim() || "Thème";
+    }
+    set text(value) {
+        this.setAttribute("text", value);
+    }
     /**
      * Method invoked when an attribute has been changed.
      * @param attribute The attribute name.
@@ -108,8 +108,8 @@ export class ThemeDropdown extends HTMLElement {
                 case "apptheme":
                     this.#updateAppTheme(Object.values(AppTheme).includes(newValue) ? newValue : AppTheme.System);
                     break;
-                case "label":
-                    this.#updateLabel(newValue ?? "");
+                case "text":
+                    this.#updateText(newValue ?? "");
                     break;
                 // No default
             }
@@ -198,10 +198,10 @@ export class ThemeDropdown extends HTMLElement {
         this.#applyToDocument();
     }
     /**
-     * Updates the label of the dropdown menu.
+     * Updates the text of the dropdown menu.
      * @param value The new value.
      */
-    #updateLabel(value) {
+    #updateText(value) {
         this.querySelector(".dropdown-toggle > span").textContent = value.trim() || "Thème";
     }
 }

package/package.json

@@ -7,7 +7,7 @@
 	"name": "@cedx/ui",
 	"repository": "cedx/ui",
 	"type": "module",
-	"version": "0.1.0",
+	"version": "0.2.0",
 	"devDependencies": {
 		"@eslint/js": "^10.0.1",
 		"@types/bootstrap": "^5.2.10",
@@ -18,14 +18,14 @@
 		"bootstrap": "^5.3.8",
 		"chai": "^6.2.2",
 		"esbuild": "^0.28.0",
-		"globals": "^17.4.0",
-		"htmx.org": "^2.0.8",
+		"globals": "^17.6.0",
+		"htmx.org": "^2.0.10",
 		"mocha": "^11.7.5",
 		"playwright": "^1.59.1",
 		"playwright-chromium": "^1.59.1",
 		"serve-handler": "^6.1.7",
-		"typescript": "^6.0.2",
-		"typescript-eslint": "^8.58.1"
+		"typescript": "^6.0.3",
+		"typescript-eslint": "^8.59.2"
 	},
 	"engines": {
 		"node": ">=24.0.0"
@@ -42,7 +42,6 @@
 	],
 	"keywords": [
 		"belin",
-		"blazor",
 		"components",
 		"html",
 		"library",

package/src/Client/AppTheme.ts

@@ -38,11 +38,11 @@ export function icon(theme: AppTheme): string {
 }
 
 /**
- * Gets the label corresponding to the specified theme.
+ * Gets the text corresponding to the specified theme.
  * @param theme The application theme.
- * @returns The label corresponding to the specified theme.
+ * @returns The text corresponding to the specified theme.
  */
-export function label(theme: AppTheme): string {
+export function text(theme: AppTheme): string {
 	switch (theme) {
 		case AppTheme.Dark: return "Sombre";
 		case AppTheme.Light: return "Clair";

package/src/Client/Components/ThemeDropdown.ts

@@ -10,7 +10,7 @@ export class ThemeDropdown extends HTMLElement {
 	/**
 	 * The list of observed attributes.
 	 */
-	static readonly observedAttributes = ["alignment", "apptheme", "label"];
+	static readonly observedAttributes = ["alignment", "apptheme", "text"];
 
 	/**
 	 * The abort controller used to remove the event listeners.
@@ -84,17 +84,6 @@ export class ThemeDropdown extends HTMLElement {
 		this.setAttribute("cookiedomain", value);
 	}
 
-	/**
-	 * The label of the dropdown menu.
-	 */
-	get label(): string {
-		const value = this.getAttribute("label") ?? "";
-		return value.trim() || "Thème";
-	}
-	set label(value: string) {
-		this.setAttribute("label", value);
-	}
-
 	/**
 	 * The key of the storage entry providing the saved application theme.
 	 */
@@ -106,6 +95,17 @@ export class ThemeDropdown extends HTMLElement {
 		this.setAttribute("storagekey", value);
 	}
 
+	/**
+	 * The text of the dropdown menu.
+	 */
+	get text(): string {
+		const value = this.getAttribute("text") ?? "";
+		return value.trim() || "Thème";
+	}
+	set text(value: string) {
+		this.setAttribute("text", value);
+	}
+
 	/**
 	 * Method invoked when an attribute has been changed.
 	 * @param attribute The attribute name.
@@ -116,7 +116,7 @@ export class ThemeDropdown extends HTMLElement {
 		if (newValue != oldValue) switch (attribute) {
 			case "alignment": this.#updateAlignment(Object.values(Alignment).includes(newValue as Alignment) ? newValue as Alignment : Alignment.End); break;
 			case "apptheme": this.#updateAppTheme(Object.values(AppTheme).includes(newValue as AppTheme) ? newValue as AppTheme : AppTheme.System); break;
-			case "label": this.#updateLabel(newValue ?? ""); break;
+			case "text": this.#updateText(newValue ?? ""); break;
 			// No default
 		}
 	}
@@ -213,10 +213,10 @@ export class ThemeDropdown extends HTMLElement {
 	}
 
 	/**
-	 * Updates the label of the dropdown menu.
+	 * Updates the text of the dropdown menu.
 	 * @param value The new value.
 	 */
-	#updateLabel(value: string): void {
+	#updateText(value: string): void {
 		this.querySelector(".dropdown-toggle > span")!.textContent = value.trim() || "Thème";
 	}
 }