How to use the @lwc/shared.assign function in @lwc/shared

To help you get started, we’ve selected a few @lwc/shared examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github salesforce / lwc / packages / @lwc / engine / src / framework / restrictions.ts View on Github external
options: RestrictionsOptions
): PropertyDescriptorMap {
    if (process.env.NODE_ENV === 'production') {
        // this method should never leak to prod
        throw new ReferenceError();
    }
    // blacklisting properties in dev mode only to avoid people doing the wrong
    // thing when using the real shadow root, because if that's the case,
    // the component will not work when running with synthetic shadow.
    const originalQuerySelector = sr.querySelector;
    const originalQuerySelectorAll = sr.querySelectorAll;
    const originalAddEventListener = sr.addEventListener;
    const descriptors: PropertyDescriptorMap = getNodeRestrictionsDescriptors(sr, options);
    const originalInnerHTMLDescriptor = getPropertyDescriptor(sr, 'innerHTML')!;
    const originalTextContentDescriptor = getPropertyDescriptor(sr, 'textContent')!;
    assign(descriptors, {
        innerHTML: generateAccessorDescriptor({
            get(this: ShadowRoot): string {
                return originalInnerHTMLDescriptor.get!.call(this);
            },
            set(this: ShadowRoot, _value: string) {
                throw new TypeError(`Invalid attempt to set innerHTML on ShadowRoot.`);
            },
        }),
        textContent: generateAccessorDescriptor({
            get(this: ShadowRoot): string {
                return originalTextContentDescriptor.get!.call(this);
            },
            set(this: ShadowRoot, _value: string) {
                throw new TypeError(`Invalid attempt to set textContent on ShadowRoot.`);
            },
        }),
github salesforce / lwc / packages / @lwc / engine / src / framework / def.ts View on Github external
} = proto;
    const superProto = getCtorProto(Ctor, subclassComponentName);
    const superDef: ComponentDef | null =
        (superProto as any) !== BaseLightningElement
            ? getComponentDef(superProto, subclassComponentName)
            : null;
    const SuperBridge = isNull(superDef) ? BaseBridgeElement : superDef.bridge;
    const bridge = HTMLBridgeElementFactory(
        SuperBridge,
        getOwnPropertyNames(props),
        getOwnPropertyNames(methods)
    );
    if (!isNull(superDef)) {
        props = assign(create(null), superDef.props, props);
        methods = assign(create(null), superDef.methods, methods);
        wire = superDef.wire || wire ? assign(create(null), superDef.wire, wire) : undefined;
        track = assign(create(null), superDef.track, track);
        connectedCallback = connectedCallback || superDef.connectedCallback;
        disconnectedCallback = disconnectedCallback || superDef.disconnectedCallback;
        renderedCallback = renderedCallback || superDef.renderedCallback;
        errorCallback = errorCallback || superDef.errorCallback;
        render = render || superDef.render;
        template = template || superDef.template;
    }
    props = assign(create(null), HTML_PROPS, props);

    if (!isUndefined(fields)) {
        defineProperties(proto, createObservedFieldsDescriptorMap(fields));
    }

    if (isUndefined(template)) {
        // default template
github salesforce / lwc / packages / @lwc / engine / src / framework / attributes.ts View on Github external
];

function offsetPropertyErrorMessage(name) {
    return `Using the \`${name}\` property is an anti-pattern because it rounds the value to an integer. Instead, use the \`getBoundingClientRect\` method to obtain fractional values for the size of an element and its position relative to the viewport.`;
}

// Global HTML Attributes & Properties
// https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes
// https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement
export const globalHTMLProperties: {
    [prop: string]: {
        attribute?: string;
        error?: string;
        readOnly?: boolean;
    };
} = assign(create(null), {
    accessKey: {
        attribute: 'accesskey',
    },
    accessKeyLabel: {
        readOnly: true,
    },
    className: {
        attribute: 'class',
        error:
            'Using the `className` property is an anti-pattern because of slow runtime behavior and potential conflicts with classes provided by the owner element. Use the `classList` API instead.',
    },
    contentEditable: {
        attribute: 'contenteditable',
    },
    dataset: {
        readOnly: true,
github salesforce / lwc / packages / @lwc / engine / src / framework / def.ts View on Github external
getOwnPropertyNames(props),
        getOwnPropertyNames(methods)
    );
    if (!isNull(superDef)) {
        props = assign(create(null), superDef.props, props);
        methods = assign(create(null), superDef.methods, methods);
        wire = superDef.wire || wire ? assign(create(null), superDef.wire, wire) : undefined;
        track = assign(create(null), superDef.track, track);
        connectedCallback = connectedCallback || superDef.connectedCallback;
        disconnectedCallback = disconnectedCallback || superDef.disconnectedCallback;
        renderedCallback = renderedCallback || superDef.renderedCallback;
        errorCallback = errorCallback || superDef.errorCallback;
        render = render || superDef.render;
        template = template || superDef.template;
    }
    props = assign(create(null), HTML_PROPS, props);

    if (!isUndefined(fields)) {
        defineProperties(proto, createObservedFieldsDescriptorMap(fields));
    }

    if (isUndefined(template)) {
        // default template
        template = defaultEmptyTemplate;
    }

    const def: ComponentDef = {
        ctor: Ctor,
        name,
        wire,
        track,
        props,
github salesforce / lwc / packages / @lwc / engine / src / framework / def.ts View on Github external
errorCallback,
        render,
    } = proto;
    const superProto = getCtorProto(Ctor, subclassComponentName);
    const superDef: ComponentDef | null =
        (superProto as any) !== BaseLightningElement
            ? getComponentDef(superProto, subclassComponentName)
            : null;
    const SuperBridge = isNull(superDef) ? BaseBridgeElement : superDef.bridge;
    const bridge = HTMLBridgeElementFactory(
        SuperBridge,
        getOwnPropertyNames(props),
        getOwnPropertyNames(methods)
    );
    if (!isNull(superDef)) {
        props = assign(create(null), superDef.props, props);
        methods = assign(create(null), superDef.methods, methods);
        wire = superDef.wire || wire ? assign(create(null), superDef.wire, wire) : undefined;
        track = assign(create(null), superDef.track, track);
        connectedCallback = connectedCallback || superDef.connectedCallback;
        disconnectedCallback = disconnectedCallback || superDef.disconnectedCallback;
        renderedCallback = renderedCallback || superDef.renderedCallback;
        errorCallback = errorCallback || superDef.errorCallback;
        render = render || superDef.render;
        template = template || superDef.template;
    }
    props = assign(create(null), HTML_PROPS, props);

    if (!isUndefined(fields)) {
        defineProperties(proto, createObservedFieldsDescriptorMap(fields));
    }
github salesforce / lwc / packages / @lwc / engine / src / framework / def.ts View on Github external
render,
    } = proto;
    const superProto = getCtorProto(Ctor, subclassComponentName);
    const superDef: ComponentDef | null =
        (superProto as any) !== BaseLightningElement
            ? getComponentDef(superProto, subclassComponentName)
            : null;
    const SuperBridge = isNull(superDef) ? BaseBridgeElement : superDef.bridge;
    const bridge = HTMLBridgeElementFactory(
        SuperBridge,
        getOwnPropertyNames(props),
        getOwnPropertyNames(methods)
    );
    if (!isNull(superDef)) {
        props = assign(create(null), superDef.props, props);
        methods = assign(create(null), superDef.methods, methods);
        wire = superDef.wire || wire ? assign(create(null), superDef.wire, wire) : undefined;
        track = assign(create(null), superDef.track, track);
        connectedCallback = connectedCallback || superDef.connectedCallback;
        disconnectedCallback = disconnectedCallback || superDef.disconnectedCallback;
        renderedCallback = renderedCallback || superDef.renderedCallback;
        errorCallback = errorCallback || superDef.errorCallback;
        render = render || superDef.render;
        template = template || superDef.template;
    }
    props = assign(create(null), HTML_PROPS, props);

    if (!isUndefined(fields)) {
        defineProperties(proto, createObservedFieldsDescriptorMap(fields));
    }

    if (isUndefined(template)) {
github salesforce / lwc / packages / @lwc / synthetic-shadow / src / faux-shadow / shadow-root.ts View on Github external
configurable: true,
        value(this: SyntheticShadowRootInterface, selectors: string): Element | null {
            return shadowRootQuerySelector(this, selectors);
        },
    },
    querySelectorAll: {
        writable: true,
        enumerable: true,
        configurable: true,
        value(this: SyntheticShadowRootInterface, selectors: string): NodeListOf<element> {
            return createStaticNodeList(shadowRootQuerySelectorAll(this, selectors));
        },
    },
};

assign(
    SyntheticShadowRootDescriptors,
    NodePatchDescriptors,
    ParentNodePatchDescriptors,
    ElementPatchDescriptors,
    ShadowRootDescriptors
);

export function SyntheticShadowRoot() {
    throw new TypeError('Illegal constructor');
}
SyntheticShadowRoot.prototype = create(DocumentFragment.prototype, SyntheticShadowRootDescriptors);

/**
 * This method is only intended to be used in non-production mode in IE11
 * and its role is to produce a 1-1 mapping between a shadowRoot instance
 * and a comment node that is intended to use to trick the IE11 DevTools</element>
github salesforce / lwc / packages / @lwc / engine / src / framework / decorators / register.ts View on Github external
return getOwnPropertyNames(props).reduce((propsHash: PropsDef, propName: string): PropsDef => {
        const attr = getAttrNameFromPropName(propName);
        propsHash[propName] = assign(
            {
                config: 0,
                type: 'any',
                attr,
            },
            props[propName]
        );
        return propsHash;
    }, create(null));
}