uicore-ts
Version:
UICore is a library to build native-like user interfaces using pure Typescript. No HTML is needed at all. Components are described as TS classes and all user interactions are handled explicitly. This library is strongly inspired by the UIKit framework tha
190 lines (189 loc) • 6.51 kB
JavaScript
;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
for (var name in all)
__defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
var UIRoute_exports = {};
__export(UIRoute_exports, {
UIRoute: () => UIRoute
});
module.exports = __toCommonJS(UIRoute_exports);
var import_UIObject = require("./UIObject");
class UIRoute extends Array {
constructor(hash) {
super();
if (!hash || !hash.startsWith) {
return;
}
if (hash.startsWith("#")) {
hash = hash.slice(1);
}
hash = decodeURIComponent(hash);
const components = hash.split("]");
components.forEach((component) => {
const componentName = component.split("[")[0];
const parameters = {};
if (!componentName) {
return;
}
const parametersString = component.split("[")[1] || "";
const parameterPairStrings = parametersString.split(",") || [];
parameterPairStrings.forEach((pairString) => {
const keyAndValueArray = pairString.split(":");
const key = decodeURIComponent(keyAndValueArray[0]);
const value = decodeURIComponent(keyAndValueArray[1]);
if (key) {
parameters[key] = value;
}
});
this.push({
name: componentName,
parameters
});
});
}
static get currentRoute() {
return new UIRoute(window.location.hash);
}
apply() {
const stringRepresentation = this.stringRepresentation;
if (new UIRoute(window.location.hash).stringRepresentation == stringRepresentation) {
return;
}
window.location.hash = stringRepresentation;
}
applyByReplacingCurrentRouteInHistory() {
const stringRepresentation = this.stringRepresentation;
if (new UIRoute(window.location.hash).stringRepresentation == stringRepresentation) {
return;
}
window.location.replace(this.linkRepresentation);
}
copy() {
const result = new UIRoute(this.stringRepresentation);
return result;
}
routeByRemovingComponentsOtherThanOnesNamed(componentNames) {
const result = this.copy();
const indexesToRemove = [];
result.forEach(function(component, index, array) {
if (!componentNames.contains(component.name)) {
indexesToRemove.push(index);
}
});
indexesToRemove.forEach(function(indexToRemove, index, array) {
result.removeElementAtIndex(indexToRemove);
});
return result;
}
routeByRemovingComponentNamed(componentName) {
const result = this.copy();
const componentIndex = result.findIndex(function(component, index) {
return component.name == componentName;
});
if (componentIndex != -1) {
result.splice(componentIndex, 1);
}
return result;
}
routeByRemovingParameterInComponent(componentName, parameterName, removeComponentIfEmpty = import_UIObject.NO) {
var _a, _b;
let result = this.copy();
let parameters = (_b = (_a = result.componentWithName(componentName)) == null ? void 0 : _a.parameters) != null ? _b : {};
delete parameters[parameterName];
result = result.routeWithComponent(componentName, parameters);
if (removeComponentIfEmpty && Object.keys(parameters).length == 0) {
result = result.routeByRemovingComponentNamed(componentName);
}
return result;
}
routeBySettingParameterInComponent(componentName, parameterName, valueToSet) {
var _a;
let result = this.copy();
if ((0, import_UIObject.IS_NIL)(valueToSet) || (0, import_UIObject.IS_NIL)(parameterName)) {
return result;
}
let parameters = (_a = result.componentWithName(componentName)) == null ? void 0 : _a.parameters;
if ((0, import_UIObject.IS_NOT)(parameters)) {
parameters = {};
}
parameters[parameterName] = valueToSet;
result = result.routeWithComponent(componentName, parameters);
return result;
}
routeWithViewControllerComponent(viewController, parameters, extendParameters = import_UIObject.NO) {
return this.routeWithComponent(viewController.routeComponentName, parameters, extendParameters);
}
routeWithComponent(name, parameters, extendParameters = import_UIObject.NO) {
const result = this.copy();
let component = result.componentWithName(name);
if ((0, import_UIObject.IS_NOT)(component)) {
component = {
name,
parameters: {}
};
result.push(component);
}
if ((0, import_UIObject.IS_NOT)(parameters)) {
parameters = {};
}
if (extendParameters) {
component.parameters = Object.assign(component.parameters, parameters);
} else {
component.parameters = parameters;
}
return result;
}
navigateBySettingComponent(name, parameters, extendParameters = import_UIObject.NO) {
this.routeWithComponent(name, parameters, extendParameters).apply();
}
componentWithViewController(viewController) {
return this.componentWithName(viewController.routeComponentName);
}
componentWithName(name) {
let result;
this.forEach(function(component, index, self) {
if (component.name == name) {
result = component;
}
});
return result;
}
get linkRepresentation() {
return "#" + this.stringRepresentation;
}
get stringRepresentation() {
let result = "";
this.forEach(function(component, index, self) {
result = result + component.name;
const parameters = component.parameters;
result = result + "[";
Object.keys(parameters).forEach(function(key, index2, keys) {
if (index2) {
result = result + ",";
}
result = result + encodeURIComponent(key) + ":" + encodeURIComponent(parameters[key]);
});
result = result + "]";
});
return result;
}
}
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
UIRoute
});
//# sourceMappingURL=UIRoute.js.map