@lookwe/lui
Version:
Lookwe UI web components
151 lines (148 loc) • 15.6 kB
JavaScript
import { __classPrivateFieldGet, __classPrivateFieldSet, __runInitializers, __esDecorate, __setFunctionName, __classPrivateFieldIn } from 'tslib';
import { html, nothing } from 'lit';
import { property, state, query } from 'lit/decorators.js';
import { classMap } from 'lit/directives/class-map.js';
import { SlotController } from '@lookwe/lit-controllers/slot';
import { mixinDelegatesFocus, getFocusElement } from '@lookwe/lit-mixins/delegate-focus';
import { mixinElementInternals } from '@lookwe/lit-mixins/element-internals';
import { mixinFormAssociated, getFormValue } from '@lookwe/lit-mixins/form-associated';
import { mixinPopoverTarget } from '@lookwe/lit-mixins/popover-target';
import { addActivationListener } from '../../../internal/event/form-label-activation.js';
import { LuiElement } from '../../../internal/lui-element.js';
import { FormSubmitterController } from './controller/form-submitter-controller.js';
const BaseClass = mixinPopoverTarget(mixinDelegatesFocus(mixinFormAssociated(mixinElementInternals(LuiElement))));
let Button = (() => {
var _Button_instances, _a, _Button_hasLabel_accessor_storage, _Button_hasLabel_get, _Button_hasLabel_set, _Button_buttonElement_accessor_storage, _Button_buttonElement_get, _Button_buttonElement_set, _Button_canClick_get, _Button_slotController, _Button__formSubmitterController, _Button_classButton, _Button_renderButton, _Button_renderLink, _Button_renderContent, _Button_href_accessor_storage, _Button_download_accessor_storage, _Button_target_accessor_storage, _Button_trailingIcon_accessor_storage, _Button_type_accessor_storage, _Button_value_accessor_storage, _Button_size_accessor_storage;
let _classSuper = BaseClass;
let _href_decorators;
let _href_initializers = [];
let _href_extraInitializers = [];
let _download_decorators;
let _download_initializers = [];
let _download_extraInitializers = [];
let _target_decorators;
let _target_initializers = [];
let _target_extraInitializers = [];
let _trailingIcon_decorators;
let _trailingIcon_initializers = [];
let _trailingIcon_extraInitializers = [];
let _type_decorators;
let _type_initializers = [];
let _type_extraInitializers = [];
let _value_decorators;
let _value_initializers = [];
let _value_extraInitializers = [];
let _size_decorators;
let _size_initializers = [];
let _size_extraInitializers = [];
let _private_hasLabel_decorators;
let _private_hasLabel_initializers = [];
let _private_hasLabel_extraInitializers = [];
let _private_hasLabel_descriptor;
let _private_buttonElement_decorators;
let _private_buttonElement_initializers = [];
let _private_buttonElement_extraInitializers = [];
let _private_buttonElement_descriptor;
return _a = class Button extends _classSuper {
/**
* The URL that the link button points to.
*/
get href() { return __classPrivateFieldGet(this, _Button_href_accessor_storage, "f"); }
set href(value) { __classPrivateFieldSet(this, _Button_href_accessor_storage, value, "f"); }
/**
* Tells the browser to download the linked file as this filename. Only used when `href` is set.
*/
get download() { return __classPrivateFieldGet(this, _Button_download_accessor_storage, "f"); }
set download(value) { __classPrivateFieldSet(this, _Button_download_accessor_storage, value, "f"); }
/**
* Where to display the linked `href` URL for a link button. Common options include `_blank` to open in a new tab.
*/
get target() { return __classPrivateFieldGet(this, _Button_target_accessor_storage, "f"); }
set target(value) { __classPrivateFieldSet(this, _Button_target_accessor_storage, value, "f"); }
/**
* Whether to render the icon at the inline end of the label rather than the inline start.
*/
get trailingIcon() { return __classPrivateFieldGet(this, _Button_trailingIcon_accessor_storage, "f"); }
set trailingIcon(value) { __classPrivateFieldSet(this, _Button_trailingIcon_accessor_storage, value, "f"); }
/**
* The default behavior of the button. May be "button", "reset", or "submit"
* (default=button).
*/
get type() { return __classPrivateFieldGet(this, _Button_type_accessor_storage, "f"); }
set type(value) { __classPrivateFieldSet(this, _Button_type_accessor_storage, value, "f"); }
/**
* The value added to a form with the button's name when the button submits a form.
*/
get value() { return __classPrivateFieldGet(this, _Button_value_accessor_storage, "f"); }
set value(value) { __classPrivateFieldSet(this, _Button_value_accessor_storage, value, "f"); }
/**
* Button size.
*/
get size() { return __classPrivateFieldGet(this, _Button_size_accessor_storage, "f"); }
set size(value) { __classPrivateFieldSet(this, _Button_size_accessor_storage, value, "f"); }
constructor() {
super();
_Button_instances.add(this);
_Button_href_accessor_storage.set(this, __runInitializers(this, _href_initializers, ''));
_Button_download_accessor_storage.set(this, (__runInitializers(this, _href_extraInitializers), __runInitializers(this, _download_initializers, false)));
_Button_target_accessor_storage.set(this, (__runInitializers(this, _download_extraInitializers), __runInitializers(this, _target_initializers, '')));
_Button_trailingIcon_accessor_storage.set(this, (__runInitializers(this, _target_extraInitializers), __runInitializers(this, _trailingIcon_initializers, false)));
_Button_type_accessor_storage.set(this, (__runInitializers(this, _trailingIcon_extraInitializers), __runInitializers(this, _type_initializers, 'button')));
_Button_value_accessor_storage.set(this, (__runInitializers(this, _type_extraInitializers), __runInitializers(this, _value_initializers, '')));
_Button_size_accessor_storage.set(this, (__runInitializers(this, _value_extraInitializers), __runInitializers(this, _size_initializers, 'medium')));
_Button_hasLabel_accessor_storage.set(this, (__runInitializers(this, _size_extraInitializers), __runInitializers(this, _private_hasLabel_initializers, false)));
_Button_buttonElement_accessor_storage.set(this, (__runInitializers(this, _private_hasLabel_extraInitializers), __runInitializers(this, _private_buttonElement_initializers, void 0)));
_Button_slotController.set(this, (__runInitializers(this, _private_buttonElement_extraInitializers), new SlotController(this)));
_Button__formSubmitterController.set(this, new FormSubmitterController(this));
addActivationListener(this, () => __classPrivateFieldGet(this, _Button_instances, "a", _Button_buttonElement_get), {
check: (event) => {
if (!__classPrivateFieldGet(this, _Button_instances, "a", _Button_canClick_get)) {
event.stopImmediatePropagation();
event.preventDefault();
}
},
});
}
render() {
return this.href ? __classPrivateFieldGet(this, _Button_instances, "m", _Button_renderLink).call(this) : __classPrivateFieldGet(this, _Button_instances, "m", _Button_renderButton).call(this);
}
[(_Button_hasLabel_accessor_storage = new WeakMap(), _Button_buttonElement_accessor_storage = new WeakMap(), _Button_slotController = new WeakMap(), _Button__formSubmitterController = new WeakMap(), _Button_instances = new WeakSet(), _Button_href_accessor_storage = new WeakMap(), _Button_download_accessor_storage = new WeakMap(), _Button_target_accessor_storage = new WeakMap(), _Button_trailingIcon_accessor_storage = new WeakMap(), _Button_type_accessor_storage = new WeakMap(), _Button_value_accessor_storage = new WeakMap(), _Button_size_accessor_storage = new WeakMap(), _Button_hasLabel_get = function _Button_hasLabel_get() { return _private_hasLabel_descriptor.get.call(this); }, _Button_hasLabel_set = function _Button_hasLabel_set(value) { return _private_hasLabel_descriptor.set.call(this, value); }, _Button_buttonElement_get = function _Button_buttonElement_get() { return _private_buttonElement_descriptor.get.call(this); }, _Button_buttonElement_set = function _Button_buttonElement_set(value) { return _private_buttonElement_descriptor.set.call(this, value); }, _Button_canClick_get = function _Button_canClick_get() {
return !this.disabled;
}, _Button_classButton = function _Button_classButton() {
return {
'button': true,
[`size-${this.size}`]: true,
'disabled': this.disabled,
};
}, _Button_renderButton = function _Button_renderButton() {
return html `<button part="base" class="${classMap(__classPrivateFieldGet(this, _Button_instances, "m", _Button_classButton).call(this))}" type="${this.type}" ?disabled="${!__classPrivateFieldGet(this, _Button_instances, "a", _Button_canClick_get)}" .popoverTargetElement="${this.popoverTargetElement}" .popoverTargetAction="${this.popoverTargetAction}">${__classPrivateFieldGet(this, _Button_instances, "m", _Button_renderContent).call(this)}</button>`;
}, _Button_renderLink = function _Button_renderLink() {
return html `<a part="base" class="${classMap(__classPrivateFieldGet(this, _Button_instances, "m", _Button_classButton).call(this))}" href="${this.href}" target="${this.target || nothing}" tabindex="${__classPrivateFieldGet(this, _Button_instances, "a", _Button_canClick_get) ? 0 : -1}" ?download="${this.download}">${__classPrivateFieldGet(this, _Button_instances, "m", _Button_renderContent).call(this)}</a>`;
}, _Button_renderContent = function _Button_renderContent() {
const slotIcon = html `<slot name="icon"></slot>`;
return html `${this.trailingIcon ? nothing : slotIcon} <span class="label" ?hidden="${!__classPrivateFieldGet(this, _Button_slotController, "f").hasAssignedNodes()}"><slot></slot></span>${this.trailingIcon ? slotIcon : nothing}`;
}, _href_decorators = [property()], _download_decorators = [property({ type: Boolean })], _target_decorators = [property()], _trailingIcon_decorators = [property({ type: Boolean, attribute: 'trailing-icon', reflect: true })], _type_decorators = [property()], _value_decorators = [property({ reflect: true, useDefault: true })], _size_decorators = [property()], _private_hasLabel_decorators = [state()], _private_buttonElement_decorators = [query('.button')], getFormValue)]() {
return null;
}
formResetCallback() { }
formStateRestoreCallback(_state) { }
[getFocusElement]() {
return __classPrivateFieldGet(this, _Button_instances, "a", _Button_buttonElement_get);
}
},
(() => {
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
__esDecorate(_a, null, _href_decorators, { kind: "accessor", name: "href", static: false, private: false, access: { has: obj => "href" in obj, get: obj => obj.href, set: (obj, value) => { obj.href = value; } }, metadata: _metadata }, _href_initializers, _href_extraInitializers);
__esDecorate(_a, null, _download_decorators, { kind: "accessor", name: "download", static: false, private: false, access: { has: obj => "download" in obj, get: obj => obj.download, set: (obj, value) => { obj.download = value; } }, metadata: _metadata }, _download_initializers, _download_extraInitializers);
__esDecorate(_a, null, _target_decorators, { kind: "accessor", name: "target", static: false, private: false, access: { has: obj => "target" in obj, get: obj => obj.target, set: (obj, value) => { obj.target = value; } }, metadata: _metadata }, _target_initializers, _target_extraInitializers);
__esDecorate(_a, null, _trailingIcon_decorators, { kind: "accessor", name: "trailingIcon", static: false, private: false, access: { has: obj => "trailingIcon" in obj, get: obj => obj.trailingIcon, set: (obj, value) => { obj.trailingIcon = value; } }, metadata: _metadata }, _trailingIcon_initializers, _trailingIcon_extraInitializers);
__esDecorate(_a, null, _type_decorators, { kind: "accessor", name: "type", static: false, private: false, access: { has: obj => "type" in obj, get: obj => obj.type, set: (obj, value) => { obj.type = value; } }, metadata: _metadata }, _type_initializers, _type_extraInitializers);
__esDecorate(_a, null, _value_decorators, { kind: "accessor", name: "value", static: false, private: false, access: { has: obj => "value" in obj, get: obj => obj.value, set: (obj, value) => { obj.value = value; } }, metadata: _metadata }, _value_initializers, _value_extraInitializers);
__esDecorate(_a, null, _size_decorators, { kind: "accessor", name: "size", static: false, private: false, access: { has: obj => "size" in obj, get: obj => obj.size, set: (obj, value) => { obj.size = value; } }, metadata: _metadata }, _size_initializers, _size_extraInitializers);
__esDecorate(_a, _private_hasLabel_descriptor = { get: __setFunctionName(function () { return __classPrivateFieldGet(this, _Button_hasLabel_accessor_storage, "f"); }, "#hasLabel", "get"), set: __setFunctionName(function (value) { __classPrivateFieldSet(this, _Button_hasLabel_accessor_storage, value, "f"); }, "#hasLabel", "set") }, _private_hasLabel_decorators, { kind: "accessor", name: "#hasLabel", static: false, private: true, access: { has: obj => __classPrivateFieldIn(_Button_instances, obj), get: obj => __classPrivateFieldGet(obj, _Button_instances, "a", _Button_hasLabel_get), set: (obj, value) => { __classPrivateFieldSet(obj, _Button_instances, value, "a", _Button_hasLabel_set); } }, metadata: _metadata }, _private_hasLabel_initializers, _private_hasLabel_extraInitializers);
__esDecorate(_a, _private_buttonElement_descriptor = { get: __setFunctionName(function () { return __classPrivateFieldGet(this, _Button_buttonElement_accessor_storage, "f"); }, "#buttonElement", "get"), set: __setFunctionName(function (value) { __classPrivateFieldSet(this, _Button_buttonElement_accessor_storage, value, "f"); }, "#buttonElement", "set") }, _private_buttonElement_decorators, { kind: "accessor", name: "#buttonElement", static: false, private: true, access: { has: obj => __classPrivateFieldIn(_Button_instances, obj), get: obj => __classPrivateFieldGet(obj, _Button_instances, "a", _Button_buttonElement_get), set: (obj, value) => { __classPrivateFieldSet(obj, _Button_instances, value, "a", _Button_buttonElement_set); } }, metadata: _metadata }, _private_buttonElement_initializers, _private_buttonElement_extraInitializers);
if (_metadata) Object.defineProperty(_a, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
})(),
_a;
})();
export { Button };