@seeqdev/qomponents 0.0.2 → 0.0.4

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 (54) hide show
  1. package/dist/Checkbox/Checkbox.d.ts +7 -0
  2. package/dist/Checkbox/Checkbox.js +23 -0
  3. package/dist/Checkbox/Checkbox.js.map +1 -0
  4. package/dist/Checkbox/Checkbox.stories.d.ts +5 -0
  5. package/dist/Checkbox/Checkbox.stories.js +29 -0
  6. package/dist/Checkbox/Checkbox.stories.js.map +1 -0
  7. package/dist/Checkbox/Checkbox.test.d.ts +1 -0
  8. package/dist/Checkbox/Checkbox.test.js +94 -0
  9. package/dist/Checkbox/Checkbox.test.js.map +1 -0
  10. package/dist/Checkbox/Checkbox.types.d.ts +17 -0
  11. package/dist/Checkbox/Checkbox.types.js +2 -0
  12. package/dist/Checkbox/Checkbox.types.js.map +1 -0
  13. package/dist/Checkbox/index.d.ts +1 -0
  14. package/dist/Checkbox/index.js +2 -0
  15. package/dist/Checkbox/index.js.map +1 -0
  16. package/dist/Icon/Icon.stories.js +6 -6
  17. package/dist/Icon/Icon.stories.js.map +1 -1
  18. package/dist/Select/Select.js +68 -0
  19. package/dist/Select/Select.js.map +1 -0
  20. package/dist/Select/Select.stories.js +32 -0
  21. package/dist/Select/Select.stories.js.map +1 -0
  22. package/dist/Select/Select.test.js +23 -0
  23. package/dist/Select/Select.test.js.map +1 -0
  24. package/dist/Select/Select.types.js +2 -0
  25. package/dist/Select/Select.types.js.map +1 -0
  26. package/dist/Select/index.js +2 -0
  27. package/dist/Select/index.js.map +1 -0
  28. package/dist/TextArea/TextArea.d.ts +7 -0
  29. package/dist/TextArea/TextArea.js +15 -0
  30. package/dist/TextArea/TextArea.js.map +1 -0
  31. package/dist/TextArea/TextArea.stories.d.ts +5 -0
  32. package/dist/TextArea/TextArea.stories.js +35 -0
  33. package/dist/TextArea/TextArea.stories.js.map +1 -0
  34. package/dist/TextArea/TextArea.test.d.ts +1 -0
  35. package/dist/TextArea/TextArea.test.js +68 -0
  36. package/dist/TextArea/TextArea.test.js.map +1 -0
  37. package/dist/TextArea/TextArea.types.d.ts +28 -0
  38. package/dist/TextArea/TextArea.types.js +2 -0
  39. package/dist/TextArea/TextArea.types.js.map +1 -0
  40. package/dist/TextArea/index.d.ts +1 -0
  41. package/dist/TextArea/index.js +2 -0
  42. package/dist/TextArea/index.js.map +1 -0
  43. package/dist/TextField/TextField.js +4 -2
  44. package/dist/TextField/TextField.js.map +1 -1
  45. package/dist/TextField/TextField.types.d.ts +1 -1
  46. package/dist/index.d.ts +4 -0
  47. package/dist/index.esm.js +35 -1
  48. package/dist/index.esm.js.map +1 -1
  49. package/dist/index.js +36 -0
  50. package/dist/index.js.map +1 -1
  51. package/dist/sharedTypes.js +1 -0
  52. package/dist/sharedTypes.js.map +1 -0
  53. package/dist/styles.css +160 -0
  54. package/package.json +2 -1
