react-dev-inspector
Advanced tools
Comparing version 2.1.0-beta.4 to 2.1.0-beta.5
@@ -8,5 +8,4 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { | ||
import { html, css, LitElement } from 'lit'; | ||
import { customElement } from 'lit/decorators.js'; | ||
import { ref, createRef } from 'lit/directives/ref.js'; | ||
import { registerElement, getElementDimensions, getBoundingBox, } from './utils'; | ||
import { customElement, registerElement, getElementDimensions, getBoundingBox, } from './utils'; | ||
import { InspectorOverlayRect, } from './OverlayRect'; | ||
@@ -13,0 +12,0 @@ import { InspectorOverlayTip, } from './OverlayTip'; |
@@ -11,4 +11,5 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { | ||
import { html, css, LitElement } from 'lit'; | ||
import { customElement, property } from 'lit/decorators.js'; | ||
import { property } from 'lit/decorators.js'; | ||
import { styleMap } from 'lit/directives/style-map.js'; | ||
import { customElement, } from './utils'; | ||
let InspectorOverlayRect = class InspectorOverlayRect extends LitElement { | ||
@@ -15,0 +16,0 @@ constructor() { |
@@ -12,5 +12,5 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { | ||
import { html, css, LitElement, } from 'lit'; | ||
import { customElement, property, state } from 'lit/decorators.js'; | ||
import { property, state } from 'lit/decorators.js'; | ||
import { styleMap } from 'lit/directives/style-map.js'; | ||
import { getBoundingBox, } from './utils'; | ||
import { customElement, getBoundingBox, } from './utils'; | ||
let InspectorOverlayTip = InspectorOverlayTip_1 = class InspectorOverlayTip extends LitElement { | ||
@@ -17,0 +17,0 @@ constructor() { |
import type { Box, BoxSizing } from './types'; | ||
/** | ||
* Allow for custom element classes with private constructors | ||
*/ | ||
type CustomElementClass = Omit<typeof HTMLElement, 'new'>; | ||
interface Constructor<T> { | ||
new (...args: any[]): T; | ||
} | ||
type CustomElementDecorator = (target: CustomElementClass, context?: ClassDecoratorContext<Constructor<HTMLElement>>) => void; | ||
/** | ||
* Class decorator factory that defines the decorated class as a custom element. | ||
* It's safe to re-register the same tag name multiple times (will not override or throw error). | ||
* | ||
* ```js | ||
* @customElement('my-element') | ||
* class MyElement extends LitElement { | ||
* render() { | ||
* return html``; | ||
* } | ||
* } | ||
* ``` | ||
* @category Decorator | ||
* @param tagName The tag name of the custom element to define. | ||
*/ | ||
export declare const customElement: (tagName: string) => CustomElementDecorator; | ||
export declare const registerElement: (tagName: string, elementClass: CustomElementConstructor) => void; | ||
export declare function getBoundingBox(element: HTMLElement | any): Box; | ||
export declare function getElementDimensions(element: HTMLElement | any): BoxSizing; | ||
export {}; |
@@ -0,1 +1,26 @@ | ||
/** | ||
* Class decorator factory that defines the decorated class as a custom element. | ||
* It's safe to re-register the same tag name multiple times (will not override or throw error). | ||
* | ||
* ```js | ||
* @customElement('my-element') | ||
* class MyElement extends LitElement { | ||
* render() { | ||
* return html``; | ||
* } | ||
* } | ||
* ``` | ||
* @category Decorator | ||
* @param tagName The tag name of the custom element to define. | ||
*/ | ||
export const customElement = (tagName) => (classOrTarget, context) => { | ||
if (context !== undefined) { | ||
context.addInitializer(() => { | ||
registerElement(tagName, classOrTarget); | ||
}); | ||
} | ||
else { | ||
registerElement(tagName, classOrTarget); | ||
} | ||
}; | ||
// useful for tree-shaking | ||
@@ -2,0 +27,0 @@ export const registerElement = (tagName, elementClass) => { |
@@ -31,5 +31,6 @@ export interface CodeInfo { | ||
* An Agent need implement these functions: | ||
* - setup event listener to collect user interaction operation (like Pointer Down/Up/Move / Click etc.) | ||
* - setup event listener to collect user interaction operation (like Pointer Down/Up/Over / Click etc.) | ||
* and its target element (like DOM, Three.js etc.) | ||
* - collect inspection info from its element (like name, code source position etc.) | ||
* - show/hide indicator UI on element (like highlight, show name or code position etc.) | ||
* - show/hide indicator UI on element (like highlight element, show tooltip for name or code position etc.) | ||
*/ | ||
@@ -36,0 +37,0 @@ export interface InspectAgent<Element> { |
@@ -11,3 +11,2 @@ "use strict"; | ||
const lit_1 = require("lit"); | ||
const decorators_js_1 = require("lit/decorators.js"); | ||
const ref_js_1 = require("lit/directives/ref.js"); | ||
@@ -84,3 +83,3 @@ const utils_1 = require("./utils"); | ||
exports.InspectorOverlay = InspectorOverlay = __decorate([ | ||
(0, decorators_js_1.customElement)('inspector-overlay') | ||
(0, utils_1.customElement)('inspector-overlay') | ||
], InspectorOverlay); | ||
@@ -87,0 +86,0 @@ class Overlay { |
@@ -16,2 +16,3 @@ "use strict"; | ||
const style_map_js_1 = require("lit/directives/style-map.js"); | ||
const utils_1 = require("./utils"); | ||
let InspectorOverlayRect = class InspectorOverlayRect extends lit_1.LitElement { | ||
@@ -149,3 +150,3 @@ constructor() { | ||
exports.InspectorOverlayRect = InspectorOverlayRect = __decorate([ | ||
(0, decorators_js_1.customElement)('inspector-overlay-rect') | ||
(0, utils_1.customElement)('inspector-overlay-rect') | ||
], InspectorOverlayRect); |
@@ -215,3 +215,3 @@ "use strict"; | ||
exports.InspectorOverlayTip = InspectorOverlayTip = InspectorOverlayTip_1 = __decorate([ | ||
(0, decorators_js_1.customElement)('inspector-overlay-tip') | ||
(0, utils_1.customElement)('inspector-overlay-tip') | ||
], InspectorOverlayTip); | ||
@@ -218,0 +218,0 @@ const restraintTipPosition = ({ elementBox, spaceBox, tipSize }) => { |
import type { Box, BoxSizing } from './types'; | ||
/** | ||
* Allow for custom element classes with private constructors | ||
*/ | ||
type CustomElementClass = Omit<typeof HTMLElement, 'new'>; | ||
interface Constructor<T> { | ||
new (...args: any[]): T; | ||
} | ||
type CustomElementDecorator = (target: CustomElementClass, context?: ClassDecoratorContext<Constructor<HTMLElement>>) => void; | ||
/** | ||
* Class decorator factory that defines the decorated class as a custom element. | ||
* It's safe to re-register the same tag name multiple times (will not override or throw error). | ||
* | ||
* ```js | ||
* @customElement('my-element') | ||
* class MyElement extends LitElement { | ||
* render() { | ||
* return html``; | ||
* } | ||
* } | ||
* ``` | ||
* @category Decorator | ||
* @param tagName The tag name of the custom element to define. | ||
*/ | ||
export declare const customElement: (tagName: string) => CustomElementDecorator; | ||
export declare const registerElement: (tagName: string, elementClass: CustomElementConstructor) => void; | ||
export declare function getBoundingBox(element: HTMLElement | any): Box; | ||
export declare function getElementDimensions(element: HTMLElement | any): BoxSizing; | ||
export {}; |
"use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.getElementDimensions = exports.getBoundingBox = exports.registerElement = void 0; | ||
exports.getElementDimensions = exports.getBoundingBox = exports.registerElement = exports.customElement = void 0; | ||
/** | ||
* Class decorator factory that defines the decorated class as a custom element. | ||
* It's safe to re-register the same tag name multiple times (will not override or throw error). | ||
* | ||
* ```js | ||
* @customElement('my-element') | ||
* class MyElement extends LitElement { | ||
* render() { | ||
* return html``; | ||
* } | ||
* } | ||
* ``` | ||
* @category Decorator | ||
* @param tagName The tag name of the custom element to define. | ||
*/ | ||
const customElement = (tagName) => (classOrTarget, context) => { | ||
if (context !== undefined) { | ||
context.addInitializer(() => { | ||
(0, exports.registerElement)(tagName, classOrTarget); | ||
}); | ||
} | ||
else { | ||
(0, exports.registerElement)(tagName, classOrTarget); | ||
} | ||
}; | ||
exports.customElement = customElement; | ||
// useful for tree-shaking | ||
@@ -5,0 +31,0 @@ const registerElement = (tagName, elementClass) => { |
@@ -31,5 +31,6 @@ export interface CodeInfo { | ||
* An Agent need implement these functions: | ||
* - setup event listener to collect user interaction operation (like Pointer Down/Up/Move / Click etc.) | ||
* - setup event listener to collect user interaction operation (like Pointer Down/Up/Over / Click etc.) | ||
* and its target element (like DOM, Three.js etc.) | ||
* - collect inspection info from its element (like name, code source position etc.) | ||
* - show/hide indicator UI on element (like highlight, show name or code position etc.) | ||
* - show/hide indicator UI on element (like highlight element, show tooltip for name or code position etc.) | ||
*/ | ||
@@ -36,0 +37,0 @@ export interface InspectAgent<Element> { |
{ | ||
"name": "react-dev-inspector", | ||
"version": "2.1.0-beta.4", | ||
"version": "2.1.0-beta.5", | ||
"sideEffects": false, | ||
@@ -54,7 +54,7 @@ "description": "dev-tool for inspect react components and jump to local IDE for component code.", | ||
"react": ">=16.14.0", | ||
"@react-dev-inspector/middleware": "^2.1.0-beta.4", | ||
"@react-dev-inspector/babel-plugin": "^2.1.0-beta.4", | ||
"@react-dev-inspector/umi3-plugin": "^2.1.0-beta.4", | ||
"@react-dev-inspector/umi4-plugin": "^2.1.0-beta.4", | ||
"@react-dev-inspector/vite-plugin": "^2.1.0-beta.4" | ||
"@react-dev-inspector/babel-plugin": "^2.1.0-beta.5", | ||
"@react-dev-inspector/middleware": "^2.1.0-beta.5", | ||
"@react-dev-inspector/umi4-plugin": "^2.1.0-beta.5", | ||
"@react-dev-inspector/vite-plugin": "^2.1.0-beta.5", | ||
"@react-dev-inspector/umi3-plugin": "^2.1.0-beta.5" | ||
}, | ||
@@ -61,0 +61,0 @@ "peerDependenciesMeta": { |
@@ -6,2 +6,49 @@ import type { | ||
/** | ||
* Allow for custom element classes with private constructors | ||
*/ | ||
type CustomElementClass = Omit<typeof HTMLElement, 'new'> | ||
interface Constructor<T> { new (...args: any[]): T } | ||
type CustomElementDecorator = ( | ||
target: CustomElementClass, | ||
context?: ClassDecoratorContext<Constructor<HTMLElement>> | ||
) => void | ||
/** | ||
* Class decorator factory that defines the decorated class as a custom element. | ||
* It's safe to re-register the same tag name multiple times (will not override or throw error). | ||
* | ||
* ```js | ||
* @customElement('my-element') | ||
* class MyElement extends LitElement { | ||
* render() { | ||
* return html``; | ||
* } | ||
* } | ||
* ``` | ||
* @category Decorator | ||
* @param tagName The tag name of the custom element to define. | ||
*/ | ||
export const customElement = (tagName: string): CustomElementDecorator => | ||
( | ||
classOrTarget: CustomElementClass | Constructor<HTMLElement>, | ||
context?: ClassDecoratorContext<Constructor<HTMLElement>>, | ||
) => { | ||
if (context !== undefined) { | ||
context.addInitializer(() => { | ||
registerElement( | ||
tagName, | ||
classOrTarget as CustomElementConstructor, | ||
) | ||
}) | ||
} | ||
else { | ||
registerElement(tagName, classOrTarget as CustomElementConstructor) | ||
} | ||
} | ||
// useful for tree-shaking | ||
@@ -8,0 +55,0 @@ export const registerElement = (tagName: string, elementClass: CustomElementConstructor) => { |
@@ -35,5 +35,6 @@ | ||
* An Agent need implement these functions: | ||
* - setup event listener to collect user interaction operation (like Pointer Down/Up/Move / Click etc.) | ||
* - setup event listener to collect user interaction operation (like Pointer Down/Up/Over / Click etc.) | ||
* and its target element (like DOM, Three.js etc.) | ||
* - collect inspection info from its element (like name, code source position etc.) | ||
* - show/hide indicator UI on element (like highlight, show name or code position etc.) | ||
* - show/hide indicator UI on element (like highlight element, show tooltip for name or code position etc.) | ||
*/ | ||
@@ -40,0 +41,0 @@ export interface InspectAgent<Element> { |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
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
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
272938
7659