@arbor-education/design-system.components 0.3.2 → 0.3.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.
Files changed (22) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/components/formField/inputs/number/NumberInput.d.ts.map +1 -1
  3. package/dist/components/formField/inputs/number/NumberInput.js +21 -12
  4. package/dist/components/formField/inputs/number/NumberInput.js.map +1 -1
  5. package/dist/components/formField/inputs/number/NumberInput.test.js +92 -3
  6. package/dist/components/formField/inputs/number/NumberInput.test.js.map +1 -1
  7. package/dist/components/pill/Pill.d.ts +2 -1
  8. package/dist/components/pill/Pill.d.ts.map +1 -1
  9. package/dist/components/pill/Pill.js +2 -2
  10. package/dist/components/pill/Pill.js.map +1 -1
  11. package/dist/components/pill/Pill.stories.d.ts +8 -0
  12. package/dist/components/pill/Pill.stories.d.ts.map +1 -1
  13. package/dist/components/pill/Pill.stories.js +8 -0
  14. package/dist/components/pill/Pill.stories.js.map +1 -1
  15. package/dist/components/pill/Pill.test.js +9 -0
  16. package/dist/components/pill/Pill.test.js.map +1 -1
  17. package/package.json +2 -1
  18. package/src/components/formField/inputs/number/NumberInput.test.tsx +113 -3
  19. package/src/components/formField/inputs/number/NumberInput.tsx +26 -15
  20. package/src/components/pill/Pill.stories.tsx +9 -0
  21. package/src/components/pill/Pill.test.tsx +10 -0
  22. package/src/components/pill/Pill.tsx +3 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # Changelog
2
2
 
