react-restyle-components 0.1.90 → 0.1.91

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 (114) hide show
  1. package/lib/package.json +7 -8
  2. package/package.json +7 -8
  3. package/lib/cjs/index.d.ts +0 -2
  4. package/lib/cjs/index.js +0 -18
  5. package/lib/cjs/src/App.d.ts +0 -4
  6. package/lib/cjs/src/App.js +0 -24
  7. package/lib/cjs/src/__mocks__/styleMock.d.ts +0 -1
  8. package/lib/cjs/src/__mocks__/styleMock.js +0 -2
  9. package/lib/cjs/src/core-components/atoms/buttons/button.stories.d.ts +0 -6
  10. package/lib/cjs/src/core-components/atoms/buttons/button.stories.js +0 -42
  11. package/lib/cjs/src/core-components/atoms/buttons/buttons.component.d.ts +0 -11
  12. package/lib/cjs/src/core-components/atoms/buttons/buttons.component.js +0 -15
  13. package/lib/cjs/src/core-components/atoms/check-box/checkBox.component.d.ts +0 -11
  14. package/lib/cjs/src/core-components/atoms/check-box/checkBox.component.js +0 -47
  15. package/lib/cjs/src/core-components/atoms/check-box/checkBox.stories.d.ts +0 -6
  16. package/lib/cjs/src/core-components/atoms/check-box/checkBox.stories.js +0 -26
  17. package/lib/cjs/src/core-components/atoms/date-picker/date-picker.component.d.ts +0 -13
  18. package/lib/cjs/src/core-components/atoms/date-picker/date-picker.component.js +0 -52
  19. package/lib/cjs/src/core-components/atoms/date-picker/date-picker.stories.d.ts +0 -6
  20. package/lib/cjs/src/core-components/atoms/date-picker/date-picker.stories.js +0 -24
  21. package/lib/cjs/src/core-components/atoms/form/form.component.d.ts +0 -102
  22. package/lib/cjs/src/core-components/atoms/form/form.component.js +0 -192
  23. package/lib/cjs/src/core-components/atoms/icons/icons.component.d.ts +0 -11
  24. package/lib/cjs/src/core-components/atoms/icons/icons.component.js +0 -66
  25. package/lib/cjs/src/core-components/atoms/icons/icons.stories.d.ts +0 -6
  26. package/lib/cjs/src/core-components/atoms/icons/icons.stories.js +0 -22
  27. package/lib/cjs/src/core-components/atoms/input/input-otp.component.d.ts +0 -15
  28. package/lib/cjs/src/core-components/atoms/input/input-otp.component.js +0 -88
  29. package/lib/cjs/src/core-components/atoms/input/input-pin.component.d.ts +0 -16
  30. package/lib/cjs/src/core-components/atoms/input/input-pin.component.js +0 -107
  31. package/lib/cjs/src/core-components/atoms/input/input-pin.stories.d.ts +0 -6
  32. package/lib/cjs/src/core-components/atoms/input/input-pin.stories.js +0 -23
  33. package/lib/cjs/src/core-components/atoms/input/input.component.d.ts +0 -19
  34. package/lib/cjs/src/core-components/atoms/input/input.component.js +0 -45
  35. package/lib/cjs/src/core-components/atoms/input/input.stories.d.ts +0 -6
  36. package/lib/cjs/src/core-components/atoms/input/input.stories.js +0 -24
  37. package/lib/cjs/src/core-components/atoms/input-dropdown/input-dropdown.component.d.ts +0 -11
  38. package/lib/cjs/src/core-components/atoms/input-dropdown/input-dropdown.component.js +0 -64
  39. package/lib/cjs/src/core-components/atoms/input-dropdown/input-dropdown.stories.d.ts +0 -6
  40. package/lib/cjs/src/core-components/atoms/input-dropdown/input-dropdown.stories.js +0 -20
  41. package/lib/cjs/src/core-components/atoms/loader/loader.component.d.ts +0 -4
  42. package/lib/cjs/src/core-components/atoms/loader/loader.component.js +0 -61
  43. package/lib/cjs/src/core-components/atoms/loader/loader.stories.d.ts +0 -6
  44. package/lib/cjs/src/core-components/atoms/loader/loader.stories.js +0 -16
  45. package/lib/cjs/src/core-components/atoms/radio/radio.component.d.ts +0 -10
  46. package/lib/cjs/src/core-components/atoms/radio/radio.component.js +0 -49
  47. package/lib/cjs/src/core-components/atoms/radio/radio.stories.d.ts +0 -6
  48. package/lib/cjs/src/core-components/atoms/radio/radio.stories.js +0 -25
  49. package/lib/cjs/src/core-components/atoms/stepper/stepper.component.d.ts +0 -10
  50. package/lib/cjs/src/core-components/atoms/stepper/stepper.component.js +0 -42
  51. package/lib/cjs/src/core-components/atoms/stepper/stepper.stories.d.ts +0 -6
  52. package/lib/cjs/src/core-components/atoms/stepper/stepper.stories.js +0 -21
  53. package/lib/cjs/src/core-components/atoms/tabs/tabs.component.d.ts +0 -11
  54. package/lib/cjs/src/core-components/atoms/tabs/tabs.component.js +0 -46
  55. package/lib/cjs/src/core-components/atoms/tabs/tabs.stories.d.ts +0 -6
  56. package/lib/cjs/src/core-components/atoms/tabs/tabs.stories.js +0 -25
  57. package/lib/cjs/src/core-components/atoms/timer/timer.component.d.ts +0 -7
  58. package/lib/cjs/src/core-components/atoms/timer/timer.component.js +0 -106
  59. package/lib/cjs/src/core-components/atoms/tooltip/tooltip.component.d.ts +0 -10
  60. package/lib/cjs/src/core-components/atoms/tooltip/tooltip.component.js +0 -56
  61. package/lib/cjs/src/core-components/atoms/tooltip/tooltip.stories.d.ts +0 -6
  62. package/lib/cjs/src/core-components/atoms/tooltip/tooltip.stories.js +0 -16
  63. package/lib/cjs/src/core-components/index.d.ts +0 -25
  64. package/lib/cjs/src/core-components/index.js +0 -54
  65. package/lib/cjs/src/core-components/molecules/auto-complete-filter-multiple-select-multiple-fields-display/auto-complete-filter-multiple-select-multiple-fields-display.component.d.ts +0 -18
  66. package/lib/cjs/src/core-components/molecules/auto-complete-filter-multiple-select-multiple-fields-display/auto-complete-filter-multiple-select-multiple-fields-display.component.js +0 -119
  67. package/lib/cjs/src/core-components/molecules/auto-complete-filter-multiple-select-multiple-fields-display/auto-complete-filter-multiple-select-multiple-fields-display.stories.d.ts +0 -6
  68. package/lib/cjs/src/core-components/molecules/auto-complete-filter-multiple-select-multiple-fields-display/auto-complete-filter-multiple-select-multiple-fields-display.stories.js +0 -48
  69. package/lib/cjs/src/core-components/molecules/auto-complete-filter-single-select-multiple-fields-display/auto-complete-filter-single-select-multiple-fields-display.component.d.ts +0 -17
  70. package/lib/cjs/src/core-components/molecules/auto-complete-filter-single-select-multiple-fields-display/auto-complete-filter-single-select-multiple-fields-display.component.js +0 -120
  71. package/lib/cjs/src/core-components/molecules/auto-complete-filter-single-select-multiple-fields-display/auto-complete-filter-single-select-multiple-fields-display.stories.d.ts +0 -6
  72. package/lib/cjs/src/core-components/molecules/auto-complete-filter-single-select-multiple-fields-display/auto-complete-filter-single-select-multiple-fields-display.stories.js +0 -31
  73. package/lib/cjs/src/core-components/molecules/auto-complete-group-by/auto-complete-group-by.component.d.ts +0 -10
  74. package/lib/cjs/src/core-components/molecules/auto-complete-group-by/auto-complete-group-by.component.js +0 -166
  75. package/lib/cjs/src/core-components/molecules/auto-complete-group-by/auto-complete-group-by.component.test.d.ts +0 -1
  76. package/lib/cjs/src/core-components/molecules/auto-complete-group-by/auto-complete-group-by.component.test.js +0 -14
  77. package/lib/cjs/src/core-components/molecules/auto-complete-group-by/auto-complete-group-by.stories.d.ts +0 -6
  78. package/lib/cjs/src/core-components/molecules/auto-complete-group-by/auto-complete-group-by.stories.js +0 -41
  79. package/lib/cjs/src/core-components/molecules/autocomplete/autocomplete.d.ts +0 -9
  80. package/lib/cjs/src/core-components/molecules/autocomplete/autocomplete.js +0 -146
  81. package/lib/cjs/src/core-components/molecules/autocomplete/autocomplete.spec.d.ts +0 -1
  82. package/lib/cjs/src/core-components/molecules/autocomplete/autocomplete.spec.js +0 -72
  83. package/lib/cjs/src/core-components/molecules/autocomplete/autocomplete.stories.d.ts +0 -6
  84. package/lib/cjs/src/core-components/molecules/autocomplete/autocomplete.stories.js +0 -20
  85. package/lib/cjs/src/core-components/molecules/css-multiline-input/css-multiline-input.component.d.ts +0 -12
  86. package/lib/cjs/src/core-components/molecules/css-multiline-input/css-multiline-input.component.js +0 -124
  87. package/lib/cjs/src/core-components/molecules/css-multiline-input/css-multiline-input.stories.d.ts +0 -6
  88. package/lib/cjs/src/core-components/molecules/css-multiline-input/css-multiline-input.stories.js +0 -16
  89. package/lib/cjs/src/core-components/molecules/css-multiline-input/css-properties.d.ts +0 -8931
  90. package/lib/cjs/src/core-components/molecules/css-multiline-input/css-properties.js +0 -164
  91. package/lib/cjs/src/core-components/molecules/modal-confirm/modal-confirm.component.d.ts +0 -12
  92. package/lib/cjs/src/core-components/molecules/modal-confirm/modal-confirm.component.js +0 -60
  93. package/lib/cjs/src/core-components/molecules/modal-confirm/modal-confirm.stories.d.ts +0 -6
  94. package/lib/cjs/src/core-components/molecules/modal-confirm/modal-confirm.stories.js +0 -23
  95. package/lib/cjs/src/core-components/molecules/multi-select/multi-select.component.d.ts +0 -9
  96. package/lib/cjs/src/core-components/molecules/multi-select/multi-select.component.js +0 -78
  97. package/lib/cjs/src/core-components/molecules/multi-select/multi-select.stories.d.ts +0 -6
  98. package/lib/cjs/src/core-components/molecules/multi-select/multi-select.stories.js +0 -22
  99. package/lib/cjs/src/core-components/molecules/multi-select-with-field/multi-select-with-field.component.d.ts +0 -10
  100. package/lib/cjs/src/core-components/molecules/multi-select-with-field/multi-select-with-field.component.js +0 -88
  101. package/lib/cjs/src/core-components/molecules/multi-select-with-field/multi-select-with-field.stories.d.ts +0 -6
  102. package/lib/cjs/src/core-components/molecules/multi-select-with-field/multi-select-with-field.stories.js +0 -23
  103. package/lib/cjs/src/core-utils/index.d.ts +0 -1
  104. package/lib/cjs/src/core-utils/index.js +0 -17
  105. package/lib/cjs/src/core-utils/unit-test.utils.d.ts +0 -4
  106. package/lib/cjs/src/core-utils/unit-test.utils.js +0 -16
  107. package/lib/cjs/src/index.d.ts +0 -1
  108. package/lib/cjs/src/index.js +0 -17
  109. package/lib/cjs/src/library/assets/svg/index.d.ts +0 -9
  110. package/lib/cjs/src/library/assets/svg/index.js +0 -40
  111. package/lib/cjs/src/reportWebVitals.d.ts +0 -3
  112. package/lib/cjs/src/reportWebVitals.js +0 -37
  113. package/lib/cjs/src/setupTests.d.ts +0 -1
  114. package/lib/cjs/src/setupTests.js +0 -7
