@kelvininc/ui-components
Version:
Kelvin UI Components
38 lines (34 loc) • 4.06 kB
JavaScript
import { p as proxyCustomElement, H, h, e as Host } from './p-D6GMjtmE.js';
import { b as EIconName } from './p-DBphUUgi.js';
import { d as defineCustomElement$1 } from './p-B41PGLQm.js';
const selectShortcutsLabelCss = "@property --rotation{syntax:\"<angle>\";initial-value:0deg;inherits:false}@keyframes rotate-border{to{--rotation:360deg}}.shortcuts{background:var(--kv-neutral-6, #3f3f3f);display:flex;justify-content:space-between;padding:var(--kv-spacing-2x, 8px) var(--kv-spacing-4x, 16px);user-select:none}.left-items{display:flex;gap:var(--kv-spacing-5x, 20px)}.group{display:flex;align-items:center;gap:var(--kv-spacing-2x, 8px)}.icons{display:flex;align-items:center;gap:var(--kv-spacing, 4px)}.label{color:var(--kv-neutral-4, #bebebe);font-family:var(--kv-primary-font, \"proxima-nova\", sans-serif, \"Arial\");font-size:10px;font-weight:400;font-stretch:normal;font-style:normal;line-height:15px;letter-spacing:normal;text-transform:none}.icon{border-radius:4px;background:var(--kv-neutral-5, #707070);color:var(--kv-neutral-2, #e5e5e5);font-family:var(--kv-primary-font, \"proxima-nova\", sans-serif, \"Arial\");font-size:10px;font-weight:400;font-stretch:normal;font-style:normal;line-height:15px;letter-spacing:normal;text-transform:none;text-align:center;display:flex;align-items:center;justify-content:center;height:20px;width:20px}.icon kv-icon{--icon-color:var(--kv-neutral-2, #e5e5e5)}";
const KvSelectShortcutsLabel = /*@__PURE__*/ proxyCustomElement(class KvSelectShortcutsLabel extends H {
constructor() {
super();
this.__registerHost();
}
render() {
return (h(Host, { key: 'e36d350cd810ca03e7724116c3e7d01ec8a19357' }, h("div", { key: '348b483e72ac4d2ceb7c02bfbbc6714aeb395ccc', class: "shortcuts" }, h("div", { key: '1caeede75acbf0c6564e3b52eb19b333379ccb83', class: "left-items" }, h("div", { key: 'c3fcf666e3a26f51c4bfb34d3f2f6ad9dc46e329', class: "group" }, h("div", { key: '0d33cf2554d01ba268cd35715807dc8982e167d1', class: "icons" }, h("div", { key: '88df5afb3ea0f7dd5f935a3320641524ea95feda', class: "icon" }, h("kv-icon", { key: '9dae53a27491f20362d3d7a24c9fc4c4efe8199e', name: EIconName.ArrowDropUp })), h("div", { key: '3523fa439632ece0338694136fe4515a42f421eb', class: "icon" }, h("kv-icon", { key: 'f52c7b2a4341dc9e67d004a3c89afd96505851c9', name: EIconName.ArrowDropDown }))), h("div", { key: '7edffbf71318de7591e2e7de58ae0c2a5559a371', class: "label" }, "To navigate")), h("div", { key: 'b13f0829ce4a0936b9f402cc6db93603b0785f8b', class: "group" }, h("div", { key: 'd4d932949911edaa4f070f352244ce23c7b69690', class: "icons" }, h("div", { key: '5a67e98e1df5ef09824af603ba5ebec5b4814b67', class: "icon" }, h("kv-icon", { key: 'a210f13c95c0cc9d2eaf25a11bcda7c1e9d23b00', name: EIconName.Undo }))), h("div", { key: '3f2667fe4d14c619da577e46796cf0af89ec9314', class: "label" }, "To select")), h("div", { key: '1e9c5329e790af7c5454b827d541650157665161', class: "group" }, h("div", { key: 'beaa1308614e495ac789d2f9ba75c0bfe217426a', class: "icons" }, h("div", { key: 'a085081bdd763a62283d07a9d3ea22fef782576b', class: "icon" }, "esc")), h("div", { key: 'd5baa2c90ba8156081c09d7693a2e9ce47215612', class: "label" }, "To dismiss"))), h("slot", { key: 'dc5bee03793b746282dab1c0445f041aa43eba67', name: "right-items" }))));
}
static get style() { return selectShortcutsLabelCss; }
}, [4, "kv-select-shortcuts-label"]);
function defineCustomElement() {
if (typeof customElements === "undefined") {
return;
}
const components = ["kv-select-shortcuts-label", "kv-icon"];
components.forEach(tagName => { switch (tagName) {
case "kv-select-shortcuts-label":
if (!customElements.get(tagName)) {
customElements.define(tagName, KvSelectShortcutsLabel);
}
break;
case "kv-icon":
if (!customElements.get(tagName)) {
defineCustomElement$1();
}
break;
} });
}
defineCustomElement();
export { KvSelectShortcutsLabel as K, defineCustomElement as d };