3
+ ## 0.3.3
4
+
5
+ ### Patch Changes
6
+
7
+ - [#114](https://github.com/arbor-education/design-system.components/pull/114) [`822127f`](https://github.com/arbor-education/design-system.components/commit/822127f4347917e5b22e45bad332e25cca0470d1) Thanks [@MarkFrancisArbor](https://github.com/MarkFrancisArbor)! - MIS-68387 Pill component requires initialValue property
8
+
9
+ - [#112](https://github.com/arbor-education/design-system.components/pull/112) [`847365a`](https://github.com/arbor-education/design-system.components/commit/847365a679a3733238983daf6d672906433895b8) Thanks [@AmeeMorris](https://github.com/AmeeMorris)! - MIS-68357 Fix floating point issues in NumberInput
10
+
3
11
  ## 0.3.2
4
12
 
5
13
  ### Patch Changes
package/dist/components/formField/inputs/number/NumberInput.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"NumberInput.d.ts","sourceRoot":"","sources":["../../../../../src/components/formField/inputs/number/NumberInput.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAiD,KAAK,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAEhG,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B,GAAG,mBAAmB,CAAC,gBAAgB,CAAC,CAAC;AAE1C,eAAO,MAAM,WAAW,GAAI,OAAO,gBAAgB,4CA+GlD,CAAC"}
1
+ {"version":3,"file":"NumberInput.d.ts","sourceRoot":"","sources":["../../../../../src/components/formField/inputs/number/NumberInput.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAiD,KAAK,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAEhG,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B,GAAG,mBAAmB,CAAC,gBAAgB,CAAC,CAAC;AAE1C,eAAO,MAAM,WAAW,GAAI,OAAO,gBAAgB,4CAyHlD,CAAC"}
package/dist/components/formField/inputs/number/NumberInput.js CHANGED
@@ -1,9 +1,10 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import classNames from 'classnames';
3
3
  import { Icon } from '../../../icon/Icon';
4
+ import Decimal from 'decimal.js';
4
5
  import { useEffect, useRef, useState } from 'react';
5
6
  export const NumberInput = (props) => {
6
- const { hasError, className = '', disabled, onChange, defaultValue = '', step = 1, min, max, disableSpinners, containerClassName, value: passedValue = '', ...rest } = props;
7
+ const { hasError, className = '', disabled, onChange, defaultValue = '', step = 1, min = -Infinity, max = Infinity, disableSpinners, containerClassName, value: passedValue = '', ...rest } = props;
7
8
  const [value, setValue] = useState(defaultValue.toString() || passedValue.toString());
8
9
  const inputRef = useRef(null);
9
10
  useEffect(() => {
@@ -18,27 +19,35 @@ export const NumberInput = (props) => {
18
19
  }
19
20
  }, [value]);
20
21
  const inputClasses = classNames('ds-input', 'ds-number-input', className);
21
- const handleSpinner = (step) => {
22
- const currentValue = isNaN(Number(value)) ? 0 : Number(value);
23
- const newValue = (currentValue + Number(step)).toString();
24
- handleOnChange(newValue);
25
- };
26
22
  const handleOnChange = (newValue) => {
27
23
  if (newValue !== value) {
28
24
  setValue(newValue);
29
25
  }
30
26
  };
31
- const handleOnBlur = () => {
32
- if (min !== undefined && Number(value) < Number(min)) {
33
- setValue(min.toString());
27
+ const checkOverOrUnderMaxOrMin = (newValue) => {
28
+ const decimalValue = new Decimal(newValue || 0);
29
+ const decimalMax = new Decimal(max || 0);
30
+ const decimalMin = new Decimal(min || 0);
31
+ if (decimalValue.lessThan(decimalMin)) {
32
+ return handleOnChange(min.toString());
34
33
  }
35
- if (max !== undefined && Number(value) > Number(max)) {
36
- setValue(max.toString());
34
+ if (decimalValue.greaterThan(decimalMax)) {
35
+ return handleOnChange(max.toString());
37
36
  }
37
+ return handleOnChange(newValue);
38
+ };
39
+ const handleSpinner = (step) => {
40
+ const decimalValue = new Decimal(value || 0);
41
+ const decimalStep = new Decimal(step);
42
+ const newValue = decimalValue.plus(decimalStep).toString();
43
+ checkOverOrUnderMaxOrMin(newValue);
44
+ };
45
+ const handleOnBlur = () => {
46
+ checkOverOrUnderMaxOrMin(value);
38
47
  };
39
48
  return (_jsxs("div", { className: classNames('ds-number-input__container', {
40
49
  'ds-number-input__container--error': hasError,
41
50
  'ds-number-input__container--disabled': disabled,
42
- }, containerClassName), children: [!disableSpinners && (_jsx("button", { className: "ds-number-input__spinner-button", type: "button", disabled: disabled || (min !== undefined && Number(value) <= Number(min)), onClick: () => handleSpinner(-step), "aria-label": "Minus button", "data-testid": "minus-button", children: _jsx(Icon, { name: "minus", size: 12 }) })), _jsx("input", { ref: inputRef, type: "text", inputMode: "numeric", autoComplete: "off", pattern: "^[+\\-]?\\d+(,\\d{2})?", className: inputClasses, disabled: disabled, defaultValue: defaultValue, onChange: (e) => handleOnChange(e.currentTarget.value), onBlur: handleOnBlur, step: step, min: min, max: max, ...rest }), !disableSpinners && (_jsx("button", { className: "ds-number-input__spinner-button", type: "button", disabled: disabled || (max !== undefined && Number(value) >= Number(max)), onClick: () => handleSpinner(step), "aria-label": "Plus button", "data-testid": "plus-button", children: _jsx(Icon, { name: "plus", size: 12 }) }))] }));
51
+ }, containerClassName), children: [!disableSpinners && (_jsx("button", { className: "ds-number-input__spinner-button", type: "button", disabled: disabled || (Number(value) <= Number(min)), onClick: () => handleSpinner(-step), "aria-label": "Minus button", "data-testid": "minus-button", children: _jsx(Icon, { name: "minus", size: 12 }) })), _jsx("input", { ref: inputRef, type: "text", inputMode: "numeric", autoComplete: "off", pattern: "^[+\\-]?\\d+(,\\d{2})?", className: inputClasses, disabled: disabled, defaultValue: defaultValue, onChange: (e) => handleOnChange(e.currentTarget.value), onBlur: handleOnBlur, step: step, min: min, max: max, ...rest }), !disableSpinners && (_jsx("button", { className: "ds-number-input__spinner-button", type: "button", disabled: disabled || (Number(value) >= Number(max)), onClick: () => handleSpinner(step), "aria-label": "Plus button", "data-testid": "plus-button", children: _jsx(Icon, { name: "plus", size: 12 }) }))] }));
43
52
  };
44
53
  //# sourceMappingURL=NumberInput.js.map
package/dist/components/formField/inputs/number/NumberInput.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"NumberInput.js","sourceRoot":"","sources":["../../../../../src/components/formField/inputs/number/NumberInput.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"NumberInput.js","sourceRoot":"","sources":["../../../../../src/components/formField/inputs/number/NumberInput.tsx"],"names":[],"mappings":"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"}
package/dist/components/formField/inputs/number/NumberInput.test.js CHANGED
@@ -19,12 +19,101 @@ describe('NumberInput component', () => {
19
19
  test('Spinner buttons change the value of the input', () => {
20
20
  render(_jsx(NumberInput, { placeholder: "Enter a number", defaultValue: "10", step: 2 }));
21
21
  const inputElement = screen.getByPlaceholderText('Enter a number');
22
- fireEvent.click(screen.getByTestId('minus-button'));
22
+ fireEvent.click(screen.getByLabelText('Minus button'));
23
23
  expect(inputElement.value).toBe('8');
24
- fireEvent.click(screen.getByTestId('plus-button'));
24
+ fireEvent.click(screen.getByLabelText('Plus button'));
25
25
  expect(inputElement.value).toBe('10');
26
- fireEvent.click(screen.getByTestId('plus-button'));
26
+ fireEvent.click(screen.getByLabelText('Plus button'));
27
27
  expect(inputElement.value).toBe('12');
28
28
  });
29
+ describe('Decimal value handling', () => {
30
+ test('handles decimal step values correctly', () => {
31
+ render(_jsx(NumberInput, { placeholder: "Enter a number", defaultValue: "0.5", step: 0.1 }));
32
+ const inputElement = screen.getByPlaceholderText('Enter a number');
33
+ fireEvent.click(screen.getByLabelText('Plus button'));
34
+ expect(inputElement.value).toBe('0.6');
35
+ fireEvent.click(screen.getByLabelText('Plus button'));
36
+ expect(inputElement.value).toBe('0.7');
37
+ fireEvent.click(screen.getByLabelText('Minus button'));
38
+ expect(inputElement.value).toBe('0.6');
39
+ });
40
+ test('handles common floating point precision issue (0.1 + 0.2 = 0.3)', () => {
41
+ render(_jsx(NumberInput, { placeholder: "Enter a number", defaultValue: "0.1", step: 0.2 }));
42
+ const inputElement = screen.getByPlaceholderText('Enter a number');
43
+ fireEvent.click(screen.getByLabelText('Plus button'));
44
+ // Should be exactly 0.3, not 0.30000000000000004
45
+ expect(inputElement.value).toBe('0.3');
46
+ });
47
+ test('handles multiple decimal operations without accumulating errors', () => {
48
+ render(_jsx(NumberInput, { placeholder: "Enter a number", defaultValue: "0", step: 0.1 }));
49
+ const inputElement = screen.getByPlaceholderText('Enter a number');
50
+ // Add 0.1 ten times - should equal 1.0
51
+ for (let i = 0; i < 10; i++) {
52
+ fireEvent.click(screen.getByLabelText('Plus button'));
53
+ }
54
+ expect(inputElement.value).toBe('1');
55
+ });
56
+ test('handles small decimal step values', () => {
57
+ render(_jsx(NumberInput, { placeholder: "Enter a number", defaultValue: "0.01", step: 0.01 }));
58
+ const inputElement = screen.getByPlaceholderText('Enter a number');
59
+ fireEvent.click(screen.getByLabelText('Plus button'));
60
+ expect(inputElement.value).toBe('0.02');
61
+ fireEvent.click(screen.getByLabelText('Plus button'));
62
+ expect(inputElement.value).toBe('0.03');
63
+ });
64
+ test('handles decimal values with min constraint', () => {
65
+ render(_jsx(NumberInput, { placeholder: "Enter a number", defaultValue: "0.5", step: 0.1, min: 0.3 }));
66
+ const inputElement = screen.getByPlaceholderText('Enter a number');
67
+ // Try to go below min
68
+ fireEvent.click(screen.getByLabelText('Minus button'));
69
+ fireEvent.click(screen.getByLabelText('Minus button'));
70
+ fireEvent.click(screen.getByLabelText('Minus button'));
71
+ // Should be clamped to min value
72
+ expect(inputElement.value).toBe('0.3');
73
+ });
74
+ test('handles decimal values with max constraint', () => {
75
+ render(_jsx(NumberInput, { placeholder: "Enter a number", defaultValue: "0.5", step: 0.1, max: 0.7 }));
76
+ const inputElement = screen.getByPlaceholderText('Enter a number');
77
+ // Try to go above max
78
+ fireEvent.click(screen.getByLabelText('Plus button'));
79
+ fireEvent.click(screen.getByLabelText('Plus button'));
80
+ fireEvent.click(screen.getByLabelText('Plus button'));
81
+ // Should be clamped to max value
82
+ expect(inputElement.value).toBe('0.7');
83
+ });
84
+ test('handles decimal input and validates on blur', () => {
85
+ render(_jsx(NumberInput, { placeholder: "Enter a number", defaultValue: "0.5", min: 0.1, max: 0.9 }));
86
+ const inputElement = screen.getByPlaceholderText('Enter a number');
87
+ // Enter a value below min
88
+ fireEvent.change(inputElement, { target: { value: '0.05' } });
89
+ fireEvent.blur(inputElement);
90
+ expect(inputElement.value).toBe('0.1');
91
+ // Enter a value above max
92
+ fireEvent.change(inputElement, { target: { value: '0.95' } });
93
+ fireEvent.blur(inputElement);
94
+ expect(inputElement.value).toBe('0.9');
95
+ });
96
+ test('handles decimal values with many decimal places', () => {
97
+ render(_jsx(NumberInput, { placeholder: "Enter a number", defaultValue: "0.123456", step: 0.000001 }));
98
+ const inputElement = screen.getByPlaceholderText('Enter a number');
99
+ fireEvent.click(screen.getByLabelText('Plus button'));
100
+ expect(inputElement.value).toBe('0.123457');
101
+ });
102
+ test('handles negative decimal values', () => {
103
+ render(_jsx(NumberInput, { placeholder: "Enter a number", defaultValue: "-0.5", step: 0.1 }));
104
+ const inputElement = screen.getByPlaceholderText('Enter a number');
105
+ fireEvent.click(screen.getByLabelText('Plus button'));
106
+ expect(inputElement.value).toBe('-0.4');
107
+ fireEvent.click(screen.getByLabelText('Minus button'));
108
+ expect(inputElement.value).toBe('-0.5');
109
+ });
110
+ test('handles decimal step that results in whole number', () => {
111
+ render(_jsx(NumberInput, { placeholder: "Enter a number", defaultValue: "0.9", step: 0.1 }));
112
+ const inputElement = screen.getByPlaceholderText('Enter a number');
113
+ fireEvent.click(screen.getByLabelText('Plus button'));
114
+ // Should be 1, not 1.0 or 0.9999999999999999
115
+ expect(inputElement.value).toBe('1');
116
+ });
117
+ });
29
118
  });
30
119
  //# sourceMappingURL=NumberInput.test.js.map
package/dist/components/formField/inputs/number/NumberInput.test.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"NumberInput.test.js","sourceRoot":"","sources":["../../../../../src/components/formField/inputs/number/NumberInput.test.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,EAAE,EAAE,MAAM,QAAQ,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AACnE,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,kCAAkC,CAAC;AAE1C,QAAQ,CAAC,uBAAuB,EAAE,GAAG,EAAE;IACrC,IAAI,CAAC,qBAAqB,EAAE,GAAG,EAAE;QAC/B,MAAM,CAAC,KAAC,WAAW,IAAC,WAAW,EAAC,gBAAgB,GAAG,CAAC,CAAC;QACrD,MAAM,CAAC,MAAM,CAAC,oBAAoB,CAAC,gBAAgB,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IAC5E,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,+CAA+C,EAAE,GAAG,EAAE;QACzD,MAAM,QAAQ,GAAG,EAAE,CAAC,EAAE,EAAE,CAAC;QACzB,MAAM,CAAC,KAAC,WAAW,IAAC,WAAW,EAAC,gBAAgB,EAAC,QAAQ,EAAE,QAAQ,GAAI,CAAC,CAAC;QACzE,MAAM,YAAY,GAAG,MAAM,CAAC,oBAAoB,CAAC,gBAAgB,CAAqB,CAAC;QAEvF,SAAS,CAAC,MAAM,CAAC,YAAY,EAAE,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,EAAE,CAAC,CAAC;QAC3D,MAAM,CAAC,QAAQ,CAAC,CAAC,gBAAgB,EAAE,CAAC;QACpC,MAAM,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACvC,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,+CAA+C,EAAE,GAAG,EAAE;QACzD,MAAM,CAAC,KAAC,WAAW,IAAC,WAAW,EAAC,gBAAgB,EAAC,YAAY,EAAC,IAAI,EAAC,IAAI,EAAE,CAAC,GAAI,CAAC,CAAC;QAChF,MAAM,YAAY,GAAG,MAAM,CAAC,oBAAoB,CAAC,gBAAgB,CAAqB,CAAC;QAEvF,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC,CAAC;QACpD,MAAM,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACrC,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC,CAAC;QACnD,MAAM,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACtC,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC,CAAC;QACnD,MAAM,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACxC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
1
+ {"version":3,"file":"NumberInput.test.js","sourceRoot":"","sources":["../../../../../src/components/formField/inputs/number/NumberInput.test.tsx"],"names":[],"mappings":"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"}
package/dist/components/pill/Pill.d.ts CHANGED
@@ -1,8 +1,9 @@
1
1
  type PillProps = {
2
2
  text: string;
3
+ initialValue?: boolean;
3
4
  checkbox?: boolean;
4
5
  onclick?: (checked: boolean) => void;
5
6
  };
6
- export declare const Pill: ({ text, checkbox, onclick }: PillProps) => import("react/jsx-runtime").JSX.Element;
7
+ export declare const Pill: ({ text, checkbox, onclick, initialValue }: PillProps) => import("react/jsx-runtime").JSX.Element;
7
8
  export {};
8
9
  //# sourceMappingURL=Pill.d.ts.map
package/dist/components/pill/Pill.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Pill.d.ts","sourceRoot":"","sources":["../../../src/components/pill/Pill.tsx"],"names":[],"mappings":"AAIA,KAAK,SAAS,GAAG;IACf,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;CACtC,CAAC;AAEF,eAAO,MAAM,IAAI,GAAI,6BAA6B,SAAS,4CAqC1D,CAAC"}
1
+ {"version":3,"file":"Pill.d.ts","sourceRoot":"","sources":["../../../src/components/pill/Pill.tsx"],"names":[],"mappings":"AAIA,KAAK,SAAS,GAAG;IACf,IAAI,EAAE,MAAM,CAAC;IACb,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;CACtC,CAAC;AAEF,eAAO,MAAM,IAAI,GAAI,2CAAmD,SAAS,4CAqChF,CAAC"}
package/dist/components/pill/Pill.js CHANGED
@@ -2,8 +2,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import classNames from 'classnames';
3
3
  import { CheckboxInput } from '../formField/inputs/checkbox/CheckboxInput';
4
4
  import { useEffect, useState } from 'react';
5
- export const Pill = ({ text, checkbox, onclick }) => {
6
- const [checked, setChecked] = useState(false);
5
+ export const Pill = ({ text, checkbox, onclick, initialValue = false }) => {
6
+ const [checked, setChecked] = useState(initialValue);
7
7
  const handlePillClick = () => {
8
8
  setChecked(prev => !prev);
9
9
  };
package/dist/components/pill/Pill.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Pill.js","sourceRoot":"","sources":["../../../src/components/pill/Pill.tsx"],"names":[],"mappings":";AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,aAAa,EAAE,MAAM,oDAAoD,CAAC;AACnF,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAQ5C,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAa,EAAE,EAAE;IAC7D,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE9C,MAAM,eAAe,GAAG,GAAG,EAAE;QAC3B,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC;IAC5B,CAAC,CAAC;IAEF,MAAM,mBAAmB,GAAG,CAAC,KAAuB,EAAE,EAAE;QACtD,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC;IAC5B,CAAC,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,OAAO,EAAE,CAAC;YACZ,OAAO,CAAC,OAAO,CAAC,CAAC;QACnB,CAAC;IACH,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC;IAEvB,OAAO,CACL,gBACE,OAAO,EAAE,eAAe,EACxB,SAAS,EAAE,UAAU,CACnB,SAAS,EACT,QAAQ,CAAC,CAAC,CAAC,EAAE,kBAAkB,EAAE,OAAO,EAAE,oBAAoB,EAAE,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,EAAE,iBAAiB,EAAE,OAAO,EAAE,mBAAmB,EAAE,CAAC,OAAO,EAAE,CAC3I,aAEA,QAAQ,IAAI,CACX,eAAM,SAAS,EAAE,UAAU,CAAC,mBAAmB,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,YACjF,KAAC,aAAa,IACZ,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,mBAAmB,GAC5B,GACG,CACR,EACA,IAAI,IACA,CACR,CAAC;AACJ,CAAC,CAAC"}
1
+ {"version":3,"file":"Pill.js","sourceRoot":"","sources":["../../../src/components/pill/Pill.tsx"],"names":[],"mappings":";AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,aAAa,EAAE,MAAM,oDAAoD,CAAC;AACnF,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAS5C,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,YAAY,GAAG,KAAK,EAAa,EAAE,EAAE;IACnF,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;IAErD,MAAM,eAAe,GAAG,GAAG,EAAE;QAC3B,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC;IAC5B,CAAC,CAAC;IAEF,MAAM,mBAAmB,GAAG,CAAC,KAAuB,EAAE,EAAE;QACtD,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC;IAC5B,CAAC,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,OAAO,EAAE,CAAC;YACZ,OAAO,CAAC,OAAO,CAAC,CAAC;QACnB,CAAC;IACH,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC;IAEvB,OAAO,CACL,gBACE,OAAO,EAAE,eAAe,EACxB,SAAS,EAAE,UAAU,CACnB,SAAS,EACT,QAAQ,CAAC,CAAC,CAAC,EAAE,kBAAkB,EAAE,OAAO,EAAE,oBAAoB,EAAE,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,EAAE,iBAAiB,EAAE,OAAO,EAAE,mBAAmB,EAAE,CAAC,OAAO,EAAE,CAC3I,aAEA,QAAQ,IAAI,CACX,eAAM,SAAS,EAAE,UAAU,CAAC,mBAAmB,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,YACjF,KAAC,aAAa,IACZ,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,mBAAmB,GAC5B,GACG,CACR,EACA,IAAI,IACA,CACR,CAAC;AACJ,CAAC,CAAC"}
package/dist/components/pill/Pill.stories.d.ts CHANGED
@@ -14,5 +14,13 @@ export declare const withCheckbox: {
14
14
  onclick: () => void;
15
15
  };
16
16
  };
17
+ export declare const preChecked: {
18
+ args: {
19
+ text: string;
20
+ initialValue: boolean;
21
+ checkbox: boolean;
22
+ onclick: () => void;
23
+ };
24
+ };
17
25
  export default meta;
18
26
  //# sourceMappingURL=Pill.stories.d.ts.map
package/dist/components/pill/Pill.stories.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Pill.stories.d.ts","sourceRoot":"","sources":["../../../src/components/pill/Pill.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAClD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAE9B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,IAAI,CAG3B,CAAC;AAEF,eAAO,MAAM,OAAO;;;;;CAKnB,CAAC;AAEF,eAAO,MAAM,YAAY;;;;;;CAMxB,CAAC;AAEF,eAAe,IAAI,CAAC"}
1
+ {"version":3,"file":"Pill.stories.d.ts","sourceRoot":"","sources":["../../../src/components/pill/Pill.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAClD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAE9B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,IAAI,CAG3B,CAAC;AAEF,eAAO,MAAM,OAAO;;;;;CAKnB,CAAC;AAEF,eAAO,MAAM,YAAY;;;;;;CAMxB,CAAC;AAEF,eAAO,MAAM,UAAU;;;;;;;CAOtB,CAAC;AAEF,eAAe,IAAI,CAAC"}
package/dist/components/pill/Pill.stories.js CHANGED
@@ -16,5 +16,13 @@ export const withCheckbox = {
16
16
  onclick: () => { console.log('Pill with checkbox clicked'); },
17
17
  },
18
18
  };
19
+ export const preChecked = {
20
+ args: {
21
+ text: 'Checkbox',
22
+ initialValue: true,
23
+ checkbox: true,
24
+ onclick: () => { console.log('Pill with checkbox clicked'); },
25
+ },
26
+ };
19
27
  export default meta;
20
28
  //# sourceMappingURL=Pill.stories.js.map
package/dist/components/pill/Pill.stories.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Pill.stories.js","sourceRoot":"","sources":["../../../src/components/pill/Pill.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAE9B,MAAM,IAAI,GAAsB;IAC9B,KAAK,EAAE,iBAAiB;IACxB,SAAS,EAAE,IAAI;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,IAAI,EAAE;QACJ,IAAI,EAAE,SAAS;QACf,OAAO,EAAE,GAAG,EAAE,GAAG,OAAO,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC;KAChD;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG;IAC1B,IAAI,EAAE;QACJ,IAAI,EAAE,UAAU;QAChB,QAAQ,EAAE,IAAI;QACd,OAAO,EAAE,GAAG,EAAE,GAAG,OAAO,CAAC,GAAG,CAAC,4BAA4B,CAAC,CAAC,CAAC,CAAC;KAC9D;CACF,CAAC;AAEF,eAAe,IAAI,CAAC"}
1
+ {"version":3,"file":"Pill.stories.js","sourceRoot":"","sources":["../../../src/components/pill/Pill.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAE9B,MAAM,IAAI,GAAsB;IAC9B,KAAK,EAAE,iBAAiB;IACxB,SAAS,EAAE,IAAI;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,IAAI,EAAE;QACJ,IAAI,EAAE,SAAS;QACf,OAAO,EAAE,GAAG,EAAE,GAAG,OAAO,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC;KAChD;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG;IAC1B,IAAI,EAAE;QACJ,IAAI,EAAE,UAAU;QAChB,QAAQ,EAAE,IAAI;QACd,OAAO,EAAE,GAAG,EAAE,GAAG,OAAO,CAAC,GAAG,CAAC,4BAA4B,CAAC,CAAC,CAAC,CAAC;KAC9D;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,IAAI,EAAE;QACJ,IAAI,EAAE,UAAU;QAChB,YAAY,EAAE,IAAI;QAClB,QAAQ,EAAE,IAAI;QACd,OAAO,EAAE,GAAG,EAAE,GAAG,OAAO,CAAC,GAAG,CAAC,4BAA4B,CAAC,CAAC,CAAC,CAAC;KAC9D;CACF,CAAC;AAEF,eAAe,IAAI,CAAC"}
package/dist/components/pill/Pill.test.js CHANGED
@@ -52,5 +52,14 @@ describe('Pill', () => {
52
52
  fireEvent.click(screen.getByText('Test Pill'));
53
53
  expect(onClick).toHaveBeenCalledWith(false);
54
54
  });
55
+ it('toggles checked state on pill click (with initialState prop set)', () => {
56
+ const onClick = vi.fn();
57
+ render(_jsx(Pill, { text: "Test Pill", initialValue: true, onclick: onClick }));
58
+ const pill = screen.getByText('Test Pill').closest('.ds-pill');
59
+ expect(pill).toHaveClass('ds-pill__active');
60
+ fireEvent.click(screen.getByText('Test Pill'));
61
+ expect(pill).toHaveClass('ds-pill__inactive');
62
+ fireEvent.click(screen.getByText('Test Pill'));
63
+ });
55
64
  });
56
65
  //# sourceMappingURL=Pill.test.js.map
package/dist/components/pill/Pill.test.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Pill.test.js","sourceRoot":"","sources":["../../../src/components/pill/Pill.test.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Pill.test.js","sourceRoot":"","sources":["../../../src/components/pill/Pill.test.tsx"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@arbor-education/design-system.components",
3
- "version": "0.3.2",
3
+ "version": "0.3.3",
4
4
  "description": "The component library for the design system (the baby)",
5
5
  "main": "dist/index.js",
6
6
  "repository": {
@@ -18,6 +18,7 @@
18
18
  "ag-grid-enterprise": "^34.3.1",
19
19
  "ag-grid-react": "^34.3.1",
20
20
  "classnames": "^2.5.1",
21
+ "decimal.js": "^10.6.0",
21
22
  "lucide-react": "^0.544.0",
22
23
  "radix-ui": "1.4.3",
23
24
  "react": "^18.2.0",
package/src/components/formField/inputs/number/NumberInput.test.tsx CHANGED
@@ -23,11 +23,121 @@ describe('NumberInput component', () => {
23
23
  render(<NumberInput placeholder="Enter a number" defaultValue="10" step={2} />);
24
24
  const inputElement = screen.getByPlaceholderText('Enter a number') as HTMLInputElement;
25
25
 
26
- fireEvent.click(screen.getByTestId('minus-button'));
26
+ fireEvent.click(screen.getByLabelText('Minus button'));
27
27
  expect(inputElement.value).toBe('8');
28
- fireEvent.click(screen.getByTestId('plus-button'));
28
+ fireEvent.click(screen.getByLabelText('Plus button'));
29
29
  expect(inputElement.value).toBe('10');
30
- fireEvent.click(screen.getByTestId('plus-button'));
30
+ fireEvent.click(screen.getByLabelText('Plus button'));
31
31
  expect(inputElement.value).toBe('12');
32
32
  });
33
+
34
+ describe('Decimal value handling', () => {
35
+ test('handles decimal step values correctly', () => {
36
+ render(<NumberInput placeholder="Enter a number" defaultValue="0.5" step={0.1} />);
37
+ const inputElement = screen.getByPlaceholderText('Enter a number') as HTMLInputElement;
38
+
39
+ fireEvent.click(screen.getByLabelText('Plus button'));
40
+ expect(inputElement.value).toBe('0.6');
41
+ fireEvent.click(screen.getByLabelText('Plus button'));
42
+ expect(inputElement.value).toBe('0.7');
43
+ fireEvent.click(screen.getByLabelText('Minus button'));
44
+ expect(inputElement.value).toBe('0.6');
45
+ });
46
+
47
+ test('handles common floating point precision issue (0.1 + 0.2 = 0.3)', () => {
48
+ render(<NumberInput placeholder="Enter a number" defaultValue="0.1" step={0.2} />);
49
+ const inputElement = screen.getByPlaceholderText('Enter a number') as HTMLInputElement;
50
+
51
+ fireEvent.click(screen.getByLabelText('Plus button'));
52
+ // Should be exactly 0.3, not 0.30000000000000004
53
+ expect(inputElement.value).toBe('0.3');
54
+ });
55
+
56
+ test('handles multiple decimal operations without accumulating errors', () => {
57
+ render(<NumberInput placeholder="Enter a number" defaultValue="0" step={0.1} />);
58
+ const inputElement = screen.getByPlaceholderText('Enter a number') as HTMLInputElement;
59
+
60
+ // Add 0.1 ten times - should equal 1.0
61
+ for (let i = 0; i < 10; i++) {
62
+ fireEvent.click(screen.getByLabelText('Plus button'));
63
+ }
64
+ expect(inputElement.value).toBe('1');
65
+ });
66
+
67
+ test('handles small decimal step values', () => {
68
+ render(<NumberInput placeholder="Enter a number" defaultValue="0.01" step={0.01} />);
69
+ const inputElement = screen.getByPlaceholderText('Enter a number') as HTMLInputElement;
70
+
71
+ fireEvent.click(screen.getByLabelText('Plus button'));
72
+ expect(inputElement.value).toBe('0.02');
73
+ fireEvent.click(screen.getByLabelText('Plus button'));
74
+ expect(inputElement.value).toBe('0.03');
75
+ });
76
+
77
+ test('handles decimal values with min constraint', () => {
78
+ render(<NumberInput placeholder="Enter a number" defaultValue="0.5" step={0.1} min={0.3} />);
79
+ const inputElement = screen.getByPlaceholderText('Enter a number') as HTMLInputElement;
80
+
81
+ // Try to go below min
82
+ fireEvent.click(screen.getByLabelText('Minus button'));
83
+ fireEvent.click(screen.getByLabelText('Minus button'));
84
+ fireEvent.click(screen.getByLabelText('Minus button'));
85
+ // Should be clamped to min value
86
+ expect(inputElement.value).toBe('0.3');
87
+ });
88
+
89
+ test('handles decimal values with max constraint', () => {
90
+ render(<NumberInput placeholder="Enter a number" defaultValue="0.5" step={0.1} max={0.7} />);
91
+ const inputElement = screen.getByPlaceholderText('Enter a number') as HTMLInputElement;
92
+
93
+ // Try to go above max
94
+ fireEvent.click(screen.getByLabelText('Plus button'));
95
+ fireEvent.click(screen.getByLabelText('Plus button'));
96
+ fireEvent.click(screen.getByLabelText('Plus button'));
97
+ // Should be clamped to max value
98
+ expect(inputElement.value).toBe('0.7');
99
+ });
100
+
101
+ test('handles decimal input and validates on blur', () => {
102
+ render(<NumberInput placeholder="Enter a number" defaultValue="0.5" min={0.1} max={0.9} />);
103
+ const inputElement = screen.getByPlaceholderText('Enter a number') as HTMLInputElement;
104
+
105
+ // Enter a value below min
106
+ fireEvent.change(inputElement, { target: { value: '0.05' } });
107
+ fireEvent.blur(inputElement);
108
+ expect(inputElement.value).toBe('0.1');
109
+
110
+ // Enter a value above max
111
+ fireEvent.change(inputElement, { target: { value: '0.95' } });
112
+ fireEvent.blur(inputElement);
113
+ expect(inputElement.value).toBe('0.9');
114
+ });
115
+
116
+ test('handles decimal values with many decimal places', () => {
117
+ render(<NumberInput placeholder="Enter a number" defaultValue="0.123456" step={0.000001} />);
118
+ const inputElement = screen.getByPlaceholderText('Enter a number') as HTMLInputElement;
119
+
120
+ fireEvent.click(screen.getByLabelText('Plus button'));
121
+ expect(inputElement.value).toBe('0.123457');
122
+ });
123
+
124
+ test('handles negative decimal values', () => {
125
+ render(<NumberInput placeholder="Enter a number" defaultValue="-0.5" step={0.1} />);
126
+ const inputElement = screen.getByPlaceholderText('Enter a number') as HTMLInputElement;
127
+
128
+ fireEvent.click(screen.getByLabelText('Plus button'));
129
+ expect(inputElement.value).toBe('-0.4');
130
+ fireEvent.click(screen.getByLabelText('Minus button'));
131
+ expect(inputElement.value).toBe('-0.5');
132
+ });
133
+
134
+ test('handles decimal step that results in whole number', () => {
135
+ render(<NumberInput placeholder="Enter a number" defaultValue="0.9" step={0.1} />);
136
+ const inputElement = screen.getByPlaceholderText('Enter a number') as HTMLInputElement;
137
+
138
+ fireEvent.click(screen.getByLabelText('Plus button'));
139
+ // Should be 1, not 1.0 or 0.9999999999999999
140
+ expect(inputElement.value).toBe('1');
141
+ });
142
+ });
33
143
  });
package/src/components/formField/inputs/number/NumberInput.tsx CHANGED
@@ -1,5 +1,6 @@
1
1
  import classNames from 'classnames';
2
2
  import { Icon } from 'Components/icon/Icon';
3
+ import Decimal from 'decimal.js';
3
4
  import { useEffect, useRef, useState, type ChangeEvent, type InputHTMLAttributes } from 'react';
4
5
 
5
6
  export type NumberInputProps = {
@@ -16,8 +17,8 @@ export const NumberInput = (props: NumberInputProps) => {
16
17
  onChange,
17
18
  defaultValue = '',
18
19
  step = 1,
19
- min,
20
- max,
20
+ min = -Infinity,
21
+ max = Infinity,
21
22
  disableSpinners,
22
23
  containerClassName,
23
24
  value: passedValue = '',
@@ -46,25 +47,35 @@ export const NumberInput = (props: NumberInputProps) => {
46
47
  className,
47
48
  );
48
49
 
49
- const handleSpinner = (step: string | number) => {
50
- const currentValue = isNaN(Number(value)) ? 0 : Number(value);
51
- const newValue = (currentValue + Number(step)).toString();
52
- handleOnChange(newValue);
53
- };
54
-
55
50
  const handleOnChange = (newValue: string) => {
56
51
  if (newValue !== value) {
57
52
  setValue(newValue);
58
53
  }
59
54
  };
60
55
 
61
- const handleOnBlur = () => {
62
- if (min !== undefined && Number(value) < Number(min)) {
63
- setValue(min.toString());
56
+ const checkOverOrUnderMaxOrMin = (newValue: string) => {
57
+ const decimalValue = new Decimal(newValue || 0);
58
+ const decimalMax = new Decimal(max || 0);
59
+ const decimalMin = new Decimal(min || 0);
60
+
61
+ if (decimalValue.lessThan(decimalMin)) {
62
+ return handleOnChange(min.toString());
64
63
  }
65
- if (max !== undefined && Number(value) > Number(max)) {
66
- setValue(max.toString());
64
+ if (decimalValue.greaterThan(decimalMax)) {
65
+ return handleOnChange(max.toString());
67
66
  }
67
+ return handleOnChange(newValue);
68
+ };
69
+
70
+ const handleSpinner = (step: string | number) => {
71
+ const decimalValue = new Decimal(value || 0);
72
+ const decimalStep = new Decimal(step);
73
+ const newValue = decimalValue.plus(decimalStep).toString();
74
+ checkOverOrUnderMaxOrMin(newValue);
75
+ };
76
+
77
+ const handleOnBlur = () => {
78
+ checkOverOrUnderMaxOrMin(value);
68
79
  };
69
80
 
70
81
  return (
@@ -78,7 +89,7 @@ export const NumberInput = (props: NumberInputProps) => {
78
89
  <button
79
90
  className="ds-number-input__spinner-button"
80
91
  type="button"
81
- disabled={disabled || (min !== undefined && Number(value) <= Number(min))}
92
+ disabled={disabled || (Number(value) <= Number(min))}
82
93
  onClick={() => handleSpinner(-step)}
83
94
  aria-label="Minus button"
84
95
  data-testid="minus-button"
@@ -108,7 +119,7 @@ export const NumberInput = (props: NumberInputProps) => {
108
119
  <button
109
120
  className="ds-number-input__spinner-button"
110
121
  type="button"
111
- disabled={disabled || (max !== undefined && Number(value) >= Number(max))}
122
+ disabled={disabled || (Number(value) >= Number(max))}
112
123
  onClick={() => handleSpinner(step)}
113
124
  aria-label="Plus button"
114
125
  data-testid="plus-button"
package/src/components/pill/Pill.stories.tsx CHANGED
@@ -21,4 +21,13 @@ export const withCheckbox = {
21
21
  },
22
22
  };
23
23
 
24
+ export const preChecked = {
25
+ args: {
26
+ text: 'Checkbox',
27
+ initialValue: true,
28
+ checkbox: true,
29
+ onclick: () => { console.log('Pill with checkbox clicked'); },
30
+ },
31
+ };
32
+
24
33
  export default meta;
package/src/components/pill/Pill.test.tsx CHANGED
@@ -57,4 +57,14 @@ describe('Pill', () => {
57
57
  fireEvent.click(screen.getByText('Test Pill'));
58
58
  expect(onClick).toHaveBeenCalledWith(false);
59
59
  });
60
+
61
+ it('toggles checked state on pill click (with initialState prop set)', () => {
62
+ const onClick = vi.fn();
63
+ render(<Pill text="Test Pill" initialValue={true} onclick={onClick} />);
64
+ const pill = screen.getByText('Test Pill').closest('.ds-pill');
65
+ expect(pill).toHaveClass('ds-pill__active');
66
+ fireEvent.click(screen.getByText('Test Pill'));
67
+ expect(pill).toHaveClass('ds-pill__inactive');
68
+ fireEvent.click(screen.getByText('Test Pill'));
69
+ });
60
70
  });
package/src/components/pill/Pill.tsx CHANGED
@@ -4,12 +4,13 @@ import { useEffect, useState } from 'react';
4
4
 
5
5
  type PillProps = {
6
6
  text: string;
7
+ initialValue?: boolean;
7
8
  checkbox?: boolean;
8
9
  onclick?: (checked: boolean) => void;
9
10
  };
10
11
 
11
- export const Pill = ({ text, checkbox, onclick }: PillProps) => {
12
- const [checked, setChecked] = useState(false);
12
+ export const Pill = ({ text, checkbox, onclick, initialValue = false }: PillProps) => {
13
+ const [checked, setChecked] = useState(initialValue);
13
14
 
14
15
  const handlePillClick = () => {
15
16
  setChecked(prev => !prev);