ninja-keys
Advanced tools
Comparing version 1.0.0-beta.6 to 1.0.0-beta.7
export interface INinjaAction { | ||
id: string; | ||
title: string; | ||
hotkey?: string; | ||
handler?: Function; | ||
href?: string; | ||
icon?: string; | ||
parent?: string; | ||
keywords?: string; | ||
children?: string[]; | ||
section?: string; | ||
id: string; | ||
title: string; | ||
hotkey?: string; | ||
handler?: Function; | ||
href?: string; | ||
icon?: string; | ||
parent?: string; | ||
keywords?: string; | ||
children?: string[]; | ||
section?: string; | ||
} | ||
//# sourceMappingURL=ininja-action.d.ts.map | ||
//# sourceMappingURL=ininja-action.d.ts.map |
export {}; | ||
//# sourceMappingURL=ininja-action.js.map | ||
//# sourceMappingURL=ininja-action.js.map |
@@ -1,2 +0,2 @@ | ||
export declare const footerHtml: import('lit-html').TemplateResult<1>; | ||
//# sourceMappingURL=ninja-footer.d.ts.map | ||
export declare const footerHtml: import("lit-html").TemplateResult<1>; | ||
//# sourceMappingURL=ninja-footer.d.ts.map |
@@ -1,3 +0,3 @@ | ||
import {html} from 'lit'; | ||
export const footerHtml = html` <div class="modal-footer" slot="footer"> | ||
import { html } from 'lit'; | ||
export const footerHtml = html ` <div class="modal-footer" slot="footer"> | ||
<span class="help"> | ||
@@ -58,2 +58,2 @@ <svg | ||
</div>`; | ||
//# sourceMappingURL=ninja-footer.js.map | ||
//# sourceMappingURL=ninja-footer.js.map |
@@ -1,22 +0,22 @@ | ||
import {LitElement, TemplateResult} from 'lit'; | ||
import { LitElement, TemplateResult } from 'lit'; | ||
export declare class NinjaHeader extends LitElement { | ||
static styles: import('lit').CSSResult; | ||
placeholder: string; | ||
hideBreadcrumbs: boolean; | ||
breadcrumbHome: string; | ||
breadcrumbs: string[]; | ||
private _inputRef; | ||
render(): TemplateResult<1>; | ||
setSearch(value: string): void; | ||
focusSearch(): void; | ||
private _handleInput; | ||
private selectParent; | ||
firstUpdated(): void; | ||
_close(): void; | ||
static styles: import("lit").CSSResult; | ||
placeholder: string; | ||
hideBreadcrumbs: boolean; | ||
breadcrumbHome: string; | ||
breadcrumbs: string[]; | ||
private _inputRef; | ||
render(): TemplateResult<1>; | ||
setSearch(value: string): void; | ||
focusSearch(): void; | ||
private _handleInput; | ||
private selectParent; | ||
firstUpdated(): void; | ||
_close(): void; | ||
} | ||
declare global { | ||
interface HTMLElementTagNameMap { | ||
'ninja-header': NinjaHeader; | ||
} | ||
interface HTMLElementTagNameMap { | ||
'ninja-header': NinjaHeader; | ||
} | ||
} | ||
//# sourceMappingURL=ninja-header.d.ts.map | ||
//# sourceMappingURL=ninja-header.d.ts.map |
@@ -1,46 +0,33 @@ | ||
var __decorate = | ||
(this && this.__decorate) || | ||
function (decorators, target, key, desc) { | ||
var c = arguments.length, | ||
r = | ||
c < 3 | ||
? target | ||
: desc === null | ||
? (desc = Object.getOwnPropertyDescriptor(target, key)) | ||
: desc, | ||
d; | ||
if (typeof Reflect === 'object' && typeof Reflect.decorate === 'function') | ||
r = Reflect.decorate(decorators, target, key, desc); | ||
else | ||
for (var i = decorators.length - 1; i >= 0; i--) | ||
if ((d = decorators[i])) | ||
r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; | ||
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { | ||
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; | ||
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); | ||
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; | ||
return c > 3 && r && Object.defineProperty(target, key, r), r; | ||
}; | ||
import {LitElement, html, css} from 'lit'; | ||
import {customElement, property} from 'lit/decorators.js'; | ||
import {ref, createRef} from 'lit/directives/ref.js'; | ||
}; | ||
import { LitElement, html, css } from 'lit'; | ||
import { customElement, property } from 'lit/decorators.js'; | ||
import { ref, createRef } from 'lit/directives/ref.js'; | ||
let NinjaHeader = class NinjaHeader extends LitElement { | ||
constructor() { | ||
super(...arguments); | ||
this.placeholder = ''; | ||
this.hideBreadcrumbs = false; | ||
this.breadcrumbHome = 'Home'; | ||
this.breadcrumbs = []; | ||
this._inputRef = createRef(); | ||
} | ||
render() { | ||
let breadcrumbs = ''; | ||
if (!this.hideBreadcrumbs) { | ||
const itemTemplates = []; | ||
for (const breadcrumb of this.breadcrumbs) { | ||
itemTemplates.push(html`<button | ||
tabindex="-1" | ||
@click=${() => this.selectParent(breadcrumb)} | ||
class="breadcrumb" | ||
> | ||
${breadcrumb} | ||
</button>`); | ||
} | ||
breadcrumbs = html`<div class="breadcrumb-list"> | ||
constructor() { | ||
super(...arguments); | ||
this.placeholder = ''; | ||
this.hideBreadcrumbs = false; | ||
this.breadcrumbHome = 'Home'; | ||
this.breadcrumbs = []; | ||
this._inputRef = createRef(); | ||
} | ||
render() { | ||
let breadcrumbs = ''; | ||
if (!this.hideBreadcrumbs) { | ||
const itemTemplates = []; | ||
for (const breadcrumb of this.breadcrumbs) { | ||
itemTemplates.push(html `<button | ||
tabindex="-1" | ||
@click=${() => this.selectParent(breadcrumb)} | ||
class="breadcrumb" | ||
> | ||
${breadcrumb} | ||
</button>`); | ||
} | ||
breadcrumbs = html `<div class="breadcrumb-list"> | ||
<button | ||
@@ -55,4 +42,4 @@ tabindex="-1" | ||
</div>`; | ||
} | ||
return html` | ||
} | ||
return html ` | ||
${breadcrumbs} | ||
@@ -72,100 +59,94 @@ <div class="search-wrapper"> | ||
`; | ||
} | ||
setSearch(value) { | ||
if (this._inputRef.value) { | ||
this._inputRef.value.value = value; | ||
} | ||
} | ||
focusSearch() { | ||
requestAnimationFrame(() => this._inputRef.value.focus()); | ||
} | ||
_handleInput(event) { | ||
const input = event.target; | ||
this.dispatchEvent( | ||
new CustomEvent('change', { | ||
detail: {search: input.value}, | ||
bubbles: true, | ||
composed: true, | ||
}) | ||
); | ||
} | ||
selectParent(breadcrumb) { | ||
this.dispatchEvent( | ||
new CustomEvent('setParent', { | ||
detail: {parent: breadcrumb}, | ||
bubbles: true, | ||
composed: true, | ||
}) | ||
); | ||
} | ||
firstUpdated() { | ||
this.focusSearch(); | ||
} | ||
_close() { | ||
this.dispatchEvent( | ||
new CustomEvent('close', {bubbles: true, composed: true}) | ||
); | ||
} | ||
setSearch(value) { | ||
if (this._inputRef.value) { | ||
this._inputRef.value.value = value; | ||
} | ||
} | ||
focusSearch() { | ||
requestAnimationFrame(() => this._inputRef.value.focus()); | ||
} | ||
_handleInput(event) { | ||
const input = event.target; | ||
this.dispatchEvent(new CustomEvent('change', { | ||
detail: { search: input.value }, | ||
bubbles: true, | ||
composed: true, | ||
})); | ||
} | ||
selectParent(breadcrumb) { | ||
this.dispatchEvent(new CustomEvent('setParent', { | ||
detail: { parent: breadcrumb }, | ||
bubbles: true, | ||
composed: true, | ||
})); | ||
} | ||
firstUpdated() { | ||
this.focusSearch(); | ||
} | ||
_close() { | ||
this.dispatchEvent(new CustomEvent('close', { bubbles: true, composed: true })); | ||
} | ||
}; | ||
NinjaHeader.styles = css` | ||
:host { | ||
flex: 1; | ||
position: relative; | ||
} | ||
.search { | ||
padding: 1.25em; | ||
flex-grow: 1; | ||
flex-shrink: 0; | ||
margin: 0px; | ||
border: none; | ||
appearance: none; | ||
font-size: 1.125em; | ||
background: transparent; | ||
caret-color: var(--ninja-accent-color); | ||
color: var(--ninja-text-color); | ||
outline: none; | ||
} | ||
.breadcrumb-list { | ||
padding: 1em 4em 0 1em; | ||
display: flex; | ||
flex-direction: row; | ||
align-items: stretch; | ||
justify-content: flex-start; | ||
flex: initial; | ||
} | ||
NinjaHeader.styles = css ` | ||
:host { | ||
flex: 1; | ||
position: relative; | ||
} | ||
.search { | ||
padding: 1.25em; | ||
flex-grow: 1; | ||
flex-shrink: 0; | ||
margin: 0px; | ||
border: none; | ||
appearance: none; | ||
font-size: 1.125em; | ||
background: transparent; | ||
caret-color: var(--ninja-accent-color); | ||
color: var(--ninja-text-color); | ||
outline: none; | ||
} | ||
.breadcrumb-list { | ||
padding: 1em 4em 0 1em; | ||
display: flex; | ||
flex-direction: row; | ||
align-items: stretch; | ||
justify-content: flex-start; | ||
flex: initial; | ||
} | ||
.breadcrumb { | ||
background: var(--ninja-secondary-background-color); | ||
text-align: center; | ||
line-height: 1.2em; | ||
border-radius: var(--ninja-key-border-radius); | ||
border: 0; | ||
cursor: pointer; | ||
padding: 0.1em 0.5em; | ||
color: var(--ninja-secondary-text-color); | ||
margin-right: 0.5em; | ||
outline: none; | ||
} | ||
.breadcrumb { | ||
background: var(--ninja-secondary-background-color); | ||
text-align: center; | ||
line-height: 1.2em; | ||
border-radius: var(--ninja-key-border-radius); | ||
border: 0; | ||
cursor: pointer; | ||
padding: 0.1em 0.5em; | ||
color: var(--ninja-secondary-text-color); | ||
margin-right: 0.5em; | ||
outline: none; | ||
} | ||
.search-wrapper { | ||
display: flex; | ||
border-bottom: var(--ninja-separate-border); | ||
} | ||
`; | ||
__decorate([property()], NinjaHeader.prototype, 'placeholder', void 0); | ||
__decorate( | ||
[property({type: Boolean})], | ||
NinjaHeader.prototype, | ||
'hideBreadcrumbs', | ||
void 0 | ||
); | ||
__decorate([property()], NinjaHeader.prototype, 'breadcrumbHome', void 0); | ||
__decorate( | ||
[property({type: Array})], | ||
NinjaHeader.prototype, | ||
'breadcrumbs', | ||
void 0 | ||
); | ||
NinjaHeader = __decorate([customElement('ninja-header')], NinjaHeader); | ||
export {NinjaHeader}; | ||
//# sourceMappingURL=ninja-header.js.map | ||
.search-wrapper { | ||
display: flex; | ||
border-bottom: var(--ninja-separate-border); | ||
} | ||
`; | ||
__decorate([ | ||
property() | ||
], NinjaHeader.prototype, "placeholder", void 0); | ||
__decorate([ | ||
property({ type: Boolean }) | ||
], NinjaHeader.prototype, "hideBreadcrumbs", void 0); | ||
__decorate([ | ||
property() | ||
], NinjaHeader.prototype, "breadcrumbHome", void 0); | ||
__decorate([ | ||
property({ type: Array }) | ||
], NinjaHeader.prototype, "breadcrumbs", void 0); | ||
NinjaHeader = __decorate([ | ||
customElement('ninja-header') | ||
], NinjaHeader); | ||
export { NinjaHeader }; | ||
//# sourceMappingURL=ninja-header.js.map |
{ | ||
"name": "ninja-keys", | ||
"version": "1.0.0-beta.6", | ||
"version": "1.0.0-beta.7", | ||
"description": "Ninja Keys", | ||
@@ -8,22 +8,2 @@ "main": "dist/ninja-keys.js", | ||
"type": "module", | ||
"scripts": { | ||
"start": "npm run build && concurrently -k -r \"npm run serve\" \"npm run build:watch\"", | ||
"build": "tsc", | ||
"build:watch": "tsc --watch", | ||
"clean": "rimraf dist/", | ||
"lint": "npm run lint:lit-analyzer && npm run lint:eslint", | ||
"lint:eslint": "eslint 'src/**/*.ts'", | ||
"lint:lit-analyzer": "lit-analyzer", | ||
"format": "prettier \"**/*.{cjs,html,js,json,md,ts}\" --ignore-path ./.eslintignore --write", | ||
"analyze": "cem analyze --litelement --globs \"src/**/*.ts\"", | ||
"analyze:watch": "cem analyze --litelement --globs \"src/**/*.ts\" --watch", | ||
"serve": "wds --root-dir=. --node-resolve --watch", | ||
"demo": "tsc && rollup -c --file docs/ninja-keys.bundled.js && wds --root-dir=. --open=./docs/ --node-resolve --watch", | ||
"serve:prod": "MODE=prod npm run serve", | ||
"bundle": "npm run build && rollup -c --file dist/ninja-keys.bundled.js", | ||
"checksize": "rollup -c ; cat dist/ninja-keys.bundled.js | gzip -9 | wc -c ; rm dist/ninja-keys.bundled.js", | ||
"prepublish": "npm run build && npm run bundle", | ||
"publish": "clean-publish", | ||
"publish-test": " rimraf package && clean-publish --without-publish --temp-dir package" | ||
}, | ||
"keywords": [ | ||
@@ -49,10 +29,2 @@ "web-components", | ||
}, | ||
"clean-publish": { | ||
"files": [ | ||
"dev", | ||
"docs", | ||
"rollup.config.js", | ||
"web-dev-server.config.mjs" | ||
] | ||
}, | ||
"dependencies": { | ||
@@ -63,24 +35,7 @@ "@material/mwc-icon": "0.25.2", | ||
}, | ||
"devDependencies": { | ||
"@custom-elements-manifest/analyzer": "^0.5.3", | ||
"@rollup/plugin-node-resolve": "^13.0.4", | ||
"@rollup/plugin-replace": "^3.0.0", | ||
"@typescript-eslint/eslint-plugin": "^4.3.0", | ||
"@typescript-eslint/parser": "^4.30.0", | ||
"@web/dev-server": "0.1.25", | ||
"@web/dev-server-rollup": "^0.3.9", | ||
"@webcomponents/webcomponentsjs": "^2.6.0", | ||
"clean-publish": "3.4.2", | ||
"concurrently": "6.3.0", | ||
"eslint": "^7.32.0", | ||
"lit-analyzer": "^1.1.10", | ||
"prettier": "^2.3.2", | ||
"rimraf": "^3.0.2", | ||
"rollup": "^2.28.2", | ||
"rollup-plugin-minify-html-literals": "1.2.6", | ||
"rollup-plugin-summary": "^1.2.3", | ||
"rollup-plugin-terser": "^7.0.2", | ||
"typescript": "^4.3.5" | ||
}, | ||
"customElements": "custom-elements.json" | ||
"customElements": "custom-elements.json", | ||
"scripts": { | ||
"prepublish": "npm run build && npm run bundle", | ||
"publish": "clean-publish" | ||
} | ||
} |
Sorry, the diff of this file is too big to display
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
0
176271
44
2903