@@ -0,0 +1,7 @@
1
+ import React from 'react';
2
+ import { CheckboxProps } from './Checkbox.types';
3
+ import '../styles.css';
4
+ /**
5
+ * Checkbox and Radio Box Component.
6
+ */
7
+ export declare const Checkbox: React.FunctionComponent<CheckboxProps>;
@@ -0,0 +1,23 @@
1
+ import React from 'react';
2
+ import '../styles.css';
3
+ const alignment = 'tw-flex tw-items-center';
4
+ const labelClasses = 'tw-ml-1.5 tw-text-sm';
5
+ const baseClasses = 'tw-border-1 tw-h-3.5 tw-w-3.5 focus:tw-ring-0 focus:tw-ring-offset-0 tw-outline-none focus:tw-outline-none' +
6
+ ' dark:tw-bg-sq-dark-background dark:tw-border-sq-dark-text dark:checked:tw-bg-sq-dark-text' +
7
+ ' checked:tw-text-sq-text-color' +
8
+ ' disabled:tw-text-sq-fairly-dark-gray';
9
+ const checkboxClasses = `tw-form-checkbox tw-rounded ${baseClasses}`;
10
+ const radioClasses = `tw-form-radio ${baseClasses}`;
11
+ /**
12
+ * Checkbox and Radio Box Component.
13
+ */
14
+ export const Checkbox = (props) => {
15
+ const { type = 'checkbox', value, disabled = false, label, onChange, onClick, onKeyDown, checked, id, name, extraClassNames, extraLabelClassNames, testId, } = props;
16
+ const assignedId = id ?? 'checkbox_' + Math.random();
17
+ return (React.createElement("span", { className: `${alignment} ${extraClassNames}` },
18
+ React.createElement("input", { value: value, type: type, "data-testid": testId, name: name, id: assignedId, checked: checked, className: `${type === 'checkbox' ? checkboxClasses : radioClasses} ${disabled ? 'tw-cursor-not-allowed' : 'tw-cursor-pointer'}`, disabled: disabled, onClick: onClick, onChange: onChange, onKeyDown: onKeyDown }),
19
+ React.createElement("label", { htmlFor: assignedId, className: `${labelClasses} ${extraLabelClassNames} ${disabled
20
+ ? 'tw-cursor-not-allowed dark:tw-text-sq-fairly-dark-gray tw-text-sq-fairly-dark-gray'
21
+ : 'tw-cursor-pointer tw-text-sq-text-color dark:tw-text-sq-dark-text'}` }, label)));
22
+ };
23
+ //# sourceMappingURL=Checkbox.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../src/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,eAAe,CAAC;AAEvB,MAAM,SAAS,GAAG,yBAAyB,CAAC;AAC5C,MAAM,YAAY,GAAG,sBAAsB,CAAC;AAE5C,MAAM,WAAW,GACf,4GAA4G;IAC5G,6FAA6F;IAC7F,iCAAiC;IACjC,uCAAuC,CAAC;AAE1C,MAAM,eAAe,GAAG,+BAA+B,WAAW,EAAE,CAAC;AAErE,MAAM,YAAY,GAAG,iBAAiB,WAAW,EAAE,CAAC;AAEpD;;GAEG;AACH,MAAM,CAAC,MAAM,QAAQ,GAA2C,CAAC,KAAK,EAAE,EAAE;IACxE,MAAM,EACJ,IAAI,GAAG,UAAU,EACjB,KAAK,EACL,QAAQ,GAAG,KAAK,EAChB,KAAK,EACL,QAAQ,EACR,OAAO,EACP,SAAS,EACT,OAAO,EACP,EAAE,EACF,IAAI,EACJ,eAAe,EACf,oBAAoB,EACpB,MAAM,GACP,GAAG,KAAK,CAAC;IAEV,MAAM,UAAU,GAAG,EAAE,IAAI,WAAW,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC;IAErD,OAAO,CACL,8BAAM,SAAS,EAAE,GAAG,SAAS,IAAI,eAAe,EAAE;QAChD,+BACE,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,iBACG,MAAM,EACnB,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,UAAU,EACd,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,GAAG,IAAI,KAAK,UAAU,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,YAAY,IAChE,QAAQ,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,mBACvC,EAAE,EACF,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,GACpB;QACF,+BACE,OAAO,EAAE,UAAU,EACnB,SAAS,EAAE,GAAG,YAAY,IAAI,oBAAoB,IAChD,QAAQ;gBACN,CAAC,CAAC,oFAAoF;gBACtF,CAAC,CAAC,mEACN,EAAE,IACD,KAAK,CACA,CACH,CACR,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,5 @@
1
+ declare const _default: {
2
+ title: string;
3
+ };
4
+ export default _default;
5
+ export declare const AllCheckboxes: () => JSX.Element;
@@ -0,0 +1,29 @@
1
+ import React from 'react';
2
+ import { Checkbox } from './Checkbox';
3
+ export default {
4
+ title: 'Checkbox',
5
+ };
6
+ export const AllCheckboxes = () => {
7
+ const getDisplay = (type) => (React.createElement(React.Fragment, null,
8
+ React.createElement("div", { className: "tw-p-4" },
9
+ React.createElement(Checkbox, { value: "a", type: type, checked: true, label: 'with Label' })),
10
+ React.createElement("div", { className: "tw-p-4" },
11
+ React.createElement(Checkbox, { value: "d", type: type, checked: false, disabled: true, label: "Disabled" })),
12
+ React.createElement("div", { className: "tw-p-4" },
13
+ React.createElement(Checkbox, { value: "d", type: type, checked: true, disabled: true, label: "Disabled" })),
14
+ React.createElement("div", { className: "tw-p-4" },
15
+ React.createElement(Checkbox, { value: "b", type: type, checked: true })),
16
+ React.createElement("div", { className: "tw-p-4" },
17
+ React.createElement(Checkbox, { value: "c", type: type, checked: false }))));
18
+ const renderAllVariations = (type) => (React.createElement(React.Fragment, null,
19
+ React.createElement("div", { className: "tw-p-4 light" }, getDisplay(type)),
20
+ React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" }, getDisplay(type))));
21
+ return (React.createElement("div", { className: "tw-grid tw-grid-cols-2 tw-gap-4" },
22
+ React.createElement("div", null,
23
+ React.createElement("b", null, "Checkbox"),
24
+ renderAllVariations('checkbox')),
25
+ React.createElement("div", null,
26
+ React.createElement("b", null, "Radios"),
27
+ renderAllVariations('radio'))));
28
+ };
29
+ //# sourceMappingURL=Checkbox.stories.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Checkbox.stories.js","sourceRoot":"","sources":["../../src/Checkbox/Checkbox.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,eAAe;IACb,KAAK,EAAE,UAAU;CAClB,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,EAAE;IAChC,MAAM,UAAU,GAAG,CAAC,IAA0B,EAAE,EAAE,CAAC,CACjD;QACE,6BAAK,SAAS,EAAC,QAAQ;YACrB,oBAAC,QAAQ,IAAC,KAAK,EAAC,GAAG,EAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,YAAY,GAAI,CAClE;QACN,6BAAK,SAAS,EAAC,QAAQ;YACrB,oBAAC,QAAQ,IAAC,KAAK,EAAC,GAAG,EAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAC,UAAU,GAAG,CAC/E;QACN,6BAAK,SAAS,EAAC,QAAQ;YACrB,oBAAC,QAAQ,IAAC,KAAK,EAAC,GAAG,EAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAC,UAAU,GAAG,CAC9E;QACN,6BAAK,SAAS,EAAC,QAAQ;YACrB,oBAAC,QAAQ,IAAC,KAAK,EAAC,GAAG,EAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,GAAI,CAC7C;QACN,6BAAK,SAAS,EAAC,QAAQ;YACrB,oBAAC,QAAQ,IAAC,KAAK,EAAC,GAAG,EAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,GAAI,CAC9C,CACL,CACJ,CAAC;IACF,MAAM,mBAAmB,GAAG,CAAC,IAA0B,EAAE,EAAE,CAAC,CAC1D;QACE,6BAAK,SAAS,EAAC,cAAc,IAAE,UAAU,CAAC,IAAI,CAAC,CAAO;QACtD,6BAAK,SAAS,EAAC,yCAAyC,IAAE,UAAU,CAAC,IAAI,CAAC,CAAO,CAChF,CACJ,CAAC;IAEF,OAAO,CACL,6BAAK,SAAS,EAAC,iCAAiC;QAC9C;YACE,0CAAe;YACd,mBAAmB,CAAC,UAAU,CAAC,CAC5B;QAEN;YACE,wCAAa;YACZ,mBAAmB,CAAC,OAAO,CAAC,CACzB,CACF,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1 @@
1
+ import '@testing-library/jest-dom';
@@ -0,0 +1,94 @@
1
+ import React from 'react';
2
+ import '@testing-library/jest-dom';
3
+ import { render, screen } from '@testing-library/react';
4
+ import { Checkbox } from './Checkbox';
5
+ import userEvent from '@testing-library/user-event';
6
+ describe('Checkbox', () => {
7
+ class Context {
8
+ testId = 'checkboxTestId';
9
+ props = {
10
+ onChange: jest.fn(),
11
+ checked: false,
12
+ testId: this.testId,
13
+ };
14
+ }
15
+ let tc;
16
+ beforeEach(() => {
17
+ tc = new Context();
18
+ });
19
+ const renderCheckbox = (props) => render(React.createElement(Checkbox, { ...props }));
20
+ it('renders checkbox', () => {
21
+ renderCheckbox(tc.props);
22
+ expect(screen.getByTestId(tc.testId)).toBeInTheDocument();
23
+ });
24
+ it('renders radio', () => {
25
+ renderCheckbox({ ...tc.props, type: 'radio' });
26
+ expect(screen.getByTestId(tc.testId)).toHaveProperty('type', 'radio');
27
+ });
28
+ it('renders label', () => {
29
+ const label = 'look at this checkbox!';
30
+ renderCheckbox({ ...tc.props, label });
31
+ expect(screen.getByText(label)).toBeInTheDocument();
32
+ });
33
+ it('respects checked', () => {
34
+ renderCheckbox({ ...tc.props, checked: true });
35
+ expect(screen.getByTestId(tc.testId)).toBeChecked();
36
+ });
37
+ it('calls onChange handler', async () => {
38
+ const onChange = jest.fn();
39
+ renderCheckbox({ ...tc.props, onChange });
40
+ await userEvent.click(screen.getByTestId(tc.testId));
41
+ expect(onChange).toHaveBeenCalled();
42
+ });
43
+ it('calls onKeyDown handler', async () => {
44
+ const onKeyDown = jest.fn();
45
+ renderCheckbox({ ...tc.props, onKeyDown });
46
+ await userEvent.type(screen.getByTestId(tc.testId), 'a');
47
+ expect(onKeyDown).toHaveBeenCalled();
48
+ });
49
+ it('calls onClickHandler handler', async () => {
50
+ const onClick = jest.fn();
51
+ renderCheckbox({ ...tc.props, onClick });
52
+ await userEvent.click(screen.getByTestId(tc.testId));
53
+ expect(onClick).toHaveBeenCalled();
54
+ });
55
+ it('respects disabled', () => {
56
+ renderCheckbox({ ...tc.props, disabled: true });
57
+ expect(screen.getByTestId(tc.testId)).not.toBeEnabled();
58
+ });
59
+ it('renders label clickable', async () => {
60
+ const label = 'amazing checkbox';
61
+ const onClick = jest.fn();
62
+ renderCheckbox({ ...tc.props, label, onClick });
63
+ expect(screen.getByTestId(tc.testId)).not.toBeChecked();
64
+ await userEvent.click(screen.getByText(label));
65
+ expect(onClick).toHaveBeenCalled();
66
+ });
67
+ it('respects id', () => {
68
+ const id = 'checkboxId';
69
+ renderCheckbox({ ...tc.props, id });
70
+ expect(screen.getByTestId(tc.testId)).toHaveProperty('id', id);
71
+ });
72
+ it('respects name', () => {
73
+ const name = 'checkboxName';
74
+ renderCheckbox({ ...tc.props, name });
75
+ expect(screen.getByTestId(tc.testId)).toHaveProperty('name', name);
76
+ });
77
+ it('respects name', () => {
78
+ const value = 'priceless';
79
+ renderCheckbox({ ...tc.props, value });
80
+ expect(screen.getByTestId(tc.testId)).toHaveProperty('value', value);
81
+ });
82
+ it('applies extraClassNames', () => {
83
+ const extraClassNames = 'extra styling so fancy';
84
+ renderCheckbox({ ...tc.props, extraClassNames });
85
+ expect(screen.getByTestId(tc.testId).parentNode).toHaveClass(extraClassNames);
86
+ });
87
+ it('applies extraLabelClassNames', () => {
88
+ const extraLabelClassNames = 'special label';
89
+ const label = 'amazing checkbox';
90
+ renderCheckbox({ ...tc.props, extraLabelClassNames, label });
91
+ expect(screen.getByText(label)).toHaveClass(extraLabelClassNames);
92
+ });
93
+ });
94
+ //# sourceMappingURL=Checkbox.test.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Checkbox.test.js","sourceRoot":"","sources":["../../src/Checkbox/Checkbox.test.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,17 @@
1
+ type FormControlElement = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;
2
+ export interface CheckboxProps {
3
+ extraClassNames?: string;
4
+ extraLabelClassNames?: string;
5
+ type?: 'radio' | 'checkbox';
6
+ id?: string;
7
+ name?: string;
8
+ checked: boolean;
9
+ value?: string | number;
10
+ label?: string | React.ReactNode;
11
+ onChange?: React.ChangeEventHandler<FormControlElement>;
12
+ onKeyDown?: React.KeyboardEventHandler<FormControlElement>;
13
+ onClick?: React.MouseEventHandler<FormControlElement>;
14
+ disabled?: boolean;
15
+ testId?: string;
16
+ }
17
+ export {};
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=Checkbox.types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Checkbox.types.js","sourceRoot":"","sources":["../../src/Checkbox/Checkbox.types.ts"],"names":[],"mappings":""}
@@ -0,0 +1 @@
1
+ export { Checkbox as default } from './Checkbox';
@@ -0,0 +1,2 @@
1
+ export { Checkbox as default } from './Checkbox';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Checkbox/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,IAAI,OAAO,EAAE,MAAM,YAAY,CAAC"}
@@ -16,13 +16,13 @@ export const AllIcons = () => {
16
16
  iconType),
17
17
  React.createElement("br", null),
18
18
  React.createElement("div", null,
19
- React.createElement(Icon, { icon: 'fc-announcements', small: true, extraClassNames: 'tw-p-2', type: iconType, color: iconType === 'color' ? 'purple' : undefined }),
20
- React.createElement(Icon, { icon: 'fc-announcements', extraClassNames: 'tw-p-2', type: iconType, color: iconType === 'color' ? '#928378' : undefined }),
21
- React.createElement(Icon, { icon: 'fc-announcements', large: true, extraClassNames: 'tw-p-2', type: iconType, color: iconType === 'color' ? 'pink' : undefined })),
19
+ React.createElement(Icon, { icon: "fc-announcements", small: true, extraClassNames: 'tw-p-2', type: iconType, color: iconType === 'color' ? 'purple' : undefined }),
20
+ React.createElement(Icon, { icon: "fc-announcements", extraClassNames: 'tw-p-2', type: iconType, color: iconType === 'color' ? '#928378' : undefined }),
21
+ React.createElement(Icon, { icon: "fc-announcements", large: true, extraClassNames: 'tw-p-2', type: iconType, color: iconType === 'color' ? 'pink' : undefined })),
22
22
  React.createElement("div", { className: "tw-dark tw-bg-sq-dark-background" },
23
- React.createElement(Icon, { icon: 'fc-announcements', small: true, extraClassNames: 'tw-p-2', type: iconType, color: iconType === 'color' ? 'purple' : undefined }),
24
- React.createElement(Icon, { icon: 'fc-announcements', extraClassNames: 'tw-p-2', type: iconType, color: iconType === 'color' ? '#928378' : undefined }),
25
- React.createElement(Icon, { icon: 'fc-announcements', large: true, extraClassNames: 'tw-p-2', type: iconType, color: iconType === 'color' ? 'pink' : undefined })),
23
+ React.createElement(Icon, { icon: "fc-announcements", small: true, extraClassNames: 'tw-p-2', type: iconType, color: iconType === 'color' ? 'purple' : undefined }),
24
+ React.createElement(Icon, { icon: "fc-announcements", extraClassNames: 'tw-p-2', type: iconType, color: iconType === 'color' ? '#928378' : undefined }),
25
+ React.createElement(Icon, { icon: "fc-announcements", large: true, extraClassNames: 'tw-p-2', type: iconType, color: iconType === 'color' ? 'pink' : undefined })),
26
26
  React.createElement("br", null)));
