@fluentui/react-spinbutton 0.0.0-nightly-20220511-0419.1 → 0.0.0-nightly-20220516-0419.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (46) hide show
  1. package/CHANGELOG.json +45 -21
  2. package/CHANGELOG.md +15 -11
  3. package/dist/index.d.ts +0 -17
  4. package/{lib → dist}/tsdoc-metadata.json +0 -0
  5. package/lib/components/SpinButton/SpinButton.types.js.map +1 -1
  6. package/lib/components/SpinButton/useSpinButton.js +3 -5
  7. package/lib/components/SpinButton/useSpinButton.js.map +1 -1
  8. package/lib/components/SpinButton/useSpinButtonStyles.js +4 -8
  9. package/lib/components/SpinButton/useSpinButtonStyles.js.map +1 -1
  10. package/lib/index.js.map +1 -1
  11. package/lib-commonjs/components/SpinButton/useSpinButton.js +3 -6
  12. package/lib-commonjs/components/SpinButton/useSpinButton.js.map +1 -1
  13. package/lib-commonjs/components/SpinButton/useSpinButtonStyles.js +4 -8
  14. package/lib-commonjs/components/SpinButton/useSpinButtonStyles.js.map +1 -1
  15. package/lib-commonjs/index.js.map +1 -1
  16. package/package.json +9 -9
  17. package/lib/SpinButton.d.ts +0 -1
  18. package/lib/components/SpinButton/SpinButton.d.ts +0 -6
  19. package/lib/components/SpinButton/SpinButton.strings.d.ts +0 -2
  20. package/lib/components/SpinButton/SpinButton.strings.js +0 -5
  21. package/lib/components/SpinButton/SpinButton.strings.js.map +0 -1
  22. package/lib/components/SpinButton/SpinButton.types.d.ts +0 -140
  23. package/lib/components/SpinButton/index.d.ts +0 -5
  24. package/lib/components/SpinButton/renderSpinButton.d.ts +0 -5
  25. package/lib/components/SpinButton/useSpinButton.d.ts +0 -12
  26. package/lib/components/SpinButton/useSpinButtonStyles.d.ts +0 -7
  27. package/lib/index.d.ts +0 -2
  28. package/lib/utils/clamp.d.ts +0 -1
  29. package/lib/utils/getBound.d.ts +0 -2
  30. package/lib/utils/index.d.ts +0 -3
  31. package/lib/utils/precision.d.ts +0 -14
  32. package/lib-commonjs/SpinButton.d.ts +0 -1
  33. package/lib-commonjs/components/SpinButton/SpinButton.d.ts +0 -6
  34. package/lib-commonjs/components/SpinButton/SpinButton.strings.d.ts +0 -2
  35. package/lib-commonjs/components/SpinButton/SpinButton.strings.js +0 -11
  36. package/lib-commonjs/components/SpinButton/SpinButton.strings.js.map +0 -1
  37. package/lib-commonjs/components/SpinButton/SpinButton.types.d.ts +0 -140
  38. package/lib-commonjs/components/SpinButton/index.d.ts +0 -5
  39. package/lib-commonjs/components/SpinButton/renderSpinButton.d.ts +0 -5
  40. package/lib-commonjs/components/SpinButton/useSpinButton.d.ts +0 -12
  41. package/lib-commonjs/components/SpinButton/useSpinButtonStyles.d.ts +0 -7
  42. package/lib-commonjs/index.d.ts +0 -2
  43. package/lib-commonjs/utils/clamp.d.ts +0 -1
  44. package/lib-commonjs/utils/getBound.d.ts +0 -2
  45. package/lib-commonjs/utils/index.d.ts +0 -3
  46. package/lib-commonjs/utils/precision.d.ts +0 -14
