@imposium-hub/components 1.54.1 → 1.54.3
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.
- package/dist/cjs/components/advanced-number-field/AdvancedNumberField.d.ts +35 -0
- package/dist/cjs/components/advanced-number-field/AdvancedNumberField.js +153 -0
- package/dist/cjs/components/advanced-number-field/AdvancedNumberField.js.map +1 -0
- package/dist/cjs/components/assets/AssetsTableTypeFilter.js +27 -8
- package/dist/cjs/components/assets/AssetsTableTypeFilter.js.map +1 -1
- package/dist/cjs/components/font-picker/FontPicker.d.ts +41 -0
- package/dist/cjs/components/font-picker/FontPicker.js +173 -0
- package/dist/cjs/components/font-picker/FontPicker.js.map +1 -0
- package/dist/cjs/components/font-picker/font-manager/FontManager.d.ts +26 -0
- package/dist/cjs/components/font-picker/font-manager/FontManager.js +209 -0
- package/dist/cjs/components/font-picker/font-manager/FontManager.js.map +1 -0
- package/dist/cjs/components/font-picker/font-manager/constants.d.ts +4 -0
- package/dist/cjs/components/font-picker/font-manager/constants.js +8 -0
- package/dist/cjs/components/font-picker/font-manager/constants.js.map +1 -0
- package/dist/cjs/components/font-picker/font-manager/font-styles/declarations.d.ts +4 -0
- package/dist/cjs/components/font-picker/font-manager/font-styles/declarations.js +27 -0
- package/dist/cjs/components/font-picker/font-manager/font-styles/declarations.js.map +1 -0
- package/dist/cjs/components/font-picker/font-manager/fontStyle.d.ts +1 -0
- package/dist/cjs/components/font-picker/font-manager/fontStyle.js +61 -0
- package/dist/cjs/components/font-picker/font-manager/fontStyle.js.map +1 -0
- package/dist/cjs/components/font-picker/font-manager/google-fonts/fontList.d.ts +5 -0
- package/dist/cjs/components/font-picker/font-manager/google-fonts/fontList.js +87 -0
- package/dist/cjs/components/font-picker/font-manager/google-fonts/fontList.js.map +1 -0
- package/dist/cjs/components/font-picker/font-manager/index.d.ts +3 -0
- package/dist/cjs/components/font-picker/font-manager/index.js +26 -0
- package/dist/cjs/components/font-picker/font-manager/index.js.map +1 -0
- package/dist/cjs/components/font-picker/font-manager/interface.d.ts +0 -0
- package/dist/cjs/components/font-picker/font-manager/interface.js +1 -0
- package/dist/cjs/components/font-picker/font-manager/interface.js.map +1 -0
- package/dist/cjs/components/font-picker/font-manager/loadFonts.d.ts +5 -0
- package/dist/cjs/components/font-picker/font-manager/loadFonts.js +20 -0
- package/dist/cjs/components/font-picker/font-manager/loadFonts.js.map +1 -0
- package/dist/cjs/components/font-picker/font-manager/types.d.ts +25 -0
- package/dist/cjs/components/font-picker/font-manager/types.js +12 -0
- package/dist/cjs/components/font-picker/font-manager/types.js.map +1 -0
- package/dist/cjs/components/font-picker/font-manager/utils/ids.d.ts +4 -0
- package/dist/cjs/components/font-picker/font-manager/utils/ids.js +11 -0
- package/dist/cjs/components/font-picker/font-manager/utils/ids.js.map +1 -0
- package/dist/cjs/components/font-picker/font-manager/utils/request.d.ts +4 -0
- package/dist/cjs/components/font-picker/font-manager/utils/request.js +29 -0
- package/dist/cjs/components/font-picker/font-manager/utils/request.js.map +1 -0
- package/dist/cjs/components/font-picker/font-manager/utils/utils.d.ts +2 -0
- package/dist/cjs/components/font-picker/font-manager/utils/utils.js +30 -0
- package/dist/cjs/components/font-picker/font-manager/utils/utils.js.map +1 -0
- package/dist/cjs/components/font-picker/font-manager/utils.d.ts +3 -0
- package/dist/cjs/components/font-picker/font-manager/utils.js +42 -0
- package/dist/cjs/components/font-picker/font-manager/utils.js.map +1 -0
- package/dist/cjs/constants/assets.d.ts +1 -0
- package/dist/cjs/constants/assets.js +13 -1
- package/dist/cjs/constants/assets.js.map +1 -1
- package/dist/cjs/index.d.ts +2 -1
- package/dist/cjs/index.js +5 -3
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/services/API.d.ts +2 -0
- package/dist/cjs/services/API.js +7 -0
- package/dist/cjs/services/API.js.map +1 -1
- package/dist/esm/components/advanced-number-field/AdvancedNumberField.d.ts +35 -0
- package/dist/esm/components/advanced-number-field/AdvancedNumberField.js +107 -0
- package/dist/esm/components/advanced-number-field/AdvancedNumberField.js.map +1 -0
- package/dist/esm/components/assets/AssetsTableTypeFilter.js +4 -7
- package/dist/esm/components/assets/AssetsTableTypeFilter.js.map +1 -1
- package/dist/esm/components/font-picker/FontPicker.d.ts +41 -0
- package/dist/esm/components/font-picker/FontPicker.js +125 -0
- package/dist/esm/components/font-picker/FontPicker.js.map +1 -0
- package/dist/esm/components/font-picker/font-manager/FontManager.d.ts +26 -0
- package/dist/esm/components/font-picker/font-manager/FontManager.js +105 -0
- package/dist/esm/components/font-picker/font-manager/FontManager.js.map +1 -0
- package/dist/esm/components/font-picker/font-manager/constants.d.ts +4 -0
- package/dist/esm/components/font-picker/font-manager/constants.js +5 -0
- package/dist/esm/components/font-picker/font-manager/constants.js.map +1 -0
- package/dist/esm/components/font-picker/font-manager/font-styles/declarations.d.ts +4 -0
- package/dist/esm/components/font-picker/font-manager/font-styles/declarations.js +27 -0
- package/dist/esm/components/font-picker/font-manager/font-styles/declarations.js.map +1 -0
- package/dist/esm/components/font-picker/font-manager/fontStyle.d.ts +1 -0
- package/dist/esm/components/font-picker/font-manager/fontStyle.js +65 -0
- package/dist/esm/components/font-picker/font-manager/fontStyle.js.map +1 -0
- package/dist/esm/components/font-picker/font-manager/google-fonts/fontList.d.ts +5 -0
- package/dist/esm/components/font-picker/font-manager/google-fonts/fontList.js +22 -0
- package/dist/esm/components/font-picker/font-manager/google-fonts/fontList.js.map +1 -0
- package/dist/esm/components/font-picker/font-manager/index.d.ts +3 -0
- package/dist/esm/components/font-picker/font-manager/index.js +4 -0
- package/dist/esm/components/font-picker/font-manager/index.js.map +1 -0
- package/dist/esm/components/font-picker/font-manager/interface.d.ts +0 -0
- package/dist/esm/components/font-picker/font-manager/interface.js +1 -0
- package/dist/esm/components/font-picker/font-manager/interface.js.map +1 -0
- package/dist/esm/components/font-picker/font-manager/loadFonts.d.ts +5 -0
- package/dist/esm/components/font-picker/font-manager/loadFonts.js +16 -0
- package/dist/esm/components/font-picker/font-manager/loadFonts.js.map +1 -0
- package/dist/esm/components/font-picker/font-manager/types.d.ts +25 -0
- package/dist/esm/components/font-picker/font-manager/types.js +9 -0
- package/dist/esm/components/font-picker/font-manager/types.js.map +1 -0
- package/dist/esm/components/font-picker/font-manager/utils/ids.d.ts +4 -0
- package/dist/esm/components/font-picker/font-manager/utils/ids.js +7 -0
- package/dist/esm/components/font-picker/font-manager/utils/ids.js.map +1 -0
- package/dist/esm/components/font-picker/font-manager/utils/request.d.ts +4 -0
- package/dist/esm/components/font-picker/font-manager/utils/request.js +25 -0
- package/dist/esm/components/font-picker/font-manager/utils/request.js.map +1 -0
- package/dist/esm/components/font-picker/font-manager/utils/utils.d.ts +2 -0
- package/dist/esm/components/font-picker/font-manager/utils/utils.js +25 -0
- package/dist/esm/components/font-picker/font-manager/utils/utils.js.map +1 -0
- package/dist/esm/components/font-picker/font-manager/utils.d.ts +3 -0
- package/dist/esm/components/font-picker/font-manager/utils.js +36 -0
- package/dist/esm/components/font-picker/font-manager/utils.js.map +1 -0
- package/dist/esm/constants/assets.d.ts +1 -0
- package/dist/esm/constants/assets.js +12 -0
- package/dist/esm/constants/assets.js.map +1 -1
- package/dist/esm/index.d.ts +2 -1
- package/dist/esm/index.js +2 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/services/API.d.ts +2 -0
- package/dist/esm/services/API.js +7 -0
- package/dist/esm/services/API.js.map +1 -1
- package/dist/styles.css +3 -0
- package/dist/styles.less +5 -0
- package/less/components/advanced-number-field.less +5 -0
- package/less/entry.less +2 -1
- package/package.json +1 -1
- package/src/components/advanced-number-field/AdvancedNumberField.tsx +183 -0
- package/src/components/assets/AssetsTableTypeFilter.tsx +10 -13
- package/src/constants/assets.ts +13 -0
- package/src/index.ts +2 -0
- package/src/services/API.ts +13 -0
- package/dist/cjs/constants/assets_BACKUP_14924.d.ts +0 -20
- package/dist/cjs/constants/assets_BACKUP_14924.js +0 -30
- package/dist/cjs/constants/assets_BACKUP_14924.js.map +0 -1
- package/dist/cjs/constants/assets_BASE_14924.d.ts +0 -21
- package/dist/cjs/constants/assets_BASE_14924.js +0 -32
- package/dist/cjs/constants/assets_BASE_14924.js.map +0 -1
- package/dist/cjs/constants/assets_LOCAL_14924.d.ts +0 -20
- package/dist/cjs/constants/assets_LOCAL_14924.js +0 -30
- package/dist/cjs/constants/assets_LOCAL_14924.js.map +0 -1
- package/dist/cjs/constants/assets_REMOTE_14924.d.ts +0 -21
- package/dist/cjs/constants/assets_REMOTE_14924.js +0 -32
- package/dist/cjs/constants/assets_REMOTE_14924.js.map +0 -1
- package/dist/esm/constants/assets_BACKUP_14924.d.ts +0 -20
- package/dist/esm/constants/assets_BACKUP_14924.js +0 -26
- package/dist/esm/constants/assets_BACKUP_14924.js.map +0 -1
- package/dist/esm/constants/assets_BASE_14924.d.ts +0 -21
- package/dist/esm/constants/assets_BASE_14924.js +0 -28
- package/dist/esm/constants/assets_BASE_14924.js.map +0 -1
- package/dist/esm/constants/assets_LOCAL_14924.d.ts +0 -20
- package/dist/esm/constants/assets_LOCAL_14924.js +0 -26
- package/dist/esm/constants/assets_LOCAL_14924.js.map +0 -1
- package/dist/esm/constants/assets_REMOTE_14924.d.ts +0 -21
- package/dist/esm/constants/assets_REMOTE_14924.js +0 -28
- package/dist/esm/constants/assets_REMOTE_14924.js.map +0 -1
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { IToolTipConfig } from '../Tooltip';
|
|
3
|
+
interface IAdvancedNumberFieldProps {
|
|
4
|
+
buttons?: any;
|
|
5
|
+
label?: string;
|
|
6
|
+
placeholder?: string;
|
|
7
|
+
readOnly?: boolean;
|
|
8
|
+
value: number;
|
|
9
|
+
tooltip?: IToolTipConfig | string;
|
|
10
|
+
width?: string | number;
|
|
11
|
+
onChange?(e: any): void;
|
|
12
|
+
info?: string;
|
|
13
|
+
labelPosition?: string;
|
|
14
|
+
min?: number;
|
|
15
|
+
max?: number;
|
|
16
|
+
}
|
|
17
|
+
interface IAdvancedNumberFieldState {
|
|
18
|
+
error: boolean;
|
|
19
|
+
value: number;
|
|
20
|
+
}
|
|
21
|
+
declare class AdvancedNumberField extends React.PureComponent<IAdvancedNumberFieldProps, IAdvancedNumberFieldState> {
|
|
22
|
+
private inputRef;
|
|
23
|
+
constructor(props: any);
|
|
24
|
+
componentDidMount(): void;
|
|
25
|
+
componentDidUpdate(prevProps: any): void;
|
|
26
|
+
private validate;
|
|
27
|
+
private onChange;
|
|
28
|
+
private incrementValue;
|
|
29
|
+
private decrementValue;
|
|
30
|
+
private onSelectFocus;
|
|
31
|
+
private onSelectBlur;
|
|
32
|
+
private handleLabelDrag;
|
|
33
|
+
render(): JSX.Element;
|
|
34
|
+
}
|
|
35
|
+
export default AdvancedNumberField;
|
|
@@ -0,0 +1,153 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __extends = (this && this.__extends) || (function () {
|
|
3
|
+
var extendStatics = function (d, b) {
|
|
4
|
+
extendStatics = Object.setPrototypeOf ||
|
|
5
|
+
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
6
|
+
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
|
|
7
|
+
return extendStatics(d, b);
|
|
8
|
+
};
|
|
9
|
+
return function (d, b) {
|
|
10
|
+
if (typeof b !== "function" && b !== null)
|
|
11
|
+
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
|
|
12
|
+
extendStatics(d, b);
|
|
13
|
+
function __() { this.constructor = d; }
|
|
14
|
+
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
15
|
+
};
|
|
16
|
+
})();
|
|
17
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
18
|
+
if (k2 === undefined) k2 = k;
|
|
19
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
20
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
21
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
22
|
+
}
|
|
23
|
+
Object.defineProperty(o, k2, desc);
|
|
24
|
+
}) : (function(o, m, k, k2) {
|
|
25
|
+
if (k2 === undefined) k2 = k;
|
|
26
|
+
o[k2] = m[k];
|
|
27
|
+
}));
|
|
28
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
29
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
30
|
+
}) : function(o, v) {
|
|
31
|
+
o["default"] = v;
|
|
32
|
+
});
|
|
33
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
34
|
+
if (mod && mod.__esModule) return mod;
|
|
35
|
+
var result = {};
|
|
36
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
37
|
+
__setModuleDefault(result, mod);
|
|
38
|
+
return result;
|
|
39
|
+
};
|
|
40
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
41
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
42
|
+
};
|
|
43
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
44
|
+
var React = __importStar(require("react"));
|
|
45
|
+
var FieldWrapper_1 = __importDefault(require("../field-wrapper/FieldWrapper"));
|
|
46
|
+
var AdvancedNumberField = /** @class */ (function (_super) {
|
|
47
|
+
__extends(AdvancedNumberField, _super);
|
|
48
|
+
function AdvancedNumberField(props) {
|
|
49
|
+
var _this = _super.call(this, props) || this;
|
|
50
|
+
_this.state = {
|
|
51
|
+
error: false,
|
|
52
|
+
value: _this.props.value
|
|
53
|
+
};
|
|
54
|
+
_this.inputRef = React.createRef();
|
|
55
|
+
return _this;
|
|
56
|
+
}
|
|
57
|
+
AdvancedNumberField.prototype.componentDidMount = function () {
|
|
58
|
+
this.setState({
|
|
59
|
+
error: false,
|
|
60
|
+
value: this.props.value
|
|
61
|
+
});
|
|
62
|
+
};
|
|
63
|
+
AdvancedNumberField.prototype.componentDidUpdate = function (prevProps) {
|
|
64
|
+
if (prevProps.value !== this.props.value) {
|
|
65
|
+
this.setState({
|
|
66
|
+
error: false,
|
|
67
|
+
value: this.props.value
|
|
68
|
+
});
|
|
69
|
+
}
|
|
70
|
+
};
|
|
71
|
+
AdvancedNumberField.prototype.validate = function (e, btnValue) {
|
|
72
|
+
var _a = this.props, max = _a.max, min = _a.min;
|
|
73
|
+
var val = e !== null ? e.target.value : btnValue;
|
|
74
|
+
this.setState({ value: val });
|
|
75
|
+
if (min || max) {
|
|
76
|
+
if (val < min || val > max) {
|
|
77
|
+
this.setState({ error: true });
|
|
78
|
+
}
|
|
79
|
+
else {
|
|
80
|
+
this.setState({ error: false });
|
|
81
|
+
this.onChange(val);
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
else {
|
|
85
|
+
this.onChange(val);
|
|
86
|
+
}
|
|
87
|
+
};
|
|
88
|
+
AdvancedNumberField.prototype.onChange = function (value) {
|
|
89
|
+
var val = value;
|
|
90
|
+
if (val === '') {
|
|
91
|
+
val = null;
|
|
92
|
+
}
|
|
93
|
+
else {
|
|
94
|
+
val = parseFloat(val);
|
|
95
|
+
}
|
|
96
|
+
this.props.onChange(val);
|
|
97
|
+
};
|
|
98
|
+
AdvancedNumberField.prototype.incrementValue = function () {
|
|
99
|
+
var value = this.state.value;
|
|
100
|
+
this.validate(null, value + 1);
|
|
101
|
+
};
|
|
102
|
+
AdvancedNumberField.prototype.decrementValue = function () {
|
|
103
|
+
var value = this.state.value;
|
|
104
|
+
this.validate(null, value - 1);
|
|
105
|
+
};
|
|
106
|
+
AdvancedNumberField.prototype.onSelectFocus = function () {
|
|
107
|
+
// if (this.props.value && this.inputRef.current) {
|
|
108
|
+
// this.inputRef.current.setSelectionRange(0, this.props.value.toString().length);
|
|
109
|
+
// }
|
|
110
|
+
};
|
|
111
|
+
AdvancedNumberField.prototype.onSelectBlur = function () {
|
|
112
|
+
// if (this.inputRef.current) {
|
|
113
|
+
// this.inputRef.current.setSelectionRange(0, 0);
|
|
114
|
+
// }
|
|
115
|
+
};
|
|
116
|
+
AdvancedNumberField.prototype.handleLabelDrag = function (v) {
|
|
117
|
+
var newVal = this.props.value + v;
|
|
118
|
+
this.props.onChange(newVal);
|
|
119
|
+
};
|
|
120
|
+
AdvancedNumberField.prototype.render = function () {
|
|
121
|
+
var _this = this;
|
|
122
|
+
var error = null;
|
|
123
|
+
var _a = this.props, label = _a.label, placeholder = _a.placeholder, width = _a.width, readOnly = _a.readOnly, buttons = _a.buttons, tooltip = _a.tooltip, info = _a.info, labelPosition = _a.labelPosition, min = _a.min, max = _a.max;
|
|
124
|
+
var value = this.state.value;
|
|
125
|
+
if (value === null) {
|
|
126
|
+
value = '';
|
|
127
|
+
}
|
|
128
|
+
if (this.state.error) {
|
|
129
|
+
if (min && !max) {
|
|
130
|
+
error = "Value must be greater than or equal to ".concat(min, ".");
|
|
131
|
+
}
|
|
132
|
+
else if (!min && max) {
|
|
133
|
+
error = "Value must be less than or equal to ".concat(max, ".");
|
|
134
|
+
}
|
|
135
|
+
else if (min && max) {
|
|
136
|
+
error = "Value must be between ".concat(min, " and ").concat(max, ".");
|
|
137
|
+
}
|
|
138
|
+
}
|
|
139
|
+
else {
|
|
140
|
+
error = info;
|
|
141
|
+
}
|
|
142
|
+
return (React.createElement(FieldWrapper_1.default, { customClass: "advanced-number-field ".concat(this.state.error ? 'invalid' : ''),
|
|
143
|
+
// draggableValue = {true}
|
|
144
|
+
// onDrag = {(v)=>this.handleLabelDrag(v)}
|
|
145
|
+
label: label, tooltip: tooltip, buttons: buttons, info: error, labelPosition: labelPosition, width: width },
|
|
146
|
+
React.createElement("input", { type: 'button', value: '-', className: 'button-minus', onClick: function () { return _this.decrementValue(); } }),
|
|
147
|
+
React.createElement("input", { ref: this.inputRef, type: 'number', pattern: '/^-?(0|[1-9]\\d*)(\\.\\d+)?$/', placeholder: placeholder, value: value, readOnly: readOnly, min: min, max: max, onFocus: function () { return _this.onSelectFocus(); }, onBlur: function () { return _this.onSelectBlur(); }, onChange: function (e) { return _this.validate(e); } }),
|
|
148
|
+
React.createElement("input", { type: 'button', value: '+', className: 'button-plus', onClick: function () { return _this.incrementValue(); } })));
|
|
149
|
+
};
|
|
150
|
+
return AdvancedNumberField;
|
|
151
|
+
}(React.PureComponent));
|
|
152
|
+
exports.default = AdvancedNumberField;
|
|
153
|
+
//# sourceMappingURL=AdvancedNumberField.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AdvancedNumberField.js","sourceRoot":"","sources":["../../../../src/components/advanced-number-field/AdvancedNumberField.tsx"],"names":[],"mappings":"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"}
|
|
@@ -37,6 +37,17 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
37
37
|
__setModuleDefault(result, mod);
|
|
38
38
|
return result;
|
|
39
39
|
};
|
|
40
|
+
var __values = (this && this.__values) || function(o) {
|
|
41
|
+
var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
|
|
42
|
+
if (m) return m.call(o);
|
|
43
|
+
if (o && typeof o.length === "number") return {
|
|
44
|
+
next: function () {
|
|
45
|
+
if (o && i >= o.length) o = void 0;
|
|
46
|
+
return { value: o && o[i++], done: !o };
|
|
47
|
+
}
|
|
48
|
+
};
|
|
49
|
+
throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
|
|
50
|
+
};
|
|
40
51
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
41
52
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
42
53
|
};
|
|
@@ -58,18 +69,26 @@ var AssetsTableTypeFilter = /** @class */ (function (_super) {
|
|
|
58
69
|
_this.props.updateFilters({ type: freshTypeFilter, page: 1 });
|
|
59
70
|
};
|
|
60
71
|
_this.render = function () {
|
|
72
|
+
var e_1, _a;
|
|
61
73
|
var openMenu = _this.state.openMenu;
|
|
62
74
|
var type = _this.props.assetFilters.type;
|
|
63
75
|
var filterButtons = [];
|
|
64
|
-
var _loop_1 = function (
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
filterButtons.push(React.createElement("div", { key: t_1, className: 'asset-filter', onClick: function () { return _this.handleFilterChange(t_1); } },
|
|
68
|
-
React.createElement(AssetsTypeIcon_1.default, { type: t_1 })));
|
|
69
|
-
}
|
|
76
|
+
var _loop_1 = function (assetTypeOption) {
|
|
77
|
+
filterButtons.push(React.createElement("div", { key: assetTypeOption, className: 'asset-filter', onClick: function () { return _this.handleFilterChange(assetTypeOption); } },
|
|
78
|
+
React.createElement(AssetsTypeIcon_1.default, { type: assetTypeOption })));
|
|
70
79
|
};
|
|
71
|
-
|
|
72
|
-
|
|
80
|
+
try {
|
|
81
|
+
for (var ASSET_TYPE_FILTER_OPTIONS_1 = __values(assets_1.ASSET_TYPE_FILTER_OPTIONS), ASSET_TYPE_FILTER_OPTIONS_1_1 = ASSET_TYPE_FILTER_OPTIONS_1.next(); !ASSET_TYPE_FILTER_OPTIONS_1_1.done; ASSET_TYPE_FILTER_OPTIONS_1_1 = ASSET_TYPE_FILTER_OPTIONS_1.next()) {
|
|
82
|
+
var assetTypeOption = ASSET_TYPE_FILTER_OPTIONS_1_1.value;
|
|
83
|
+
_loop_1(assetTypeOption);
|
|
84
|
+
}
|
|
85
|
+
}
|
|
86
|
+
catch (e_1_1) { e_1 = { error: e_1_1 }; }
|
|
87
|
+
finally {
|
|
88
|
+
try {
|
|
89
|
+
if (ASSET_TYPE_FILTER_OPTIONS_1_1 && !ASSET_TYPE_FILTER_OPTIONS_1_1.done && (_a = ASSET_TYPE_FILTER_OPTIONS_1.return)) _a.call(ASSET_TYPE_FILTER_OPTIONS_1);
|
|
90
|
+
}
|
|
91
|
+
finally { if (e_1) throw e_1.error; }
|
|
73
92
|
}
|
|
74
93
|
return (React.createElement("div", { className: 'centered cell' },
|
|
75
94
|
React.createElement(Button_1.default, { tooltip: 'Filter by Asset type', buttonRef: _this.typeFilterRef, onClick: function () { return _this.setState({ openMenu: !openMenu }); } },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AssetsTableTypeFilter.js","sourceRoot":"","sources":["../../../../src/components/assets/AssetsTableTypeFilter.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"AssetsTableTypeFilter.js","sourceRoot":"","sources":["../../../../src/components/assets/AssetsTableTypeFilter.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,oEAA8C;AAC9C,4DAAsC;AACtC,kEAAoD;AACpD,mEAAkE;AAClE,2CAAsC;AACtC,+BAA2C;AAC3C,iDAAgF;AAWhF;IAAoC,yCAGnC;IAGG,+BAAY,KAA6B;QAAzC,YACI,kBAAM,KAAK,CAAC,SAOf;QAEO,wBAAkB,GAAG,UAAC,IAAY;YACtC,IAAM,eAAe,GAAW,IAAI,KAAK,oBAAW,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;YACrE,KAAI,CAAC,KAAK,CAAC,aAAa,CAAC,EAAE,IAAI,EAAE,eAAe,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,CAAC;QACjE,CAAC,CAAC;QAEK,YAAM,GAAG;;YACJ,IAAA,QAAQ,GAAK,KAAI,CAAC,KAAK,SAAf,CAAgB;YAEZ,IAAA,IAAI,GACpB,KAAI,CAAC,KAAK,kBADU,CACT;YACf,IAAM,aAAa,GAAQ,EAAE,CAAC;oCAEnB,eAAe;gBACtB,aAAa,CAAC,IAAI,CACd,6BACI,GAAG,EAAE,eAAe,EACpB,SAAS,EAAC,cAAc,EACxB,OAAO,EAAE,cAAM,OAAA,KAAI,CAAC,kBAAkB,CAAC,eAAe,CAAC,EAAxC,CAAwC;oBACvD,oBAAC,wBAAc,IAAC,IAAI,EAAE,eAAe,GAAI,CACvC,CACT,CAAC;;;gBARN,KAA8B,IAAA,8BAAA,SAAA,kCAAyB,CAAA,oEAAA;oBAAlD,IAAM,eAAe,sCAAA;4BAAf,eAAe;iBASzB;;;;;;;;;YAED,OAAO,CACH,6BAAK,SAAS,EAAC,eAAe;gBAC1B,oBAAC,gBAAM,IACH,OAAO,EAAC,sBAAsB,EAC9B,SAAS,EAAE,KAAI,CAAC,aAAa,EAC7B,OAAO,EAAE,cAAM,OAAA,KAAI,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC,QAAQ,EAAE,CAAC,EAAtC,CAAsC;oBACrD,oBAAC,wBAAc,IAAC,IAAI,EAAE,IAAI,IAAI,QAAQ,GAAI;oBAE1C,oBAAC,kBAAgB,IACb,IAAI,EAAE,QAAQ,EACd,QAAQ,EAAC,YAAY,EACrB,SAAS,EAAE,KAAI,CAAC,aAAa,EAC7B,cAAc,EAAE,cAAM,OAAA,KAAI,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,EAAlC,CAAkC,IACvD,aAAa,CACC,CACd,CACP,CACT,CAAC;QACN,CAAC,CAAC;QAhDE,KAAI,CAAC,KAAK,GAAG;YACT,QAAQ,EAAE,KAAK;SAClB,CAAC;QAEF,KAAI,CAAC,aAAa,GAAG,KAAK,CAAC,SAAS,EAAE,CAAC;;IAC3C,CAAC;IA4CL,4BAAC;AAAD,CAAC,AA1DD,CAAoC,KAAK,CAAC,aAAa,GA0DtD;AAED,IAAM,kBAAkB,GAAG,UAAC,QAAQ;IAChC,OAAO,IAAA,0BAAkB,EAAC,EAAE,aAAa,+BAAA,EAAE,EAAE,QAAQ,CAAC,CAAC;AAC3D,CAAC,CAAC;AAEF,IAAM,eAAe,GAAG,UAAC,KAAK;IAC1B,OAAO,EAAE,YAAY,EAAE,KAAK,CAAC,YAAY,EAAE,CAAC;AAChD,CAAC,CAAC;AAEF,IAAM,6BAA6B,GAAG,IAAA,qBAAO,EACzC,eAAe,EACf,kBAAkB,CACrB,CAAC,KAAK,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC;AACrC,kBAAe,6BAA6B,CAAC"}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import FontManager from './font-manager/FontManager';
|
|
3
|
+
import { Category, Font, Script, Variant } from './font-manager/types';
|
|
4
|
+
interface IFontPickerProps {
|
|
5
|
+
apiKey: string;
|
|
6
|
+
activeFontFamily: string;
|
|
7
|
+
onChange: (font: string) => void;
|
|
8
|
+
families: string[];
|
|
9
|
+
categories: Category[];
|
|
10
|
+
scripts: Script[];
|
|
11
|
+
variants: Variant[];
|
|
12
|
+
filter: (font: Font) => boolean;
|
|
13
|
+
limit: number;
|
|
14
|
+
defaultFonts: any;
|
|
15
|
+
customFonts?: any;
|
|
16
|
+
}
|
|
17
|
+
interface IFontPickerState {
|
|
18
|
+
expanded: boolean;
|
|
19
|
+
fonts: any;
|
|
20
|
+
}
|
|
21
|
+
export default class FontPicker extends React.PureComponent<IFontPickerProps, IFontPickerState> {
|
|
22
|
+
fontManager: FontManager;
|
|
23
|
+
static defaultProps: {
|
|
24
|
+
activeFontFamily: string;
|
|
25
|
+
families: string[];
|
|
26
|
+
categories: Category[];
|
|
27
|
+
scripts: Script[];
|
|
28
|
+
variants: Variant[];
|
|
29
|
+
filter: (font: Font) => boolean;
|
|
30
|
+
limit: number;
|
|
31
|
+
};
|
|
32
|
+
constructor(props: any);
|
|
33
|
+
componentDidUpdate: (prevProps: any) => void;
|
|
34
|
+
private onClose;
|
|
35
|
+
private onSelection;
|
|
36
|
+
private setActiveFontFamily;
|
|
37
|
+
private generateFontList;
|
|
38
|
+
private toggleExpanded;
|
|
39
|
+
render: () => JSX.Element;
|
|
40
|
+
}
|
|
41
|
+
export {};
|
|
@@ -0,0 +1,173 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __extends = (this && this.__extends) || (function () {
|
|
3
|
+
var extendStatics = function (d, b) {
|
|
4
|
+
extendStatics = Object.setPrototypeOf ||
|
|
5
|
+
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
6
|
+
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
|
|
7
|
+
return extendStatics(d, b);
|
|
8
|
+
};
|
|
9
|
+
return function (d, b) {
|
|
10
|
+
if (typeof b !== "function" && b !== null)
|
|
11
|
+
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
|
|
12
|
+
extendStatics(d, b);
|
|
13
|
+
function __() { this.constructor = d; }
|
|
14
|
+
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
15
|
+
};
|
|
16
|
+
})();
|
|
17
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
18
|
+
if (k2 === undefined) k2 = k;
|
|
19
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
20
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
21
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
22
|
+
}
|
|
23
|
+
Object.defineProperty(o, k2, desc);
|
|
24
|
+
}) : (function(o, m, k, k2) {
|
|
25
|
+
if (k2 === undefined) k2 = k;
|
|
26
|
+
o[k2] = m[k];
|
|
27
|
+
}));
|
|
28
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
29
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
30
|
+
}) : function(o, v) {
|
|
31
|
+
o["default"] = v;
|
|
32
|
+
});
|
|
33
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
34
|
+
if (mod && mod.__esModule) return mod;
|
|
35
|
+
var result = {};
|
|
36
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
37
|
+
__setModuleDefault(result, mod);
|
|
38
|
+
return result;
|
|
39
|
+
};
|
|
40
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
41
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
42
|
+
};
|
|
43
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
44
|
+
var React = __importStar(require("react"));
|
|
45
|
+
var FontManager_1 = __importDefault(require("./font-manager/FontManager"));
|
|
46
|
+
var types_1 = require("./font-manager/types");
|
|
47
|
+
var constants_1 = require("./font-manager/constants");
|
|
48
|
+
var fontStyle_1 = require("./font-manager/fontStyle");
|
|
49
|
+
var FontPicker = /** @class */ (function (_super) {
|
|
50
|
+
__extends(FontPicker, _super);
|
|
51
|
+
function FontPicker(props) {
|
|
52
|
+
var _this = _super.call(this, props) || this;
|
|
53
|
+
_this.componentDidUpdate = function (prevProps) {
|
|
54
|
+
var _a = _this.props, activeFontFamily = _a.activeFontFamily, onChange = _a.onChange, customFonts = _a.customFonts, defaultFonts = _a.defaultFonts;
|
|
55
|
+
if (prevProps.customFonts !== customFonts) {
|
|
56
|
+
_this.fontManager
|
|
57
|
+
.init()
|
|
58
|
+
.then(function (fontMap) {
|
|
59
|
+
var googleFonts = Array.from(fontMap.values()).filter(function (f) { return f.files; });
|
|
60
|
+
var updateDefaultFonts = defaultFonts.map(function (f) { return googleFonts.find(function (o) { return o.family === f.family; }) || f; });
|
|
61
|
+
var uniqueFontFamilies = new Set();
|
|
62
|
+
var uniqueFonts = updateDefaultFonts.filter(function (e) {
|
|
63
|
+
var isDup = uniqueFontFamilies.has(e.family);
|
|
64
|
+
uniqueFontFamilies.add(e.family);
|
|
65
|
+
if (!isDup) {
|
|
66
|
+
return true;
|
|
67
|
+
}
|
|
68
|
+
return false;
|
|
69
|
+
});
|
|
70
|
+
_this.setState({ fonts: uniqueFonts }, function () {
|
|
71
|
+
return (0, fontStyle_1.createFontStyleSheets)(defaultFonts, uniqueFonts, customFonts);
|
|
72
|
+
});
|
|
73
|
+
})
|
|
74
|
+
.catch(function (err) {
|
|
75
|
+
console.error('Error trying to fetch the list of available fonts');
|
|
76
|
+
console.error(err);
|
|
77
|
+
});
|
|
78
|
+
}
|
|
79
|
+
if (activeFontFamily !== prevProps.activeFontFamily) {
|
|
80
|
+
_this.setActiveFontFamily(activeFontFamily);
|
|
81
|
+
}
|
|
82
|
+
if (onChange !== prevProps.onChange) {
|
|
83
|
+
_this.fontManager.setOnChange(onChange);
|
|
84
|
+
}
|
|
85
|
+
};
|
|
86
|
+
_this.onClose = function (e) {
|
|
87
|
+
var targetEl = e.target;
|
|
88
|
+
var fontPickerEl = document.getElementById("font-picker");
|
|
89
|
+
while (true) {
|
|
90
|
+
if (targetEl === fontPickerEl) {
|
|
91
|
+
return;
|
|
92
|
+
}
|
|
93
|
+
if (targetEl.parentNode) {
|
|
94
|
+
targetEl = targetEl.parentNode;
|
|
95
|
+
}
|
|
96
|
+
else {
|
|
97
|
+
_this.toggleExpanded();
|
|
98
|
+
return;
|
|
99
|
+
}
|
|
100
|
+
}
|
|
101
|
+
};
|
|
102
|
+
_this.onSelection = function (e) {
|
|
103
|
+
var activeFontFamily = e.target.textContent;
|
|
104
|
+
if (!activeFontFamily) {
|
|
105
|
+
throw Error("Missing font family in clicked font button");
|
|
106
|
+
}
|
|
107
|
+
_this.setActiveFontFamily(activeFontFamily);
|
|
108
|
+
_this.toggleExpanded();
|
|
109
|
+
};
|
|
110
|
+
_this.setActiveFontFamily = function (activeFontFamily) {
|
|
111
|
+
_this.fontManager.setActiveFont(activeFontFamily);
|
|
112
|
+
};
|
|
113
|
+
_this.generateFontList = function () {
|
|
114
|
+
var _a = _this.props, activeFontFamily = _a.activeFontFamily, families = _a.families;
|
|
115
|
+
return (React.createElement("ul", { className: 'font-list' }, families.map(function (font) {
|
|
116
|
+
var isActive = font === activeFontFamily;
|
|
117
|
+
return (React.createElement("li", { key: font, className: 'font-list-item' },
|
|
118
|
+
React.createElement("button", { type: 'button', id: "font-button-".concat(font), className: "font-button ".concat(isActive ? 'active-font' : ''), onClick: _this.onSelection, onKeyDown: _this.onSelection, style: { fontFamily: font } }, font)));
|
|
119
|
+
})));
|
|
120
|
+
};
|
|
121
|
+
_this.toggleExpanded = function () {
|
|
122
|
+
var expanded = _this.state.expanded;
|
|
123
|
+
if (expanded) {
|
|
124
|
+
_this.setState({
|
|
125
|
+
expanded: false
|
|
126
|
+
});
|
|
127
|
+
document.removeEventListener('click', function () { return _this.onClose; });
|
|
128
|
+
}
|
|
129
|
+
else {
|
|
130
|
+
_this.setState({
|
|
131
|
+
expanded: true
|
|
132
|
+
});
|
|
133
|
+
document.addEventListener('click', function () { return _this.onClose; });
|
|
134
|
+
}
|
|
135
|
+
};
|
|
136
|
+
_this.render = function () {
|
|
137
|
+
var activeFontFamily = _this.props.activeFontFamily;
|
|
138
|
+
var expanded = _this.state.expanded;
|
|
139
|
+
return (React.createElement("div", { id: "font-picker", className: expanded ? 'expanded' : '' },
|
|
140
|
+
React.createElement("button", { type: 'button', className: 'dropdown-button', onClick: _this.toggleExpanded, onKeyDown: _this.toggleExpanded },
|
|
141
|
+
React.createElement("p", { className: 'dropdown-font-family' }, activeFontFamily),
|
|
142
|
+
React.createElement("p", { className: 'dropdown-icon finished' })),
|
|
143
|
+
_this.generateFontList()));
|
|
144
|
+
};
|
|
145
|
+
var _a = _this.props, apiKey = _a.apiKey, activeFontFamily = _a.activeFontFamily, families = _a.families, categories = _a.categories, scripts = _a.scripts, variants = _a.variants, filter = _a.filter, limit = _a.limit, onChange = _a.onChange;
|
|
146
|
+
_this.state = {
|
|
147
|
+
expanded: false,
|
|
148
|
+
fonts: null
|
|
149
|
+
};
|
|
150
|
+
var options = {
|
|
151
|
+
families: families,
|
|
152
|
+
categories: categories,
|
|
153
|
+
scripts: scripts,
|
|
154
|
+
variants: variants,
|
|
155
|
+
filter: filter,
|
|
156
|
+
limit: limit
|
|
157
|
+
};
|
|
158
|
+
_this.fontManager = new FontManager_1.default(apiKey, activeFontFamily, options, onChange);
|
|
159
|
+
return _this;
|
|
160
|
+
}
|
|
161
|
+
FontPicker.defaultProps = {
|
|
162
|
+
activeFontFamily: constants_1.FONT_FAMILY_DEFAULT,
|
|
163
|
+
families: types_1.OPTIONS_DEFAULTS.families,
|
|
164
|
+
categories: types_1.OPTIONS_DEFAULTS.categories,
|
|
165
|
+
scripts: types_1.OPTIONS_DEFAULTS.scripts,
|
|
166
|
+
variants: types_1.OPTIONS_DEFAULTS.variants,
|
|
167
|
+
filter: types_1.OPTIONS_DEFAULTS.filter,
|
|
168
|
+
limit: types_1.OPTIONS_DEFAULTS.limit
|
|
169
|
+
};
|
|
170
|
+
return FontPicker;
|
|
171
|
+
}(React.PureComponent));
|
|
172
|
+
exports.default = FontPicker;
|
|
173
|
+
//# sourceMappingURL=FontPicker.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FontPicker.js","sourceRoot":"","sources":["../../../../src/components/font-picker/FontPicker.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { FontList, Options } from './types';
|
|
2
|
+
export default class FontManager {
|
|
3
|
+
private readonly apiKey;
|
|
4
|
+
private readonly options;
|
|
5
|
+
private onChange;
|
|
6
|
+
private fonts;
|
|
7
|
+
constructor(apiKey: string, defaultFamily: string, { families, categories, scripts, variants, filter, limit }: Options, onChange: (font: string) => void);
|
|
8
|
+
/**
|
|
9
|
+
* Fetch list of all fonts from Google Fonts API, filter it according to the class parameters and
|
|
10
|
+
* save them to the font map
|
|
11
|
+
*/
|
|
12
|
+
init(): Promise<FontList>;
|
|
13
|
+
private getFontList;
|
|
14
|
+
/**
|
|
15
|
+
* Add a new font to the font map and download its preview characters
|
|
16
|
+
*/
|
|
17
|
+
private addFont;
|
|
18
|
+
/**
|
|
19
|
+
* Set the specified font as the active font and download it
|
|
20
|
+
*/
|
|
21
|
+
setActiveFont(fontFamily: string): void;
|
|
22
|
+
/**
|
|
23
|
+
* Update the onChange function (executed when changing the active font)
|
|
24
|
+
*/
|
|
25
|
+
setOnChange(onChange: (font: string) => void): void;
|
|
26
|
+
}
|