react-ui-basics 0.0.218 → 0.0.220

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.
Files changed (55) hide show
  1. package/Button.d.ts +24 -0
  2. package/Button.js +45 -75
  3. package/Button.js.map +1 -1
  4. package/CalendarMonthView.d.ts +1 -0
  5. package/CircleProgress.d.ts +1 -0
  6. package/DNDContainer.js +10 -5
  7. package/DNDContainer.js.map +1 -1
  8. package/DNDDraggable.d.ts +29 -0
  9. package/DNDDraggable.js +27 -44
  10. package/DNDDraggable.js.map +1 -1
  11. package/DNDDroppable.d.ts +28 -0
  12. package/DNDDroppable.js +32 -46
  13. package/DNDDroppable.js.map +1 -1
  14. package/DroppableHorizontalList.js +28 -27
  15. package/DroppableHorizontalList.js.map +1 -1
  16. package/DroppableList.js +29 -34
  17. package/DroppableList.js.map +1 -1
  18. package/Dropzone.js.map +1 -1
  19. package/MaterialIcon.d.ts +1 -0
  20. package/ReactConstants.d.ts +1 -0
  21. package/ReactConstants.js +17 -2
  22. package/ReactConstants.js.map +1 -1
  23. package/ScrollableTable.d.ts +4 -2
  24. package/ScrollableTable.js +5 -6
  25. package/ScrollableTable.js.map +1 -1
  26. package/Size.d.ts +1 -0
  27. package/SpinningProgress.d.ts +1 -0
  28. package/Table.js +1 -1
  29. package/Table.js.map +1 -1
  30. package/TextField.d.ts +36 -0
  31. package/TextField.js +73 -134
  32. package/TextField.js.map +1 -1
  33. package/Tools.d.ts +1 -1
  34. package/Tools.js +1 -1
  35. package/Tools.js.map +1 -1
  36. package/bundle.css +684 -684
  37. package/package.json +1 -1
  38. package/src/Button.tsx +97 -0
  39. package/src/DNDContainer.tsx +19 -10
  40. package/src/{DNDDraggable.js → DNDDraggable.tsx} +35 -9
  41. package/src/{DNDDroppable.js → DNDDroppable.tsx} +35 -8
  42. package/src/DroppableHorizontalList.js +33 -32
  43. package/src/DroppableList.js +34 -41
  44. package/src/Dropzone.tsx +1 -1
  45. package/src/ReactConstants.ts +21 -1
  46. package/src/ScrollableTable.tsx +7 -7
  47. package/src/Table.tsx +3 -3
  48. package/src/{TextField.js → TextField.tsx} +42 -44
  49. package/src/Tools.ts +2 -2
  50. package/src/store/Store.test.js +1 -1
  51. package/src/store/Store.ts +8 -26
  52. package/store/Store.d.ts +3 -4
  53. package/store/Store.js +5 -21
  54. package/store/Store.js.map +1 -1
  55. package/src/Button.js +0 -98
@@ -1,11 +1,41 @@
1
- import ReactConstants from "./../ReactConstants"; import {clientHeight as __clientHeight, clientWidth as __clientWidth, createAccessor as __createAccessor, data as __data, height as __height, left as __left, length as __length, pageX as __pageX, pageY as __pageY, props as __props, scrollLeft as __scrollLeft, scrollTop as __scrollTop, state as __state, style as __style, target as __target, top as __top, value as __value, width as __width} from "./../CommonFields"; import {toConsumableArray as __toConsumableArray} from "./../_virtual/_rollupPluginBabelHelpers"; import {extends as __extends} from "./../_virtual/_rollupPluginBabelHelpers"; import {inherits as __inherits} from "./../_virtual/_rollupPluginBabelHelpers"; import './TextField.css'; import React from 'react';
1
+ import React, {ChangeEventHandler, KeyboardEventHandler, MouseEventHandler, ReactElement} from 'react';
2
2
  import ReactCreateElement from './ReactCreateElement';
3
3
  import './TextField.css'
4
4
  import {classNames, getRandomId, isUndefined, orNoop, addEventListener, createRef, setTimeout} from "./Tools";
5
5
  import {PureComponent, render, componentDidMount, propsGetter, stateGSs, componentDidUpdate} from "./ReactConstants";