@@ -1,140 +0,0 @@
1
- import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
2
- import * as React from 'react';
3
- export declare type SpinButtonSlots = {
4
- /**
5
- * The root element of SpinButton is a container `<div>`.
6
- * The root slot receives the `className` and `style` specified on the `<SpinButton>`.
7
- * All other native props are applied to the primary slot: `input`.
8
- */
9
- root: NonNullable<Slot<'span'>>;
10
- /**
11
- * Input that displays the current value and accepts direct input from the user.
12
- * Displayed value is formatted.
13
- *
14
- * This is the primary slot.
15
- */
16
- input: NonNullable<Slot<'input'>>;
17
- /**
18
- * Renders the increment control.
19
- */
20
- incrementButton: NonNullable<Slot<'button'>>;
21
- /**
22
- * Renders the decrement control.
23
- */
24
- decrementButton: NonNullable<Slot<'button'>>;
25
- };
26
- /**
27
- * SpinButton Props
28
- */
29
- export declare type SpinButtonProps = Omit<ComponentProps<Partial<SpinButtonSlots>, 'input'>, 'onChange' | 'size'> & {
30
- /**
31
- * Controls the colors and borders of the input.
32
- * @default 'outline'
33
- */
34
- appearance?: 'outline' | 'underline' | 'filledDarker' | 'filledLighter';
35
- /**
36
- * Initial value of the control (assumed to be valid). Updates to this prop will not be respected.
37
- *
38
- * Use this if you intend for the SpinButton to be an uncontrolled component which maintains its
39
- * own value. For a controlled component, use `value` instead. (Mutually exclusive with `value`.)
40
- */
41
- defaultValue?: number;
42
- /**
43
- * String representation of `value`.
44
- *
45
- * Use this when displaying the value to users as something other than a plain number.
46
- * For example, when displaying currency values this might be "$1.00" when value is `1`.
47
- *
48
- * Only provide this if the SpinButton is a controlled component where you are maintaining its
49
- * current state and passing updates based on change events. When SpinButton is used as an
50
- * uncontrolled component this prop is ignored.
51
- */
52
- displayValue?: string;
53
- /**
54
- * Max value of the control. If not provided, the control has no maximum value.
55
- */
56
- max?: number;
57
- /**
58
- * Min value of the control. If not provided, the control has no minimum value.
59
- */
60
- min?: number;
61
- /**
62
- * Callback for when the committed value changes.
63
- * - User presses the up/down buttons (on single press or every spin)
64
- * - User presses the up/down arrow keys (on single press or every spin)
65
- * - User *commits* edits to the input text by focusing away (blurring) or pressing enter.
66
- * Note that this is NOT called for every key press while the user is editing.
67
- */
68
- onChange?: (event: SpinButtonChangeEvent, data: SpinButtonOnChangeData) => void;
69
- /**
70
- * How many decimal places the value should be rounded to.
71
- *
72
- * The default is calculated based on the precision of `step`: i.e. if step = 1, precision = 0.
73
- * step = 0.0089, precision = 4. step = 300, precision = 2. step = 23.00, precision = 2.
74
- */
75
- precision?: number;
76
- /**
77
- * Size of the input.
78
- * @default 'medium'
79
- */
80
- size?: 'small' | 'medium';
81
- /**
82
- * Difference between two adjacent values of the control.
83
- * This value is used to calculate the precision of the input if no `precision` is given.
84
- * The precision calculated this way will always be greater than or equal 0.
85
- * @default 1
86
- */
87
- step?: number;
88
- /**
89
- * Large difference between two values. This should be greater than `step` and is used
90
- * when users hit the Page Up or Page Down keys.
91
- * @default 1
92
- */
93
- stepPage?: number;
94
- /**
95
- * Strings for localizing text in the control.
96
- */
97
- strings?: SpinButtonStrings;
98
- /**
99
- * Current value of the control (assumed to be valid).
100
- *
101
- * Only provide this if the SpinButton is a controlled component where you are maintaining its
102
- * current state and passing updates based on change events; otherwise, use the `defaultValue`
103
- * property. (Mutually exclusive with `defaultValue`.)
104
- */
105
- value?: number;
106
- };
107
- /**
108
- * State used in rendering SpinButton
109
- */
110
- export declare type SpinButtonState = ComponentState<SpinButtonSlots> & Required<Pick<SpinButtonProps, 'appearance' | 'size'>> & {
111
- /**
112
- * State used to track which direction, if any, SpinButton is currently spinning.
113
- * @default 'rest'
114
- */
115
- spinState: SpinButtonSpinState;
116
- /**
117
- * State used to track if the value is at the range bounds of [min-max].
118
- * @default 'none'
119
- */
120
- atBound: SpinButtonBounds;
121
- };
122
- export declare type SpinButtonChangeEvent = React.MouseEvent<HTMLButtonElement> | React.ChangeEvent<HTMLElement> | React.FocusEvent<HTMLInputElement> | React.KeyboardEvent<HTMLInputElement>;
123
- export declare type SpinButtonOnChangeData = {
124
- value?: number;
125
- displayValue?: string;
126
- };
127
- export declare type SpinButtonSpinState = 'rest' | 'up' | 'down';
128
- export declare type SpinButtonBounds = 'none' | 'min' | 'max' | 'both';
129
- export declare type SpinButtonStrings = {
130
- /**
131
- * Label applied to the increment button.
132
- * Can include the token "\{step\}" which will be replaced with the value of the `step` prop.
133
- */
134
- incrementButtonLabel: string;
135
- /**
136
- * Label applied to the decrement button.
137
- * Can include the token "\{step\}" which will be replaced with the value of the `step` prop.
138
- */
139
- decrementButtonLabel: string;
140
- };
@@ -1,5 +0,0 @@
1
- export * from './SpinButton';
2
- export * from './SpinButton.types';
3
- export * from './renderSpinButton';
4
- export * from './useSpinButton';
5
- export * from './useSpinButtonStyles';
@@ -1,5 +0,0 @@
1
- import type { SpinButtonState } from './SpinButton.types';
2
- /**
3
- * Render the final JSX of SpinButton
4
- */
5
- export declare const renderSpinButton_unstable: (state: SpinButtonState) => JSX.Element;
@@ -1,12 +0,0 @@
1
- import * as React from 'react';
2
- import { SpinButtonProps, SpinButtonState } from './SpinButton.types';
3
- /**
4
- * Create the state required to render SpinButton.
5
- *
6
- * The returned state can be modified with hooks such as useSpinButtonStyles_unstable,
7
- * before being passed to renderSpinButton_unstable.
8
- *
9
- * @param props - props from this instance of SpinButton
10
- * @param ref - reference to root HTMLElement of SpinButton
11
- */
12
- export declare const useSpinButton_unstable: (props: SpinButtonProps, ref: React.Ref<HTMLInputElement>) => SpinButtonState;
@@ -1,7 +0,0 @@
1
- import { SlotClassNames } from '@fluentui/react-utilities';
2
- import type { SpinButtonSlots, SpinButtonState } from './SpinButton.types';
3
- export declare const spinButtonClassNames: SlotClassNames<SpinButtonSlots>;
4
- /**
5
- * Apply styling to the SpinButton slots based on the state
6
- */
7
- export declare const useSpinButtonStyles_unstable: (state: SpinButtonState) => SpinButtonState;
@@ -1,2 +0,0 @@
1
- export { SpinButton, renderSpinButton_unstable, spinButtonClassNames, useSpinButtonStyles_unstable, useSpinButton_unstable, } from './SpinButton';
2
- export type { SpinButtonOnChangeData, SpinButtonChangeEvent, SpinButtonProps, SpinButtonSlots, SpinButtonState, SpinButtonSpinState, SpinButtonBounds, SpinButtonStrings, } from './SpinButton';
@@ -1 +0,0 @@
1
- export declare const clampWhenInRange: (oldValue: number, newValue: number, min?: number | undefined, max?: number | undefined) => number;
@@ -1,2 +0,0 @@
1
- import type { SpinButtonBounds } from '../SpinButton';
2
- export declare const getBound: (value: number, min?: number | undefined, max?: number | undefined) => SpinButtonBounds;
@@ -1,3 +0,0 @@
1
- export * from './clamp';
2
- export * from './getBound';
3
- export * from './precision';
@@ -1,14 +0,0 @@
1
- /**
2
- * Calculates a number's precision based on the number of trailing
3
- * zeros if the number does not have a decimal indicated by a negative
4
- * precision. Otherwise, it calculates the number of digits after
5
- * the decimal point indicated by a positive precision.
6
- * @param value - the value to determine the precision of
7
- */
8
- export declare function calculatePrecision(value: number | string): number;
9
- /**
10
- * Rounds a number to a certain level of precision. Accepts negative precision.
11
- * @param value - The value that is being rounded.
12
- * @param precision - The number of decimal places to round the number to
13
- */
14
- export declare function precisionRound(value: number, precision: number, base?: number): number;