@@ -1,164 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.properties = void 0;
4
- /* eslint-disable no-sparse-arrays */
5
- exports.properties = [
6
- {
7
- alignContent: [
8
- 'flex-start',
9
- 'flex-end',
10
- 'center',
11
- 'stretch',
12
- 'space-between',
13
- 'space-around',
14
- ],
15
- },
16
- { alignItems: ['flex-start', 'flex-end', 'center', 'stretch', 'baseline'] },
17
- {
18
- alignSelf: [
19
- 'auto',
20
- 'flex-start',
21
- 'flex-end',
22
- 'center',
23
- 'baseline',
24
- 'stretch',
25
- ],
26
- },
27
- { flex: ['number', 'string'] },
28
- { flexDirection: ['row', 'row-reverse', 'column', 'column-reverse'] },
29
- { flexWrap: ['nowrap', 'wrap', 'wrap-reverse'] },
30
- { flexFlow: ['number'] },
31
- { flexGrow: ['number'] },
32
- { flexShrink: ['number'] },
33
- { flexBasis: ['number', 'string'] },
34
- {
35
- justifyContent: [
36
- ,
37
- 'flex-start',
38
- 'flex-end',
39
- 'center',
40
- 'space-around',
41
- 'space-between',
42
- 'space-evenly',
43
- ],
44
- },
45
- { gap: ['number', 'string'] },
46
- { rowGap: ['number'] },
47
- { columnGap: ['number'] },
48
- // Layout
49
- { aspectRatio: ['number', 'string'] },
50
- { bottom: ['number', 'string'] },
51
- { display: ['flex', 'none'] },
52
- { left: ['number', 'string'] },
53
- { position: ['absolute', 'relative'] },
54
- { right: ['number', 'string'] },
55
- { top: ['number', 'string'] },
56
- { overflow: ['hidden'] },
57
- { zIndex: ['number', 'string'] },
58
- // Dimension
59
- { height: ['number', 'string'] },
60
- { maxHeight: ['number', 'string'] },
61
- { maxWidth: ['number', 'string'] },
62
- { minHeight: ['number', 'string'] },
63
- { minWidth: ['number', 'string'] },
64
- { width: ['number', 'string'] },
65
- // Color
66
- { backgroundColor: ['string'] },
67
- { color: ['string'] },
68
- { opacity: ['number'] },
69
- // Text
70
- { fontSize: ['number', 'string'] },
71
- { fontFamily: ['string'] },
72
- { fontStyle: ['string', 'normal'] },
73
- {
74
- fontWeight: [
75
- ,
76
- 'number',
77
- 'thin',
78
- 'hairline',
79
- 'ultralight',
80
- 'extralight',
81
- 'light',
82
- 'normal',
83
- 'medium',
84
- 'semibold',
85
- 'demibold',
86
- 'bold',
87
- 'ultrabold',
88
- 'extrabold',
89
- 'heavy',
90
- 'black',
91
- ],
92
- },
93
- { letterSpacing: ['number', 'string'] },
94
- { lineHeight: ['number', 'string'] },
95
- { maxLines: ['number'] },
96
- { textAlign: ['left', 'right', 'center', 'justify'] },
97
- {
98
- textDecoration: [
99
- ,
100
- 'line-through',
101
- 'underline',
102
- 'none',
103
- 'line-through underline',
104
- 'underline line-through',
105
- ],
106
- },
107
- { textDecorationColor: ['string'] },
108
- { textDecorationStyle: ['dashed', 'dotted', 'solid', 'string'] },
109
- { textIndent: ['any'] },
110
- { textOverflow: ['ellipsis'] },
111
- { textTransform: ['capitalize', 'lowercase', 'uppercase'] },
112
- { verticalAlign: ['sub', 'super'] },
113
- // Sizing/positioning
114
- { objectFit: ['string'] },
115
- { objectPosition: ['number', 'string'] },
116
- { objectPositionX: ['number', 'string'] },
117
- { objectPositionY: ['number', 'string'] },
118
- // Margin/padding
119
- { margin: ['number', 'string'] },
120
- { marginHorizontal: ['number', 'string'] },
121
- { marginVertical: ['number', 'string'] },
122
- { marginTop: ['number', 'string'] },
123
- { marginRight: ['number', 'string'] },
124
- { marginBottom: ['number', 'string'] },
125
- { marginLeft: ['number', 'string'] },
126
- { padding: ['number', 'string'] },
127
- { paddingHorizontal: ['number', 'string'] },
128
- { paddingVertical: ['number', 'string'] },
129
- { paddingTop: ['number', 'string'] },
130
- { paddingRight: ['number', 'string'] },
131
- { paddingBottom: ['number', 'string'] },
132
- { paddingLeft: ['number', 'string'] },
133
- // Transformations
134
- { transform: ['string'] },
135
- { transformOrigin: ['number', 'string'] },
136
- { transformOriginX: ['number', 'string'] },
137
- { transformOriginY: ['number', 'string'] },
138
- // Borders
139
- { border: ['number', 'string'] },
140
- { borderWidth: ['number', 'string'] },
141
- { borderColor: ['string'] },
142
- { borderStyle: ['dashed', 'dotted', 'solid'] },
143
- { borderTop: ['number', 'string'] },
144
- { borderTopColor: ['string'] },
145
- { borderTopStyle: ['dashed', 'dotted', 'solid'] },
146
- { borderTopWidth: ['number', 'string'] },
147
- { borderRight: ['number', 'string'] },
148
- { borderRightColor: ['string'] },
149
- { borderRightStyle: ['dashed', 'dotted', 'solid'] },
150
- { borderRightWidth: ['number', 'string'] },
151
- { borderBottom: ['number', 'string'] },
152
- { borderBottomColor: ['string'] },
153
- { borderBottomStyle: ['dashed', 'dotted', 'solid'] },
154
- { borderBottomWidth: ['number', 'string'] },
155
- { borderLeft: ['number', 'string'] },
156
- { borderLeftColor: ['string'] },
157
- { borderLeftStyle: ['dashed', 'dotted', 'solid'] },
158
- { borderLeftWidth: ['number', 'string'] },
159
- { borderTopLeftRadius: ['number', 'string'] },
160
- { borderTopRightRadius: ['number', 'string'] },
161
- { borderBottomRightRadius: ['number', 'string'] },
162
- { borderBottomLeftRadius: ['number', 'string'] },
163
- { borderRadius: ['number', 'string'] },
164
- ];
@@ -1,12 +0,0 @@
1
- import React from 'react';
2
- interface ModalConfirmProps {
3
- visible: boolean;
4
- title?: string;
5
- message: string;
6
- submitTitle?: string;
7
- closeTitle?: string;
8
- onClick: () => void;
9
- onClose: () => void;
10
- }
11
- export declare const ModalConfirm: ({ visible, title, message, submitTitle, closeTitle, onClick, onClose, }: ModalConfirmProps) => React.JSX.Element;
12
- export {};
@@ -1,60 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || function (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
- Object.defineProperty(exports, "__esModule", { value: true });
26
- exports.ModalConfirm = void 0;
27
- const react_1 = __importStar(require("react"));
28
- const reactstrap_1 = require("reactstrap");
29
- const ModalConfirm = ({ visible = false, title = 'Confirm', message = '', submitTitle = 'Send', closeTitle = 'Close', onClick, onClose, }) => {
30
- const [showModal, setShowModal] = (0, react_1.useState)(visible);
31
- (0, react_1.useEffect)(() => {
32
- setShowModal(visible);
33
- // eslint-disable-next-line react-hooks/exhaustive-deps
34
- }, [visible]);
35
- return (react_1.default.createElement(react_1.default.Fragment, null,
36
- react_1.default.createElement(reactstrap_1.Container, null, showModal && (react_1.default.createElement(react_1.default.Fragment, null,
37
- react_1.default.createElement("div", { className: "flex justify-center items-center overflow-x-hidden overflow-y-auto fixed inset-0 z-50 outline-none focus:outline-none " },
38
- react_1.default.createElement("div", { className: "relative my-6 mx-auto " },
39
- react_1.default.createElement("div", { className: "border-0 rounded-lg shadow-lg relative flex flex-col w-fit min-w-80 bg-white outline-none focus:outline-none" },
40
- react_1.default.createElement("div", { className: "flex items-center justify-between p-2 border-b border-solid border-gray-300 rounded-t" },
41
- react_1.default.createElement("h3", { className: "text-2xl font-semibold" }, title),
42
- react_1.default.createElement("button", { className: "p-1 border-0 text-black opacity-1 ml-6 float-right text-3xl leading-none font-semibold outline-none focus:outline-none", onClick: () => {
43
- setShowModal(false);
44
- onClose && onClose();
45
- } },
46
- react_1.default.createElement("span", { className: " text-black h-6 w-6 text-2xl block outline-none focus:outline-none" }, "\u00D7"))),
47
- react_1.default.createElement("div", { className: "flex p-2" },
48
- react_1.default.createElement("div", { className: "flex" },
49
- react_1.default.createElement("span", { className: "text-md" }, message))),
50
- react_1.default.createElement("div", { className: "flex items-center justify-end p-2 border-t border-solid border-gray-300 rounded-b" },
51
- react_1.default.createElement("button", { className: "text-red-500 background-transparent font-bold uppercase p-2 text-sm outline-none focus:outline-none mr-1 mb-1", type: "button", style: { transition: 'all .15s ease' }, onClick: () => {
52
- setShowModal(false);
53
- onClose && onClose();
54
- } }, closeTitle),
55
- react_1.default.createElement("button", { className: "bg-green-500 text-white active:bg-green-600 font-bold uppercase text-sm p-2 rounded shadow hover:shadow-lg outline-none focus:outline-none mr-1 mb-1", type: "button", style: { transition: 'all .15s ease' }, onClick: () => {
56
- onClick();
57
- } }, submitTitle))))),
58
- react_1.default.createElement("div", { className: "opacity-25 fixed inset-0 z-40 bg-black" }))))));
59
- };
60
- exports.ModalConfirm = ModalConfirm;
@@ -1,6 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/react';
2
- import { ModalConfirm } from './modal-confirm.component';
3
- declare const meta: Meta<typeof ModalConfirm>;
4
- export default meta;
5
- type Story = StoryObj<typeof ModalConfirm>;
6
- export declare const Primary: Story;
@@ -1,23 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.Primary = void 0;
4
- const modal_confirm_component_1 = require("./modal-confirm.component");
5
- const meta = {
6
- title: 'Design System/Molecules/ModalConfirm',
7
- component: modal_confirm_component_1.ModalConfirm,
8
- tags: ['autodocs'],
9
- parameters: {
10
- componentSubtitle: `import { ModalConfirm } from 'react-restyle-components'`,
11
- },
12
- };
13
- exports.default = meta;
14
- exports.Primary = {
15
- args: {
16
- visible: true,
17
- title: 'Confirm',
18
- message: 'Are you sure delete?',
19
- submitTitle: 'Submit',
20
- onClick: () => { },
21
- onClose: () => { },
22
- },
23
- };
@@ -1,9 +0,0 @@
1
- import React from 'react';
2
- interface MultiSelectProps {
3
- options: Array<string>;
4
- selectedItems?: Array<string>;
5
- hasError?: boolean;
6
- onSelect: (item: any) => any;
7
- }
8
- export declare const MultiSelect: ({ options, selectedItems, hasError, onSelect, }: MultiSelectProps) => React.JSX.Element;
9
- export {};
@@ -1,78 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || function (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
- Object.defineProperty(exports, "__esModule", { value: true });
26
- exports.MultiSelect = void 0;
27
- const react_1 = __importStar(require("react"));
28
- const MultiSelect = ({ options = [], selectedItems = [], hasError = false, onSelect, }) => {
29
- const [selectedOptions, setSelectedOptions] = (0, react_1.useState)([]);
30
- const [isListOpen, setIsListOpen] = (0, react_1.useState)(false);
31
- const useOutsideAlerter = (ref) => {
32
- (0, react_1.useEffect)(() => {
33
- function handleClickOutside(event) {
34
- if (ref.current && !ref.current.contains(event.target) && isListOpen) {
35
- setIsListOpen(false);
36
- }
37
- }
38
- document.addEventListener('mousedown', handleClickOutside);
39
- return () => {
40
- document.removeEventListener('mousedown', handleClickOutside);
41
- };
42
- }, [ref, isListOpen]);
43
- };
44
- (0, react_1.useEffect)(() => {
45
- setSelectedOptions(selectedItems);
46
- }, [selectedItems]);
47
- const wrapperRef = (0, react_1.useRef)(null);
48
- useOutsideAlerter(wrapperRef);
49
- return (react_1.default.createElement(react_1.default.Fragment, null,
50
- react_1.default.createElement("div", { className: `flex dark:bg-boxdark dark:text-white flex-col w-full rounded-md border-2 ${hasError ? 'border-red ' : 'border-gray-300'}`, ref: wrapperRef },
51
- react_1.default.createElement("span", { className: "p-2 mt-1 shadow-sm", onClick: () => {
52
- setIsListOpen(!isListOpen);
53
- } }, selectedOptions?.length > 0 ? selectedOptions?.join(',') : 'Select'),
54
- react_1.default.createElement("div", { className: `flex mx-2 ${isListOpen ? `show` : `hidden`}` }, options
55
- ? options?.length > 0 && (react_1.default.createElement("ul", null, options?.map((item, index) => (react_1.default.createElement("li", { key: index, className: "flex items-center text-center" },
56
- react_1.default.createElement("input", { className: "bg-black", type: "checkbox", checked: selectedOptions?.includes(item), onChange: () => {
57
- if (selectedOptions?.includes(item)) {
58
- setSelectedOptions(selectedOptions?.filter((e) => e != item));
59
- }
60
- else {
61
- if (selectedOptions?.length > 0) {
62
- setSelectedOptions(selectedOptions?.concat([item]));
63
- }
64
- else {
65
- setSelectedOptions([item]);
66
- }
67
- }
68
- }, onBlur: () => {
69
- if (!isListOpen)
70
- onSelect(selectedOptions);
71
- } }),
72
- ' ',
73
- react_1.default.createElement("label", { className: "ml-3 mt-2 pt-1 dark:text-white" },
74
- ' ',
75
- item))))))
76
- : null))));
77
- };
78
- exports.MultiSelect = MultiSelect;
@@ -1,6 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/react';
2
- import { MultiSelect } from './multi-select.component';
3
- declare const meta: Meta<typeof MultiSelect>;
4
- export default meta;
5
- type Story = StoryObj<typeof MultiSelect>;
6
- export declare const Primary: Story;
@@ -1,22 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.Primary = void 0;
4
- const multi_select_component_1 = require("./multi-select.component");
5
- const meta = {
6
- title: 'Design System/Molecules/MultiSelect',
7
- component: multi_select_component_1.MultiSelect,
8
- tags: ['autodocs'],
9
- parameters: {
10
- componentSubtitle: `import { MultiSelect } from 'react-restyle-components'`,
11
- },
12
- };
13
- exports.default = meta;
14
- exports.Primary = {
15
- args: {
16
- options: ['UPI', 'CARD', 'CASH'],
17
- selectedItems: ['CASH', 'UPI'],
18
- onSelect: (item) => {
19
- console.log({ item });
20
- },
21
- },
22
- };
@@ -1,10 +0,0 @@
1
- import React from 'react';
2
- interface MultiSelectWithFieldProps {
3
- displayField: string;
4
- options: Array<any>;
5
- selectedItems?: Array<any>;
6
- hasError?: boolean;
7
- onSelect: (item: any) => any;
8
- }
9
- export declare const MultiSelectWithField: ({ displayField, options, selectedItems, hasError, onSelect, }: MultiSelectWithFieldProps) => React.JSX.Element;
10
- export {};
@@ -1,88 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || function (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
- var __importDefault = (this && this.__importDefault) || function (mod) {
26
- return (mod && mod.__esModule) ? mod : { "default": mod };
27
- };
28
- Object.defineProperty(exports, "__esModule", { value: true });
29
- exports.MultiSelectWithField = void 0;
30
- /* eslint-disable */
31
- const react_1 = __importStar(require("react"));
32
- const lodash_1 = __importDefault(require("lodash"));
33
- const MultiSelectWithField = ({ displayField = '', options = [], selectedItems = [], hasError = false, onSelect, }) => {
34
- const [selectedOptions, setSelectedOptions] = (0, react_1.useState)([]);
35
- const [isListOpen, setIsListOpen] = (0, react_1.useState)(false);
36
- const useOutsideAlerter = ref => {
37
- (0, react_1.useEffect)(() => {
38
- function handleClickOutside(event) {
39
- if (ref.current && !ref.current.contains(event.target) && isListOpen) {
40
- setIsListOpen(false);
41
- }
42
- }
43
- document.addEventListener('mousedown', handleClickOutside);
44
- return () => {
45
- document.removeEventListener('mousedown', handleClickOutside);
46
- };
47
- }, [ref, isListOpen]);
48
- };
49
- (0, react_1.useEffect)(() => {
50
- setSelectedOptions(selectedItems);
51
- }, [selectedItems]);
52
- const wrapperRef = (0, react_1.useRef)(null);
53
- useOutsideAlerter(wrapperRef);
54
- return (react_1.default.createElement(react_1.default.Fragment, null,
55
- react_1.default.createElement("div", { className: `flex dark:bg-boxdark dark:text-white flex-col w-full rounded-md border-2 ${hasError ? 'border-red ' : 'border-gray-300'}`, ref: wrapperRef },
56
- react_1.default.createElement("span", { className: 'p-2 mt-1 shadow-sm', onClick: () => {
57
- setIsListOpen(!isListOpen);
58
- } }, selectedOptions?.length > 0
59
- ? `${selectedOptions?.length} Items`
60
- : 'Select'),
61
- react_1.default.createElement("div", { className: `flex mx-2 ${isListOpen ? `show` : `hidden`}` }, options
62
- ? options?.length > 0 && (react_1.default.createElement("ul", { className: 'flex flex-col gap-1 p-2' }, options?.map((item, index) => (react_1.default.createElement("li", { key: index, className: 'flex items-center' },
63
- react_1.default.createElement("input", { className: 'flex bg-black', type: 'checkbox', checked: !lodash_1.default.isEmpty(selectedOptions?.find(e => e[displayField]?.toUpperCase() ==
64
- item[displayField]?.toUpperCase()))
65
- ? true
66
- : false, onChange: () => {
67
- if (!lodash_1.default.isEmpty(selectedOptions?.find(e => e[displayField]?.toUpperCase() ==
68
- item[displayField]?.toUpperCase()))) {
69
- setSelectedOptions(selectedOptions?.filter(e => e[displayField]?.toUpperCase() !=
70
- item[displayField]?.toUpperCase()));
71
- }
72
- else {
73
- if (selectedOptions?.length > 0) {
74
- setSelectedOptions(selectedOptions?.concat([item]));
75
- }
76
- else {
77
- setSelectedOptions([item]);
78
- }
79
- }
80
- }, onBlur: () => {
81
- if (!isListOpen)
82
- onSelect(selectedOptions);
83
- } }),
84
- ' ',
85
- react_1.default.createElement("span", { className: 'flex ml-2 dark:text-white text-center' }, item[displayField]))))))
86
- : null))));
87
- };
88
- exports.MultiSelectWithField = MultiSelectWithField;
@@ -1,6 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/react';
2
- import { MultiSelectWithField } from './multi-select-with-field.component';
3
- declare const meta: Meta<typeof MultiSelectWithField>;
4
- export default meta;
5
- type Story = StoryObj<typeof MultiSelectWithField>;
6
- export declare const Primary: Story;
@@ -1,23 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.Primary = void 0;
4
- const multi_select_with_field_component_1 = require("./multi-select-with-field.component");
5
- const meta = {
6
- title: 'Design System/Molecules/MultiSelectWithField',
7
- component: multi_select_with_field_component_1.MultiSelectWithField,
8
- tags: ['autodocs'],
9
- parameters: {
10
- componentSubtitle: `import { MultiSelectWithField } from 'react-restyle-components'`,
11
- },
12
- };
13
- exports.default = meta;
14
- exports.Primary = {
15
- args: {
16
- displayField: 'code',
17
- options: [{ code: 'UPI' }, { code: 'CARD' }, { code: 'CASH' }],
18
- selectedItems: [{ code: 'CASH' }],
19
- onSelect: (item) => {
20
- console.log({ item });
21
- },
22
- },
23
- };
@@ -1 +0,0 @@
1
- export * from './unit-test.utils';
@@ -1,17 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
- for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
- };
16
- Object.defineProperty(exports, "__esModule", { value: true });
17
- __exportStar(require("./unit-test.utils"), exports);
@@ -1,4 +0,0 @@
1
- import React from 'react';
2
- declare const Providers: ({ children }: any) => React.JSX.Element;
3
- declare const render: any;
4
- export { render, Providers };
@@ -1,16 +0,0 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.Providers = exports.render = void 0;
7
- const react_1 = __importDefault(require("react"));
8
- const react_2 = require("@testing-library/react");
9
- const Providers = ({ children }) => {
10
- return react_1.default.createElement("div", null, children);
11
- };
12
- exports.Providers = Providers;
13
- const render = (Component) => {
14
- return (0, react_2.render)(Component, { wrapper: Providers });
15
- };
16
- exports.render = render;
@@ -1 +0,0 @@
1
- import './index.css';
@@ -1,17 +0,0 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- const react_1 = __importDefault(require("react"));
7
- const client_1 = __importDefault(require("react-dom/client"));
8
- require("./index.css");
9
- const App_1 = __importDefault(require("./App"));
10
- const reportWebVitals_1 = __importDefault(require("./reportWebVitals"));
11
- const root = client_1.default.createRoot(document.getElementById('root'));
12
- root.render(react_1.default.createElement(react_1.default.StrictMode, null,
13
- react_1.default.createElement(App_1.default, null)));
14
- // If you want to start measuring performance in your app, pass a function
15
- // to log results (for example: reportWebVitals(console.log))
16
- // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
17
- (0, reportWebVitals_1.default)();
@@ -1,9 +0,0 @@
1
- import UnCheckbox from './unCheckbox.svg';
2
- import CheckedBox from './checkedBox.svg';
3
- import DatePickerSvg from './datePicker.svg';
4
- import CheckedRadio from './checkedRadio.svg';
5
- import UncheckRadio from './uncheckRadio.svg';
6
- import TimerSVG from './timer.svg';
7
- import UpArrow from './UpArrow.svg';
8
- import DownArrow from './DownArrow.svg';
9
- export { UnCheckbox, CheckedBox, DatePickerSvg, CheckedRadio, UncheckRadio, TimerSVG, UpArrow, DownArrow, };
@@ -1,40 +0,0 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.DownArrow = exports.UpArrow = exports.TimerSVG = exports.UncheckRadio = exports.CheckedRadio = exports.DatePickerSvg = exports.CheckedBox = exports.UnCheckbox = void 0;
7
- const unCheckbox_svg_1 = __importDefault(require("./unCheckbox.svg"));
8
- exports.UnCheckbox = unCheckbox_svg_1.default;
9
- const checkedBox_svg_1 = __importDefault(require("./checkedBox.svg"));
10
- exports.CheckedBox = checkedBox_svg_1.default;
11
- const datePicker_svg_1 = __importDefault(require("./datePicker.svg"));
12
- exports.DatePickerSvg = datePicker_svg_1.default;
13
- const checkedRadio_svg_1 = __importDefault(require("./checkedRadio.svg"));
14
- exports.CheckedRadio = checkedRadio_svg_1.default;
15
- const uncheckRadio_svg_1 = __importDefault(require("./uncheckRadio.svg"));
16
- exports.UncheckRadio = uncheckRadio_svg_1.default;
17
- const timer_svg_1 = __importDefault(require("./timer.svg"));
18
- exports.TimerSVG = timer_svg_1.default;
19
- const UpArrow_svg_1 = __importDefault(require("./UpArrow.svg"));
20
- exports.UpArrow = UpArrow_svg_1.default;
21
- const DownArrow_svg_1 = __importDefault(require("./DownArrow.svg"));
22
- exports.DownArrow = DownArrow_svg_1.default;
23
- // import {ReactComponent as UnCheckbox} from '../../../library/assets/svg/unCheckbox.svg';
24
- // import {ReactComponent as CheckedBox} from '../../../library/assets/svg/checkedBox.svg';
25
- // import {ReactComponent as DatePickerSvg} from '../../../library/assets/svg/datePicker.svg';
26
- // import {ReactComponent as CheckedRadio} from '../../../library/assets/svg/checkedRadio.svg';
27
- // import {ReactComponent as UncheckRadio} from '../../../library/assets/svg/uncheckRadio.svg';
28
- // import {ReactComponent as TimerSVG} from '../../../library/assets/svg/timer.svg';
29
- // import {ReactComponent as UpArrow} from '../../../library/assets/svg/UpArrow.svg';
30
- // import {ReactComponent as DownArrow} from '../../../library/assets/svg/DownArrow.svg';
31
- // export {
32
- // UnCheckbox,
33
- // CheckedBox,
34
- // DatePickerSvg,
35
- // CheckedRadio,
36
- // UncheckRadio,
37
- // TimerSVG,
38
- // UpArrow,
39
- // DownArrow,
40
- // };
@@ -1,3 +0,0 @@
1
- import { ReportHandler } from 'web-vitals';
2
- declare const reportWebVitals: (onPerfEntry?: ReportHandler) => void;
3
- export default reportWebVitals;