27
27
  })));
28
28
  };
@@ -1 +1 @@
1
- {"version":3,"file":"Icon.stories.js","sourceRoot":"","sources":["../../src/Icon/Icon.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,QAAQ,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAe;IACb,KAAK,EAAE,OAAO;CACf,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAG,EAAE;IAC3B,MAAM,mBAAmB,GAAG,GAAG,EAAE;QAC/B,OAAO,CACL;YACE,+BAAM;YACN,+BAAM;YACL,SAAS,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE;gBAC1B,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG,QAAQ,EAAE;oBACrB;;wBAAS,QAAQ,CAAK;oBACtB,+BAAM;oBACN;wBACE,oBAAC,IAAI,IACH,IAAI,EAAE,kBAAkB,EACxB,KAAK,EAAE,IAAI,EACX,eAAe,EAAE,QAAQ,EACzB,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,QAAQ,KAAK,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,GAClD;wBACF,oBAAC,IAAI,IACH,IAAI,EAAE,kBAAkB,EACxB,eAAe,EAAE,QAAQ,EACzB,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,QAAQ,KAAK,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,GACnD;wBACF,oBAAC,IAAI,IACH,IAAI,EAAE,kBAAkB,EACxB,KAAK,EAAE,IAAI,EACX,eAAe,EAAE,QAAQ,EACzB,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,QAAQ,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,GAChD,CACE;oBACN,6BAAK,SAAS,EAAC,kCAAkC;wBAC/C,oBAAC,IAAI,IACH,IAAI,EAAE,kBAAkB,EACxB,KAAK,EAAE,IAAI,EACX,eAAe,EAAE,QAAQ,EACzB,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,QAAQ,KAAK,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,GAClD;wBACF,oBAAC,IAAI,IACH,IAAI,EAAE,kBAAkB,EACxB,eAAe,EAAE,QAAQ,EACzB,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,QAAQ,KAAK,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,GACnD;wBACF,oBAAC,IAAI,IACH,IAAI,EAAE,kBAAkB,EACxB,KAAK,EAAE,IAAI,EACX,eAAe,EAAE,QAAQ,EACzB,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,QAAQ,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,GAChD,CACE;oBACN,+BAAM,CACF,CACP,CAAC;YACJ,CAAC,CAAC,CACD,CACJ,CAAC;IACJ,CAAC,CAAC;IACF,OAAO,CACL,6BAAK,SAAS,EAAC,iCAAiC;QAC9C,6BAAK,SAAS,EAAC,aAAa;YAC1B,8CAAmB;YAClB,mBAAmB,EAAE,CAClB;QAEN,6BAAK,SAAS,EAAC,gBAAgB;YAC7B,iDAAsB;YACrB,mBAAmB,EAAE,CAClB;QAEN,6BAAK,SAAS,EAAC,eAAe;YAC5B,gDAAqB;YACpB,mBAAmB,EAAE,CAClB,CACF,CACP,CAAC;AACJ,CAAC,CAAC"}
1
+ {"version":3,"file":"Icon.stories.js","sourceRoot":"","sources":["../../src/Icon/Icon.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,QAAQ,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC,eAAe;IACb,KAAK,EAAE,OAAO;CACf,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAG,EAAE;IAC3B,MAAM,mBAAmB,GAAG,GAAG,EAAE;QAC/B,OAAO,CACL;YACE,+BAAM;YACN,+BAAM;YACL,SAAS,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE;gBAC1B,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG,QAAQ,EAAE;oBACrB;;wBAAS,QAAQ,CAAK;oBACtB,+BAAM;oBACN;wBACE,oBAAC,IAAI,IACH,IAAI,EAAC,kBAAkB,EACvB,KAAK,EAAE,IAAI,EACX,eAAe,EAAE,QAAQ,EACzB,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,QAAQ,KAAK,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,GAClD;wBACF,oBAAC,IAAI,IACH,IAAI,EAAC,kBAAkB,EACvB,eAAe,EAAE,QAAQ,EACzB,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,QAAQ,KAAK,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,GACnD;wBACF,oBAAC,IAAI,IACH,IAAI,EAAC,kBAAkB,EACvB,KAAK,EAAE,IAAI,EACX,eAAe,EAAE,QAAQ,EACzB,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,QAAQ,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,GAChD,CACE;oBACN,6BAAK,SAAS,EAAC,kCAAkC;wBAC/C,oBAAC,IAAI,IACH,IAAI,EAAC,kBAAkB,EACvB,KAAK,EAAE,IAAI,EACX,eAAe,EAAE,QAAQ,EACzB,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,QAAQ,KAAK,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,GAClD;wBACF,oBAAC,IAAI,IACH,IAAI,EAAC,kBAAkB,EACvB,eAAe,EAAE,QAAQ,EACzB,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,QAAQ,KAAK,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,GACnD;wBACF,oBAAC,IAAI,IACH,IAAI,EAAC,kBAAkB,EACvB,KAAK,EAAE,IAAI,EACX,eAAe,EAAE,QAAQ,EACzB,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,QAAQ,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,GAChD,CACE;oBACN,+BAAM,CACF,CACP,CAAC;YACJ,CAAC,CAAC,CACD,CACJ,CAAC;IACJ,CAAC,CAAC;IACF,OAAO,CACL,6BAAK,SAAS,EAAC,iCAAiC;QAC9C,6BAAK,SAAS,EAAC,aAAa;YAC1B,8CAAmB;YAClB,mBAAmB,EAAE,CAClB;QAEN,6BAAK,SAAS,EAAC,gBAAgB;YAC7B,iDAAsB;YACrB,mBAAmB,EAAE,CAClB;QAEN,6BAAK,SAAS,EAAC,eAAe;YAC5B,gDAAqB;YACpB,mBAAmB,EAAE,CAClB,CACF,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,68 @@
1
+ import React from 'react';
2
+ import '../styles.css';
3
+ import { default as ReactSelect } from 'react-select';
4
+ /**
5
+ * Select Component
6
+ * - based on react-select (https://react-select.com/)
7
+ * - include tooltips and/or icons
8
+ */
9
+ const Select = ({ options, value, placeholder = 'select', noOptionsMessage = 'no matching options', isSearchable = false, creatable = false, isMulti = false, isClearable = true, closeMenuOnSelect = true, id, inputId, menuPortalTarget, onChange, }) => {
10
+ // figure out the height thing
11
+ const theHeight = ''; //'tw-h-inputs';
12
+ const baseClasses = theHeight + ' ' + 'tw-px-2.5 focus:tw-ring-0 disabled:tw-pointer-events-none ';
13
+ const borderStyles = [
14
+ theHeight,
15
+ 'tw-border-solid',
16
+ 'tw-border',
17
+ 'tw-border-sq-disabled-gray',
18
+ 'hover:tw-border-sq-color-dark',
19
+ 'focus:tw-border-sq-color-dark',
20
+ 'active:tw-border-sq-color-dark',
21
+ 'dark:tw-border-sq-dark-disabled-gray',
22
+ 'dark:hover:tw-border-sq-color-dark-dark',
23
+ 'dark:focus:tw-border-sq-color-dark-dark',
24
+ 'dark:active:tw-border-sq-color-dark-dark',
25
+ ].join(' ');
26
+ const textStyles = ['tw-text-sq-text-color', 'dark:tw-text-sq-dark-text', 'tw-text-sm'].join(' ');
27
+ const textActiveStyles = [
28
+ 'hover:tw-text-sq-color-dark',
29
+ 'focus:tw-text-sq-color-dark',
30
+ 'active:tw-text-sq-color-dark',
31
+ 'dark:tw-text-sq-dark-disabled-gray',
32
+ 'dark:hover:tw-text-sq-color-dark-dark',
33
+ 'dark:focus:tw-text-sq-color-dark-dark',
34
+ 'dark:active:tw-text-sq-color-dark-dark',
35
+ ].join(' ');
36
+ const menuStyles = [
37
+ 'tw-border-solid',
38
+ 'tw-border-x',
39
+ 'tw-border-b',
40
+ 'tw-rounded-b',
41
+ 'tw-border-sq-disabled-gray',
42
+ 'dark:tw-border-sq-dark-disabled-gray',
43
+ ].join(' ');
44
+ const dropDownIndicatorStyles = `${textStyles} ${textActiveStyles}`;
45
+ return (React.createElement(ReactSelect, { id: id, value: value, inputId: inputId, placeholder: placeholder, closeMenuOnSelect: closeMenuOnSelect, isSearchable: isSearchable, isMulti: isMulti, isClearable: isClearable, noOptionsMessage: () => noOptionsMessage, menuPortalTarget: menuPortalTarget, onChange: onChange, unstyled: true, classNames: {
46
+ control: (state) => {
47
+ const appliedClasses = state.menuIsOpen
48
+ ? `${borderStyles} tw-rounded-t-sm reactSelectMinHeight `
49
+ : `${borderStyles} tw-rounded-sm reactSelectMinHeight `;
50
+ return `${appliedClasses} ${baseClasses}`;
51
+ },
52
+ placeholder: () => 'tw-text-gray-400 dark:tw-text-sq-dark-text-lighter',
53
+ container: () => textStyles + ' ',
54
+ input: () => textStyles + '',
55
+ menuList: () => 'tw-rounded-b tw-bg-white dark:tw-bg-sq-dark-background',
56
+ menu: () => menuStyles,
57
+ dropdownIndicator: () => dropDownIndicatorStyles,
58
+ option: (state) => {
59
+ const classes = 'hover:tw-bg-sq-gray-highlight dark:hover:tw-bg-sq-gray-highlight-dark tw-py-1 tw-px-2.5 ';
60
+ return state.isSelected ? classes + 'tw-bg-sq-colored-hover dark:tw-bg-sq-colored-hover-dark' : classes;
61
+ },
62
+ multiValue: () => 'tw-bg-sq-disabled-gray tw-text-sm tw-py-0.5 tw-px-1 tw-m-0.5 tw-rounded-sm',
63
+ multiValueRemove: () => 'hover:tw-text-sq-danger-color',
64
+ clearIndicator: () => 'hover:tw-text-sq-danger-color',
65
+ }, options: options }));
66
+ };
67
+ export default Select;
68
+ //# sourceMappingURL=Select.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Select.js","sourceRoot":"","sources":["../../src/Select/Select.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,32 @@
1
+ import React from 'react';
2
+ import Select from './Select';
3
+ import { TextField } from '../index';
4
+ export default {
5
+ title: 'Select',
6
+ };
7
+ export const AllSelectVariants = () => {
8
+ const options = [
9
+ { value: 'chocolate', label: 'Chocolate' },
10
+ { value: 'strawberry', label: 'Strawberry' },
11
+ { value: 'vanilla', label: 'Vanilla' },
12
+ ];
13
+ const renderAllVariations = () => (React.createElement(React.Fragment, null,
14
+ React.createElement("div", { className: "tw-grid tw-gap-4" },
15
+ React.createElement("div", { className: "tw-p-40" },
16
+ React.createElement(Select, { onChange: () => { }, options: options, placeholder: "pick", isMulti: true, isSearchable: false })),
17
+ React.createElement("div", { className: "tw-p-40 tw-dark tw-bg-sq-dark-background" },
18
+ React.createElement("div", { className: "tw-grid tw-grid-cols-2 " },
19
+ React.createElement(TextField, { value: 'hi' }),
20
+ React.createElement(Select, { options: options, onChange: () => { } }))))));
21
+ return (React.createElement("div", { className: "tw-grid tw-grid-cols-3 tw-gap-4" },
22
+ React.createElement("div", { className: "color_topic" },
23
+ React.createElement("b", null, "Topic Colors"),
24
+ renderAllVariations()),
25
+ React.createElement("div", { className: "color_analysis" },
26
+ React.createElement("b", null, "Analysis Colors"),
27
+ renderAllVariations()),
28
+ React.createElement("div", { className: "color_datalab" },
29
+ React.createElement("b", null, "Datalab Colors"),
30
+ renderAllVariations())));
31
+ };
32
+ //# sourceMappingURL=Select.stories.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Select.stories.js","sourceRoot":"","sources":["../../src/Select/Select.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,UAAU,CAAC;AAC9B,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAErC,eAAe;IACb,KAAK,EAAE,QAAQ;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,EAAE;IACpC,MAAM,OAAO,GAAG;QACd,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,WAAW,EAAE;QAC1C,EAAE,KAAK,EAAE,YAAY,EAAE,KAAK,EAAE,YAAY,EAAE;QAC5C,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE;KACvC,CAAC;IACF,MAAM,mBAAmB,GAAG,GAAG,EAAE,CAAC,CAChC;QACE,6BAAK,SAAS,EAAC,kBAAkB;YAC/B,6BAAK,SAAS,EAAC,SAAS;gBACtB,oBAAC,MAAM,IAAC,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,WAAW,EAAC,MAAM,EAAC,OAAO,EAAE,IAAI,EAAE,YAAY,EAAE,KAAK,GAAI,CACnG;YACN,6BAAK,SAAS,EAAC,0CAA0C;gBACvD,6BAAK,SAAS,EAAC,yBAAyB;oBACtC,oBAAC,SAAS,IAAC,KAAK,EAAE,IAAI,GAAI;oBAC1B,oBAAC,MAAM,IAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,GAAI,CAC5C,CACF,CACF,CACL,CACJ,CAAC;IACF,OAAO,CACL,6BAAK,SAAS,EAAC,iCAAiC;QAC9C,6BAAK,SAAS,EAAC,aAAa;YAC1B,8CAAmB;YAClB,mBAAmB,EAAE,CAClB;QAEN,6BAAK,SAAS,EAAC,gBAAgB;YAC7B,iDAAsB;YACrB,mBAAmB,EAAE,CAClB;QAEN,6BAAK,SAAS,EAAC,eAAe;YAC5B,gDAAqB;YACpB,mBAAmB,EAAE,CAClB,CACF,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,23 @@
1
+ import React from 'react';
2
+ import '@testing-library/jest-dom';
3
+ import { render } from '@testing-library/react';
4
+ import Select from './Select';
5
+ describe('Button', () => {
6
+ class Context {
7
+ testId = 'buttonTestId';
8
+ label = 'button label';
9
+ props = {
10
+ onChange: jest.fn(),
11
+ options: [],
12
+ };
13
+ }
14
+ let tc;
15
+ beforeEach(() => {
16
+ tc = new Context();
17
+ });
18
+ const renderSelect = (props) => render(React.createElement(Select, { ...props }));
19
+ it('TODO', () => {
20
+ expect(true).toBeTruthy();
21
+ });
22
+ });
23
+ //# sourceMappingURL=Select.test.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Select.test.js","sourceRoot":"","sources":["../../src/Select/Select.test.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,2BAA2B,CAAC;AACnC,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAEhD,OAAO,MAAM,MAAM,UAAU,CAAC;AAG9B,QAAQ,CAAC,QAAQ,EAAE,GAAG,EAAE;IACtB,MAAM,OAAO;QACX,MAAM,GAAG,cAAc,CAAC;QACxB,KAAK,GAAG,cAAc,CAAC;QACvB,KAAK,GAAgB;YACnB,QAAQ,EAAE,IAAI,CAAC,EAAE,EAAE;YACnB,OAAO,EAAE,EAAE;SACZ,CAAC;KACH;IAED,IAAI,EAAW,CAAC;IAChB,UAAU,CAAC,GAAG,EAAE;QACd,EAAE,GAAG,IAAI,OAAO,EAAE,CAAC;IACrB,CAAC,CAAC,CAAC;IAEH,MAAM,YAAY,GAAG,CAAC,KAAkB,EAAE,EAAE,CAAC,MAAM,CAAC,oBAAC,MAAM,OAAK,KAAK,GAAI,CAAC,CAAC;IAE3E,EAAE,CAAC,MAAM,EAAE,GAAG,EAAE;QACd,MAAM,CAAC,IAAI,CAAC,CAAC,UAAU,EAAE,CAAC;IAC5B,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=Select.types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Select.types.js","sourceRoot":"","sources":["../../src/Select/Select.types.ts"],"names":[],"mappings":""}
@@ -0,0 +1,2 @@
1
+ export { default } from './Select';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Select/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC"}
@@ -0,0 +1,7 @@
1
+ import React from 'react';
2
+ import { TextAreaProps } from './TextArea.types';
3
+ import '../styles.css';
4
+ /**
5
+ * TextArea.
6
+ */
7
+ export declare const TextArea: React.FunctionComponent<TextAreaProps>;
@@ -0,0 +1,15 @@
1
+ import React from 'react';
2
+ import '../styles.css';
3
+ const baseClasses = 'tw-leading-normal tw-outline-none tw-py-1 tw-px-3 tw-rounded-sm' +
4
+ ' disabled:tw-cursor-not-allowed tw-p-1 tw-border-solid tw-border';
5
+ const darkTheme = 'dark:tw-border-sq-dark-disabled-gray dark:tw-bg-sq-dark-background dark:tw-text-sq-dark-text' +
6
+ ' dark:focus:tw-border-sq-color-dark-dark dark:active:tw-border-sq-color-dark-dark';
7
+ const lightTheme = 'tw-border-sq-disabled-gray tw-text-sq-text-color focus:tw-border-sq-color-dark active:tw-border-sq-color-dark';
8
+ /**
9
+ * TextArea.
10
+ */
11
+ export const TextArea = ({ readonly = false, onChange, onKeyUp, id, name, rows = 3, cols = undefined, value, placeholder, extraClassNames, testId, autofocus = false, }) => {
12
+ const appliedClasses = `${baseClasses} ${extraClassNames} ${lightTheme} ${darkTheme}`;
13
+ return (React.createElement("textarea", { "data-testid": testId, name: name, id: id, value: value, className: appliedClasses, placeholder: placeholder, disabled: readonly, onChange: onChange, onKeyUp: onKeyUp, rows: rows, cols: cols, autoFocus: autofocus }));
14
+ };
15
+ //# sourceMappingURL=TextArea.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../../src/TextArea/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,eAAe,CAAC;AAEvB,MAAM,WAAW,GACf,iEAAiE;IACjE,kEAAkE,CAAC;AAErE,MAAM,SAAS,GACb,8FAA8F;IAC9F,mFAAmF,CAAC;AACtF,MAAM,UAAU,GACd,+GAA+G,CAAC;AAElH;;GAEG;AACH,MAAM,CAAC,MAAM,QAAQ,GAA2C,CAAC,EAC/D,QAAQ,GAAG,KAAK,EAChB,QAAQ,EACR,OAAO,EACP,EAAE,EACF,IAAI,EACJ,IAAI,GAAG,CAAC,EACR,IAAI,GAAG,SAAS,EAChB,KAAK,EACL,WAAW,EACX,eAAe,EACf,MAAM,EACN,SAAS,GAAG,KAAK,GAClB,EAAE,EAAE;IACH,MAAM,cAAc,GAAG,GAAG,WAAW,IAAI,eAAe,IAAI,UAAU,IAAI,SAAS,EAAE,CAAC;IAEtF,OAAO,CACL,iDACe,MAAM,EACnB,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,cAAc,EACzB,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,SAAS,GACpB,CACH,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,5 @@
1
+ declare const _default: {
2
+ title: string;
3
+ };
4
+ export default _default;
5
+ export declare const AllTextAreas: () => JSX.Element;
@@ -0,0 +1,35 @@
1
+ import React from 'react';
2
+ import { TextArea } from './TextArea';
3
+ export default {
4
+ title: 'TextArea',
5
+ };
6
+ export const AllTextAreas = () => {
7
+ const renderAllVariations = () => (React.createElement(React.Fragment, null,
8
+ React.createElement("div", { className: "tw-p-4 light" },
9
+ React.createElement("div", { className: "tw-p-4" },
10
+ React.createElement(TextArea, { value: "Short text provided." })),
11
+ React.createElement("div", { className: "tw-p-4" },
12
+ React.createElement(TextArea, { value: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Odio morbi quis commodo odio aenean. Lectus sit amet est placerat in egestas erat. Dui nunc mattis enim ut tellus. Dictumst vestibulum rhoncus est pellentesque elit ullamcorper. Nibh mauris cursus mattis molestie a. Aenean vel elit scelerisque mauris pellentesque. Nunc sed id semper risus in hendrerit gravida rutrum quisque. Tortor dignissim convallis aenean et tortor at risus. Vitae congue mauris rhoncus aenean vel elit scelerisque. Tellus id interdum velit laoreet id donec ultrices. Ac turpis egestas maecenas pharetra. Commodo odio aenean sed adipiscing diam donec adipiscing tristique risus. Consequat interdum varius sit amet mattis. Lacus laoreet non curabitur gravida arcu ac tortor. Vulputate sapien nec sagittis aliquam malesuada bibendum arcu vitae elementum. Odio ut enim blandit volutpat maecenas volutpat." })),
13
+ React.createElement("div", { className: "tw-p-4" },
14
+ React.createElement(TextArea, { placeholder: "placeholder text" })),
15
+ React.createElement("div", { className: "tw-p-4" },
16
+ React.createElement(TextArea, { value: "read-only", readonly: true }))),
17
+ React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
18
+ React.createElement("div", { className: "tw-p-4" },
19
+ React.createElement(TextArea, { value: "value provided" })),
20
+ React.createElement("div", { className: "tw-p-4" },
21
+ React.createElement(TextArea, { placeholder: "placeholder text" })),
22
+ React.createElement("div", { className: "tw-p-4" },
23
+ React.createElement(TextArea, { value: "read-only", readonly: true })))));
24
+ return (React.createElement("div", { className: "tw-grid tw-grid-cols-3 tw-gap-4" },
25
+ React.createElement("div", { className: "color_topic" },
26
+ React.createElement("b", null, "Topic Colors"),
27
+ renderAllVariations()),
28
+ React.createElement("div", { className: "color_analysis" },
29
+ React.createElement("b", null, "Analysis Colors"),
30
+ renderAllVariations()),
31
+ React.createElement("div", { className: "color_datalab" },
32
+ React.createElement("b", null, "Datalab Colors"),
33
+ renderAllVariations())));
34
+ };
35
+ //# sourceMappingURL=TextArea.stories.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TextArea.stories.js","sourceRoot":"","sources":["../../src/TextArea/TextArea.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,eAAe;IACb,KAAK,EAAE,UAAU;CAClB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,EAAE;IAC/B,MAAM,mBAAmB,GAAG,GAAG,EAAE,CAAC,CAChC;QACE,6BAAK,SAAS,EAAC,cAAc;YAC3B,6BAAK,SAAS,EAAC,QAAQ;gBACrB,oBAAC,QAAQ,IAAC,KAAK,EAAC,sBAAsB,GAAG,CACrC;YACN,6BAAK,SAAS,EAAC,QAAQ;gBACrB,oBAAC,QAAQ,IAAC,KAAK,EAAC,q7BAAq7B,GAAG,CACp8B;YACN,6BAAK,SAAS,EAAC,QAAQ;gBACrB,oBAAC,QAAQ,IAAC,WAAW,EAAC,kBAAkB,GAAG,CACvC;YACN,6BAAK,SAAS,EAAC,QAAQ;gBACrB,oBAAC,QAAQ,IAAC,KAAK,EAAC,WAAW,EAAC,QAAQ,EAAE,IAAI,GAAI,CAC1C,CACF;QAEN,6BAAK,SAAS,EAAC,yCAAyC;YACtD,6BAAK,SAAS,EAAC,QAAQ;gBACrB,oBAAC,QAAQ,IAAC,KAAK,EAAC,gBAAgB,GAAG,CAC/B;YACN,6BAAK,SAAS,EAAC,QAAQ;gBACrB,oBAAC,QAAQ,IAAC,WAAW,EAAC,kBAAkB,GAAG,CACvC;YACN,6BAAK,SAAS,EAAC,QAAQ;gBACrB,oBAAC,QAAQ,IAAC,KAAK,EAAC,WAAW,EAAC,QAAQ,EAAE,IAAI,GAAI,CAC1C,CACF,CACL,CACJ,CAAC;IACF,OAAO,CACL,6BAAK,SAAS,EAAC,iCAAiC;QAC9C,6BAAK,SAAS,EAAC,aAAa;YAC1B,8CAAmB;YAClB,mBAAmB,EAAE,CAClB;QAEN,6BAAK,SAAS,EAAC,gBAAgB;YAC7B,iDAAsB;YACrB,mBAAmB,EAAE,CAClB;QAEN,6BAAK,SAAS,EAAC,eAAe;YAC5B,gDAAqB;YACpB,mBAAmB,EAAE,CAClB,CACF,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1 @@
1
+ import '@testing-library/jest-dom';
@@ -0,0 +1,68 @@
1
+ import React from 'react';
2
+ import '@testing-library/jest-dom';
3
+ import { render, screen } from '@testing-library/react';
4
+ import userEvent from '@testing-library/user-event';
5
+ import { TextArea } from './TextArea';
6
+ describe('TextArea', () => {
7
+ class Context {
8
+ testId = 'textAreaTestId';
9
+ props = {
10
+ onChange: jest.fn(),
11
+ onKeyUp: jest.fn(),
12
+ testId: this.testId,
13
+ };
14
+ }
15
+ let tc;
16
+ beforeEach(() => {
17
+ tc = new Context();
18
+ });
19
+ const renderTextArea = (props) => render(React.createElement(TextArea, { ...props }));
20
+ it('renders the provided value', () => {
21
+ const value = 'hello, this is text for a text area.';
22
+ renderTextArea({ ...tc.props, value });
23
+ expect(screen.getByDisplayValue(value)).toBeInTheDocument();
24
+ });
25
+ it('renders the provided placeholder', () => {
26
+ const placeholder = 'Prompt to enter';
27
+ renderTextArea({ ...tc.props, placeholder });
28
+ expect(screen.getByPlaceholderText(placeholder)).toBeInTheDocument();
29
+ });
30
+ it('calls onChange handler', async () => {
31
+ renderTextArea({ ...tc.props });
32
+ await userEvent.type(screen.getByTestId(tc.testId), 'trigger');
33
+ expect(tc.props.onChange).toHaveBeenCalled();
34
+ });
35
+ it('calls the onKeyUp handler', async () => {
36
+ renderTextArea({ ...tc.props });
37
+ await userEvent.type(screen.getByTestId(tc.testId), 'trigger');
38
+ expect(tc.props.onKeyUp).toHaveBeenCalled();
39
+ });
40
+ it('respects readOnly', async () => {
41
+ renderTextArea({ ...tc.props, readonly: true });
42
+ expect(screen.getByTestId(tc.testId)).not.toBeEnabled();
43
+ });
44
+ it('provides rows', async () => {
45
+ renderTextArea({ ...tc.props, rows: 7 });
46
+ expect(screen.getByTestId(tc.testId)).toHaveProperty('rows', 7);
47
+ });
48
+ it('provides cols', async () => {
49
+ renderTextArea({ ...tc.props, cols: 8 });
50
+ expect(screen.getByTestId(tc.testId)).toHaveProperty('cols', 8);
51
+ });
52
+ it('provides name', async () => {
53
+ const name = 'myTextArea';
54
+ renderTextArea({ ...tc.props, name });
55
+ expect(screen.getByTestId(tc.testId)).toHaveProperty('name', name);
56
+ });
57
+ it('provides id', async () => {
58
+ const id = 'myTextId';
59
+ renderTextArea({ ...tc.props, id });
60
+ expect(screen.getByTestId(tc.testId)).toHaveProperty('id', id);
61
+ });
62
+ it('provides extraClassNames', async () => {
63
+ const extraClassNames = 'extra css';
64
+ renderTextArea({ ...tc.props, extraClassNames });
65
+ expect(screen.getByTestId(tc.testId)).toHaveClass(extraClassNames);
66
+ });
67
+ });
68
+ //# sourceMappingURL=TextArea.test.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TextArea.test.js","sourceRoot":"","sources":["../../src/TextArea/TextArea.test.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,28 @@
1
+ type FormControlElement = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;
2
+ export interface TextAreaProps {
3
+ /** extra class names to be placed on the TextArea component */
4
+ extraClassNames?: string;
5
+ /** id of TextArea */
6
+ id?: string;
7
+ /** name of TextArea */
8
+ name?: string;
9
+ /** function that will be called when TextArea value changes */
10
+ onChange?: React.ChangeEventHandler<FormControlElement>;
11
+ /** function that will be called on key up within the TextArea */
12
+ onKeyUp?: React.KeyboardEventHandler<FormControlElement>;
13
+ /** placeholder text displayed when TextArea is empty */
14
+ placeholder?: string;
15
+ /** set readonly to true if TextArea can not be edited */
16
+ readonly?: boolean;
17
+ /** specifies the visible number of lines in the TextArea */
18
+ rows?: number;
19
+ /** specifies the visible width of the TextArea */
20
+ cols?: number;
21
+ /** set this to true to focus the TextArea when page loads */
22
+ autofocus?: boolean;
23
+ /** id that will be used in the data-testid attribute on the TextArea */
24
+ testId?: string;
25
+ /** value of the TextArea */
26
+ value?: string | string[] | number;
27
+ }
28
+ export {};
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=TextArea.types.js.map