@elliemae/ds-zoom 2.2.0-next.4 → 2.3.0-alpha.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.
- package/cjs/DSZoom.js +111 -116
- package/cjs/DSZoom.js.map +7 -0
- package/cjs/components/utils.js +41 -15
- package/cjs/components/utils.js.map +7 -0
- package/cjs/components/zoomOptions.js +69 -30
- package/cjs/components/zoomOptions.js.map +7 -0
- package/cjs/index.js +36 -11
- package/cjs/index.js.map +7 -0
- package/esm/DSZoom.js +73 -95
- package/esm/DSZoom.js.map +7 -0
- package/esm/components/utils.js +12 -8
- package/esm/components/utils.js.map +7 -0
- package/esm/components/zoomOptions.js +40 -28
- package/esm/components/zoomOptions.js.map +7 -0
- package/esm/index.js +7 -1
- package/esm/index.js.map +7 -0
- package/package.json +3 -3
- package/types/DSZoom.d.ts +1 -17
package/cjs/DSZoom.js
CHANGED
|
@@ -1,125 +1,120 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
var
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
var
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
var
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __reExport = (target, module2, copyDefault, desc) => {
|
|
13
|
+
if (module2 && typeof module2 === "object" || typeof module2 === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(module2))
|
|
15
|
+
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
16
|
+
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return target;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (module2, isNodeMode) => {
|
|
21
|
+
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
22
|
+
};
|
|
23
|
+
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
24
|
+
return (module2, temp) => {
|
|
25
|
+
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
26
|
+
};
|
|
27
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
28
|
+
var DSZoom_exports = {};
|
|
29
|
+
__export(DSZoom_exports, {
|
|
30
|
+
DSZoom: () => DSZoom,
|
|
31
|
+
ZoomWithSchema: () => ZoomWithSchema,
|
|
32
|
+
default: () => DSZoom_default
|
|
33
|
+
});
|
|
34
|
+
var React = __toESM(require("react"));
|
|
35
|
+
var import_react = __toESM(require("react"));
|
|
36
|
+
var import_react_desc = require("react-desc");
|
|
37
|
+
var import_ds_classnames = require("@elliemae/ds-classnames");
|
|
38
|
+
var import_ds_form = require("@elliemae/ds-form");
|
|
39
|
+
var import_zoomOptions = __toESM(require("./components/zoomOptions"));
|
|
40
|
+
var import_utils = require("./components/utils");
|
|
41
|
+
const DSZoom = ({
|
|
42
|
+
className = "",
|
|
43
|
+
disabled = false,
|
|
44
|
+
value = void 0,
|
|
45
|
+
onChange = () => null,
|
|
46
|
+
containerProps = {},
|
|
47
|
+
zoomOptions = import_zoomOptions.default,
|
|
48
|
+
...otherProps
|
|
49
|
+
}) => {
|
|
50
|
+
const { cssClassName } = (0, import_ds_classnames.convertPropToCssClassName)("zoom-resize", className, {
|
|
50
51
|
disabled
|
|
51
52
|
});
|
|
52
|
-
const defaultOption = zoomOptions
|
|
53
|
-
const [menuIsOpen, setMenuIsOpen] =
|
|
54
|
-
const [selectedOption, setSelectedOption] =
|
|
55
|
-
const [custom, setCustom] =
|
|
56
|
-
label:
|
|
57
|
-
value:
|
|
58
|
-
id:
|
|
53
|
+
const defaultOption = zoomOptions.find((option) => option.default);
|
|
54
|
+
const [menuIsOpen, setMenuIsOpen] = (0, import_react.useState)(false);
|
|
55
|
+
const [selectedOption, setSelectedOption] = (0, import_react.useState)(defaultOption);
|
|
56
|
+
const [custom, setCustom] = (0, import_react.useState)(!value ? defaultOption : {
|
|
57
|
+
label: `${(0, import_utils.clean)(value)}%`,
|
|
58
|
+
value: (0, import_utils.clean)(value),
|
|
59
|
+
id: "custom"
|
|
59
60
|
});
|
|
60
|
-
const options = [custom, ...zoomOptions
|
|
61
|
-
const currentValue = value ||
|
|
62
|
-
return
|
|
63
|
-
className:
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
};
|
|
95
|
-
setCustom(newOption);
|
|
96
|
-
onChange(newOption);
|
|
97
|
-
}
|
|
61
|
+
const options = [custom, ...zoomOptions.filter((option) => !option.default)];
|
|
62
|
+
const currentValue = value || selectedOption?.value || custom?.value || defaultOption?.value;
|
|
63
|
+
return /* @__PURE__ */ import_react.default.createElement("div", {
|
|
64
|
+
className: `${cssClassName}`,
|
|
65
|
+
...containerProps,
|
|
66
|
+
...otherProps
|
|
67
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_ds_form.DSComboBox, {
|
|
68
|
+
searchable: true,
|
|
69
|
+
disabled,
|
|
70
|
+
menuIsOpen,
|
|
71
|
+
onChange: (valueChange, { action }) => {
|
|
72
|
+
const op = options.find((option) => option.value === valueChange);
|
|
73
|
+
setSelectedOption(op);
|
|
74
|
+
onChange(op);
|
|
75
|
+
setMenuIsOpen(false);
|
|
76
|
+
if (action === "select-option") {
|
|
77
|
+
document.activeElement.blur();
|
|
78
|
+
}
|
|
79
|
+
},
|
|
80
|
+
onClickDropdownIndicator: () => setMenuIsOpen(!menuIsOpen),
|
|
81
|
+
onInputChange: (valueInput, action) => {
|
|
82
|
+
if (valueInput || action.action === "input-change") {
|
|
83
|
+
if (!valueInput) {
|
|
84
|
+
setCustom(defaultOption);
|
|
85
|
+
onChange(defaultOption);
|
|
86
|
+
} else if (!Number.isNaN(parseInt(valueInput, 10))) {
|
|
87
|
+
const cleanValue = parseInt(valueInput, 10);
|
|
88
|
+
const newOption = {
|
|
89
|
+
label: `${cleanValue}%`,
|
|
90
|
+
value: `${cleanValue}%`,
|
|
91
|
+
id: "custom"
|
|
92
|
+
};
|
|
93
|
+
setCustom(newOption);
|
|
94
|
+
onChange(newOption);
|
|
98
95
|
}
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
})
|
|
96
|
+
}
|
|
97
|
+
setMenuIsOpen(false);
|
|
98
|
+
},
|
|
99
|
+
options,
|
|
100
|
+
value: currentValue
|
|
105
101
|
}));
|
|
106
102
|
};
|
|
107
|
-
|
|
108
103
|
const zoomProps = {
|
|
109
|
-
className:
|
|
110
|
-
containerProps:
|
|
111
|
-
disabled:
|
|
112
|
-
value:
|
|
113
|
-
onChange:
|
|
114
|
-
zoomOptions:
|
|
115
|
-
label:
|
|
116
|
-
value:
|
|
117
|
-
default:
|
|
118
|
-
}).description(
|
|
104
|
+
className: import_react_desc.PropTypes.string.description("html class attribute"),
|
|
105
|
+
containerProps: import_react_desc.PropTypes.object.description("Set of Properties attached to the main container"),
|
|
106
|
+
disabled: import_react_desc.PropTypes.bool.description("disable component").defaultValue(false),
|
|
107
|
+
value: import_react_desc.PropTypes.oneOfType([import_react_desc.PropTypes.string, import_react_desc.PropTypes.number, import_react_desc.PropTypes.object]).description("current value"),
|
|
108
|
+
onChange: import_react_desc.PropTypes.func.description("function called when a new value is selected"),
|
|
109
|
+
zoomOptions: import_react_desc.PropTypes.shape({
|
|
110
|
+
label: import_react_desc.PropTypes.oneOfType([import_react_desc.PropTypes.string, import_react_desc.PropTypes.number]),
|
|
111
|
+
value: import_react_desc.PropTypes.oneOfType([import_react_desc.PropTypes.string, import_react_desc.PropTypes.number]),
|
|
112
|
+
default: import_react_desc.PropTypes.bool
|
|
113
|
+
}).description("list of options to display in the select menu")
|
|
119
114
|
};
|
|
120
|
-
|
|
115
|
+
DSZoom.propTypes = zoomProps;
|
|
116
|
+
const ZoomWithSchema = (0, import_react_desc.describe)(DSZoom);
|
|
121
117
|
ZoomWithSchema.propTypes = zoomProps;
|
|
122
|
-
|
|
123
|
-
exports
|
|
124
|
-
|
|
125
|
-
exports["default"] = DSZoom;
|
|
118
|
+
var DSZoom_default = DSZoom;
|
|
119
|
+
module.exports = __toCommonJS(DSZoom_exports);
|
|
120
|
+
//# sourceMappingURL=DSZoom.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/DSZoom.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["/* eslint-disable indent */\nimport React, { useState } from 'react';\nimport { describe, PropTypes } from 'react-desc';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport { DSComboBox } from '@elliemae/ds-form';\nimport zoomDefaultOptions from './components/zoomOptions';\nimport { clean } from './components/utils';\n\nconst DSZoom = ({\n className = '',\n disabled = false,\n value = undefined,\n onChange = () => null,\n containerProps = {},\n zoomOptions = zoomDefaultOptions,\n ...otherProps\n}) => {\n const { cssClassName } = convertPropToCssClassName('zoom-resize', className, {\n disabled,\n });\n const defaultOption = zoomOptions.find((option) => option.default);\n const [menuIsOpen, setMenuIsOpen] = useState(false);\n const [selectedOption, setSelectedOption] = useState(defaultOption);\n const [custom, setCustom] = useState(\n !value\n ? defaultOption\n : {\n label: `${clean(value)}%`,\n value: clean(value),\n id: 'custom',\n },\n );\n const options = [custom, ...zoomOptions.filter((option) => !option.default)];\n\n const currentValue = value || selectedOption?.value || custom?.value || defaultOption?.value;\n\n return (\n <div className={`${cssClassName}`} {...containerProps} {...otherProps}>\n <DSComboBox\n searchable\n disabled={disabled}\n menuIsOpen={menuIsOpen}\n onChange={(valueChange, { action }) => {\n const op = options.find((option) => option.value === valueChange);\n setSelectedOption(op);\n onChange(op);\n setMenuIsOpen(false);\n if (action === 'select-option') {\n document.activeElement.blur();\n }\n }}\n onClickDropdownIndicator={() => setMenuIsOpen(!menuIsOpen)}\n onInputChange={(valueInput, action) => {\n if (valueInput || action.action === 'input-change') {\n if (!valueInput) {\n setCustom(defaultOption);\n onChange(defaultOption);\n } else if (!Number.isNaN(parseInt(valueInput, 10))) {\n const cleanValue = parseInt(valueInput, 10);\n const newOption = {\n label: `${cleanValue}%`,\n value: `${cleanValue}%`,\n id: 'custom',\n };\n setCustom(newOption);\n onChange(newOption);\n }\n }\n setMenuIsOpen(false);\n }}\n options={options}\n value={currentValue}\n />\n </div>\n );\n};\n\nconst zoomProps = {\n className: PropTypes.string.description('html class attribute'),\n containerProps: PropTypes.object.description('Set of Properties attached to the main container'),\n disabled: PropTypes.bool.description('disable component').defaultValue(false),\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.object]).description('current value'),\n onChange: PropTypes.func.description('function called when a new value is selected'),\n zoomOptions: PropTypes.shape({\n label: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n default: PropTypes.bool,\n }).description('list of options to display in the select menu'),\n};\n\nDSZoom.propTypes = zoomProps;\n\nconst ZoomWithSchema = describe(DSZoom);\nZoomWithSchema.propTypes = zoomProps;\n\nexport { DSZoom, ZoomWithSchema };\nexport default DSZoom;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAgC;AAChC,wBAAoC;AACpC,2BAA0C;AAC1C,qBAA2B;AAC3B,yBAA+B;AAC/B,mBAAsB;AAEtB,MAAM,SAAS,CAAC;AAAA,EACd,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,QAAQ;AAAA,EACR,WAAW,MAAM;AAAA,EACjB,iBAAiB;AAAA,EACjB,cAAc;AAAA,KACX;AAAA,MACC;AACJ,QAAM,EAAE,iBAAiB,oDAA0B,eAAe,WAAW;AAAA,IAC3E;AAAA;AAEF,QAAM,gBAAgB,YAAY,KAAK,CAAC,WAAW,OAAO;AAC1D,QAAM,CAAC,YAAY,iBAAiB,2BAAS;AAC7C,QAAM,CAAC,gBAAgB,qBAAqB,2BAAS;AACrD,QAAM,CAAC,QAAQ,aAAa,2BAC1B,CAAC,QACG,gBACA;AAAA,IACE,OAAO,GAAG,wBAAM;AAAA,IAChB,OAAO,wBAAM;AAAA,IACb,IAAI;AAAA;AAGZ,QAAM,UAAU,CAAC,QAAQ,GAAG,YAAY,OAAO,CAAC,WAAW,CAAC,OAAO;AAEnE,QAAM,eAAe,SAAS,gBAAgB,SAAS,QAAQ,SAAS,eAAe;AAEvF,SACE,mDAAC,OAAD;AAAA,IAAK,WAAW,GAAG;AAAA,OAAoB;AAAA,OAAoB;AAAA,KACzD,mDAAC,2BAAD;AAAA,IACE,YAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,UAAU,CAAC,aAAa,EAAE,aAAa;AACrC,YAAM,KAAK,QAAQ,KAAK,CAAC,WAAW,OAAO,UAAU;AACrD,wBAAkB;AAClB,eAAS;AACT,oBAAc;AACd,UAAI,WAAW,iBAAiB;AAC9B,iBAAS,cAAc;AAAA;AAAA;AAAA,IAG3B,0BAA0B,MAAM,cAAc,CAAC;AAAA,IAC/C,eAAe,CAAC,YAAY,WAAW;AACrC,UAAI,cAAc,OAAO,WAAW,gBAAgB;AAClD,YAAI,CAAC,YAAY;AACf,oBAAU;AACV,mBAAS;AAAA,mBACA,CAAC,OAAO,MAAM,SAAS,YAAY,MAAM;AAClD,gBAAM,aAAa,SAAS,YAAY;AACxC,gBAAM,YAAY;AAAA,YAChB,OAAO,GAAG;AAAA,YACV,OAAO,GAAG;AAAA,YACV,IAAI;AAAA;AAEN,oBAAU;AACV,mBAAS;AAAA;AAAA;AAGb,oBAAc;AAAA;AAAA,IAEhB;AAAA,IACA,OAAO;AAAA;AAAA;AAMf,MAAM,YAAY;AAAA,EAChB,WAAW,4BAAU,OAAO,YAAY;AAAA,EACxC,gBAAgB,4BAAU,OAAO,YAAY;AAAA,EAC7C,UAAU,4BAAU,KAAK,YAAY,qBAAqB,aAAa;AAAA,EACvE,OAAO,4BAAU,UAAU,CAAC,4BAAU,QAAQ,4BAAU,QAAQ,4BAAU,SAAS,YAAY;AAAA,EAC/F,UAAU,4BAAU,KAAK,YAAY;AAAA,EACrC,aAAa,4BAAU,MAAM;AAAA,IAC3B,OAAO,4BAAU,UAAU,CAAC,4BAAU,QAAQ,4BAAU;AAAA,IACxD,OAAO,4BAAU,UAAU,CAAC,4BAAU,QAAQ,4BAAU;AAAA,IACxD,SAAS,4BAAU;AAAA,KAClB,YAAY;AAAA;AAGjB,OAAO,YAAY;AAEnB,MAAM,iBAAiB,gCAAS;AAChC,eAAe,YAAY;AAG3B,IAAO,iBAAQ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/cjs/components/utils.js
CHANGED
|
@@ -1,15 +1,41 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __reExport = (target, module2, copyDefault, desc) => {
|
|
13
|
+
if (module2 && typeof module2 === "object" || typeof module2 === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(module2))
|
|
15
|
+
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
16
|
+
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return target;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (module2, isNodeMode) => {
|
|
21
|
+
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
22
|
+
};
|
|
23
|
+
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
24
|
+
return (module2, temp) => {
|
|
25
|
+
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
26
|
+
};
|
|
27
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
28
|
+
var utils_exports = {};
|
|
29
|
+
__export(utils_exports, {
|
|
30
|
+
clean: () => clean,
|
|
31
|
+
getCurrentFont: () => getCurrentFont,
|
|
32
|
+
getFactor: () => getFactor,
|
|
33
|
+
setSize: () => setSize
|
|
34
|
+
});
|
|
35
|
+
var React = __toESM(require("react"));
|
|
36
|
+
const getCurrentFont = () => Number(window.getComputedStyle(document.querySelector(":root")).getPropertyValue("font-size").match(/\d+/)[0]);
|
|
37
|
+
const setSize = (size) => document.querySelector(":root").setAttribute("style", `font-size: ${size}px`);
|
|
38
|
+
const getFactor = (value) => value / 100;
|
|
39
|
+
const clean = (value) => value.replace(/\D/g, "").substring(0, 3);
|
|
40
|
+
module.exports = __toCommonJS(utils_exports);
|
|
41
|
+
//# sourceMappingURL=utils.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/components/utils.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["export const getCurrentFont = () =>\n Number(\n window\n .getComputedStyle(document.querySelector(':root'))\n .getPropertyValue('font-size')\n .match(/\\d+/)[0],\n );\nexport const setSize = (size) =>\n document.querySelector(':root').setAttribute('style', `font-size: ${size}px`);\n\nexport const getFactor = (value) => value / 100;\n\nexport const clean = (value) => value.replace(/\\D/g, '').substring(0, 3);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,iBAAiB,MAC5B,OACE,OACG,iBAAiB,SAAS,cAAc,UACxC,iBAAiB,aACjB,MAAM,OAAO;AAEb,MAAM,UAAU,CAAC,SACtB,SAAS,cAAc,SAAS,aAAa,SAAS,cAAc;AAE/D,MAAM,YAAY,CAAC,UAAU,QAAQ;AAErC,MAAM,QAAQ,CAAC,UAAU,MAAM,QAAQ,OAAO,IAAI,UAAU,GAAG;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,30 +1,69 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
var
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
value:
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
},
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __reExport = (target, module2, copyDefault, desc) => {
|
|
13
|
+
if (module2 && typeof module2 === "object" || typeof module2 === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(module2))
|
|
15
|
+
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
16
|
+
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return target;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (module2, isNodeMode) => {
|
|
21
|
+
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
22
|
+
};
|
|
23
|
+
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
24
|
+
return (module2, temp) => {
|
|
25
|
+
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
26
|
+
};
|
|
27
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
28
|
+
var zoomOptions_exports = {};
|
|
29
|
+
__export(zoomOptions_exports, {
|
|
30
|
+
default: () => zoomOptions_default
|
|
31
|
+
});
|
|
32
|
+
var React = __toESM(require("react"));
|
|
33
|
+
var zoomOptions_default = [
|
|
34
|
+
{
|
|
35
|
+
label: "25%",
|
|
36
|
+
value: "25"
|
|
37
|
+
},
|
|
38
|
+
{
|
|
39
|
+
label: "50%",
|
|
40
|
+
value: "50"
|
|
41
|
+
},
|
|
42
|
+
{
|
|
43
|
+
label: "75%",
|
|
44
|
+
value: "75"
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
label: "100%",
|
|
48
|
+
value: "100",
|
|
49
|
+
default: true
|
|
50
|
+
},
|
|
51
|
+
{
|
|
52
|
+
label: "125%",
|
|
53
|
+
value: "125"
|
|
54
|
+
},
|
|
55
|
+
{
|
|
56
|
+
label: "150%",
|
|
57
|
+
value: "150"
|
|
58
|
+
},
|
|
59
|
+
{
|
|
60
|
+
label: "175%",
|
|
61
|
+
value: "175"
|
|
62
|
+
},
|
|
63
|
+
{
|
|
64
|
+
label: "200%",
|
|
65
|
+
value: "200"
|
|
66
|
+
}
|
|
67
|
+
];
|
|
68
|
+
module.exports = __toCommonJS(zoomOptions_exports);
|
|
69
|
+
//# sourceMappingURL=zoomOptions.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/components/zoomOptions.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["export default [\n {\n label: '25%',\n value: '25',\n },\n {\n label: '50%',\n value: '50',\n },\n {\n label: '75%',\n value: '75',\n },\n {\n label: '100%',\n value: '100',\n default: true,\n },\n {\n label: '125%',\n value: '125',\n },\n {\n label: '150%',\n value: '150',\n },\n {\n label: '175%',\n value: '175',\n },\n {\n label: '200%',\n value: '200',\n },\n];\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,IAAO,sBAAQ;AAAA,EACb;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA;AAAA,EAET;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA;AAAA,EAET;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA;AAAA,EAET;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA,IACP,SAAS;AAAA;AAAA,EAEX;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA;AAAA,EAET;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA;AAAA,EAET;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA;AAAA,EAET;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA;AAAA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/cjs/index.js
CHANGED
|
@@ -1,11 +1,36 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __reExport = (target, module2, copyDefault, desc) => {
|
|
13
|
+
if (module2 && typeof module2 === "object" || typeof module2 === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(module2))
|
|
15
|
+
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
16
|
+
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return target;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (module2, isNodeMode) => {
|
|
21
|
+
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
22
|
+
};
|
|
23
|
+
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
24
|
+
return (module2, temp) => {
|
|
25
|
+
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
26
|
+
};
|
|
27
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
28
|
+
var src_exports = {};
|
|
29
|
+
__export(src_exports, {
|
|
30
|
+
default: () => import_DSZoom.default
|
|
31
|
+
});
|
|
32
|
+
var React = __toESM(require("react"));
|
|
33
|
+
__reExport(src_exports, require("./DSZoom"));
|
|
34
|
+
var import_DSZoom = __toESM(require("./DSZoom"));
|
|
35
|
+
module.exports = __toCommonJS(src_exports);
|
|
36
|
+
//# sourceMappingURL=index.js.map
|
package/cjs/index.js.map
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/index.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["export * from './DSZoom';\nexport { default } from './DSZoom';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,wBAAc;AACd,oBAAwB;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/esm/DSZoom.js
CHANGED
|
@@ -1,113 +1,91 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
import { jsx } from 'react/jsx-runtime';
|
|
19
|
-
|
|
20
|
-
const _excluded = ["className", "disabled", "value", "onChange", "containerProps", "zoomOptions"];
|
|
21
|
-
|
|
22
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
23
|
-
|
|
24
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
25
|
-
|
|
26
|
-
const DSZoom = _ref => {
|
|
27
|
-
let {
|
|
28
|
-
className = '',
|
|
29
|
-
disabled = false,
|
|
30
|
-
value = undefined,
|
|
31
|
-
onChange = () => null,
|
|
32
|
-
containerProps = {},
|
|
33
|
-
zoomOptions = zoomDefaultOptions
|
|
34
|
-
} = _ref,
|
|
35
|
-
otherProps = _objectWithoutProperties(_ref, _excluded);
|
|
36
|
-
|
|
37
|
-
const {
|
|
38
|
-
cssClassName
|
|
39
|
-
} = convertPropToCssClassName('zoom-resize', className, {
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import React2, { useState } from "react";
|
|
3
|
+
import { describe, PropTypes } from "react-desc";
|
|
4
|
+
import { convertPropToCssClassName } from "@elliemae/ds-classnames";
|
|
5
|
+
import { DSComboBox } from "@elliemae/ds-form";
|
|
6
|
+
import zoomDefaultOptions from "./components/zoomOptions";
|
|
7
|
+
import { clean } from "./components/utils";
|
|
8
|
+
const DSZoom = ({
|
|
9
|
+
className = "",
|
|
10
|
+
disabled = false,
|
|
11
|
+
value = void 0,
|
|
12
|
+
onChange = () => null,
|
|
13
|
+
containerProps = {},
|
|
14
|
+
zoomOptions = zoomDefaultOptions,
|
|
15
|
+
...otherProps
|
|
16
|
+
}) => {
|
|
17
|
+
const { cssClassName } = convertPropToCssClassName("zoom-resize", className, {
|
|
40
18
|
disabled
|
|
41
19
|
});
|
|
42
|
-
const defaultOption = zoomOptions.find(option => option.default);
|
|
20
|
+
const defaultOption = zoomOptions.find((option) => option.default);
|
|
43
21
|
const [menuIsOpen, setMenuIsOpen] = useState(false);
|
|
44
22
|
const [selectedOption, setSelectedOption] = useState(defaultOption);
|
|
45
23
|
const [custom, setCustom] = useState(!value ? defaultOption : {
|
|
46
|
-
label:
|
|
24
|
+
label: `${clean(value)}%`,
|
|
47
25
|
value: clean(value),
|
|
48
|
-
id:
|
|
26
|
+
id: "custom"
|
|
49
27
|
});
|
|
50
|
-
const options = [custom, ...zoomOptions.filter(option => !option.default)];
|
|
51
|
-
const currentValue = value ||
|
|
52
|
-
return
|
|
53
|
-
className:
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
28
|
+
const options = [custom, ...zoomOptions.filter((option) => !option.default)];
|
|
29
|
+
const currentValue = value || selectedOption?.value || custom?.value || defaultOption?.value;
|
|
30
|
+
return /* @__PURE__ */ React2.createElement("div", {
|
|
31
|
+
className: `${cssClassName}`,
|
|
32
|
+
...containerProps,
|
|
33
|
+
...otherProps
|
|
34
|
+
}, /* @__PURE__ */ React2.createElement(DSComboBox, {
|
|
35
|
+
searchable: true,
|
|
36
|
+
disabled,
|
|
37
|
+
menuIsOpen,
|
|
38
|
+
onChange: (valueChange, { action }) => {
|
|
39
|
+
const op = options.find((option) => option.value === valueChange);
|
|
40
|
+
setSelectedOption(op);
|
|
41
|
+
onChange(op);
|
|
42
|
+
setMenuIsOpen(false);
|
|
43
|
+
if (action === "select-option") {
|
|
44
|
+
document.activeElement.blur();
|
|
45
|
+
}
|
|
46
|
+
},
|
|
47
|
+
onClickDropdownIndicator: () => setMenuIsOpen(!menuIsOpen),
|
|
48
|
+
onInputChange: (valueInput, action) => {
|
|
49
|
+
if (valueInput || action.action === "input-change") {
|
|
50
|
+
if (!valueInput) {
|
|
51
|
+
setCustom(defaultOption);
|
|
52
|
+
onChange(defaultOption);
|
|
53
|
+
} else if (!Number.isNaN(parseInt(valueInput, 10))) {
|
|
54
|
+
const cleanValue = parseInt(valueInput, 10);
|
|
55
|
+
const newOption = {
|
|
56
|
+
label: `${cleanValue}%`,
|
|
57
|
+
value: `${cleanValue}%`,
|
|
58
|
+
id: "custom"
|
|
59
|
+
};
|
|
60
|
+
setCustom(newOption);
|
|
61
|
+
onChange(newOption);
|
|
70
62
|
}
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
setCustom(defaultOption);
|
|
77
|
-
onChange(defaultOption);
|
|
78
|
-
} else if (!Number.isNaN(parseInt(valueInput, 10))) {
|
|
79
|
-
const cleanValue = parseInt(valueInput, 10);
|
|
80
|
-
const newOption = {
|
|
81
|
-
label: "".concat(cleanValue, "%"),
|
|
82
|
-
value: "".concat(cleanValue, "%"),
|
|
83
|
-
id: 'custom'
|
|
84
|
-
};
|
|
85
|
-
setCustom(newOption);
|
|
86
|
-
onChange(newOption);
|
|
87
|
-
}
|
|
88
|
-
}
|
|
89
|
-
|
|
90
|
-
setMenuIsOpen(false);
|
|
91
|
-
},
|
|
92
|
-
options: options,
|
|
93
|
-
value: currentValue
|
|
94
|
-
})
|
|
63
|
+
}
|
|
64
|
+
setMenuIsOpen(false);
|
|
65
|
+
},
|
|
66
|
+
options,
|
|
67
|
+
value: currentValue
|
|
95
68
|
}));
|
|
96
69
|
};
|
|
97
|
-
|
|
98
70
|
const zoomProps = {
|
|
99
|
-
className: PropTypes.string.description(
|
|
100
|
-
containerProps: PropTypes.object.description(
|
|
101
|
-
disabled: PropTypes.bool.description(
|
|
102
|
-
value: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.object]).description(
|
|
103
|
-
onChange: PropTypes.func.description(
|
|
71
|
+
className: PropTypes.string.description("html class attribute"),
|
|
72
|
+
containerProps: PropTypes.object.description("Set of Properties attached to the main container"),
|
|
73
|
+
disabled: PropTypes.bool.description("disable component").defaultValue(false),
|
|
74
|
+
value: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.object]).description("current value"),
|
|
75
|
+
onChange: PropTypes.func.description("function called when a new value is selected"),
|
|
104
76
|
zoomOptions: PropTypes.shape({
|
|
105
77
|
label: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
106
78
|
value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
107
79
|
default: PropTypes.bool
|
|
108
|
-
}).description(
|
|
80
|
+
}).description("list of options to display in the select menu")
|
|
109
81
|
};
|
|
82
|
+
DSZoom.propTypes = zoomProps;
|
|
110
83
|
const ZoomWithSchema = describe(DSZoom);
|
|
111
84
|
ZoomWithSchema.propTypes = zoomProps;
|
|
112
|
-
|
|
113
|
-
export {
|
|
85
|
+
var DSZoom_default = DSZoom;
|
|
86
|
+
export {
|
|
87
|
+
DSZoom,
|
|
88
|
+
ZoomWithSchema,
|
|
89
|
+
DSZoom_default as default
|
|
90
|
+
};
|
|
91
|
+
//# sourceMappingURL=DSZoom.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSZoom.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable indent */\nimport React, { useState } from 'react';\nimport { describe, PropTypes } from 'react-desc';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport { DSComboBox } from '@elliemae/ds-form';\nimport zoomDefaultOptions from './components/zoomOptions';\nimport { clean } from './components/utils';\n\nconst DSZoom = ({\n className = '',\n disabled = false,\n value = undefined,\n onChange = () => null,\n containerProps = {},\n zoomOptions = zoomDefaultOptions,\n ...otherProps\n}) => {\n const { cssClassName } = convertPropToCssClassName('zoom-resize', className, {\n disabled,\n });\n const defaultOption = zoomOptions.find((option) => option.default);\n const [menuIsOpen, setMenuIsOpen] = useState(false);\n const [selectedOption, setSelectedOption] = useState(defaultOption);\n const [custom, setCustom] = useState(\n !value\n ? defaultOption\n : {\n label: `${clean(value)}%`,\n value: clean(value),\n id: 'custom',\n },\n );\n const options = [custom, ...zoomOptions.filter((option) => !option.default)];\n\n const currentValue = value || selectedOption?.value || custom?.value || defaultOption?.value;\n\n return (\n <div className={`${cssClassName}`} {...containerProps} {...otherProps}>\n <DSComboBox\n searchable\n disabled={disabled}\n menuIsOpen={menuIsOpen}\n onChange={(valueChange, { action }) => {\n const op = options.find((option) => option.value === valueChange);\n setSelectedOption(op);\n onChange(op);\n setMenuIsOpen(false);\n if (action === 'select-option') {\n document.activeElement.blur();\n }\n }}\n onClickDropdownIndicator={() => setMenuIsOpen(!menuIsOpen)}\n onInputChange={(valueInput, action) => {\n if (valueInput || action.action === 'input-change') {\n if (!valueInput) {\n setCustom(defaultOption);\n onChange(defaultOption);\n } else if (!Number.isNaN(parseInt(valueInput, 10))) {\n const cleanValue = parseInt(valueInput, 10);\n const newOption = {\n label: `${cleanValue}%`,\n value: `${cleanValue}%`,\n id: 'custom',\n };\n setCustom(newOption);\n onChange(newOption);\n }\n }\n setMenuIsOpen(false);\n }}\n options={options}\n value={currentValue}\n />\n </div>\n );\n};\n\nconst zoomProps = {\n className: PropTypes.string.description('html class attribute'),\n containerProps: PropTypes.object.description('Set of Properties attached to the main container'),\n disabled: PropTypes.bool.description('disable component').defaultValue(false),\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.object]).description('current value'),\n onChange: PropTypes.func.description('function called when a new value is selected'),\n zoomOptions: PropTypes.shape({\n label: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n default: PropTypes.bool,\n }).description('list of options to display in the select menu'),\n};\n\nDSZoom.propTypes = zoomProps;\n\nconst ZoomWithSchema = describe(DSZoom);\nZoomWithSchema.propTypes = zoomProps;\n\nexport { DSZoom, ZoomWithSchema };\nexport default DSZoom;\n"],
|
|
5
|
+
"mappings": "AAAA;ACCA;AACA;AACA;AACA;AACA;AACA;AAEA,MAAM,SAAS,CAAC;AAAA,EACd,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,QAAQ;AAAA,EACR,WAAW,MAAM;AAAA,EACjB,iBAAiB;AAAA,EACjB,cAAc;AAAA,KACX;AAAA,MACC;AACJ,QAAM,EAAE,iBAAiB,0BAA0B,eAAe,WAAW;AAAA,IAC3E;AAAA;AAEF,QAAM,gBAAgB,YAAY,KAAK,CAAC,WAAW,OAAO;AAC1D,QAAM,CAAC,YAAY,iBAAiB,SAAS;AAC7C,QAAM,CAAC,gBAAgB,qBAAqB,SAAS;AACrD,QAAM,CAAC,QAAQ,aAAa,SAC1B,CAAC,QACG,gBACA;AAAA,IACE,OAAO,GAAG,MAAM;AAAA,IAChB,OAAO,MAAM;AAAA,IACb,IAAI;AAAA;AAGZ,QAAM,UAAU,CAAC,QAAQ,GAAG,YAAY,OAAO,CAAC,WAAW,CAAC,OAAO;AAEnE,QAAM,eAAe,SAAS,gBAAgB,SAAS,QAAQ,SAAS,eAAe;AAEvF,SACE,qCAAC,OAAD;AAAA,IAAK,WAAW,GAAG;AAAA,OAAoB;AAAA,OAAoB;AAAA,KACzD,qCAAC,YAAD;AAAA,IACE,YAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,UAAU,CAAC,aAAa,EAAE,aAAa;AACrC,YAAM,KAAK,QAAQ,KAAK,CAAC,WAAW,OAAO,UAAU;AACrD,wBAAkB;AAClB,eAAS;AACT,oBAAc;AACd,UAAI,WAAW,iBAAiB;AAC9B,iBAAS,cAAc;AAAA;AAAA;AAAA,IAG3B,0BAA0B,MAAM,cAAc,CAAC;AAAA,IAC/C,eAAe,CAAC,YAAY,WAAW;AACrC,UAAI,cAAc,OAAO,WAAW,gBAAgB;AAClD,YAAI,CAAC,YAAY;AACf,oBAAU;AACV,mBAAS;AAAA,mBACA,CAAC,OAAO,MAAM,SAAS,YAAY,MAAM;AAClD,gBAAM,aAAa,SAAS,YAAY;AACxC,gBAAM,YAAY;AAAA,YAChB,OAAO,GAAG;AAAA,YACV,OAAO,GAAG;AAAA,YACV,IAAI;AAAA;AAEN,oBAAU;AACV,mBAAS;AAAA;AAAA;AAGb,oBAAc;AAAA;AAAA,IAEhB;AAAA,IACA,OAAO;AAAA;AAAA;AAMf,MAAM,YAAY;AAAA,EAChB,WAAW,UAAU,OAAO,YAAY;AAAA,EACxC,gBAAgB,UAAU,OAAO,YAAY;AAAA,EAC7C,UAAU,UAAU,KAAK,YAAY,qBAAqB,aAAa;AAAA,EACvE,OAAO,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,QAAQ,UAAU,SAAS,YAAY;AAAA,EAC/F,UAAU,UAAU,KAAK,YAAY;AAAA,EACrC,aAAa,UAAU,MAAM;AAAA,IAC3B,OAAO,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU;AAAA,IACxD,OAAO,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU;AAAA,IACxD,SAAS,UAAU;AAAA,KAClB,YAAY;AAAA;AAGjB,OAAO,YAAY;AAEnB,MAAM,iBAAiB,SAAS;AAChC,eAAe,YAAY;AAG3B,IAAO,iBAAQ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/esm/components/utils.js
CHANGED
|
@@ -1,8 +1,12 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
const
|
|
4
|
-
const
|
|
5
|
-
const
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
const getCurrentFont = () => Number(window.getComputedStyle(document.querySelector(":root")).getPropertyValue("font-size").match(/\d+/)[0]);
|
|
3
|
+
const setSize = (size) => document.querySelector(":root").setAttribute("style", `font-size: ${size}px`);
|
|
4
|
+
const getFactor = (value) => value / 100;
|
|
5
|
+
const clean = (value) => value.replace(/\D/g, "").substring(0, 3);
|
|
6
|
+
export {
|
|
7
|
+
clean,
|
|
8
|
+
getCurrentFont,
|
|
9
|
+
getFactor,
|
|
10
|
+
setSize
|
|
11
|
+
};
|
|
12
|
+
//# sourceMappingURL=utils.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/utils.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const getCurrentFont = () =>\n Number(\n window\n .getComputedStyle(document.querySelector(':root'))\n .getPropertyValue('font-size')\n .match(/\\d+/)[0],\n );\nexport const setSize = (size) =>\n document.querySelector(':root').setAttribute('style', `font-size: ${size}px`);\n\nexport const getFactor = (value) => value / 100;\n\nexport const clean = (value) => value.replace(/\\D/g, '').substring(0, 3);\n"],
|
|
5
|
+
"mappings": "AAAA;ACAO,MAAM,iBAAiB,MAC5B,OACE,OACG,iBAAiB,SAAS,cAAc,UACxC,iBAAiB,aACjB,MAAM,OAAO;AAEb,MAAM,UAAU,CAAC,SACtB,SAAS,cAAc,SAAS,aAAa,SAAS,cAAc;AAE/D,MAAM,YAAY,CAAC,UAAU,QAAQ;AAErC,MAAM,QAAQ,CAAC,UAAU,MAAM,QAAQ,OAAO,IAAI,UAAU,GAAG;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,28 +1,40 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
},
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
},
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
},
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
var zoomOptions_default = [
|
|
3
|
+
{
|
|
4
|
+
label: "25%",
|
|
5
|
+
value: "25"
|
|
6
|
+
},
|
|
7
|
+
{
|
|
8
|
+
label: "50%",
|
|
9
|
+
value: "50"
|
|
10
|
+
},
|
|
11
|
+
{
|
|
12
|
+
label: "75%",
|
|
13
|
+
value: "75"
|
|
14
|
+
},
|
|
15
|
+
{
|
|
16
|
+
label: "100%",
|
|
17
|
+
value: "100",
|
|
18
|
+
default: true
|
|
19
|
+
},
|
|
20
|
+
{
|
|
21
|
+
label: "125%",
|
|
22
|
+
value: "125"
|
|
23
|
+
},
|
|
24
|
+
{
|
|
25
|
+
label: "150%",
|
|
26
|
+
value: "150"
|
|
27
|
+
},
|
|
28
|
+
{
|
|
29
|
+
label: "175%",
|
|
30
|
+
value: "175"
|
|
31
|
+
},
|
|
32
|
+
{
|
|
33
|
+
label: "200%",
|
|
34
|
+
value: "200"
|
|
35
|
+
}
|
|
36
|
+
];
|
|
37
|
+
export {
|
|
38
|
+
zoomOptions_default as default
|
|
39
|
+
};
|
|
40
|
+
//# sourceMappingURL=zoomOptions.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/zoomOptions.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export default [\n {\n label: '25%',\n value: '25',\n },\n {\n label: '50%',\n value: '50',\n },\n {\n label: '75%',\n value: '75',\n },\n {\n label: '100%',\n value: '100',\n default: true,\n },\n {\n label: '125%',\n value: '125',\n },\n {\n label: '150%',\n value: '150',\n },\n {\n label: '175%',\n value: '175',\n },\n {\n label: '200%',\n value: '200',\n },\n];\n"],
|
|
5
|
+
"mappings": "AAAA;ACAA,IAAO,sBAAQ;AAAA,EACb;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA;AAAA,EAET;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA;AAAA,EAET;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA;AAAA,EAET;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA,IACP,SAAS;AAAA;AAAA,EAEX;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA;AAAA,EAET;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA;AAAA,EAET;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA;AAAA,EAET;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA;AAAA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/esm/index.js
CHANGED
package/esm/index.js.map
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './DSZoom';\nexport { default } from './DSZoom';\n"],
|
|
5
|
+
"mappings": "AAAA;ACAA;AACA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-zoom",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.3.0-alpha.2",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Zoom",
|
|
6
6
|
"module": "./esm/index.js",
|
|
@@ -44,8 +44,8 @@
|
|
|
44
44
|
"build": "node ../../scripts/build/build.js"
|
|
45
45
|
},
|
|
46
46
|
"dependencies": {
|
|
47
|
-
"@elliemae/ds-classnames": "2.
|
|
48
|
-
"@elliemae/ds-form": "2.
|
|
47
|
+
"@elliemae/ds-classnames": "2.3.0-alpha.2",
|
|
48
|
+
"@elliemae/ds-form": "2.3.0-alpha.2",
|
|
49
49
|
"react-desc": "~4.1.3"
|
|
50
50
|
},
|
|
51
51
|
"devDependencies": {
|
package/types/DSZoom.d.ts
CHANGED
|
@@ -55,23 +55,7 @@ declare const DSZoom: {
|
|
|
55
55
|
};
|
|
56
56
|
};
|
|
57
57
|
declare const ZoomWithSchema: {
|
|
58
|
-
(props?:
|
|
59
|
-
[x: string]: any;
|
|
60
|
-
className?: string | undefined;
|
|
61
|
-
disabled?: boolean | undefined;
|
|
62
|
-
value?: undefined;
|
|
63
|
-
onChange?: (() => null) | undefined;
|
|
64
|
-
containerProps?: {} | undefined;
|
|
65
|
-
zoomOptions?: ({
|
|
66
|
-
label: string;
|
|
67
|
-
value: string;
|
|
68
|
-
default?: undefined;
|
|
69
|
-
} | {
|
|
70
|
-
label: string;
|
|
71
|
-
value: string;
|
|
72
|
-
default: boolean;
|
|
73
|
-
})[] | undefined;
|
|
74
|
-
} | undefined): JSX.Element;
|
|
58
|
+
(props?: unknown): JSX.Element;
|
|
75
59
|
propTypes: unknown;
|
|
76
60
|
toTypescript: () => import("react-desc").TypescriptSchema;
|
|
77
61
|
};
|