@fluentui/react-spinbutton 0.0.0-nightly-20230223-2115.1 → 0.0.0-nightly-20230228-0425.1
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/CHANGELOG.json +17 -17
- package/CHANGELOG.md +11 -11
- package/lib/SpinButton.js.map +1 -1
- package/lib/SpinButtonField.js.map +1 -1
- package/lib/components/SpinButton/SpinButton.js.map +1 -1
- package/lib/components/SpinButton/SpinButton.types.js +1 -2
- package/lib/components/SpinButton/SpinButton.types.js.map +1 -1
- package/lib/components/SpinButton/index.js.map +1 -1
- package/lib/components/SpinButton/renderSpinButton.js +9 -2
- package/lib/components/SpinButton/renderSpinButton.js.map +1 -1
- package/lib/components/SpinButton/useSpinButton.js +8 -7
- package/lib/components/SpinButton/useSpinButton.js.map +1 -1
- package/lib/components/SpinButton/useSpinButtonStyles.js.map +1 -1
- package/lib/components/SpinButtonField/SpinButtonField.js +2 -1
- package/lib/components/SpinButtonField/SpinButtonField.js.map +1 -1
- package/lib/components/SpinButtonField/index.js.map +1 -1
- package/lib/index.js.map +1 -1
- package/lib/utils/clamp.js.map +1 -1
- package/lib/utils/getBound.js.map +1 -1
- package/lib/utils/index.js.map +1 -1
- package/lib/utils/precision.js +8 -8
- package/lib/utils/precision.js.map +1 -1
- package/lib-commonjs/SpinButton.js +4 -5
- package/lib-commonjs/SpinButton.js.map +1 -1
- package/lib-commonjs/SpinButtonField.js +4 -5
- package/lib-commonjs/SpinButtonField.js.map +1 -1
- package/lib-commonjs/components/SpinButton/SpinButton.js +15 -16
- package/lib-commonjs/components/SpinButton/SpinButton.js.map +1 -1
- package/lib-commonjs/components/SpinButton/SpinButton.types.js +2 -6
- package/lib-commonjs/components/SpinButton/SpinButton.types.js.map +1 -1
- package/lib-commonjs/components/SpinButton/index.js +8 -9
- package/lib-commonjs/components/SpinButton/index.js.map +1 -1
- package/lib-commonjs/components/SpinButton/renderSpinButton.js +43 -34
- package/lib-commonjs/components/SpinButton/renderSpinButton.js.map +1 -1
- package/lib-commonjs/components/SpinButton/useSpinButton.js +259 -246
- package/lib-commonjs/components/SpinButton/useSpinButton.js.map +1 -1
- package/lib-commonjs/components/SpinButton/useSpinButtonStyles.js +246 -506
- package/lib-commonjs/components/SpinButton/useSpinButtonStyles.js.map +1 -1
- package/lib-commonjs/components/SpinButtonField/SpinButtonField.js +11 -17
- package/lib-commonjs/components/SpinButtonField/SpinButtonField.js.map +1 -1
- package/lib-commonjs/components/SpinButtonField/index.js +4 -5
- package/lib-commonjs/components/SpinButtonField/index.js.map +1 -1
- package/lib-commonjs/index.js +49 -21
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/utils/clamp.js +21 -28
- package/lib-commonjs/utils/clamp.js.map +1 -1
- package/lib-commonjs/utils/getBound.js +14 -16
- package/lib-commonjs/utils/getBound.js.map +1 -1
- package/lib-commonjs/utils/index.js +6 -7
- package/lib-commonjs/utils/index.js.map +1 -1
- package/lib-commonjs/utils/precision.js +34 -35
- package/lib-commonjs/utils/precision.js.map +1 -1
- package/package.json +10 -10
- package/.swcrc +0 -33
package/lib/utils/precision.js
CHANGED
@@ -4,13 +4,14 @@
|
|
4
4
|
* precision. Otherwise, it calculates the number of digits after
|
5
5
|
* the decimal point indicated by a positive precision.
|
6
6
|
* @param value - the value to determine the precision of
|
7
|
-
*/
|
7
|
+
*/
|
8
|
+
export function calculatePrecision(value) {
|
8
9
|
/**
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
10
|
+
* Group 1:
|
11
|
+
* [1-9]([0]+$) matches trailing zeros
|
12
|
+
* Group 2:
|
13
|
+
* \.([0-9]*) matches all digits after a decimal point.
|
14
|
+
*/
|
14
15
|
const groups = /[1-9]([0]+$)|\.([0-9]*)/.exec(String(value));
|
15
16
|
if (!groups) {
|
16
17
|
return 0;
|
@@ -28,8 +29,7 @@
|
|
28
29
|
* @param value - The value that is being rounded.
|
29
30
|
* @param precision - The number of decimal places to round the number to
|
30
31
|
*/
|
31
|
-
export function precisionRound(value, precision) {
|
32
|
-
let base = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : 10;
|
32
|
+
export function precisionRound(value, precision, base = 10) {
|
33
33
|
const exp = Math.pow(base, precision);
|
34
34
|
return Math.round(value * exp) / exp;
|
35
35
|
}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"mappings":"AAAA
|
1
|
+
{"version":3,"mappings":"AAAA;;;;;;;AAOA,OAAM,SAAUA,kBAAkB,CAACC,KAAsB;EACvD;;;;;;EAMA,MAAMC,MAAM,GAAG,yBAAyB,CAACC,IAAI,CAACC,MAAM,CAACH,KAAK,CAAC,CAAC;EAC5D,IAAI,CAACC,MAAM,EAAE;IACX,OAAO,CAAC;;EAEV,IAAIA,MAAM,CAAC,CAAC,CAAC,EAAE;IACb,OAAO,CAACA,MAAM,CAAC,CAAC,CAAC,CAACG,MAAM;;EAE1B,IAAIH,MAAM,CAAC,CAAC,CAAC,EAAE;IACb,OAAOA,MAAM,CAAC,CAAC,CAAC,CAACG,MAAM;;EAEzB,OAAO,CAAC;AACV;AAEA;;;;;AAKA,OAAM,SAAUC,cAAc,CAACL,KAAa,EAAEM,SAAiB,EAAEC,OAAe,EAAE;EAChF,MAAMC,GAAG,GAAGC,IAAI,CAACC,GAAG,CAACH,IAAI,EAAED,SAAS,CAAC;EACrC,OAAOG,IAAI,CAACE,KAAK,CAACX,KAAK,GAAGQ,GAAG,CAAC,GAAGA,GAAG;AACtC","names":["calculatePrecision","value","groups","exec","String","length","precisionRound","precision","base","exp","Math","pow","round"],"sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-spinbutton/src/utils/precision.ts"],"sourcesContent":["/**\n * Calculates a number's precision based on the number of trailing\n * zeros if the number does not have a decimal indicated by a negative\n * precision. Otherwise, it calculates the number of digits after\n * the decimal point indicated by a positive precision.\n * @param value - the value to determine the precision of\n */\nexport function calculatePrecision(value: number | string): number {\n /**\n * Group 1:\n * [1-9]([0]+$) matches trailing zeros\n * Group 2:\n * \\.([0-9]*) matches all digits after a decimal point.\n */\n const groups = /[1-9]([0]+$)|\\.([0-9]*)/.exec(String(value));\n if (!groups) {\n return 0;\n }\n if (groups[1]) {\n return -groups[1].length;\n }\n if (groups[2]) {\n return groups[2].length;\n }\n return 0;\n}\n\n/**\n * Rounds a number to a certain level of precision. Accepts negative precision.\n * @param value - The value that is being rounded.\n * @param precision - The number of decimal places to round the number to\n */\nexport function precisionRound(value: number, precision: number, base: number = 10): number {\n const exp = Math.pow(base, precision);\n return Math.round(value * exp) / exp;\n}\n"]}
|
@@ -1,9 +1,8 @@
|
|
1
1
|
"use strict";
|
2
|
+
|
2
3
|
Object.defineProperty(exports, "__esModule", {
|
3
|
-
|
4
|
+
value: true
|
4
5
|
});
|
5
|
-
const
|
6
|
-
|
7
|
-
//# sourceMappingURL=SpinButton.js.map
|
8
|
-
|
6
|
+
const tslib_1 = /*#__PURE__*/require("tslib");
|
7
|
+
tslib_1.__exportStar(require("./components/SpinButton/index"), exports);
|
9
8
|
//# sourceMappingURL=SpinButton.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"","sources":["../../../../../../../packages/react-components/react-spinbutton/src/SpinButton.ts"],"sourcesContent":["export * from './components/SpinButton/index';\n"]}
|
@@ -1,9 +1,8 @@
|
|
1
1
|
"use strict";
|
2
|
+
|
2
3
|
Object.defineProperty(exports, "__esModule", {
|
3
|
-
|
4
|
+
value: true
|
4
5
|
});
|
5
|
-
const
|
6
|
-
|
7
|
-
//# sourceMappingURL=SpinButtonField.js.map
|
8
|
-
|
6
|
+
const tslib_1 = /*#__PURE__*/require("tslib");
|
7
|
+
tslib_1.__exportStar(require("./components/SpinButtonField/index"), exports);
|
9
8
|
//# sourceMappingURL=SpinButtonField.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"","sources":["../../../../../../../packages/react-components/react-spinbutton/src/SpinButtonField.ts"],"sourcesContent":["export * from './components/SpinButtonField/index';\n"]}
|
@@ -1,21 +1,20 @@
|
|
1
1
|
"use strict";
|
2
|
+
|
2
3
|
Object.defineProperty(exports, "__esModule", {
|
3
|
-
|
4
|
-
});
|
5
|
-
Object.defineProperty(exports, "SpinButton", {
|
6
|
-
enumerable: true,
|
7
|
-
get: ()=>SpinButton
|
4
|
+
value: true
|
8
5
|
});
|
9
|
-
|
10
|
-
const
|
11
|
-
const
|
12
|
-
const
|
13
|
-
const
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
6
|
+
exports.SpinButton = void 0;
|
7
|
+
const React = /*#__PURE__*/require("react");
|
8
|
+
const useSpinButton_1 = /*#__PURE__*/require("./useSpinButton");
|
9
|
+
const renderSpinButton_1 = /*#__PURE__*/require("./renderSpinButton");
|
10
|
+
const useSpinButtonStyles_1 = /*#__PURE__*/require("./useSpinButtonStyles");
|
11
|
+
/**
|
12
|
+
* A SpinButton allows someone to incrementally adjust a value in small steps.
|
13
|
+
*/
|
14
|
+
exports.SpinButton = /*#__PURE__*/React.forwardRef((props, ref) => {
|
15
|
+
const state = useSpinButton_1.useSpinButton_unstable(props, ref);
|
16
|
+
useSpinButtonStyles_1.useSpinButtonStyles_unstable(state);
|
17
|
+
return renderSpinButton_1.renderSpinButton_unstable(state);
|
18
18
|
});
|
19
|
-
SpinButton.displayName = 'SpinButton';
|
20
|
-
|
19
|
+
exports.SpinButton.displayName = 'SpinButton';
|
21
20
|
//# sourceMappingURL=SpinButton.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"mappings":";;;;;;AAAA;AACA;AACA;AACA;AAIA;;;AAGaA,kBAAU,gBAAyCC,KAAK,CAACC,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAC9F,MAAMC,KAAK,GAAGC,sCAAsB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAEhDG,kDAA4B,CAACF,KAAK,CAAC;EACnC,OAAOG,4CAAyB,CAACH,KAAK,CAAC;AACzC,CAAC,CAAC;AAEFL,kBAAU,CAACS,WAAW,GAAG,YAAY","names":["exports","React","forwardRef","props","ref","state","useSpinButton_1","useSpinButtonStyles_1","renderSpinButton_1","displayName"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinbutton/src/components/SpinButton/SpinButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSpinButton_unstable } from './useSpinButton';\nimport { renderSpinButton_unstable } from './renderSpinButton';\nimport { useSpinButtonStyles_unstable } from './useSpinButtonStyles';\nimport type { SpinButtonProps } from './SpinButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * A SpinButton allows someone to incrementally adjust a value in small steps.\n */\nexport const SpinButton: ForwardRefComponent<SpinButtonProps> = React.forwardRef((props, ref) => {\n const state = useSpinButton_unstable(props, ref);\n\n useSpinButtonStyles_unstable(state);\n return renderSpinButton_unstable(state);\n});\n\nSpinButton.displayName = 'SpinButton';\n"]}
|
@@ -1,10 +1,6 @@
|
|
1
|
-
// import { Input } from '@fluentui/react-input';
|
2
1
|
"use strict";
|
2
|
+
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
|
-
|
4
|
+
value: true
|
5
5
|
});
|
6
|
-
const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
|
7
|
-
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
8
|
-
//# sourceMappingURL=SpinButton.types.js.map
|
9
|
-
|
10
6
|
//# sourceMappingURL=SpinButton.types.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"mappings":"","names":[],"sourceRoot":"","sources":[],"sourcesContent":[]}
|
@@ -1,13 +1,12 @@
|
|
1
1
|
"use strict";
|
2
|
+
|
2
3
|
Object.defineProperty(exports, "__esModule", {
|
3
|
-
|
4
|
+
value: true
|
4
5
|
});
|
5
|
-
const
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
//# sourceMappingURL=index.js.map
|
12
|
-
|
6
|
+
const tslib_1 = /*#__PURE__*/require("tslib");
|
7
|
+
tslib_1.__exportStar(require("./SpinButton"), exports);
|
8
|
+
tslib_1.__exportStar(require("./SpinButton.types"), exports);
|
9
|
+
tslib_1.__exportStar(require("./renderSpinButton"), exports);
|
10
|
+
tslib_1.__exportStar(require("./useSpinButton"), exports);
|
11
|
+
tslib_1.__exportStar(require("./useSpinButtonStyles"), exports);
|
13
12
|
//# sourceMappingURL=index.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"mappings":";;;;;;AAAAA;AACAA;AACAA;AACAA;AACAA","names":["tslib_1"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinbutton/src/components/SpinButton/index.ts"],"sourcesContent":["export * from './SpinButton';\nexport * from './SpinButton.types';\nexport * from './renderSpinButton';\nexport * from './useSpinButton';\nexport * from './useSpinButtonStyles';\n"]}
|
@@ -1,38 +1,47 @@
|
|
1
1
|
"use strict";
|
2
|
+
|
2
3
|
Object.defineProperty(exports, "__esModule", {
|
3
|
-
|
4
|
-
});
|
5
|
-
Object.defineProperty(exports, "renderSpinButton_unstable", {
|
6
|
-
enumerable: true,
|
7
|
-
get: ()=>renderSpinButton_unstable
|
4
|
+
value: true
|
8
5
|
});
|
9
|
-
|
10
|
-
const
|
11
|
-
const
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
6
|
+
exports.renderSpinButton_unstable = void 0;
|
7
|
+
const React = /*#__PURE__*/require("react");
|
8
|
+
const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
9
|
+
/**
|
10
|
+
* Render the final JSX of SpinButton
|
11
|
+
*/
|
12
|
+
const renderSpinButton_unstable = state => {
|
13
|
+
// Leaving this here for now.
|
14
|
+
// This is the approach using react-input's Input component.
|
15
|
+
// It has some Typescript problems and feels hacky.
|
16
|
+
// const { slots, slotProps } = getSlots<SpinButtonSlots>(state);
|
17
|
+
// const { contentAfter, ...otherInputSlotProps } = slotProps.input as SpinButtonSlots['input'];
|
18
|
+
// const inputContentAfter = {
|
19
|
+
// ...contentAfter,
|
20
|
+
// children: (
|
21
|
+
// <>
|
22
|
+
// <slots.incrementButton {...slotProps.incrementButton} />
|
23
|
+
// <slots.decrementButton {...slotProps.decrementButton} />
|
24
|
+
// </>
|
25
|
+
// ),
|
26
|
+
// };
|
27
|
+
// return (
|
28
|
+
// <slots.root {...slotProps.root}>
|
29
|
+
// <slots.input {...otherInputSlotProps} contentAfter={inputContentAfter}/>
|
30
|
+
// </slots.root>
|
31
|
+
// );
|
32
|
+
const {
|
33
|
+
slots,
|
34
|
+
slotProps
|
35
|
+
} = react_utilities_1.getSlots(state);
|
36
|
+
return React.createElement(slots.root, {
|
37
|
+
...slotProps.root
|
38
|
+
}, React.createElement(slots.input, {
|
39
|
+
...slotProps.input
|
40
|
+
}), React.createElement(slots.incrementButton, {
|
41
|
+
...slotProps.incrementButton
|
42
|
+
}), React.createElement(slots.decrementButton, {
|
43
|
+
...slotProps.decrementButton
|
44
|
+
}));
|
45
|
+
};
|
46
|
+
exports.renderSpinButton_unstable = renderSpinButton_unstable;
|
38
47
|
//# sourceMappingURL=renderSpinButton.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"mappings":";;;;;;AAAA;AACA;AAGA;;;AAGO,MAAMA,yBAAyB,GAAIC,KAAsB,IAAI;EAClE;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EAEA,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGC,0BAAQ,CAAkBH,KAAK,CAAC;EAE7D,OACEI,oBAACH,KAAK,CAACI,IAAI;IAAA,GAAKH,SAAS,CAACG;EAAI,GAC5BD,oBAACH,KAAK,CAACK,KAAK;IAAA,GAAKJ,SAAS,CAACI;EAAK,EAAI,EACpCF,oBAACH,KAAK,CAACM,eAAe;IAAA,GAAKL,SAAS,CAACK;EAAe,EAAI,EACxDH,oBAACH,KAAK,CAACO,eAAe;IAAA,GAAKN,SAAS,CAACM;EAAe,EAAI,CAC7C;AAEjB,CAAC;AAhCYC,iCAAyB","names":["renderSpinButton_unstable","state","slots","slotProps","react_utilities_1","React","root","input","incrementButton","decrementButton","exports"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinbutton/src/components/SpinButton/renderSpinButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { SpinButtonState, SpinButtonSlots } from './SpinButton.types';\n\n/**\n * Render the final JSX of SpinButton\n */\nexport const renderSpinButton_unstable = (state: SpinButtonState) => {\n // Leaving this here for now.\n // This is the approach using react-input's Input component.\n // It has some Typescript problems and feels hacky.\n // const { slots, slotProps } = getSlots<SpinButtonSlots>(state);\n\n // const { contentAfter, ...otherInputSlotProps } = slotProps.input as SpinButtonSlots['input'];\n // const inputContentAfter = {\n // ...contentAfter,\n // children: (\n // <>\n // <slots.incrementButton {...slotProps.incrementButton} />\n // <slots.decrementButton {...slotProps.decrementButton} />\n // </>\n // ),\n // };\n\n // return (\n // <slots.root {...slotProps.root}>\n // <slots.input {...otherInputSlotProps} contentAfter={inputContentAfter}/>\n // </slots.root>\n // );\n\n const { slots, slotProps } = getSlots<SpinButtonSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n <slots.input {...slotProps.input} />\n <slots.incrementButton {...slotProps.incrementButton} />\n <slots.decrementButton {...slotProps.decrementButton} />\n </slots.root>\n );\n};\n"]}
|