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

Sign up to get free protection for your applications and to get access to all the features.
@@ -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;