6
- import PropTypes from "prop-types";
7
6
 
8
- class TextField extends PureComponent {
7
+ export interface TextAreaProps {
8
+ id?: string,
9
+ className?: string,
10
+ value?: string,
11
+ name?: string,
12
+ type?: string,
13
+ autoComplete?: string,
14
+ placeholder?: string,
15
+ label?: string | ReactElement,
16
+ check?: (value: string) => boolean,
17
+ onClick?: MouseEventHandler<HTMLInputElement>,
18
+ onMouseUp?: MouseEventHandler<HTMLInputElement>,
19
+ onKeyDown?: KeyboardEventHandler<HTMLInputElement>,
20
+ onKeyUp?: KeyboardEventHandler<HTMLInputElement>,
21
+ onFocus?: () => void,
22
+ onBlur?: () => void,
23
+ onChange: ChangeEventHandler<HTMLInputElement>,
24
+ required?: boolean,
25
+ disabled?: boolean,
26
+ focused?: boolean,
27
+ min?: string | number,
28
+ max?: string | number,
29
+ input?: (el: HTMLInputElement) => void,
30
+ }
31
+
32
+ abstract class AbstractTextField extends PureComponent<TextAreaProps> {
33
+ check: () => void
34
+ getInput: () => HTMLInputElement
35
+ withAutofillAnimationCallback: () => void
36
+ }
37
+
38
+ class TextField extends AbstractTextField {
9
39
 
10
40
  constructor(properties) {
11
41
  super(properties);
@@ -20,18 +50,18 @@ class TextField extends PureComponent {
20
50
  ] = stateGSs(that, 3);
21
51
  const props = propsGetter(that);
22
52
 
23
- const inputRef = createRef();
53
+ const inputRef = createRef<HTMLInputElement>();
24
54
  const check = () => {
25
55
  const {required, check} = props();
26
- const value = __value(inputRef());
56
+ const value = inputRef().value;
27
57
  const error = (required && value === '') || (check && check(value));
28
58
  errorState() !== error && setTimeout(errorState, 0, error);
29
59
  return error;
30
60
  };
31
61
 
32
62
  const onChange = (e) => {
33
- orNoop(props()[ReactConstants[7]])(e);
34
- isWithValue(!!__value(inputRef()));
63
+ orNoop(props().onChange)(e);
64
+ isWithValue(!!inputRef().value);
35
65
  check()
36
66
  };
37
67
 
@@ -45,7 +75,7 @@ class TextField extends PureComponent {
45
75
  orNoop(props().onBlur)();
46
76
  };
47
77
 
48
- that[ReactConstants[3]] = () => {
78
+ that[render] = () => {
49
79
  const _props = props();
50
80
  const {value, name, type, label, check, disabled, required, min, max, onClick, onKeyDown, onKeyUp, onMouseUp, autoComplete, placeholder, className} = _props;
51
81
  const id = _props.id || randomId;
@@ -86,10 +116,10 @@ class TextField extends PureComponent {
86
116
  )
87
117
  };
88
118
 
89
- that[ReactConstants[0]] = () => {
119
+ that[componentDidMount] = () => {
90
120
  const {focused, input} = props(),
91
121
  i = inputRef();
92
- let hasValue = !!__value(i);
122
+ let hasValue = !!i.value;
93
123
  isWithValue(hasValue);
94
124
 
95
125
  !hasValue && setTimeout(() => {
@@ -103,8 +133,8 @@ class TextField extends PureComponent {
103
133
  focused && i.focus();
104
134
  orNoop(input)(i);
105
135
  };
106
- that[ReactConstants[2]] = () => {
107
- if (__value(props()) !== __value(inputRef()))
136
+ that[componentDidUpdate] = () => {
137
+ if (props().value !== inputRef().value)
108
138
  check();
109
139
  const {focused} = props(),
110
140
  i = inputRef();
@@ -121,36 +151,4 @@ class TextField extends PureComponent {
121
151
  }
122
152
  }
123
153
 
124
- if (process.env.NODE_ENV !== 'production') {
125
- TextField.propTypes = {
126
- id: PropTypes.string,
127
- [ReactConstants[5]]: PropTypes.string,
128
- value: PropTypes.string,
129
- name: PropTypes.string,
130
- type: PropTypes.string,
131
- autoComplete: PropTypes.string,
132
- placeholder: PropTypes.string,
133
- label: PropTypes.oneOfType([
134
- PropTypes.string,
135
- PropTypes.element
136
- ]),
137
- check: PropTypes.func,
138
- [ReactConstants[6]]: PropTypes.func,
139
- onKeyDown: PropTypes.func,
140
- onFocus: PropTypes.func,
141
- onBlur: PropTypes.func,
142
- [ReactConstants[7]]: PropTypes.func,
143
- required: PropTypes.bool,
144
- disabled: PropTypes.bool,
145
- min: PropTypes.oneOfType([
146
- PropTypes.string,
147
- PropTypes.number
148
- ]),
149
- max: PropTypes.oneOfType([
150
- PropTypes.string,
151
- PropTypes.number
152
- ]),
153
- };
154
- }
155
-
156
154
  export default TextField
package/src/Tools.ts CHANGED
@@ -24,9 +24,9 @@ export const ref = (name, component) => {
24
24
  return component[refKey] || (component[refKey] = (it) => component[name] = it)
25
25
  };
26
26
 
27
- export const createRef = (initialValue?: any) => {
27
+ export const createRef = <T>(initialValue?: T) => {
28
28
  let v = initialValue;
29
- return function (value?: any) {
29
+ return (value?: any) => {
30
30
  if (value != UNDEFINED)
31
31
  v = value
32
32
  return v;
@@ -95,7 +95,7 @@ it('update value if selector dependencies change', () => {
95
95
 
96
96
  const MyComponent = () => {
97
97
  let key = useStore(store, it => it.key);
98
- let value = useStore(store, it => it[key], [key]);
98
+ let value = useStore(store, it => it[key]);
99
99
  renderCount++
100
100
  renderedValue.push(value)
101
101
  return <div>{value}</div>;
@@ -1,6 +1,6 @@
1
- import {useEffect, useReducer} from "react";
2
1
  import {createProxy} from "./ProxyTools";
3
2
  import {isFunction, isObject} from "../Tools";
3
+ import {useSyncExternalStore} from "../ReactConstants";
4
4
 
5
5
  const STORES = new Map<Symbol, Store<any>>()
6
6
 
@@ -77,28 +77,10 @@ export function getGlobalState() {
77
77
 
78
78
  export type Selector<T, R> = (t: T) => R;
79
79
 
80
- export const defaultSelector = <T>(store: T): T => store;
81
-
82
- export function useStore<T, R>(store: Store<T>, selector: Selector<T, R>, selectorDependencies: ReadonlyArray<any>): R
83
- export function useStore<T, R>(store: Store<T>, selector: Selector<T, R>, selectorDependencies?: undefined): R
84
- export function useStore<T>(store: Store<T>, selector?: undefined, selectorDependencies?: undefined): T
85
- export function useStore<T, R>(store: Store<T>, selector?: Selector<T, R>, selectorDependencies: ReadonlyArray<any> = []): R {
86
- if (!selector)
87
- selector = (defaultSelector as Selector<T, R>)
88
-
89
- const [_, forceUpdate] = useReducer(x => x + 1, 0);
90
- let value = selector(store.get())
91
-
92
- useEffect(() => {
93
- const updateState = () => {
94
- let next = selector(store.get())
95
- if (value !== next) {
96
- value = next
97
- forceUpdate()
98
- }
99
- };
100
- return store.subscribe(updateState)
101
- }, selectorDependencies)
102
-
103
- return value
104
- }
80
+ // @ts-ignore
81
+ export function useStore<T, R>(store: Store<T>, selector: Selector<T, R>): R
82
+ // @ts-ignore
83
+ export function useStore<T>(store: Store<T>, selector?: undefined): T
84
+ // @ts-ignore
85
+ export const useStore = <T, R>(store: Store<T>, selector?: Selector<T, R>): R =>
86
+ useSyncExternalStore(store.subscribe, selector ? () => selector(store.get()) : store.get);
package/store/Store.d.ts CHANGED
@@ -19,7 +19,6 @@ export declare class Store<T> extends AbstractStore<T> {
19
19
  export default Store;
20
20
  export declare function getGlobalState(): Map<Symbol, Store<any>>;
21
21
  export declare type Selector<T, R> = (t: T) => R;
22
- export declare const defaultSelector: <T>(store: T) => T;
23
- export declare function useStore<T, R>(store: Store<T>, selector: Selector<T, R>, selectorDependencies: ReadonlyArray<any>): R;
24
- export declare function useStore<T, R>(store: Store<T>, selector: Selector<T, R>, selectorDependencies?: undefined): R;
25
- export declare function useStore<T>(store: Store<T>, selector?: undefined, selectorDependencies?: undefined): T;
22
+ export declare function useStore<T, R>(store: Store<T>, selector: Selector<T, R>): R;
23
+ export declare function useStore<T>(store: Store<T>, selector?: undefined): T;
24
+ export declare const useStore: <T, R>(store: Store<T>, selector?: Selector<T, R>) => R;
package/store/Store.js CHANGED
@@ -1,6 +1,6 @@
1
- import ReactConstants from "./../ReactConstants"; import {clientHeight as __clientHeight, clientWidth as __clientWidth, createAccessor as __createAccessor, data as __data, height as __height, left as __left, length as __length, pageX as __pageX, pageY as __pageY, props as __props, scrollLeft as __scrollLeft, scrollTop as __scrollTop, state as __state, style as __style, target as __target, top as __top, value as __value, width as __width} from "./../CommonFields"; import {toConsumableArray as __toConsumableArray} from "./../_virtual/_rollupPluginBabelHelpers"; import {extends as __extends} from "./../_virtual/_rollupPluginBabelHelpers"; import {inherits as __inherits} from "./../_virtual/_rollupPluginBabelHelpers"; import { useReducer, useEffect } from 'react';
2
- import { createProxy } from './ProxyTools.js';
1
+ import ReactConstants from "./../ReactConstants"; import {clientHeight as __clientHeight, clientWidth as __clientWidth, createAccessor as __createAccessor, data as __data, height as __height, left as __left, length as __length, pageX as __pageX, pageY as __pageY, props as __props, scrollLeft as __scrollLeft, scrollTop as __scrollTop, state as __state, style as __style, target as __target, top as __top, value as __value, width as __width} from "./../CommonFields"; import {toConsumableArray as __toConsumableArray} from "./../_virtual/_rollupPluginBabelHelpers"; import {extends as __extends} from "./../_virtual/_rollupPluginBabelHelpers"; import {inherits as __inherits} from "./../_virtual/_rollupPluginBabelHelpers"; import { createProxy } from './ProxyTools.js';
3
2
  import { isFunction, isObject } from '../Tools.js';
3
+ import { useSyncExternalStore } from '../ReactConstants.js';
4
4
 
5
5
  const STORES = new Map();
6
6
  class AbstractStore {
@@ -52,24 +52,8 @@ class Store extends AbstractStore {
52
52
  function getGlobalState() {
53
53
  return STORES;
54
54
  }
55
- const defaultSelector = (store) => store;
56
- function useStore(store, selector, selectorDependencies = []) {
57
- if (!selector)
58
- selector = defaultSelector;
59
- const [_, forceUpdate] = useReducer(x => x + 1, 0);
60
- let value = selector(store.get());
61
- useEffect(() => {
62
- const updateState = () => {
63
- let next = selector(store.get());
64
- if (value !== next) {
65
- value = next;
66
- forceUpdate();
67
- }
68
- };
69
- return store.subscribe(updateState);
70
- }, selectorDependencies);
71
- return value;
72
- }
55
+ // @ts-ignore
56
+ const useStore = (store, selector) => useSyncExternalStore(store.subscribe, selector ? () => selector(store.get()) : store.get);
73
57
 
74
- export { Store, Store as default, defaultSelector, getGlobalState, useStore };
58
+ export { Store, Store as default, getGlobalState, useStore };
75
59
  //# sourceMappingURL=Store.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Store.js","sources":["../src/store/Store.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;AAIA,MAAM,MAAM,GAAG,IAAI,GAAG,EAAsB,CAAA;AAM5C,MAAe,aAAa,CAAA;AAW3B,CAAA;AAGK,MAAO,KAAS,SAAQ,aAAgB,CAAA;IAE1C,WAAY,CAAA,YAAe,EAAE,IAAa,EAAA;AACtC,QAAA,KAAK,EAAE,CAAA;QACP,IAAI,IAAI,GAAG,IAAI,CAAC;AAChB,QAAA,IAAI,SAAS,GAA4B,IAAI,GAAG,EAAsB,CAAA;QACtE,IAAI,KAAK,GAAG,YAAY,CAAC;QACzB,IAAI,YAAY,GAAG,MAAK;AACpB,YAAA,KAAK,IAAI,QAAQ,IAAI,SAAS,CAAC,MAAM,EAAE,EAAE;AACrC,gBAAA,QAAQ,EAAE,CAAA;AACb,aAAA;AACL,SAAC,CAAC;AACF,QAAA,IAAI,CAAC,GAAG,GAAG,MAAS,KAAK,CAAC;AAC1B,QAAA,IAAI,CAAC,GAAG,GAAG,CAAC,MAAM,KAAI;AAClB,YAAA,IAAI,MAAM,CAAC;AACX,YAAA,IAAI,UAAU,CAAC,MAAM,CAAC,EAAE;AACpB,gBAAA,MAAM,KAAK,GAAG,WAAW,CAAC,KAAe,CAAC,CAAC;AAC3C,gBAAA,MAAM,GAAI,MAAoB,CAAC,KAAK,CAAC,CAAC;AACtC,gBAAA,IAAI,CAAC,MAAM,IAAI,MAAM,KAAK,KAAK;AAC3B,oBAAA,MAAM,GAAG,KAAK,CAAC,IAAI,EAAE,CAAA;AAC5B,aAAA;AAAM,iBAAA,IAAI,QAAQ,CAAC,MAAM,CAAC,EAAE;AACzB,gBAAA,MAAM,GAAO,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,KAAK,CAAK,EAAA,MAAM,CAAC,CAAA;AACjC,aAAA;AAAM,iBAAA;gBACH,MAAM,GAAG,MAAM,CAAA;AAClB,aAAA;YAED,KAAK,GAAG,MAAM,CAAA;AACd,YAAA,YAAY,EAAE,CAAC;AACnB,SAAC,CAAA;AACD,QAAA,IAAI,CAAC,KAAK,GAAG,MAAK;YACd,KAAK,GAAG,YAAY,CAAA;AACpB,YAAA,YAAY,EAAE,CAAC;AACnB,SAAC,CAAA;AAED,QAAA,IAAI,CAAC,SAAS,GAAG,CAAC,EAAc,KAAI;AAChC,YAAA,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;AACrB,YAAA,SAAS,CAAC,GAAG,CAAC,GAAG,EAAE,EAAE,CAAC,CAAA;AACtB,YAAA,OAAO,MAAK;AACR,gBAAA,SAAS,CAAC,MAAM,CAAC,GAAG,CAAC,CAAA;AACzB,aAAC,CAAA;AACL,SAAC,CAAA;AAED,QAAA,IAAI,CAAC,QAAQ,GAAG,MAAc,IAAI,CAAC;QACnC,MAAM,CAAC,GAAG,CAAC,MAAM,EAAE,EAAE,IAAI,CAAC,CAAA;KAC7B;AACJ,CAAA;SAIe,cAAc,GAAA;AAC1B,IAAA,OAAO,MAAM,CAAA;AACjB,CAAC;AAIY,MAAA,eAAe,GAAG,CAAI,KAAQ,KAAQ,MAAM;AAKnD,SAAU,QAAQ,CAAO,KAAe,EAAE,QAAyB,EAAE,uBAA2C,EAAE,EAAA;AACpH,IAAA,IAAI,CAAC,QAAQ;QACT,QAAQ,GAAI,eAAkC,CAAA;AAElD,IAAA,MAAM,CAAC,CAAC,EAAE,WAAW,CAAC,GAAG,UAAU,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC;IACnD,IAAI,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC,CAAA;IAEjC,SAAS,CAAC,MAAK;QACX,MAAM,WAAW,GAAG,MAAK;YACrB,IAAI,IAAI,GAAG,QAAQ,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC,CAAA;YAChC,IAAI,KAAK,KAAK,IAAI,EAAE;gBAChB,KAAK,GAAG,IAAI,CAAA;AACZ,gBAAA,WAAW,EAAE,CAAA;AAChB,aAAA;AACL,SAAC,CAAC;AACF,QAAA,OAAO,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAA;KACtC,EAAE,oBAAoB,CAAC,CAAA;AAExB,IAAA,OAAO,KAAK,CAAA;AAChB;;;;"}
1
+ {"version":3,"file":"Store.js","sources":["../src/store/Store.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;AAIA,MAAM,MAAM,GAAG,IAAI,GAAG,EAAsB,CAAA;AAM5C,MAAe,aAAa,CAAA;AAW3B,CAAA;AAGK,MAAO,KAAS,SAAQ,aAAgB,CAAA;IAE1C,WAAY,CAAA,YAAe,EAAE,IAAa,EAAA;AACtC,QAAA,KAAK,EAAE,CAAA;QACP,IAAI,IAAI,GAAG,IAAI,CAAC;AAChB,QAAA,IAAI,SAAS,GAA4B,IAAI,GAAG,EAAsB,CAAA;QACtE,IAAI,KAAK,GAAG,YAAY,CAAC;QACzB,IAAI,YAAY,GAAG,MAAK;AACpB,YAAA,KAAK,IAAI,QAAQ,IAAI,SAAS,CAAC,MAAM,EAAE,EAAE;AACrC,gBAAA,QAAQ,EAAE,CAAA;AACb,aAAA;AACL,SAAC,CAAC;AACF,QAAA,IAAI,CAAC,GAAG,GAAG,MAAS,KAAK,CAAC;AAC1B,QAAA,IAAI,CAAC,GAAG,GAAG,CAAC,MAAM,KAAI;AAClB,YAAA,IAAI,MAAM,CAAC;AACX,YAAA,IAAI,UAAU,CAAC,MAAM,CAAC,EAAE;AACpB,gBAAA,MAAM,KAAK,GAAG,WAAW,CAAC,KAAe,CAAC,CAAC;AAC3C,gBAAA,MAAM,GAAI,MAAoB,CAAC,KAAK,CAAC,CAAC;AACtC,gBAAA,IAAI,CAAC,MAAM,IAAI,MAAM,KAAK,KAAK;AAC3B,oBAAA,MAAM,GAAG,KAAK,CAAC,IAAI,EAAE,CAAA;AAC5B,aAAA;AAAM,iBAAA,IAAI,QAAQ,CAAC,MAAM,CAAC,EAAE;AACzB,gBAAA,MAAM,GAAO,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,KAAK,CAAK,EAAA,MAAM,CAAC,CAAA;AACjC,aAAA;AAAM,iBAAA;gBACH,MAAM,GAAG,MAAM,CAAA;AAClB,aAAA;YAED,KAAK,GAAG,MAAM,CAAA;AACd,YAAA,YAAY,EAAE,CAAC;AACnB,SAAC,CAAA;AACD,QAAA,IAAI,CAAC,KAAK,GAAG,MAAK;YACd,KAAK,GAAG,YAAY,CAAA;AACpB,YAAA,YAAY,EAAE,CAAC;AACnB,SAAC,CAAA;AAED,QAAA,IAAI,CAAC,SAAS,GAAG,CAAC,EAAc,KAAI;AAChC,YAAA,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;AACrB,YAAA,SAAS,CAAC,GAAG,CAAC,GAAG,EAAE,EAAE,CAAC,CAAA;AACtB,YAAA,OAAO,MAAK;AACR,gBAAA,SAAS,CAAC,MAAM,CAAC,GAAG,CAAC,CAAA;AACzB,aAAC,CAAA;AACL,SAAC,CAAA;AAED,QAAA,IAAI,CAAC,QAAQ,GAAG,MAAc,IAAI,CAAC;QACnC,MAAM,CAAC,GAAG,CAAC,MAAM,EAAE,EAAE,IAAI,CAAC,CAAA;KAC7B;AACJ,CAAA;SAIe,cAAc,GAAA;AAC1B,IAAA,OAAO,MAAM,CAAA;AACjB,CAAC;AAQD;AACa,MAAA,QAAQ,GAAG,CAAO,KAAe,EAAE,QAAyB,KACrE,oBAAoB,CAAC,KAAK,CAAC,SAAS,EAAE,QAAQ,GAAG,MAAM,QAAQ,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC,GAAG,KAAK,CAAC,GAAG;;;;"}
package/src/Button.js DELETED
@@ -1,98 +0,0 @@
1
- import ReactConstants from "./../ReactConstants"; import {clientHeight as __clientHeight, clientWidth as __clientWidth, createAccessor as __createAccessor, data as __data, height as __height, left as __left, length as __length, pageX as __pageX, pageY as __pageY, props as __props, scrollLeft as __scrollLeft, scrollTop as __scrollTop, state as __state, style as __style, target as __target, top as __top, value as __value, width as __width} from "./../CommonFields"; import {toConsumableArray as __toConsumableArray} from "./../_virtual/_rollupPluginBabelHelpers"; import {extends as __extends} from "./../_virtual/_rollupPluginBabelHelpers"; import {inherits as __inherits} from "./../_virtual/_rollupPluginBabelHelpers"; import './Button.css'; import React from 'react';
2
- import ReactCreateElement from './ReactCreateElement';
3
- import './Button.css'
4
- import {classNames, DOCUMENT, addEventListener, createRef, orNoop} from "./Tools";
5
- import PropTypes from "prop-types";
6
- import {PureComponent, render, stateGS, props} from "./ReactConstants";
7
-
8
- class Button extends PureComponent {
9
- constructor(properties) {
10
- super(properties);
11
-
12
- const that = this;
13
- const el = createRef();
14
- const ripple = createRef();
15
-
16
- const rippleClassName = stateGS(that);
17
-
18
- const onMouseDown = (e) => {
19
- if (!props(that).withRipple) return;
20
-
21
- const rect = el().getBoundingClientRect();
22
- const rippleElement = ripple();
23
- const style = __style(rippleElement);
24
- const body = DOCUMENT.body;
25
-
26
- style.height = style.width = Math.max(__width(rect), __height(rect)) + 'px';
27
- style.top = (__pageY(e) - __top(rect) - rippleElement.offsetHeight / 2 - __scrollTop(body)) + 'px';
28
- style.left = (__pageX(e) - __left(rect) - rippleElement.offsetWidth / 2 - __scrollLeft(body)) + 'px';
29
-
30
- rippleClassName('show');
31
-
32
- addEventListener(rippleElement, 'animationend', () => {
33
- rippleClassName('showed');
34
- });
35
- };
36
-
37
- const onFocus = e => {
38
- orNoop(props(that).onFocus)(e)
39
- if (rippleClassName() === 'show')
40
- return
41
-
42
- const rect = el().getBoundingClientRect();
43
- const style = __style(ripple());
44
-
45
- let size = Math.max(__width(rect), __height(rect)) * 0.8
46
- style.height = style.width = size + 'px';
47
- style.top = (__height(rect) / 2 - size / 2) + 'px';
48
- style.left = (__width(rect) / 2 - size / 2) + 'px';
49
-
50
- rippleClassName('focused');
51
- }
52
-
53
- that[ReactConstants[3]] = () => {
54
- const {children, type, className, onClick, flat, raised = !flat, round, style, disabled} = props(that);
55
- return (
56
- <button className={classNames('Button',
57
- className,
58
- disabled && 'disabled',
59
- raised && 'raised',
60
- flat && 'flat',
61
- round && 'round')
62
- }
63
- onFocus={onFocus}
64
- disabled={disabled}
65
- style={style}
66
- type={type}
67
- onClick={onClick}
68
- onMouseDown={onMouseDown}
69
- ref={el}>
70
- {children}
71
- <span className={classNames(`ripple`, rippleClassName())} ref={ripple}/>
72
- </button>
73
- );
74
- }
75
- }
76
- }
77
-
78
- if (process.env.NODE_ENV !== 'production') {
79
- Button.propTypes = {
80
- flat: PropTypes.bool,
81
- raised: PropTypes.bool,
82
- round: PropTypes.bool,
83
- disabled: PropTypes.bool,
84
- withRipple: PropTypes.bool,
85
- type: PropTypes.oneOf(['button', 'submit', 'reset']),
86
- [ReactConstants[5]]: PropTypes.string,
87
- [ReactConstants[6]]: PropTypes.func,
88
- onFocus: PropTypes.func,
89
- style: PropTypes.object,
90
- };
91
- }
92
-
93
- Button.defaultProps = {
94
- type: 'button',
95
- withRipple: true,
96
- };
97
-
98
- export default Button;