@ukic/canary-react 2.0.0-canary.0 → 2.0.0-canary.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,21 +1,21 @@
1
- import React from 'react';
2
- import { OverlayEventDetail } from './interfaces';
3
- import { StencilReactForwardedRef } from './utils';
4
- interface OverlayElement extends HTMLElement {
5
- present: () => Promise<void>;
6
- dismiss: (data?: any, role?: string | undefined) => Promise<boolean>;
7
- }
8
- export interface ReactOverlayProps {
9
- children?: React.ReactNode;
10
- isOpen: boolean;
11
- onDidDismiss?: (event: CustomEvent<OverlayEventDetail>) => void;
12
- onDidPresent?: (event: CustomEvent<OverlayEventDetail>) => void;
13
- onWillDismiss?: (event: CustomEvent<OverlayEventDetail>) => void;
14
- onWillPresent?: (event: CustomEvent<OverlayEventDetail>) => void;
15
- }
16
- export declare const createOverlayComponent: <OverlayComponent extends object, OverlayType extends OverlayElement>(tagName: string, controller: {
17
- create: (options: any) => Promise<OverlayType>;
18
- }, customElement?: any) => React.ForwardRefExoticComponent<React.PropsWithoutRef<OverlayComponent & ReactOverlayProps & {
19
- forwardedRef?: StencilReactForwardedRef<OverlayType>;
20
- }> & React.RefAttributes<OverlayType>>;
21
- export {};
1
+ import React from 'react';
2
+ import { OverlayEventDetail } from './interfaces';
3
+ import { StencilReactForwardedRef } from './utils';
4
+ interface OverlayElement extends HTMLElement {
5
+ present: () => Promise<void>;
6
+ dismiss: (data?: any, role?: string | undefined) => Promise<boolean>;
7
+ }
8
+ export interface ReactOverlayProps {
9
+ children?: React.ReactNode;
10
+ isOpen: boolean;
11
+ onDidDismiss?: (event: CustomEvent<OverlayEventDetail>) => void;
12
+ onDidPresent?: (event: CustomEvent<OverlayEventDetail>) => void;
13
+ onWillDismiss?: (event: CustomEvent<OverlayEventDetail>) => void;
14
+ onWillPresent?: (event: CustomEvent<OverlayEventDetail>) => void;
15
+ }
16
+ export declare const createOverlayComponent: <OverlayComponent extends object, OverlayType extends OverlayElement>(tagName: string, controller: {
17
+ create: (options: any) => Promise<OverlayType>;
18
+ }, customElement?: any) => React.ForwardRefExoticComponent<React.PropsWithoutRef<OverlayComponent & ReactOverlayProps & {
19
+ forwardedRef?: StencilReactForwardedRef<OverlayType>;
20
+ }> & React.RefAttributes<OverlayType>>;
21
+ export {};
@@ -1,108 +1,108 @@
1
- var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3
- return new (P || (P = Promise))(function (resolve, reject) {
4
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7
- step((generator = generator.apply(thisArg, _arguments || [])).next());
8
- });
9
- };
10
- var __rest = (this && this.__rest) || function (s, e) {
11
- var t = {};
12
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
13
- t[p] = s[p];
14
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
15
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
16
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
17
- t[p[i]] = s[p[i]];
18
- }
19
- return t;
20
- };
21
- import React from 'react';
22
- import ReactDOM from 'react-dom';
23
- import { attachProps, dashToPascalCase, defineCustomElement, setRef } from './utils';
24
- export const createOverlayComponent = (tagName, controller, customElement) => {
25
- defineCustomElement(tagName, customElement);
26
- const displayName = dashToPascalCase(tagName);
27
- const didDismissEventName = `on${displayName}DidDismiss`;
28
- const didPresentEventName = `on${displayName}DidPresent`;
29
- const willDismissEventName = `on${displayName}WillDismiss`;
30
- const willPresentEventName = `on${displayName}WillPresent`;
31
- let isDismissing = false;
32
- class Overlay extends React.Component {
33
- constructor(props) {
34
- super(props);
35
- if (typeof document !== 'undefined') {
36
- this.el = document.createElement('div');
37
- }
38
- this.handleDismiss = this.handleDismiss.bind(this);
39
- }
40
- static get displayName() {
41
- return displayName;
42
- }
43
- componentDidMount() {
44
- if (this.props.isOpen) {
45
- this.present();
46
- }
47
- }
48
- componentWillUnmount() {
49
- if (this.overlay) {
50
- this.overlay.dismiss();
51
- }
52
- }
53
- handleDismiss(event) {
54
- if (this.props.onDidDismiss) {
55
- this.props.onDidDismiss(event);
56
- }
57
- setRef(this.props.forwardedRef, null);
58
- }
59
- shouldComponentUpdate(nextProps) {
60
- // Check if the overlay component is about to dismiss
61
- if (this.overlay && nextProps.isOpen !== this.props.isOpen && nextProps.isOpen === false) {
62
- isDismissing = true;
63
- }
64
- return true;
65
- }
66
- componentDidUpdate(prevProps) {
67
- return __awaiter(this, void 0, void 0, function* () {
68
- if (this.overlay) {
69
- attachProps(this.overlay, this.props, prevProps);
70
- }
71
- if (prevProps.isOpen !== this.props.isOpen && this.props.isOpen === true) {
72
- this.present(prevProps);
73
- }
74
- if (this.overlay && prevProps.isOpen !== this.props.isOpen && this.props.isOpen === false) {
75
- yield this.overlay.dismiss();
76
- isDismissing = false;
77
- /**
78
- * Now that the overlay is dismissed
79
- * we need to render again so that any
80
- * inner components will be unmounted
81
- */
82
- this.forceUpdate();
83
- }
84
- });
85
- }
86
- present(prevProps) {
87
- return __awaiter(this, void 0, void 0, function* () {
88
- const _a = this.props, { children, isOpen, onDidDismiss, onDidPresent, onWillDismiss, onWillPresent } = _a, cProps = __rest(_a, ["children", "isOpen", "onDidDismiss", "onDidPresent", "onWillDismiss", "onWillPresent"]);
89
- const elementProps = Object.assign(Object.assign({}, cProps), { ref: this.props.forwardedRef, [didDismissEventName]: this.handleDismiss, [didPresentEventName]: (e) => this.props.onDidPresent && this.props.onDidPresent(e), [willDismissEventName]: (e) => this.props.onWillDismiss && this.props.onWillDismiss(e), [willPresentEventName]: (e) => this.props.onWillPresent && this.props.onWillPresent(e) });
90
- this.overlay = yield controller.create(Object.assign(Object.assign({}, elementProps), { component: this.el, componentProps: {} }));
91
- setRef(this.props.forwardedRef, this.overlay);
92
- attachProps(this.overlay, elementProps, prevProps);
93
- yield this.overlay.present();
94
- });
95
- }
96
- render() {
97
- /**
98
- * Continue to render the component even when
99
- * overlay is dismissing otherwise component
100
- * will be hidden before animation is done.
101
- */
102
- return ReactDOM.createPortal(this.props.isOpen || isDismissing ? this.props.children : null, this.el);
103
- }
104
- }
105
- return React.forwardRef((props, ref) => {
106
- return React.createElement(Overlay, Object.assign({}, props, { forwardedRef: ref }));
107
- });
108
- };
1
+ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3
+ return new (P || (P = Promise))(function (resolve, reject) {
4
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
8
+ });
9
+ };
10
+ var __rest = (this && this.__rest) || function (s, e) {
11
+ var t = {};
12
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
13
+ t[p] = s[p];
14
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
15
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
16
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
17
+ t[p[i]] = s[p[i]];
18
+ }
19
+ return t;
20
+ };
21
+ import React from 'react';
22
+ import ReactDOM from 'react-dom';
23
+ import { attachProps, dashToPascalCase, defineCustomElement, setRef } from './utils';
24
+ export const createOverlayComponent = (tagName, controller, customElement) => {
25
+ defineCustomElement(tagName, customElement);
26
+ const displayName = dashToPascalCase(tagName);
27
+ const didDismissEventName = `on${displayName}DidDismiss`;
28
+ const didPresentEventName = `on${displayName}DidPresent`;
29
+ const willDismissEventName = `on${displayName}WillDismiss`;
30
+ const willPresentEventName = `on${displayName}WillPresent`;
31
+ let isDismissing = false;
32
+ class Overlay extends React.Component {
33
+ constructor(props) {
34
+ super(props);
35
+ if (typeof document !== 'undefined') {
36
+ this.el = document.createElement('div');
37
+ }
38
+ this.handleDismiss = this.handleDismiss.bind(this);
39
+ }
40
+ static get displayName() {
41
+ return displayName;
42
+ }
43
+ componentDidMount() {
44
+ if (this.props.isOpen) {
45
+ this.present();
46
+ }
47
+ }
48
+ componentWillUnmount() {
49
+ if (this.overlay) {
50
+ this.overlay.dismiss();
51
+ }
52
+ }
53
+ handleDismiss(event) {
54
+ if (this.props.onDidDismiss) {
55
+ this.props.onDidDismiss(event);
56
+ }
57
+ setRef(this.props.forwardedRef, null);
58
+ }
59
+ shouldComponentUpdate(nextProps) {
60
+ // Check if the overlay component is about to dismiss
61
+ if (this.overlay && nextProps.isOpen !== this.props.isOpen && nextProps.isOpen === false) {
62
+ isDismissing = true;
63
+ }
64
+ return true;
65
+ }
66
+ componentDidUpdate(prevProps) {
67
+ return __awaiter(this, void 0, void 0, function* () {
68
+ if (this.overlay) {
69
+ attachProps(this.overlay, this.props, prevProps);
70
+ }
71
+ if (prevProps.isOpen !== this.props.isOpen && this.props.isOpen === true) {
72
+ this.present(prevProps);
73
+ }
74
+ if (this.overlay && prevProps.isOpen !== this.props.isOpen && this.props.isOpen === false) {
75
+ yield this.overlay.dismiss();
76
+ isDismissing = false;
77
+ /**
78
+ * Now that the overlay is dismissed
79
+ * we need to render again so that any
80
+ * inner components will be unmounted
81
+ */
82
+ this.forceUpdate();
83
+ }
84
+ });
85
+ }
86
+ present(prevProps) {
87
+ return __awaiter(this, void 0, void 0, function* () {
88
+ const _a = this.props, { children, isOpen, onDidDismiss, onDidPresent, onWillDismiss, onWillPresent } = _a, cProps = __rest(_a, ["children", "isOpen", "onDidDismiss", "onDidPresent", "onWillDismiss", "onWillPresent"]);
89
+ const elementProps = Object.assign(Object.assign({}, cProps), { ref: this.props.forwardedRef, [didDismissEventName]: this.handleDismiss, [didPresentEventName]: (e) => this.props.onDidPresent && this.props.onDidPresent(e), [willDismissEventName]: (e) => this.props.onWillDismiss && this.props.onWillDismiss(e), [willPresentEventName]: (e) => this.props.onWillPresent && this.props.onWillPresent(e) });
90
+ this.overlay = yield controller.create(Object.assign(Object.assign({}, elementProps), { component: this.el, componentProps: {} }));
91
+ setRef(this.props.forwardedRef, this.overlay);
92
+ attachProps(this.overlay, elementProps, prevProps);
93
+ yield this.overlay.present();
94
+ });
95
+ }
96
+ render() {
97
+ /**
98
+ * Continue to render the component even when
99
+ * overlay is dismissing otherwise component
100
+ * will be hidden before animation is done.
101
+ */
102
+ return ReactDOM.createPortal(this.props.isOpen || isDismissing ? this.props.children : null, this.el);
103
+ }
104
+ }
105
+ return React.forwardRef((props, ref) => {
106
+ return React.createElement(Overlay, Object.assign({}, props, { forwardedRef: ref }));
107
+ });
108
+ };
@@ -1,2 +1,2 @@
1
- export { createReactComponent } from './createComponent';
2
- export { createOverlayComponent } from './createOverlayComponent';
1
+ export { createReactComponent } from './createComponent';
2
+ export { createOverlayComponent } from './createOverlayComponent';
@@ -1,2 +1,2 @@
1
- export { createReactComponent } from './createComponent';
2
- export { createOverlayComponent } from './createOverlayComponent';
1
+ export { createReactComponent } from './createComponent';
2
+ export { createOverlayComponent } from './createOverlayComponent';
@@ -1,29 +1,29 @@
1
- export interface EventEmitter<T = any> {
2
- emit: (data?: T) => CustomEvent<T>;
3
- }
4
- export interface StyleReactProps {
5
- class?: string;
6
- className?: string;
7
- style?: {
8
- [key: string]: any;
9
- };
10
- }
11
- export interface OverlayEventDetail<T = any> {
12
- data?: T;
13
- role?: string;
14
- }
15
- export interface OverlayInterface {
16
- el: HTMLElement;
17
- animated: boolean;
18
- keyboardClose: boolean;
19
- overlayIndex: number;
20
- presented: boolean;
21
- enterAnimation?: any;
22
- leaveAnimation?: any;
23
- didPresent: EventEmitter<void>;
24
- willPresent: EventEmitter<void>;
25
- willDismiss: EventEmitter<OverlayEventDetail>;
26
- didDismiss: EventEmitter<OverlayEventDetail>;
27
- present(): Promise<void>;
28
- dismiss(data?: any, role?: string): Promise<boolean>;
29
- }
1
+ export interface EventEmitter<T = any> {
2
+ emit: (data?: T) => CustomEvent<T>;
3
+ }
4
+ export interface StyleReactProps {
5
+ class?: string;
6
+ className?: string;
7
+ style?: {
8
+ [key: string]: any;
9
+ };
10
+ }
11
+ export interface OverlayEventDetail<T = any> {
12
+ data?: T;
13
+ role?: string;
14
+ }
15
+ export interface OverlayInterface {
16
+ el: HTMLElement;
17
+ animated: boolean;
18
+ keyboardClose: boolean;
19
+ overlayIndex: number;
20
+ presented: boolean;
21
+ enterAnimation?: any;
22
+ leaveAnimation?: any;
23
+ didPresent: EventEmitter<void>;
24
+ willPresent: EventEmitter<void>;
25
+ willDismiss: EventEmitter<OverlayEventDetail>;
26
+ didDismiss: EventEmitter<OverlayEventDetail>;
27
+ present(): Promise<void>;
28
+ dismiss(data?: any, role?: string): Promise<boolean>;
29
+ }
@@ -1 +1 @@
1
- export {};
1
+ export {};
@@ -1,2 +1,2 @@
1
- import { FC } from "react";
2
- export declare const SlottedSVG: FC<any>;
1
+ import { FC } from "react";
2
+ export declare const SlottedSVG: FC<any>;
@@ -1,24 +1,24 @@
1
- var __rest = (this && this.__rest) || function (s, e) {
2
- var t = {};
3
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
- t[p] = s[p];
5
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
- t[p[i]] = s[p[i]];
9
- }
10
- return t;
11
- };
12
- import React from "react";
13
- const defaultProps = {
14
- xmlns: "http://www.w3.org/2000/svg",
15
- };
16
- function slot(name = "") {
17
- return { ref: (e) => (e ? e.setAttribute("slot", name) : null) };
18
- }
19
- export const SlottedSVG = (_a) => {
20
- var { path, slot: slotName, children } = _a, props = __rest(_a, ["path", "slot", "children"]);
21
- return (React.createElement("svg", Object.assign({}, slot(slotName), props, defaultProps),
22
- !!path && React.createElement("path", { d: path }),
23
- children));
24
- };
1
+ var __rest = (this && this.__rest) || function (s, e) {
2
+ var t = {};
3
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
+ t[p] = s[p];
5
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
+ t[p[i]] = s[p[i]];
9
+ }
10
+ return t;
11
+ };
12
+ import React from "react";
13
+ const defaultProps = {
14
+ xmlns: "http://www.w3.org/2000/svg",
15
+ };
16
+ function slot(name = "") {
17
+ return { ref: (e) => (e ? e.setAttribute("slot", name) : null) };
18
+ }
19
+ export const SlottedSVG = (_a) => {
20
+ var { path, slot: slotName, children } = _a, props = __rest(_a, ["path", "slot", "children"]);
21
+ return (React.createElement("svg", Object.assign({}, slot(slotName), props, defaultProps),
22
+ !!path && React.createElement("path", { d: path }),
23
+ children));
24
+ };
@@ -1,12 +1,16 @@
1
- export declare const attachProps: (node: HTMLElement, newProps: any, oldProps?: any) => void;
2
- export declare const getClassName: (classList: DOMTokenList, newProps: any, oldProps: any) => string;
3
- /**
4
- * Checks if an event is supported in the current execution environment.
5
- * @license Modernizr 3.0.0pre (Custom Build) | MIT
6
- */
7
- export declare const isCoveredByReact: (eventNameSuffix: string) => boolean;
8
- export declare const syncEvent: (node: Element & {
9
- __events?: {
10
- [key: string]: (e: Event) => any;
11
- };
12
- }, eventName: string, newEventHandler?: (e: Event) => any) => void;
1
+ export declare const attachProps: (node: HTMLElement, newProps: any, oldProps?: any) => void;
2
+ export declare const getClassName: (classList: DOMTokenList, newProps: any, oldProps: any) => string;
3
+ /**
4
+ * Transforms a React event name to a browser event name.
5
+ */
6
+ export declare const transformReactEventName: (eventNameSuffix: string) => string;
7
+ /**
8
+ * Checks if an event is supported in the current execution environment.
9
+ * @license Modernizr 3.0.0pre (Custom Build) | MIT
10
+ */
11
+ export declare const isCoveredByReact: (eventNameSuffix: string) => boolean;
12
+ export declare const syncEvent: (node: Element & {
13
+ __events?: {
14
+ [key: string]: (e: Event) => any;
15
+ };
16
+ }, eventName: string, newEventHandler?: (e: Event) => any) => void;
@@ -1,97 +1,107 @@
1
- import { camelToDashCase } from './case';
2
- export const attachProps = (node, newProps, oldProps = {}) => {
3
- // some test frameworks don't render DOM elements, so we test here to make sure we are dealing with DOM first
4
- if (node instanceof Element) {
5
- // add any classes in className to the class list
6
- const className = getClassName(node.classList, newProps, oldProps);
7
- if (className !== '') {
8
- node.className = className;
9
- }
10
- Object.keys(newProps).forEach((name) => {
11
- if (name === 'children' ||
12
- name === 'style' ||
13
- name === 'ref' ||
14
- name === 'class' ||
15
- name === 'className' ||
16
- name === 'forwardedRef') {
17
- return;
18
- }
19
- if (name.indexOf('on') === 0 && name[2] === name[2].toUpperCase()) {
20
- const eventName = name.substring(2);
21
- const eventNameLc = eventName[0].toLowerCase() + eventName.substring(1);
22
- if (!isCoveredByReact(eventNameLc)) {
23
- syncEvent(node, eventNameLc, newProps[name]);
24
- }
25
- }
26
- else {
27
- node[name] = newProps[name];
28
- const propType = typeof newProps[name];
29
- if (propType === 'string') {
30
- node.setAttribute(camelToDashCase(name), newProps[name]);
31
- }
32
- }
33
- });
34
- }
35
- };
36
- export const getClassName = (classList, newProps, oldProps) => {
37
- const newClassProp = newProps.className || newProps.class;
38
- const oldClassProp = oldProps.className || oldProps.class;
39
- // map the classes to Maps for performance
40
- const currentClasses = arrayToMap(classList);
41
- const incomingPropClasses = arrayToMap(newClassProp ? newClassProp.split(' ') : []);
42
- const oldPropClasses = arrayToMap(oldClassProp ? oldClassProp.split(' ') : []);
43
- const finalClassNames = [];
44
- // loop through each of the current classes on the component
45
- // to see if it should be a part of the classNames added
46
- currentClasses.forEach((currentClass) => {
47
- if (incomingPropClasses.has(currentClass)) {
48
- // add it as its already included in classnames coming in from newProps
49
- finalClassNames.push(currentClass);
50
- incomingPropClasses.delete(currentClass);
51
- }
52
- else if (!oldPropClasses.has(currentClass)) {
53
- // add it as it has NOT been removed by user
54
- finalClassNames.push(currentClass);
55
- }
56
- });
57
- incomingPropClasses.forEach((s) => finalClassNames.push(s));
58
- return finalClassNames.join(' ');
59
- };
60
- /**
61
- * Checks if an event is supported in the current execution environment.
62
- * @license Modernizr 3.0.0pre (Custom Build) | MIT
63
- */
64
- export const isCoveredByReact = (eventNameSuffix) => {
65
- if (typeof document === 'undefined') {
66
- return true;
67
- }
68
- else {
69
- const eventName = 'on' + eventNameSuffix;
70
- let isSupported = eventName in document;
71
- if (!isSupported) {
72
- const element = document.createElement('div');
73
- element.setAttribute(eventName, 'return;');
74
- isSupported = typeof element[eventName] === 'function';
75
- }
76
- return isSupported;
77
- }
78
- };
79
- export const syncEvent = (node, eventName, newEventHandler) => {
80
- const eventStore = node.__events || (node.__events = {});
81
- const oldEventHandler = eventStore[eventName];
82
- // Remove old listener so they don't double up.
83
- if (oldEventHandler) {
84
- node.removeEventListener(eventName, oldEventHandler);
85
- }
86
- // Bind new listener.
87
- node.addEventListener(eventName, (eventStore[eventName] = function handler(e) {
88
- if (newEventHandler) {
89
- newEventHandler.call(this, e);
90
- }
91
- }));
92
- };
93
- const arrayToMap = (arr) => {
94
- const map = new Map();
95
- arr.forEach((s) => map.set(s, s));
96
- return map;
97
- };
1
+ import { camelToDashCase } from './case';
2
+ export const attachProps = (node, newProps, oldProps = {}) => {
3
+ // some test frameworks don't render DOM elements, so we test here to make sure we are dealing with DOM first
4
+ if (node instanceof Element) {
5
+ // add any classes in className to the class list
6
+ const className = getClassName(node.classList, newProps, oldProps);
7
+ if (className !== '') {
8
+ node.className = className;
9
+ }
10
+ Object.keys(newProps).forEach((name) => {
11
+ if (name === 'children' ||
12
+ name === 'style' ||
13
+ name === 'ref' ||
14
+ name === 'class' ||
15
+ name === 'className' ||
16
+ name === 'forwardedRef') {
17
+ return;
18
+ }
19
+ if (name.indexOf('on') === 0 && name[2] === name[2].toUpperCase()) {
20
+ const eventName = name.substring(2);
21
+ const eventNameLc = eventName[0].toLowerCase() + eventName.substring(1);
22
+ if (!isCoveredByReact(eventNameLc)) {
23
+ syncEvent(node, eventNameLc, newProps[name]);
24
+ }
25
+ }
26
+ else {
27
+ node[name] = newProps[name];
28
+ const propType = typeof newProps[name];
29
+ if (propType === 'string') {
30
+ node.setAttribute(camelToDashCase(name), newProps[name]);
31
+ }
32
+ }
33
+ });
34
+ }
35
+ };
36
+ export const getClassName = (classList, newProps, oldProps) => {
37
+ const newClassProp = newProps.className || newProps.class;
38
+ const oldClassProp = oldProps.className || oldProps.class;
39
+ // map the classes to Maps for performance
40
+ const currentClasses = arrayToMap(classList);
41
+ const incomingPropClasses = arrayToMap(newClassProp ? newClassProp.split(' ') : []);
42
+ const oldPropClasses = arrayToMap(oldClassProp ? oldClassProp.split(' ') : []);
43
+ const finalClassNames = [];
44
+ // loop through each of the current classes on the component
45
+ // to see if it should be a part of the classNames added
46
+ currentClasses.forEach((currentClass) => {
47
+ if (incomingPropClasses.has(currentClass)) {
48
+ // add it as its already included in classnames coming in from newProps
49
+ finalClassNames.push(currentClass);
50
+ incomingPropClasses.delete(currentClass);
51
+ }
52
+ else if (!oldPropClasses.has(currentClass)) {
53
+ // add it as it has NOT been removed by user
54
+ finalClassNames.push(currentClass);
55
+ }
56
+ });
57
+ incomingPropClasses.forEach((s) => finalClassNames.push(s));
58
+ return finalClassNames.join(' ');
59
+ };
60
+ /**
61
+ * Transforms a React event name to a browser event name.
62
+ */
63
+ export const transformReactEventName = (eventNameSuffix) => {
64
+ switch (eventNameSuffix) {
65
+ case 'doubleclick':
66
+ return 'dblclick';
67
+ }
68
+ return eventNameSuffix;
69
+ };
70
+ /**
71
+ * Checks if an event is supported in the current execution environment.
72
+ * @license Modernizr 3.0.0pre (Custom Build) | MIT
73
+ */
74
+ export const isCoveredByReact = (eventNameSuffix) => {
75
+ if (typeof document === 'undefined') {
76
+ return true;
77
+ }
78
+ else {
79
+ const eventName = 'on' + transformReactEventName(eventNameSuffix);
80
+ let isSupported = eventName in document;
81
+ if (!isSupported) {
82
+ const element = document.createElement('div');
83
+ element.setAttribute(eventName, 'return;');
84
+ isSupported = typeof element[eventName] === 'function';
85
+ }
86
+ return isSupported;
87
+ }
88
+ };
89
+ export const syncEvent = (node, eventName, newEventHandler) => {
90
+ const eventStore = node.__events || (node.__events = {});
91
+ const oldEventHandler = eventStore[eventName];
92
+ // Remove old listener so they don't double up.
93
+ if (oldEventHandler) {
94
+ node.removeEventListener(eventName, oldEventHandler);
95
+ }
96
+ // Bind new listener.
97
+ node.addEventListener(eventName, (eventStore[eventName] = function handler(e) {
98
+ if (newEventHandler) {
99
+ newEventHandler.call(this, e);
100
+ }
101
+ }));
102
+ };
103
+ const arrayToMap = (arr) => {
104
+ const map = new Map();
105
+ arr.forEach((s) => map.set(s, s));
106
+ return map;
107
+ };
@@ -1,2 +1,2 @@
1
- export declare const dashToPascalCase: (str: string) => string;
2
- export declare const camelToDashCase: (str: string) => string;
1
+ export declare const dashToPascalCase: (str: string) => string;
2
+ export declare const camelToDashCase: (str: string) => string;