Dive into secure and efficient coding practices with our curated list of the top 10 examples showcasing 'aurelia-templating' in functional components in JavaScript. Our advanced machine learning engine meticulously scans each line of code, cross-referencing millions of open source libraries to ensure your implementation is not just functional, but also robust and secure. Elevate your React applications to new heights by mastering the art of handling side effects, API calls, and asynchronous operations with confidence and precision.
var _dec, _class, _dec2, _class2;
import { inject } from 'aurelia-dependency-injection';
import { CompositionEngine, useView, inlineView, customElement } from 'aurelia-templating';
import { RouteLoader, Router } from 'aurelia-router';
import { relativeToFile } from 'aurelia-path';
import { Origin } from 'aurelia-metadata';
import { RouterViewLocator } from './router-view';
let EmptyClass = (_dec = inlineView('<template></template>'), _dec(_class = class EmptyClass {}) || _class);
export let TemplatingRouteLoader = (_dec2 = inject(CompositionEngine), _dec2(_class2 = class TemplatingRouteLoader extends RouteLoader {
constructor(compositionEngine) {
super();
this.compositionEngine = compositionEngine;
}
loadRoute(router, config) {
let childContainer = router.container.createChild();
let viewModel;
if (config.moduleId === null) {
viewModel = EmptyClass;
} else if (/\.html/i.test(config.moduleId)) {
viewModel = createDynamicClass(config.moduleId);
} else {
var _dec, _class;
import { customAttribute } from 'aurelia-templating';
import { bindingMode } from 'aurelia-binding';
import { TaskQueue } from 'aurelia-task-queue';
import { DOM } from 'aurelia-pal';
export var Focus = (_dec = customAttribute('focus', bindingMode.twoWay), _dec(_class = function () {
Focus.inject = function inject() {
return [DOM.Element, TaskQueue];
};
function Focus(element, taskQueue) {
this.element = element;
this.taskQueue = taskQueue;
this.isAttached = false;
this.needsApply = false;
}
Focus.prototype.valueChanged = function valueChanged(newValue) {
if (this.isAttached) {
this._apply();
var _dec, _class;
import { customAttribute } from 'aurelia-templating';
import { bindingMode } from 'aurelia-binding';
import { TaskQueue } from 'aurelia-task-queue';
import { DOM } from 'aurelia-pal';
export let Focus = (_dec = customAttribute('focus', bindingMode.twoWay), _dec(_class = class Focus {
static inject() {
return [DOM.Element, TaskQueue];
}
constructor(element, taskQueue) {
this.element = element;
this.taskQueue = taskQueue;
this.isAttached = false;
this.needsApply = false;
}
valueChanged(newValue) {
if (this.isAttached) {
this._apply();
} else {
var _dec, _class;
import { Optional } from 'aurelia-dependency-injection';
import { customAttribute, Animator } from 'aurelia-templating';
import { DOM } from 'aurelia-pal';
import { injectAureliaHideStyleAtBoundary, aureliaHideClassName } from './aurelia-hide-style';
export var Show = (_dec = customAttribute('show'), _dec(_class = function () {
Show.inject = function inject() {
return [DOM.Element, Animator, Optional.of(DOM.boundary, true)];
};
function Show(element, animator, domBoundary) {
this.element = element;
this.animator = animator;
this.domBoundary = domBoundary;
}
Show.prototype.created = function created() {
injectAureliaHideStyleAtBoundary(this.domBoundary);
};
var _dec, _class;
import { Optional } from 'aurelia-dependency-injection';
import { customAttribute, Animator } from 'aurelia-templating';
import { DOM } from 'aurelia-pal';
import { injectAureliaHideStyleAtBoundary, aureliaHideClassName } from './aurelia-hide-style';
export let Show = (_dec = customAttribute('show'), _dec(_class = class Show {
static inject() {
return [DOM.Element, Animator, Optional.of(DOM.boundary, true)];
}
constructor(element, animator, domBoundary) {
this.element = element;
this.animator = animator;
this.domBoundary = domBoundary;
}
created() {
injectAureliaHideStyleAtBoundary(this.domBoundary);
}
valueChanged(newValue) {
Object['define' + 'Property'](target, property, desc);
desc = null;
}
return desc;
}
function _initializerWarningHelper(descriptor, context) {
throw new Error('Decorating class property failed. Please ensure that transform-class-properties is enabled.');
}
import { BoundViewFactory, ViewSlot, bindable, customAttribute, templateController } from 'aurelia-templating';
import { inject } from 'aurelia-dependency-injection';
import { IfCore } from './if-core';
export let If = (_dec = customAttribute('if'), _dec2 = inject(BoundViewFactory, ViewSlot), _dec3 = bindable({ primaryProperty: true }), _dec(_class = templateController(_class = _dec2(_class = (_class2 = class If extends IfCore {
constructor(...args) {
var _temp;
return _temp = super(...args), _initDefineProp(this, 'condition', _descriptor, this), _initDefineProp(this, 'swapOrder', _descriptor2, this), _initDefineProp(this, 'cache', _descriptor3, this), _temp;
}
bind(bindingContext, overrideContext) {
super.bind(bindingContext, overrideContext);
if (this.condition) {
this._show();
} else {
this._hide();
}
}
conditionChanged(newValue) {
var _dec, _class, _dec2, _class2;
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
import { inject } from 'aurelia-dependency-injection';
import { CompositionEngine, useView, inlineView, customElement } from 'aurelia-templating';
import { RouteLoader, Router } from 'aurelia-router';
import { relativeToFile } from 'aurelia-path';
import { Origin } from 'aurelia-metadata';
import { RouterViewLocator } from './router-view';
var EmptyClass = (_dec = inlineView('<template></template>'), _dec(_class = function EmptyClass() {
}) || _class);
export var TemplatingRouteLoader = (_dec2 = inject(CompositionEngine), _dec2(_class2 = function (_RouteLoader) {
_inherits(TemplatingRouteLoader, _RouteLoader);
function TemplatingRouteLoader(compositionEngine) {
var _this = _possibleConstructorReturn(this, _RouteLoader.call(this));
_this.compositionEngine = compositionEngine;
return _this;
}
TemplatingRouteLoader.prototype.loadRoute = function loadRoute(router, config) {
var UxListItem = /** @class */ (function () {
function UxListItem() {
this.theme = null;
}
__decorate([
bindable
], UxListItem.prototype, "theme", void 0);
UxListItem = __decorate([
customElement('ux-list-item'),
inlineView(VIEW$1)
], UxListItem);
return UxListItem;
}());
var UxListItem = /** @class */ (function () {
function UxListItem() {
this.theme = null;
}
__decorate([
aureliaTemplating.bindable
], UxListItem.prototype, "theme", void 0);
UxListItem = __decorate([
aureliaTemplating.customElement('ux-list-item'),
aureliaTemplating.inlineView(VIEW$1)
], UxListItem);
return UxListItem;
}());
if (newValue != null && newValue.themeKey == null) {
newValue.themeKey = 'list';
}
this.styleEngine.applyTheme(newValue, this.element);
}
};
__decorate([
bindable
], UxList.prototype, "theme", void 0);
__decorate([
bindable
], UxList.prototype, "type", void 0);
UxList = __decorate([
inject(Element, StyleEngine),
customElement('ux-list'),
inlineView(VIEW)
], UxList);
var uxListItem = "<template class="\"ux-list-item\"" role="\"listitem\""> </template> ";
var VIEW$1 = /*#__PURE__*/Object.freeze({
__proto__: null,
'default': uxListItem
});
let UxListItem = class UxListItem {
constructor() {
this.theme = null;
}
};
__decorate([
bindable