diff --git a/src/index.ts b/src/index.ts index 50d34a1..33d50ff 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,64 +1,62 @@ -import { createElementType } from "./element"; -import { - normalizePropDefs, - ComponentType as uComponentType, - ConstructableComponent as uConstructableComponent, - FunctionComponent as uFunctionComponent, - ComponentOptions as uComponentOptions, - ICustomElement as uICustomElement, - PropsDefinitionInput as uPropsDefinitionInput, - PropDefinition as uPropDefinition -} from "./utils"; - -export type ComponentOptions = uComponentOptions; -export type ComponentType = uComponentType; -export type ConstructableComponent = uConstructableComponent; -export type FunctionComponent = uFunctionComponent; -export type PropsDefinitionInput = uPropsDefinitionInput; -export type ICustomElement = uICustomElement; -export type RegisterOptions = { - BaseElement?: typeof HTMLElement; - extension?: { extends: string }; - customElements?: CustomElementRegistry; -}; -export type PropDefinition = uPropDefinition; - -export function register( - tag: string, - props = {} as PropsDefinitionInput, - options: RegisterOptions = {} -) { - const { - BaseElement = HTMLElement, - extension, - customElements = window.customElements - } = options; - return (ComponentType: ComponentType) => { - if (!tag) throw new Error("tag is required to register a Component"); - let ElementType = customElements.get(tag); - if (ElementType) { - // Consider disabling this in a production mode - ElementType.prototype.Component = ComponentType; - return ElementType; - } - - ElementType = createElementType(BaseElement, normalizePropDefs(props)); - ElementType.prototype.Component = ComponentType; - ElementType.prototype.registeredTag = tag; - customElements.define(tag, ElementType, extension); - return ElementType; - }; -} - -export { - isConstructor, - isObject, - isFunction, - toAttribute, - toProperty, - reloadElement -} from "./utils"; -export { createMixin, compose } from "./mixin"; -export * from "./context"; -export { getCurrentElement, noShadowDOM } from "./element"; -export { hot } from "./hot"; +import { createElementType } from "./element"; +import { + normalizePropDefs, + ComponentType as uComponentType, + ConstructableComponent as uConstructableComponent, + FunctionComponent as uFunctionComponent, + ComponentOptions as uComponentOptions, + ICustomElement as uICustomElement, + PropsDefinitionInput as uPropsDefinitionInput, + PropDefinition as uPropDefinition +} from "./utils"; + +export type ComponentOptions = uComponentOptions; +export type ComponentType = uComponentType; +export type ConstructableComponent = uConstructableComponent; +export type FunctionComponent = uFunctionComponent; +export type PropsDefinitionInput = uPropsDefinitionInput; +export type ICustomElement = uICustomElement; +export type RegisterOptions = { + BaseElement?: typeof HTMLElement; + extension?: { extends: string }; + customElements?: CustomElementRegistry; +}; +export type PropDefinition = uPropDefinition; + +export function register( + tag: string, + props = {} as PropsDefinitionInput, + options: RegisterOptions = {} +) { + const { + BaseElement = HTMLElement, + extension, + customElements = window.customElements + } = options; + return (ComponentType: ComponentType) => { + if (!tag) throw new Error("tag is required to register a Component"); + let ElementType = customElements.get(tag); + if (ElementType) { + // Consider disabling this in a production mode + ElementType.prototype.Component = ComponentType; + return ElementType; + } + + ElementType = createElementType(BaseElement, normalizePropDefs(props)); + ElementType.prototype.Component = ComponentType; + ElementType.prototype.registeredTag = tag; + customElements.define(tag, ElementType, extension); + return ElementType; + }; +} + +export { + isConstructor, + isObject, + isFunction, + reloadElement +} from "./utils"; +export { createMixin, compose } from "./mixin"; +export * from "./context"; +export { getCurrentElement, noShadowDOM } from "./element"; +export { hot } from "./hot"; diff --git a/src/utils.ts b/src/utils.ts index e68021a..6bc275d 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -63,7 +63,7 @@ export function normalizePropDefs( memo[k] = !(isObject(v) && "value" in (v as object)) ? ({ value: v } as unknown as PropDefinition) : (v as PropDefinition); - memo[k].attribute || (memo[k].attribute = toAttribute(k as string)); + memo[k].attribute || (memo[k].attribute = (k as string)); memo[k].parse = "parse" in memo[k] ? memo[k].parse : typeof memo[k].value !== "string"; return memo; @@ -138,19 +138,6 @@ export function reflect( Promise.resolve().then(() => delete node.__updating[attribute]); } -export function toAttribute(propName: string) { - return propName - .replace(/\.?([A-Z]+)/g, (x, y) => "-" + y.toLowerCase()) - .replace("_", "-") - .replace(/^-/, ""); -} - -export function toProperty(attr: string) { - return attr - .toLowerCase() - .replace(/(-)([a-z])/g, (test) => test.toUpperCase().replace("-", "")); -} - export function isObject(obj: any) { return obj != null && (typeof obj === "object" || typeof obj === "function"); } diff --git a/test/utils.spec.js b/test/utils.spec.js deleted file mode 100644 index e7daa1c..0000000 --- a/test/utils.spec.js +++ /dev/null @@ -1,7 +0,0 @@ -const { toProperty } = require("../lib/component-register"); - -describe('Test Helpers', () => { - it('should convert attribute to Property name', () => { - expect(toProperty('my-custom-attribute')).toBe('myCustomAttribute'); - }) -}) \ No newline at end of file